Source/plt-web/plt-web-ui/src/components/actions/base/uploadFile.vue

@@ -1,45 +1,36 @@
<template>
  <el-dialog
    v-dialogDrag
    :width="width"
    :visible.sync="visible"
    :destroy-on-close="true"
    :close-on-click-modal="false"
    :destroy-on-close="true"
    :visible.sync="visible"
    :width="width"
    append-to-body
    title="上传文件"
    class="avue-dialog"
    title="上传文件"
    style="margin-top: -20vh !important;"
  >
    <Divider left="30px" text="导入提示"></Divider>
    <ul>
      <li>
        1.红色字体表示必输项
    <ul style="color: #e73a3a">
      <li v-if="!paramVOS.tipList">
        请点击浏览文件进行上传
      </li>
      <li>
        2.每次仅能最多导入10000条数据
      </li>
      <li v-if="paramVOS.tipList && paramVOS.tipList.length >=1 " v-for="(item,index) in paramVOS.tipList" :key="index"> {{index+1}} : {{item}}。</li>
    </ul>
    <Divider left="30px" text="excel文件，选择文件后会自动上传"></Divider>
    <Divider left="30px" text="选择文件后会自动上传"></Divider>
    <el-upload
      :before-upload="beforeUpload"
      :data="fileData"
      :headers="uploadHeaders"
      :on-change="uploadChange"
      :on-error="onError"
      :on-success="onSuccess"
      :show-file-list="false"
      accept=".xlsx, .xls"
      action="/api/ubcs-code/codeClassify/importClassify"
      action="/api/vciFileUploadController/uploadFile"
      class="upload-demo">
      <el-button size="small" style="margin: 15px 35px" type="primary">浏览文件</el-button>
    </el-upload>
    <template #footer>
      <el-button
        :loading="downloadLoading"
        size="small"
        type="primary"
        @click="downloadTemplateFun"
      >下载导入模板
      </el-button
      >
      <el-button size="small" @click="visible = false">关闭</el-button>
    </template>
  </el-dialog>
@@ -74,8 +65,11 @@
      flga: true,
      pageLoading: null,
      downloadLoading: false,
      visible:false,
      visible: false,
    }
  },
  created() {
    console.log(this.sourceData);
  },
  watch: {
    visible: {
@@ -87,8 +81,17 @@
  computed: {
    uploadHeaders() {
      return {
        "Blade-Auth": "bearer " + getToken(),
        "Authorizationtoken": getToken(),
      };
    },
    fileData() {
      return {
        ownbizOid: this.sourceData.oid,
        ownBtmName: this.sourceData.btmname,
        secretGrade: this.paramVOS.secretGrade || -1,
        fileDocClassify: this.paramVOS.fileDocClassify || "",
        updateFileFlag: this.paramVOS.updateFileFlag  || true,
      }
    },
    width() {
      if (!validatenull(this.paramVOS.width)) {
@@ -98,14 +101,14 @@
          return this.paramVOS.width + "px";
        }
      } else {
        return "60%";
        return "40%";
      }
    },
    fullscreen(){
    fullscreen() {
      console.log(this.paramVOS)
      if(this.paramVOS.width || this.paramVOS.height){
      if (this.paramVOS.width || this.paramVOS.height) {
        return false;
      }else if(this.paramVOS.form){
      } else if (this.paramVOS.form) {
        return false;
      }
      return true;
@@ -114,56 +117,46 @@
  methods: {
    //文件上传前
    async beforeUpload(file) {
      const fileType = file.name.split(".").pop();
      if (fileType !== "xlsx" && fileType !== "xls") {
        // 上传格式不符合要求，提示错误信息并取消上传
        this.$message.error("只允许上传xlsx、xls格式的文件");
        return Promise.reject(false);
      // 获取文件扩展名
      const fileExtension = file.name.split(".").pop().toLowerCase(); // 转换为小写以避免大小写不匹配的问题

      if(this.paramVOS.fileType){
        if (!this.paramVOS.fileType.includes(fileExtension)) {
          // 上传格式不符合要求，提示错误信息并取消上传
          this.$message.error(`只允许上传${this.paramVOS.fileType.toString()}格式的文件`);
          return Promise.reject(false);
        }
      }

      this.pageLoading = this.$loading({
        lock: true,
        text: "文件上传中",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)",
      });

      return true;
    },
    // 文件上传成功
    onSuccess(resbonse) {
      if (Object.keys(resbonse.data).length === 0) {
      if (resbonse.code === 200) {
        this.$message.success("上传成功！");
        this.dialogVisible = false;
        return;
        this.visible = false;
      }else {
        this.$message.error(resbonse.msg);
      }
      if (resbonse.data.fileOid) {
        const fileName = resbonse.data.filePath.split("/").pop();
        this.$message.error("请下载错误信息文件进行查看！");
        downloadErrorFile({uuid: resbonse.data.fileOid}).then((res) => {
          func.downloadFileByBlobHandler(res);
        });
      }
    },
    //点击下载模板
    downloadTemplateFun() {
      this.downloadLoading = true;
      downloadBatchImportApplyTemplate({codeClassifyOid: this.codeClassifyOid}).then(res => {
        this.$utilFunc.downloadFileByBlob(res.data, "模板文件.xls");
        this.downloadLoading = false;
      }).catch((res) => {
        this.$message.warning(res)
        this.downloadLoading = false;
      })
    },
    //文件上传失败
    onError(res) {
      this.pageLoading.close();
      this.$message.error(res);
    },
    //文件状态改变
    uploadChange(file) {
      if (file.status === "success" || file.status === "error") {
        this.pageLoading.close();
      }
    }
    },
  }
}
</script>