syy

src/views/Cockpit.vue

@@ -11,11 +11,14 @@
         <div class="con_tckz">
           <div class="con_tit">图层控制</div>
           <div class="map_tab">
-            <span class="on">四平市</span>
-            <span>铁东区</span>
-            <span>铁西区</span>
+            <span v-for="(item,index) in tabList"
+                  :key="index"
+                  :class="{on:currentClass==index}"
+                  @click="toggleTab(index)">{{item}}</span>
+
           </div>
           <div class="con_tckz_div">
+            <div class="tab_con" v-show="currentTab==0">
             <el-tabs v-model="activeName">
               <el-tab-pane label="燃气" name="first">
                 <div class="rq_div tekz_div">
@@ -70,18 +73,31 @@
                 </div>
                 <a class="map_clear" @click="clearAll()">清除</a>
               </el-tab-pane>
-              <el-tab-pane label="管廊" name="second">
+              <el-tab-pane label="热力" name="second">
                 <div class="gl_div tekz_div">
                   <div class="tc_div">
-                    <div class="scrollx"><span>管廊公司：</span>
+                    <div class="scrollx"><span>四平热力：</span>
                       <div class="scroll-container">
-                        <el-checkbox-group v-model="checkedCities2"  @change="handleCheckedCities2">
-                          <el-checkbox v-for="city in cities2" :label="city.url" :key="city.type">{{ city.type }}
+                        <el-checkbox-group v-model="checkedCities5" @change="handleCheckedCities5">
+                          <el-checkbox v-for="city in cities5" :label="city.url" :key="city.type">{{ city.type }}
                           </el-checkbox>
                         </el-checkbox-group>
                       </div>
                     </div>
                   </div>
+                  <div class="tc_div">
+                    <div class="scrollx"><span>四平电厂：</span>
+                      <div class="scroll-container">
+                        <el-checkbox-group v-model="checkedCities6" @change="handleCheckedCities6">
+                          <el-checkbox v-for="city in cities6" :label="city.url" :key="city.type">{{ city.type }}
+                          </el-checkbox>
+                        </el-checkbox-group>
+                      </div>
+                    </div>
+                  </div>
+
+
+
                 </div>
                 <div class="map_btn">
                   <button class="map_btn_span on" @click="showExcavation()">开挖</button>
@@ -92,18 +108,20 @@
                 <!--                  <button class="map_btn_span" @click="showExcavationAnalyze()">填挖方分析</button>-->
                 <a class="map_clear" @click="clearAll()">清除</a>
               </el-tab-pane>
-              <el-tab-pane label="供水" name="three">
+              <el-tab-pane label="管廊" name="three">
                 <div class="gs_div tekz_div">
                   <div class="tc_div">
-                    <div class="scrollx"><span>水务集团：</span>
+                    <div class="scrollx"><span>管廊公司：</span>
                       <div class="scroll-container">
-                        <el-checkbox-group v-model="checkedCities3" @change="handleCheckedCities3">
-                          <el-checkbox v-for="city in cities3" :label="city.url" :key="city.type">{{ city.type }}
+                        <el-checkbox-group v-model="checkedCities2"  @change="handleCheckedCities2">
+                          <el-checkbox v-for="city in cities2" :label="city.url" :key="city.type">{{ city.type }}
                           </el-checkbox>
                         </el-checkbox-group>
                       </div>
                     </div>
                   </div>
+
+
                 </div>
                 <div class="map_btn">
                   <button class="map_btn_span on" @click="showExcavation()">开挖</button>
@@ -114,18 +132,21 @@
                 </div>
                 <a class="map_clear" @click="clearAll()">清除</a>
               </el-tab-pane>
-              <el-tab-pane label="排水" name="four">
+              <el-tab-pane label="供水" name="four">
                 <div class="ps_div tekz_div">
+
                   <div class="tc_div">
-                    <div class="scrollx"><span>排水部门：</span>
+                    <div class="scrollx"><span>水务集团：</span>
                       <div class="scroll-container">
-                        <el-checkbox-group v-model="checkedCities4"  @change="handleCheckedCities4">
-                          <el-checkbox v-for="city in cities4" :label="city.url" :key="city.type">{{ city.type }}
+                        <el-checkbox-group v-model="checkedCities3" @change="handleCheckedCities3">
+                          <el-checkbox v-for="city in cities3" :label="city.url" :key="city.type">{{ city.type }}
                           </el-checkbox>
                         </el-checkbox-group>
                       </div>
                     </div>
                   </div>
+
+
                 </div>
                 <div class="map_btn">
                   <button class="map_btn_span on" @click="showExcavation()">开挖</button>
@@ -136,23 +157,13 @@
                 </div>
                 <a class="map_clear" @click="clearAll()">清除</a>
               </el-tab-pane>
-              <el-tab-pane label="热力" name="five">
+              <el-tab-pane label="排水" name="five">
                 <div class="rl_div tekz_div">
                   <div class="tc_div">
-                    <div class="scrollx"><span>四平热力：</span>
-                      <div class="scroll-container">
-                        <el-checkbox-group v-model="checkedCities5" @change="handleCheckedCities5">
-                          <el-checkbox v-for="city in cities5" :label="city.url" :key="city.type">{{ city.type }}
-                          </el-checkbox>
-                        </el-checkbox-group>
-                      </div>
-                    </div>
-                  </div>
-                  <div class="tc_div">
-                    <div class="scrollx"><span>四平电厂：</span>
+                    <div class="scrollx"><span>排水部门：</span>
                       <div class="scroll-container">
-                        <el-checkbox-group v-model="checkedCities6" @change="handleCheckedCities6">
-                          <el-checkbox v-for="city in cities6" :label="city.url" :key="city.type">{{ city.type }}
+                        <el-checkbox-group v-model="checkedCities4"  @change="handleCheckedCities4">
+                          <el-checkbox v-for="city in cities4" :label="city.url" :key="city.type">{{ city.type }}
                           </el-checkbox>
                         </el-checkbox-group>
                       </div>
@@ -169,6 +180,333 @@
                 <a class="map_clear" @click="clearAll()">清除</a>
               </el-tab-pane>
             </el-tabs>
+            </div>
+            <div class="tab_con" v-show="currentTab==1">
+              <el-tabs v-model="activeName">
+                <el-tab-pane label="燃气2" name="first">
+                  <div class="rq_div tekz_div">
+                    <div class="tc_div">
+                      <div class="scrollx">
+                        <span>华生燃气：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities1_1" @change="handleCheckedCities1_1">
+                            <el-checkbox v-for="city in cities1_1" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="tc_div">
+                      <div class="scrollx"><span>港华燃气：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities1_2"  @change="handleCheckedCities1_2">
+                            <el-checkbox v-for="city in cities1_2" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="tc_div">
+                      <div class="scrollx"><span>奥德燃气：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities1_3"  @change="handleCheckedCities1_3">
+                            <el-checkbox v-for="city in cities1_3" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="tc_div">
+                      <div class="scrollx"><span>润发燃气：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities1_4"  @change="handleCheckedCities1_4">
+                            <el-checkbox v-for="city in cities1_4" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="map_btn">
+                    <button class="map_btn_span on" @click="showExcavation()">开挖</button>
+                    <button class="map_btn_span" @click="choseMeasuringDistance()">测距</button>
+                    <button class="map_btn_span" @click="choseMeasuringArea()">测面</button>
+                    <button class="map_btn_span" @click="choseMeasuringHeight()">测高</button>
+                    <!--                  <button class="map_btn_span" @click="showExcavationAnalyze()">填挖方分析</button>-->
+                  </div>
+                  <a class="map_clear" @click="clearAll()">清除</a>
+                </el-tab-pane>
+                <el-tab-pane label="热力" name="second">
+                  <div class="gl_div tekz_div">
+                    <div class="tc_div">
+                      <div class="scrollx"><span>四平热力：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities5" @change="handleCheckedCities5">
+                            <el-checkbox v-for="city in cities5" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="tc_div">
+                      <div class="scrollx"><span>四平电厂：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities6" @change="handleCheckedCities6">
+                            <el-checkbox v-for="city in cities6" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+
+
+
+                  </div>
+                  <div class="map_btn">
+                    <button class="map_btn_span on" @click="showExcavation()">开挖</button>
+                    <button class="map_btn_span" @click="choseMeasuringDistance()">测距</button>
+                    <button class="map_btn_span" @click="choseMeasuringArea()">测面</button>
+                    <button class="map_btn_span" @click="choseMeasuringHeight()">测高</button>
+                  </div>
+                  <!--                  <button class="map_btn_span" @click="showExcavationAnalyze()">填挖方分析</button>-->
+                  <a class="map_clear" @click="clearAll()">清除</a>
+                </el-tab-pane>
+                <el-tab-pane label="管廊" name="three">
+                  <div class="gs_div tekz_div">
+                    <div class="tc_div">
+                      <div class="scrollx"><span>管廊公司：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities2"  @change="handleCheckedCities2">
+                            <el-checkbox v-for="city in cities2" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+
+
+                  </div>
+                  <div class="map_btn">
+                    <button class="map_btn_span on" @click="showExcavation()">开挖</button>
+                    <button class="map_btn_span" @click="choseMeasuringDistance()">测距</button>
+                    <button class="map_btn_span" @click="choseMeasuringArea()">测面</button>
+                    <button class="map_btn_span" @click="choseMeasuringHeight()">测高</button>
+                    <!--                  <button class="map_btn_span" @click="showExcavationAnalyze()">填挖方分析</button>-->
+                  </div>
+                  <a class="map_clear" @click="clearAll()">清除</a>
+                </el-tab-pane>
+                <el-tab-pane label="供水" name="four">
+                  <div class="ps_div tekz_div">
+
+                    <div class="tc_div">
+                      <div class="scrollx"><span>水务集团：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities3" @change="handleCheckedCities3">
+                            <el-checkbox v-for="city in cities3" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+
+
+                  </div>
+                  <div class="map_btn">
+                    <button class="map_btn_span on" @click="showExcavation()">开挖</button>
+                    <button class="map_btn_span" @click="choseMeasuringDistance()">测距</button>
+                    <button class="map_btn_span" @click="choseMeasuringArea()">测面</button>
+                    <button class="map_btn_span" @click="choseMeasuringHeight()">测高</button>
+                    <!--                  <button class="map_btn_span" @click="showExcavationAnalyze()">填挖方分析</button>-->
+                  </div>
+                  <a class="map_clear" @click="clearAll()">清除</a>
+                </el-tab-pane>
+                <el-tab-pane label="排水" name="five">
+                  <div class="rl_div tekz_div">
+                    <div class="tc_div">
+                      <div class="scrollx"><span>排水部门：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities4"  @change="handleCheckedCities4">
+                            <el-checkbox v-for="city in cities4" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="map_btn">
+                    <button class="map_btn_span on" @click="showExcavation()">开挖</button>
+                    <button class="map_btn_span" @click="choseMeasuringDistance()">测距</button>
+                    <button class="map_btn_span" @click="choseMeasuringArea()">测面</button>
+                    <button class="map_btn_span" @click="choseMeasuringHeight()">测高</button>
+                    <!--              <button class="map_btn_span" @click="showExcavationAnalyze()">填挖方分析</button>-->
+                  </div>
+                  <a class="map_clear" @click="clearAll()">清除</a>
+                </el-tab-pane>
+              </el-tabs>
+            </div>
+            <div class="tab_con" v-show="currentTab==2">
+              <el-tabs v-model="activeName">
+                <el-tab-pane label="燃气3" name="first">
+                  <div class="rq_div tekz_div">
+                    <div class="tc_div">
+                      <div class="scrollx">
+                        <span>华生燃气：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities1_1" @change="handleCheckedCities1_1">
+                            <el-checkbox v-for="city in cities1_1" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="tc_div">
+                      <div class="scrollx"><span>港华燃气：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities1_2"  @change="handleCheckedCities1_2">
+                            <el-checkbox v-for="city in cities1_2" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="tc_div">
+                      <div class="scrollx"><span>奥德燃气：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities1_3"  @change="handleCheckedCities1_3">
+                            <el-checkbox v-for="city in cities1_3" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="tc_div">
+                      <div class="scrollx"><span>润发燃气：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities1_4"  @change="handleCheckedCities1_4">
+                            <el-checkbox v-for="city in cities1_4" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="map_btn">
+                    <button class="map_btn_span on" @click="showExcavation()">开挖</button>
+                    <button class="map_btn_span" @click="choseMeasuringDistance()">测距</button>
+                    <button class="map_btn_span" @click="choseMeasuringArea()">测面</button>
+                    <button class="map_btn_span" @click="choseMeasuringHeight()">测高</button>
+                    <!--                  <button class="map_btn_span" @click="showExcavationAnalyze()">填挖方分析</button>-->
+                  </div>
+                  <a class="map_clear" @click="clearAll()">清除</a>
+                </el-tab-pane>
+                <el-tab-pane label="热力" name="second">
+                  <div class="gl_div tekz_div">
+                    <div class="tc_div">
+                      <div class="scrollx"><span>四平热力：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities5" @change="handleCheckedCities5">
+                            <el-checkbox v-for="city in cities5" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+                    <div class="tc_div">
+                      <div class="scrollx"><span>四平电厂：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities6" @change="handleCheckedCities6">
+                            <el-checkbox v-for="city in cities6" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+
+
+
+                  </div>
+                  <div class="map_btn">
+                    <button class="map_btn_span on" @click="showExcavation()">开挖</button>
+                    <button class="map_btn_span" @click="choseMeasuringDistance()">测距</button>
+                    <button class="map_btn_span" @click="choseMeasuringArea()">测面</button>
+                    <button class="map_btn_span" @click="choseMeasuringHeight()">测高</button>
+                  </div>
+                  <!--                  <button class="map_btn_span" @click="showExcavationAnalyze()">填挖方分析</button>-->
+                  <a class="map_clear" @click="clearAll()">清除</a>
+                </el-tab-pane>
+                <el-tab-pane label="管廊" name="three">
+                  <div class="gs_div tekz_div">
+                    <div class="tc_div">
+                      <div class="scrollx"><span>管廊公司：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities2"  @change="handleCheckedCities2">
+                            <el-checkbox v-for="city in cities2" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+
+
+                  </div>
+                  <div class="map_btn">
+                    <button class="map_btn_span on" @click="showExcavation()">开挖</button>
+                    <button class="map_btn_span" @click="choseMeasuringDistance()">测距</button>
+                    <button class="map_btn_span" @click="choseMeasuringArea()">测面</button>
+                    <button class="map_btn_span" @click="choseMeasuringHeight()">测高</button>
+                    <!--                  <button class="map_btn_span" @click="showExcavationAnalyze()">填挖方分析</button>-->
+                  </div>
+                  <a class="map_clear" @click="clearAll()">清除</a>
+                </el-tab-pane>
+                <el-tab-pane label="供水" name="four">
+                  <div class="ps_div tekz_div">
+
+                    <div class="tc_div">
+                      <div class="scrollx"><span>水务集团：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities3" @change="handleCheckedCities3">
+                            <el-checkbox v-for="city in cities3" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+
+
+                  </div>
+                  <div class="map_btn">
+                    <button class="map_btn_span on" @click="showExcavation()">开挖</button>
+                    <button class="map_btn_span" @click="choseMeasuringDistance()">测距</button>
+                    <button class="map_btn_span" @click="choseMeasuringArea()">测面</button>
+                    <button class="map_btn_span" @click="choseMeasuringHeight()">测高</button>
+                    <!--                  <button class="map_btn_span" @click="showExcavationAnalyze()">填挖方分析</button>-->
+                  </div>
+                  <a class="map_clear" @click="clearAll()">清除</a>
+                </el-tab-pane>
+                <el-tab-pane label="排水" name="five">
+                  <div class="rl_div tekz_div">
+                    <div class="tc_div">
+                      <div class="scrollx"><span>排水部门：</span>
+                        <div class="scroll-container">
+                          <el-checkbox-group v-model="checkedCities4"  @change="handleCheckedCities4">
+                            <el-checkbox v-for="city in cities4" :label="city.url" :key="city.type">{{ city.type }}
+                            </el-checkbox>
+                          </el-checkbox-group>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="map_btn">
+                    <button class="map_btn_span on" @click="showExcavation()">开挖</button>
+                    <button class="map_btn_span" @click="choseMeasuringDistance()">测距</button>
+                    <button class="map_btn_span" @click="choseMeasuringArea()">测面</button>
+                    <button class="map_btn_span" @click="choseMeasuringHeight()">测高</button>
+                    <!--              <button class="map_btn_span" @click="showExcavationAnalyze()">填挖方分析</button>-->
+                  </div>
+                  <a class="map_clear" @click="clearAll()">清除</a>
+                </el-tab-pane>
+              </el-tabs>
+            </div>
           </div>
 
 
@@ -213,48 +551,28 @@ import {
   getUserProfile
 } from '@/api/system/user'
 
-import '../assets/styles/hz_body.css'
+import '../assets/styles/sb_body.css'
 
-import {
-  selectConfigKey
-} from '@/api/system/config'
 
-let echarts = require('echarts')
 const cityOptions1_1 = [{ type: '企业', url: '' }, { type: '厂站', url: '' }, { type: '阀门', url: '' }, { type: '次高压管网', url: '' }, { type: '中压管网', url: '' }];
 const cityOptions1_2 = [{ type: '企业', url: '' }, { type: '厂站', url: '' }, { type: '阀门', url: '' }, { type: '次高压管网', url: '' }, { type: '中压管网', url: '' }];
 const cityOptions1_3 = [{ type: '企业', url: '' }, { type: '厂站', url: '' }, { type: '阀门', url: '' }, { type: '次高压管网', url: '' }, { type: '中压管网', url: '' }];
 const cityOptions1_4 = [{ type: '企业', url: '' }, { type: '厂站', url: '' }, { type: '阀门', url: '' }, { type: '次高压管网', url: '' }, { type: '中压管网', url: '' }];
-const cityOptions2 = [{ type: '企业', url: '' }, { type: '阀门', url: '' }, { type: '次高压管网', url: '' }, { type: '中压管网', url: '' }];
+const cityOptions2 = [{ type: '企业', url: '' }, { type: '管廊', url: '' }];
 const cityOptions3 = [{ type: '企业', url: '' }, { type: '阀门', url: '' }, { type: '泵站', url: '' }, { type: '次高压管网', url: '' }, { type: '中压管网', url: '' }];
 const cityOptions4 = [{ type: '企业', url: '' }, { type: '合流管', url: '' }, { type: '污水管', url: '' }, { type: '雨水管', url: '' }, { type: '雨水篦子', url: '' }];
 const cityOptions5 = [{ type: '企业', url: '' }, { type: '一次网', url: '' }, { type: '二次网', url: '' }, { type: '阀门', url: '' }];
 const cityOptions6 = [{ type: '企业', url: '' }, { type: '直供网', url: '' }];
 export default {
   components: {
-    supermap
-  },
-  metaInfo() {
-    return {
-      title: '全域视联态势感知平台',
-      meta: [{
-        charset: 'utf-8'
-      },
-        {
-          name: 'viewport',
-          content: 'width=device-width, initial-scale=1.0,minimum-scale=1.0, maximum-scale=1.0, user-scalable=no'
-        }
-      ]
-    }
+
   },
+
   created() {
 
   },
   mounted() {
-    // 初始化地图数据
-    this.getSuperMapUrl()
-    setTimeout(() => {
-      this.title = '全域视联态势感知平台'
-    }, 1000)
+
   },
   data() {
     return {
@@ -277,66 +595,17 @@ export default {
       cities3: cityOptions3,
       cities4: cityOptions4,
       cities5: cityOptions5,
-      cities6: cityOptions6
+      cities6: cityOptions6,
+
+      currentTab: 0,
+      currentClass: 0,
+      tabList:[ '四平市', '铁东区', '铁西区']
     }
   },
   methods: {
-    getSuperMapUrl() {
-      getUserProfile().then(response => {
-        let mapDeptId = response.mapDeptId
-        let num = 0
-        if (mapDeptId == '365') {
-          num = 0
-        } else if (mapDeptId == '369') {
-          num = 1
-        } else if (mapDeptId == '371') {
-          num = 2
-        } else if (mapDeptId == '373') {
-          num = 3
-        } else if (mapDeptId == '372') {
-          num = 4
-        } else if (mapDeptId == '370') {
-          num = 5
-        }
-        this.$refs.supermap.removeAllviewer(mapDeptId, -1)
-      })
-    },
-    handleCheckedCities1_1(checkedCities) {
-      // checkedCities 是当前选中的所有选项的数组
-      console.log('选中的城市:', checkedCities);
-    },
-    handleCheckedCities1_2(checkedCities) {
-      // checkedCities 是当前选中的所有选项的数组
-      console.log('选中的城市:', checkedCities);
-    },
-    handleCheckedCities1_3(checkedCities) {
-      // checkedCities 是当前选中的所有选项的数组
-      console.log('选中的城市:', checkedCities);
-      this.$refs.supermap.addLifelineOpen(checkedCities)
-    },
-    handleCheckedCities1_4(checkedCities) {
-      // checkedCities 是当前选中的所有选项的数组
-      console.log('选中的城市:', checkedCities);
-    },
-    handleCheckedCities2(checkedCities) {
-      // checkedCities 是当前选中的所有选项的数组
-      console.log('选中的城市:', checkedCities);
-    },
-    handleCheckedCities3(checkedCities) {
-      // checkedCities 是当前选中的所有选项的数组
-      console.log('选中的城市:', checkedCities);
-    },
-    handleCheckedCities4(checkedCities) {
-      // checkedCities 是当前选中的所有选项的数组
-      console.log('选中的城市:', checkedCities);
-    },
-    handleCheckedCities5(checkedCities) {
-      // checkedCities 是当前选中的所有选项的数组
-      console.log('选中的城市:', checkedCities);
-    },
-    handleCheckedCities6(checkedCities) {
-      // checkedCities 是当前选中的所有选项的数组
-      console.log('选中的城市:', checkedCities);
+    toggleTab(current){
+      this.currentTab = current;
+      this.currentClass = current;
     },
     //开挖
     showExcavation() {
@@ -422,152 +691,11 @@ export default {
 @import '@/assets/styles/base.scss';
 
 .lifeline-con {
-  /*background: url('../assets/index_img/b-bg.jpg') no-repeat;*/
-
-  .life-header {
-    width: 100%;
-    height: 109px;
-    background: url('../assets/index_img/header-img.png') no-repeat center;
-    position: fixed;
-    top: 0;
-    font-family: pmzd;
-    font-size: 42px;
-    text-align: center;
-    line-height: 80px;
-    animation: headermove 1s ease-out;
-    z-index: 10000;
-
-    span {
-      line-height: 22px;
-      font-weight: 400;
-      color: #EFF8FC;
-      background: linear-gradient(0deg, rgba(119, 186, 255, 1), rgba(255, 255, 255, 1));
-      opacity: 1;
-      -webkit-background-clip: text;
-      -webkit-text-fill-color: transparent;
-    }
-
-  }
-
-  //底部按钮5个
-  .life-btm-btn {
-    position: absolute;
-    bottom: 0;
-    width: 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    background: url("../assets/images/sixZ/btmbg.png") no-repeat bottom;
-    background-size: 100% 25%;
-
-    .btn-span:nth-child(1) {
-      animation: btnmove 1s;
-    }
-
-    .btn-span:nth-child(2) {
-      animation: btnmove 1.2s;
-    }
-
-    .btn-span:nth-child(3) {
-      animation: btnmove 1.4s;
-    }
-
-    .btn-span:nth-child(4) {
-      animation: btnmove 1.6s;
-    }
-
-    .btn-span:nth-child(5) {
-      animation: btnmove 1.8s;
-    }
-
-    .btn-span {
-      width: 166px;
-      height: 50px;
-      background: url('../assets/index_img/btm-btn.png') no-repeat center;
-      text-align: center;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      margin: 10px 5px;
-      transition: all 0.3s ease-in-out;
-      cursor: pointer;
-
-      span {
-        font-size: 20px;
-        color: #EFF2FF;
-        font-family: ysbth;
-        line-height: 40px;
-        background: linear-gradient(0deg, rgba(49, 190, 255, 1), rgba(239, 252, 254, 1), rgba(239, 252, 254, 1));
-        -webkit-background-clip: text;
-        -webkit-text-fill-color: transparent;
-      }
-    }
-
-    .btn-span:hover {
-      filter: brightness(170%) hue-rotate(-20deg);
-      transform: translateY(-10px);
-    }
-
-    .btn-span.on {
-      filter: brightness(170%) hue-rotate(-20deg);
-      box-shadow: none;
-    }
-  }
-
-  .btm-btn2 {
-    position: absolute;
-    bottom: 80px;
-    width: 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    cursor: pointer;
-    animation: btmmove2 1s ease-out;
-
-    .btn-span2 {
-      margin: 0 10px;
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      transition: all 0.3s;
-
-      img {
-        width: 150px;
-        height: 100px;
-      }
-
-      span {
-        font-size: 20px;
-        color: #EFF2FF;
-        font-family: ysbth;
-        line-height: 40px;
-        background: linear-gradient(0deg, rgba(49, 190, 255, 1), rgba(239, 252, 254, 1), rgba(239, 252, 254, 1));
-        -webkit-background-clip: text;
-        -webkit-text-fill-color: transparent;
-        margin-top: -10px;
-      }
-    }
-
-    .btn-span2:hover {
-      filter: brightness(170%) hue-rotate(-20deg);
-      transform: translateY(-10px);
-    }
-  }
-
-
-}
 
-.con_right {
-  position: absolute;
-  right: 20px;
-  top: 150px;
-  z-index: 99;
-  width: 350px;
-  background: rgba(3, 16, 27, 0.6);
 
   .con_tckz {
     .con_tckz_div {
-      margin: 0px 15px;
+      margin: 0px 0px;
 
       .tekz_div {
         font-size: 14px;