school-web.git - Gitblit

parent: b5f88811 | patch | commit | ignore whitespace

Merge branch 'master' of http://192.168.0.105:10010/r/school-web

shuishen

2021-12-17 7804a3a4d61ff1d857973e974bbdf78a2e17feab

Merge branch 'master' of http://192.168.0.105:10010/r/school-web

11 files modified

9 files added

	public/img/cc/cc.png	patch \| view \| raw \| blame \| history
	public/index.html	41 ●●●●● patch \| view \| raw \| blame \| history
	src/api/mobile/ip/index.js	18 ●●●●● patch \| view \| raw \| blame \| history
	src/components/mobileCortrol/index.vue	34 ●●●●● patch \| view \| raw \| blame \| history
	src/components/mobileCortrolButtom/index.vue	96 ●●●●● patch \| view \| raw \| blame \| history
	src/components/mobileCortrolSearch/index.vue	7 ●●●●● patch \| view \| raw \| blame \| history
	src/components/mobileGoTo/index.vue	63 ●●●●● patch \| view \| raw \| blame \| history
	src/components/mobileLeftNav/index.vue	131 ●●●●● patch \| view \| raw \| blame \| history
	src/components/mobilePanorama/index.vue	45 ●●●●● patch \| view \| raw \| blame \| history
	src/components/mobilePopupOur/index.vue	367 ●●●●● patch \| view \| raw \| blame \| history
	src/components/mobilePopupOurAfter/index.vue	135 ●●●●● patch \| view \| raw \| blame \| history
	src/components/mobilePopupOurOnce/index.vue	132 ●●●●● patch \| view \| raw \| blame \| history
	src/components/mobileWindow/index.vue	80 ●●●●● patch \| view \| raw \| blame \| history
	src/components/mobilemap/index.vue	133 ●●●●● patch \| view \| raw \| blame \| history
	src/mobileDivForms/mobileDivForms.js	78 ●●●●● patch \| view \| raw \| blame \| history
	src/position/position.js	60 ●●●●● patch \| view \| raw \| blame \| history
	src/store/getters.js	18 ●●●●● patch \| view \| raw \| blame \| history
	src/store/modules/mobile.js	87 ●●●●● patch \| view \| raw \| blame \| history
	src/store/modules/popupParams.js	4 ●●●●● patch \| view \| raw \| blame \| history
	src/styles/mobile/popup.scss	110 ●●●●● patch \| view \| raw \| blame \| history

 public/img/cc/cc.png


 public/index.html

@@ -1,18 +1,27 @@
<!DOCTYPE html>
<html lang="">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <title>智慧校园大数据三维可视化平台</title>
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
  </head>
  <body>
    <noscript>
      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    <div id="app"></div>
    <!-- built files will be auto injected -->
  </body>
</html>

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width,initial-scale=1.0">
  <link rel="icon" href="<%= BASE_URL %>favicon.ico">
  <title>智慧校园大数据三维可视化平台</title>
  <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
  <!-- 高德定位 -->
  <script type="text/javascript"
    src="https://webapi.amap.com/maps?v=1.4.15&key=4b3e1db3211054ce5b466407cbb9d221"></script>
  <!-- ip -->
  <script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>
</head>

<body>
  <noscript>
    <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.
        Please enable it to continue.</strong>
  </noscript>
  <div id="app"></div>
  <!-- built files will be auto injected -->
</body>

</html>

 src/api/mobile/ip/index.js

New file
@@ -0,0 +1,18 @@
/*
 * @Author: Morpheus
 * @Date: 2021-05-09 15:17:44
 * @Last Modified by: liu
 * @Last Modified time: 2021-12-15 16:43:48
 */
// 党群机构
import request from '@/router/axios'

export const getIp = (params) => {
    return request({
        // url: 'https://apis.map.qq.com/ws/location/v1/ip',
        // let url = `https://apis.map.qq.com/ws/location/v1/ip?ip=${data.ip}&key=${data.key}`;
        url: `http://192.168.31.179:9898/ws/location/v1/ip?ip=${params.ip}&key=${params.key}`,
        method: 'get',
        // params: params
    })
}

 src/components/mobileCortrol/index.vue

@@ -1,7 +1,8 @@
<template>
  <div class="m-left-control">
    <div class="m-l-inbut" @click="zoomIn('+')">+</div>
    <div class="m-l-inbut" @click="zoomIn('-')">-</div>
    <div class="m-l-inbut zoom-in" @click="zoomIn">
      <i class="el-icon-refresh"></i>
    </div>
  </div>
</template>

@@ -9,12 +10,31 @@
import { mapGetters } from "vuex";
export default {
  name: "mobileCortrol",
  data() {
    return {
      DC: "",
    };
  },
  computed: {
    ...mapGetters(["mviewer"]),
  },
  created() {
    this.DC = global.DC;
  },
  methods: {
    zoomIn(val) {
      console.log(val);
      let that = this;
      // console.log(val);
      // 121.49592752204283 31.23567802276832
      this.mviewer.zoomToPosition(
        new that.DC.Position(
          121.49592752204283,
          31.23567802276832 - 0.012,
          2530,
          0,
          -45
        )
      );
      // let camera = this.mviewer.camera;
      // // console.log(camera.moveStart());
      // // this.mviewer.getImageryLayerInfo().then((res) => {
@@ -65,11 +85,11 @@
.m-left-control {
  position: fixed;
  left: 20px;
  top: 20px;
  z-index: 200;
  top: 87px;
  z-index: 201 !important;
  .m-l-inbut {
    width: 32px;
    height: 32px;
    width: 35px;
    height: 35px;
    background-color: #c9302c;
    display: flex;
    align-items: center;

 src/components/mobileCortrolButtom/index.vue

@@ -1,30 +1,95 @@
<template>
  <div class="m-left-mobileCortrolButtom">
    <div class="m-l-inbut"><i class="el-icon-s-help"></i></div>
    <div class="m-l-inbut"><i class="el-icon-s-flag"></i></div>
    <div class="m-l-inbut"><i class="el-icon-menu"></i></div>
    <div class="m-l-inbut"><i class="el-icon-location"></i></div>
    <div class="m-l-inbut">
      <!-- <i class="el-icon-s-flag"></i> -->
      <el-dropdown trigger="click" @command="handleCommand">
        <span class="el-dropdown-link icons">
          <i class="el-icon-s-flag icon"></i>
        </span>
        <el-dropdown-menu slot="dropdown">
          <el-dropdown-item
            v-for="(item, index) in flagList"
            :key="index"
            :command="item"
            >{{ item.name }}</el-dropdown-item
          >
        </el-dropdown-menu>
      </el-dropdown>
    </div>
    <div class="m-l-inbut" @click="openBigPopupAfter">
      <i class="el-icon-menu"></i>
    </div>
    <div class="m-l-inbut" @click="goOn"><i class="el-icon-location"></i></div>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
import { getIp, getUsers } from "@/api/mobile/ip/index";
export default {
  name: "mobileCortrolButtom",
  computed: {},
  data() {
    return {
      viewer: null,
      DC: null,
      DC: "",
      flagList: [
        {
          name: "西东大街",
          position: [121.49500690245499, 31.23791479409691],
        },
        {
          name: "长江路",
          position: [121.52498934134815, 31.227021231622302],
        },
        {
          name: "科技园",
          position: [121.48624368075255, 31.197575925580797],
        },
        {
          name: "逸夫楼",
          position: [121.52391709005656, 31.276115901927575],
        },
      ],
    };
  },
  computed: {
    ...mapGetters(["mviewer", "openmobileGoTo"]),
  },
  created() {
    this.DC = global.DC;
  },
  mounted() {},
  methods: {
    initialize(viewer) {
      viewer.scene.globe.depthTestAgainstTerrain = false;
      this.viewer = viewer;
    handleCommand(command) {
      let that = this;
      console.log(command, "定位");
      // 定位
      this.mviewer.zoomToPosition(
        new that.DC.Position(
          command.position[0],
          command.position[1] - 0.012,
          1530,
          0,
          -45
        )
      );
    },
    openBigPopupAfter() {
      this.$store.commit("MSET_BIGPOPUPAFTER", true);
    },
    goOn() {
      let that = this;
      this.$store.commit("MSET_OPENMOBILEGOTO", !that.openmobileGoTo);
      // console.log(returnCitySN["cip"]);
      // let data = {
      //   ip: returnCitySN["cip"],
      //   key: "7WKBZ-QDY62-WEEUG-C7KUN-ADAF5-L5BKZ",
      // };
      // console.log("定位", data.ip);
      // getIp(data).then((res) => {
      //   // getUsers(data).then((res) => {
      //   console.log(res);
      // });
    },
  },
};
@@ -48,6 +113,19 @@
    font-size: 22px;
    margin-left: 12px;
    border-radius: 5px;
    .icons {
      display: inline-block;
      width: 100%;
      height: 100%;
    }
    .icon {
      font-size: 20px;
      color: #fff;
      &::before {
        width: 100%;
        height: 100%;
      }
    }
  }
}
</style>

 src/components/mobileCortrolSearch/index.vue

@@ -6,6 +6,7 @@
          slot="append"
          class="iconSearch"
          icon="el-icon-search"
          @click="search"
        ></el-button>
      </el-input>
    </div>
@@ -20,6 +21,7 @@
    return {
      viewer: null,
      DC: null,
      input: "",
    };
  },
  created() {
@@ -31,6 +33,11 @@
      viewer.scene.globe.depthTestAgainstTerrain = false;
      this.viewer = viewer;
    },
    search() {
      let that = this;
      this.$store.commit("MSET_BIGPOPUP", { search: true, value: that.input });
      that.input = "";
    },
  },
};
</script>

 src/components/mobileGoTo/index.vue

New file
@@ -0,0 +1,63 @@
<template>
  <div v-show="openmobileGoTo" class="mobileGoTo">
    <el-input v-model="lnt"></el-input>
    <el-input v-model="lat"></el-input>
    <!-- <el-input v-model="alt"></el-input> -->
    <el-button type="primary" @click="submitForm('')">跳转</el-button>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
export default {
  name: "mobileGoTo",
  computed: {
    ...mapGetters([
      "openmobileGoTo",
      "mviewer",
      "DC",
      "query",
      "MobileWindowChangeData",
    ]),
  },
  data() {
    return {
      lnt: "121.53772514948211",
      lat: "31.23938286341316",
      alt: "90.648862227",
    };
  },
  watch: {
    MobileWindowChangeData() {
      this.lnt = this.query.lntLat[0];
      this.lat = this.query.lntLat[1];
    },
  },
  methods: {
    submitForm() {
      if (this.lnt && this.lat) {
        let that = this;
        // 定制化窗体
        let position = {};
        let lntLat = [that.lnt, that.lat];
        let d = {
          position,
          lntLat,
          query: { position, lntLat },
          useJWD: true, //仅使用经纬度
        };
        that.$store.dispatch("setMobileWindows", d);
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.mobileGoTo {
  position: fixed;
  bottom: 60px;
  width: 73%;
  z-index: 500;
}
</style>

 src/components/mobileLeftNav/index.vue

@@ -1,7 +1,7 @@
<template>
  <div class="m-left-nav" :style="[navStyle]">
    <!-- :style="[coutrolStyle]" -->
    <div class="m-left-coutrol" @click="iconHide = !iconHide">
    <div class="m-left-coutrol" @click="changeIconHide">
      <i :class="icons"></i>
    </div>
    <ul>
@@ -18,9 +18,9 @@
</template>

<script>
import { mapGetters } from "vuex";
export default {
  name: "mobileLeftNav",
  computed: {},
  watch: {
    iconHide() {
      if (this.iconHide) {
@@ -34,10 +34,12 @@
      }
    },
  },
  computed: {
    ...mapGetters(["iconHide"]),
  },
  data() {
    return {
      icons: "el-icon-d-arrow-right",
      iconHide: false,
      navStyle: {
        right: "0px",
      },
@@ -132,6 +134,10 @@
  },
  mounted() {},
  methods: {
    changeIconHide() {
      let isif = this.iconHide;
      this.$store.commit("MSET_ICONHIDE", !isif);
    },
    generatePosition(num) {
      const list = [];
      for (let i = 0; i < num; i++) {
@@ -150,22 +156,30 @@
        item.img = item.normal;
        this[item.layer].show = false;
      }
      this.$store.dispatch("closeMobileWindowsDom"); //关闭弹窗
    },
    initialize(viewer) {
      var that = this;
      viewer.scene.globe.depthTestAgainstTerrain = false;
      this.viewer = viewer;
      this.tagLayer = new this.DC.HtmlLayer("tagLayer");
      viewer.addLayer(this.tagLayer);

      this.wayLayer = new this.DC.HtmlLayer("wayLayer");
      viewer.addLayer(this.wayLayer);

      this.sceneLayer = new this.DC.VectorLayer("sceneLayer");
      viewer.addLayer(this.sceneLayer);

      this.activityLayer = new this.DC.VectorLayer("activityLayer");
      viewer.addLayer(this.activityLayer);

      this.aedLayer = new this.DC.VectorLayer("aedLayer");
      viewer.addLayer(this.aedLayer);

      this.parkLayer = new this.DC.HtmlLayer("parkLayer");
      viewer.addLayer(this.parkLayer);

      this.comeLayer = new this.DC.VectorLayer("comeLayer");
      viewer.addLayer(this.comeLayer);

@@ -184,7 +198,18 @@
                        </div>
                    `
        );
        this.tagLayer.addOverlay(divIcon);
        //  e.overlay._position._lng,
        //       e.overlay._position._lat - 0.012,
        //订阅事件1
        divIcon.on(DC.MouseEventType.CLICK, (e) => {
          // 定制化窗体
          that.openPopupS(
            e.position,
            [e.overlay._position._lng, e.overlay._position._lat],
            { name: "标签" }
          );
        });
        this.tagLayer.addOverlay(divIcon); //标签
      });

      const positions2 = this.generatePosition(50);
@@ -202,7 +227,16 @@
                        </div>
                    `
        );
        this.wayLayer.addOverlay(divIcon);
        //订阅事件2
        divIcon.on(DC.MouseEventType.CLICK, (e) => {
          // 定制化窗体
          that.openPopupS(
            e.position,
            [e.overlay._position._lng, e.overlay._position._lat],
            { name: "道路" }
          );
        });
        this.wayLayer.addOverlay(divIcon); //道路
      });

      const positions3 = this.generatePosition(50);
@@ -212,7 +246,44 @@
          "/img/leftnav/map-panorama.png"
        );
        billboard.size = [16, 16];
        this.sceneLayer.addOverlay(billboard);
        //订阅事件3
        billboard.on(DC.MouseEventType.CLICK, (e) => {
          // 定制化窗体
          that.openPopupS(
            e.position,
            [e.wgs84Position.lng, e.wgs84Position.lat],
            { name: "实景" }
          );
        });
        this.sceneLayer.addOverlay(billboard); //实景
      });

      const positions10 = this.generatePosition(50);
      positions10.forEach((item) => {
        const label = new this.DC.Label(item, "活动");
        label.setStyle({
          fillColor: this.DC.Color.ORANGERED,
          font: "10px sans-serif",
          pixelOffset: { x: 0, y: -16 },
        });
        this.activityLayer.addOverlay(label);

        const billboard = new this.DC.Billboard(
          item,
          "/img/leftnav/map-aed.png"
          // "/img/leftnav/map-panorama.png"
        );
        billboard.size = [16, 16];
        //订阅事件10
        billboard.on(DC.MouseEventType.CLICK, (e) => {
          // 定制化窗体
          that.openPopupS(
            e.position,
            [e.wgs84Position.lng, e.wgs84Position.lat],
            { name: "活动" }
          );
        });
        this.activityLayer.addOverlay(billboard); //活动
      });

      const positions4 = this.generatePosition(10);
@@ -230,8 +301,16 @@
          "/img/leftnav/map-aed.png"
        );
        billboard.size = [16, 16];

        this.aedLayer.addOverlay(billboard);
        //订阅事件4
        billboard.on(DC.MouseEventType.CLICK, (e) => {
          // 定制化窗体
          that.openPopupS(
            e.position,
            [e.wgs84Position.lng, e.wgs84Position.lat],
            { name: "建筑AED" }
          );
        });
        this.aedLayer.addOverlay(billboard); //AED
      });

      const positions5 = this.generatePosition(120);
@@ -253,6 +332,15 @@
                        </div>
                    `
        );
        //订阅事件5
        divIcon.on(DC.MouseEventType.CLICK, (e) => {
          // 定制化窗体
          that.openPopupS(
            e.position,
            [e.overlay._position._lng, e.overlay._position._lat],
            { name: "校外街路侧停车场" }
          );
        });
        this.parkLayer.addOverlay(divIcon);
      });

@@ -273,17 +361,42 @@
          "/img/leftnav/map-activity.png"
        );
        billboard.size = [16, 16];

        //订阅事件6
        billboard.on(DC.MouseEventType.CLICK, (e) => {
          // 定制化窗体
          that.openPopupS(
            e.position,
            [e.wgs84Position.lng, e.wgs84Position.lat],
            { name: "123" }
          );
        });
        this.comeLayer.addOverlay(billboard);
      });

      this.tagLayer.show = false;
      this.wayLayer.show = false;
      this.sceneLayer.show = false;
      this.activityLayer.show = false;
      this.aedLayer.show = false;
      this.parkLayer.show = false;
      this.comeLayer.show = false;
    },
    mobileOpenImgs1() {
      let imgsDom = document.getElementById("mobileBigImgs");
      imgsDom.click();
    },
    goOn1() {},
    openPopupS(position, lntLat, query) {
      let that = this;
      // 定制化窗体
      let d = {
        position,
        lntLat,
        query: { ...(query || {}), position, lntLat },
        useJWD: true, //仅使用经纬度
      };
      that.$store.dispatch("setMobileWindows", d);
    },
  },
};
</script>

 src/components/mobilePanorama/index.vue

New file
@@ -0,0 +1,45 @@
<template>
  <div v-show="openmobilePanorama" class="mobilePanorama">
    <div class="mobilePanorama-close" @click="closeMobilePanorama">
      <i class="el-icon-error icon"></i>
    </div>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
export default {
  name: "mobilePanorama",
  computed: {
    ...mapGetters(["openmobilePanorama"]),
  },
  data() {
    return {};
  },
  methods: {
    closeMobilePanorama() {
      this.$store.commit("MSET_OPENMOBILEPANORAMA", false);
    },
  },
};
</script>

<style lang="scss" scoped>
.mobilePanorama {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1000;
  background-color: #fff;
  .mobilePanorama-close {
    position: absolute;
    right: 5px;
    top: 5px;
    .icon {
      font-size: 35px;
    }
  }
}
</style>

 src/components/mobilePopupOur/index.vue

New file
@@ -0,0 +1,367 @@
<template>
  <div id="mobilePopupOur" v-loading.fullscreen.lock="fullscreenLoading">
    <div class="m_p_heard">
      <div class="m_p_h_break" @click="closeBigPopup">
        <i class="el-icon-arrow-left icon"></i>
      </div>
      <div class="m_p_h_center">
        <div>
          <div v-if="mBigPopup.search" style="color: #fff">
            查询结果{{ searchLabel ? "--" + searchLabel : "" }}
          </div>
          <el-dropdown trigger="click" @command="choiceIt" v-else>
            <span class="el-dropdown-link">
              {{ choiceValue }}<i class="el-icon-arrow-down el-icon--right"></i>
            </span>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item
                v-for="(item, index) in choiceData"
                :key="index"
                :command="item.name"
                >{{ item.name }}</el-dropdown-item
              >
            </el-dropdown-menu>
          </el-dropdown>
        </div>
      </div>
    </div>
    <div class="m_p_center">
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane
          v-for="(item, index) in tabTable"
          :key="index"
          :label="item.label"
          :name="item.value"
        >
          <div class="m_p_c_tableIn">
            <el-empty
              v-show="item.child.length == 0"
              description="暂无数据"
            ></el-empty>
            <mobilePopupOurOnce
              v-for="(citem, cindex) in item.child"
              :key="cindex"
              :ends="item.child.length - 1 == cindex"
              :onceData="citem"
            ></mobilePopupOurOnce>
            <div v-show="item.child.length != 0">
              <el-divider content-position="left">
                <i class="el-icon-s-promotion"></i>&nbsp;&nbsp;&nbsp;暂无更多
              </el-divider>
            </div>
          </div>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
export default {
  computed: {
    ...mapGetters(["mBigPopup"]),
  },
  name: "mobilePopupOur",
  data() {
    return {
      searchLabel: "",
      choiceValue: "",
      choiceData: [
        {
          name: "党群机构",
          value: "1",
        },
        {
          name: "职能部门",
          value: "2",
        },
        {
          name: "其他机构",
          value: "3",
        },
      ],
      tabTable: [
        {
          label: "西东大街",
          value: "first",
          child: [
            {
              name: "电力部门",
              icon: "",
              lntLat: [121.49907024133591, 31.234911748958513],
              buts: ["实景", "图集", "定位"],
            },
            {
              name: "保安部门",
              icon: "",
              lntLat: [121.51198333955459, 31.216073280697593],
              buts: ["图集", "定位"],
            },
            {
              name: "图书馆",
              icon: "",
              lntLat: [121.4945198122125, 31.213002416673532],
              buts: ["定位"],
            },
            {
              name: "电力部门",
              icon: "",
              lntLat: [121.49907024133591, 31.234911748958513],
              buts: ["实景", "图集", "定位"],
            },
            {
              name: "保安部门",
              icon: "",
              lntLat: [121.51198333955459, 31.216073280697593],
              buts: ["图集", "定位"],
            },
            {
              name: "图书馆",
              icon: "",
              lntLat: [121.4945198122125, 31.213002416673532],
              buts: ["定位"],
            },
            {
              name: "电力部门",
              icon: "",
              lntLat: [121.49907024133591, 31.234911748958513],
              buts: ["实景", "图集", "定位"],
            },
            {
              name: "保安部门",
              icon: "",
              lntLat: [121.51198333955459, 31.216073280697593],
              buts: ["图集", "定位"],
            },
            {
              name: "图书馆",
              icon: "",
              lntLat: [121.4945198122125, 31.213002416673532],
              buts: ["定位"],
            },
            {
              name: "电力部门",
              icon: "",
              lntLat: [121.49907024133591, 31.234911748958513],
              buts: ["实景", "图集", "定位"],
            },
            {
              name: "保安部门",
              icon: "",
              lntLat: [121.51198333955459, 31.216073280697593],
              buts: ["图集", "定位"],
            },
            {
              name: "图书馆",
              icon: "",
              lntLat: [121.4945198122125, 31.213002416673532],
              buts: ["定位"],
            },
            {
              name: "电力部门",
              icon: "",
              lntLat: [121.49907024133591, 31.234911748958513],
              buts: ["实景", "图集", "定位"],
            },
            {
              name: "保安部门",
              icon: "",
              lntLat: [121.51198333955459, 31.216073280697593],
              buts: ["图集", "定位"],
            },
            {
              name: "图书馆",
              icon: "",
              lntLat: [121.4945198122125, 31.213002416673532],
              buts: ["定位"],
            },
            {
              name: "电力部门",
              icon: "",
              lntLat: [121.49907024133591, 31.234911748958513],
              buts: ["实景", "图集", "定位"],
            },
            {
              name: "保安部门",
              icon: "",
              lntLat: [121.51198333955459, 31.216073280697593],
              buts: ["图集", "定位"],
            },
            {
              name: "图书馆",
              icon: "",
              lntLat: [121.4945198122125, 31.213002416673532],
              buts: ["定位"],
            },
            {
              name: "电力部门",
              icon: "",
              lntLat: [121.49907024133591, 31.234911748958513],
              buts: ["实景", "图集", "定位"],
            },
            {
              name: "保安部门",
              icon: "",
              lntLat: [121.51198333955459, 31.216073280697593],
              buts: ["图集", "定位"],
            },
            {
              name: "图书馆",
              icon: "",
              lntLat: [121.4945198122125, 31.213002416673532],
              buts: ["定位"],
            },
            {
              name: "电力部门",
              icon: "",
              lntLat: [121.49907024133591, 31.234911748958513],
              buts: ["实景", "图集", "定位"],
            },
            {
              name: "保安部门",
              icon: "",
              lntLat: [121.51198333955459, 31.216073280697593],
              buts: ["图集", "定位"],
            },
            {
              name: "图书馆",
              icon: "",
              lntLat: [121.4945198122125, 31.213002416673532],
              buts: ["定位"],
            },
          ],
        },
        {
          label: "长江路",
          value: "second",
          child: [
            {
              name: "电力部门1",
              icon: "",
              position: [121.49190702133591, 31.234911741858513],
              buts: ["实景", "图集", "定位"],
            },
            {
              name: "保安部门1",
              icon: "",
              position: [121.49907021413591, 31.234911741895513],
              buts: ["图集", "定位"],
            },
            {
              name: "图书馆1",
              icon: "",
              position: [121.49901024133591, 31.234911749581513],
              buts: ["定位"],
            },
          ],
        },
        {
          label: "科技园",
          value: "third",
          child: [],
        },
        {
          label: "逸夫楼",
          value: "fourth",
          child: [],
        },
      ],
      fullscreenLoading: false,
      activeName: "first",
    };
  },
  // watch: {
  //   mBigPopup() {
  //     console.log(this.mBigPopup.name);
  //     this.choiceValue = this.mBigPopup.name;
  //   },
  // },
  mounted() {
    this.fullscreenLoading = true;
    setTimeout(() => {
      if (this.mBigPopup.search) {
        this.searchLabel = this.mBigPopup.value;
        console.log("查询搜索结果", this.mBigPopup.value);
        this.fullscreenLoading = false;
        return;
      }
      this.choiceValue = this.mBigPopup.name;
      this.fullscreenLoading = false;
      this.$store.commit("MSET_BIGPOPUPAFTER", false);
      console.log("请求对应街道接口");
    }, 500);
    // this.choiceValue = this.choiceData[0].name;
  },
  methods: {
    handleClick(tab, event) {
      console.log(tab.name);
    },
    choiceIt(name) {
      this.fullscreenLoading = true;
      setTimeout(() => {
        this.choiceValue = name;
        this.fullscreenLoading = false;
        console.log("请求对应头部下拉菜单接口");
      }, 500);
    },
    closeBigPopup() {
      this.$store.commit("MSET_BIGPOPUP", false);
    },
  },
};
</script>

<style lang="scss" scoped>
#mobilePopupOur {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  z-index: 300;
  .m_p_heard {
    width: 100%;
    height: 50px;
    background-color: #a40000;
    .m_p_h_break {
      position: absolute;
      left: 0;
      top: 0;
      width: 50px;
      height: 50px;
      display: flex;
      align-items: center;
      justify-content: center;
      .icon {
        font-size: 22px;
        color: #fff;
      }
    }
    .m_p_h_center {
      width: 100%;
      height: 50px;
      display: flex;
      align-items: center;
      justify-content: center;
      .el-dropdown-link {
        color: #fff;
      }
    }
  }
  .m_p_center {
    width: 100%;
    height: calc(100% - 50px);
    // border: 1px solid red
    box-sizing: border-box;
    .m_p_c_tableIn {
      width: 100%;
      height: 100%;
      box-sizing: border-box;
      overflow-x: hidden;
      overflow-y: auto;
    }
  }
}
</style>

 src/components/mobilePopupOurAfter/index.vue

New file
@@ -0,0 +1,135 @@
<template>
  <div id="mobilePopupOurAfter">
    <div class="m_p_a_heard">
      <div><i class="el-icon-menu icon"></i></div>
      <div @click="closeBigPopupAfter"><i class="el-icon-close icon"></i></div>
    </div>
    <div class="m_p_a_center">
      <div class="m_p_a_center_group">
        <div
          class="m_p_a_center_once"
          v-for="(item, index) in choiceDataUp"
          @click="openBigPopup(item)"
          :key="index"
        >
          <div class="m_p_a_c_o_up"><i :class="[item.icon]"></i></div>
          <div class="m_p_a_c_o_down">{{ item.name }}</div>
        </div>
      </div>
      <div class="m_p_a_center_group">
        <div
          class="m_p_a_center_once"
          v-for="(item, index) in choiceDataDown"
          @click="openBigPopup(item)"
          :key="index"
        >
          <div class="m_p_a_c_o_up"><i :class="[item.icon]"></i></div>
          <div class="m_p_a_c_o_down">{{ item.name }}</div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "mobilePopupOurAfter",
  data() {
    return {
      choiceValue: "",
      choiceDataUp: [
        {
          name: "机构单位",
          icon: "el-icon-s-cooperation",
        },
        {
          name: "校园建筑",
          icon: "el-icon-s-management",
        },
        {
          name: "生活设施",
          icon: "el-icon-s-flag",
        },
      ],
      choiceDataDown: [
        {
          name: "文化风景",
          icon: "el-icon-s-opportunity",
        },
        {
          name: "出入口",
          icon: "el-icon-s-promotion",
        },
        {
          name: "停车场",
          icon: "el-icon-s-flag",
        },
      ],
    };
  },
  mounted() {},
  methods: {
    openBigPopup(val) {
      this.$store.commit("MSET_BIGPOPUP", val);
    },
    closeBigPopupAfter() {
      this.$store.commit("MSET_BIGPOPUPAFTER", false);
    },
  },
};
</script>

<style lang="scss" scoped>
.flexCenter {
  display: flex;
  align-items: center;
  justify-content: center;
}
#mobilePopupOurAfter {
  position: fixed;
  top: 37.5%;
  left: 13.5%;
  width: 75%;
  height: 25%;
  background-color: #fff;
  z-index: 300;
  .m_p_a_heard {
    width: 100%;
    height: 35px;
    box-sizing: border-box;
    padding: 5px 15px;
    @extend .flexCenter;
    justify-content: space-between;
    background-color: #a40000;
    div {
      width: 35px;
      height: 35px;
      @extend .flexCenter;
    }
    .icon {
      font-size: 24px;
      color: #fff;
    }
  }
  .m_p_a_center {
    width: 100%;
    height: calc(100% - 35px);
    @extend .flexCenter;
    flex-direction: column;
    .m_p_a_center_group {
      width: 100%;
      height: 40%;
      @extend .flexCenter;
      .m_p_a_center_once {
        width: 30%;
        height: 100%;
        background-color: #a40000;
        color: #fff;
        border: 2px solid rgb(255, 255, 255);
        @extend .flexCenter;
        flex-direction: column;
      }
    }
  }
}
</style>

 src/components/mobilePopupOurOnce/index.vue

New file
@@ -0,0 +1,132 @@
<template>
  <div class="mobilePopupOurOnce">
    <div
      class="mobilePopupOurOnce_center"
      :style="{
        borderBottom: !ends ? '#d4d4d4 dashed 1px' : '',
        marginBottom: !ends ? '6px' : '',
      }"
    >
      <div class="mobilePopupOurOnce_left">
        <img src="img/cc/cc.png" alt="" />
      </div>
      <div class="mobilePopupOurOnce_right">
        <div class="mobilePopupOurOnce_r_up">{{ onceData.name }}</div>
        <div class="mobilePopupOurOnce_r_down">
          <div v-for="(item, index) in seebut" :key="index">
            <el-link
              icon="el-icon-map-location"
              class="mobilePopupOurOnce_r_d_in"
              @click="openOnce(item.name)"
              >{{ item.name }}</el-link
            >
            <el-divider
              direction="vertical"
              class="mobilePopupOurOnce_r_d_in"
              v-if="index != seebut.length - 1"
            ></el-divider>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
export default {
  props: ["onceData", "ends"],
  name: "mobilePopupOurOnce",
  created() {
    this.DC = global.DC;
  },
  data() {
    return {
      DC: "",
    };
  },
  computed: {
    ...mapGetters(["mviewer"]),
    seebut() {
      let buts = this.onceData.buts;
      let b = [];
      for (let k in buts) {
        b.push({
          name: buts[k],
        });
      }
      return b;
    },
  },
  methods: {
    openOnce(val) {
      let that = this;
      console.log(val, this.onceData);
      if (val == "定位") {
        this.$store.commit("MSET_BIGPOPUP", false);
        setTimeout(() => {
          // 定制化窗体
          let d = {
            position: {},
            lntLat: that.onceData.lntLat,
            query: this.onceData,
            useJWD: true, //仅使用经纬度
          };
          that.popupsDom = that.$store.dispatch("setMobileWindows", d);
        }, 500);
      } else if (val == "实景") {
        this.$store.commit("MSET_OPENMOBILEPANORAMA", true);
      }
    },
  },
};
</script>

<style lang="scss" scoped>
// 继承类
.flexCenter {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.mobilePopupOurOnce {
  padding: 0 0;
  margin: 0 8px;
  .mobilePopupOurOnce_center {
    // margin-bottom: 8px;
    height: 80px;
    // border-bottom: #d4d4d4 dashed 1px;
    padding-bottom: 8px;
    @extend .flexCenter;
    .mobilePopupOurOnce_left {
      width: 32%;
      height: 100%;
      @extend .flexCenter;
    }
    .mobilePopupOurOnce_right {
      width: 68%;
      height: 100%;
      @extend .flexCenter;
      flex-direction: column;
      .mobilePopupOurOnce_r_up {
        height: 50%;
        width: 100%;
        font-size: 16px;
        text-indent: 1em;
        display: flex !important;
        align-items: center !important;
      }
      .mobilePopupOurOnce_r_down {
        height: 50%;
        width: 100%;
        padding-left: 1em;
        display: flex !important;
        align-items: center !important;
        .mobilePopupOurOnce_r_d_in {
          font-size: 17px;
        }
      }
    }
  }
}
</style>

 src/components/mobileWindow/index.vue

New file
@@ -0,0 +1,80 @@
<template>
  <div
    ref="mobile-mapContentContent"
    v-show="!MobileWindowsHide"
    id="mobile-map_content_content"
  >
    <div class="mobile-popup-imgs-heard">
      <img :src="url" alt="" />
      <el-image
        style="width: 100px; height: 100px"
        :src="url"
        id="mobileBigImgs"
        v-show="false"
        :preview-src-list="srcList"
      >
      </el-image>
      <div>{{ query.query }}</div>
      <!-- 哈工大A10公寫总建筑面积30740平方米,于2001年采用货款方式高标准建造并投入使用。整个楼体共分十层,地上九层为公寫主体。公寓外观呈工字型,公寓内房司以A、B、C三个区域別分,与哈工大雄厚的工科底蕴遥相呼应,是哈尔滨工业大学学生公寫的标志性建筑 -->
    </div>
    <div class="mobile-popup-control">
      <el-link icon="el-icon-picture-outline-round" @click="mobileOpenImgs"
        >图集</el-link
      >
      <el-divider direction="vertical"></el-divider>
      <el-link icon="el-icon-map-location" @click="openMobilePanorama"
        >实景</el-link
      >
      <el-divider direction="vertical"></el-divider>
      <el-link icon="el-icon-aim" @click="goOn">去这</el-link>
    </div>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
export default {
  name: "mobileWindow",
  computed: {
    ...mapGetters(["MobileWindowsHide", "query", "MobileWindowChangeData"]),
  },
  watch: {
    MobileWindowChangeData() {
      //   this.fullscreenLoading = true;
      if (!this.MobileWindowsHide) {
        // setTimeout(() => {
        // this.fullscreenLoading = false;
        console.log("地图点击弹窗数据请求参数", this.query);
        // console.log("地图点击弹窗数据请求参数", this.query.lntLat[0]);
        // console.log("地图点击弹窗数据请求参数", this.query.lntLat[1]);
        // }, 500);
      }
    },
  },
  data() {
    return {
      fullscreenLoading: false,
      url: "/img/job/one.jpg",
      positions: "",
      srcList: [
        "https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg",
        "https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg",
      ],
    };
  },
  methods: {
    mobileOpenImgs() {
      let imgsDom = document.getElementById("mobileBigImgs");
      imgsDom.click();
    },
    goOn() {},
    openMobilePanorama() {
      console.log(11);
      this.$store.commit("MSET_OPENMOBILEPANORAMA", true);
    },
  },
};
</script>

<style>
</style>

 src/components/mobilemap/index.vue

@@ -1,63 +1,66 @@
/* eslint-disable camelcase */
<template>
  <div id="mobile-viewer-container">
    <!-- 地图图标弹窗↓ -->
    <div id="mobile-map_popup_content"></div>

    <div
      ref="mobile-mapContentContent"
      v-show="popupWindow"
      id="mobile-map_content_content"
    >
      <div class="mobile-popup-imgs-heard">
        <img :src="url" alt="" />
        <el-image
          style="width: 100px; height: 100px"
          :src="url"
          id="mobileBigImgs"
          v-show="false"
          :preview-src-list="srcList"
        >
        </el-image>
        哈工大A10公寫总建筑面积30740平方米,于2001年采用货款方式高标准建造并投入使用。整个楼体共分十层,地上九层为公寫主体。公寓外观呈工字型,公寓内房司以A、B、C三个区域別分,与哈工大雄厚的工科底蕴遥相呼应,是哈尔滨工业大学学生公寫的标志性建筑
      </div>
      <div class="mobile-popup-control">
        <el-link icon="el-icon-picture-outline-round" @click="mobileOpenImgs"
          >图集</el-link
        >
        <el-divider direction="vertical"></el-divider>

        <el-link icon="el-icon-map-location">实景</el-link>
        <el-divider direction="vertical"></el-divider>
        <el-link icon="el-icon-aim">去这</el-link>
      </div>
    </div>
    <mobileWindow></mobileWindow>
    <!-- 地图图标弹窗↑ -->
    <!-- 控制↓ -->
    <mobileLeftNav ref="mobileLeftNav"></mobileLeftNav>
    <mobileCortrol ref="mobileCortrol"></mobileCortrol>
    <mobileCortrolButtom ref="mobileCortrolButtom"></mobileCortrolButtom>
    <mobileCortrolSearch ref="mobileCortrolSearch"></mobileCortrolSearch>
    <!-- 控制↑ -->
    <!-- 控制大弹窗的弹窗 -->
    <mobilePopupOurAfter v-if="mBigPopupAfter"></mobilePopupOurAfter>
    <!-- 大弹窗 -->
    <mobilePopupOur :style="[bigPopup]" v-if="mBigPopup"></mobilePopupOur>
    <!-- 测试-跳转位置 -->
    <mobileGoTo></mobileGoTo>
    <!-- 实景窗口 -->
    <mobilePanorama></mobilePanorama>
  </div>
</template>
<script>
import { mapGetters } from "vuex";

export default {
  name: "mobilemapBox",
  data() {
    return {
      url: "/img/job/one.jpg",
      srcList: [
        "https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg",
        "https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg",
      ],
      popupFlag: false,
      popupWindow: false,
      DC: "",
      bigPopup: {
        width: 0,
        height: 0,
        // transition: "all 3s",
      },
    };
  },
  computed: {
    ...mapGetters(["mviewer"]),
    ...mapGetters([
      "mviewer",
      "MobileWindowsHide",
      "mBigPopup",
      "mBigPopupAfter",
      "iconHide",
      "popupsDom",
    ]),
  },
  watch: {
    mBigPopup() {
      if (this.mBigPopup) {
        this.bigPopup.width = "100%";
        this.bigPopup.height = "100%";
        this.bigPopup.display = "inline-block";
      } else {
        this.bigPopup.width = "0";
        this.bigPopup.height = "0";
        this.bigPopup.display = "none";
      }
    },
  },
  mounted() {
    var DC = global.DC;
    this.DC = DC;

    var that = this;

@@ -132,6 +135,7 @@
      });
      that.$refs.mobileLeftNav.initialize(viewer);
      that.$store.commit("MSET_VIEWER", viewer);
      that.$store.commit("MSET_DC", DC);
      const popup = viewer.popup;

      popup.hide();
@@ -144,7 +148,7 @@
        name: "影像",
      });

      // // eslint-disable-next-line camelcase
      // eslint-disable-next-line camelcase
      // const baselayer_shaded = DC.ImageryLayerFactory.createArcGisImageryLayer({
      //   url: "http://services.arcgisonline.com/arcgis/rest/services/World_Shaded_Relief/MapServer",
      // });
@@ -170,6 +174,20 @@
      //   iconUrl: "examples/images/icon/ter.png",
      //   name: "地形",
      // });

      // 地图移动事件
      viewer.on(DC.MouseEventType.MOUSE_MOVE, (e) => {
        if (!that.iconHide) {
          that.$store.commit("MSET_ICONHIDE", true);
        }
        that.$store.dispatch("closeMobileWindowsDom"); //关闭弹窗
        // if (!that.MobileWindowsHide && that.popupsDom) {
        //   that.popupsDom.closeOur();
        //   that.$store.commit("MSET_MOBILEWINDOWSHIDE", true);
        // }
        // nowPosition = [e.wgs84Position.lng, e.wgs84Position.lat];
        // console.log(nowPosition);
      });

      const layer = new DC.TilesetLayer("layer");
      viewer.addLayer(layer);
@@ -198,30 +216,16 @@

      tileset.on(DC.MouseEventType.CLICK, (e) => {
        // that.popupFlag = true
        that.popupWindow = true;
        // that.popupWindow = true;

        viewer.scene.globe.depthTestAgainstTerrain = false;

        // console.log(document.getElementById("mobile-map_content_content"));
        console.log(e.position);
        console.log(e);

        // 定制化窗体
        var divForms = new DC.mobileDivForms(viewer, {
          domId: "mobilePopup",
          title: "成教楼  ",
          className: "mobilePopup",
          content: document.getElementById("mobile-map_content_content"),
          position: [e.position],
        });
        viewer.zoomToPosition(
          new DC.Position(
            e.wgs84Position.lng,
            e.wgs84Position.lat - 0.016,
            2030,
            0,
            -45
          )
        );
        that.openPopupS(e.position, [e.wgs84Position.lng, e.wgs84Position.lat]);

        // popup.setWrapper('<div></div>')

        // popup.showAt(e.position, document.getElementById('modelPopup'))
@@ -232,7 +236,7 @@
      // )

      viewer.compass.enable = false;
      viewer.zoomController.enable = false;
      viewer.zoomController.enable = true;
      viewer.locationBar.enable = false;
      viewer.distanceLegend.enable = true;
    }
@@ -240,9 +244,16 @@
    DC.ready(initViewer);
  },
  methods: {
    mobileOpenImgs() {
      let imgsDom = document.getElementById("mobileBigImgs");
      imgsDom.click();
    openPopupS(position, lntLat, query) {
      let that = this;
      // 定制化窗体
      let d = {
        position,
        lntLat,
        query: { ...(query || {}), position, lntLat },
        useJWD: true, //仅使用经纬度
      };
      that.$store.dispatch("setMobileWindows", d);
    },
  },
};

 src/mobileDivForms/mobileDivForms.js

@@ -20,12 +20,13 @@
     *
     */
    constructor(viewer, popup) {
        this._viewer = viewer
        this._popup = popup
        this._position = popup.position
        this._title = popup.title
        this._content = popup.content
        this.appendPopup()
        this._viewer = viewer;
        this._popup = popup;
        this._position = popup.position;
        this._title = popup.title;
        this._content = popup.content;
        this.appendPopup();
        this.isOpen = true;
    }

    get viewer() {
@@ -58,6 +59,9 @@

    // 创建元素并追加
    createVideoWindowAll(id, className, position) {
        let dom = document.getElementById('mobile-map_popup_content');
        dom.style.display = 'block';

        var childs = document.getElementById('mobile-map_popup_content').getElementsByTagName('div')

        if (childs.length > 0) {
@@ -70,53 +74,9 @@

        var el = $("<div class=''></div>")

        // var divBig = $("<div style='width: 100%; height: 100%;' class=''></div>")

        // var divForms = $("<div class='divForms divForms-theme'></div>")

        // var divFormsWrap = $("<div class='divForms-wrap'></div>")

        // var area = $("<div class='area'></div>")

        // var arrowLt = $("<div class='arrow-lt'></div>")
        // var bT = $("<div class='b-t'></div>")
        // var bR = $("<div class='b-r'></div>")
        // var bB = $("<div class='b-b'></div>")
        // var bL = $("<div class='b-l'></div>")
        // var arrowRb = $("<div class='arrow-rb'></div>")

        // var labelWrap = $("<div class='label-wrap'></div>")
        var titleDiv = $("<div class='mobiletitle'></div>").text(this._title)
        var labelContent = $("<div class='mobilelabel-content'></div>").append(this._content)

        // var titleDiv = $("<div class='mobiletitle'>楼</div>")
        // var labelContent = $("<div class='mobilelabel-content'>内容</div>")

        // labelWrap.append(titleDiv)
        // labelWrap.append(labelContent)

        // var bTL = $("<div class='b-t-l'></div>")
        // var bBR = $("<div class='b-b-r'></div>")

        // var arrow = $("<div class='arrow'></div>")

        // area.append(arrowLt)
        // area.append(bT)
        // area.append(bR)
        // area.append(bB)
        // area.append(bL)
        // area.append(arrowRb)
        // area.append(labelWrap)

        // divFormsWrap.append(area)
        // divFormsWrap.append(bTL)
        // divFormsWrap.append(bBR)

        // divForms.append(divFormsWrap)
        // divForms.append(arrow)

        // divBig.append(divForms)
        // el.append(divBig)
        el.append(titleDiv)
        el.append(labelContent)

@@ -127,6 +87,9 @@
        $('#mobile-map_popup_content').append(el)

        this._viewer.scene.postRender.addEventListener(function () {
            if (!self.isOpen) {
                return;
            }
            const windowCoord = DC.Namespace.Cesium.SceneTransforms.wgs84ToWindowCoordinates(
                self._viewer.scene,
                position
@@ -137,6 +100,9 @@
    }

    positionPopUp(windowCoord, id) {
        if (!windowCoord) {
            return;
        }
        const wx = document.getElementById('app').clientWidth;
        const x = windowCoord.x - (wx / 100 * 35);
        const y = windowCoord.y - document.getElementById(id).offsetHeight - 15;
@@ -149,6 +115,18 @@
        transform:translate3d(${Math.round(x)}px,${Math.round(y)}px, 0);
        `
    }
    closeOur() {
        this.isOpen = false;
        let dom = document.getElementById('mobile-map_popup_content');
        dom.style.display = 'none';
        // var childs = document.getElementById('mobile-map_popup_content').getElementsByTagName('div')

        // if (childs.length > 0) {
        //     for (var i = 0; i < childs.length; i++) {
        //         document.getElementById('mobile-map_popup_content').removeChild(childs[i])
        //     }
        // }
    }
}

export default mobileDivForms

 src/position/position.js

New file
@@ -0,0 +1,60 @@
/**
* 高德地图定位
* 
*/
// export const location = {
// undefined
// initMap(id) {
//     // undefined
//     let mapObj = new AMap.Map(id, {});
//     let geolocation;
//     mapObj.plugin(["AMap.Geolocation"], function () {
//         // undefined
//         geolocation = new AMap.Geolocation({
//             // undefined
//             enableHighAccuracy: true, //  是否使用高精度定位，默认:true
//             timeout: 10000, //  超过10秒后停止定位，默认：无穷大
//             maximumAge: 0, // 定位结果缓存0毫秒，默认：0
//             convert: true, // 自动偏移坐标，偏移后的坐标为高德坐标，默认：true
//             showButton: true, //  显示定位按钮，默认：true
//             buttonPosition: "LB", // 定位按钮停靠位置，默认：'LB'，左下角
//             buttonOffset: new AMap.Pixel(10, 20), //  定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
//             showMarker: true, //  定位成功后在定位到的位置显示点标记，默认：true
//             showCircle: true, //  定位成功后用圆圈表示定位精度范围，默认：true
//             panToLocation: true, //  定位成功后将定位到的位置作为地图中心点，默认：true
//             zoomToAccuracy: true, //  定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
//         });
//         mapObj.addControl(geolocation);
//         geolocation.getCurrentPosition();
//     });
//     return geolocation;
// },
// };
export const location = function (fn) {
    AMap.plugin('AMap.Geolocation', function () {
        var geolocation = new AMap.Geolocation({
            // 是否使用高精度定位，默认：true
            enableHighAccuracy: true,
            // 设置定位超时时间，默认：无穷大
            // timeout: 10000,
            // 定位按钮的停靠位置的偏移量，默认：Pixel(10, 20)
            // buttonOffset: new AMap.Pixel(10, 20),
            //  定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
            // zoomToAccuracy: true,
            //  定位按钮的排放位置,  RB表示右下
            // buttonPosition: 'RB'
        })

        geolocation.getCurrentPosition()
        AMap.event.addListener(geolocation, 'complete', onComplete)
        AMap.event.addListener(geolocation, 'error', onError)
        function onComplete(data) {
            // data是具体的定位信息
            fn(data);
        }
        function onError(data) {
            // 定位出错
            fn(data);
        }
    })
};

 src/store/getters.js

@@ -1,6 +1,20 @@
const getters = {
    viewer: state => state.viewer.viewer,
// 手机端
const mobile = {
    mviewer: state => state.mobile.mviewer,
    mBigPopup: state => state.mobile.mBigPopup,
    mBigPopupAfter: state => state.mobile.mBigPopupAfter,
    iconHide: state => state.mobile.iconHide,
    DC: state => state.mobile.DC,
    MobileWindowsHide: state => state.mobile.MobileWindowsHide,
    MobileWindowChangeData: state => state.mobile.MobileWindowChangeData,
    popupsDom: state => state.mobile.popupsDom,
    query: state => state.mobile.query,
    openmobileGoTo: state => state.mobile.openmobileGoTo,
    openmobilePanorama: state => state.mobile.openmobilePanorama
}
const getters = {
    ...mobile,
    viewer: state => state.viewer.viewer,
    popupBgUrl: state => state.popupParams.popupBgUrl,
    pupupQRUrl: state => state.popupParams.pupupQRUrl,
    pointPosition: state => state.popupParams.pointPosition,

 src/store/modules/mobile.js

@@ -1,14 +1,97 @@
import $store from '../index'
const mobile = {
    state: {
        mviewer: null
        mviewer: null,//地图实体类
        mBigPopup: false,//全屏弹窗
        mBigPopupAfter: false,////全屏弹窗之前的弹窗
        ips: '',//获取的ip
        iconHide: false,//右侧伸缩状态
        DC: '',//DC全局保存
        MobileWindowsHide: true,//改变点击窗口的显示状态
        MobileWindowChangeData: false,//改变点击窗口的数据
        popupsDom: '',//mobileDivForms的实体类
        query: {},//传输数据
        openmobileGoTo: false,//测试
        openmobilePanorama: false,//实景显影
    },
    mutations: {
        MSET_VIEWER(state, viewer) {
            state.mviewer = viewer
        },
        MSET_BIGPOPUP(state, viewer) {
            state.mBigPopup = viewer;
            $store.dispatch("closeMobileWindowsDom"); //关闭弹窗
        },
        MSET_BIGPOPUPAFTER(state, viewer) {
            state.mBigPopupAfter = viewer;
            $store.dispatch("closeMobileWindowsDom"); //关闭弹窗
        },
        MSET_ICONHIDE(state, viewer) {
            state.iconHide = viewer
        },
        MSET_DC(state, viewer) {
            state.DC = viewer
        },
        MSET_MOBILEWINDOWSHIDE(state, viewer) {
            state.MobileWindowChangeData = !state.MobileWindowChangeData;
            state.MobileWindowsHide = viewer
        },
        MSET_POPUPDOM(state, viewer) {
            state.popupsDom = viewer
        },
        MSET_QUERY(state, viewer) {
            state.query = viewer
        },
        MSET_OPENMOBILEGOTO(state, viewer) {
            state.openmobileGoTo = viewer
        },
        MSET_OPENMOBILEPANORAMA(state, viewer) {
            state.openmobilePanorama = viewer
        }
    },
    actions: {

        setMobileWindows({ state, commit, }, data) {
            if (data.useJWD) {
                var ellipsoid = state.mviewer.scene.globe.ellipsoid;
                var cartographic = state.DC.Namespace.Cesium.Cartographic.fromDegrees(
                    data.lntLat[0],
                    data.lntLat[1] - 0.00006,
                    "90.648862227"
                );
                data.position = ellipsoid.cartographicToCartesian(cartographic);
            }
            // 传递响应数据
            commit("MSET_QUERY", data);
            // 定制化窗体
            let popupsDom = new state.DC.mobileDivForms(state.mviewer, {
                domId: "mobilePopup",
                title: data.query.name || "成教楼  ",
                className: "mobilePopup",
                content: document.getElementById("mobile-map_content_content"),
                position: [data.position],
            });
            commit("MSET_MOBILEWINDOWSHIDE", false)
            state.mviewer.zoomToPosition(
                new state.DC.Position(data.lntLat[0], data.lntLat[1] - 0.012, 1530, 0, -45)
            );
            commit("MSET_POPUPDOM", popupsDom)
        },
        closeMobileWindowsDom({ state, commit }) {
            if (!state.MobileWindowsHide && state.popupsDom) {
                state.popupsDom.closeOur();
                commit("MSET_MOBILEWINDOWSHIDE", true);
            }
        },
        CHANGETOC3({ state, commit }, data) {// //转换经纬度坐标 成世界坐标cartesian3
            var ellipsoid = state.mviewer.scene.globe.ellipsoid;
            var cartographic = state.DC.Namespace.Cesium.Cartographic.fromDegrees(
                data.lnt,
                data.lat - 0.0004,
                data.alt || "90.648862227"
            );
            var position = ellipsoid.cartographicToCartesian(cartographic);
            return position;
        }
    }
}


 src/store/modules/popupParams.js

@@ -13,10 +13,10 @@
        panoramaPopup: false
    },
    mutations: {
        SET_POPUPBGURL (state, popupBgUrl) {
        SET_POPUPBGURL(state, popupBgUrl) {
            state.popupBgUrl = popupBgUrl
        },
        SET_POPUPQRURL (state, pupupQRUrl) {
        SET_POPUPQRURL(state, pupupQRUrl) {
            state.pupupQRUrl = pupupQRUrl
        },
        SET_TERMINUS (state, terminus) {

 src/styles/mobile/popup.scss

@@ -1,7 +1,8 @@
#mobile-map_popup_content {
    //弹窗
    width: 100%;
    position: fixed;
    z-index: 99;
    z-index: 999;
    left: -1000px;
    box-sizing: border-box;
    #mobilePopup {
@@ -61,25 +62,98 @@
    }
}

// 比例尺
#mobile-viewer-container .dc-distance-legend {
    right: 5px !important;
    left: auto !important;
}
// 缩放控制
#mobile-viewer-container .dc-zoom-controller {
    left: 20px !important;
    top: 20px !important;
    .zoom-in .refresh .zoom-out {
        width: 32px !important;
        height: 32px !important;
        background-color: #c9302c !important;
$controllerw: 35px !important;
#mobile-viewer-container {
    // 继承类
    .flexCenter {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        color: white !important;
        font-size: 22px !important;
        margin-bottom: 12px !important;
        border-radius: 5px !important;
    }
    // 比例尺
    .dc-distance-legend {
        right: 5px !important;
        left: auto !important;
    }
    // 缩放控制
    .dc-zoom-controller {
        width: 32px !important;
        height: auto !important;
        left: 20px !important;
        top: 50px !important;
        // z-index: 200;
        background-color: transparent !important;
        border: 1px solid transparent !important;

        div:nth-child(1) {
            // border-bottom: 1px solid #ebebeb;
            margin-bottom: 37px !important;
        }
        div:nth-child(2) {
            display: none !important;
        }
        div:nth-child(3) {
            // border-top: 1px solid #ebebeb;
        }
        div {
            width: $controllerw;
            height: $controllerw;
            position: relative !important;
            left: -1px !important;
            background-color: #c9302c !important;
            color: white !important;
            @extend .flexCenter;
            border-radius: 5px;
            svg {
                width: 20px !important;
                height: 20px !important;
            }
        }
    }
    //弹窗标签栏的标签
    .m_p_center {
        .el-tabs {
            width: 100% !important;
            height: 100% !important;
            box-sizing: border-box;
            .el-tabs__nav-scroll {
                width: 100% !important;
                @extend .flexCenter;
            }
            .el-tabs__content {
                width: 100% !important;
                height: calc(100% - 55px) !important;
                box-sizing: border-box;
                .el-tab-pane {
                    width: 100% !important;
                    height: 100% !important;
                }
            }
        }
    }

    //地图底部按钮下拉菜单
    .m-left-mobileCortrolButtom {
        .el-dropdown {
            width: 100% !important;
            height: 100% !important;
            @extend .flexCenter;
            .el-icon-s-flag.icon {
                position: relative;
                top: 10px;
                left: 10px;
            }
        }
    }

    //滚动条
    /*定义滑块 内阴影+圆角*/
    ::-webkit-scrollbar-thumb {
        border-radius: 10px;
        width: 2px !important;
        /*滚动条的圆角*/
        -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.9);
        background-color: #f1f1f1;
        /*滚动条的背景颜色*/
    }
}

			@@ -1,18 +1,27 @@
			<!DOCTYPE html>
			<html lang="">
			<head>
			<meta charset="utf-8">
			<meta http-equiv="X-UA-Compatible" content="IE=edge">
			<meta name="viewport" content="width=device-width,initial-scale=1.0">
			<link rel="icon" href="<%= BASE_URL %>favicon.ico">
			<title>智慧校园大数据三维可视化平台</title>
			<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
			</head>
			<body>
			<noscript>
			<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
			</noscript>
			<div id="app"></div>
			<!-- built files will be auto injected -->
			</body>
			</html>

			<head>
			<meta charset="utf-8">
			<meta http-equiv="X-UA-Compatible" content="IE=edge">
			<meta name="viewport" content="width=device-width,initial-scale=1.0">
			<link rel="icon" href="<%= BASE_URL %>favicon.ico">
			<title>智慧校园大数据三维可视化平台</title>
			<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
			<!-- 高德定位 -->
			<script type="text/javascript"
			src="https://webapi.amap.com/maps?v=1.4.15&key=4b3e1db3211054ce5b466407cbb9d221"></script>
			<!-- ip -->
			<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>
			</head>

			<body>
			<noscript>
			<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.
			Please enable it to continue.</strong>
			</noscript>
			<div id="app"></div>
			<!-- built files will be auto injected -->
			</body>

			</html>

New file
			@@ -0,0 +1,18 @@
			/*
			* @Author: Morpheus
			* @Date: 2021-05-09 15:17:44
			* @Last Modified by: liu
			* @Last Modified time: 2021-12-15 16:43:48
			*/
			// 党群机构
			import request from '@/router/axios'

			export const getIp = (params) => {
			return request({
			// url: 'https://apis.map.qq.com/ws/location/v1/ip',
			// let url = `https://apis.map.qq.com/ws/location/v1/ip?ip=${data.ip}&key=${data.key}`;
			url: `http://192.168.31.179:9898/ws/location/v1/ip?ip=${params.ip}&key=${params.key}`,
			method: 'get',
			// params: params
			})
			}

			@@ -1,7 +1,8 @@
			<template>
			<div class="m-left-control">
			<div class="m-l-inbut" @click="zoomIn('+')">+</div>
			<div class="m-l-inbut" @click="zoomIn('-')">-</div>
			<div class="m-l-inbut zoom-in" @click="zoomIn">
			<i class="el-icon-refresh"></i>
			</div>
			</div>
			</template>

			@@ -9,12 +10,31 @@
			import { mapGetters } from "vuex";
			export default {
			name: "mobileCortrol",
			data() {
			return {
			DC: "",
			};
			},
			computed: {
			...mapGetters(["mviewer"]),
			},
			created() {
			this.DC = global.DC;
			},
			methods: {
			zoomIn(val) {
			console.log(val);
			let that = this;
			// console.log(val);
			// 121.49592752204283 31.23567802276832
			this.mviewer.zoomToPosition(
			new that.DC.Position(
			121.49592752204283,
			31.23567802276832 - 0.012,
			2530,
			0,
			-45
			)
			);
			// let camera = this.mviewer.camera;
			// // console.log(camera.moveStart());
			// // this.mviewer.getImageryLayerInfo().then((res) => {
			@@ -65,11 +85,11 @@
			.m-left-control {
			position: fixed;
			left: 20px;
			top: 20px;
			z-index: 200;
			top: 87px;
			z-index: 201 !important;
			.m-l-inbut {
			width: 32px;
			height: 32px;
			width: 35px;
			height: 35px;
			background-color: #c9302c;
			display: flex;
			align-items: center;

			@@ -1,30 +1,95 @@
			<template>
			<div class="m-left-mobileCortrolButtom">
			<div class="m-l-inbut"><i class="el-icon-s-help"></i></div>
			<div class="m-l-inbut"><i class="el-icon-s-flag"></i></div>
			<div class="m-l-inbut"><i class="el-icon-menu"></i></div>
			<div class="m-l-inbut"><i class="el-icon-location"></i></div>
			<div class="m-l-inbut">
			<!-- <i class="el-icon-s-flag"></i> -->
			<el-dropdown trigger="click" @command="handleCommand">
			<span class="el-dropdown-link icons">
			<i class="el-icon-s-flag icon"></i>
			</span>
			<el-dropdown-menu slot="dropdown">
			<el-dropdown-item
			v-for="(item, index) in flagList"
			:key="index"
			:command="item"
			>{{ item.name }}</el-dropdown-item
			>
			</el-dropdown-menu>
			</el-dropdown>
			</div>
			<div class="m-l-inbut" @click="openBigPopupAfter">
			<i class="el-icon-menu"></i>
			</div>
			<div class="m-l-inbut" @click="goOn"><i class="el-icon-location"></i></div>
			</div>
			</template>

			<script>
			import { mapGetters } from "vuex";
			import { getIp, getUsers } from "@/api/mobile/ip/index";
			export default {
			name: "mobileCortrolButtom",
			computed: {},
			data() {
			return {
			viewer: null,
			DC: null,
			DC: "",
			flagList: [
			{
			name: "西东大街",
			position: [121.49500690245499, 31.23791479409691],
			},
			{
			name: "长江路",
			position: [121.52498934134815, 31.227021231622302],
			},
			{
			name: "科技园",
			position: [121.48624368075255, 31.197575925580797],
			},
			{
			name: "逸夫楼",
			position: [121.52391709005656, 31.276115901927575],
			},
			],
			};
			},
			computed: {
			...mapGetters(["mviewer", "openmobileGoTo"]),
			},
			created() {
			this.DC = global.DC;
			},
			mounted() {},
			methods: {
			initialize(viewer) {
			viewer.scene.globe.depthTestAgainstTerrain = false;
			this.viewer = viewer;
			handleCommand(command) {
			let that = this;
			console.log(command, "定位");
			// 定位
			this.mviewer.zoomToPosition(
			new that.DC.Position(
			command.position[0],
			command.position[1] - 0.012,
			1530,
			0,
			-45
			)
			);
			},
			openBigPopupAfter() {
			this.$store.commit("MSET_BIGPOPUPAFTER", true);
			},
			goOn() {
			let that = this;
			this.$store.commit("MSET_OPENMOBILEGOTO", !that.openmobileGoTo);
			// console.log(returnCitySN["cip"]);
			// let data = {
			// ip: returnCitySN["cip"],
			// key: "7WKBZ-QDY62-WEEUG-C7KUN-ADAF5-L5BKZ",
			// };
			// console.log("定位", data.ip);
			// getIp(data).then((res) => {
			// // getUsers(data).then((res) => {
			// console.log(res);
			// });
			},
			},
			};
			@@ -48,6 +113,19 @@
			font-size: 22px;
			margin-left: 12px;
			border-radius: 5px;
			.icons {
			display: inline-block;
			width: 100%;
			height: 100%;
			}
			.icon {
			font-size: 20px;
			color: #fff;
			&::before {
			width: 100%;
			height: 100%;
			}
			}
			}
			}
			</style>

			@@ -6,6 +6,7 @@
			slot="append"
			class="iconSearch"
			icon="el-icon-search"
			@click="search"
			></el-button>
			</el-input>
			</div>
			@@ -20,6 +21,7 @@
			return {
			viewer: null,
			DC: null,
			input: "",
			};
			},
			created() {
			@@ -31,6 +33,11 @@
			viewer.scene.globe.depthTestAgainstTerrain = false;
			this.viewer = viewer;
			},
			search() {
			let that = this;
			this.$store.commit("MSET_BIGPOPUP", { search: true, value: that.input });
			that.input = "";
			},
			},
			};
			</script>

New file
			@@ -0,0 +1,63 @@
			<template>
			<div v-show="openmobileGoTo" class="mobileGoTo">
			<el-input v-model="lnt"></el-input>
			<el-input v-model="lat"></el-input>
			<!-- <el-input v-model="alt"></el-input> -->
			<el-button type="primary" @click="submitForm('')">跳转</el-button>
			</div>
			</template>

			<script>
			import { mapGetters } from "vuex";
			export default {
			name: "mobileGoTo",
			computed: {
			...mapGetters([
			"openmobileGoTo",
			"mviewer",
			"DC",
			"query",
			"MobileWindowChangeData",
			]),
			},
			data() {
			return {
			lnt: "121.53772514948211",
			lat: "31.23938286341316",
			alt: "90.648862227",
			};
			},
			watch: {
			MobileWindowChangeData() {
			this.lnt = this.query.lntLat[0];
			this.lat = this.query.lntLat[1];
			},
			},
			methods: {
			submitForm() {
			if (this.lnt && this.lat) {
			let that = this;
			// 定制化窗体
			let position = {};
			let lntLat = [that.lnt, that.lat];
			let d = {
			position,
			lntLat,
			query: { position, lntLat },
			useJWD: true, //仅使用经纬度
			};
			that.$store.dispatch("setMobileWindows", d);
			}
			},
			},
			};
			</script>

			<style lang="scss" scoped>
			.mobileGoTo {
			position: fixed;
			bottom: 60px;
			width: 73%;
			z-index: 500;
			}
			</style>

			@@ -1,7 +1,7 @@
			<template>
			<div class="m-left-nav" :style="[navStyle]">
			<!-- :style="[coutrolStyle]" -->
			<div class="m-left-coutrol" @click="iconHide = !iconHide">
			<div class="m-left-coutrol" @click="changeIconHide">
			<i :class="icons"></i>
			</div>
			<ul>
			@@ -18,9 +18,9 @@
			</template>

			<script>
			import { mapGetters } from "vuex";
			export default {
			name: "mobileLeftNav",
			computed: {},
			watch: {
			iconHide() {
			if (this.iconHide) {
			@@ -34,10 +34,12 @@
			}
			},
			},
			computed: {
			...mapGetters(["iconHide"]),
			},
			data() {
			return {
			icons: "el-icon-d-arrow-right",
			iconHide: false,
			navStyle: {
			right: "0px",
			},
			@@ -132,6 +134,10 @@
			},
			mounted() {},
			methods: {
			changeIconHide() {
			let isif = this.iconHide;
			this.$store.commit("MSET_ICONHIDE", !isif);
			},
			generatePosition(num) {
			const list = [];
			for (let i = 0; i < num; i++) {
			@@ -150,22 +156,30 @@
			item.img = item.normal;
			this[item.layer].show = false;
			}
			this.$store.dispatch("closeMobileWindowsDom"); //关闭弹窗
			},
			initialize(viewer) {
			var that = this;
			viewer.scene.globe.depthTestAgainstTerrain = false;
			this.viewer = viewer;
			this.tagLayer = new this.DC.HtmlLayer("tagLayer");
			viewer.addLayer(this.tagLayer);

			this.wayLayer = new this.DC.HtmlLayer("wayLayer");
			viewer.addLayer(this.wayLayer);

			this.sceneLayer = new this.DC.VectorLayer("sceneLayer");
			viewer.addLayer(this.sceneLayer);

			this.activityLayer = new this.DC.VectorLayer("activityLayer");
			viewer.addLayer(this.activityLayer);

			this.aedLayer = new this.DC.VectorLayer("aedLayer");
			viewer.addLayer(this.aedLayer);

			this.parkLayer = new this.DC.HtmlLayer("parkLayer");
			viewer.addLayer(this.parkLayer);

			this.comeLayer = new this.DC.VectorLayer("comeLayer");
			viewer.addLayer(this.comeLayer);

			@@ -184,7 +198,18 @@
			</div>
			`
			);
			this.tagLayer.addOverlay(divIcon);
			// e.overlay._position._lng,
			// e.overlay._position._lat - 0.012,
			//订阅事件1
			divIcon.on(DC.MouseEventType.CLICK, (e) => {
			// 定制化窗体
			that.openPopupS(
			e.position,
			[e.overlay._position._lng, e.overlay._position._lat],
			{ name: "标签" }
			);
			});
			this.tagLayer.addOverlay(divIcon); //标签
			});

			const positions2 = this.generatePosition(50);
			@@ -202,7 +227,16 @@
			</div>
			`
			);
			this.wayLayer.addOverlay(divIcon);
			//订阅事件2
			divIcon.on(DC.MouseEventType.CLICK, (e) => {
			// 定制化窗体
			that.openPopupS(
			e.position,
			[e.overlay._position._lng, e.overlay._position._lat],
			{ name: "道路" }
			);
			});
			this.wayLayer.addOverlay(divIcon); //道路
			});

			const positions3 = this.generatePosition(50);
			@@ -212,7 +246,44 @@
			"/img/leftnav/map-panorama.png"
			);
			billboard.size = [16, 16];
			this.sceneLayer.addOverlay(billboard);
			//订阅事件3
			billboard.on(DC.MouseEventType.CLICK, (e) => {
			// 定制化窗体
			that.openPopupS(
			e.position,
			[e.wgs84Position.lng, e.wgs84Position.lat],
			{ name: "实景" }
			);
			});
			this.sceneLayer.addOverlay(billboard); //实景
			});

			const positions10 = this.generatePosition(50);
			positions10.forEach((item) => {
			const label = new this.DC.Label(item, "活动");
			label.setStyle({
			fillColor: this.DC.Color.ORANGERED,
			font: "10px sans-serif",
			pixelOffset: { x: 0, y: -16 },
			});
			this.activityLayer.addOverlay(label);

			const billboard = new this.DC.Billboard(
			item,
			"/img/leftnav/map-aed.png"
			// "/img/leftnav/map-panorama.png"
			);
			billboard.size = [16, 16];
			//订阅事件10
			billboard.on(DC.MouseEventType.CLICK, (e) => {
			// 定制化窗体
			that.openPopupS(
			e.position,
			[e.wgs84Position.lng, e.wgs84Position.lat],
			{ name: "活动" }
			);
			});
			this.activityLayer.addOverlay(billboard); //活动
			});

			const positions4 = this.generatePosition(10);
			@@ -230,8 +301,16 @@
			"/img/leftnav/map-aed.png"
			);
			billboard.size = [16, 16];

			this.aedLayer.addOverlay(billboard);
			//订阅事件4
			billboard.on(DC.MouseEventType.CLICK, (e) => {
			// 定制化窗体
			that.openPopupS(
			e.position,
			[e.wgs84Position.lng, e.wgs84Position.lat],
			{ name: "建筑AED" }
			);
			});
			this.aedLayer.addOverlay(billboard); //AED
			});

			const positions5 = this.generatePosition(120);
			@@ -253,6 +332,15 @@
			</div>
			`
			);
			//订阅事件5
			divIcon.on(DC.MouseEventType.CLICK, (e) => {
			// 定制化窗体
			that.openPopupS(
			e.position,
			[e.overlay._position._lng, e.overlay._position._lat],
			{ name: "校外街路侧停车场" }
			);
			});
			this.parkLayer.addOverlay(divIcon);
			});

			@@ -273,17 +361,42 @@
			"/img/leftnav/map-activity.png"
			);
			billboard.size = [16, 16];

			//订阅事件6
			billboard.on(DC.MouseEventType.CLICK, (e) => {
			// 定制化窗体
			that.openPopupS(
			e.position,
			[e.wgs84Position.lng, e.wgs84Position.lat],
			{ name: "123" }
			);
			});
			this.comeLayer.addOverlay(billboard);
			});

			this.tagLayer.show = false;
			this.wayLayer.show = false;
			this.sceneLayer.show = false;
			this.activityLayer.show = false;
			this.aedLayer.show = false;
			this.parkLayer.show = false;
			this.comeLayer.show = false;
			},
			mobileOpenImgs1() {
			let imgsDom = document.getElementById("mobileBigImgs");
			imgsDom.click();
			},
			goOn1() {},
			openPopupS(position, lntLat, query) {
			let that = this;
			// 定制化窗体
			let d = {
			position,
			lntLat,
			query: { ...(query \|\| {}), position, lntLat },
			useJWD: true, //仅使用经纬度
			};
			that.$store.dispatch("setMobileWindows", d);
			},
			},
			};
			</script>

New file
			@@ -0,0 +1,45 @@
			<template>
			<div v-show="openmobilePanorama" class="mobilePanorama">
			<div class="mobilePanorama-close" @click="closeMobilePanorama">
			<i class="el-icon-error icon"></i>
			</div>
			</div>
			</template>

			<script>
			import { mapGetters } from "vuex";
			export default {
			name: "mobilePanorama",
			computed: {
			...mapGetters(["openmobilePanorama"]),
			},
			data() {
			return {};
			},
			methods: {
			closeMobilePanorama() {
			this.$store.commit("MSET_OPENMOBILEPANORAMA", false);
			},
			},
			};
			</script>

			<style lang="scss" scoped>
			.mobilePanorama {
			position: fixed;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			z-index: 1000;
			background-color: #fff;
			.mobilePanorama-close {
			position: absolute;
			right: 5px;
			top: 5px;
			.icon {
			font-size: 35px;
			}
			}
			}
			</style>

New file
			@@ -0,0 +1,367 @@
			<template>
			<div id="mobilePopupOur" v-loading.fullscreen.lock="fullscreenLoading">
			<div class="m_p_heard">
			<div class="m_p_h_break" @click="closeBigPopup">
			<i class="el-icon-arrow-left icon"></i>
			</div>
			<div class="m_p_h_center">
			<div>
			<div v-if="mBigPopup.search" style="color: #fff">
			查询结果{{ searchLabel ? "--" + searchLabel : "" }}
			</div>
			<el-dropdown trigger="click" @command="choiceIt" v-else>
			<span class="el-dropdown-link">
			{{ choiceValue }}<i class="el-icon-arrow-down el-icon--right"></i>
			</span>
			<el-dropdown-menu slot="dropdown">
			<el-dropdown-item
			v-for="(item, index) in choiceData"
			:key="index"
			:command="item.name"
			>{{ item.name }}</el-dropdown-item
			>
			</el-dropdown-menu>
			</el-dropdown>
			</div>
			</div>
			</div>
			<div class="m_p_center">
			<el-tabs v-model="activeName" @tab-click="handleClick">
			<el-tab-pane
			v-for="(item, index) in tabTable"
			:key="index"
			:label="item.label"
			:name="item.value"
			>
			<div class="m_p_c_tableIn">
			<el-empty
			v-show="item.child.length == 0"
			description="暂无数据"
			></el-empty>
			<mobilePopupOurOnce
			v-for="(citem, cindex) in item.child"
			:key="cindex"
			:ends="item.child.length - 1 == cindex"
			:onceData="citem"
			></mobilePopupOurOnce>
			<div v-show="item.child.length != 0">
			<el-divider content-position="left">
			<i class="el-icon-s-promotion"></i>   暂无更多
			</el-divider>
			</div>
			</div>
			</el-tab-pane>
			</el-tabs>
			</div>
			</div>
			</template>

			<script>
			import { mapGetters } from "vuex";
			export default {
			computed: {
			...mapGetters(["mBigPopup"]),
			},
			name: "mobilePopupOur",
			data() {
			return {
			searchLabel: "",
			choiceValue: "",
			choiceData: [
			{
			name: "党群机构",
			value: "1",
			},
			{
			name: "职能部门",
			value: "2",
			},
			{
			name: "其他机构",
			value: "3",
			},
			],
			tabTable: [
			{
			label: "西东大街",
			value: "first",
			child: [
			{
			name: "电力部门",
			icon: "",
			lntLat: [121.49907024133591, 31.234911748958513],
			buts: ["实景", "图集", "定位"],
			},
			{
			name: "保安部门",
			icon: "",
			lntLat: [121.51198333955459, 31.216073280697593],
			buts: ["图集", "定位"],
			},
			{
			name: "图书馆",
			icon: "",
			lntLat: [121.4945198122125, 31.213002416673532],
			buts: ["定位"],
			},
			{
			name: "电力部门",
			icon: "",
			lntLat: [121.49907024133591, 31.234911748958513],
			buts: ["实景", "图集", "定位"],
			},
			{
			name: "保安部门",
			icon: "",
			lntLat: [121.51198333955459, 31.216073280697593],
			buts: ["图集", "定位"],
			},
			{
			name: "图书馆",
			icon: "",
			lntLat: [121.4945198122125, 31.213002416673532],
			buts: ["定位"],
			},
			{
			name: "电力部门",
			icon: "",
			lntLat: [121.49907024133591, 31.234911748958513],
			buts: ["实景", "图集", "定位"],
			},
			{
			name: "保安部门",
			icon: "",
			lntLat: [121.51198333955459, 31.216073280697593],
			buts: ["图集", "定位"],
			},
			{
			name: "图书馆",
			icon: "",
			lntLat: [121.4945198122125, 31.213002416673532],
			buts: ["定位"],
			},
			{
			name: "电力部门",
			icon: "",
			lntLat: [121.49907024133591, 31.234911748958513],
			buts: ["实景", "图集", "定位"],
			},
			{
			name: "保安部门",
			icon: "",
			lntLat: [121.51198333955459, 31.216073280697593],
			buts: ["图集", "定位"],
			},
			{
			name: "图书馆",
			icon: "",
			lntLat: [121.4945198122125, 31.213002416673532],
			buts: ["定位"],
			},
			{
			name: "电力部门",
			icon: "",
			lntLat: [121.49907024133591, 31.234911748958513],
			buts: ["实景", "图集", "定位"],
			},
			{
			name: "保安部门",
			icon: "",
			lntLat: [121.51198333955459, 31.216073280697593],
			buts: ["图集", "定位"],
			},
			{
			name: "图书馆",
			icon: "",
			lntLat: [121.4945198122125, 31.213002416673532],
			buts: ["定位"],
			},
			{
			name: "电力部门",
			icon: "",
			lntLat: [121.49907024133591, 31.234911748958513],
			buts: ["实景", "图集", "定位"],
			},
			{
			name: "保安部门",
			icon: "",
			lntLat: [121.51198333955459, 31.216073280697593],
			buts: ["图集", "定位"],
			},
			{
			name: "图书馆",
			icon: "",
			lntLat: [121.4945198122125, 31.213002416673532],
			buts: ["定位"],
			},
			{
			name: "电力部门",
			icon: "",
			lntLat: [121.49907024133591, 31.234911748958513],
			buts: ["实景", "图集", "定位"],
			},
			{
			name: "保安部门",
			icon: "",
			lntLat: [121.51198333955459, 31.216073280697593],
			buts: ["图集", "定位"],
			},
			{
			name: "图书馆",
			icon: "",
			lntLat: [121.4945198122125, 31.213002416673532],
			buts: ["定位"],
			},
			{
			name: "电力部门",
			icon: "",
			lntLat: [121.49907024133591, 31.234911748958513],
			buts: ["实景", "图集", "定位"],
			},
			{
			name: "保安部门",
			icon: "",
			lntLat: [121.51198333955459, 31.216073280697593],
			buts: ["图集", "定位"],
			},
			{
			name: "图书馆",
			icon: "",
			lntLat: [121.4945198122125, 31.213002416673532],
			buts: ["定位"],
			},
			],
			},
			{
			label: "长江路",
			value: "second",
			child: [
			{
			name: "电力部门1",
			icon: "",
			position: [121.49190702133591, 31.234911741858513],
			buts: ["实景", "图集", "定位"],
			},
			{
			name: "保安部门1",
			icon: "",
			position: [121.49907021413591, 31.234911741895513],
			buts: ["图集", "定位"],
			},
			{
			name: "图书馆1",
			icon: "",
			position: [121.49901024133591, 31.234911749581513],
			buts: ["定位"],
			},
			],
			},
			{
			label: "科技园",
			value: "third",
			child: [],
			},
			{
			label: "逸夫楼",
			value: "fourth",
			child: [],
			},
			],
			fullscreenLoading: false,
			activeName: "first",
			};
			},
			// watch: {
			// mBigPopup() {
			// console.log(this.mBigPopup.name);
			// this.choiceValue = this.mBigPopup.name;
			// },
			// },
			mounted() {
			this.fullscreenLoading = true;
			setTimeout(() => {
			if (this.mBigPopup.search) {
			this.searchLabel = this.mBigPopup.value;
			console.log("查询搜索结果", this.mBigPopup.value);
			this.fullscreenLoading = false;
			return;
			}
			this.choiceValue = this.mBigPopup.name;
			this.fullscreenLoading = false;
			this.$store.commit("MSET_BIGPOPUPAFTER", false);
			console.log("请求对应街道接口");
			}, 500);
			// this.choiceValue = this.choiceData[0].name;
			},
			methods: {
			handleClick(tab, event) {
			console.log(tab.name);
			},
			choiceIt(name) {
			this.fullscreenLoading = true;
			setTimeout(() => {
			this.choiceValue = name;
			this.fullscreenLoading = false;
			console.log("请求对应头部下拉菜单接口");
			}, 500);
			},
			closeBigPopup() {
			this.$store.commit("MSET_BIGPOPUP", false);
			},
			},
			};
			</script>

			<style lang="scss" scoped>
			#mobilePopupOur {
			position: fixed;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background-color: #fff;
			z-index: 300;
			.m_p_heard {
			width: 100%;
			height: 50px;
			background-color: #a40000;
			.m_p_h_break {
			position: absolute;
			left: 0;
			top: 0;
			width: 50px;
			height: 50px;
			display: flex;
			align-items: center;
			justify-content: center;
			.icon {
			font-size: 22px;
			color: #fff;
			}
			}
			.m_p_h_center {
			width: 100%;
			height: 50px;
			display: flex;
			align-items: center;
			justify-content: center;
			.el-dropdown-link {
			color: #fff;
			}
			}
			}
			.m_p_center {
			width: 100%;
			height: calc(100% - 50px);
			// border: 1px solid red
			box-sizing: border-box;
			.m_p_c_tableIn {
			width: 100%;
			height: 100%;
			box-sizing: border-box;
			overflow-x: hidden;
			overflow-y: auto;
			}
			}
			}
			</style>

New file
			@@ -0,0 +1,135 @@
			<template>
			<div id="mobilePopupOurAfter">
			<div class="m_p_a_heard">
			<div><i class="el-icon-menu icon"></i></div>
			<div @click="closeBigPopupAfter"><i class="el-icon-close icon"></i></div>
			</div>
			<div class="m_p_a_center">
			<div class="m_p_a_center_group">
			<div
			class="m_p_a_center_once"
			v-for="(item, index) in choiceDataUp"
			@click="openBigPopup(item)"
			:key="index"
			>
			<div class="m_p_a_c_o_up"><i :class="[item.icon]"></i></div>
			<div class="m_p_a_c_o_down">{{ item.name }}</div>
			</div>
			</div>
			<div class="m_p_a_center_group">
			<div
			class="m_p_a_center_once"
			v-for="(item, index) in choiceDataDown"
			@click="openBigPopup(item)"
			:key="index"
			>
			<div class="m_p_a_c_o_up"><i :class="[item.icon]"></i></div>
			<div class="m_p_a_c_o_down">{{ item.name }}</div>
			</div>
			</div>
			</div>
			</div>
			</template>

			<script>
			export default {
			name: "mobilePopupOurAfter",
			data() {
			return {
			choiceValue: "",
			choiceDataUp: [
			{
			name: "机构单位",
			icon: "el-icon-s-cooperation",
			},
			{
			name: "校园建筑",
			icon: "el-icon-s-management",
			},
			{
			name: "生活设施",
			icon: "el-icon-s-flag",
			},
			],
			choiceDataDown: [
			{
			name: "文化风景",
			icon: "el-icon-s-opportunity",
			},
			{
			name: "出入口",
			icon: "el-icon-s-promotion",
			},
			{
			name: "停车场",
			icon: "el-icon-s-flag",
			},
			],
			};
			},
			mounted() {},
			methods: {
			openBigPopup(val) {
			this.$store.commit("MSET_BIGPOPUP", val);
			},
			closeBigPopupAfter() {
			this.$store.commit("MSET_BIGPOPUPAFTER", false);
			},
			},
			};
			</script>

			<style lang="scss" scoped>
			.flexCenter {
			display: flex;
			align-items: center;
			justify-content: center;
			}
			#mobilePopupOurAfter {
			position: fixed;
			top: 37.5%;
			left: 13.5%;
			width: 75%;
			height: 25%;
			background-color: #fff;
			z-index: 300;
			.m_p_a_heard {
			width: 100%;
			height: 35px;
			box-sizing: border-box;
			padding: 5px 15px;
			@extend .flexCenter;
			justify-content: space-between;
			background-color: #a40000;
			div {
			width: 35px;
			height: 35px;
			@extend .flexCenter;
			}
			.icon {
			font-size: 24px;
			color: #fff;
			}
			}
			.m_p_a_center {
			width: 100%;
			height: calc(100% - 35px);
			@extend .flexCenter;
			flex-direction: column;
			.m_p_a_center_group {
			width: 100%;
			height: 40%;
			@extend .flexCenter;
			.m_p_a_center_once {
			width: 30%;
			height: 100%;
			background-color: #a40000;
			color: #fff;
			border: 2px solid rgb(255, 255, 255);
			@extend .flexCenter;
			flex-direction: column;
			}
			}
			}
			}
			</style>

New file
			@@ -0,0 +1,132 @@
			<template>
			<div class="mobilePopupOurOnce">
			<div
			class="mobilePopupOurOnce_center"
			:style="{
			borderBottom: !ends ? '#d4d4d4 dashed 1px' : '',
			marginBottom: !ends ? '6px' : '',
			}"
			>
			<div class="mobilePopupOurOnce_left">
			<img src="img/cc/cc.png" alt="" />
			</div>
			<div class="mobilePopupOurOnce_right">
			<div class="mobilePopupOurOnce_r_up">{{ onceData.name }}</div>
			<div class="mobilePopupOurOnce_r_down">
			<div v-for="(item, index) in seebut" :key="index">
			<el-link
			icon="el-icon-map-location"
			class="mobilePopupOurOnce_r_d_in"
			@click="openOnce(item.name)"
			>{{ item.name }}</el-link
			>
			<el-divider
			direction="vertical"
			class="mobilePopupOurOnce_r_d_in"
			v-if="index != seebut.length - 1"
			></el-divider>
			</div>
			</div>
			</div>
			</div>
			</div>
			</template>

			<script>
			import { mapGetters } from "vuex";
			export default {
			props: ["onceData", "ends"],
			name: "mobilePopupOurOnce",
			created() {
			this.DC = global.DC;
			},
			data() {
			return {
			DC: "",
			};
			},
			computed: {
			...mapGetters(["mviewer"]),
			seebut() {
			let buts = this.onceData.buts;
			let b = [];
			for (let k in buts) {
			b.push({
			name: buts[k],
			});
			}
			return b;
			},
			},
			methods: {
			openOnce(val) {
			let that = this;
			console.log(val, this.onceData);
			if (val == "定位") {
			this.$store.commit("MSET_BIGPOPUP", false);
			setTimeout(() => {
			// 定制化窗体
			let d = {
			position: {},
			lntLat: that.onceData.lntLat,
			query: this.onceData,
			useJWD: true, //仅使用经纬度
			};
			that.popupsDom = that.$store.dispatch("setMobileWindows", d);
			}, 500);
			} else if (val == "实景") {
			this.$store.commit("MSET_OPENMOBILEPANORAMA", true);
			}
			},
			},
			};
			</script>

			<style lang="scss" scoped>
			// 继承类
			.flexCenter {
			display: flex !important;
			align-items: center !important;
			justify-content: center !important;
			}
			.mobilePopupOurOnce {
			padding: 0 0;
			margin: 0 8px;
			.mobilePopupOurOnce_center {
			// margin-bottom: 8px;
			height: 80px;
			// border-bottom: #d4d4d4 dashed 1px;
			padding-bottom: 8px;
			@extend .flexCenter;
			.mobilePopupOurOnce_left {
			width: 32%;
			height: 100%;
			@extend .flexCenter;
			}
			.mobilePopupOurOnce_right {
			width: 68%;
			height: 100%;
			@extend .flexCenter;
			flex-direction: column;
			.mobilePopupOurOnce_r_up {
			height: 50%;
			width: 100%;
			font-size: 16px;
			text-indent: 1em;
			display: flex !important;
			align-items: center !important;
			}
			.mobilePopupOurOnce_r_down {
			height: 50%;
			width: 100%;
			padding-left: 1em;
			display: flex !important;
			align-items: center !important;
			.mobilePopupOurOnce_r_d_in {
			font-size: 17px;
			}
			}
			}
			}
			}
			</style>

New file
			@@ -0,0 +1,80 @@
			<template>
			<div
			ref="mobile-mapContentContent"
			v-show="!MobileWindowsHide"
			id="mobile-map_content_content"
			>
			<div class="mobile-popup-imgs-heard">
			<img :src="url" alt="" />
			<el-image
			style="width: 100px; height: 100px"
			:src="url"
			id="mobileBigImgs"
			v-show="false"
			:preview-src-list="srcList"
			>
			</el-image>
			<div>{{ query.query }}</div>
			<!-- 哈工大A10公寫总建筑面积30740平方米,于2001年采用货款方式高标准建造并投入使用。整个楼体共分十层,地上九层为公寫主体。公寓外观呈工字型,公寓内房司以A、B、C三个区域別分,与哈工大雄厚的工科底蕴遥相呼应,是哈尔滨工业大学学生公寫的标志性建筑 -->
			</div>
			<div class="mobile-popup-control">
			<el-link icon="el-icon-picture-outline-round" @click="mobileOpenImgs"
			>图集</el-link
			>
			<el-divider direction="vertical"></el-divider>
			<el-link icon="el-icon-map-location" @click="openMobilePanorama"
			>实景</el-link
			>
			<el-divider direction="vertical"></el-divider>
			<el-link icon="el-icon-aim" @click="goOn">去这</el-link>
			</div>
			</div>
			</template>

			<script>
			import { mapGetters } from "vuex";
			export default {
			name: "mobileWindow",
			computed: {
			...mapGetters(["MobileWindowsHide", "query", "MobileWindowChangeData"]),
			},
			watch: {
			MobileWindowChangeData() {
			// this.fullscreenLoading = true;
			if (!this.MobileWindowsHide) {
			// setTimeout(() => {
			// this.fullscreenLoading = false;
			console.log("地图点击弹窗数据请求参数", this.query);
			// console.log("地图点击弹窗数据请求参数", this.query.lntLat[0]);
			// console.log("地图点击弹窗数据请求参数", this.query.lntLat[1]);
			// }, 500);
			}
			},
			},
			data() {
			return {
			fullscreenLoading: false,
			url: "/img/job/one.jpg",
			positions: "",
			srcList: [
			"https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg",
			"https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg",
			],
			};
			},
			methods: {
			mobileOpenImgs() {
			let imgsDom = document.getElementById("mobileBigImgs");
			imgsDom.click();
			},
			goOn() {},
			openMobilePanorama() {
			console.log(11);
			this.$store.commit("MSET_OPENMOBILEPANORAMA", true);
			},
			},
			};
			</script>

			<style>
			</style>

			@@ -1,63 +1,66 @@
			/* eslint-disable camelcase */
			<template>
			<div id="mobile-viewer-container">
			<!-- 地图图标弹窗↓ -->
			<div id="mobile-map_popup_content"></div>

			<div
			ref="mobile-mapContentContent"
			v-show="popupWindow"
			id="mobile-map_content_content"
			>
			<div class="mobile-popup-imgs-heard">
			<img :src="url" alt="" />
			<el-image
			style="width: 100px; height: 100px"
			:src="url"
			id="mobileBigImgs"
			v-show="false"
			:preview-src-list="srcList"
			>
			</el-image>
			哈工大A10公寫总建筑面积30740平方米,于2001年采用货款方式高标准建造并投入使用。整个楼体共分十层,地上九层为公寫主体。公寓外观呈工字型,公寓内房司以A、B、C三个区域別分,与哈工大雄厚的工科底蕴遥相呼应,是哈尔滨工业大学学生公寫的标志性建筑
			</div>
			<div class="mobile-popup-control">
			<el-link icon="el-icon-picture-outline-round" @click="mobileOpenImgs"
			>图集</el-link
			>
			<el-divider direction="vertical"></el-divider>

			<el-link icon="el-icon-map-location">实景</el-link>
			<el-divider direction="vertical"></el-divider>
			<el-link icon="el-icon-aim">去这</el-link>
			</div>
			</div>
			<mobileWindow></mobileWindow>
			<!-- 地图图标弹窗↑ -->
			<!-- 控制↓ -->
			<mobileLeftNav ref="mobileLeftNav"></mobileLeftNav>
			<mobileCortrol ref="mobileCortrol"></mobileCortrol>
			<mobileCortrolButtom ref="mobileCortrolButtom"></mobileCortrolButtom>
			<mobileCortrolSearch ref="mobileCortrolSearch"></mobileCortrolSearch>
			<!-- 控制↑ -->
			<!-- 控制大弹窗的弹窗 -->
			<mobilePopupOurAfter v-if="mBigPopupAfter"></mobilePopupOurAfter>
			<!-- 大弹窗 -->
			<mobilePopupOur :style="[bigPopup]" v-if="mBigPopup"></mobilePopupOur>
			<!-- 测试-跳转位置 -->
			<mobileGoTo></mobileGoTo>
			<!-- 实景窗口 -->
			<mobilePanorama></mobilePanorama>
			</div>
			</template>
			<script>
			import { mapGetters } from "vuex";

			export default {
			name: "mobilemapBox",
			data() {
			return {
			url: "/img/job/one.jpg",
			srcList: [
			"https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg",
			"https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg",
			],
			popupFlag: false,
			popupWindow: false,
			DC: "",
			bigPopup: {
			width: 0,
			height: 0,
			// transition: "all 3s",
			},
			};
			},
			computed: {
			...mapGetters(["mviewer"]),
			...mapGetters([
			"mviewer",
			"MobileWindowsHide",
			"mBigPopup",
			"mBigPopupAfter",
			"iconHide",
			"popupsDom",
			]),
			},
			watch: {
			mBigPopup() {
			if (this.mBigPopup) {
			this.bigPopup.width = "100%";
			this.bigPopup.height = "100%";
			this.bigPopup.display = "inline-block";
			} else {
			this.bigPopup.width = "0";
			this.bigPopup.height = "0";
			this.bigPopup.display = "none";
			}
			},
			},
			mounted() {
			var DC = global.DC;
			this.DC = DC;

			var that = this;

			@@ -132,6 +135,7 @@
			});
			that.$refs.mobileLeftNav.initialize(viewer);
			that.$store.commit("MSET_VIEWER", viewer);
			that.$store.commit("MSET_DC", DC);
			const popup = viewer.popup;

			popup.hide();
			@@ -144,7 +148,7 @@
			name: "影像",
			});

			// // eslint-disable-next-line camelcase
			// eslint-disable-next-line camelcase
			// const baselayer_shaded = DC.ImageryLayerFactory.createArcGisImageryLayer({
			// url: "http://services.arcgisonline.com/arcgis/rest/services/World_Shaded_Relief/MapServer",
			// });
			@@ -170,6 +174,20 @@
			// iconUrl: "examples/images/icon/ter.png",
			// name: "地形",
			// });

			// 地图移动事件
			viewer.on(DC.MouseEventType.MOUSE_MOVE, (e) => {
			if (!that.iconHide) {
			that.$store.commit("MSET_ICONHIDE", true);
			}
			that.$store.dispatch("closeMobileWindowsDom"); //关闭弹窗
			// if (!that.MobileWindowsHide && that.popupsDom) {
			// that.popupsDom.closeOur();
			// that.$store.commit("MSET_MOBILEWINDOWSHIDE", true);
			// }
			// nowPosition = [e.wgs84Position.lng, e.wgs84Position.lat];
			// console.log(nowPosition);
			});

			const layer = new DC.TilesetLayer("layer");
			viewer.addLayer(layer);
			@@ -198,30 +216,16 @@

			tileset.on(DC.MouseEventType.CLICK, (e) => {
			// that.popupFlag = true
			that.popupWindow = true;
			// that.popupWindow = true;

			viewer.scene.globe.depthTestAgainstTerrain = false;

			// console.log(document.getElementById("mobile-map_content_content"));
			console.log(e.position);
			console.log(e);

			// 定制化窗体
			var divForms = new DC.mobileDivForms(viewer, {
			domId: "mobilePopup",
			title: "成教楼 ",
			className: "mobilePopup",
			content: document.getElementById("mobile-map_content_content"),
			position: [e.position],
			});
			viewer.zoomToPosition(
			new DC.Position(
			e.wgs84Position.lng,
			e.wgs84Position.lat - 0.016,
			2030,
			0,
			-45
			)
			);
			that.openPopupS(e.position, [e.wgs84Position.lng, e.wgs84Position.lat]);

			// popup.setWrapper('<div></div>')

			// popup.showAt(e.position, document.getElementById('modelPopup'))
			@@ -232,7 +236,7 @@
			// )

			viewer.compass.enable = false;
			viewer.zoomController.enable = false;
			viewer.zoomController.enable = true;
			viewer.locationBar.enable = false;
			viewer.distanceLegend.enable = true;
			}
			@@ -240,9 +244,16 @@
			DC.ready(initViewer);
			},
			methods: {
			mobileOpenImgs() {
			let imgsDom = document.getElementById("mobileBigImgs");
			imgsDom.click();
			openPopupS(position, lntLat, query) {
			let that = this;
			// 定制化窗体
			let d = {
			position,
			lntLat,
			query: { ...(query \|\| {}), position, lntLat },
			useJWD: true, //仅使用经纬度
			};
			that.$store.dispatch("setMobileWindows", d);
			},
			},
			};

			@@ -20,12 +20,13 @@
			*
			*/
			constructor(viewer, popup) {
			this._viewer = viewer
			this._popup = popup
			this._position = popup.position
			this._title = popup.title
			this._content = popup.content
			this.appendPopup()
			this._viewer = viewer;
			this._popup = popup;
			this._position = popup.position;
			this._title = popup.title;
			this._content = popup.content;
			this.appendPopup();
			this.isOpen = true;
			}

			get viewer() {
			@@ -58,6 +59,9 @@

			// 创建元素并追加
			createVideoWindowAll(id, className, position) {
			let dom = document.getElementById('mobile-map_popup_content');
			dom.style.display = 'block';

			var childs = document.getElementById('mobile-map_popup_content').getElementsByTagName('div')

			if (childs.length > 0) {
			@@ -70,53 +74,9 @@

			var el = $("<div class=''></div>")

			// var divBig = $("<div style='width: 100%; height: 100%;' class=''></div>")

			// var divForms = $("<div class='divForms divForms-theme'></div>")

			// var divFormsWrap = $("<div class='divForms-wrap'></div>")

			// var area = $("<div class='area'></div>")

			// var arrowLt = $("<div class='arrow-lt'></div>")
			// var bT = $("<div class='b-t'></div>")
			// var bR = $("<div class='b-r'></div>")
			// var bB = $("<div class='b-b'></div>")
			// var bL = $("<div class='b-l'></div>")
			// var arrowRb = $("<div class='arrow-rb'></div>")

			// var labelWrap = $("<div class='label-wrap'></div>")
			var titleDiv = $("<div class='mobiletitle'></div>").text(this._title)
			var labelContent = $("<div class='mobilelabel-content'></div>").append(this._content)

			// var titleDiv = $("<div class='mobiletitle'>楼</div>")
			// var labelContent = $("<div class='mobilelabel-content'>内容</div>")

			// labelWrap.append(titleDiv)
			// labelWrap.append(labelContent)

			// var bTL = $("<div class='b-t-l'></div>")
			// var bBR = $("<div class='b-b-r'></div>")

			// var arrow = $("<div class='arrow'></div>")

			// area.append(arrowLt)
			// area.append(bT)
			// area.append(bR)
			// area.append(bB)
			// area.append(bL)
			// area.append(arrowRb)
			// area.append(labelWrap)

			// divFormsWrap.append(area)
			// divFormsWrap.append(bTL)
			// divFormsWrap.append(bBR)

			// divForms.append(divFormsWrap)
			// divForms.append(arrow)

			// divBig.append(divForms)
			// el.append(divBig)
			el.append(titleDiv)
			el.append(labelContent)

			@@ -127,6 +87,9 @@
			$('#mobile-map_popup_content').append(el)

			this._viewer.scene.postRender.addEventListener(function () {
			if (!self.isOpen) {
			return;
			}
			const windowCoord = DC.Namespace.Cesium.SceneTransforms.wgs84ToWindowCoordinates(
			self._viewer.scene,
			position
			@@ -137,6 +100,9 @@
			}

			positionPopUp(windowCoord, id) {
			if (!windowCoord) {
			return;
			}
			const wx = document.getElementById('app').clientWidth;
			const x = windowCoord.x - (wx / 100 * 35);
			const y = windowCoord.y - document.getElementById(id).offsetHeight - 15;
			@@ -149,6 +115,18 @@
			transform:translate3d(${Math.round(x)}px,${Math.round(y)}px, 0);
			`
			}
			closeOur() {
			this.isOpen = false;
			let dom = document.getElementById('mobile-map_popup_content');
			dom.style.display = 'none';
			// var childs = document.getElementById('mobile-map_popup_content').getElementsByTagName('div')

			// if (childs.length > 0) {
			// for (var i = 0; i < childs.length; i++) {
			// document.getElementById('mobile-map_popup_content').removeChild(childs[i])
			// }
			// }
			}
			}

			export default mobileDivForms

New file
			@@ -0,0 +1,60 @@
			/**
			* 高德地图定位
			*
			*/
			// export const location = {
			// undefined
			// initMap(id) {
			// // undefined
			// let mapObj = new AMap.Map(id, {});
			// let geolocation;
			// mapObj.plugin(["AMap.Geolocation"], function () {
			// // undefined
			// geolocation = new AMap.Geolocation({
			// // undefined
			// enableHighAccuracy: true, // 是否使用高精度定位，默认:true
			// timeout: 10000, // 超过10秒后停止定位，默认：无穷大
			// maximumAge: 0, // 定位结果缓存0毫秒，默认：0
			// convert: true, // 自动偏移坐标，偏移后的坐标为高德坐标，默认：true
			// showButton: true, // 显示定位按钮，默认：true
			// buttonPosition: "LB", // 定位按钮停靠位置，默认：'LB'，左下角
			// buttonOffset: new AMap.Pixel(10, 20), // 定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
			// showMarker: true, // 定位成功后在定位到的位置显示点标记，默认：true
			// showCircle: true, // 定位成功后用圆圈表示定位精度范围，默认：true
			// panToLocation: true, // 定位成功后将定位到的位置作为地图中心点，默认：true
			// zoomToAccuracy: true, // 定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
			// });
			// mapObj.addControl(geolocation);
			// geolocation.getCurrentPosition();
			// });
			// return geolocation;
			// },
			// };
			export const location = function (fn) {
			AMap.plugin('AMap.Geolocation', function () {
			var geolocation = new AMap.Geolocation({
			// 是否使用高精度定位，默认：true
			enableHighAccuracy: true,
			// 设置定位超时时间，默认：无穷大
			// timeout: 10000,
			// 定位按钮的停靠位置的偏移量，默认：Pixel(10, 20)
			// buttonOffset: new AMap.Pixel(10, 20),
			// 定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
			// zoomToAccuracy: true,
			// 定位按钮的排放位置, RB表示右下
			// buttonPosition: 'RB'
			})

			geolocation.getCurrentPosition()
			AMap.event.addListener(geolocation, 'complete', onComplete)
			AMap.event.addListener(geolocation, 'error', onError)
			function onComplete(data) {
			// data是具体的定位信息
			fn(data);
			}
			function onError(data) {
			// 定位出错
			fn(data);
			}
			})
			};

			@@ -1,6 +1,20 @@
			const getters = {
			viewer: state => state.viewer.viewer,
			// 手机端
			const mobile = {
			mviewer: state => state.mobile.mviewer,
			mBigPopup: state => state.mobile.mBigPopup,
			mBigPopupAfter: state => state.mobile.mBigPopupAfter,
			iconHide: state => state.mobile.iconHide,
			DC: state => state.mobile.DC,
			MobileWindowsHide: state => state.mobile.MobileWindowsHide,
			MobileWindowChangeData: state => state.mobile.MobileWindowChangeData,
			popupsDom: state => state.mobile.popupsDom,
			query: state => state.mobile.query,
			openmobileGoTo: state => state.mobile.openmobileGoTo,
			openmobilePanorama: state => state.mobile.openmobilePanorama
			}
			const getters = {
			...mobile,
			viewer: state => state.viewer.viewer,
			popupBgUrl: state => state.popupParams.popupBgUrl,
			pupupQRUrl: state => state.popupParams.pupupQRUrl,
			pointPosition: state => state.popupParams.pointPosition,

			@@ -1,14 +1,97 @@
			import $store from '../index'
			const mobile = {
			state: {
			mviewer: null
			mviewer: null,//地图实体类
			mBigPopup: false,//全屏弹窗
			mBigPopupAfter: false,////全屏弹窗之前的弹窗
			ips: '',//获取的ip
			iconHide: false,//右侧伸缩状态
			DC: '',//DC全局保存
			MobileWindowsHide: true,//改变点击窗口的显示状态
			MobileWindowChangeData: false,//改变点击窗口的数据
			popupsDom: '',//mobileDivForms的实体类
			query: {},//传输数据
			openmobileGoTo: false,//测试
			openmobilePanorama: false,//实景显影
			},
			mutations: {
			MSET_VIEWER(state, viewer) {
			state.mviewer = viewer
			},
			MSET_BIGPOPUP(state, viewer) {
			state.mBigPopup = viewer;
			$store.dispatch("closeMobileWindowsDom"); //关闭弹窗
			},
			MSET_BIGPOPUPAFTER(state, viewer) {
			state.mBigPopupAfter = viewer;
			$store.dispatch("closeMobileWindowsDom"); //关闭弹窗
			},
			MSET_ICONHIDE(state, viewer) {
			state.iconHide = viewer
			},
			MSET_DC(state, viewer) {
			state.DC = viewer
			},
			MSET_MOBILEWINDOWSHIDE(state, viewer) {
			state.MobileWindowChangeData = !state.MobileWindowChangeData;
			state.MobileWindowsHide = viewer
			},
			MSET_POPUPDOM(state, viewer) {
			state.popupsDom = viewer
			},
			MSET_QUERY(state, viewer) {
			state.query = viewer
			},
			MSET_OPENMOBILEGOTO(state, viewer) {
			state.openmobileGoTo = viewer
			},
			MSET_OPENMOBILEPANORAMA(state, viewer) {
			state.openmobilePanorama = viewer
			}
			},
			actions: {

			setMobileWindows({ state, commit, }, data) {
			if (data.useJWD) {
			var ellipsoid = state.mviewer.scene.globe.ellipsoid;
			var cartographic = state.DC.Namespace.Cesium.Cartographic.fromDegrees(
			data.lntLat[0],
			data.lntLat[1] - 0.00006,
			"90.648862227"
			);
			data.position = ellipsoid.cartographicToCartesian(cartographic);
			}
			// 传递响应数据
			commit("MSET_QUERY", data);
			// 定制化窗体
			let popupsDom = new state.DC.mobileDivForms(state.mviewer, {
			domId: "mobilePopup",
			title: data.query.name \|\| "成教楼 ",
			className: "mobilePopup",
			content: document.getElementById("mobile-map_content_content"),
			position: [data.position],
			});
			commit("MSET_MOBILEWINDOWSHIDE", false)
			state.mviewer.zoomToPosition(
			new state.DC.Position(data.lntLat[0], data.lntLat[1] - 0.012, 1530, 0, -45)
			);
			commit("MSET_POPUPDOM", popupsDom)
			},
			closeMobileWindowsDom({ state, commit }) {
			if (!state.MobileWindowsHide && state.popupsDom) {
			state.popupsDom.closeOur();
			commit("MSET_MOBILEWINDOWSHIDE", true);
			}
			},
			CHANGETOC3({ state, commit }, data) {// //转换经纬度坐标成世界坐标cartesian3
			var ellipsoid = state.mviewer.scene.globe.ellipsoid;
			var cartographic = state.DC.Namespace.Cesium.Cartographic.fromDegrees(
			data.lnt,
			data.lat - 0.0004,
			data.alt \|\| "90.648862227"
			);
			var position = ellipsoid.cartographicToCartesian(cartographic);
			return position;
			}
			}
			}

			@@ -13,10 +13,10 @@
			panoramaPopup: false
			},
			mutations: {
			SET_POPUPBGURL (state, popupBgUrl) {
			SET_POPUPBGURL(state, popupBgUrl) {
			state.popupBgUrl = popupBgUrl
			},
			SET_POPUPQRURL (state, pupupQRUrl) {
			SET_POPUPQRURL(state, pupupQRUrl) {
			state.pupupQRUrl = pupupQRUrl
			},
			SET_TERMINUS (state, terminus) {

			@@ -1,7 +1,8 @@
			#mobile-map_popup_content {
			//弹窗
			width: 100%;
			position: fixed;
			z-index: 99;
			z-index: 999;
			left: -1000px;
			box-sizing: border-box;
			#mobilePopup {
			@@ -61,25 +62,98 @@
			}
			}

			// 比例尺
			#mobile-viewer-container .dc-distance-legend {
			right: 5px !important;
			left: auto !important;
			}
			// 缩放控制
			#mobile-viewer-container .dc-zoom-controller {
			left: 20px !important;
			top: 20px !important;
			.zoom-in .refresh .zoom-out {
			width: 32px !important;
			height: 32px !important;
			background-color: #c9302c !important;
			$controllerw: 35px !important;
			#mobile-viewer-container {
			// 继承类
			.flexCenter {
			display: flex !important;
			align-items: center !important;
			justify-content: center !important;
			color: white !important;
			font-size: 22px !important;
			margin-bottom: 12px !important;
			border-radius: 5px !important;
			}
			// 比例尺
			.dc-distance-legend {
			right: 5px !important;
			left: auto !important;
			}
			// 缩放控制
			.dc-zoom-controller {
			width: 32px !important;
			height: auto !important;
			left: 20px !important;
			top: 50px !important;
			// z-index: 200;
			background-color: transparent !important;
			border: 1px solid transparent !important;

			div:nth-child(1) {
			// border-bottom: 1px solid #ebebeb;
			margin-bottom: 37px !important;
			}
			div:nth-child(2) {
			display: none !important;
			}
			div:nth-child(3) {
			// border-top: 1px solid #ebebeb;
			}
			div {
			width: $controllerw;
			height: $controllerw;
			position: relative !important;
			left: -1px !important;
			background-color: #c9302c !important;
			color: white !important;
			@extend .flexCenter;
			border-radius: 5px;
			svg {
			width: 20px !important;
			height: 20px !important;
			}
			}
			}
			//弹窗标签栏的标签
			.m_p_center {
			.el-tabs {
			width: 100% !important;
			height: 100% !important;
			box-sizing: border-box;
			.el-tabs__nav-scroll {
			width: 100% !important;
			@extend .flexCenter;
			}
			.el-tabs__content {
			width: 100% !important;
			height: calc(100% - 55px) !important;
			box-sizing: border-box;
			.el-tab-pane {
			width: 100% !important;
			height: 100% !important;
			}
			}
			}
			}

			//地图底部按钮下拉菜单
			.m-left-mobileCortrolButtom {
			.el-dropdown {
			width: 100% !important;
			height: 100% !important;
			@extend .flexCenter;
			.el-icon-s-flag.icon {
			position: relative;
			top: 10px;
			left: 10px;
			}
			}
			}

			//滚动条
			/定义滑块内阴影+圆角/
			::-webkit-scrollbar-thumb {
			border-radius: 10px;
			width: 2px !important;
			/滚动条的圆角/
			-webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.9);
			background-color: #f1f1f1;
			/滚动条的背景颜色/
			}
			}