tabs切换

src/components/Query/clickQuery/MultiLevelQuery.vue

@@ -20,7 +20,7 @@
         </el-tab-pane>
 
         <el-tab-pane :closable="item.close" :label="item.name" :name="item.name"
-            v-for="(item, index) in store.state.query_pick_pane" :key="index">
+            v-for="(item, index) in store.state.query_pick_pane" :key="index" v-if="item.show">
 
             <div v-if="item.name != '权属'">
                 <el-table :data="tableData" style="width: 100%" :header-cell-style="{
@@ -63,9 +63,9 @@
 
         <el-tab-pane label="自定义" name="自定义">
             <!-- <el-input clearable v-model="state" @input="change_witch" class="search" placeholder="请输入内容"></el-input> -->
-            <el-checkbox-group v-model="activecheckList">
-                <el-checkbox :label="item.label" v-for="(item, index) in check_list" :key="index"
-                    :disabled="item.ckeck"></el-checkbox>
+            <el-checkbox-group v-model="check_list_active">
+                <el-checkbox v-model="item.ckeck" :label="item.label" v-for="(item, index) in check_list"
+                    :key="index"></el-checkbox>
 
             </el-checkbox-group>
             <div style="margin-bottom: 20px;">
@@ -106,7 +106,9 @@ export default {
             tabIndex: 2,
             state: '',
             activecheckList: [],
-            check_list: [{ label: '三调', ckeck: true }, { label: '权属', ckeck: true }, { label: '农用' }, { label: '上映' }],
+            // check_list: [{ label: '三调', ckeck: true }, { label: '权属', ckeck: true }, { label: '农用' }, { label: '上映' }],
+            check_list_active: [],
+            check_list: [],
             active_tabs_table: [],
             rawData: [],
             headers: [], // 用于存储所有可能的 filedZH 值 
@@ -176,21 +178,21 @@ export default {
 
         },
         removeTab(targetName) {
-            let tabs = store.state.query_pick_pane;
-            let activeName = this.activeName;
-            if (activeName === targetName) {
-                tabs.forEach((tab, index) => {
-                    if (tab.name === targetName) {
-                        let nextTab = tabs[index + 1] || tabs[index - 1];
-                        if (nextTab) {
-                            activeName = nextTab.name;
-                        }
-                    }
-                });
-            }
+            // let tabs = store.state.query_pick_pane;
+            // let activeName = this.activeName;
+            // if (activeName === targetName) {
+            //     tabs.forEach((tab, index) => {
+            //         if (tab.name === targetName) {
+            //             let nextTab = tabs[index + 1] || tabs[index - 1];
+            //             if (nextTab) {
+            //                 activeName = nextTab.name;
+            //             }
+            //         }
+            //     });
+            // }
 
-            this.activeName = activeName;
-            store.state.query_pick_pane = tabs.filter(tab => tab.name !== targetName);
+            // this.activeName = activeName;
+            // store.state.query_pick_pane = tabs.filter(tab => tab.name !== targetName);
         },
         addTab() {
             // let newTabName = ++this.tabIndex + '';
@@ -204,19 +206,37 @@ export default {
             // this.activeName = newTabName;
 
 
-            this.activecheckList.forEach((res) => {
+            // this.activecheckList.forEach((res) => {
 
-                store.state.query_pick_pane.push({
+            //     store.state.query_pick_pane.push({
 
-                    name: res,
-                    value: [1, 2, 3, 4],// element.data
-                    close: 'closable'
+            //         name: res,
+            //         value: [1, 2, 3, 4],// element.data
+            //         close: 'closable'
 
-                });
+            //     });
 
-                this.activeName = res;
+            //     this.activeName = res;
 
-            })
+            // })
+
+            // store.state.query_pick_pane
+            console.log(this.check_list_active, "this.check_list_active");
+            console.log('store.state.query_pick_pane: ', store.state.query_pick_pane);
+            // this.check_list_active.forEach((res) => {
+            //     store.state.query_pick_pane.forEach((item) => {
+
+            //         if (item.name == res) {
+            //             console.log('item.name == res: ', item.name, res);
+            //             item.show = true;
+            //         } else {
+            //             item.show = false;
+
+            //         }
+            //     })
+            // })
+
+            this.updateShowProperties(this.check_list_active, store.state.query_pick_pane)
         },
 
         go(e) {
@@ -358,6 +378,7 @@ export default {
 
                 for (let index = 0; index < data.data.length; index++) {
                     const element = data.data[index];
+                    console.log('element: ', element);
                     let tableId = element.tableId;
                     let pane_obj = {
                         // sourcePointWkt: wkt,
@@ -384,13 +405,32 @@ export default {
 
                     } else {
                         let res = await GetTabsPane(pane_obj);
+                        if (element.defaultType == "0") {
+                            // store.state.query_pick_pane.push({
+                            //     name: element.name,
+                            //     value: res,
+                            //     close: 'closable',
+                            //     show: true
+                            // });
+                            this.check_list_active.push(element.name);
+                        } else {
+
+                        }
 
                         store.state.query_pick_pane.push({
                             name: element.name,
                             value: res,
-                            close: 'closable'
+                            close: 'closable',
+                            show: element.defaultType == '0' ? true : false
                         });
                     }
+
+                    this.check_list.push({
+                        label: element.name,
+                        ckeck: element.defaultType == '0' ? true : false
+                    });
+
+
                 }
 
                 this.highlightResults(longitude, latitude);
@@ -401,6 +441,19 @@ export default {
 
 
         },
+        updateShowProperties(firstArray, secondArray) {
+            // 创建一个映射表，用于快速查找第一个数组中的元素  
+            const firstArrayMap = new Map(firstArray.map(name => [name, true]));
+
+            // 遍历第二个数组，更新show属性  
+            secondArray.forEach(obj => {
+                // 如果在第一个数组中存在对应的name，则show为true；否则为false  
+                obj.show = firstArrayMap.has(obj.name);
+            });
+
+            // 返回更新后的secondArray，虽然原始数组被直接修改  
+            return secondArray;
+        }, 
         handleClick(tab, event) {
             let index = Number(tab.index) - 1