1、设备数据图片上传优化

2、材料信息图片上传优化

components/equData/eqDataForm.vue

@@ -52,10 +52,11 @@
                         ref="ImageUpload"
                         :is-show="isReadonly"
                         :data="uploadDate"
+                        @handleImageRemove="handleImageRemove"
                         @uploadSuccess="uploadSuccess"
                         @uploadChange="uploadChange"
                         :maxSize="9"
-                        :fileList="uploadOption.imgList"
+                        :imageList="uploadOption.imgList"
                         type="file"></imagesUpload>
                 </el-form-item>
                 <el-form-item label="材料选择">
@@ -222,16 +223,9 @@ export default {
             this.queryLaboratoryInfo();
             if (this.mode === 'details') {
                 this.form = this.currentEquData;
-                console.log(this.form, 'currentEquData');
                 let { images } = this.form;
                 //图片填充
-                if (images && images.length > 0) {
+                this.uploadOption.imgList = images;
-                    this.uploadOption.imgList = images.map((item, index) => {
-                        return {
-                            url: item, // 控件展示的图片用压缩版本
-                        };
-                    });
-                }
                 //图表数据填充
                 if (this.form.data && this.form.data.length > 0) {
                     this.$nextTick(() => {
@@ -312,10 +306,16 @@ export default {
         handleAddTag() {
             this.tagSelect.visible = true;
         },
+        handleImageRemove(artImages) {
+            //进行了删除图片的操作
+            this.form.images = artImages.map((artImage) => {
+                return artImage['url'];
+            });
+        },
         //图片上传完成
         uploadSuccess(data) {
             this.form['images'] = data.map((item) => {
-                return item['imgPath'];
+                return item['url'];
             });
             this.handleSubmit();
         },

equipmentData.js

@@ -2,6 +2,7 @@ import { formatterMillisecond } from './utils/date';
 import { EditTask } from './artUtil';
 import { artApi } from './artApi';
 import ArtSystem from './artSystem';
+import ArtImage from './artImage';
 
 class EquipmentData {
     constructor(params) {
@@ -11,7 +12,12 @@ class EquipmentData {
         this.id = params.id;
         this.name = params.name;
         this.equipmentId = params.equipment_id;
-        this.images = params.images;
+        this.images = [];
+        if (params.images) {
+            this.images = params.images.map((url) => {
+                return new ArtImage(url);
+            });
+        }
         this.geometry = params.geometry;
         this.data = params.data;
         this.materialId = params.material_id || null;

material.js

@@ -1,58 +1,64 @@
-import { EditTask } from "./artUtil.js";
+import { EditTask } from './artUtil.js';
-import { artApi } from "./artApi";
+import { artApi } from './artApi';
+import ArtImage from './artImage';
 
 class Material {
-  constructor(params) {
+    constructor(params) {
-    if (!params) {
+        if (!params) {
-      params = {};
+            params = {};
+        }
+        this.id = params.id;
+        this.name = params.name;
+        this.description = params.description;
+        this.images = [];
+        if (params.images) {
+            this.images = params.images.map((url) => {
+                return new ArtImage(url);
+            });
+        }
+        this.materialTypeId = params.material_type_id; //材料类型ID
+        this.materialType = params.material_type;
+        this.creator = params.creator;
+        this.updater = params.updater;
+        this.createTime = params.create_time;
+        this.updateTime = params.update_time;
     }
-    this.id = params.id;
+    //封面图(表格展示缩略图)
-    this.name = params.name;
+    get imageUrlPreviewPath() {
-    this.description = params.description;
+        if (this.images && this.images.length > 0) {
-    this.images = params.images || null;
+            return this.images[0].compressionUrl;
-    this.materialTypeId = params.material_type_id; //材料类型ID
+        }
-    this.materialType = params.material_type;
-    this.creator = params.creator;
-    this.updater = params.updater;
-    this.createTime = params.create_time;
-    this.updateTime = params.update_time;
-  }
-  //封面图(表格展示缩略图)
-  get imageUrlPreviewPath() {
-    if (this.images && this.images.length > 0) {
-      return this.images[0].previewPath;
     }
-  }
+    get imageUrlimgPath() {
-  get imageUrlimgPath() {
+        if (this.images && this.images.length > 0) {
-    if (this.images && this.images.length > 0) {
+            return this.images[0].url;
-      return this.images[0].imgPath;
+        }
     }
-  }
+    updateMaterial(params) {
-  updateMaterial(params) {
+        let { name, description, images } = params;
-    let { name, description, images } = params;
+        let editTask = new EditTask(artApi.materialUpdate);
-    let editTask = new EditTask(artApi.materialUpdate);
+        editTask.addParam('_id', this.id);
-    editTask.addParam("_id", this.id);
+        editTask.addParam('_description', description);
-    editTask.addParam("_description", description);
+        editTask.addParam('_name', name);
-    editTask.addParam("_name", name);
+        editTask.addParam('_images', images);
-    editTask.addParam("_images", images);
+        return new Promise((resolve, reject) => {
-    return new Promise((resolve, reject) => {
+            editTask
-      editTask
+                .execute()
-        .execute()
+                .then((res) => {
-        .then((res) => {
+                    if (res.data) {
-          if (res.data) {
+                        let material = new Material(res.data);
-            let material = new Material(res.data);
+                        resolve(material);
-            resolve(material);
+                    }
-          }
+                })
-        })
+                .catch((err) => {
-        .catch((err) => {
+                    reject(err);
-          reject(err);
+                });
         });
-    });
+    }
-  }
+    deleteMaterial(params) {
-  deleteMaterial(params) {
+        let editTask = new EditTask(artApi.materialDelete);
-    let editTask = new EditTask(artApi.materialDelete);
+        editTask.addParam('_id', this.id);
-    editTask.addParam("_id", this.id);
+        return editTask.execute();
-    return editTask.execute();
+    }
-  }
 }
 export default Material;