新增图片预览修复

src/views/aftersales/aftersalesWorkOrderAdd.vue

@@ -454,8 +454,16 @@
         <el-icon><Plus /></el-icon>
       </el-upload>
 
-      <el-dialog v-model="dialogVisible">
+      <el-dialog v-model="dialogImgList" width="30%">
-        <img w-full :src="dialogImageUrl" alt="图片" />
+        <el-image
+          :src="amplifyurl"
+          :zoom-rate="1.2"
+          :max-scale="7"
+          :min-scale="0.2"
+          :preview-src-list="amplifysrcList"
+          :initial-index="4"
+          fit="cover"
+        />
       </el-dialog>
     </div>
 
@@ -587,6 +595,9 @@ const dialogHistoricalPackage = ref(false); //历史包件弹窗
 const HistoricalPackageList = ref([]); //历史包件数组
 const HistorIndex = ref(0); //历史包件索引
 const NumberPackages = ref(0); //包件个数
+const dialogImgList = ref(false); //图片预览弹窗
+const amplifyurl = ref(''); //当前点击的图片
+const amplifysrcList = ref([]); //图片循环列表
 const PackageInfo = ref([
   //包件信息
   { packageCode: '', orderCode: '', waybillNumber: '', brandName: '' },
@@ -640,11 +651,9 @@ const doubledCount = computed(() => {
 const ImgSuccess = (response, uploadFile) => {
   if (response.success === true) {
     console.log(response);
-    // Indexform.value['packList'].push({
-    //   name: response.data.originalName,
-    //   url: response.data.link,
-    // });
     console.log(Indexform.value['packList'], '图片列表');
+    amplifysrcList.value.push(response.data.link);
+    
   }
 };
 
@@ -663,10 +672,14 @@ const beforeAvatarUpload = rawFile => {
 // 点击图片列表回调
 const pictureList = val => {
   console.log(val, '图片列表');
+  dialogImgList.value=true;
+  console.log(val, '图片列表');
+  amplifyurl.value=val.url;
 };
 // 点击图片移除
 const ImgListRemove = val => {
   console.log(val, '移除图片');
+  amplifysrcList.value = amplifysrcList.value.filter(item => item !== val.response.data.link);
 };
 // 处理方和责任方获取数据
 const handle = () => {