安检照片修改

huaxin-web/src/views/checktask/task/components/CoverPhotoView.vue

@@ -16,7 +16,17 @@
     :close-on-click-modal="false"
   >
     <div class="flex flex-w bb">
-      <div class="item" v-for="photo in meterImg" :key="photo.key">
+      <el-image
+        v-if="imageList"
+        v-for="img in imageList"
+        :src="img"
+        :preview-src-list="[img]"
+        :z-index="9999"
+        class="picture"
+      />
+      <div class="error" v-else>暂无图片</div>
+      <!-- <div class="item" v-for="photo in meterImg" :key="photo.key">
+
          <div class="view-label">
            {{ photo.label?photo.label:photo.name }}
          </div>
@@ -37,7 +47,7 @@
            </MyImage>
          </div>
          <div class="error" v-else>暂无图片</div>
-      </div>
+      </div>-->
     </div>
   </el-dialog>
 </template>
@@ -60,11 +70,29 @@ export default {
         },
       ],
       open: false,
+      imageList: []
     };
   },
   methods: {
     viewCoverPhoto(meterImg) {
-      this.meterImg = JSON.parse(meterImg);
+      this.imageList = [];
+      if(meterImg){
+        var meterImgJsonArr = JSON.parse(meterImg);
+        meterImgJsonArr.forEach(item =>{
+          if(item.img){
+            var imgs= item.img.split(',');
+            if(imgs){
+              this.imageList.push(...imgs)
+            }
+          }
+          if(item.src){
+            var imgs= item.img.split(',');
+            if(imgs){
+              this.imageList.push(...imgs)
+            }
+          }
+        })
+      }
       this.open = true;
     },
   },
@@ -83,8 +111,8 @@ export default {
 //   margin: 3px;
 // }
 .item{
-  width: 200px;
   margin-bottom:30px;
+  display: flex;
 }
 .error {
   width: 130px;
@@ -93,4 +121,10 @@ export default {
   line-height: 139px;
   background: #f5f7fa;
 }
+
+.picture {
+  width: 130px;
+  height: 130px;
+  margin: 2px;
+}
 </style>