修改上传

src/components/upload/index.vue

@@ -1,98 +1,130 @@
 <template>
   <basic-container>
-    <avue-crud :data="data" ref="crud" :option="option" @resetColumn="resetColumn" @saveColumn="saveColumn">
+    <avue-crud
+      :data="data"
+      ref="crud"
+      :option="option"
+      @resetColumn="resetColumn"
+      @saveColumn="saveColumn"
+    >
       <template slot="menuLeft">
-        <el-button type="primary"
-                   size="small"
-                   icon="el-icon-edit"
-                   @click="addDetail"
-                   :disabled="disabled">上传
+        <el-button
+          type="primary"
+          size="small"
+          icon="el-icon-edit"
+          @click="addDetail"
+          :disabled="disabled"
+          >上传
         </el-button>
       </template>
       <template slot="url" slot-scope="{ row }">
-        <el-input placeholder="请输入内容" size="small" v-if="row.$cellEdit" v-model="row.url" class="input-with-select">
-          <el-button slot="append" @click="singleLineUpload(row)">附件</el-button>
+        <el-input
+          placeholder="请输入内容"
+          size="small"
+          v-if="row.$cellEdit"
+          v-model="row.url"
+          class="input-with-select"
+        >
+          <el-button slot="append" @click="singleLineUpload(row)"
+            >附件</el-button
+          >
         </el-input>
         <span v-else>{{ row.url }}</span>
       </template>
       <template slot-scope="scope" slot="menu">
-        <el-button icon="el-icon-download" :size="scope.size" :type="scope.type" @click="download(scope)" :disabled="disabled">下载附件
+        <el-button
+          icon="el-icon-download"
+          :size="scope.size"
+          :type="scope.type"
+          @click="download(scope)"
+          :disabled="disabled"
+          >下载附件
         </el-button>
         <el-button
-            :type="scope.type"
-            :size="scope.size"
-            icon="el-icon-edit"
-            @click.stop="rowCell(scope.row,scope.index)"
-            :disabled="disabled"
-        > {{ scope.row.$cellEdit ? '修改完成' : '修改' }}
+          :type="scope.type"
+          :size="scope.size"
+          icon="el-icon-edit"
+          @click.stop="rowCell(scope.row, scope.index)"
+          :disabled="disabled"
+        >
+          {{ scope.row.$cellEdit ? "修改完成" : "修改" }}
         </el-button>
         <el-button
-            :type="scope.type"
-            :size="scope.size"
-            icon="el-icon-delete"
-            @click.stop="rowDel(scope.row,scope.index)"
-            :disabled="disabled"
-        >删除
+          :type="scope.type"
+          :size="scope.size"
+          icon="el-icon-delete"
+          @click.stop="rowDel(scope.row, scope.index)"
+          :disabled="disabled"
+          >删除
         </el-button>
       </template>
     </avue-crud>
     <el-dialog
-        title="上传附件"
-        append-to-body
-        :visible.sync="excelBox"
-        width="555px"
-        v-dialog-drag>
+      title="上传附件"
+      append-to-body
+      :visible.sync="excelBox"
+      width="555px"
+      v-dialog-drag
+    >
       <el-upload
-          class="upload-demo"
-          drag
-          style="text-align: center"
-          ref="upload"
-          :action="incomingAction?incomingAction:action"
-          :headers="headers"
-          :on-success="onSuccess"
-          multiple>
+        class="upload-demo"
+        drag
+        style="text-align: center"
+        ref="upload"
+        :action="incomingAction ? incomingAction : action"
+        :headers="headers"
+        :on-success="onSuccess"
+        multiple
+      >
         <i class="el-icon-upload"></i>
         <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
-        <div class="el-upload__tip" slot="tip">如上传文件过大，请耐心等待上传成功</div>
+        <div class="el-upload__tip" slot="tip">
+          如上传文件过大，请耐心等待上传成功
+        </div>
       </el-upload>
     </el-dialog>
     <el-dialog
-        title="修改附件"
-        append-to-body
-        :visible.sync="excelTwo"
-        width="555px"
-        v-dialog-drag>
+      title="修改附件"
+      append-to-body
+      :visible.sync="excelTwo"
+      width="555px"
+      v-dialog-drag
+    >
       <el-upload
-          class="upload-demo"
-          drag
-          style="text-align: center"
-          :action="incomingAction?incomingAction:action"
-          :headers="headers"
-          :show-file-list="false"
-          :on-success="onSuccessTwo">
+        class="upload-demo"
+        drag
+        style="text-align: center"
+        :action="incomingAction ? incomingAction : action"
+        :headers="headers"
+        :show-file-list="false"
+        :on-success="onSuccessTwo"
+      >
         <i class="el-icon-upload"></i>
         <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
-        <div class="el-upload__tip" slot="tip">如上传文件过大，请耐心等待上传成功</div>
+        <div class="el-upload__tip" slot="tip">
+          如上传文件过大，请耐心等待上传成功
+        </div>
       </el-upload>
     </el-dialog>
     <el-dialog
-        width="80%"
-        title="附件"
-        :visible.sync="innerVisible"
-        append-to-body>
+      width="80%"
+      title="附件"
+      :visible.sync="innerVisible"
+      append-to-body
+    >
       <div style="width: 50%;height: 50%;margin: 0 auto">
-        <img :src="imgUrl" alt="" style="width: 100%;height: 100%;">
+        <img :src="imgUrl" alt="" style="width: 100%;height: 100%;" />
       </div>
     </el-dialog>
   </basic-container>
 </template>
 
 <script>
-import {getToken} from "@/util/auth";
-import {sharedDeletion} from "@/api/user";
+import { getToken } from "@/util/auth";
+import { sharedDeletion } from "@/api/user";
 import option from "@/views/exportTrade/customerInquiry/config/mainList.json";
-import {gainUser} from "@/api/basicData/customerInquiry";
-
+import { gainUser } from "@/api/basicData/customerInquiry";
+import { updateListRemove } from "@/api/uploadFile/upload-file";
 export default {
   name: "index",
   props: {
@@ -108,8 +140,11 @@ export default {
     enumerationValue: {
       type: Number
     },
-    disabled:{
-      type:Boolean
+    typeUpload: {
+      type: String
+    },
+    disabled: {
+      type: Boolean
     }
   },
   data() {
@@ -118,9 +153,9 @@ export default {
       excelTwo: false,
       innerVisible: false,
       form: {},
-      imgUrl: '',
-      action: '/api/blade-resource/oss/endpoint/put-file',
-      headers: {"Blade-Auth": 'Bearer ' + getToken()},
+      imgUrl: "",
+      action: "/api/blade-resource/oss/endpoint/put-file",
+      headers: { "Blade-Auth": "Bearer " + getToken() },
       option: {},
       originalOptions: {
         dialogDrag: true,
@@ -134,18 +169,20 @@ export default {
         align: "center",
         column: [
           {
-            label: '文件名称',
-            prop: 'fileName',
+            label: "文件名称",
+            prop: "fileName",
             index: 1,
             width: 140,
             cell: true,
             overHidden: true
-          }, {
-            label: '文件地址',
-            prop: 'url',
+          },
+          {
+            label: "文件地址",
+            prop: "url",
             index: 2,
             overHidden: true
-          }, {
+          },
+          {
             type: "select",
             dicUrl: "/api/blade-system/dict-biz/dictionary?code=file_type",
             props: {
@@ -159,17 +196,18 @@ export default {
             width: 140,
             overHidden: true,
             cell: true
-          }, {
-            label: '备注',
-            prop: 'remarks',
+          },
+          {
+            label: "备注",
+            prop: "remarks",
             index: 4,
             cell: true,
             overHidden: true
           }
         ]
       },
-      uploadCount: 0,
-    }
+      uploadCount: 0
+    };
   },
   async created() {
     /**
@@ -177,7 +215,10 @@ export default {
      * 已定义全局方法，直接使用，getColumnName方法用来获取枚举值，参数根据自己定义的code值获取中文名
      * 一定要执行异步操作，要等接口成功返回，才能执行下一行代码
      */
-    this.option = await this.getColumnData(this.getColumnName(this.enumerationValue), this.originalOptions);
+    this.option = await this.getColumnData(
+      this.getColumnName(this.enumerationValue),
+      this.originalOptions
+    );
   },
   methods: {
     //自定义列保存
@@ -187,7 +228,10 @@ export default {
        * 已定义全局方法，直接使用，getColumnName方法用来获取枚举值，参数根据自己定义的code值获取中文名
        * 一定要执行异步操作，要等接口成功返回，才能执行下一行代码
        */
-      const inSave = await this.saveColumnData(this.getColumnName(this.enumerationValue),this.option);
+      const inSave = await this.saveColumnData(
+        this.getColumnName(this.enumerationValue),
+        this.option
+      );
       if (inSave) {
         this.$message.success("保存成功");
         //关闭窗口
@@ -197,7 +241,10 @@ export default {
     //自定义列重置
     async resetColumn() {
       this.option = this.originalOptions;
-      const inSave = await this.delColumnData(this.getColumnName(this.enumerationValue), this.originalOptions);
+      const inSave = await this.delColumnData(
+        this.getColumnName(this.enumerationValue),
+        this.originalOptions
+      );
       if (inSave) {
         this.$message.success("重置成功");
         this.$refs.crud.$refs.dialogColumn.columnBox = false;
@@ -208,37 +255,46 @@ export default {
       this.$refs.crud.rowCellAdd({
         fileName: response.data.originalName,
         url: response.data.link
-      })
-      this.uploadCount++
+      });
+      this.uploadCount++;
       if (this.uploadCount === fileList.length) {
-        this.$refs.upload.clearFiles()
-        this.excelBox = false
-        this.uploadCount = 0
+        this.$refs.upload.clearFiles();
+        this.excelBox = false;
+        this.uploadCount = 0;
       }
     },
     //修改上传成功
     onSuccessTwo(response) {
-      this.form.fileName = response.data.originalName
-      this.form.url = response.data.link
-      this.data[this.form.$index] = this.form
-      this.excelTwo = false
+      this.form.fileName = response.data.originalName;
+      this.form.url = response.data.link;
+      this.data[this.form.$index] = this.form;
+      this.excelTwo = false;
     },
     //单行上传
     singleLineUpload(row) {
-      this.form = row
-      this.excelTwo = true
+      this.form = row;
+      this.excelTwo = true;
     },
     //开启批量上传
     addDetail() {
-      this.excelBox = true
+      this.excelBox = true;
     },
     //下载附件
     download(scope) {
-      console.log(scope.row.url)
+      console.log(scope.row.url);
       if (scope.row.url) {
-        if (scope.row.fileName.substring(scope.row.fileName.lastIndexOf(".")) === '.jpg' || scope.row.fileName.substring(scope.row.fileName.lastIndexOf(".")) === '.png' || scope.row.fileName.substring(scope.row.fileName.lastIndexOf(".")) === '.JPG' || scope.row.fileName.substring(scope.row.fileName.lastIndexOf(".")) === '.PNG') {
-          this.imgUrl = scope.row.url
-          this.innerVisible = true
+        if (
+          scope.row.fileName.substring(scope.row.fileName.lastIndexOf(".")) ===
+            ".jpg" ||
+          scope.row.fileName.substring(scope.row.fileName.lastIndexOf(".")) ===
+            ".png" ||
+          scope.row.fileName.substring(scope.row.fileName.lastIndexOf(".")) ===
+            ".JPG" ||
+          scope.row.fileName.substring(scope.row.fileName.lastIndexOf(".")) ===
+            ".PNG"
+        ) {
+          this.imgUrl = scope.row.url;
+          this.innerVisible = true;
         } else {
           window.open(scope.row.url);
         }
@@ -262,21 +318,28 @@ export default {
         type: "warning"
       }).then(() => {
         if (row.id) {
-          sharedDeletion(this.deleteUrl, row.id).then(res => {
-            if (res.data.success) {
-              this.$message.success("操作成功!")
-              this.data.splice(index, 1);
-            }
-          })
+          if (this.typeUpload == "CK") {
+            updateListRemove(row.id, this.deleteUrl).then(res => {
+              if (res.data.success) {
+                this.$message.success("操作成功!");
+                this.data.splice(index, 1);
+              }
+            });
+          } else {
+            sharedDeletion(this.deleteUrl, row.id).then(res => {
+              if (res.data.success) {
+                this.$message.success("操作成功!");
+                this.data.splice(index, 1);
+              }
+            });
+          }
         } else {
           this.data.splice(index, 1);
         }
-      })
+      });
     }
   }
-}
+};
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>