feat(文件上传): 重构文件上传组件并添加禁用状态支持,协同办公将原有的el-button上传按钮替换为fileMain组件

lib/vue-form-making/src/components/Upload/file.vue

@@ -6,9 +6,10 @@
          v-show="(!isQiniu || (isQiniu && token))"
          v-if="!printRead"
     >
-      <el-button v-if="ui == 'element'" type="primary" :disabled="disabled || fileList.length == limit"
+      <!-- <el-button v-if="ui == 'element'" type="primary" :disabled="disabled || fileList.length == limit"
                  @click="handleAdd">{{ $t('fm.actions.upload') }}
-      </el-button>
+      </el-button> -->
+      <fileMain v-if="ui == 'element'" :type="disabled || fileList.length == limit ? 'view' : 'add'" v-model="fileList" @updateVal="getFiles"></fileMain>
       <a-button :size="size" v-if="ui == 'antd'" icon="upload" :disabled="disabled || fileList.length == limit"
                 @click="handleAdd">{{ $t('fm.actions.upload') }}
       </a-button>
@@ -22,7 +23,7 @@
       {{ tip }}
     </div>
 
-    <ul class="upload-list">
+    <ul class="upload-list" v-if="ui == 'antd'">
       <li class="list_item"
           :class="{uploading: item.status=='uploading', 'is-success': item.status=='success', 'is-disabled': disabled}"
           v-for="(item) in fileList" :key="item.key"
@@ -57,12 +58,14 @@ import {executeExpression} from '../../util/expression'
 
 import {getFile, removeFile} from "/src/api/system/file";
 import {getToken} from "../../util/token";
+import fileMain from '@/components/addDoc/index.vue';
 
 require('viewerjs/dist/viewer.css')
 
 export default {
   components: {
-    Draggable
+    Draggable,
+    fileMain
   },
   props: {
     value: {
@@ -145,7 +148,14 @@ export default {
   },
   data() {
     return {
-      fileList: this.value.map(item => {
+      // orderFiles: [],
+      // fileList: this.value.map(item => {
+      //   return {
+      //     ...item,
+      //     key: item.key ? item.key : (new Date().getTime()) + '_' + Math.ceil(Math.random() * 99999),
+      //   }
+      // }),
+      fileList: this.ui == 'element' ? this.value : this.value.map(item => {
         return {
           ...item,
           key: item.key ? item.key : (new Date().getTime()) + '_' + Math.ceil(Math.random() * 99999),
@@ -167,6 +177,10 @@ export default {
     }
   },
   methods: {
+    getFiles(files) {
+      this.fileList = files
+      this.$emit('input', this.fileList)
+    },
     handleChange() {
       console.log(this.$refs.uploadInput.files)
       const files = this.$refs.uploadInput.files
@@ -417,7 +431,13 @@ export default {
   },
   watch: {
     value(val) {
-      this.fileList = this.value.map(item => {
+      // this.fileList = this.value.map(item => {
+      //   return {
+      //     ...item,
+      //     key: item.key ? item.key : (new Date().getTime()) + '_' + Math.ceil(Math.random() * 99999),
+      //   }
+      // })
+      this.fileList = this.ui == 'element' ? this.value : this.value.map(item => {
         return {
           ...item,
           key: item.key ? item.key : (new Date().getTime()) + '_' + Math.ceil(Math.random() * 99999),

src/components/addDoc/index.vue

@@ -14,6 +14,7 @@
         icon="el-icon-view"
         v-else
         type="primary"
+        :disabled="viewDisabled"
         @click="handleUpload"
       >
         查看</el-button
@@ -39,6 +40,10 @@
         type: String,
         default: ''
       },
+      viewDisabled: {
+        type: Boolean,
+        default: false
+      },
       value: {
         type: Array,
         default: () => {

src/views/bpm/collaborative/index.vue

@@ -222,12 +222,17 @@
                       </el-image>
                     </div>
                     <div v-else-if="item.type == 'fileupload'">
-                      <el-button
+                      <!-- <el-button
                         type="text"
                         v-if="row[item.model]?.length"
                         @click="getFiles(row[item.model])"
                         >下载
-                      </el-button>
+                      </el-button> -->
+                      <fileMain
+                        v-if="row[item.model]?.length"
+                        type="view"
+                        v-model="row[item.model]"
+                      ></fileMain>
                     </div>
 
                     <div v-else-if="item.type == 'userSelect'">
@@ -400,12 +405,17 @@
                       </el-image>
                     </div>
                     <div v-else-if="item.type == 'fileupload'">
-                      <el-button
+                      <!-- <el-button
                         type="text"
                         v-if="row[item.model]?.length"
                         @click="getFiles(row[item.model])"
                         >下载
-                      </el-button>
+                      </el-button> -->
+                      <fileMain
+                        v-if="row[item.model]?.length"
+                        type="view"
+                        v-model="row[item.model]"
+                      ></fileMain>
                     </div>
                     <div v-else-if="item.type == 'userSelect'">
                       {{ getUserName(row[item.model]) }}
@@ -595,12 +605,17 @@
                       </el-image>
                     </div>
                     <div v-else-if="item.type == 'fileupload'">
-                      <el-button
+                      <!-- <el-button
                         type="text"
                         v-if="row[item.model]?.length"
                         @click="getFiles(row[item.model])"
                         >下载
-                      </el-button>
+                      </el-button> -->
+                      <fileMain
+                        v-if="row[item.model]?.length"
+                        type="view"
+                        v-model="row[item.model]"
+                      ></fileMain>
                     </div>
                     <div v-else-if="item.type == 'userSelect'">
                       {{ getUserName(row[item.model]) }}
@@ -779,12 +794,17 @@
                       </el-image>
                     </div>
                     <div v-else-if="item.type == 'fileupload'">
-                      <el-button
+                      <!-- <el-button
                         type="text"
                         v-if="row[item.model]?.length"
                         @click="getFiles(row[item.model])"
                         >下载
-                      </el-button>
+                      </el-button> -->
+                      <fileMain
+                        v-if="row[item.model]?.length"
+                        type="view"
+                        v-model="row[item.model]"
+                      ></fileMain>
                     </div>
                     <div v-else-if="item.type == 'userSelect'">
                       {{ getUserName(row[item.model]) }}