履历本附件上传组件定义

applications/dee-mes/src/privateComponents/components/BiographicDataUpload/index.vue

+<template>
+  <div v-dee-loading="loading" class="BiographicDataUpload">
+    <dee-tools slot="header" :tools="tools" mode="normal" :collapse="false" />
+    <div class="dee-table dee-table-dis-border">
+      <el-table
+        ref="table"
+        :data="tableData"
+        @selection-change="handleSelectionChange"
+      >
+        <el-table-column
+          type="selection"
+          width="55"
+        />
+        <el-table-column prop="contentType" label="附件类型">
+          <template slot-scope="scope">
+            <el-select v-if="showBtns" v-model="scope.row.contentType" placeholder="请选择">
+              <el-option
+                v-for="i in contentTypeOptions"
+                :key="i.value"
+                :label="i.label"
+                :value="i.value"
+              />
+            </el-select>
+            <span v-else>{{ scope.row.contentType }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="fileName" label="文件名" />
+        <el-table-column prop="fileName" label="上传附件">
+          <template slot-scope="scope">
+            <div class="importTemp-com">
+              <el-upload
+                ref="upload"
+                class="upload-demo"
+                action=""
+                :with-credentials="true"
+                accept=".pdf"
+                :on-change="(fileList)=>{
+                  fileChange(fileList,scope)
+                }"
+                :auto-upload="false"
+                :show-file-list="false"
+              >
+                <el-button
+                  class="border-none"
+                  style="width:80px !important;"
+                >
+                  选择文件
+                </el-button>
+              </el-upload>
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div v-if="showBtns" class="btns">
+        <el-button
+          type="primary"
+          size="small"
+          class="min-width-80"
+          @click="submitUpload"
+        >完成</el-button>
+
+        <el-button
+          class="min-width-80"
+          size="small"
+          @click="handleClose"
+        >取消</el-button>
+      </div>
+    </div></div>
+
+</template>
+
+<script>
+import { post } from '@/utils/http'
+export default {
+  name: 'BiographicDataUpload',
+  componentName: '履历本上传附件',
+  props: {
+    basicData: {
+      type: Object,
+      default: () => {}
+    }
+  },
+  data() {
+    return {
+      loading: false,
+      showBtns: false,
+      tableData: [],
+      contentTypeOptions: [],
+      tools: [{
+        name: '新增',
+        icon: '/icons/c-add.png',
+        handler: {
+          click: () => {
+            this.showBtns = true
+            this.handleAdd()
+          }
+        }
+      },
+      {
+        name: '删除',
+        icon: '/icons/c-creatbackups.png',
+        handler: {
+          click: () => {
+            this.showBtns = true
+            this.handleRemove()
+          }
+        }
+      }],
+      extension: [],
+      currentSelection: []
+    }
+  },
+  computed: {
+  },
+  watch: {
+    basicData: {
+      immediate: true,
+      deep: true,
+      handler(val) {
+        if (val && val.subTypeName) {
+          this.getDicData()
+        }
+        if (val && val.objFileLinks) {
+          this.$nextTick(() => {
+            this.getTableData()
+          })
+        }
+      }
+    }
+  },
+  created() {
+  },
+  mounted() {
+  },
+  methods: {
+    getDicData() {
+      this.$utils.getDicListByCode('resumeBookConentType').then(res => {
+        if (this.basicData.subTypeName === 'BiographicData') {
+          this.contentTypeOptions = res.filter(item => item.value !== 'AirworthinessLabelOrCertificate')
+        } else if (this.basicData.subTypeName === 'ProductCertificate') {
+          this.contentTypeOptions = res.filter(item => item.value === 'briefTechnicalPerformance' || item.value === 'acceptanceCertificate' || item.value === 'match' || item.value === 'lifeAndReliability')
+        } else {
+          this.contentTypeOptions = res.filter(item => item.value === 'AirworthinessLabelOrCertificate')
+        }
+      })
+    },
+    getTableData() {
+      this.tableData = []
+      if (this.basicData.objFileLinks.length) {
+        this.basicData.objFileLinks.map(item => {
+          if (item.target && item.target.originalFileName) {
+            this.tableData.push({
+              id: item.id,
+              fileName: item.target.originalFileName,
+              fileListRaw: item,
+              contentType: this.$utils.getParamsFromLists(this.contentTypeOptions, 'value', item.contentType, 'label')
+
+            })
+          }
+        })
+      }
+    },
+    handleAdd() {
+      this.tableData.push({
+        tempId: parseInt(Math.random() * 100000000000000, 10),
+        fileName: '',
+        contentType: ''
+      })
+    },
+    handleSelectionChange(val) {
+      this.currentSelection = val
+    },
+    handleRemove() {
+      if (this.currentSelection.length === 0) {
+        this.$utils.showMessageWarning('请至少选择一条记录！')
+      } else {
+        this.tableData = this.tableData.filter(x => this.currentSelection.every(y => x.id !== y.id || x.tempId !== y.tempId))
+      }
+    },
+    fileChange(fileList, scope) {
+      // console.log('scope: ', scope)
+      // console.log('fileList: ', fileList)
+      this.showBtns = true
+      this.$set(scope.row, 'fileName', fileList.name)
+      this.$set(scope.row, 'fileListRaw', fileList.raw)
+    },
+    submitUpload() {
+      this.loading = true
+      const fileExtVOS = []
+      const formData = new FormData()
+      this.tableData.forEach(row => {
+        fileExtVOS.push({
+          'fileName': row.fileName,
+          'contentType': row.contentType
+        })
+        if (row.fileListRaw.id) {
+          formData.append('multipartFiles', new Blob([JSON.stringify(row.fileListRaw)], { type: 'application/json' }))
+        } else {
+          formData.append('multipartFiles', row.fileListRaw)
+        }
+      })
+      formData.append('fileExtVOS', new Blob([JSON.stringify(fileExtVOS)], { type: 'application/json' }))
+      post(`/BiographicData/uploadMultiFile/${this.basicData.id}`, formData)
+        .then((res) => {
+          this.$message({
+            message: res.message,
+            type: 'success'
+          })
+          this.loading = false
+          this.handleClose()
+          this.$emit('getList')
+          this.$emit('uploadSuccess', res)
+        })
+        .catch((res) => {
+          this.loading = false
+          this.$message({
+            message: res.message,
+            type: 'error'
+          })
+        })
+    },
+    handleClose() {
+      this.showBtns = false
+      this.getTableData()
+    }
+
+  }
+}
+</script>
+<style lang="scss">
+.BiographicDataUpload{
+  .btns{
+    margin-top: 20px;
+    display: flex;
+    justify-content: center;
+  }
+
+}
+</style>