Merge branch 'master' of http://114.244.114.158:8802/siwei/real3d-portalsite

src/utils/MapHelper/clickQuery.js

@@ -131,7 +131,7 @@ export async function getfieldList(zymlBsm, resetType) {
      * @param number y
      * @returns {object} x: x, y: y, z: z
      */
-function cartesianToCartographic84(x, y) {
+export function cartesianToCartographic84(x, y) {
   let cartesian3InMercator = new Cesium.Cartesian3(x, y, 0);
   let mercator = new Cesium.WebMercatorProjection();
   let p = mercator.unproject(cartesian3InMercator);

src/views/LandConsolidation/components/contrast.vue

@@ -13,7 +13,24 @@
         <li class="el-icon-close" @click="closeInster"></li>
       </ul>
     </div>
-    <div
+    <contSplit
+      v-for="(k, i) in 2"
+      :key="i"
+      v-show="active == 0 || active == 1"
+      :toolshow="ptaye == 'gdbh' || active == 1"
+      :panelshow="layers[i]"
+      :list="dbdata.fp"
+      :tname="ptaye == 'gdbh' ? 'year' : 'dlbmmc'"
+      @toolChick="$set(layers, i, !layers[i])"
+      @checkChange="(name, c, data) => clickcheck(i, name, c)"
+      :checkdata="ptaye == 'gdbh' ? gdjlcheck[i] : checkdata[0]"
+      :toolTitle="
+        ptaye == 'gdbh'
+          ? gdjlcheck[i].join(',')
+          : `整治${!i ? '前' : '后'}地类图斑`
+      "
+    ></contSplit>
+    <!-- <div
       v-for="(k, i) in 2"
       :key="i"
       class="splitScreen w50"
@@ -46,7 +63,7 @@
       <div v-if="ptaye != 'gdbh'" lass="sm-toolTitle">
         {{ `整治${!i ? "前" : "后"}地类图斑` }}
       </div>
-    </div>
+    </div> -->
     <AsideBottom
       ref="aside"
       v-show="active == 2"
@@ -62,7 +79,12 @@ import {
   initroller,
   useRoller,
 } from "@/utils/MapHelper/map.js";
-import { loadGeoJSON, removeGeoJSON } from "@/utils/MapHelper/help.js";
+import {
+  loadGeoJSON,
+  removeGeoJSON,
+  addImagery,
+} from "@/utils/MapHelper/help.js";
+import contSplit from "./contrastSplit.vue";
 import AsideBottom from "./AsideBottom.vue";
 import { QueryOne, QueryList } from "@/api/cockpitNew";
 let geoSources = {};
@@ -78,16 +100,27 @@ export default {
       list: ["卷帘对比", "分屏对比", "影像对比", "重置"],
       active: 0,
       dbdata: { id: "", fp: {} },
+      gdjlcheck: [[], []],
+      gdfpcheck: [[], []],
       checkdata: [[], []],
       imagelayers: {},
       nolayer: "",
       layersData: [],
-      fpname: "dlbmmc",
     };
   },
-  components: { AsideBottom },
+  components: { contSplit, AsideBottom },
+  computed: {
+    toolcheck(i) {
+      if (this.$props.ptaye == "gdbh") {
+        return this.gdjlcheck[i]; //this.active?this.gdjlcheck:this.gdfpcheck
+      } else {
+        return this.checkdata[0];
+      }
+    },
+  },
+
   created() {
-    this.GetServer();
+    this.$props.ptaye == "gdbh" && this.GetServer();
   },
   mounted() {
     this.$nextTick(() => {
@@ -103,7 +136,7 @@ export default {
     },
     show(data) {
       console.log(data);
-      this.fpname = this.$props.ptaye == "gdbh" ? "year" : "dlbmmc";
+
       this.dbdata = { ...this.dbdata, ...data };
       if (this.$props.ptaye == "gdbh") {
         this.layersData = data.fp;
@@ -130,16 +163,21 @@ export default {
       console.log(value);
     },
     clickcheck(i, name, checked) {
-      let geodata = geoSources[`${name}${i ? "h" : "q"}`];
-      if (geodata) {
-        if (checked)
-          viewer.flyTo(geodata, {
-            offset: new Cesium.HeadingPitchRange(0, -45),
-          });
-        // geodata.setVisibleInViewport(i, checked);
-        geoSources[`${name}q`].setVisibleInViewport(0, checked);
-        geoSources[`${name}h`].setVisibleInViewport(1, checked);
-        // geodata.show = checked;
+      if (this.$props.ptaye == "gdbh") {
+        let geodata = geoSources[`${name}${i ? "h" : "q"}`];
+        geodata.setVisibleInViewport(i, checked);
+      } else {
+        let geodata = geoSources[`${name}${i ? "h" : "q"}`];
+        if (geodata) {
+          if (checked)
+            viewer.flyTo(geodata, {
+              offset: new Cesium.HeadingPitchRange(0, -45),
+            });
+          // geodata.setVisibleInViewport(i, checked);
+          geoSources[`${name}q`].setVisibleInViewport(0, checked);
+          geoSources[`${name}h`].setVisibleInViewport(1, checked);
+          // geodata.show = checked;
+        }
       }
     },
 
@@ -160,29 +198,38 @@ export default {
       this.active = i;
 
       if (i == 0) {
-        // store.setaddNode([
-        //   { id: "ttzz", url: this.dbdata.zzq, label: "土地整治对比" },
-        // ]);
-        this.setImager({ url: this.dbdata.zzq, year: "qian", top: true }, true);
-        this.setImager(
-          { url: this.dbdata.zzh, year: "hou", top: true },
-          true,
-          (layer) => {
-            useRoller(true, "lrRoller", "leftRoller", "", false);
-            setImageryRoller(layer);
-          }
-        );
+        this.layers = [false, false];
+        this.gdjlcheck[0].push(this.dbdata.fp[0].year);
+        this.gdjlcheck[1].push(this.dbdata.fp[1].year);
+        this.setImager({ ...this.dbdata.fp[0] }, true);
+        this.setImager({ ...this.dbdata.fp[1] }, true, (layer) => {
+          useRoller(true, "lrRoller", "leftRoller", "", false);
+          setImageryRoller(layer);
+        });
       } else {
-        hideImageryRoller(this.imagelayers["hou"]);
+        Object.keys(this.imagelayers).forEach((key) => {
+          hideImageryRoller(this.imagelayers[key]);
+        });
         useRoller(false);
       }
-      // this.multiView();
-      // if (i == 2) {
-      //   this.$refs.aside.activeVal == 0;
-      //   this.$refs.aside.clickHandler();
-      // } else {
-      //   this.reset();
-      // }
+      let mul = this.active == 1 ? "HORIZONTAL" : "NONE";
+      scene.multiViewportMode = Cesium.MultiViewportMode[mul];
+
+      if (i == 1) {
+        this.layers = [false, false];
+        this.setImager({ ...this.dbdata.fp[0] }, true, (layer) => {
+          layer.setVisibleInViewport(1, false);
+        });
+        this.setImager({ ...this.dbdata.fp[1] }, true, (layer) => {
+          layer.setVisibleInViewport(0, false);
+        });
+      }
+      if (i == 2) {
+        this.$refs.aside.activeVal == 0;
+        this.$refs.aside.clickHandler();
+      } else {
+        this.reset();
+      }
       // if (this.active != 0) {
       //   this.setImager({ year: "qian" }, false);
       //   this.setImager({ year: "hou" }, false);
@@ -204,6 +251,7 @@ export default {
         //   useRoller(true, "lrRoller", "leftRoller", "", false);
         //   setImageryRoller(layer);
         // });
+        this.layers = [false, false];
         store.setaddNode([
           { id: "ttzz", url: this.dbdata.zzq, label: "土地整治对比" },
         ]);
@@ -236,6 +284,10 @@ export default {
     },
     reset() {
       this.$emit("fly");
+      if (this.$props.ptaye == "gdbh") {
+        let dalist = this.gdjlcheck[0];
+        viewer.flyTo(this.imagelayers[dalist[dalist.length - 1]]);
+      }
       if (this.active == 1)
         this.checkdata[1].forEach((mc, i) => {
           if (this.checkdata[0].indexOf(mc) == -1) {
@@ -268,13 +320,10 @@ export default {
       console.log(obj.year, isshow, this.imagelayers[obj.year], "---");
 
       if (this.imagelayers[obj.year]) this.imagelayers[obj.year].show = isshow;
-      else if (isshow)
-        this.imagelayers[obj.year] = viewer.imageryLayers.addImageryProvider(
-          new Cesium.SuperMapImageryProvider({
-            url: obj.url,
-            name: obj.year,
-          })
-        );
+      else if (isshow) {
+        let { layer } = addImagery(obj);
+        this.imagelayers[obj.year] = layer;
+      }
       if (obj.top) viewer.imageryLayers.raiseToTop(this.imagelayers[obj.year]);
       fun && fun(this.imagelayers[obj.year]);
       // viewer.flyTo(this.imagelayers[obj.year]);
@@ -349,57 +398,5 @@ export default {
     line-height: 36px;
     cursor: pointer;
   }
-  .splitScreen {
-    float: left;
-    height: calc(100% - 80px);
-    width: 100%;
-    position: relative;
-    margin-top: 80px;
-
-    .sm-btn {
-      position: absolute;
-      top: 10px !important;
-      left: 20px;
-      background-color: transparent;
-      z-index: 100;
-    }
-    .sm-btn1 {
-      position: absolute;
-      top: 40px;
-      right: 20px;
-      background-color: transparent;
-      font-size: 30px;
-      z-index: 100;
-    }
-
-    .sm-panel {
-      max-width: 300px;
-      height: 400px; //75%;
-      max-height: 80%;
-      top: 0;
-      left: 0;
-    }
-  }
-  .w50 {
-    width: 50%;
-  }
-  .ml {
-    margin: 60px 0 0 30px;
-    .el-checkbox {
-      display: block;
-      color: #fff;
-    }
-    .lcolor {
-      display: inline-block;
-      width: 14px;
-      height: 14px;
-      margin-left: 5px;
-    }
-  }
-  .sm-toolTitle {
-    top: 10px;
-    left: 25%;
-    font-size: 20px;
-  }
 }
 </style>

src/views/LandConsolidation/components/contrastSplit.vue

@@ -0,0 +1,117 @@
+<template>
+  <div class="splitScreen w50">
+    <li
+      class="sm-tool-btn sm-btn"
+      title="目录"
+      @click="$emit('toolChick')"
+      v-show="toolshow"
+    >
+      <span class="iconfont icontuceng"></span>
+    </li>
+    <div class="ml sm-panel" v-show="panelshow">
+      <!-- @change="checkedChange" -->
+      <el-checkbox-group v-model="checkdata" v-if="list.length > 1">
+        <el-checkbox
+          v-for="mli in list"
+          :key="mli[tname]"
+          :label="mli[tname]"
+          @change="(c) => $emit('checkChange', mli[tname], c, checkdata)"
+        >
+          {{ mli[tname] }}
+          <span :style="`background: ${mli.dict_color}`" class="lcolor"></span>
+        </el-checkbox>
+      </el-checkbox-group>
+    </div>
+    <div class="sm-toolTitle">{{ toolTitle }}</div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    ptaye: {
+      type: String,
+    },
+    toolshow: {
+      type: Boolean,
+    },
+    panelshow: {
+      type: Boolean,
+    },
+    tname: {
+      type: String,
+    },
+    checkdata: {
+      type: Array,
+    },
+    list: {
+      type: Array,
+    },
+    toolTitle: {
+      type: String,
+    },
+  },
+  data() {
+    return {
+      //   checkdata: [],
+    };
+  },
+  methods: {},
+};
+</script>
+
+
+<style lang="scss" scoped>
+.splitScreen {
+  float: left;
+  height: calc(100% - 80px);
+  width: 100%;
+  position: relative;
+  margin-top: 80px;
+
+  .sm-btn {
+    position: absolute;
+    top: 10px !important;
+    left: 20px;
+    background-color: transparent;
+    z-index: 100;
+  }
+  .sm-btn1 {
+    position: absolute;
+    top: 40px;
+    right: 20px;
+    background-color: transparent;
+    font-size: 30px;
+    z-index: 100;
+  }
+
+  .sm-panel {
+    max-width: 300px;
+    height: 400px; //75%;
+    max-height: 80%;
+    top: 0;
+    left: 0;
+  }
+}
+.w50 {
+  width: 50%;
+}
+.ml {
+  margin: 60px 0 0 30px;
+  .el-checkbox {
+    display: block;
+    color: #fff;
+  }
+  .lcolor {
+    display: inline-block;
+    width: 14px;
+    height: 14px;
+    margin-left: 5px;
+  }
+}
+.sm-toolTitle {
+  top: 10px;
+  left: 25%;
+  font-size: 20px;
+}
+</style>