Merge branch 'lifeline_develop_siping' of http://116.142.80.13:3000/sooka_onest/visu_lifeline into lifeline_develop_siping

src/components/supermap-2.5d.vue

@@ -223,8 +223,11 @@ export default {
             }
           }, 100 * i)
         }
-        // that.scene.open('http://116.142.80.12:8090/iserver/services/3D-SiPingReLi/rest/realspace')
+        // that.scene.open({
+        //   autoSetView : false      //不自动定位
+        // },'http://116.142.80.12:8090/iserver/services/3D-SiPingReLi/rest/realspace')
         // that.scene.open('http://116.142.80.12:8090/iserver/services/3D-huashengranqi/rest/realspace')
+        // that.scene.open('http://116.142.80.12:8090/iserver/services/3D-reli_yici_erci_guanduan/rest/realspace');
       }, 2000)
       that.viewer.selectedEntityChanged.addEventListener(function(entity) {
         if (entity != undefined && Reflect.has(entity, 'layerID')) {
@@ -306,6 +309,8 @@ export default {
         }
       });
       that.handler = new SuperMap3D.ScreenSpaceEventHandler(that.scene.canvas);
+      that.scene.open('http://116.142.80.12:8090/iserver/services/3D-reli_yici_erci_guanduan/rest/realspace')
+      that.scene.open('http://116.142.80.12:8090/iserver/services/3D-huashengranqi/rest/realspace');
       that.flyTo(longitude, latitude, height)
       //设置鼠标左键单击回调事件
       that.handler.setInputAction(function (e) {
@@ -501,7 +506,9 @@ export default {
     addOpen_model(sort, uri) {
       let that = this
       // that.dataMap[sort] = that.scene.open(that.superMapRootUrl + uri)
-      let obj = that.dataMap[sort] = that.scene.open(that.superMapRootUrl + uri)
+      let obj = that.dataMap[sort] = that.scene.open({
+        autoSetView : false      //不自动定位
+      },that.superMapRootUrl + uri)
       //开始加载专题图等数据，8秒后开始执行
       setTimeout(function () {
         /**
@@ -800,7 +807,9 @@ export default {
     },
     addOpen(id, uri) {
       let that = this;
-      let obj = that.scene.open(that.superMapRootUrl + uri)
+      let obj = that.scene.open({
+        autoSetView : false      //不自动定位
+      },that.superMapRootUrl + uri)
       that.dataMap[id] = obj
       return obj;
     },
@@ -1305,7 +1314,7 @@ export default {
       let that = this
       setTimeout(function() {
         that.viewer.camera.setView({
-          destination: new SuperMap3D.Cartesian3.fromDegrees(Number(longitude), Number(latitude), Number(height)),
+          destination: new SuperMap3D.Cartesian3.fromDegrees(Number(longitude)-Number(0.115), Number(latitude)-Number(0.27), Number(6000)),
           orientation: {
             heading:  SuperMap3D.Math.toRadians(0),
             pitch:  SuperMap3D.Math.toRadians(-45),
@@ -1409,10 +1418,10 @@ export default {
     dropLocation(lat, lng, index,radius) {
       this.viewer.scene.globe.depthTestAgainstTerrain = true;
       this.viewer.camera.flyTo({
-        destination: new SuperMap3D.Cartesian3.fromDegrees(lng, lat, 3000),
+        destination: new SuperMap3D.Cartesian3.fromDegrees(Number(lng), Number(lat)-Number(1.3), Number(140000)),
         orientation: {
           heading:  SuperMap3D.Math.toRadians(0),
-          pitch:  SuperMap3D.Math.toRadians(-90),
+          pitch:  SuperMap3D.Math.toRadians(-45),
           roll: 0
         }
       })

src/views/Cockpit.vue

@@ -10,99 +10,130 @@
       <div class="con_right">
         <div class="con_tckz">
           <div class="con_tit">图层控制</div>
+          <div class="map_tab">
+            <span class="on">四平市</span>
+            <span>铁东区</span>
+            <span>铁西区</span>
+          </div>
           <div class="con_tckz_div">
             <el-tabs v-model="activeName">
               <el-tab-pane label="燃气" name="first">
                 <div class="rq_div tekz_div">
-                  <p>华生燃气：
+                  <div class="tc_div">
+                  <div class="scrollx">
+                  <span>华生燃气：</span>
+                    <div class="scroll-container">
                     <el-checkbox-group
                       v-model="checkedCities1_1">
                       <el-checkbox v-for="city in cities1_1" :label="city" :key="city">{{city}}</el-checkbox>
                     </el-checkbox-group>
-                  </p>
-                  <p>港华燃气：  <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">
                     <el-checkbox v-for="city in cities1_2" :label="city" :key="city">{{city}}</el-checkbox>
-                  </el-checkbox-group></p>
-                  <p>奥德燃气： <el-checkbox-group
+                  </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">
                     <el-checkbox v-for="city in cities1_3" :label="city" :key="city">{{city}}</el-checkbox>
-                  </el-checkbox-group></p>
-                  <p>润发燃气： <el-checkbox-group
+                  </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">
                     <el-checkbox v-for="city in cities1_4" :label="city" :key="city">{{city}}</el-checkbox>
-                  </el-checkbox-group></p>
+                  </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>
+<!--                  <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">
-                  <p><el-checkbox-group
+                  <div class="tc_div">
+                    <div class="scrollx"><span>管廊公司：</span><div class="scroll-container"><el-checkbox-group
                     v-model="checkedCities2">
                     <el-checkbox v-for="city in cities2" :label="city" :key="city">{{city}}</el-checkbox>
-                  </el-checkbox-group></p>
+                  </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>
+                  <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">
-                  <p><el-checkbox-group
+                  <div class="tc_div">
+                    <div class="scrollx"><span>水务集团：</span><div class="scroll-container"><el-checkbox-group
                     v-model="checkedCities3">
                     <el-checkbox v-for="city in cities3" :label="city" :key="city">{{city}}</el-checkbox>
-                  </el-checkbox-group></p>
+                  </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>
+<!--                  <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">
-                  <p><el-checkbox-group
+                  <div class="tc_div">
+                    <div class="scrollx"><span>排水部门：</span><div class="scroll-container"><el-checkbox-group
                     v-model="checkedCities4">
                     <el-checkbox v-for="city in cities4" :label="city" :key="city">{{city}}</el-checkbox>
-                  </el-checkbox-group></p>
+                  </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>
+<!--                  <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">
-                  <p><el-checkbox-group
+                  <div class="tc_div">
+                    <div class="scrollx"><span>四平热力：</span><div class="scroll-container"><el-checkbox-group
                     v-model="checkedCities5">
                     <el-checkbox v-for="city in cities5" :label="city" :key="city">{{city}}</el-checkbox>
-                  </el-checkbox-group></p>
+                  </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">
+                    <el-checkbox v-for="city in cities6" :label="city" :key="city">{{city}}</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>
+<!--              <button class="map_btn_span" @click="showExcavationAnalyze()">填挖方分析</button>-->
                 </div>
                 <a class="map_clear" @click="clearAll()">清除</a>
               </el-tab-pane>
@@ -157,14 +188,15 @@ import {
   selectConfigKey
 } from "@/api/system/config";
 let echarts = require('echarts')
-const cityOptions1_1 = ['企业', '厂站', '管网'];
+const cityOptions1_1 = ['企业', '厂站','次高压管网','中压管网','阀门'];
 const cityOptions1_2 = ['企业', '厂站', '管网'];
 const cityOptions1_3 = ['企业', '厂站', '管网'];
 const cityOptions1_4 = ['企业', '厂站', '管网'];
-const cityOptions2 = ['企业',  '管网'];
-const cityOptions3 = ['企业',  '供水'];
-const cityOptions4 = ['企业',  '合流','污水','雨水'];
-const cityOptions5 = ['企业',  '一次网','二次网','电厂'];
+const cityOptions2 = ['企业',  '管廊'];
+const cityOptions3 = ['企业',  '泵站', '管网'];
+const cityOptions4 = ['企业',  '合流管','污水管','雨水管','雨水篦子'];
+const cityOptions5 = ['企业',  '一次网','二次网','阀门'];
+const cityOptions6 = ['企业',  '直供网'];
 export default {
   components: {
     supermap,
@@ -204,6 +236,7 @@ export default {
       checkedCities3: [],
       checkedCities4: [],
       checkedCities5: [],
+      checkedCities6: [],
       cities1_1: cityOptions1_1,
       cities1_2: cityOptions1_2,
       cities1_3: cityOptions1_3,
@@ -212,6 +245,7 @@ export default {
       cities3: cityOptions3,
       cities4: cityOptions4,
       cities5: cityOptions5,
+      cities6: cityOptions6,
     }
   },
   methods: {
@@ -448,14 +482,69 @@ export default {
         padding-bottom: 15px;
         border-bottom: 1px dashed #4a5958;
         margin-bottom: 15px;
-        p{
-          height: 40px;
+
+        .tc_div{
           line-height: 40px;
           padding-left: 15px;
           display: flex;
           flex-direction: row;
+          width: 100%;
+          .scrollx{
+            width: 100%;
+            white-space: nowrap;
+
+            display: flex;
+            flex-direction: row;
+            /*height: 40px;*/
+            span{
+              display: block;
+              width: 80px;
+            }
+            .scroll-container{
+              display: block;
+              /*height: 40px;*/
+              /*overflow-y: scroll;*/
+              width: 220px;
+              .el-checkbox-group{
+                label{
+                  display: block;
+                  float: left;
+                }
+            }
+
+
+          }
+
+
+
+          }
         }
+
+      }
+
+      .scroll-container::-webkit-scrollbar {
+        /*滚动条整体样式*/
+        width: 6px!important; /*高宽分别对应横竖滚动条的尺寸*/
+        height: 1px!important;
+        display: block!important;
+        cursor: pointer;
       }
+      .scroll-container::-webkit-scrollbar-thumb {
+        /*滚动条里面小方块*/
+        border-radius: 10px;
+        height: 15px;
+        -webkit-box-shadow: inset 0 0 5px rgba(0, 22, 55, 0.87);
+        // background: #E5E5E5;
+        background: rgba(38, 235, 255, 0.5);
+      }
+      .scroll-container::-webkit-scrollbar-track {
+        /*滚动条里面轨道*/
+        -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+        border-radius: 10px;
+        background: rgba(10, 37, 64, 0.75);
+      }
+
+
       .map_btn button{
         display: inline-block;
         background: url("../assets/images/sixZ/sixzbtn1.png") no-repeat center;
@@ -500,4 +589,40 @@ export default {
   line-height: 35px;
   margin-bottom: 15px;
 }
+  .map_tab{
+    display: flex;
+    flex-direction: row;
+    justify-content:space-around ;
+    margin-bottom: 25px!important;
+    border-bottom: 2px solid rgba(13, 107, 179, 0.53);
+    span{
+      display: block;
+      /*background: rgba(13, 107, 179, 0.53);*/
+      padding: 8px 20px;
+      color: #fff;
+      font-size: 16px;
+      text-shadow: 0px 0px 4px #0bf3f7;
+      cursor: pointer;
+    }
+    .on{
+      color: #0bf3f7;
+      background: none!important;
+      box-shadow:none;
+      font-weight: bold;
+      position: relative;
+    }
+    .on::after{
+      content: '';
+      display: block;
+      position: absolute;
+      bottom: -10px; /* 下三角位于链接的底部 */
+      left: 50%; /* 水平居中 */
+      width: 0;
+      height: 0;
+      border-left: 9px solid transparent; /* 左边透明 */
+      border-right: 9px solid transparent; /* 右边透明 */
+      border-top: 10px solid rgba(13, 107, 179, 0.53); /* 上边是三角形颜色 */
+      transform: translateX(-50%); /* 确保三角形中心对齐链接的中心 */
+    }
+  }
 </style>