删除功能

src/components/Query/clickQuery/MultiLevelQuery.vue

@@ -1,5 +1,6 @@
 <template>
-    <el-tabs class="multi_level_query_table" v-model="activeName" @tab-click="handleClick" @tab-remove="removeTab">
+    <el-tabs class="multi_level_query_table" v-if="store.state.query_pick_pane.length > 0" v-model="activeName"
+        @tab-click="handleClick" @tab-remove="removeTab">
 
 
         <el-tab-pane :label="store.state.query_pick_last_pane.name" name="second">
@@ -10,21 +11,29 @@
                 fontFamily: 'Microsoft YaHei',
                 fontWeight: '400',
             }" :data="store.state.query_pick_last_pane.value" style="width: 100%">
-                <el-table-column show-overflow-tooltip="true" prop="filedZH" label="属性" width="140">
+                <el-table-column show-overflow-tooltip="true" prop="filedZH" label="属性" width="140"
+                    v-if="filedZH != '空间信息'">
                 </el-table-column>
                 <el-table-column show-overflow-tooltip="true" prop="data" label="属性值">
                 </el-table-column>
             </el-table>
         </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">
-            <pie class="echart" :class="item.name == '权属' ? 'echart1' : ''" unit="亩" :ref="`echartRef`"></pie>
 
-            <el-table :data="tableData" border style="width: 100%">
-                <el-table-column v-for="header in headers" :key="header" :label="header" :prop="header" v-if="header != '空间信息'">
+            <el-table :data="tableData" style="width: 100%" :header-cell-style="{
+                background: 'rgba(10, 25, 38, 0.6)',
+                color: '#66b1ff',
+                fontSize: '14px',
+                fontFamily: 'Microsoft YaHei',
+                fontWeight: '400',
+            }">
+                <el-table-column show-overflow-tooltip="true" width="150" v-for="header in headers" :key="header"
+                    :label="header" :prop="header" v-if="header != '空间信息'">
                 </el-table-column>
             </el-table>
+            <pie class="echart" :class="item.name == '权属' ? 'echart1' : ''" unit="亩" :ref="`echartRef`"></pie>
+
         </el-tab-pane>
 
         <el-tab-pane label="自定义" name="自定义">
@@ -73,7 +82,7 @@ export default {
             activecheckList: [],
             check_list: [{ label: '三调', ckeck: true }, { label: '权属', ckeck: true }, { label: '农用' }, { label: '上映' }],
             active_tabs_table: [],
-            rawData:[],
+            rawData: [],
             headers: [], // 用于存储所有可能的 filedZH 值  
         };
     },
@@ -82,13 +91,14 @@ export default {
         tableData() {
             // 首次加载时确定所有可能的 filedZH 值  
             // if (!this.headers.length) {
-                this.rawData.forEach(item => {
-                    item.forEach(field => {
-                        if (!this.headers.includes(field.filedZH)) {
-                            this.headers.push(field.filedZH);
-                        }
-                    });
+            this.headers = [];
+            this.rawData.forEach(item => {
+                item.forEach(field => {
+                    if (!this.headers.includes(field.filedZH)) {
+                        this.headers.push(field.filedZH);
+                    }
                 });
+            });
             // }
 
             // 转换 rawData 为适合 el-table 使用的格式  
@@ -236,7 +246,9 @@ export default {
             });
         },
         clear_data() {
-
+            const that = this;
+            store.state.query_pick_last_pane = null;
+            store.state.query_pick_pane = [];
         },
         init_handler() {
 
@@ -292,10 +304,16 @@ export default {
                     }
                     if (index == 0) {
                         let res = await GetTabsPane(pane_obj);
+
+                        let filteredData = res.data.data[0].filter((res) => {
+                            return res.filed != 'geom'
+                        })
+
                         store.state.query_pick_last_pane = {
                             name: element.name,
-                            value: res.data.data[0],
+                            value: filteredData,
                         };
+
                     } else {
                         let res = await GetTabsPane(pane_obj);
 
@@ -316,7 +334,6 @@ export default {
 
         },
         handleClick(tab, event) {
-            console.log('tab: ', tab);
 
             let index = Number(tab.index) - 1
             if (tab.closable == true) {
@@ -325,9 +342,7 @@ export default {
                         let data = [];
 
                         this.active_tabs_table = res.value.data.data;
-                        console.log('this.active_tabs_table: ', this.active_tabs_table);
                         this.rawData = res.value.data.data
-                        console.log('this.rawData: ', this.rawData);
                         res.value.data.datalist.forEach((res) => {
                             data.push({
                                 name: res.groupvalue,