src/views/dnc/common/ImportFileModal.vue
@@ -1,7 +1,7 @@
<template>
  <a-modal :title="title" :visible="visible" @cancel="handleModalClose" :maskClosable="false">
    <a-upload :multiple="true" :file-list="fileList" :remove="handleRemove" :before-upload="beforeUpload">
      <a-button type="primary">
      <a-button type="primary" :disabled="uploading">
        <a-icon type="import"/>
        选取文件
      </a-button>
@@ -26,6 +26,8 @@
</template>
<script>
  import dncApi from '@/api/dnc'
  export default {
    name: 'ImportFileModal',
    components: {},
@@ -34,6 +36,7 @@
        visible: false,
        title: '',
        fileList: [],
        uploadParams: {},
        uploading: false
      }
    },
@@ -42,8 +45,26 @@
      this.$bus.$on('tableMenuItemMethodTrigger', this.triggerCorrespondingMethod)
    },
    methods: {
      handleImport(modalTitle) {
        this.handleModalOpen(modalTitle)
      /**
       * 点击导入文档或NC程序时触发
       * @param treeNodeInfo 点击树节点右键菜单导入程序时传入树节点信息
       * @param tableRowInfo 点击表格行右键菜单导入程序时传入行信息
       */
      handleImport(treeNodeInfo, tableRowInfo) {
        let attributionId // 文档所属层级Id
        let attributionType  // 文档所属层级类型
        let docClassCode // 文档类型
        if (treeNodeInfo) {
          attributionId = treeNodeInfo.treeKey
          attributionType = treeNodeInfo.type
        } else {
          attributionId = tableRowInfo.attributionId
          attributionType = tableRowInfo.attributionType
        }
        if (attributionType === 5 || attributionType === 6) docClassCode = 'NC'
        else docClassCode = 'OTHER'
        this.uploadParams = Object.assign({}, { attributionId, attributionType, docClassCode })
        this.visible = true
      },
      handleRemove(file) {
@@ -54,43 +75,48 @@
      },
      beforeUpload(file) {
        this.fileList = [...this.fileList, file]
        if (!this.fileList.find(item => item.name === file.name)) this.fileList = [...this.fileList, file]
        return false
      },
      handleUpload() {
        const { fileList } = this
        const formData = new FormData()
        fileList.forEach(file => {
          formData.append('files[]', file)
        })
        const { fileList, $notification } = this
        this.uploading = true
        // You can use any AJAX library you like
        request({
          url: 'https://www.mocky.io/v2/5cc8019d300000980a055e76',
          method: 'post',
          processData: false,
          data: formData,
          success: () => {
            this.fileList = []
            this.uploading = false
            this.$message.success('upload successfully.')
          },
          error: () => {
            this.uploading = false
            this.$message.error('upload failed.')
          }
        let uploadedFileCount = 0
        let uploadSuccessFileCount = 0
        fileList.forEach((file, index) => {
          const formData = new FormData()
          formData.append('file', file)
          file.status = 'uploading'
          dncApi.importDocumentFromLocalApi(this.uploadParams, formData)
            .then(res => {
              if (res.success) {
                file.status = 'done'
                uploadSuccessFileCount++
                $notification.success({
                  message: '消息',
                  description: res.message
                })
              } else {
                file.status = 'error'
                $notification.error({
                  message: '消息',
                  description: res.message
                })
              }
            })
            .catch(err => {
              file.status = 'error'
            })
            .finally(() => {
              uploadedFileCount++
              fileList.splice(index, 1, file)
              if (uploadedFileCount === fileList.length) {
                if (uploadSuccessFileCount > 0) this.$bus.$emit('importFileSuccess', this.uploadParams)
                this.uploading = false
              }
            })
        })
      },
      /**
       * 控制文件上传窗口开启并设置窗口标题
       * @param modalTitle 窗口标题
       */
      handleModalOpen(modalTitle) {
        this.title = modalTitle
        this.visible = true
      },
      /**
@@ -101,8 +127,12 @@
        this.fileList = []
      },
      triggerCorrespondingMethod({ methodName, modalTitle }) {
        if (this[methodName]) this[methodName](modalTitle)
      triggerCorrespondingMethod({ methodName, modalTitle, treeNodeInfo, tableRowInfo }) {
        if (this[methodName]) {
          this[methodName](treeNodeInfo, tableRowInfo)
          this.title = modalTitle
        }
      }
    }
  }