修改文件上传组件

src/components/K-FileUpload/index.vue

@@ -8,11 +8,13 @@
     :on-error="uploadedSuccessfully"
     :on-success="handleUploadSuccess"
       :file-list="fileList"
-
+      :limit="limit"
       :accept="accept"
       :http-request="uploadFile"
       :show-file-list="true"
       :on-remove="handleDelete"
+      :on-exceed="handleExceed"
+      :on-preview="onPreview"
       :headers="headers" class="upload-file-uploader" ref="fileUpload">
       <i class="el-icon-upload"></i>
       <!-- 上传按钮 -->
@@ -191,11 +193,11 @@ export default {
     handleDelete(item) {
       if (item && item.status === "success") {
         console.log("handleDelete index",item)
-      this.fileList.splice(item, 1);
-      console.log("handleDelete",item,this.fileValueList)
+      //this.fileList.splice(item, 1);
+      // console.log("handleDelete",item,this.fileValueList)
 
       let index = this.fileValueList.findIndex(x=>x.name==item.name);
-      console.log("handleDelete",index,this.fileValueList)
+      // console.log("handleDelete",index,this.fileValueList)
       if(index>-1)
       {
         this.fileValueList.splice(index, 1);
@@ -205,7 +207,6 @@ export default {
 
       this.$emit("input", this.listToTagObj(this.fileValueList));
     }
-
     },
     // 上传失败结束处理 必须调用，否则失败文件也会显示
     uploadedSuccessfully(err,file,fileList) {
@@ -267,7 +268,19 @@ export default {
       }
       console.log("listToString2",tempArry);
       return tempArry;
-    }
+    },
+    onPreview(file) {
+        console.log(file);
+        var name = file.name;
+        let index = this.fileValueList.findIndex(x=>x.name==file.name);
+        this.fileValueList[index]
+        var url = process.env.VUE_APP_BASE_API + this.fileValueList[index].url;
+        const a = document.createElement("a");
+        a.setAttribute("download", name);
+        a.setAttribute("target", "_blank");
+        a.setAttribute("href", url);
+        a.click();
+      },
   }
 };
 </script>

src/views/core/materials/index.vue

@@ -173,7 +173,7 @@
       </el-col>
     </el-row>
     <!-- 添加或修改学习资料对话框 -->
-    <DialogCom :title="title" :visible.sync="open" width="500px" append-to-body>
+    <DialogCom :title="title" :visible.sync="open" @close="cancel" width="500px" append-to-body>
       <el-form :disabled="title=='学习资料详情'" ref="form" :model="form" :rules="rules" label-width="80px">
         <el-form-item label="资料标题" prop="title">
           <el-input v-model="form.title" placeholder="请输入资料标题" maxlength="50" show-word-limit/>
@@ -192,7 +192,9 @@
           <el-input v-model="form.remark" placeholder="请输入备注" maxlength="200" show-word-limit/>
         </el-form-item>
         <el-form-item label="附件" prop="fileList">
-          <K-file-upload ref="upload" :defaultValue="formFileListDefualtValue" v-model="form.fileList"/>
+          <K-file-upload ref="upload" 
+          :defaultValue="formFileListDefualtValue" 
+          v-model="form.fileList"/>
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
@@ -254,7 +256,7 @@ export default {
         children: "children",
         label: "name"
       },
-      formFileListDefualtValue:{},
+      formFileListDefualtValue:[],
       // 查询参数
       queryParams: {
         checkSub:true,
@@ -344,6 +346,8 @@ export default {
     cancel() {
       this.open = false;
       this.reset();
+      this.$refs["upload"].fileList = [];
+      this.$refs["upload"].fileValueList = [];
     },
     // 表单重置
     reset() {
@@ -355,8 +359,9 @@ export default {
         orgId: this.queryParams.orgId,
         isOpen: null,
         remark: null,
-        fileList: null,
+        fileList: [],
       };
+      // this.formFileListDefualtValue=[];
       this.resetForm("form");
       this.initKnowledgeList();
     },