智能填表

src/assets/scss/pages/smartImport.scss

@@ -99,6 +99,46 @@
         color: #666666;
       }
       
+  }
+  .steps1 {
+    width: 80%;
+    /deep/ .el-step__main {
+      position: absolute;
+      left: 24px;
+      top: -5px;
+      z-index: 10;
+      background: #fff;
+      width: 120px;
+      padding-left: 10px;
+    }
+    /deep/ .is-finish {
+      .el-step__icon {
+        background: #0056d6;
+        color: #fff;
+      }
+    }
+    /deep/ .is-process  {
+        color: #000;
+        font-weight: 400;
+        .el-step__icon {
+          background: #cbcbcb;
+          color: #fff;
+          border-color: #cbcbcb;
+        }
+      }
+      /deep/ .is-wait  {
+        color: #000;
+        .el-step__icon {
+          background: #cbcbcb;
+          color: #fff;
+          border-color: #cbcbcb;
+        }
+      }
+      /deep/ .el-step__description{
+        width: 300px;
+        color: #666666;
+      }
+      
   }
   @keyframes rotate {
     from {

src/views/modules/base/smartExcel/cpts/excel-created-task.vue

@@ -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>
+  

src/views/modules/base/smartExcel/cpts/excel-upload-data.vue

@@ -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>
+  

src/views/modules/base/smartExcel/cpts/excel-view.vue

@@ -13,6 +13,7 @@
       <div class="top_btn flex flex-end">
         <div>
           <el-button type="warning" @click="getAllTables"> 自动检测</el-button>
+          <el-button type="warning" @click="onClickUplond()"> 智能填表</el-button>
         </div>
         <div>
           <el-button type="danger"> 驳回重提</el-button>
@@ -21,11 +22,15 @@
       </div>
       <div id="luckysheet"></div>
     </div>
+    <el-dialog title="上传共享数据" :visible.sync="showUploadData" width="50%" :close-on-click-modal="false">
+      <excelUploadData   @handelUploadData="handelUploadData">
+      </excelUploadData>
+    </el-dialog>
   </div>
 </template>
 
 <script>
-
+import excelUploadData from './excel-upload-data.vue';
 import LuckyExcel from 'luckyexcel';
 import options from "@/utils/luckysheetConfig.js";
 import { mapGetters } from 'vuex'
@@ -34,6 +39,7 @@ import { requestPost, requestGet } from "@/js/dai/request";
 export default {
   data() {
     return {
+      showUploadData:false,
       menuList: [
         {
           name: '2024年11月第三周（已提交）'
@@ -78,6 +84,12 @@ export default {
     })
   },
   methods: {
+    onClickUplond(){
+      this.showUploadData=true
+    },
+    handelUploadData(){
+      this.showUploadData=false
+    },
     loadWorkBook() {
       window.luckysheet.destroy();
       const { id } = this.$store.state.user;
@@ -203,6 +215,12 @@ export default {
       })
     },
   },
+  components:{
+    excelUploadData
+  },
+  components:{
+    excelUploadData
+  },
   beforeDestroy() {
     this.$store.state.sidebarFold = false;
     if (this.socket) {

src/views/modules/base/smartExcel/index.vue

@@ -9,7 +9,6 @@
                 :options="orgOptions" :props="orgOptionProps" :show-all-levels="false" @change="handleChangeAgency"
                 clearable></el-cascader>
             </el-form-item> -->
-
             <el-form-item label="任务主题" prop="taskTitle">
               <el-input v-model.trim="formData.taskTitle" class="u-item-width-normal" size="small" clearable
                 placeholder="请输入">

src/views/modules/base/smartImport/index.vue

@@ -71,7 +71,6 @@
       </div>
     </div>
     <div v-if="pageType == 'add'">
-      <!-- :eventDetailData="eventDetailData" -->
             <smart-import-info ref="eleEditForm" :pageType="pageType"  
                 @handleClose="handleClose" @handleOk="handleOk" :fileCodeRow="fileCode" :taskId="taskId" :processStatus="processStatus"/>
         </div>

vue.config.js

@@ -55,6 +55,13 @@ module.exports = {
   },
   // webpack简单配置
   configureWebpack: {
+    module: {
+      rules: [{
+        test: /\.mjs$/,
+        include: /node_modules/,
+        type: 'javascript/auto'
+      }]
+    },
     // debuge调试配置
     devtool: "source-map",
     externals: {