13 changed files with 525 additions and 3 deletions
			
			
		| 
		 After Width: | Height: | Size: 1.2 KiB  | 
| 
		 After Width: | Height: | Size: 1016 B  | 
| 
		 After Width: | Height: | Size: 437 B  | 
| 
		 After Width: | Height: | Size: 1.1 KiB  | 
| 
		 After Width: | Height: | Size: 592 B  | 
| 
		 After Width: | Height: | Size: 675 B  | 
@ -0,0 +1,344 @@ | 
				
			|||
<template> | 
				
			|||
  <div> | 
				
			|||
    <el-form :model="formData" ref="ref_searchform" :label-width="'120px'"> | 
				
			|||
      <el-form-item label="标题名称" prop="taskTitle"> | 
				
			|||
        <el-input v-model.trim="formData.taskTitle" type="textarea" size="small" clearable style=" height: 40px;" | 
				
			|||
          placeholder="请输入"> | 
				
			|||
        </el-input> | 
				
			|||
        <div style="margin-top: 10px;">(5-30个字符)</div> | 
				
			|||
      </el-form-item> | 
				
			|||
      <el-form-item label="请选择数据源" prop="taskTitle"> | 
				
			|||
      </el-form-item> | 
				
			|||
    </el-form> | 
				
			|||
    <div class="flex"  > | 
				
			|||
      <div class="flex" style=" position: relative;display: flex; flex-direction: column; align-items: center; justify-content: center; width: 155px;height: 90px;background: #F1F4FA;border-radius: 4px; margin-left: 20px;" v-for="(item, index) in dataSourceList"> | 
				
			|||
        <img style="width: 30px; height: 30px;" :src="item.image" alt=""> | 
				
			|||
        <span style="margin-top: 10px;">{{ item.name }}</span> | 
				
			|||
        <img v-if="item.status" style="width: 30px; height: 30px;position: absolute; top: 0;right: 0;"  src="@/assets/images/index/select.png" alt=""> | 
				
			|||
        <img v-if="!item.status" style="width: 30px; height: 30px;position: absolute; top: 0;right: 0;"  src="@/assets/images/index/notselect.png" alt=""> | 
				
			|||
      </div> | 
				
			|||
    </div> | 
				
			|||
    <div> | 
				
			|||
  </div> | 
				
			|||
  </div> | 
				
			|||
</template> | 
				
			|||
  <script> | 
				
			|||
import { requestPost } from "@/js/dai/request"; | 
				
			|||
export default { | 
				
			|||
  data() { | 
				
			|||
    return { | 
				
			|||
      dataSourceList:[ | 
				
			|||
        { | 
				
			|||
          name:"楼栋房屋信息一张表", | 
				
			|||
          image:"https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet-saas/dev/internal/20250114/003b8782213a487b8ce7d4267262d0ec.png", | 
				
			|||
          status:1 | 
				
			|||
        }, | 
				
			|||
        { | 
				
			|||
          name:"居民信息一张表", | 
				
			|||
          image:"https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet-saas/dev/internal/20250114/0c1e1ea17f8842e49bf5f1afeac72e42.png", | 
				
			|||
          status:0 | 
				
			|||
        }, | 
				
			|||
        { | 
				
			|||
          name:"单位信息一张表", | 
				
			|||
          image:"https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet-saas/dev/internal/20250114/211af7c657c9409fbccd11185edf0474.png", | 
				
			|||
          status:0 | 
				
			|||
        }, | 
				
			|||
        { | 
				
			|||
          name:"车辆信息一张表", | 
				
			|||
          image:"https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet-saas/dev/internal/20250114/bc3e4b1e89e84ed7bc31eb90bba6cbd6.png", | 
				
			|||
          status:0 | 
				
			|||
        }, | 
				
			|||
      ], | 
				
			|||
      formData: { | 
				
			|||
        taskTitle:"", | 
				
			|||
        importCategory: null, | 
				
			|||
        taskName: null, | 
				
			|||
      }, | 
				
			|||
      rules: { | 
				
			|||
        importCategory: [ | 
				
			|||
          { required: true, message: "请选择任务类型", trigger: "change" }, | 
				
			|||
        ], | 
				
			|||
        taskName: [ | 
				
			|||
          { required: true, message: "请输入任务名称", trigger: "change" }, | 
				
			|||
        ], | 
				
			|||
      }, | 
				
			|||
      resident_category_import_list: [], | 
				
			|||
      categoryName: "", | 
				
			|||
      createdFileName: null, | 
				
			|||
      createdFileUrl: null, | 
				
			|||
      dialogVisibleExtractExcelHead: false, | 
				
			|||
      dataListLoading: false, | 
				
			|||
      dataList: [], | 
				
			|||
      groupList: [], | 
				
			|||
      fileCode:null, | 
				
			|||
      fileList:[] | 
				
			|||
    }; | 
				
			|||
  }, | 
				
			|||
  props: {}, | 
				
			|||
  async created() { | 
				
			|||
    await this.getDictList(); | 
				
			|||
    await this.loadPersonGroup(); | 
				
			|||
  }, | 
				
			|||
  methods: { | 
				
			|||
    handelClearCategory() { | 
				
			|||
      this.categoryName = null; | 
				
			|||
    }, | 
				
			|||
    async loadPersonGroup() { | 
				
			|||
      const url = "/oper/customize/fileModeColumns/listModule"; | 
				
			|||
      // const url = 'http://yapi.elinkservice.cn/mock/245/gov/org/isServiceProject/service/serviceScopeTree' | 
				
			|||
      const { data, code, msg } = await requestPost(url); | 
				
			|||
      if (code === 0) { | 
				
			|||
        this.groupList = data; | 
				
			|||
      } else { | 
				
			|||
        this.$message.error(msg); | 
				
			|||
      } | 
				
			|||
    }, | 
				
			|||
    async handleSelGroup(index, item, change) { | 
				
			|||
      const url = "/oper/customize/fileModeColumns/listField"; | 
				
			|||
      // const url = 'http://yapi.elinkservice.cn/mock/245/gov/org/isServiceProject/service/serviceScopeTree' | 
				
			|||
      let params ={ | 
				
			|||
        REVISION: 1010, | 
				
			|||
        fileModeCode:this.form.importCategory, | 
				
			|||
      }; | 
				
			|||
      const { data, code, msg } = await requestPost(url, params); | 
				
			|||
      if (code === 0) { | 
				
			|||
        let oneData = this.dataList[index]; | 
				
			|||
        if (change == "change") { | 
				
			|||
          this.dataList[index].itemId = ""; | 
				
			|||
        } | 
				
			|||
        oneData.itemList = data; | 
				
			|||
        this.$set(this.dataList, index, oneData); | 
				
			|||
        console.log(this.dataList); | 
				
			|||
      } else { | 
				
			|||
        this.$message.error(msg); | 
				
			|||
      } | 
				
			|||
    }, | 
				
			|||
    handelClickCategory(label) { | 
				
			|||
      this.categoryName = label; | 
				
			|||
    }, | 
				
			|||
    async checkExtractExcelHead() { | 
				
			|||
      const url = "/actual/base/intelligentImportData/extractExcelHead"; | 
				
			|||
      let params = { | 
				
			|||
        originFileName: this.createdFileName, | 
				
			|||
        originalFilePath: this.createdFileUrl, | 
				
			|||
        importCategory: this.form.importCategory, | 
				
			|||
      }; | 
				
			|||
      const { data, code, msg } = await requestPost(url, params); | 
				
			|||
      if (code === 0) { | 
				
			|||
        this.dialogVisibleExtractExcelHead = true; | 
				
			|||
        const { metaListData, fileCode, msg } = data; | 
				
			|||
        this.dataList = metaListData; | 
				
			|||
        this.fileCode = fileCode; | 
				
			|||
        let groupMap = new Map( | 
				
			|||
          this.groupList.map((item) => [item.label, item]) | 
				
			|||
        ); | 
				
			|||
        for (let i in this.dataList) { | 
				
			|||
          this.handleSelGroup(i, groupMap.get(this.dataList[i].fileModeCode)); | 
				
			|||
        } | 
				
			|||
        this.dataListLoading = false; | 
				
			|||
      } else if (code >= 8000) { | 
				
			|||
        this.$message.err(msg); | 
				
			|||
        this.dataListLoading = false; | 
				
			|||
      } | 
				
			|||
    }, | 
				
			|||
    async getDictList() { | 
				
			|||
      const url = "/sys/dict/data/dictlist"; | 
				
			|||
      const { data, code, msg } = await requestPost(url, { | 
				
			|||
        dictType: "resident_category_import", | 
				
			|||
      }); | 
				
			|||
      if (code === 0) { | 
				
			|||
        this.resident_category_import_list = [...data]; | 
				
			|||
      } else { | 
				
			|||
        this.$message.err("字典错误"); | 
				
			|||
      } | 
				
			|||
    }, | 
				
			|||
    beforeExcelUpload(file) { | 
				
			|||
      this.dataListLoading = true; | 
				
			|||
      const isType = file.type === "application/vnd.ms-excel"; | 
				
			|||
      const isTypeComputer = | 
				
			|||
        file.type === | 
				
			|||
        "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"; | 
				
			|||
      const fileType = isType || isTypeComputer; | 
				
			|||
      const isLt1M = file.size / 1024 / 1024 < 50; | 
				
			|||
      if (!fileType) { | 
				
			|||
        this.$message.error("上传文件只能是xls/xlsx格式!"); | 
				
			|||
      } | 
				
			|||
      if (!isLt1M) { | 
				
			|||
        this.$message.error("上传文件大小不能超过 10MB!"); | 
				
			|||
      } | 
				
			|||
      if (!this.form.importCategory || !this.form.taskName) { | 
				
			|||
        this.$message.error("请完善基本信息!"); | 
				
			|||
        this.dataListLoading = false; | 
				
			|||
        return false; | 
				
			|||
      } | 
				
			|||
      return fileType && isLt1M; | 
				
			|||
    }, | 
				
			|||
    async uploadHttpRequest(file) { | 
				
			|||
      const formData = new FormData(); | 
				
			|||
      formData.append("file", file.file); | 
				
			|||
      await this.$http | 
				
			|||
        .post("/actual/base/intelligentImportData/uploadFile", formData) | 
				
			|||
        .then((res) => { | 
				
			|||
          if (res.data.code == 0) { | 
				
			|||
            const { fileName, url } = res.data.data; | 
				
			|||
            this.createdFileName = fileName; | 
				
			|||
            this.createdFileUrl = url; | 
				
			|||
            this.fileList.push({name:fileName,url:url}) | 
				
			|||
            this.checkExtractExcelHead(); | 
				
			|||
          } else { | 
				
			|||
            this.$message.error(res.data.msg); | 
				
			|||
            this.dataListLoading = false; | 
				
			|||
          } | 
				
			|||
        }) | 
				
			|||
        .catch((err) => { | 
				
			|||
          console.log("失败", err); | 
				
			|||
          file.onError(); //上传失败的文件会从文件列表中删除 | 
				
			|||
          this.dataListLoading = false; | 
				
			|||
        }); | 
				
			|||
      this.$refs.upload.clearFiles(); | 
				
			|||
    }, | 
				
			|||
    removeFile(){ | 
				
			|||
      this.fileList = []; | 
				
			|||
    }, | 
				
			|||
    // 下载全部模板 | 
				
			|||
    async handleExportModuleAll() { | 
				
			|||
      let url = "/actual/base/residentBaseInfo/import/download-template"; | 
				
			|||
      let params = {}; | 
				
			|||
      await this.$http({ | 
				
			|||
        method: "POST", | 
				
			|||
        url, | 
				
			|||
        responseType: "blob", | 
				
			|||
        data: params, | 
				
			|||
      }) | 
				
			|||
        .then((res) => { | 
				
			|||
          console.log(res); | 
				
			|||
          const url = window.URL.createObjectURL(new Blob([res.data])); | 
				
			|||
          const aLink = document.createElement("a"); | 
				
			|||
          aLink.style.display = "none"; | 
				
			|||
          aLink.href = url; | 
				
			|||
          aLink.setAttribute("download", "全部模板.zip"); | 
				
			|||
          document.body.appendChild(aLink); | 
				
			|||
          aLink.click(); | 
				
			|||
          document.body.removeChild(aLink); | 
				
			|||
          window.URL.revokeObjectURL(url); | 
				
			|||
        }) | 
				
			|||
        .catch((err) => { | 
				
			|||
          console.log("err", err); | 
				
			|||
          return this.$message.error("网络错误"); | 
				
			|||
        }); | 
				
			|||
    }, | 
				
			|||
    // 下载单个模板 | 
				
			|||
    async handelClickDownModule() { | 
				
			|||
      let url = "/actual/base/intelligentImportData/autoGenerateExcelModule"; | 
				
			|||
      let params = { | 
				
			|||
        importCategory: this.form.importCategory, | 
				
			|||
      }; | 
				
			|||
      await this.$http({ | 
				
			|||
        method: "POST", | 
				
			|||
        url, | 
				
			|||
        responseType: "blob", | 
				
			|||
        data: params, | 
				
			|||
      }) | 
				
			|||
        .then((res) => { | 
				
			|||
          if (res.status==200) { | 
				
			|||
            // let fileName = window.decodeURI( | 
				
			|||
            // 	res.headers["content-disposition"] | 
				
			|||
            // 		.split(";")[1] | 
				
			|||
            // 		.split("=")[1] | 
				
			|||
            // ); | 
				
			|||
            let fileName = `${ | 
				
			|||
              this.$store.state.user.agencyName + this.categoryName | 
				
			|||
            }导入模板`; | 
				
			|||
            let blob = new Blob([res.data], { | 
				
			|||
              type: "application/vnd.ms-excel", | 
				
			|||
            }); | 
				
			|||
            var url = window.URL.createObjectURL(blob); | 
				
			|||
            var aLink = document.createElement("a"); | 
				
			|||
            aLink.style.display = "none"; | 
				
			|||
            aLink.href = url; | 
				
			|||
            aLink.setAttribute("download", fileName); | 
				
			|||
            document.body.appendChild(aLink); | 
				
			|||
            aLink.click(); | 
				
			|||
            document.body.removeChild(aLink); //下载完成移除元素 | 
				
			|||
            window.URL.revokeObjectURL(url); //释放掉blob对象 | 
				
			|||
          } else this.$message.error("下载失败"); | 
				
			|||
          // let fileName = `${ | 
				
			|||
          //     this.$store.state.user.agencyName + this.categoryName | 
				
			|||
          //   }导入模板`; | 
				
			|||
          // const url = res.data.data; | 
				
			|||
          // const aLink = document.createElement("a"); | 
				
			|||
          // aLink.style.display = "none"; | 
				
			|||
          // aLink.href = url; | 
				
			|||
          // aLink.setAttribute("download",`${fileName}.xlsx`); | 
				
			|||
          // document.body.appendChild(aLink); | 
				
			|||
          // aLink.click(); | 
				
			|||
          // document.body.removeChild(aLink); | 
				
			|||
          // window.URL.revokeObjectURL(url); | 
				
			|||
        }) | 
				
			|||
        .catch((err) => { | 
				
			|||
          console.log(err); | 
				
			|||
          return this.$message.error("网络错误"); | 
				
			|||
        }); | 
				
			|||
    }, | 
				
			|||
    handelClickUpload() { | 
				
			|||
      this.$refs["importForm"].validate((valid) => { | 
				
			|||
        if (valid) { | 
				
			|||
          this.saveImportResiHouseExcel(); | 
				
			|||
        } | 
				
			|||
      }); | 
				
			|||
    }, | 
				
			|||
    async saveImportResiHouseExcel() { | 
				
			|||
      const { fileCode, dataList } = this; | 
				
			|||
      if (!fileCode) { | 
				
			|||
        this.$message.error("请先上传文件"); | 
				
			|||
        return; | 
				
			|||
      } | 
				
			|||
      let obj = dataList.reduce((acc, item) => { | 
				
			|||
        if (item.userTableHeader) { | 
				
			|||
          acc[item.userTableHeader] = item.itemId; | 
				
			|||
        } | 
				
			|||
        return acc; | 
				
			|||
      }, {}); | 
				
			|||
      const formData = new FormData(); | 
				
			|||
      formData.append("columnMateJson", JSON.stringify(obj)); | 
				
			|||
      formData.append("fileCode", fileCode); | 
				
			|||
      formData.append("taskName", this.form.taskName); | 
				
			|||
      await this.$http | 
				
			|||
        .post( | 
				
			|||
          "/actual/base/intelligentImportData/importResiHouseExcel", | 
				
			|||
          formData | 
				
			|||
        ) | 
				
			|||
        .then((res) => { | 
				
			|||
          if (res.data.code == 0 && res.data.msg == "success") { | 
				
			|||
            this.$emit("handelClickUpload", fileCode); | 
				
			|||
          } else this.$message.error(res.data.msg); | 
				
			|||
        }) | 
				
			|||
        .catch((err) => { | 
				
			|||
          console.log("失败", err); | 
				
			|||
          file.onError(); | 
				
			|||
        }); | 
				
			|||
    }, | 
				
			|||
    handelClickBack() { | 
				
			|||
      this.$emit("handelClickBack"); | 
				
			|||
    }, | 
				
			|||
  }, | 
				
			|||
  components: {}, | 
				
			|||
  computed: {}, | 
				
			|||
  watch: {}, | 
				
			|||
}; | 
				
			|||
</script> | 
				
			|||
  <style lang="scss" scoped> | 
				
			|||
@import "@/assets/scss/buttonstyle.scss"; | 
				
			|||
@import "@/assets/scss/modules/management/detail-main.scss"; | 
				
			|||
@import "@/assets/scss/pages/smartImport.scss"; | 
				
			|||
.uploadList{ | 
				
			|||
  width: 99%; | 
				
			|||
  height: 180px; | 
				
			|||
  border: 1px dashed  #ccc; | 
				
			|||
  border-radius: 5px; | 
				
			|||
  display: flex; | 
				
			|||
  justify-content: center; | 
				
			|||
  align-items: center; | 
				
			|||
} | 
				
			|||
</style> | 
				
			|||
   | 
				
			|||
@ -0,0 +1,115 @@ | 
				
			|||
<template> | 
				
			|||
  <div class="m-detail-main"> | 
				
			|||
      <div class="steps1"> | 
				
			|||
        <el-steps :active="progress"> | 
				
			|||
          <el-step | 
				
			|||
            :class="[this.operatorName == null ? 'showNum' : '']"  | 
				
			|||
            title="填写基本信息" | 
				
			|||
            :description="`${this.operatorName}(${this.createdTime})`" | 
				
			|||
          ></el-step> | 
				
			|||
          <el-step | 
				
			|||
            title="上传表格文件" | 
				
			|||
            :class="[this.progress == 2 || this.progress == 3 ? '' : 'showNum']" | 
				
			|||
          ></el-step> | 
				
			|||
          <el-step title="配置表格文字"></el-step> | 
				
			|||
        </el-steps> | 
				
			|||
      </div> | 
				
			|||
      <div style="margin-top: 37px"> | 
				
			|||
        <excelCeatedTask | 
				
			|||
          v-if="progress == 1" | 
				
			|||
          @handelClickUpload="handelClickUpload" | 
				
			|||
          @handelClickBack="handelClickBack" | 
				
			|||
        ></excelCeatedTask> | 
				
			|||
        <excelCeatedTask | 
				
			|||
          v-if="progress == 2" | 
				
			|||
          @successImport="successImport" | 
				
			|||
          @handelClickBack="handelClickBack" | 
				
			|||
          @updateProgress="updateProgress" | 
				
			|||
          :fileCode="fileCode" | 
				
			|||
          :fileCodeRow="fileCodeRow" | 
				
			|||
          @updateoperatorName="updateoperatorName" | 
				
			|||
        ></excelCeatedTask> | 
				
			|||
        <excelCeatedTask | 
				
			|||
          v-if="progress == 3" | 
				
			|||
          @handelClickBack="handelClickBack" | 
				
			|||
          :fileCodeRow="fileCodeRow" | 
				
			|||
          @updateoperatorName="updateoperatorName" | 
				
			|||
          :fileCode="fileCode" | 
				
			|||
        ></excelCeatedTask> | 
				
			|||
      </div> | 
				
			|||
 | 
				
			|||
  </div> | 
				
			|||
</template> | 
				
			|||
  <script> | 
				
			|||
  import excelCeatedTask from './excel-created-task.vue'; | 
				
			|||
export default { | 
				
			|||
  data() { | 
				
			|||
    return { | 
				
			|||
      progress: 1, | 
				
			|||
      fileCode: null, | 
				
			|||
      progressNum: null, | 
				
			|||
      createdTime: null, | 
				
			|||
      operatorName: null, | 
				
			|||
    }; | 
				
			|||
  }, | 
				
			|||
  props: { | 
				
			|||
    fileCodeRow: { | 
				
			|||
      type: String, | 
				
			|||
      default: null, | 
				
			|||
    }, | 
				
			|||
    taskId: { | 
				
			|||
      type: String, | 
				
			|||
      default: null, | 
				
			|||
    }, | 
				
			|||
    processStatus: { | 
				
			|||
      type: String, | 
				
			|||
      default: null, | 
				
			|||
    }, | 
				
			|||
  }, | 
				
			|||
  created() { | 
				
			|||
    console.log(this.processStatus); | 
				
			|||
    if (this.processStatus) { | 
				
			|||
      this.progress = this.processStatus == "processing" ? 2 : 3; | 
				
			|||
    } | 
				
			|||
  }, | 
				
			|||
  methods: { | 
				
			|||
    handelClickUpload(fileCode) { | 
				
			|||
      this.progress = 2; | 
				
			|||
      this.fileCode = fileCode; | 
				
			|||
    }, | 
				
			|||
    handelClickBack() { | 
				
			|||
      this.$emit("handleClose"); | 
				
			|||
    }, | 
				
			|||
    successImport() { | 
				
			|||
      this.progress = 3; | 
				
			|||
      this.progressNum = 100; | 
				
			|||
    }, | 
				
			|||
    updateProgress(num) { | 
				
			|||
      if(num > 100){ | 
				
			|||
        this.progress = 3; | 
				
			|||
        this.progressNum = 100; | 
				
			|||
      }else{ | 
				
			|||
        this.progressNum = num; | 
				
			|||
      } | 
				
			|||
    }, | 
				
			|||
    updateoperatorName({ operatorName, createdTime }) { | 
				
			|||
      this.operatorName = operatorName; | 
				
			|||
      this.createdTime = createdTime; | 
				
			|||
    }, | 
				
			|||
  }, | 
				
			|||
  components: {excelCeatedTask }, | 
				
			|||
  computed: {}, | 
				
			|||
  watch: {}, | 
				
			|||
}; | 
				
			|||
</script> | 
				
			|||
  <style lang="scss" scoped> | 
				
			|||
@import "@/assets/scss/buttonstyle.scss"; | 
				
			|||
@import "@/assets/scss/modules/management/detail-main.scss"; | 
				
			|||
@import "@/assets/scss/pages/smartImport.scss"; | 
				
			|||
.showNum { | 
				
			|||
  /deep/.el-step__description { | 
				
			|||
    display: none; | 
				
			|||
  } | 
				
			|||
} | 
				
			|||
</style> | 
				
			|||
   | 
				
			|||
					Loading…
					
					
				
		Reference in new issue