commit

index.html

@@ -21,6 +21,7 @@
 	<link rel='stylesheet' href='https://hzstatic.hzinsights.com/static/cdn/Luckysheet@2.1.13/dist/plugins/plugins.css' />
 	<link rel='stylesheet' href='https://hzstatic.hzinsights.com/static/cdn/Luckysheet@2.1.13/dist/css/luckysheet.css' />
 	<link rel='stylesheet' href='https://hzstatic.hzinsights.com/static/cdn/Luckysheet@2.1.13/dist/assets/iconfont/iconfont.css' />
+	<script src="https://cdn.jsdelivr.net/npm/luckyexcel/dist/luckyexcel.umd.js"></script>
 	
 	<!-- dataTables -->
 	<link rel="stylesheet" type="text/css" href="./static/css/jquery.dataTables.css"/>

src/views/datasheet_manage/customAnalysis/addAnalysisSheet.vue

@@ -1,8 +1,24 @@
 <template>
   <div class="addSheet-wrap">
-    <div :class="['main',{'full-height':$route.path!=='/addAnalysisSheet'}]">
+    <div :class="['main',{'full-height':$route.path!=='/addAnalysisSheet'}]" v-loading="isLoading">
       <div class="left-section">
-        <Sheet ref="sheetRef" :option="sheetConfig"/> 
+        <el-tabs 
+          v-model="selectIndex" 
+          type="card" 
+          closable
+          @tab-remove="handleRemoveSheet"
+          @tab-click="switchSheetHandle"
+        >
+          <el-tab-pane
+            :key="item.name"
+            v-for="(item,index) in uploadSheetsList"
+            :label="item.name"
+            :name="String(index)"
+          />
+        </el-tabs>
+        <div class="sheet-wrapper" v-if="sheetConfig.data">
+          <Sheet ref="sheetRef" :option="sheetConfig"/>
+        </div>
       </div>
 
       <rightSection v-if="$route.path!=='/addAnalysisSheet'"/>
@@ -22,8 +38,16 @@ import bottomSection from './components/uploadBottomSection.vue'
 import rightSection from './components/rightSection.vue';
 export default {
   components: { Sheet,bottomSection,rightSection },
+  computed: {
+    files() {
+      return this.$store.state.sheet.files;
+    }
+  },
   data() {
     return {
+      isLoading: false,
+      uploadSheetsList: [],
+      selectIndex: '0',
       sheetConfig: {
         showsheetbar: true,
         // data: []
@@ -33,7 +57,17 @@ export default {
   methods: {
 
     backHandle() {
-      window.close();
+      this.$router.go(-1);
+    },
+
+    loadDataSync(sheets) {
+
+      // let data = 
+    },
+
+    /* 切换表格 */
+    switchSheetHandle() {
+      
     },
 
     /* 获取分类 */
@@ -45,6 +79,47 @@ export default {
       })
     },
 
+    handelTranslateData(e) {
+        LuckyExcel.transformExcelToLucky(e, (exportJson, luckysheetfile) =>{
+                                  
+            if(exportJson.sheets==null || exportJson.sheets.length==0){
+                this.$message.warning('解析文件失败')
+                return;
+            }
+            console.log(exportJson,luckysheetfile)
+
+            window.luckysheet.destroy()
+
+            // this.loadDataSync(exportJson.sheets);
+
+            this.sheetConfig.data = exportJson.sheets.map(_ => ({
+              index: _.index, //工作表索引
+              order: _.order, //工作表的下标
+              name: _.name,
+              calcChain: _.calcChain,
+              celldata: _.celldata,
+              config: _.config,
+            }));
+
+            this.isLoading = false
+            // this.$refs.sheetRef.init();
+
+            console.log(this.sheetConfig)
+        });
+
+    },
+
+    /* 移除表格 */
+    handleRemoveSheet(name) {
+      console.log(name)
+      let index = this.uploadSheetsList.findIndex(_ => _.name === name)
+      this.uploadSheetsList.splice(index,1)
+
+      if(this.uploadSheetsList.length === 1) {
+        this.backHandle()
+      }
+    },
+
 
     /* 保存表格 */
     saveSheetHandle: _.debounce(async function() {
@@ -92,6 +167,12 @@ export default {
   },
   mounted() {
     this.getClassify();
+    if(this.files) {
+      this.uploadSheetsList =  Object.values(this.files);
+      this.isLoading = true;
+      this.handelTranslateData(this.uploadSheetsList[Number(this.selectIndex)])
+      this.$store.commit('sheet/SET_UPLOADFIlES',null)
+    }
   }
 }
 </script>
@@ -124,13 +205,27 @@ export default {
     position: relative;
     min-height: 700px;
     .left-section {
-      position:relative;
       flex:1;
-      margin-right: 20px;
+      .sheet-wrapper {
+        position: relative;
+        min-height: 700px;
+      }
+    
     }
     &.full-height {
       min-height: calc(100vh - 120px);
     }
   }
 }
+</style>
+<style lang="scss">
+.addSheet-wrap {
+  .el-tabs__nav {
+    background: #fff;
+  }
+  .el-tabs__header {
+    margin-bottom: 0;
+    // border-bottom: none;
+  }
+}
 </style>

src/views/datasheet_manage/customAnalysis/components/rightSection.vue

@@ -120,6 +120,7 @@ export default {
   border-radius: 4px;
   border: 1px solid #C8CDD9;
   background: #FFF;
+  margin-left: 20px;
   .create-cont {
     .head {
       padding: 14px;

src/views/datasheet_manage/customAnalysis/components/uploadBottomSection.vue

@@ -2,7 +2,7 @@
   <div class="bottom-section">
 
     <!-- 无同名 -->
-    <!-- <div>
+    <div>
       <div class="page-list">
         <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange" style="margin-right:30px">全部</el-checkbox>
         <el-checkbox-group v-model="sheetChecked" @change="handleCheckedCitiesChange">
@@ -29,10 +29,10 @@
           <i class="el-icon-warning"/>
         </el-tooltip>
       </div>
-    </div> -->
+    </div>
 
     <!-- 有同名文件 -->
-    <div>
+    <!-- <div>
       <div class="same-page-item">
         <label>
           <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
@@ -59,7 +59,7 @@
       </div>
 
       <el-button type="primary">保存</el-button>
-    </div>
+    </div> -->
 
   </div>
 </template>

src/views/datasheet_manage/customAnalysis/list.vue

@@ -10,9 +10,15 @@
     <div class="data-sheet-main" id="box">
       <div class="main-left left" id="left" v-show="!isSlideLeft">
         <div class="datasheet_top">
-          <el-button v-permission="permissionBtn.etaTablePermission.etaTable_excel"
-            type="primary" style="margin-right:20px" @click="goAddSheetHandle"
+          
+          <el-button 
+            v-permission="permissionBtn.etaTablePermission.etaTable_excel"
+            type="primary" 
+            style="margin-right:20px"
+            :loading="isUploadLoading"
+            @click="clickUpload"
           >上传文件</el-button>
+          <input type="file" multiple @change="fileSelected" id="file"  style="display: none;">
           
           <el-button>
             <el-checkbox v-model="isShowMe"  @change="() => { getTreeData();getPublicList() }">只看我的</el-checkbox>
@@ -427,14 +433,6 @@ export default {
     },
   },
   methods: {
-    /* 添加表格 */
-    goAddSheetHandle(type) {
-      if (!this.treeData.length)
-        return this.$message.warning("请先添加表格分类");
- 
-      const { href } = this.$router.resolve({ path: '/addAnalysisSheet' });
-      window.open(href, "_blank");
-    },
 
     /* 获取表格分类 */
     getTreeData(params = null) {
@@ -812,6 +810,31 @@ export default {
             return checkPermissionBtn(etaTablePermission.etaTable_customize_del)
         }
     },
+
+    clickUpload() {
+      $(`#file`).click()
+    },
+
+    //选择文件上传
+    fileSelected(){ 
+      let files = document.getElementById('file').files;
+      console.log(files)
+      if(files.length){
+
+        for(let i = 0;i<files.length;i++) {
+          if(!files[i].name.includes('.xlsx')) return this.$message.warning("上传失败，格式不符合xlsx");
+          if(files[i].size > 10*1024*1024) return this.$message.warning("上传文件最大不能超过10M");
+
+          if(i === files.length - 1) {
+            this.$store.commit('sheet/SET_UPLOADFIlES',files)
+            this.$router.push({ path: '/addAnalysisSheet' });
+          }
+        }
+
+
+      } 
+		},
+
   },
   mounted() {
     if (this.$route.query.code) {

src/vuex/index.js

@@ -5,6 +5,7 @@ import sand from "./modules/sand";
 import ppt from "./modules/ppt";
 import edb from "./modules/edb";
 import permissionButton from "./modules/permissionButton";
+import sheet from "./modules/sheet";
 
 // 应用初始状态
 const state = {
@@ -37,5 +38,6 @@ export default {
     ppt,
     edb,
     permissionButton,
+    sheet
   },
 };

src/vuex/modules/sheet.js

@@ -0,0 +1,14 @@
+
+const sheet = {
+  namespaced: true,
+  state: {
+    files: null, 
+  },
+
+  mutations: {
+    SET_UPLOADFIlES(state,files) {
+      state.files = files
+    }
+  }
+}
+export default sheet;