xiaoshi_system/src/views/components/import/excelImport/importPatent.vue

<template>
    <div class="import-patent">
    <el-container class="import-patent">
      <el-aside class="import-patent-main" style="width:450px">
        <el-container class="import-patent-action">
          <el-main class="import-patent-action-main" v-loading="loading">
            <el-form :model="form" > 
              <el-form-item label="数据来源：">
                <select style="width:300px;border:0;outline:none" name="" id="" v-model="sourceId">
                  <option value="">请选择数据来源</option>
                  <option v-for="item in customField.dataType" :value="item.id">{{item.name}}</option>
                </select>
                <el-divider ></el-divider>
              </el-form-item>
              <el-form-item label="选择需要上传的专利信息导入文件">
                <el-upload class="upload-file" drag action="#" :auto-upload="false" :show-file-list="false" :on-change="onChange">
                  <i :class="!form.file ? 'el-icon-upload' : 'el-icon-refresh'"></i>
                  <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
                  <div class="el-upload__tip" slot="tip"></div>
                </el-upload>
              </el-form-item>
            </el-form>
          </el-main>
        </el-container>

        
      </el-aside>
      <el-main>
        <systemTask ref="systemTask" :form="1" :reportId="reportId" :productId="productId" :projectId="projectId"></systemTask>
      </el-main>
    </el-container>
  </div>
</template>

<script>
// import systemTask from './systemTask.vue'
import systemTask from '@/views/task/index.vue'
export default {
  props:['reportId','asCompare','productId','projectId'],
  components: {
    systemTask
  },
  data() {
    return {
      form: {},
      sourceId: '',
      customField: [],
      loading:false,
    }
  },
  computed: {},
  mounted() {
    this.getCustomField()
  },
  methods: {
    getCustomField() {
      this.$api.getCustomField({ projectId: 0, patentTotal: false }).then(response => {
        this.customField = response.data
      })
    },
    getQueueList() {
      this.$refs.systemTask.getQueueList()
    },
    onChange(file, fileList) {
      this.form.file = file.raw
      this.handleConfirm()
    },
    handleConfirm() {
      const json = JSON.parse(JSON.stringify(this.form))
      const refs = this.$refs
     
      let data = {
        reportId: this.reportId,
        productId: this.productId,
        projectId: this.projectId,
        sourceId:this.sourceId,
        fieldList: [],
        folderIds: refs.folderTree ? refs.folderTree.getCheckedKeys() : [],
        asCompare:this.asCompare
      }
      for (let uid in json.field) {
        const field = json.field[uid]
        if (!field) {
          continue;
        }
        const type = field.type
        const value = field.value
        if (value) {
          if (type === 5) {
            value.map(option => {
              data.fieldList.push({
                fieldId: parseInt(id),
                type: type,
                optionId: option
              })
            })
          } else if (type === 6) {
            const tree = refs[id]
            if (tree) {
              const treeNode = tree[0].getCheckedKeys()
              treeNode.map(node => {
                data.fieldList.push({
                  fieldId: parseInt(id),
                  type: type,
                  optionId: node
                })
              })
            }
          } else {
            data.fieldList.push({
              fieldId: parseInt(id),
              type: type,
              optionId: [0, 1, 2].indexOf(type) === -1 ? value : 0,
              text: value
            })
          }
        }
      }
      if (!this.form.file) {
        this.$message.error('请选择文件')
        return false
      }
      if (!this.sourceId) {
        this.$message.error('请选择数据类型')
        return false
      }
      let formData = new FormData()
      formData.append('file', this.form.file)
      formData.append('json', JSON.stringify(data))
      this.btnLoading = true
      this.loading = true
      // console.log(formData)
      this.$api.importProjectPatent(formData).then(response => {
        this.$message.success('任务创建成功')
        this.form.file = null
        this.btnLoading = false
        this.loading = false
        // this.handleClose()
        this.getQueueList()
      }).catch(error => {
        this.btnLoading = false
        this.loading = false
      })
    }
  },
}
</script>

<style lang="scss">
.el-divider--horizontal{
  margin:0
}
.import-patent {
  height: 100%;
  .import-patent-main {
    overflow-x: hidden;
    padding: 0;
    height: 100%;
    background: #fff;
  }
  .import-patent-action {
    width: 450px;
    height: 100%;
    border-right: 1px solid #d2d2d2;
    float: left;
    .custom-field-form .el-form-item__label {
      font-weight: bold !important;
    }
    .import-patent-action-form {
      margin-left: 20px;
    }
    .import-patent-action-main {
      padding: 10px;
    }
  }
  .import-patent-button {
    height: 70px !important;
    text-align: right;
  }
}
</style>