修改

src/views/couponsManage/couponsList.vue

@@ -63,6 +63,13 @@
         <el-form-item label="名称" prop="couponName">
           <el-input style="width: 300px" v-model="dataForm.couponName"></el-input>
         </el-form-item>
+        <el-form-item style="width: 800px" label="图片" prop="couponImg">
+                    <el-upload :limit="1" :action="fileImgUrl" list-type="picture-card" :file-list="dataForm.images"
+                            :on-success="handleGallerySucess" :on-exceed="handleExceed" :before-upload="uploadBannerImg"
+                            :on-remove="handleRemove">
+                            <i class="el-icon-plus"></i>
+                        </el-upload>
+                </el-form-item>
         <el-form-item label="类型" prop="couponType">
           <el-select v-model="dataForm.couponType" clearable placeholder="请选择类型" class="filter-item" style="width: 300px">
             <el-option :key="item.type" v-for="item in typeList" :label="item.name" :value="item.type">
@@ -144,6 +151,7 @@ export default {
   directives: { waves },
   data() {
     return {
+      fileImgUrl: this.upLoadUrl,
       categorysList:[],
       dataTypeList:[],
       goodsList:[],
@@ -173,6 +181,8 @@ export default {
         createTime: '',
       },
       dataForm: {
+        couponImg: undefined,
+        images: [],
         couponName: undefined,
         couponType: undefined,
         useType:undefined,
@@ -191,7 +201,7 @@ export default {
       },
       imageUrl: undefined,
       rules: {
-
+        couponImg: [{ required: true, message: "请上传奖品图片", trigger: "blur" }],
         couponName: [{ required: true, message: "名称不能为空", trigger: "blur" }],
         couponType: [{ required: true, message: "请选择类型", trigger: "blur" }],
         useType: [{ required: true, message: "请选择使用类型", trigger: "blur" }],
@@ -209,6 +219,46 @@ export default {
     this.getCategorysList();
   },
   methods: {
+    handleRemove(file, fileList) {
+            console.log(file, fileList);
+            let images = [];
+            for (let i in fileList) {
+                let response = fileList[i].response;
+                let url = response.data.url;
+                images.push(url);
+            }
+            this.dataForm.images = images;
+            this.dataForm.couponImg = images.join(",");
+        },
+        uploadBannerImg(file) {
+            const isJPGs = file.type === "image/jpeg";
+            console.log(isJPGs);
+        },
+        handleExceed(files, fileList) {
+            this.$message.warning(
+                `当前限制选择 1 个文件，本次选择了 ${files.length} 个文件！，共选择了 ${files.length + fileList.length
+                } 个文件`
+            );
+        },
+        handleGallerySucess(res, file, fileList) {
+            this.dataForm.couponImg = ""; // 清空画廊图片数组
+
+            let images = [];
+            for (let i in fileList) {
+                let response = fileList[i].response;
+                if (response.errno && response.errno != "0") {
+                    this.$message.error("该图片上传失败,已被移除,请重新上传!");
+                    // 上传失败移除该 file 对象
+                    fileList.splice(i, 1);
+                } else {
+                    let url = response.data.url;
+                    images.push(url);
+                }
+            }
+            this.dataForm.images = images;
+            this.dataForm.couponImg = images.join(",");
+            console.log(this.dataForm.couponImg)
+        },
     getCategorysList() {
             dataTypeList({dictType:'mall_sku_attribute'}).then(response => {
                 this.categorysList = response.data.data;
@@ -226,6 +276,8 @@ export default {
     },
     resetForm() {
       this.dataForm = {
+        couponImg: undefined,
+        images: [],
         couponName: undefined,
         couponType: undefined,
         useType:undefined,
@@ -294,6 +346,20 @@ export default {
 
     handleUpdate(row) {
       this.dataForm = Object.assign({}, row);
+      if (this.dataForm.couponImg) {
+                let images = this.dataForm.couponImg.split(",");
+                this.dataForm.images = [];
+                for (let i in images) {
+                    let url = images[i];
+                    let name = "image_" + i;
+
+                    this.dataForm.images.push({
+                        name: name,
+                        url: url,
+                        response: { error: "0", data: { url: url } },
+                    });
+                }
+            }
       if(this.dataForm.categorys==null){
         this.dataForm.categorys=[];
       }