Source/UBCS-WEB/src/components/BatchImport/index.vue

@@ -1,51 +1,63 @@
<template>

  <div>

    <el-dialog :title="title" :visible="visible" append-to-body>

      <Divider text="导入提示" left="30px"></Divider>

      <ul>

        <li v-for="(item, index) in tipList" :key="index">

          {{ item }}

        </li>

      </ul>

      <div class="radio_box">

        <span>分类的路径使用的属性:</span>

        <el-radio-group v-model="classifyAttr">

          <el-radio label="id">分类编号</el-radio>

          <el-radio label="name">分类名称</el-radio>

        </el-radio-group>

      </div>

      <Divider text="excel文件，选择文件后会自动上传" left="30px"></Divider>

      <el-upload

        class="upload"

        :accept="accept"

        :action="action"

        :before-upload="beforeUpload"

        :on-exceed="handleExceed"

        :headers="uploadHeaders"

        :on-success="onSuccess"

        :show-file-list="false"

        :data="{

          codeClassifyOid: this.codeClassifyOid,

          classifyAttr: this.classifyAttr,

        }"

  <el-dialog

    v-if="dialogVisible"

    :title="title"

    :visible.sync="dialogVisible"

    append-to-body

    v-dialogDrag

  >

    <Divider text="导入提示" left="30px"></Divider>

    <ul>

      <li v-for="(item, index) in tipList" :key="index">

        {{ item }}

      </li>

    </ul>

    <div class="radio_box">

      <span>分类的路径使用的属性:</span>

      <el-radio-group v-model="classifyAttr">

        <el-radio label="id">分类编号</el-radio>

        <el-radio label="name">分类名称</el-radio>

      </el-radio-group>

    </div>

    <Divider text="excel文件，选择文件后会自动上传" left="30px"></Divider>

    <el-upload

      class="upload"

      :accept="accept"

      :action="action"

      :before-upload="beforeUpload"

      :on-exceed="handleExceed"

      :headers="uploadHeaders"

      :on-success="onSuccess"

      :show-file-list="false"

      :on-change="uploadChange"

      :data="{

        codeClassifyOid: this.codeClassifyOid,

        classifyAttr: this.classifyAttr,

      }"

    >

      <el-button size="small" type="primary"

        ><i class="el-icon-upload"></i> 点击上传</el-button

      >

        <el-button size="small" type="primary"

          ><i class="el-icon-upload"></i> 点击上传</el-button

        >

      </el-upload>

      <template #footer>

        <el-button

          type="primary"

          size="small"

          @click="downloadTemplateFun"

          :loading="downloadLoading"

          >下载导入模板</el-button

        >

        <el-button size="small" @click="visible = false">关闭</el-button>

      </template>

    </el-dialog>

    <ShowImportData :visible="showVisible" v-if="showVisible"></ShowImportData>

  </div>

    </el-upload>

    <template #footer>

      <el-button

        type="primary"

        size="small"

        @click="downloadTemplateFun"

        :loading="downloadLoading"

        >下载导入模板</el-button

      >

      <el-button size="small" @click="dialogVisible = false">关闭</el-button>

    </template>

    <ShowImportData

      :visible.sync="showVisible"

      v-if="dialogVisible"

      :leftTree="leftTree"

      :classifyAttr="classifyAttr"

      :codeClassifyOid="codeClassifyOid"

      :redisOid="redisOid"

    ></ShowImportData>

  </el-dialog>

</template>



<script>

@@ -53,7 +65,7 @@
import {

  downloadHistoryImportTemplate,

  downloadErrorFile,

  importDataShow

  getHistoryLeftTree

} from "../../api/batchImport/index";

import { getToken } from "@/util/auth";

export default {

@@ -83,6 +95,9 @@
      uploadParams: {},

      downloadLoading: false,

      showVisible: false,

      leftTree: [],

      redisOid:'',

      pageLoading: null

    };

  },

  computed: {

@@ -90,6 +105,14 @@
      return {

        "Blade-Auth": "bearer " + getToken(),

      };

    },

    dialogVisible: {

      get() {

        return this.visible;

      },

      set(val) {

        this.$emit("update:visible", val);

      },

    },

  },

  methods: {

@@ -128,19 +151,47 @@
        codeClassifyOid: this.codeClassifyOid,

      })

        .then((res) => {

          this.downloadLoading = false;

          this.$utilFunc.downloadFileByBlob(res.data, "历史数据导入模板.xls");

          this.downloadLoading = false;

        })

        .catch(() => {

          this.downloadLoading = false;

        });

    },

    onSuccess(res) {

      if (res.code === 400) {

        this.$message.error(`${res.msg}，请下载错误信息进行查看！`);

      let fileName = res.data.filePath.split('/').pop()

      if (res.data.fileOid) {

        this.$message.error("请下载错误信息文件进行查看！");

        downloadErrorFile({ uuid: res.data.fileOid }).then((res2) => {

          this.$utilFunc.downloadFileByBlob(res2.data, fileName);

        });

      }

      downloadErrorFile({ uuid: res.data.fileOid });

      if (res.data.redisUuid) {

        this.redisOid = res.data.redisUuid

        getHistoryLeftTree(res.data.redisUuid).then(res => {

          this.leftTree = res.obj.map(item => {

            return {

              ...item.codeClassifyTemplateVO,

              cloNamesList: item.cloNamesList

            }

          })

          this.showVisible = true

        })

      }

    },

    uploadChange(file) {

      if (file.status === 'ready') {

        this.pageLoading = this.$loading({

          lock: true,

          text: '文件上传中',

          spinner: 'el-icon-loading',

          background: 'rgba(0, 0, 0, 0.7)'

        });

      }

      if (file.status === 'success' || file.status === 'error') {

        this.pageLoading.close()

      }

    }

  },

  watch: {

    visible: {