优化报废图片展示问题

sgzb-ui/src/components/ImagePreview/index.vue

@@ -1,82 +1,88 @@
 <template>
-  <el-image
+    <el-image
-    :src="`${realSrc}`"
+        :src="`${realSrc}`"
-    fit="cover"
+        fit="cover"
-    :style="`width:${realWidth};height:${realHeight};`"
+        :style="`width:${realWidth};height:${realHeight};`"
-    :preview-src-list="realSrcList"
+        :preview-src-list="realSrcList"
-  >
+    >
-    <div slot="error" class="image-slot">
+        <div slot="error" class="image-slot">
-      <i class="el-icon-picture-outline"></i>
+            <i class="el-icon-picture-outline"></i>
-    </div>
+        </div>
-  </el-image>
+    </el-image>
 </template>
 
 <script>
 export default {
-  name: "ImagePreview",
+    name: 'ImagePreview',
-  props: {
+    props: {
-    src: {
+        src: {
-      type: String,
+            type: String,
-      default: ""
+            default: '',
+        },
+        width: {
+            type: [Number, String],
+            default: '',
+        },
+        height: {
+            type: [Number, String],
+            default: '',
+        },
     },
-    width: {
+    computed: {
-      type: [Number, String],
+        realSrc() {
-      default: ""
+            if (!this.src) {
+                return
+            }
+            let real_src = this.src.split(',')[0]
+
+            console.log(this.src, '图片地址--')
+            return real_src
+        },
+        realSrcList() {
+            if (!this.src) {
+                return
+            }
+            let real_src_list = this.src.split(',')
+            let srcList = []
+            real_src_list.forEach((item) => {
+                return srcList.push(item)
+            })
+            return srcList
+        },
+        realWidth() {
+            return typeof this.width == 'string'
+                ? this.width
+                : `${this.width}px`
+        },
+        realHeight() {
+            return typeof this.height == 'string'
+                ? this.height
+                : `${this.height}px`
+        },
     },
-    height: {
+}
-      type: [Number, String],
-      default: ""
-    }
-  },
-  computed: {
-    realSrc() {
-      if (!this.src) {
-        return;
-      }
-      let real_src = this.src.split(",")[0];
-      return real_src;
-    },
-    realSrcList() {
-      if (!this.src) {
-        return;
-      }
-      let real_src_list = this.src.split(",");
-      let srcList = [];
-      real_src_list.forEach(item => {
-        return srcList.push(item);
-      });
-      return srcList;
-    },
-    realWidth() {
-      return typeof this.width == "string" ? this.width : `${this.width}px`;
-    },
-    realHeight() {
-      return typeof this.height == "string" ? this.height : `${this.height}px`;
-    }
-  },
-};
 </script>
 
 <style lang="scss" scoped>
 .el-image {
-  border-radius: 5px;
+    border-radius: 5px;
-  background-color: #ebeef5;
+    background-color: #ebeef5;
-  box-shadow: 0 0 5px 1px #ccc;
+    box-shadow: 0 0 5px 1px #ccc;
-  ::v-deep .el-image__inner {
+    ::v-deep .el-image__inner {
-    transition: all 0.3s;
+        transition: all 0.3s;
-    cursor: pointer;
+        cursor: pointer;
-    &:hover {
+        &:hover {
-      transform: scale(1.2);
+            transform: scale(1.2);
+        }
+    }
+    ::v-deep .image-slot {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        width: 100%;
+        height: 100%;
+        color: #909399;
+        font-size: 30px;
     }
-  }
-  ::v-deep .image-slot {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    width: 100%;
-    height: 100%;
-    color: #909399;
-    font-size: 30px;
-  }
 }
 </style>

sgzb-ui/src/views/claimAndreturn/return/receive/component/handlePage.vue

@@ -510,7 +510,7 @@
                         </el-button>
                     </el-col>
                 </el-row>
-                <el-table v-loading="loading" :data="numList" height="500">
+                <el-table v-loading="loading" :data="numList">
                     <el-table-column label="序号" align="center" type="index" />
                     <el-table-column
                         label="类型名称"
@@ -539,7 +539,7 @@
                         <template slot-scope="scope">
                             <el-input
                                 v-model.number="scope.row.qualifiedNum"
-                                placeholder="请输入合格数量"
+                                placeholder="合格数量"
                                 type="number"
                                 :min="0"
                                 clearable
@@ -557,7 +557,7 @@
                         <template slot-scope="scope">
                             <el-input
                                 v-model.number="scope.row.serviceNum"
-                                placeholder="请输入待维修数量"
+                                placeholder="待维修数量"
                                 type="number"
                                 :min="0"
                                 clearable
@@ -574,7 +574,7 @@
                         <template slot-scope="scope">
                             <el-input
                                 v-model.number="scope.row.scrapNum"
-                                placeholder="请输入待报废数量"
+                                placeholder="待报废数量"
                                 type="number"
                                 :min="0"
                                 clearable
@@ -583,6 +583,19 @@
                             />
                         </template>
                     </el-table-column>
+
+                    <!-- 6.17新增 报废原因等填写 -->
+                    <el-table-column label="报废信息" align="center">
+                        <template slot-scope="{ row }">
+                            <el-button
+                                type="primary"
+                                size="mini"
+                                :disabled="row.scrapNum <= 0"
+                                >编 辑</el-button
+                            >
+                        </template>
+                    </el-table-column>
+
                     <!-- <el-table-column label="报废信息" align="center" prop="" :show-overflow-tooltip="true" /> -->
                 </el-table>
             </div>

sgzb-ui/src/views/scrapManage/component/scrapImg.vue

@@ -11,7 +11,7 @@
         <ImagePreview
             v-for="(item, index) in scrapImgList"
             :key="index"
-            :src="item"
+            :src="`${impViewUrl}${item}`"
             :width="`20px`"
             :height="`20px`"
             class="img-box"
@@ -22,7 +22,10 @@
 <script>
 export default {
     props: {
-        scrapImgUrl: {},
+        scrapImgUrl: {
+            type: String,
+            default: () => null,
+        },
     },
     data() {
         return {
@@ -31,14 +34,14 @@ export default {
         }
     },
     mounted() {
-        let imgList = []
+        // let imgList = []
         if (this.scrapImgUrl) {
-            imgList = this.scrapImgUrl.split(',')
+            this.scrapImgList = this.scrapImgUrl.split(',')
         }
 
-        this.scrapImgList = imgList.map(
+        // this.scrapImgList = imgList.map(
-            (item) => (item = this.impViewUrl + item),
+        //     (item) => (item = this.impViewUrl + item),
-        )
+        // )
     },
 }
 </script>