feat(wms/coil): 添加缺陷图片上传与展示功能

1. 新增ImageUpload组件支持url模式绑定
2. 在异常表单中添加主缺陷对应的图片上传控件
3. 在异常表格和管理页面中新增缺陷图片展示列
4. 同步更新表单数据默认值与表格初始化逻辑

klp-ui/src/components/ImageUpload/index.vue

@@ -49,6 +49,12 @@ import { listByIds, delOss } from "@/api/system/oss";
 export default {
   props: {
     value: [String, Object, Array],
+    // 值模式: 'ossId' - v-model绑定ossId字符串（默认）, 'url' - v-model绑定url字符串
+    valueMode: {
+      type: String,
+      default: 'ossId',
+      validator: (val) => ['ossId', 'url'].includes(val)
+    },
     // 图片数量限制
     limit: {
       type: Number,
@@ -89,19 +95,26 @@ export default {
     value: {
       async handler(val) {
         if (val) {
-          // 首先将值转为数组
           let list;
           if (Array.isArray(val)) {
             list = val;
           } else {
-            await listByIds(val).then(res => {
-              list = res.data;
-            })
+            if (this.valueMode === 'url') {
+              list = val.split(',').filter(url => url).map(url => {
+                return { name: url.slice(url.lastIndexOf('/') + 1), url: url };
+              });
+            } else {
+              await listByIds(val).then(res => {
+                list = res.data;
+              })
+            }
           }
-          // 然后将数组转为对象数组
           this.fileList = list.map(item => {
-            // 此处name使用ossId 防止删除出现重名
-            item = { name: item.ossId, url: item.url, ossId: item.ossId };
+            if (this.valueMode === 'url') {
+              item = { name: item.url.slice(item.url.lastIndexOf('/') + 1), url: item.url };
+            } else {
+              item = { name: item.ossId, url: item.url, ossId: item.ossId };
+            }
             return item;
           });
         } else {
@@ -172,8 +185,10 @@ export default {
     handleDelete(file) {
       const findex = this.fileList.map(f => f.name).indexOf(file.name);
       if(findex > -1) {
-        let ossId = this.fileList[findex].ossId;
-        delOss(ossId);
+        if (this.valueMode === 'ossId') {
+          let ossId = this.fileList[findex].ossId;
+          delOss(ossId);
+        }
         this.fileList.splice(findex, 1);
         this.$emit("input", this.listToString(this.fileList));
       }
@@ -203,8 +218,12 @@ export default {
       let strs = "";
       separator = separator || ",";
       for (let i in list) {
-        if (list[i].ossId) {
-          strs += list[i].ossId + separator;
+        if (this.valueMode === 'url') {
+          strs += list[i].url + separator;
+        } else {
+          if (list[i].ossId) {
+            strs += list[i].ossId + separator;
+          }
         }
       }
       return strs != "" ? strs.substr(0, strs.length - 1) : "";