+把DC拉出vue实例中，解决vue内存溢出问题

liuyg

2022-03-15 7366b0a279425cb6218bec8ba19774e5e8399b91

+把DC拉出vue实例中，解决vue内存溢出问题

 src/components/map/components/mapPopup.vue

@@ -1,431 +1,445 @@
<template>
    <div>
        <div id="map_popup_content">
            <div v-if="detailsPopup" class="divForms-dom" id="divFormsDomBox">
                <div style="width: 100%; height: 100%">
                    <div class="divForms divForms-theme">
                        <div class="divForms-wrap">
                            <div class="area">
                                <div class="arrow-lt"></div>
                                <div class="b-t"></div>
                                <div class="b-r"></div>
                                <div class="b-b"></div>
                                <div class="b-l"></div>
                                <div class="arrow-rb"></div>
                                <div class="label-wrap">
                                    <div class="title">
                                        {{ stateName }}
                                        <img
                                            v-show="introduceText != null && introduceText != ''"
                                            @click="audioPlay"
                                            class="audio-control"
                                            src="/img/navicon/audio.png"
                                            alt
                                        />
                                        <img
                                            @click="closeMapPopupBox"
                                            class="close-box"
                                            src="/img/navicon/close.png"
                                            alt
                                        />
                                    </div>
                                    <div class="label-content">
                                        <div class="arc-bcg">
                                            <img :src="popupBgUrl" alt />
                                        </div>
                                        <div
                                            v-show="siteName != null && siteName != ''"
                                            class="site"
                                        >
                                            <strong>地址：</strong>
                                            {{ siteName }}
                                        </div>
                                        <div
                                            v-show="telephone != null && telephone != ''"
                                            class="phone"
                                        >
                                            <strong>电话：</strong>
                                            {{ telephone }}
                                        </div>
                                        <div
                                            v-show="introduceText != null && introduceText != ''"
                                            class="introduce"
                                        >
                                            <p ref="DomIntroduceText">
                                                <strong>介绍：</strong>
                                                <span v-html="introduceText"></span>
                                            </p>
                                        </div>
                                        <div class="popup-nav">
                                            <ul>
                                                <li @click="comeHereClick">
                                                    <i class="popup-icon come-nav deblurring"></i>
                                                    到这
                                                </li>
                                                <li @click="getToHereClick">
                                                    <i class="popup-icon start-nav deblurring"></i>
                                                    出发
                                                </li>
                                                <li v-show="pupupQRUrl != ''" @click="qrCodeClick">
                                                    <i class="popup-icon qr-code-nav deblurring"></i>
                                                    二维码
                                                </li>
                                                <li @click="imgsClick">
                                                    <i class="popup-icon atlas-nav deblurring"></i>
                                                    图集
                                                </li>
                                                <li
                                                    v-show="panoramaUrl != null && panoramaUrl != ''"
                                                    @click="panoramaClick"
                                                >
                                                    <i
                                                        class="popup-icon live-action-nav deblurring"
                                                    ></i>
                                                    实景
                                                </li>
                                                <!-- v-show="panoramaUrl != null && panoramaUrl != ''" -->
                                                <li v-show="false" @click="monitorClick">
                                                    <i class="popup-icon monitor-nav deblurring"></i>
                                                    监控
                                                </li>
                                            </ul>
                                        </div>
                                        <div
                                            v-show="teachList.length > 0 || liveList.length > 0"
                                            class="arc-box"
                                        >
                                            <ul class="tab-btn">
                                                <li
                                                    v-show="teachList.length > 0"
                                                    :class="{ on: tabBtnFlag == '教学科研行政' }"
                                                    @click="tabBtnClick('教学科研行政')"
                                                >教学科研行政</li>
                                                <li
                                                    v-show="liveList.length > 0"
                                                    :class="{ on: tabBtnFlag == '生活服务' }"
                                                    @click="tabBtnClick('生活服务')"
                                                >生活服务</li>
                                            </ul>
                                            <div class="btm-content">
                                                <div :class="{ on: tabBtnFlag == '教学科研行政' }">
                                                    <ul>
                                                        <li
                                                            v-for="(item, index) in teachList"
                                                            :key="index"
                                                            @click="mechanismDetailPopup(0, item)"
                                                        >
                                                            <i
                                                                class="popup-icon location-icon deblurring"
                                                            ></i>
                                                            {{ item }}
                                                        </li>
                                                    </ul>
                                                </div>
                                                <div :class="{ on: tabBtnFlag == '生活服务' }">
                                                    <ul>
                                                        <li
                                                            v-for="(item, index) in liveList"
                                                            :key="index"
                                                            @click="mechanismDetailPopup(1, item)"
                                                        >
                                                            <i
                                                                class="popup-icon location-icon deblurring"
                                                            ></i>
                                                            {{ item }}
                                                        </li>
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="btm-box"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="b-t-l"></div>
                            <div class="b-b-r"></div>
                        </div>
                        <div class="arrow"></div>
  <div>
    <div id="map_popup_content">
      <div v-if="detailsPopup" class="divForms-dom" id="divFormsDomBox">
        <div style="width: 100%; height: 100%">
          <div class="divForms divForms-theme">
            <div class="divForms-wrap">
              <div class="area">
                <div class="arrow-lt"></div>
                <div class="b-t"></div>
                <div class="b-r"></div>
                <div class="b-b"></div>
                <div class="b-l"></div>
                <div class="arrow-rb"></div>
                <div class="label-wrap">
                  <div class="title">
                    {{ stateName }}
                    <img
                      v-show="introduceText != null && introduceText != ''"
                      @click="audioPlay"
                      class="audio-control"
                      src="/img/navicon/audio.png"
                      alt
                    />
                    <img
                      @click="closeMapPopupBox"
                      class="close-box"
                      src="/img/navicon/close.png"
                      alt
                    />
                  </div>
                  <div class="label-content">
                    <div class="arc-bcg">
                      <img :src="popupBgUrl" alt />
                    </div>
                </div>
            </div>

            <div
                v-if="panoramaPopup"
                class="panorama-dom"
                :class="{ 'change-full': fullscreen }"
                id="PanoramaBox"
            >
                <div style="width: 100%; height: 100%">
                    <div class="panorama-container">
                        <div class="panorama-wrap">
                            <div
                                class="content-wrap"
                                :class="{ 'change-full': fullscreen }"
                                id="FullScreenBox"
                    <div
                      v-show="siteName != null && siteName != ''"
                      class="site"
                    >
                      <strong>地址：</strong>
                      {{ siteName }}
                    </div>
                    <div
                      v-show="telephone != null && telephone != ''"
                      class="phone"
                    >
                      <strong>电话：</strong>
                      {{ telephone }}
                    </div>
                    <div
                      v-show="introduceText != null && introduceText != ''"
                      class="introduce"
                    >
                      <p ref="DomIntroduceText">
                        <strong>介绍：</strong>
                        <span v-html="introduceText"></span>
                      </p>
                    </div>
                    <div class="popup-nav">
                      <ul>
                        <li @click="comeHereClick">
                          <i class="popup-icon come-nav deblurring"></i>
                          到这
                        </li>
                        <li @click="getToHereClick">
                          <i class="popup-icon start-nav deblurring"></i>
                          出发
                        </li>
                        <li v-show="pupupQRUrl != ''" @click="qrCodeClick">
                          <i class="popup-icon qr-code-nav deblurring"></i>
                          二维码
                        </li>
                        <li @click="imgsClick">
                          <i class="popup-icon atlas-nav deblurring"></i>
                          图集
                        </li>
                        <li
                          v-show="panoramaUrl != null && panoramaUrl != ''"
                          @click="panoramaClick"
                        >
                          <i class="popup-icon live-action-nav deblurring"></i>
                          实景
                        </li>
                        <!-- v-show="panoramaUrl != null && panoramaUrl != ''" -->
                        <li v-show="false" @click="monitorClick">
                          <i class="popup-icon monitor-nav deblurring"></i>
                          监控
                        </li>
                      </ul>
                    </div>
                    <div
                      v-show="teachList.length > 0 || liveList.length > 0"
                      class="arc-box"
                    >
                      <ul class="tab-btn">
                        <li
                          v-show="teachList.length > 0"
                          :class="{ on: tabBtnFlag == '教学科研行政' }"
                          @click="tabBtnClick('教学科研行政')"
                        >
                          教学科研行政
                        </li>
                        <li
                          v-show="liveList.length > 0"
                          :class="{ on: tabBtnFlag == '生活服务' }"
                          @click="tabBtnClick('生活服务')"
                        >
                          生活服务
                        </li>
                      </ul>
                      <div class="btm-content">
                        <div :class="{ on: tabBtnFlag == '教学科研行政' }">
                          <ul>
                            <li
                              v-for="(item, index) in teachList"
                              :key="index"
                              @click="mechanismDetailPopup(0, item)"
                            >
                                <div class="title">
                                    <img
                                        @click="returnDetailsPopup"
                                        class="return-btn"
                                        src="/img/icon/return.png"
                                        alt
                                    />
                                    {{ stateName }}
                                    <img
                                        @click="screen"
                                        class="full-srceen-btn"
                                        :src="fullScreenUrl"
                                        alt
                                    />
                                    <img
                                        @click="closePanoramaPopupBox"
                                        class="close-box"
                                        src="/img/navicon/close.png"
                                        alt
                                    />
                                </div>
                                <div class="content">
                                    <iframe
                                        allowfullscreen="true"
                                        :src="panoramaUrl"
                                        frameborder="0"
                                    ></iframe>
                                </div>
                            </div>
                              <i
                                class="popup-icon location-icon deblurring"
                              ></i>
                              {{ item }}
                            </li>
                          </ul>
                        </div>
                        <div class="arrow"></div>
                    </div>
                </div>
            </div>

            <div v-if="monitorPopup" class="monitor-dom" id="MonitorBox">
                <div style="width: 100%; height: 100%">
                    <div class="monitor-container">
                        <div class="monitor-wrap">
                            <div class="content-wrap">
                                <div class="title">
                                    <img
                                        @click="returnDetailsPopup"
                                        class="return-btn"
                                        src="/img/icon/return.png"
                                        alt
                                    />
                                    {{ stateName }}
                                    <img
                                        @click="closeMonitorPopupBox"
                                        class="close-box"
                                        src="/img/navicon/close.png"
                                        alt
                                    />
                                </div>
                                <div class="content">
                                    <video :src="monitorUrl" controls autoplay></video>
                                </div>
                            </div>
                        <div :class="{ on: tabBtnFlag == '生活服务' }">
                          <ul>
                            <li
                              v-for="(item, index) in liveList"
                              :key="index"
                              @click="mechanismDetailPopup(1, item)"
                            >
                              <i
                                class="popup-icon location-icon deblurring"
                              ></i>
                              {{ item }}
                            </li>
                          </ul>
                        </div>
                        <div class="arrow"></div>
                      </div>
                    </div>
                    <div class="btm-box"></div>
                  </div>
                </div>
              </div>
              <div class="b-t-l"></div>
              <div class="b-b-r"></div>
            </div>

            <div v-if="addTagPopup" class="divForms-dom" id="AddTagBox">
                <div style="width: 100%; height: 100%">
                    <div class="divForms divForms-theme">
                        <div class="divForms-wrap">
                            <div class="area">
                                <div class="arrow-lt"></div>
                                <div class="b-t"></div>
                                <div class="b-r"></div>
                                <div class="b-b"></div>
                                <div class="b-l"></div>
                                <div class="arrow-rb"></div>
                                <div class="label-wrap">
                                    <div class="title">
                                        地图标记
                                        <img
                                            @click="closeAddTagBox"
                                            class="close-box"
                                            src="/img/navicon/close.png"
                                            alt
                                        />
                                    </div>
                                    <div class="add-tag-content">
                                        <div>
                                            <el-input v-model="addTagName" placeholder="请输入标签名称"></el-input>
                                        </div>
                                        <div>
                                            <el-button type="primary" @click="createTag">生成标记</el-button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="b-t-l"></div>
                            <div class="b-b-r"></div>
                        </div>
                        <div class="arrow"></div>
                    </div>
                </div>
            </div>

            <div v-if="labelLayerDataShow" class="divForms-dom" id="labelLayerid">
                <div style="width: 100%; height: 100%">
                    <div class="divForms divForms-theme">
                        <div class="divForms-wrap">
                            <div class="area">
                                <div class="arrow-lt"></div>
                                <div class="b-t"></div>
                                <div class="b-r"></div>
                                <div class="b-b"></div>
                                <div class="b-l"></div>
                                <div class="arrow-rb"></div>
                                <div class="label-wrap">
                                    <div class="title">
                                        {{ nowlabelLayerData.name }}
                                        <img
                                            @click="closelabelLayerid"
                                            class="close-box"
                                            src="/img/navicon/close.png"
                                            alt
                                        />
                                    </div>
                                    <div class="add-tag-content" style="height: 250px">
                                        <!-- data:image/png;base64, -->
                                        <img
                                            :src="nowlabelLayerData.qrcode"
                                            alt
                                            class="labelLayeridewm"
                                            style="width: 250px; height: 250px"
                                        />
                                    </div>
                                </div>
                            </div>
                            <div class="b-t-l"></div>
                            <div class="b-b-r"></div>
                        </div>
                        <div class="arrow"></div>
                    </div>
                </div>
            </div>
            <div class="arrow"></div>
          </div>
        </div>
      </div>

        <!-- 新增编辑标签 -->
        <div v-if="addIconsLayerIconPopup" class="monitor-dom add-sign-box-style" id="leftNavsAdd">
            <div style="width: 100%; height: 100%">
                <div class="divForms divForms-theme">
                    <div class="divForms-wrap">
                        <div class="area">
                            <div class="arrow-lt"></div>
                            <div class="b-t"></div>
                            <div class="b-r"></div>
                            <div class="b-b"></div>
                            <div class="b-l"></div>
                            <div class="arrow-rb"></div>
                            <div class="label-wrap">
                                <div class="title">
                                    <el-input
                                        v-model="addIconFromcolumn[0].value"
                                        placeholder="请输入标签名称"
                                        class="addIconFromInput"
                                    >
                                        <template slot="prepend">标题:</template>
                                    </el-input>
                                    <img
                                        @click="closeaddIconsLayerIconPopup"
                                        class="close-box"
                                        src="/img/navicon/close.png"
                                        alt
                                    />
                                </div>
                                <div class="add-tag-content">
                                    <div class="addIconsLayer">
                                        <div
                                            :class="[
      <div
        v-if="panoramaPopup"
        class="panorama-dom"
        :class="{ 'change-full': fullscreen }"
        id="PanoramaBox"
      >
        <div style="width: 100%; height: 100%">
          <div class="panorama-container">
            <div class="panorama-wrap">
              <div
                class="content-wrap"
                :class="{ 'change-full': fullscreen }"
                id="FullScreenBox"
              >
                <div class="title">
                  <img
                    @click="returnDetailsPopup"
                    class="return-btn"
                    src="/img/icon/return.png"
                    alt
                  />
                  {{ stateName }}
                  <img
                    @click="screen"
                    class="full-srceen-btn"
                    :src="fullScreenUrl"
                    alt
                  />
                  <img
                    @click="closePanoramaPopupBox"
                    class="close-box"
                    src="/img/navicon/close.png"
                    alt
                  />
                </div>
                <div class="content">
                  <iframe
                    allowfullscreen="true"
                    :src="panoramaUrl"
                    frameborder="0"
                  ></iframe>
                </div>
              </div>
            </div>
            <div class="arrow"></div>
          </div>
        </div>
      </div>

      <div v-if="monitorPopup" class="monitor-dom" id="MonitorBox">
        <div style="width: 100%; height: 100%">
          <div class="monitor-container">
            <div class="monitor-wrap">
              <div class="content-wrap">
                <div class="title">
                  <img
                    @click="returnDetailsPopup"
                    class="return-btn"
                    src="/img/icon/return.png"
                    alt
                  />
                  {{ stateName }}
                  <img
                    @click="closeMonitorPopupBox"
                    class="close-box"
                    src="/img/navicon/close.png"
                    alt
                  />
                </div>
                <div class="content">
                  <video :src="monitorUrl" controls autoplay></video>
                </div>
              </div>
            </div>
            <div class="arrow"></div>
          </div>
        </div>
      </div>

      <div v-if="addTagPopup" class="divForms-dom" id="AddTagBox">
        <div style="width: 100%; height: 100%">
          <div class="divForms divForms-theme">
            <div class="divForms-wrap">
              <div class="area">
                <div class="arrow-lt"></div>
                <div class="b-t"></div>
                <div class="b-r"></div>
                <div class="b-b"></div>
                <div class="b-l"></div>
                <div class="arrow-rb"></div>
                <div class="label-wrap">
                  <div class="title">
                    地图标记
                    <img
                      @click="closeAddTagBox"
                      class="close-box"
                      src="/img/navicon/close.png"
                      alt
                    />
                  </div>
                  <div class="add-tag-content">
                    <div>
                      <el-input
                        v-model="addTagName"
                        placeholder="请输入标签名称"
                      ></el-input>
                    </div>
                    <div>
                      <el-button type="primary" @click="createTag"
                        >生成标记</el-button
                      >
                    </div>
                  </div>
                </div>
              </div>
              <div class="b-t-l"></div>
              <div class="b-b-r"></div>
            </div>
            <div class="arrow"></div>
          </div>
        </div>
      </div>

      <div v-if="labelLayerDataShow" class="divForms-dom" id="labelLayerid">
        <div style="width: 100%; height: 100%">
          <div class="divForms divForms-theme">
            <div class="divForms-wrap">
              <div class="area">
                <div class="arrow-lt"></div>
                <div class="b-t"></div>
                <div class="b-r"></div>
                <div class="b-b"></div>
                <div class="b-l"></div>
                <div class="arrow-rb"></div>
                <div class="label-wrap">
                  <div class="title">
                    {{ nowlabelLayerData.name }}
                    <img
                      @click="closelabelLayerid"
                      class="close-box"
                      src="/img/navicon/close.png"
                      alt
                    />
                  </div>
                  <div class="add-tag-content" style="height: 250px">
                    <!-- data:image/png;base64, -->
                    <img
                      :src="nowlabelLayerData.qrcode"
                      alt
                      class="labelLayeridewm"
                      style="width: 250px; height: 250px"
                    />
                  </div>
                </div>
              </div>
              <div class="b-t-l"></div>
              <div class="b-b-r"></div>
            </div>
            <div class="arrow"></div>
          </div>
        </div>
      </div>
    </div>

    <!-- 新增编辑标签 -->
    <div
      v-if="addIconsLayerIconPopup"
      class="monitor-dom add-sign-box-style"
      id="leftNavsAdd"
    >
      <div style="width: 100%; height: 100%">
        <div class="divForms divForms-theme">
          <div class="divForms-wrap">
            <div class="area">
              <div class="arrow-lt"></div>
              <div class="b-t"></div>
              <div class="b-r"></div>
              <div class="b-b"></div>
              <div class="b-l"></div>
              <div class="arrow-rb"></div>
              <div class="label-wrap">
                <div class="title">
                  <el-input
                    v-model="addIconFromcolumn[0].value"
                    placeholder="请输入标签名称"
                    class="addIconFromInput"
                  >
                    <template slot="prepend">标题:</template>
                  </el-input>
                  <img
                    @click="closeaddIconsLayerIconPopup"
                    class="close-box"
                    src="/img/navicon/close.png"
                    alt
                  />
                </div>
                <div class="add-tag-content">
                  <div class="addIconsLayer">
                    <div
                      :class="[
                        'addIconsLayerinimgs',
                        ourImages.length > 3 ? 'isOverImgs' : '',
                      ]"
                                        >
                                            <!-- action="https://jsonplaceholder.typicode.com/posts/" -->
                                            <el-upload
                                                :action="
                    >
                      <!-- action="https://jsonplaceholder.typicode.com/posts/" -->
                      <el-upload
                        :action="
                          apiUrls +
                          '/blade-resource/oss/endpoint/put-files-talk'
                        "
                                                list-type="picture-card"
                                                :on-preview="handlePictureCardPreview"
                                                :on-remove="handleRemove"
                                                :on-success="onsuccess"
                                            >
                                                <i class="el-icon-plus"></i>
                                            </el-upload>
                                            <el-dialog
                                                :visible.sync="dialogVisible"
                                                :modal-append-to-body="false"
                                                :append-to-body="true"
                                            >
                                                <img width="100%" :src="dialogImageUrl" alt />
                                            </el-dialog>
                                        </div>
                                        <div
                                            class="addIconsLayerin"
                                            v-for="(item, index) in addIconFromcolumn"
                                            :key="index"
                                            v-show="index != 0"
                                        >
                                            <el-input
                                                v-model="item.value"
                                                :placeholder="'请输入' + item.label"
                                                class="addIconFromInput"
                                                :disabled="index == 2 || index == 3"
                                            >
                                                <template slot="prepend">{{ item.label }}:</template>
                                            </el-input>

                                            <el-dropdown
                                                v-show="index == 2 || index == 3"
                                                @command="chouseAddicon"
                                            >
                                                <span class="el-dropdown-link">
                                                    <i class="el-icon-arrow-down el-icon--right"></i>
                                                </span>
                                                <el-dropdown-menu slot="dropdown">
                                                    <el-dropdown-item
                                                        v-for="(itemc, indexc) in item.chouse"
                                                        :key="indexc"
                                                        :command="{ index: index, indexc: indexc }"
                                                    >{{ itemc.value }}</el-dropdown-item>
                                                    <!-- @click="chouseAddicon(index, indexc)" -->
                                                </el-dropdown-menu>
                                            </el-dropdown>
                                        </div>
                                    </div>
                                    <div class="addIconsLayerBut">
                                        <el-button type="primary" @click="saveIconsLayer">保存标签</el-button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="b-t-l"></div>
                        <div class="b-b-r"></div>
                        list-type="picture-card"
                        :on-preview="handlePictureCardPreview"
                        :on-remove="handleRemove"
                        :on-success="onsuccess"
                      >
                        <i class="el-icon-plus"></i>
                      </el-upload>
                      <el-dialog
                        :visible.sync="dialogVisible"
                        :modal-append-to-body="false"
                        :append-to-body="true"
                      >
                        <img width="100%" :src="dialogImageUrl" alt />
                      </el-dialog>
                    </div>
                    <div class="arrow"></div>
                </div>
            </div>
        </div>
                    <div
                      class="addIconsLayerin"
                      v-for="(item, index) in addIconFromcolumn"
                      :key="index"
                      v-show="index != 0"
                    >
                      <el-input
                        v-model="item.value"
                        :placeholder="'请输入' + item.label"
                        class="addIconFromInput"
                        :disabled="index == 2 || index == 3"
                      >
                        <template slot="prepend">{{ item.label }}:</template>
                      </el-input>

        <!-- 二维码弹框相关 -->
        <el-dialog
            title="场景二维码"
            :visible.sync="QRCodeFlag"
            :modal="false"
            :modal-append-to-body="false"
            width="44%"
        >
            <div style="margin: 0; position: relative; width: 100%; height: 352px">
                <img
                    width="260"
                    :src="pupupQRUrl"
                    alt
                    style="
                      <el-dropdown
                        v-show="index == 2 || index == 3"
                        @command="chouseAddicon"
                      >
                        <span class="el-dropdown-link">
                          <i class="el-icon-arrow-down el-icon--right"></i>
                        </span>
                        <el-dropdown-menu slot="dropdown">
                          <el-dropdown-item
                            v-for="(itemc, indexc) in item.chouse"
                            :key="indexc"
                            :command="{ index: index, indexc: indexc }"
                            >{{ itemc.value }}</el-dropdown-item
                          >
                          <!-- @click="chouseAddicon(index, indexc)" -->
                        </el-dropdown-menu>
                      </el-dropdown>
                    </div>
                  </div>
                  <div class="addIconsLayerBut">
                    <el-button type="primary" @click="saveIconsLayer"
                      >保存标签</el-button
                    >
                  </div>
                </div>
              </div>
            </div>
            <div class="b-t-l"></div>
            <div class="b-b-r"></div>
          </div>
          <div class="arrow"></div>
        </div>
      </div>
    </div>

    <!-- 二维码弹框相关 -->
    <el-dialog
      title="场景二维码"
      :visible.sync="QRCodeFlag"
      :modal="false"
      :modal-append-to-body="false"
      width="44%"
    >
      <div style="margin: 0; position: relative; width: 100%; height: 352px">
        <img
          width="260"
          :src="pupupQRUrl"
          alt
          style="
            position: absolute;
            top: 0;
            left: 0;
@@ -433,747 +447,760 @@
            bottom: 0;
            margin: auto;
          "
                />
                <div
                    style="
        />
        <div
          style="
            position: absolute;
            bottom: 0;
            width: 100%;
            line-height: 36px;
            text-align: center;
          "
                >(右键另存为图片)</div>
            </div>
        </el-dialog>
        >
          (右键另存为图片)
        </div>
      </div>
    </el-dialog>

        <el-image
            v-show="false"
            style="width: 100px; height: 100px"
            :src="popupImgAtlas[0]"
            :preview-src-list="popupImgAtlas"
            ref="popupImgs"
        ></el-image>
    </div>
    <el-image
      v-show="false"
      style="width: 100px; height: 100px"
      :src="popupImgAtlas[0]"
      :preview-src-list="popupImgAtlas"
      ref="popupImgs"
    ></el-image>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import { getMechanismDetail } from '@/api/pc/public/arc'
import { setlabel } from '@/api/pc/label'
import { add } from '@/api/pc/leftNav/index'
import { mapGetters } from "vuex";
import { getMechanismDetail } from "@/api/pc/public/arc";
import { setlabel } from "@/api/pc/label";
import { add } from "@/api/pc/leftNav/index";

export default {
    name: 'mapPopup',
  name: "mapPopup",

    data () {
        return {
            ourImages: [],
            dialogImageUrl: '',
            dialogVisible: false,
            apiUrls: null,
            tabBtnFlag: '教学科研行政',
            QRCodeFlag: false,
            audioSource: '',
            audioFlag: false,
            audioCourse: false,
            audioSynth: null,
            audioMsg: null,
            fullscreen: false,
            fullScreenUrl: '/img/icon/bigScreen.png',
            addTagName: '',
            addIconFromcolumn: [
                // 顺序不要随便换
                {
                    label: '名称',
                    prop: 'mechanismname',
                    value: ''
                },
                {
                    label: '电话',
                    prop: 'telephone',
                    value: ''
                },
                {
                    label: '所属建筑',
                    prop: 'type',
                    dicUrl: '/api/blade-system/dict-biz/dictionary?code=building',
                    props: {
                        label: 'dictValue',
                        value: 'dictKey'
                    },
                    value: '红旗校区',
                    valueid: '1',
                    chouse: [
                        {
                            id: '1',
                            value: '红旗校区'
                        },
                        {
                            id: '2',
                            value: '黄河路'
                        },
                        {
                            id: '3',
                            value: '科学园'
                        },
                        {
                            id: '4',
                            value: '土木楼'
                        },
                        {
                            id: '5',
                            value: '三江校区'
                        }
                    ]
                },
                {
                    label: '所属社区',
                    searchLabelWidth: '110',
                    value: '行政办公',
                    valueid: '1',
                    prop: 'campus',
                    dicUrl: '/api/blade-system/dict-biz/dictionary?code=campus',
                    chouse: [
                        {
                            id: '1',
                            value: '行政办公'
                        },
                        {
                            id: '2',
                            value: '教学科研'
                        },
                        {
                            id: '3',
                            value: '社区场馆'
                        },
                        {
                            id: '4',
                            value: '学生宿舍'
                        },
                        {
                            id: '5',
                            value: '文化风景'
                        },
                        {
                            id: '6',
                            value: '家属住宅'
                        },
                        {
                            id: '7',
                            value: '主要楼宇'
                        }
                    ]
                },
  data() {
    return {
      ourImages: [],
      dialogImageUrl: "",
      dialogVisible: false,
      apiUrls: null,
      tabBtnFlag: "教学科研行政",
      QRCodeFlag: false,
      audioSource: "",
      audioFlag: false,
      audioCourse: false,
      audioSynth: null,
      audioMsg: null,
      fullscreen: false,
      fullScreenUrl: "/img/icon/bigScreen.png",
      addTagName: "",
      addIconFromcolumn: [
        // 顺序不要随便换
        {
          label: "名称",
          prop: "mechanismname",
          value: "",
        },
        {
          label: "电话",
          prop: "telephone",
          value: "",
        },
        {
          label: "所属建筑",
          prop: "type",
          dicUrl: "/api/blade-system/dict-biz/dictionary?code=building",
          props: {
            label: "dictValue",
            value: "dictKey",
          },
          value: "红旗校区",
          valueid: "1",
          chouse: [
            {
              id: "1",
              value: "红旗校区",
            },
            {
              id: "2",
              value: "黄河路",
            },
            {
              id: "3",
              value: "科学园",
            },
            {
              id: "4",
              value: "土木楼",
            },
            {
              id: "5",
              value: "三江校区",
            },
          ],
        },
        {
          label: "所属社区",
          searchLabelWidth: "110",
          value: "行政办公",
          valueid: "1",
          prop: "campus",
          dicUrl: "/api/blade-system/dict-biz/dictionary?code=campus",
          chouse: [
            {
              id: "1",
              value: "行政办公",
            },
            {
              id: "2",
              value: "教学科研",
            },
            {
              id: "3",
              value: "社区场馆",
            },
            {
              id: "4",
              value: "学生宿舍",
            },
            {
              id: "5",
              value: "文化风景",
            },
            {
              id: "6",
              value: "家属住宅",
            },
            {
              id: "7",
              value: "主要楼宇",
            },
          ],
        },

                {
                    label: '介绍',
                    prop: 'introduce',
                    value: '',
                    component: 'AvueUeditor',
                    options: {
                        action: '/api/blade-resource/oss/endpoint/put-file',
                        props: {
                            res: 'data',
                            url: 'link'
                        }
                    },
                    hide: true,
                    minRows: 5,
                    span: 24
                },
                {
                    label: '地址',
                    hide: true,
                    prop: 'address',
                    value: ''
                },
                {
                    label: '全景地址',
                    prop: 'panoramaurl',
                    value: ''
                },
                {
                    label: '监控地址',
                    hide: true,
                    prop: 'videourl',
                    value: ''
                },
                {
                    label: '网站地址',
                    prop: 'websiteurl',
                    value: ''
                },
                {
                    label: '经度',
                    prop: 'jd',
                    value: '',
                    rules: [
                        {
                            required: true,
                            message: '请输入经度',
                            trigger: 'blur'
                        }
                    ]
                },
                {
                    label: '纬度',
                    prop: 'wd',
                    value: '',
                    rules: [
                        {
                            required: true,
                            message: '请输入纬度',
                            trigger: 'blur'
                        }
                    ]
                },
                {
                    label: '偏航角',
                    addDisplay: false,
                    hide: true,
                    prop: 'heading',
                    value: 0
                },
                {
                    label: '俯仰角',
                    addDisplay: false,
                    hide: true,
                    prop: 'pitch',
                    value: -90
                },
                {
                    label: '翻转角',
                    addDisplay: false,
                    hide: true,
                    prop: 'roll',
                    value: 0
                },
        {
          label: "介绍",
          prop: "introduce",
          value: "",
          component: "AvueUeditor",
          options: {
            action: "/api/blade-resource/oss/endpoint/put-file",
            props: {
              res: "data",
              url: "link",
            },
          },
          hide: true,
          minRows: 5,
          span: 24,
        },
        {
          label: "地址",
          hide: true,
          prop: "address",
          value: "",
        },
        {
          label: "全景地址",
          prop: "panoramaurl",
          value: "",
        },
        {
          label: "监控地址",
          hide: true,
          prop: "videourl",
          value: "",
        },
        {
          label: "网站地址",
          prop: "websiteurl",
          value: "",
        },
        {
          label: "经度",
          prop: "jd",
          value: "",
          rules: [
            {
              required: true,
              message: "请输入经度",
              trigger: "blur",
            },
          ],
        },
        {
          label: "纬度",
          prop: "wd",
          value: "",
          rules: [
            {
              required: true,
              message: "请输入纬度",
              trigger: "blur",
            },
          ],
        },
        {
          label: "偏航角",
          addDisplay: false,
          hide: true,
          prop: "heading",
          value: 0,
        },
        {
          label: "俯仰角",
          addDisplay: false,
          hide: true,
          prop: "pitch",
          value: -90,
        },
        {
          label: "翻转角",
          addDisplay: false,
          hide: true,
          prop: "roll",
          value: 0,
        },

                {
                    label: '高度',
                    hide: true,
                    addDisplay: false,
                    prop: 'gd',
                    value: 0
                }
        {
          label: "高度",
          hide: true,
          addDisplay: false,
          prop: "gd",
          value: 0,
        },

                // {
                //   label: "图片",
                //   prop: "tpurl",
                //   value: "",
                //   // dataType: 'string',
                //   type: "upload",
                //   propsHttp: {
                //     res: "data",
                //     url: "link",
                //   },
                //   span: 10,
                //   listType: "picture-card",
                //   tip: "只能上传jpg/png文件，且不超过500kb",
                //   action: "/api/blade-resource/oss/endpoint/put-file",
                // },
                // {
                //   label: "二维码",
                //   prop: "codeurl",
                //   value: "",
                //   type: "upload",
                //   listType: "picture-card",
                //   //dataType: 'string',
                //   action: "/api/blade-resource/oss/endpoint/put-file",
                //   propsHttp: {
                //     res: "data",
                //     url: "link",
                //   },
                //   span: 10,
                // },
            ]
        // {
        //   label: "图片",
        //   prop: "tpurl",
        //   value: "",
        //   // dataType: 'string',
        //   type: "upload",
        //   propsHttp: {
        //     res: "data",
        //     url: "link",
        //   },
        //   span: 10,
        //   listType: "picture-card",
        //   tip: "只能上传jpg/png文件，且不超过500kb",
        //   action: "/api/blade-resource/oss/endpoint/put-file",
        // },
        // {
        //   label: "二维码",
        //   prop: "codeurl",
        //   value: "",
        //   type: "upload",
        //   listType: "picture-card",
        //   //dataType: 'string',
        //   action: "/api/blade-resource/oss/endpoint/put-file",
        //   propsHttp: {
        //     res: "data",
        //     url: "link",
        //   },
        //   span: 10,
        // },
      ],
    };
  },
  computed: {
    ...mapGetters([
      "popupBgUrl",
      "pupupQRUrl",
      // 终点
      "terminus",
      // 起点
      "startingPoint",
      // 点信息
      "pointPosition",
      // 点名称
      "stateName",
      // 地址
      "siteName",
      // 电话
      "telephone",
      // 介绍
      "introduceText",
      // 详情弹框显示关闭
      "detailsPopup",
      // 全景地址
      "panoramaUrl",
      // 全景弹框显示关闭
      "panoramaPopup",
      // 监控地址
      "monitorUrl",
      // 监控弹框显示关闭
      "monitorPopup",

      "popupImgAtlas",
      // 教学
      "teachList",
      // 科研
      "liveList",
      // 校区内导航的显示关闭
      "campusNavFlag",
      "addTagPopup",
      "addTagPosition",
      // 自定义标签弹窗
      "labelLayerDataShow",
      "nowlabelLayerData",
      "addIconsLayerIconPopup", // 自定义标签编辑窗口
      "addIconsLayerIconPosition", // 自定义标签坐标
    ]),
  },
  created() {
    this.apiUrls = window.$apiUrls;

    this.audioSynth = window.speechSynthesis;
    this.audioMsg = new window.SpeechSynthesisUtterance();

    this.audioMsg.onend = function () {
      this.audioSynth.cancel();
      this.audioFlag = false;
      this.audioCourse = false;
    };
  },
  mounted() {
    global.viewer.scene.globe.depthTestAgainstTerrain = false;
  },
  watch: {
    addIconsLayerIconPopup() {
      if (this.addIconsLayerIconPopup) {
        this.addIconFromcolumn[9].value = this.addIconsLayerIconPosition[0];
        this.addIconFromcolumn[10].value = this.addIconsLayerIconPosition[1];
      } else {
        for (const k in this.addIconFromcolumn) {
          if (k == 2) {
            this.addIconFromcolumn[k].value = "红旗校区";
            this.addIconFromcolumn[k].valueid = "1";
            continue;
          }
          if (k == 3) {
            this.addIconFromcolumn[k].value = "行政办公";
            this.addIconFromcolumn[k].valueid = "1";
            continue;
          }
          this.addIconFromcolumn[k].value = "";
        }
        this.ourImages = [];
        this.$store.commit("set_closeMapClick", false); // 开启其他操作
      }
    },
    computed: {
        ...mapGetters([
            'popupBgUrl',
            'pupupQRUrl',
            // 终点
            'terminus',
            // 起点
            'startingPoint',
            // 点信息
            'pointPosition',
            // 点名称
            'stateName',
            // 地址
            'siteName',
            // 电话
            'telephone',
            // 介绍
            'introduceText',
            // 详情弹框显示关闭
            'detailsPopup',
            // 全景地址
            'panoramaUrl',
            // 全景弹框显示关闭
            'panoramaPopup',
            // 监控地址
            'monitorUrl',
            // 监控弹框显示关闭
            'monitorPopup',

            'popupImgAtlas',
            // 教学
            'teachList',
            // 科研
            'liveList',
            // 校区内导航的显示关闭
            'campusNavFlag',
            'addTagPopup',
            'addTagPosition',
            // 自定义标签弹窗
            'labelLayerDataShow',
            'nowlabelLayerData',
            'addIconsLayerIconPopup', // 自定义标签编辑窗口
            'addIconsLayerIconPosition' // 自定义标签坐标
        ])
    addTagPopup() {
      if (!this.addTagPopup) {
        // console.log("取消", "see");
        this.$store.commit("set_closeMapClick", false);
      }
    },
    created () {
        this.apiUrls = window.$apiUrls

        this.audioSynth = window.speechSynthesis
        this.audioMsg = new window.SpeechSynthesisUtterance()

        this.audioMsg.onend = function () {
            this.audioSynth.cancel()
            this.audioFlag = false
            this.audioCourse = false
    introduceText: {
      immediate: true,
      handler(newQuestion, oldQuestion) {
        this.audioSource = newQuestion;
        if (this.audioFlag == true) {
          this.audioSynth.cancel();
          this.audioFlag = false;
          this.audioCourse = false;
        }
      },
    },
    mounted () {
        global.viewer.scene.globe.depthTestAgainstTerrain = false
    },
    watch: {
        addIconsLayerIconPopup () {
            if (this.addIconsLayerIconPopup) {
                this.addIconFromcolumn[9].value = this.addIconsLayerIconPosition[0]
                this.addIconFromcolumn[10].value = this.addIconsLayerIconPosition[1]
            } else {
                for (const k in this.addIconFromcolumn) {
                    if (k == 2) {
                        this.addIconFromcolumn[k].value = '红旗校区'
                        this.addIconFromcolumn[k].valueid = '1'
                        continue
                    }
                    if (k == 3) {
                        this.addIconFromcolumn[k].value = '行政办公'
                        this.addIconFromcolumn[k].valueid = '1'
                        continue
                    }
                    this.addIconFromcolumn[k].value = ''
                }
                this.ourImages = []
                this.$store.commit('set_closeMapClick', false) // 开启其他操作
            }
        },
        addTagPopup () {
            if (!this.addTagPopup) {
                // console.log("取消", "see");
                this.$store.commit('set_closeMapClick', false)
            }
        },
        introduceText: {
            immediate: true,
            handler (newQuestion, oldQuestion) {
                this.audioSource = newQuestion
                if (this.audioFlag == true) {
                    this.audioSynth.cancel()
                    this.audioFlag = false
                    this.audioCourse = false
                }
            }
        },
        teachList: {
            immediate: true,
            handler (newCode, oldCode) {
                if (newCode.length > 0) {
                    this.tabBtnFlag = '教学科研行政'
                }
            }
        },
        liveList: {
            immediate: true,
            handler (newCode, oldCode) {
                if (newCode.length > 0 && this.teachList.length == 0) {
                    this.tabBtnFlag = '生活服务'
                }
            }
        },
        detailsPopup: {
            immediate: true,
            handler (newCode, oldCode) {
                if (newCode == false) {
                    this.audioSynth.cancel()
                    this.audioFlag = false
                    this.audioCourse = false
                } else {
                    if (this.audioFlag == true) {
                        this.audioSynth.cancel()
                        this.audioFlag = false
                        this.audioCourse = false
                    }
                }
            }
    teachList: {
      immediate: true,
      handler(newCode, oldCode) {
        if (newCode.length > 0) {
          this.tabBtnFlag = "教学科研行政";
        }
      },
    },
    methods: {
        onsuccess (response, file, fileList) {
            this.ourImages = fileList
        },
        handleRemove (file, fileList) {
            this.ourImages = fileList
        },
        handlePictureCardPreview (file) {
            this.dialogImageUrl = file.url
            this.dialogVisible = true
        },
        chouseAddicon (item) {
            this.addIconFromcolumn[item.index].value =
                this.addIconFromcolumn[item.index].chouse[item.indexc].value
            this.addIconFromcolumn[item.index].valueid =
                this.addIconFromcolumn[item.index].chouse[item.indexc].id
        },
        closeaddIconsLayerIconPopup () {
            this.$store.commit('SET_addIconsLayerIconPopup', false)
        },
        saveIconsLayer () {
            var imgs = []
            // console.log("see", this.ourImages);
            // return;
            for (var k in this.ourImages) {
                imgs.push(this.ourImages[k].response)
            }
            const d = {
                tpurl: imgs.join(','),
                mechanismname: this.addIconFromcolumn[0].value,
                telephone: this.addIconFromcolumn[1].value,
                type: this.addIconFromcolumn[2].valueid,
                campus: this.addIconFromcolumn[3].valueid,
                introduce: this.addIconFromcolumn[4].value,
                address: this.addIconFromcolumn[5].value,
                panoramaurl: this.addIconFromcolumn[6].value,
                videourl: this.addIconFromcolumn[7].value,
                websiteurl: this.addIconFromcolumn[8].value,
                jd: this.addIconFromcolumn[9].value,
                wd: this.addIconFromcolumn[10].value,
                heading: this.addIconFromcolumn[11].value,
                pitch: this.addIconFromcolumn[12].value,
                roll: this.addIconFromcolumn[13].value,
                gd: this.addIconFromcolumn[14].value
            }
            // console.log(d, "see3");
            // return;
            // this.$store.commit("set_closeMapClick", false); //开启其他操作
            add(d).then(
                () => {
                    this.$message({
                        type: 'success',
                        message: '操作成功!'
                    })
                    this.closeaddIconsLayerIconPopup()
                },
                (error) => {
                    window.console.log(error)
                }
            )
        },
        screen () {
            if (this.fullscreen) {
                this.fullScreenUrl = '/img/icon/bigScreen.png'
                this.fullscreen = !this.fullscreen

                document.getElementById('pcElHeader').style.zIndex = 9999
            } else {
                this.fullScreenUrl = '/img/icon/smallScreen.png'
                this.fullscreen = !this.fullscreen

                document.getElementById('pcElHeader').style.zIndex = 9
            }
        },

        tabBtnClick (param) {
            this.tabBtnFlag = param
        },

        comeHereClick () {
            this.$store.commit('SET_COMENAME', this.stateName)
            this.$store.commit('SET_TERMINUS', this.pointPosition)
            if (this.campusNavFlag == false) {
                this.$store.commit('SET_CAMPUSNAVFLAG', true)
            }
        },

        getToHereClick () {
            this.$store.commit('SET_GETTONAME', this.stateName)
            this.$store.commit('SET_STARTINGPOINT', this.pointPosition)
            if (this.campusNavFlag == false) {
                this.$store.commit('SET_CAMPUSNAVFLAG', true)
            }
        },

        qrCodeClick () {
            this.QRCodeFlag = true
        },

        imgsClick () {
            this.$refs.popupImgs.clickHandler()
        },

        panoramaClick () {
            if (this.audioFlag == true) {
                this.audioSynth.cancel()
                this.audioFlag = false
                this.audioCourse = false
            }

            // eslint-disable-next-line new-cap
            var positions = global.DC.Transform.transformWGS84ToCartesian(
                // eslint-disable-next-line new-cap
                new global.DC.Position.fromArray(this.pointPosition)
            )

            // eslint-disable-next-line no-unused-vars
            var panorama = new global.DC.PanoramaBox(global.viewer, {
                domId: 'PanoramaBox',
                position: [positions]
            })

            this.$store.commit('SET_DETAILSPOPUP', false)
            this.$store.commit('SET_MONITORPOPUP', false)
            this.$store.commit('SET_PANORAMAPOPUP', true)
        },

        monitorClick () {
            if (this.audioFlag == true) {
                this.audioSynth.cancel()
                this.audioFlag = false
                this.audioCourse = false
            }
            // eslint-disable-next-line new-cap
            var positions = global.DC.Transform.transformWGS84ToCartesian(
                // eslint-disable-next-line new-cap
                new global.DC.Position.fromArray(this.pointPosition)
            )
            // eslint-disable-next-line no-unused-vars
            var monitor = new global.DC.PanoramaBox(global.viewer, {
                domId: 'MonitorBox',
                position: [positions]
            })
            this.$store.commit('SET_PANORAMAPOPUP', false)
            this.$store.commit('SET_DETAILSPOPUP', false)
            this.$store.commit('SET_MONITORPOPUP', true)
        },

        returnDetailsPopup () {
            var positions = global.DC.Transform.transformWGS84ToCartesian(
                // eslint-disable-next-line new-cap
                new global.DC.Position.fromArray(this.pointPosition)
            )

            // eslint-disable-next-line no-unused-vars
            var divBox = new global.DC.PanoramaBox(global.viewer, {
                domId: 'divFormsDomBox',
                position: [positions]
            })

            global.viewer.zoomToPosition(
                // eslint-disable-next-line new-cap
                new global.DC.Position.fromArray(this.pointPosition)
            )

            this.$store.commit('SET_DETAILSPOPUP', true)
            this.$store.commit('SET_MONITORPOPUP', false)
            this.$store.commit('SET_PANORAMAPOPUP', false)
        },

        closeMapPopupBox () {
            if (this.audioFlag == true) {
                this.audioSynth.cancel()
                this.audioFlag = false
                this.audioCourse = false
            }
            this.$store.commit('SET_DETAILSPOPUP', false)
        },

        // 新增标记相关事件
        closeAddTagBox () {
            this.$store.commit('SET_ADDTAGPOPUP', false)
        },
        closelabelLayerid () {
            this.$store.commit('openLabelLayer', {
                show: false
            })
        },
        createTag () {
            var that = this

            //   console.log(this.RemoveTheBlank(this.addTagName));

            if (this.RemoveTheBlank(this.addTagName) == '') {
                this.$message('请输入标签名称')
                return
            }

            this.$store.commit('SET_ADDTAGPOPUP', false)

            // 2022.3.2对接接口
            // 新增标签
            const data = {
                name: this.RemoveTheBlank(this.addTagName),
                jd: this.addTagPosition.lng,
                wd: this.addTagPosition.lat
            }
            //   console.log(data);
            setlabel(data).then((res) => {
                if (res.data.code == 200) {
                    doit()
                    that.$message({
                        message: '新增标签成功',
                        type: 'success'
                    })
                } else {
                    that.$message({
                        message: '新增标签失败',
                        type: 'warning'
                    })
                }
                that.addTagName = ''
            })
            const doit = () => {
                that.$store.dispatch('addLabelLayerIcon', {
                    // list: [data],
                    add: true
                })
            }
        },

        closePanoramaPopupBox () {
            this.$store.commit('SET_PANORAMAURL', '')
            this.$store.commit('SET_PANORAMAPOPUP', false)
        },

        closeMonitorPopupBox () {
            this.$store.commit('SET_MONITORURL', '')
            this.$store.commit('SET_MONITORPOPUP', false)
        },

        audioPlay () {
            if (this.audioFlag == false) {
                this.audioMsg.text = this.audioSource
                this.audioSynth.speak(this.audioMsg)
                this.audioFlag = true
                this.audioCourse = true
            } else {
                if (this.audioCourse == true) {
                    this.audioSynth.pause()
                    this.audioCourse = false
                } else {
                    this.audioSynth.resume()
                    this.audioCourse = true
                }
            }
        },

        mechanismDetailPopup (num, param) {
            getMechanismDetail({ num: num, mechanismName: param }).then((res) => {
                var result = res.data.data
                this.$store.commit('CLEAR_ALL', null)

                var imgArr = result.tpurl.split(',')

                this.$store.commit('SET_POPUPBGURL', imgArr[0])
                this.$store.commit('SET_POPUPQRURL', result.codeurl)
                this.$store.commit('SET_POINTPOSITION', [
                    Number(result.jd),
                    Number(result.wd),
                    Number(result.gd),
                    Number(result.heading),
                    Number(result.pitch),
                    Number(result.roll)
                ])
                this.$store.commit('SET_STATENAME', result.mechanismname)
                this.$store.commit('SET_SITENAME', result.address)
                this.$store.commit('SET_TELEPHONE', result.telephone)
                this.$store.commit('SET_INTRODUCETEXT', result.introduce)
                this.$store.commit('SET_POPUPIMGATLAS', imgArr)

                if (result.videourl && result.videourl != '') {
                    this.$store.commit('SET_MONITORURL', result.videourl)
                }

                this.newPopup(result)
                global.viewer.flyToPosition(
                    new global.DC.Position(
                        Number(result.jd),
                        Number(result.wd),
                        300,
                        Number(result.heading),
                        Number(result.pitch),
                        Number(result.roll)
                    ),
                    function () { },
                    3
                )
            })
        },

        newPopup (item) {
            const position = global.DC.Transform.transformWGS84ToCartesian(
                new global.DC.Position(Number(item.jd), Number(item.wd), Number(item.gd))
            )
            // eslint-disable-next-line no-unused-vars
            var popup = new global.DC.DivForms(global.viewer, {
                domId: 'divFormsDomBox',
                position: [position]
            })

            this.$store.commit('SET_PANORAMAPOPUP', false)
            this.$store.commit('SET_MONITORPOPUP', false)
            this.$store.commit('SET_DETAILSPOPUP', true)
        },

        /**
         * 删除左右两端的空格
         */
        RemoveTheBlank (str) {
            return str.replace(/(^\s*)|(\s*$)/g, '')
    liveList: {
      immediate: true,
      handler(newCode, oldCode) {
        if (newCode.length > 0 && this.teachList.length == 0) {
          this.tabBtnFlag = "生活服务";
        }
    }
}
      },
    },
    detailsPopup: {
      immediate: true,
      handler(newCode, oldCode) {
        if (newCode == false) {
          this.audioSynth.cancel();
          this.audioFlag = false;
          this.audioCourse = false;
        } else {
          if (this.audioFlag == true) {
            this.audioSynth.cancel();
            this.audioFlag = false;
            this.audioCourse = false;
          }
        }
      },
    },
  },
  methods: {
    onsuccess(response, file, fileList) {
      this.ourImages = fileList;
    },
    handleRemove(file, fileList) {
      this.ourImages = fileList;
    },
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },
    chouseAddicon(item) {
      this.addIconFromcolumn[item.index].value =
        this.addIconFromcolumn[item.index].chouse[item.indexc].value;
      this.addIconFromcolumn[item.index].valueid =
        this.addIconFromcolumn[item.index].chouse[item.indexc].id;
    },
    closeaddIconsLayerIconPopup() {
      this.$store.commit("SET_addIconsLayerIconPopup", false);
    },
    saveIconsLayer() {
      var imgs = [];
      // console.log("see", this.ourImages);
      // return;
      for (var k in this.ourImages) {
        imgs.push(this.ourImages[k].response);
      }
      const d = {
        tpurl: imgs.join(","),
        mechanismname: this.addIconFromcolumn[0].value,
        telephone: this.addIconFromcolumn[1].value,
        type: this.addIconFromcolumn[2].valueid,
        campus: this.addIconFromcolumn[3].valueid,
        introduce: this.addIconFromcolumn[4].value,
        address: this.addIconFromcolumn[5].value,
        panoramaurl: this.addIconFromcolumn[6].value,
        videourl: this.addIconFromcolumn[7].value,
        websiteurl: this.addIconFromcolumn[8].value,
        jd: this.addIconFromcolumn[9].value,
        wd: this.addIconFromcolumn[10].value,
        heading: this.addIconFromcolumn[11].value,
        pitch: this.addIconFromcolumn[12].value,
        roll: this.addIconFromcolumn[13].value,
        gd: this.addIconFromcolumn[14].value,
      };
      // console.log(d, "see3");
      // return;
      // this.$store.commit("set_closeMapClick", false); //开启其他操作
      add(d).then(
        () => {
          this.$message({
            type: "success",
            message: "操作成功!",
          });
          this.closeaddIconsLayerIconPopup();
        },
        (error) => {
          window.console.log(error);
        }
      );
    },
    screen() {
      if (this.fullscreen) {
        this.fullScreenUrl = "/img/icon/bigScreen.png";
        this.fullscreen = !this.fullscreen;

        document.getElementById("pcElHeader").style.zIndex = 9999;
      } else {
        this.fullScreenUrl = "/img/icon/smallScreen.png";
        this.fullscreen = !this.fullscreen;

        document.getElementById("pcElHeader").style.zIndex = 9;
      }
    },

    tabBtnClick(param) {
      this.tabBtnFlag = param;
    },

    comeHereClick() {
      this.$store.commit("SET_COMENAME", this.stateName);
      this.$store.commit("SET_TERMINUS", this.pointPosition);
      if (this.campusNavFlag == false) {
        this.$store.commit("SET_CAMPUSNAVFLAG", true);
      }
    },

    getToHereClick() {
      this.$store.commit("SET_GETTONAME", this.stateName);
      this.$store.commit("SET_STARTINGPOINT", this.pointPosition);
      if (this.campusNavFlag == false) {
        this.$store.commit("SET_CAMPUSNAVFLAG", true);
      }
    },

    qrCodeClick() {
      this.QRCodeFlag = true;
    },

    imgsClick() {
      this.$refs.popupImgs.clickHandler();
    },

    panoramaClick() {
      if (this.audioFlag == true) {
        this.audioSynth.cancel();
        this.audioFlag = false;
        this.audioCourse = false;
      }

      // eslint-disable-next-line new-cap
      var positions = global.DC.Transform.transformWGS84ToCartesian(
        // eslint-disable-next-line new-cap
        new global.DC.Position.fromArray(this.pointPosition)
      );

      // eslint-disable-next-line no-unused-vars
      var panorama = new global.DC.PanoramaBox(global.viewer, {
        domId: "PanoramaBox",
        position: [positions],
      });

      this.$store.commit("SET_DETAILSPOPUP", false);
      this.$store.commit("SET_MONITORPOPUP", false);
      this.$store.commit("SET_PANORAMAPOPUP", true);
    },

    monitorClick() {
      if (this.audioFlag == true) {
        this.audioSynth.cancel();
        this.audioFlag = false;
        this.audioCourse = false;
      }
      // eslint-disable-next-line new-cap
      var positions = global.DC.Transform.transformWGS84ToCartesian(
        // eslint-disable-next-line new-cap
        new global.DC.Position.fromArray(this.pointPosition)
      );
      // eslint-disable-next-line no-unused-vars
      var monitor = new global.DC.PanoramaBox(global.viewer, {
        domId: "MonitorBox",
        position: [positions],
      });
      this.$store.commit("SET_PANORAMAPOPUP", false);
      this.$store.commit("SET_DETAILSPOPUP", false);
      this.$store.commit("SET_MONITORPOPUP", true);
    },

    returnDetailsPopup() {
      var positions = global.DC.Transform.transformWGS84ToCartesian(
        // eslint-disable-next-line new-cap
        new global.DC.Position.fromArray(this.pointPosition)
      );

      // eslint-disable-next-line no-unused-vars
      var divBox = new global.DC.PanoramaBox(global.viewer, {
        domId: "divFormsDomBox",
        position: [positions],
      });

      global.viewer.zoomToPosition(
        // eslint-disable-next-line new-cap
        new global.DC.Position.fromArray(this.pointPosition)
      );

      this.$store.commit("SET_DETAILSPOPUP", true);
      this.$store.commit("SET_MONITORPOPUP", false);
      this.$store.commit("SET_PANORAMAPOPUP", false);
    },

    closeMapPopupBox() {
      if (this.audioFlag == true) {
        this.audioSynth.cancel();
        this.audioFlag = false;
        this.audioCourse = false;
      }
      this.$store.commit("SET_DETAILSPOPUP", false);
    },

    // 新增标记相关事件
    closeAddTagBox() {
      this.$store.commit("SET_ADDTAGPOPUP", false);
    },
    closelabelLayerid() {
      this.$store.commit("openLabelLayer", {
        show: false,
      });
    },
    createTag() {
      var that = this;

      //   console.log(this.RemoveTheBlank(this.addTagName));

      if (this.RemoveTheBlank(this.addTagName) == "") {
        this.$message("请输入标签名称");
        return;
      }

      this.$store.commit("SET_ADDTAGPOPUP", false);

      // 2022.3.2对接接口
      // 新增标签
      const data = {
        name: this.RemoveTheBlank(this.addTagName),
        jd: this.addTagPosition.lng,
        wd: this.addTagPosition.lat,
      };
      //   console.log(data);
      let oks = setTimeout(() => {
        that.$message({
          message: "新增标签失败",
          type: "warning",
        });
      }, 5000);
      setlabel(data).then((res) => {
        clearTimeout(oks);
        if (res.data.code == 200) {
          doit();
          that.$message({
            message: "新增标签成功",
            type: "success",
          });
        } else {
          that.$message({
            message: "新增标签失败",
            type: "warning",
          });
        }
        that.addTagName = "";
      });
      const doit = () => {
        that.$store.dispatch("addLabelLayerIcon", {
          // list: [data],
          add: true,
        });
      };
    },

    closePanoramaPopupBox() {
      this.$store.commit("SET_PANORAMAURL", "");
      this.$store.commit("SET_PANORAMAPOPUP", false);
    },

    closeMonitorPopupBox() {
      this.$store.commit("SET_MONITORURL", "");
      this.$store.commit("SET_MONITORPOPUP", false);
    },

    audioPlay() {
      if (this.audioFlag == false) {
        this.audioMsg.text = this.audioSource;
        this.audioSynth.speak(this.audioMsg);
        this.audioFlag = true;
        this.audioCourse = true;
      } else {
        if (this.audioCourse == true) {
          this.audioSynth.pause();
          this.audioCourse = false;
        } else {
          this.audioSynth.resume();
          this.audioCourse = true;
        }
      }
    },

    mechanismDetailPopup(num, param) {
      getMechanismDetail({ num: num, mechanismName: param }).then((res) => {
        var result = res.data.data;
        this.$store.commit("CLEAR_ALL", null);

        var imgArr = result.tpurl.split(",");

        this.$store.commit("SET_POPUPBGURL", imgArr[0]);
        this.$store.commit("SET_POPUPQRURL", result.codeurl);
        this.$store.commit("SET_POINTPOSITION", [
          Number(result.jd),
          Number(result.wd),
          Number(result.gd),
          Number(result.heading),
          Number(result.pitch),
          Number(result.roll),
        ]);
        this.$store.commit("SET_STATENAME", result.mechanismname);
        this.$store.commit("SET_SITENAME", result.address);
        this.$store.commit("SET_TELEPHONE", result.telephone);
        this.$store.commit("SET_INTRODUCETEXT", result.introduce);
        this.$store.commit("SET_POPUPIMGATLAS", imgArr);

        if (result.videourl && result.videourl != "") {
          this.$store.commit("SET_MONITORURL", result.videourl);
        }

        this.newPopup(result);
        global.viewer.flyToPosition(
          new global.DC.Position(
            Number(result.jd),
            Number(result.wd),
            300,
            Number(result.heading),
            Number(result.pitch),
            Number(result.roll)
          ),
          function () {},
          3
        );
      });
    },

    newPopup(item) {
      const position = global.DC.Transform.transformWGS84ToCartesian(
        new global.DC.Position(
          Number(item.jd),
          Number(item.wd),
          Number(item.gd)
        )
      );
      // eslint-disable-next-line no-unused-vars
      var popup = new global.DC.DivForms(global.viewer, {
        domId: "divFormsDomBox",
        position: [position],
      });

      this.$store.commit("SET_PANORAMAPOPUP", false);
      this.$store.commit("SET_MONITORPOPUP", false);
      this.$store.commit("SET_DETAILSPOPUP", true);
    },

    /**
     * 删除左右两端的空格
     */
    RemoveTheBlank(str) {
      return str.replace(/(^\s*)|(\s*$)/g, "");
    },
  },
};
</script>

<style lang="scss">
.labelLayeridewm {
    width: 250px !important;
    height: 250px !important;
  width: 250px !important;
  height: 250px !important;
}

.add-sign-box-style {
    input:-moz-placeholder,
    textarea:-moz-placeholder {
        color: #fff;
    }
    input:-ms-input-placeholder,
    textarea:-ms-input-placeholder {
        color: #fff;
    }
    input::-webkit-input-placeholder,
    textarea::-webkit-input-placeholder {
        color: #fff;
    }
  input:-moz-placeholder,
  textarea:-moz-placeholder {
    color: #fff;
  }
  input:-ms-input-placeholder,
  textarea:-ms-input-placeholder {
    color: #fff;
  }
  input::-webkit-input-placeholder,
  textarea::-webkit-input-placeholder {
    color: #fff;
  }

    .addIconsLayerinimgs {
        margin-top: 4px;
    }
  .addIconsLayerinimgs {
    margin-top: 4px;
  }

    .addIconsLayerin {
        padding: 0 10px;
    }
  .addIconsLayerin {
    padding: 0 10px;
  }
}
</style>

 src/components/mobileActivity/index.vue

@@ -1,511 +1,507 @@
<template>
    <div
        id="mobileActivity"
        :style="{ height: height + 'px' }"
        :class="[openValue ? 'isOpens' : 'notOpens']"
        v-if="showActivity"
    >
        <div class="mobileActivity_heard">
            <div class="mobileActivity_title">活动标题：{{ hdTitle }}</div>
            <div class="mobileActivity_close" @click="closeActivity">
                <i class="el-icon-close"></i>
            </div>
        </div>
        <div class="mobileActivity_in">
            <!-- <el-button type="primary" @click="init">open</el-button>
            <el-button type="success" @click="closeInit">close</el-button>-->
            <div class="mobileActivity_insmall">
                <!-- <img :src="imgs" alt="" class="mobileActivity_insmallimg" /> -->
                <el-image
                    class="mobileActivity_insmallimg"
                    :src="useData.url"
                    :preview-src-list="useData.srcList"
                ></el-image>
                <div class="mobileActivity_insmallxiangqing">
                    <div
                        class="mobileActivity_insmallxiangqingIn"
                        v-for="(item, index) in useData.smallData"
                        :key="index"
                    >
                        <span class="mobileActivity_insmallxiangqingIn_s">
                            {{
                            item.lable
                            }}
                        </span>
                        : {{ item.value }}
                    </div>
                </div>
            </div>
            <div class="mobileActivity_detailed">
                <div
                    class="mobileActivity_detailedIn"
                    v-for="(item, index) in useData.detailedData"
                    :key="index"
                >
                    <span class="mobileActivity_insmallxiangqingIn_s">
                        {{
                        item.lable
                        }}
                    </span>
                    : {{ item.value }}
                </div>
            </div>
        </div>
        <div class="mobileActivity_coutrol" :style="{ bottom: bottom + 'px' }">
            <ul>
                <li
                    v-for="(item, index) in leftNavData"
                    :key="index"
                    @click="mobileActivityCoutrolClick(item)"
                    v-show="!item.notShow"
                >
                    <img :src="item.img" alt />
                    <span>{{ item.label }}</span>
                </li>
            </ul>
        </div>
  <div
    id="mobileActivity"
    :style="{ height: height + 'px' }"
    :class="[openValue ? 'isOpens' : 'notOpens']"
    v-if="showActivity"
  >
    <div class="mobileActivity_heard">
      <div class="mobileActivity_title">活动标题：{{ hdTitle }}</div>
      <div class="mobileActivity_close" @click="closeActivity">
        <i class="el-icon-close"></i>
      </div>
    </div>
    <div class="mobileActivity_in">
      <!-- <el-button type="primary" @click="init">open</el-button>
            <el-button type="success" @click="closeInit">close</el-button>-->
      <div class="mobileActivity_insmall">
        <!-- <img :src="imgs" alt="" class="mobileActivity_insmallimg" /> -->
        <el-image
          class="mobileActivity_insmallimg"
          :src="useData.url"
          :preview-src-list="useData.srcList"
        ></el-image>
        <div class="mobileActivity_insmallxiangqing">
          <div
            class="mobileActivity_insmallxiangqingIn"
            v-for="(item, index) in useData.smallData"
            :key="index"
          >
            <span class="mobileActivity_insmallxiangqingIn_s">
              {{ item.lable }}
            </span>
            : {{ item.value }}
          </div>
        </div>
      </div>
      <div class="mobileActivity_detailed">
        <div
          class="mobileActivity_detailedIn"
          v-for="(item, index) in useData.detailedData"
          :key="index"
        >
          <span class="mobileActivity_insmallxiangqingIn_s">
            {{ item.lable }}
          </span>
          : {{ item.value }}
        </div>
      </div>
    </div>
    <div class="mobileActivity_coutrol" :style="{ bottom: bottom + 'px' }">
      <ul>
        <li
          v-for="(item, index) in leftNavData"
          :key="index"
          @click="mobileActivityCoutrolClick(item)"
          v-show="!item.notShow"
        >
          <img :src="item.img" alt />
          <span>{{ item.label }}</span>
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import moveWindow from './move'
import { mapGetters } from "vuex";
import moveWindow from "./move";
export default {
    name: 'mobileActivity',
    computed: {
        ...mapGetters([
            'showActivity',
            'showActivityData',
            'drawALineLayerMany',
            'drawAPointLayerMany'
        ])
    },
    data () {
        const heig = 135
        const bottom = 150
        return {
            useHeight: heig,
            height: heig,
            useBottom: bottom,
            bottom: bottom,
            openValue: false,
            domMove: null,
            start: 0,
            end: 0,
            hdTitle: '',
            // url: "",
            // srcList: [],
            useData: {},
            leftNavData: [
                {
                    flag: true,
                    label: '线路',
                    // img: "/img/leftnav/tag.png",
                    img: '/img/leftnav/tag-checked.png',
                    normal: '/img/leftnav/tag.png',
                    checked: '/img/leftnav/tag-checked.png',
                    layer: 'tagLayer',
                    imgSrc: 'https://map.hit.edu.cn/images/tarrow_xq.png',
                    // imgSrc: "img/mobile/pink.png",
                    layer: 'drawALineLayerMany'
                },
                {
                    flag: true,
                    label: '标点',
                    img: '/img/leftnav/way-checked.png',
                    normal: '/img/leftnav/way.png',
                    checked: '/img/leftnav/way-checked.png',
                    layer: 'wayLayer',
                    imgSrc: 'img/mobile/green.png',
                    layer: 'drawAPointLayerMany'
                }
                // {
                //   flag: false,
                //   label: "实景",
                //   img: "/img/leftnav/scene.png",
                //   normal: "/img/leftnav/scene.png",
                //   checked: "/img/leftnav/scene-checked.png",
                //   layer: "sceneLayer",
                //   imgSrc: "img/leftnav/map-panorama.png",
                //   // imgSrc: "img/mobile/blue.png",
                // },
            ]
        }
    },
    watch: {
        //   openValue() {
        //     if (this.openValue) {
        //       let windowHeight = document.body.clientHeight;
        //       this.height = windowHeight / 2;
        //     } else {
        //       this.height = this.useHeight;
        //     }
        //   },
        showActivity () {
            if (this.showActivity) {
                this.inToInit() // 初始化
                this.hdTitle = this.showActivityData.name
  name: "mobileActivity",
  computed: {
    ...mapGetters([
      "showActivity",
      "showActivityData",
      // 'drawALineLayerMany',
      // 'drawAPointLayerMany'
    ]),
  },
  data() {
    const heig = 135;
    const bottom = 150;
    return {
      useHeight: heig,
      height: heig,
      useBottom: bottom,
      bottom: bottom,
      openValue: false,
      domMove: null,
      start: 0,
      end: 0,
      hdTitle: "",
      // url: "",
      // srcList: [],
      useData: {},
      leftNavData: [
        {
          flag: true,
          label: "线路",
          // img: "/img/leftnav/tag.png",
          img: "/img/leftnav/tag-checked.png",
          normal: "/img/leftnav/tag.png",
          checked: "/img/leftnav/tag-checked.png",
          layer: "tagLayer",
          imgSrc: "https://map.hit.edu.cn/images/tarrow_xq.png",
          // imgSrc: "img/mobile/pink.png",
          layer: "drawALineLayerMany",
        },
        {
          flag: true,
          label: "标点",
          img: "/img/leftnav/way-checked.png",
          normal: "/img/leftnav/way.png",
          checked: "/img/leftnav/way-checked.png",
          layer: "wayLayer",
          imgSrc: "img/mobile/green.png",
          layer: "drawAPointLayerMany",
        },
        // {
        //   flag: false,
        //   label: "实景",
        //   img: "/img/leftnav/scene.png",
        //   normal: "/img/leftnav/scene.png",
        //   checked: "/img/leftnav/scene-checked.png",
        //   layer: "sceneLayer",
        //   imgSrc: "img/leftnav/map-panorama.png",
        //   // imgSrc: "img/mobile/blue.png",
        // },
      ],
    };
  },
  watch: {
    //   openValue() {
    //     if (this.openValue) {
    //       let windowHeight = document.body.clientHeight;
    //       this.height = windowHeight / 2;
    //     } else {
    //       this.height = this.useHeight;
    //     }
    //   },
    showActivity() {
      if (this.showActivity) {
        this.inToInit(); // 初始化
        this.hdTitle = this.showActivityData.name;

                // new窗口对象
                const that = this
                const windowHeight = document.body.clientHeight
                this.doData(this.showActivityData) // 使用数据
                // 获取最大高度避免数据过少，空格多
                // let heard = document.querySelector(".mobileActivity_heard");
                // let ins = document.querySelector(".mobileActivity_in");
                // console.log(heard, ins, 77777);
                this.checkDom('querySelector', '.mobileActivity_heard', (head) => {
                    this.checkDom('querySelector', '.mobileActivity_in', (ins) => {
                        console.log((head.offsetHeight + ins.offsetHeight) / 4)
                        doit(head.offsetHeight + ins.offsetHeight)
                    })
                })
                // return;
                const doit = (maxheights) => {
                    this.domMove = new moveWindow({
                        id: 'mobileActivity',
                        minHeight: that.useHeight,
                        maxHeight: maxheights || windowHeight / 2,
                        critical: maxheights / 4,
                        fn: function (res) {
                            that.height = +res.height
                            that.bottom = +res.height + 15
                            // console.log(+res.height, "=======");
                            if (res.state != 'on') {
                                that.openValue = res.state
                            }
                        }
                    })
                    this.domMove.init()
                    // console.log(this.domMove);
                    // 转移···添加点和线
                    const addressOur = this.changeData(
                        this.useData.query,
                        'addressname',
                        'address'
                    )
                    const lxOur = this.changeData(this.useData.query, 'lxname', 'lx')
                    // console.log(addressOur, lxOur);
                    that.$store.dispatch('MSET_DRAWALINELAYERMANY', [
                        lxOur,
                        addressOur,
                        this.useData.query,
                        function () {
                            that.domMove.opens(false, true)
                        }
                    ])
                }
            }
        }
        // new窗口对象
        const that = this;
        const windowHeight = document.body.clientHeight;
        this.doData(this.showActivityData); // 使用数据
        // 获取最大高度避免数据过少，空格多
        // let heard = document.querySelector(".mobileActivity_heard");
        // let ins = document.querySelector(".mobileActivity_in");
        // console.log(heard, ins, 77777);
        this.checkDom("querySelector", ".mobileActivity_heard", (head) => {
          this.checkDom("querySelector", ".mobileActivity_in", (ins) => {
            console.log((head.offsetHeight + ins.offsetHeight) / 4);
            doit(head.offsetHeight + ins.offsetHeight);
          });
        });
        // return;
        const doit = (maxheights) => {
          this.domMove = new moveWindow({
            id: "mobileActivity",
            minHeight: that.useHeight,
            maxHeight: maxheights || windowHeight / 2,
            critical: maxheights / 4,
            fn: function (res) {
              that.height = +res.height;
              that.bottom = +res.height + 15;
              // console.log(+res.height, "=======");
              if (res.state != "on") {
                that.openValue = res.state;
              }
            },
          });
          this.domMove.init();
          // console.log(this.domMove);
          // 转移···添加点和线
          const addressOur = this.changeData(
            this.useData.query,
            "addressname",
            "address"
          );
          const lxOur = this.changeData(this.useData.query, "lxname", "lx");
          // console.log(addressOur, lxOur);
          that.$store.dispatch("MSET_DRAWALINELAYERMANY", [
            lxOur,
            addressOur,
            this.useData.query,
            function () {
              that.domMove.opens(false, true);
            },
          ]);
        };
      }
    },
    mounted () { },
    methods: {
        inToInit () {
            // 初始化
            this.openValue = false
            this.height = this.useHeight
            this.bottom = this.useBottom
            for (const k in this.leftNavData) {
                this.leftNavData[k].flag = true
                this.leftNavData[k].img = this.leftNavData[k].checked
            }
  },
  mounted() {},
  methods: {
    inToInit() {
      // 初始化
      this.openValue = false;
      this.height = this.useHeight;
      this.bottom = this.useBottom;
      for (const k in this.leftNavData) {
        this.leftNavData[k].flag = true;
        this.leftNavData[k].img = this.leftNavData[k].checked;
      }
    },
    // 处理主数据
    doData(val) {
      const srcList = val.opendata.tpurl.split(",");
      this.useData = {
        data: val,
        url: srcList[0],
        srcList: srcList,
        smallData: [
          {
            lable: "主办方",
            value: val.opendata.sponsor,
          },
          {
            lable: "承办方",
            value: val.opendata.undertake,
          },
        ],
        detailedData: [
          {
            lable: "活动时间",
            value: val.opendata.time,
          },
          {
            lable: "活动详情",
            value: val.opendata.context,
          },
        ],
        query: {
          name: val.opendata.hdname,
          bgImg: val.opendata.tpurl,
          from: "活动",
          websiteUrl: val.opendata.websiteurl,
          telePhone: val.opendata.telephone,
          introduce: val.opendata.context,
          video: val.opendata.videourl,
          // buts: ["定位"],
          // 活动添加的字段
          addressname: val.opendata.addressname.split(";"),
          address: val.opendata.address.split(";"),
          lxname: val.opendata.lxname.split(";"),
          lx: val.opendata.lx.split(";"),
          lntLat: [
            val.opendata.address.split(";")[0].split(",")[0],
            val.opendata.address.split(";")[0].split(",")[1],
          ],
          panoramaurl: val.opendata.panoramaurl, // 全景
        },
        // 处理主数据
        doData (val) {
            const srcList = val.opendata.tpurl.split(',')
            this.useData = {
                data: val,
                url: srcList[0],
                srcList: srcList,
                smallData: [
                    {
                        lable: '主办方',
                        value: val.opendata.sponsor
                    },
                    {
                        lable: '承办方',
                        value: val.opendata.undertake
                    }
                ],
                detailedData: [
                    {
                        lable: '活动时间',
                        value: val.opendata.time
                    },
                    {
                        lable: '活动详情',
                        value: val.opendata.context
                    }
                ],
                query: {
                    name: val.opendata.hdname,
                    bgImg: val.opendata.tpurl,
                    from: '活动',
                    websiteUrl: val.opendata.websiteurl,
                    telePhone: val.opendata.telephone,
                    introduce: val.opendata.context,
                    video: val.opendata.videourl,
                    // buts: ["定位"],
                    // 活动添加的字段
                    addressname: val.opendata.addressname.split(';'),
                    address: val.opendata.address.split(';'),
                    lxname: val.opendata.lxname.split(';'),
                    lx: val.opendata.lx.split(';'),
                    lntLat: [
                        val.opendata.address.split(';')[0].split(',')[0],
                        val.opendata.address.split(';')[0].split(',')[1]
                    ],
                    panoramaurl: val.opendata.panoramaurl // 全景
                }
            }
        },
        // 启动监听事件
        init () {
            this.domMove.init()
        },
        // 关闭监听事件
        closeInit () {
            this.domMove.closeInit()
        },
        // 控制线路和点的显影
        mobileActivityCoutrolClick (item) {
            item.flag = !item.flag
            if (item.flag == true) {
                item.img = item.checked
            } else {
                item.img = item.normal
            }
            this.$store.commit('showLineOrPoint', {
                layer: item.layer,
                flag: item.flag
            })
        },
        changeData (data, name, value) {
            const arr = []
            for (const k in data[name]) {
                arr.push({
                    name: data[name][k],
                    value:
                        name == 'lxname'
                            ? data[value][k]
                                .split('(')[1]
                                .split(')')[0]
                                .split(',')
                                .join(';')
                                .split(' ')
                                .join(',')
                            : [+data[value][k].split(',')[0], +data[value][k].split(',')[1]]
                })
            }
            return arr
        },
        closeActivity () {
            this.$store.commit('set_showActivity', { state: false })
            if (this.domMove) {
                this.closeInit()
            }
            // 关闭路线和点的图层
            this.$store.commit('removePolylineMany')
            // 关闭随地图弹窗
            this.$store.dispatch('closeMobileWindowsDom')
            // 显示右侧栏
            this.$store.commit('SET_SeeAndNotSee', true)
        },
        checkDom (methods, name, fn) {
            //  声明定时器
            var timer = null
            //  检查dom是否执行完成
            function checkDom () {
                // let dom = that.$refs[name];
                const dom = document[methods](name)
                if (dom) {
                    //  执行dom加载完成后的操作
                    //  清除定时器
                    if (!timer) {
                        clearTimeout(timer)
                    }
                    if (fn) {
                        // 回调函数
                        fn(dom)
                    } else {
                        return dom
                    }
                } else {
                    //  自我调用
                    timer = setTimeout(checkDom, 100)
                }
            }
            //  首次执行
            checkDom()
      };
    },
    // 启动监听事件
    init() {
      this.domMove.init();
    },
    // 关闭监听事件
    closeInit() {
      this.domMove.closeInit();
    },
    // 控制线路和点的显影
    mobileActivityCoutrolClick(item) {
      item.flag = !item.flag;
      if (item.flag == true) {
        item.img = item.checked;
      } else {
        item.img = item.normal;
      }
      this.$store.commit("showLineOrPoint", {
        layer: item.layer,
        flag: item.flag,
      });
    },
    changeData(data, name, value) {
      const arr = [];
      for (const k in data[name]) {
        arr.push({
          name: data[name][k],
          value:
            name == "lxname"
              ? data[value][k]
                  .split("(")[1]
                  .split(")")[0]
                  .split(",")
                  .join(";")
                  .split(" ")
                  .join(",")
              : [+data[value][k].split(",")[0], +data[value][k].split(",")[1]],
        });
      }
      return arr;
    },
    closeActivity() {
      this.$store.commit("set_showActivity", { state: false });
      if (this.domMove) {
        this.closeInit();
      }
      // 关闭路线和点的图层
      this.$store.commit("removePolylineMany");
      // 关闭随地图弹窗
      this.$store.dispatch("closeMobileWindowsDom");
      // 显示右侧栏
      this.$store.commit("SET_SeeAndNotSee", true);
    },
    checkDom(methods, name, fn) {
      //  声明定时器
      var timer = null;
      //  检查dom是否执行完成
      function checkDom() {
        // let dom = that.$refs[name];
        const dom = document[methods](name);
        if (dom) {
          //  执行dom加载完成后的操作
          //  清除定时器
          if (!timer) {
            clearTimeout(timer);
          }
          if (fn) {
            // 回调函数
            fn(dom);
          } else {
            return dom;
          }
        } else {
          //  自我调用
          timer = setTimeout(checkDom, 100);
        }
    }
}
      }
      //  首次执行
      checkDom();
    },
  },
};
</script>

<style lang="scss">
#mobileActivity {
    position: fixed;
    bottom: 0px;
    left: 0px;
    width: 100%;
    // height: 50px;
    background-color: #fff;
    z-index: 999;
    transition: height 0.1s;
  position: fixed;
  bottom: 0px;
  left: 0px;
  width: 100%;
  // height: 50px;
  background-color: #fff;
  z-index: 999;
  transition: height 0.1s;
  border-radius: 15px 15px 0 0;
  .mobileActivity_heard {
    height: 35px;
    border-radius: 15px 15px 0 0;
    .mobileActivity_heard {
        height: 35px;
        border-radius: 15px 15px 0 0;
        width: 100%;
        background-color: #409eff;
        color: #fff;
        border-bottom: 1px solid rgba($color: #acacac, $alpha: 0.5);
        box-shadow: 0 0px 10px -3px rgba($color: #acacac, $alpha: 0.5);
        .mobileActivity_title {
            width: 100%;
            height: 100%;
            line-height: 35px;
            text-indent: 1rem;
        }
        .mobileActivity_close {
            position: absolute;
            right: 5px;
            top: 5px;
            font-size: 25px;
        }
    width: 100%;
    background-color: #409eff;
    color: #fff;
    border-bottom: 1px solid rgba($color: #acacac, $alpha: 0.5);
    box-shadow: 0 0px 10px -3px rgba($color: #acacac, $alpha: 0.5);
    .mobileActivity_title {
      width: 100%;
      height: 100%;
      line-height: 35px;
      text-indent: 1rem;
    }
    .mobileActivity_in {
        width: 100%;
        height: auto;
        overflow: hidden;
        padding-bottom: 5px;
        .mobileActivity_insmall {
            background-color: #fff;
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: space-around;
            .mobileActivity_insmallimg {
                width: 90px;
                height: 90px;
            }
            .mobileActivity_insmallxiangqing {
                width: calc(100% - 110px);
                height: 94px;
                display: flex;
                align-items: center;
                justify-content: space-around;
                flex-direction: column;
                .mobileActivity_insmallxiangqingIn {
                    width: 100%;
                }
            }
        }
        .mobileActivity_detailed {
            background-color: rgba(202, 202, 202, 0.2);
            padding: 3px 0 0 0;
            width: 100%;
            height: 100%;
            box-sizing: border-box;
            .mobileActivity_detailedIn {
                background-color: #fff;
                box-sizing: border-box;
                width: 100%;
                padding: 5px;
                margin: 0 0 3px 0;
            }
        }
        .mobileActivity_insmallxiangqingIn_s {
            font-weight: 600;
        }
    .mobileActivity_close {
      position: absolute;
      right: 5px;
      top: 5px;
      font-size: 25px;
    }
  }
  .mobileActivity_in {
    width: 100%;
    height: auto;
    overflow: hidden;
    padding-bottom: 5px;
    .mobileActivity_insmall {
      background-color: #fff;
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-around;
      .mobileActivity_insmallimg {
        width: 90px;
        height: 90px;
      }
      .mobileActivity_insmallxiangqing {
        width: calc(100% - 110px);
        height: 94px;
        display: flex;
        align-items: center;
        justify-content: space-around;
        flex-direction: column;
        .mobileActivity_insmallxiangqingIn {
          width: 100%;
        }
      }
    }
    .mobileActivity_detailed {
      background-color: rgba(202, 202, 202, 0.2);
      padding: 3px 0 0 0;
      width: 100%;
      height: 100%;
      box-sizing: border-box;
      .mobileActivity_detailedIn {
        background-color: #fff;
        box-sizing: border-box;
        width: 100%;
        padding: 5px;
        margin: 0 0 3px 0;
      }
    }
    .mobileActivity_insmallxiangqingIn_s {
      font-weight: 600;
    }
  }
}

.notOpens {
    &::after {
        content: '';
        display: block;
        width: 20px;
        height: 4px;
        background-color: rgba(202, 202, 202, 1);
        position: absolute;
        top: -9px;
        left: calc(50% - 10px);
        border-radius: 5px;
    }
  &::after {
    content: "";
    display: block;
    width: 20px;
    height: 4px;
    background-color: rgba(202, 202, 202, 1);
    position: absolute;
    top: -9px;
    left: calc(50% - 10px);
    border-radius: 5px;
  }
}

.isOpens {
    &::after {
        content: '';
        display: block;
        width: 13px;
        height: 4px;
        background-color: rgba(202, 202, 202, 1);
        position: absolute;
        top: -9px;
        left: calc(50% - 12px);
        border-radius: 5px;
        transform: rotate(30deg);
    }
    &::before {
        content: '';
        display: block;
        width: 13px;
        height: 4px;
        background-color: rgba(202, 202, 202, 1);
        position: absolute;
        top: -9px;
        left: calc(50% - 4px);
        border-radius: 5px;
        transform: rotate(-30deg);
    }
  &::after {
    content: "";
    display: block;
    width: 13px;
    height: 4px;
    background-color: rgba(202, 202, 202, 1);
    position: absolute;
    top: -9px;
    left: calc(50% - 12px);
    border-radius: 5px;
    transform: rotate(30deg);
  }
  &::before {
    content: "";
    display: block;
    width: 13px;
    height: 4px;
    background-color: rgba(202, 202, 202, 1);
    position: absolute;
    top: -9px;
    left: calc(50% - 4px);
    border-radius: 5px;
    transform: rotate(-30deg);
  }
}
.mobileActivity_coutrol {
    position: fixed;
    bottom: 150px;
    left: 0px;
    z-index: 200;
  position: fixed;
  bottom: 150px;
  left: 0px;
  z-index: 200;
  background-color: #fff;
  border-radius: 0 17px 17px 0;
  transition: all 0.18s;
  ul {
    position: relative;
    top: 3px;
  }
  li {
    margin-bottom: 6px;
    font-weight: 400;
    display: block;
    width: 80px;
    height: 30px;
    line-height: 30px;
    background-color: #fff;
    border-radius: 0 17px 17px 0;
    transition: all 0.18s;
    ul {
        position: relative;
        top: 3px;
    }
    li {
        margin-bottom: 6px;
        font-weight: 400;
        display: block;
        width: 80px;
        height: 30px;
        line-height: 30px;
        background-color: #fff;
        border-radius: 15px;
        text-align: center;
        font-size: 0;
        cursor: pointer;
    border-radius: 15px;
    text-align: center;
    font-size: 0;
    cursor: pointer;

        img {
            position: relative;
            transition: all 0.5s;
            width: 24px;
            height: 24px;
            vertical-align: middle;
            margin-right: 10px;
            image-rendering: -moz-crisp-edges;
            image-rendering: -o-crisp-edges;
            image-rendering: -webkit-optimize-contrast;
            image-rendering: crisp-edges;
            -ms-interpolation-mode: nearest-neighbor;
        }

        span {
            display: inline-block;
            vertical-align: middle;
            font-size: 14px;
            color: #2f2f2f;
        }
    img {
      position: relative;
      transition: all 0.5s;
      width: 24px;
      height: 24px;
      vertical-align: middle;
      margin-right: 10px;
      image-rendering: -moz-crisp-edges;
      image-rendering: -o-crisp-edges;
      image-rendering: -webkit-optimize-contrast;
      image-rendering: crisp-edges;
      -ms-interpolation-mode: nearest-neighbor;
    }

    span {
      display: inline-block;
      vertical-align: middle;
      font-size: 14px;
      color: #2f2f2f;
    }
  }
}
</style>

 src/components/mobileCortrol/index.vue

@@ -28,7 +28,7 @@
    return {};
  },
  computed: {
    ...mapGetters(["mviewer", "startPointFn", "dimension"]),
    ...mapGetters(["startPointFn", "dimension"]),
  },
  created() {},
  methods: {

 src/components/mobileCortrolButtom/index.vue

@@ -65,10 +65,9 @@
  },
  computed: {
    ...mapGetters([
      "mviewer",
      "openmobileGoTo",
      "dimensionData",
      "startPointFn",
      // "startPointFn",
      "dimension",
    ]),
  },
@@ -89,7 +88,7 @@
        that.$store.dispatch("pcMoveView", {
          jd: res[0],
          wd: res[1],
          viewer: that.mviewer,
          viewer: global.viewer,
        });

        let data = [
@@ -102,7 +101,7 @@
        that.$store.dispatch("addLabelLayerIconMobelUse", {
          list: data,
          clear: true,
          mviewer: that.mviewer,
          mviewer: global.viewer,
        });
      });
    },
@@ -123,7 +122,7 @@
      //     }
      //     return;
      //   }
      this.startPointFn();
      window.startPointFn();
    },
    openActivity() {
      const d = {
@@ -159,7 +158,7 @@
      //   roll: 0,
      //   noOpen: true,
      // });
      that.mviewer.camera.setView({
      global.viewer.camera.setView({
        // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
        // fromDegrees()方法，将经纬度和高程转换为世界坐标
        // eslint-disable-next-line new-cap

 src/components/mobileGoTo/index.vue

@@ -25,7 +25,6 @@
  computed: {
    ...mapGetters([
      "openmobileGoTo",
      "mviewer",
      "query",
      "MobileWindowChangeData",
      "ccDataState",

 src/components/mobileLeftNav/index.vue

@@ -1,292 +1,299 @@
<template>
    <div :class="['m-left-nav', seeRight ? '' : 'nones']" :style="[navStyle]">
        <!-- :style="[coutrolStyle]" -->
        <div class="m-left-coutrol" @click="changeIconHide">
            <i :class="icons"></i>
        </div>
        <ul>
            <li
                v-for="(item, index) in leftNavData"
                :key="index"
                @click="leftNavClick(item)"
                v-show="!item.notShow"
            >
                <img :style="[imgStyle]" :src="item.img" alt />
                <span>{{ item.label }}</span>
            </li>
        </ul>
  <div :class="['m-left-nav', seeRight ? '' : 'nones']" :style="[navStyle]">
    <!-- :style="[coutrolStyle]" -->
    <div class="m-left-coutrol" @click="changeIconHide">
      <i :class="icons"></i>
    </div>
    <ul>
      <li
        v-for="(item, index) in leftNavData"
        :key="index"
        @click="leftNavClick(item)"
        v-show="!item.notShow"
      >
        <img :style="[imgStyle]" :src="item.img" alt />
        <span>{{ item.label }}</span>
      </li>
    </ul>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import { mapGetters } from "vuex";
import {
    // getListdoor, //出入
    // getListaed, //AED
    // getListparking, //停车场
    getListarchitecture, // 全景
    getListarchitecture1, // 标签
    getListroad, // 道路
    getListcat // 出入-AED-停车场
} from '@/api/mobile/piont/index'
import { getListVideo } from '@/api/mobile/monitor/index'
  // getListdoor, //出入
  // getListaed, //AED
  // getListparking, //停车场
  getListarchitecture, // 全景
  getListarchitecture1, // 标签
  getListroad, // 道路
  getListcat, // 出入-AED-停车场
} from "@/api/mobile/piont/index";
import { getListVideo } from "@/api/mobile/monitor/index";

window.tagLayer = null;
window.wayLayer = null;
window.sceneLayer = null;
window.videoLayer = null;
window.activityLayer = null;
window.aedLayer = null;
window.parkLayer = null;
window.comeLayer = null;
export default {
    name: 'mobileLeftNav',
    watch: {
        iconHide () {
            if (this.iconHide) {
                this.icons = 'el-icon-d-arrow-left'
                this.navStyle.right = '-51px'
                this.imgStyle.right = '6px'
            } else {
                this.icons = 'el-icon-d-arrow-right'
                this.navStyle.right = '0px'
                this.imgStyle.right = '0'
            }
        },
        seeRight () {
            if (this.seeRight) {
                this.leftNavData[0].flag = false
                this.leftNavData[0].img = this.leftNavData[0].checked
                this[this.leftNavData[0].layer].show = true
            } else {
                const lnd = this.leftNavData
                for (const k in lnd) {
                    if (this[this.leftNavData[k].layer]._show) {
                        // console.log(lnd[k].label, "所有开启");
                        this.leftNavData[k].flag = false
                        this.leftNavData[k].img = this.leftNavData[k].normal
                        this[this.leftNavData[k].layer].show = false
                    }
                }
            }
  name: "mobileLeftNav",
  watch: {
    iconHide() {
      if (this.iconHide) {
        this.icons = "el-icon-d-arrow-left";
        this.navStyle.right = "-51px";
        this.imgStyle.right = "6px";
      } else {
        this.icons = "el-icon-d-arrow-right";
        this.navStyle.right = "0px";
        this.imgStyle.right = "0";
      }
    },
    seeRight() {
      if (this.seeRight) {
        this.leftNavData[0].flag = false;
        this.leftNavData[0].img = this.leftNavData[0].checked;
        window[this.leftNavData[0].layer].show = true;
      } else {
        const lnd = this.leftNavData;
        for (const k in lnd) {
          if (window[this.leftNavData[k].layer]._show) {
            // console.log(lnd[k].label, "所有开启");
            this.leftNavData[k].flag = false;
            this.leftNavData[k].img = this.leftNavData[k].normal;
            window[this.leftNavData[k].layer].show = false;
          }
        }
      }
    },
    computed: {
        ...mapGetters(['iconHide', 'dimensionData', 'seeRight'])
  },
  computed: {
    ...mapGetters(["iconHide", "dimensionData", "seeRight"]),
  },
  data() {
    return {
      icons: "el-icon-d-arrow-right",
      navStyle: {
        right: "0px",
      },
      imgStyle: {
        right: "0",
      },
      leftNavData: [
        {
          flag: true,
          label: "标签",
          // img: "/img/leftnav/tag.png",
          img: "/img/leftnav/tag-checked.png",
          normal: "/img/leftnav/tag.png",
          checked: "/img/leftnav/tag-checked.png",
          layer: "tagLayer",
          methods: getListarchitecture1,
          imgSrc: "https://map.hit.edu.cn/images/tarrow_xq.png",
          // imgSrc: "img/mobile/pink.png",
        },
        {
          flag: false,
          label: "道路",
          img: "/img/leftnav/way.png",
          normal: "/img/leftnav/way.png",
          checked: "/img/leftnav/way-checked.png",
          layer: "wayLayer",
          methods: getListroad,
          imgSrc: "img/mobile/green.png",
        },
        {
          flag: false,
          label: "实景",
          img: "/img/leftnav/scene.png",
          normal: "/img/leftnav/scene.png",
          checked: "/img/leftnav/scene-checked.png",
          layer: "sceneLayer",
          methods: getListarchitecture,
          imgSrc: "img/leftnav/map-panorama.png",
          // imgSrc: "img/mobile/blue.png",
        },
        {
          flag: false,
          label: "监控",
          img: "/img/leftnav/monitor.png",
          normal: "/img/leftnav/monitor.png",
          checked: "/img/leftnav/monitor-checked.png",
          layer: "videoLayer",
          methods: getListVideo,
          imgSrc: "/img/leftnav/map-monitor.png",
          // imgSrc: "img/mobile/blue.png",
        },
        // {
        //   flag: false,
        //   label: "活动",
        //   img: "/img/leftnav/activity.png",
        //   normal: "/img/leftnav/activity.png",
        //   checked: "/img/leftnav/activity-checked.png",
        //   layer: "activityLayer",
        //   methods: getListdoor,
        //   imgSrc: "img/mobile/brown.png",
        // },
        {
          flag: false,
          label: "AED",
          img: "/img/leftnav/aed.png",
          normal: "/img/leftnav/aed.png",
          checked: "/img/leftnav/aed-checked.png",
          layer: "aedLayer",
          methods: getListcat,
          type: 9,
          imgSrc: "img/leftnav/map-aed.png",
          // imgSrc: "img/mobile/pink.png",
          notShow: true,
        },
        {
          flag: false,
          label: "停车",
          img: "/img/leftnav/park.png",
          normal: "/img/leftnav/park.png",
          checked: "/img/leftnav/park-checked.png",
          layer: "parkLayer",
          methods: getListcat,
          type: 11,
          imgSrc: "https://map.hit.edu.cn/images/p-biao.png",
          // imgSrc: "img/mobile/popcorn.png",
        },
        {
          flag: false,
          label: "出入",
          img: "/img/leftnav/come.png",
          normal: "/img/leftnav/come.png",
          checked: "/img/leftnav/come-checked.png",
          layer: "comeLayer",
          methods: getListcat,
          type: 12,
          imgSrc: "img/leftnav/map-activity.png",
          // imgSrc: "img/mobile/purple.png",
        },
      ],
      //   viewer: null,
      //   tagLayer: null,
      //   wayLayer: null,
      //   sceneLayer: null,
      //   videoLayer: null,
      //   activityLayer: null,
      //   aedLayer: null,
      //   parkLayer: null,
      //   comeLayer: null,
    };
  },
  created() {},
  mounted() {},
  methods: {
    changeIconHide() {
      const isif = this.iconHide;
      this.$store.commit("MSET_ICONHIDE", !isif);
    },
    data () {
        return {
            icons: 'el-icon-d-arrow-right',
            navStyle: {
                right: '0px'
            },
            imgStyle: {
                right: '0'
            },
            leftNavData: [
                {
                    flag: true,
                    label: '标签',
                    // img: "/img/leftnav/tag.png",
                    img: '/img/leftnav/tag-checked.png',
                    normal: '/img/leftnav/tag.png',
                    checked: '/img/leftnav/tag-checked.png',
                    layer: 'tagLayer',
                    methods: getListarchitecture1,
                    imgSrc: 'https://map.hit.edu.cn/images/tarrow_xq.png'
                    // imgSrc: "img/mobile/pink.png",
                },
                {
                    flag: false,
                    label: '道路',
                    img: '/img/leftnav/way.png',
                    normal: '/img/leftnav/way.png',
                    checked: '/img/leftnav/way-checked.png',
                    layer: 'wayLayer',
                    methods: getListroad,
                    imgSrc: 'img/mobile/green.png'
                },
                {
                    flag: false,
                    label: '实景',
                    img: '/img/leftnav/scene.png',
                    normal: '/img/leftnav/scene.png',
                    checked: '/img/leftnav/scene-checked.png',
                    layer: 'sceneLayer',
                    methods: getListarchitecture,
                    imgSrc: 'img/leftnav/map-panorama.png'
                    // imgSrc: "img/mobile/blue.png",
                },
                {
                    flag: false,
                    label: '监控',
                    img: '/img/leftnav/monitor.png',
                    normal: '/img/leftnav/monitor.png',
                    checked: '/img/leftnav/monitor-checked.png',
                    layer: 'videoLayer',
                    methods: getListVideo,
                    imgSrc: '/img/leftnav/map-monitor.png'
                    // imgSrc: "img/mobile/blue.png",
                },
                // {
                //   flag: false,
                //   label: "活动",
                //   img: "/img/leftnav/activity.png",
                //   normal: "/img/leftnav/activity.png",
                //   checked: "/img/leftnav/activity-checked.png",
                //   layer: "activityLayer",
                //   methods: getListdoor,
                //   imgSrc: "img/mobile/brown.png",
                // },
                {
                    flag: false,
                    label: 'AED',
                    img: '/img/leftnav/aed.png',
                    normal: '/img/leftnav/aed.png',
                    checked: '/img/leftnav/aed-checked.png',
                    layer: 'aedLayer',
                    methods: getListcat,
                    type: 9,
                    imgSrc: 'img/leftnav/map-aed.png',
                    // imgSrc: "img/mobile/pink.png",
                    notShow: true
                },
                {
                    flag: false,
                    label: '停车',
                    img: '/img/leftnav/park.png',
                    normal: '/img/leftnav/park.png',
                    checked: '/img/leftnav/park-checked.png',
                    layer: 'parkLayer',
                    methods: getListcat,
                    type: 11,
                    imgSrc: 'https://map.hit.edu.cn/images/p-biao.png'
                    // imgSrc: "img/mobile/popcorn.png",
                },
                {
                    flag: false,
                    label: '出入',
                    img: '/img/leftnav/come.png',
                    normal: '/img/leftnav/come.png',
                    checked: '/img/leftnav/come-checked.png',
                    layer: 'comeLayer',
                    methods: getListcat,
                    type: 12,
                    imgSrc: 'img/leftnav/map-activity.png'
                    // imgSrc: "img/mobile/purple.png",
                }
            ],
            viewer: null,
            tagLayer: null,
            wayLayer: null,
            sceneLayer: null,
            videoLayer: null,
            activityLayer: null,
            aedLayer: null,
            parkLayer: null,
            comeLayer: null
    leftNavClick(item) {
      // console.log(123132);
      // 判断并关闭已开启标签
      const lnd = this.leftNavData;
      for (const k in lnd) {
        // console.log(this[this.leftNavData[k].layer]);
        if (lnd[k].label == item.label) {
          // console.log(lnd[k].label, "当前点击");
          continue;
        }
        if (window[this.leftNavData[k].layer]._show) {
          // console.log(lnd[k].label, "所有开启");
          this.leftNavData[k].flag = false;
          this.leftNavData[k].img = this.leftNavData[k].normal;
          window[this.leftNavData[k].layer].show = false;
        }
      }

      item.flag = !item.flag;
      if (item.flag == true) {
        item.img = item.checked;
        window[item.layer].show = true;
        // console.log("飞入");
        // this.flyTo(item);
        this.$store.dispatch("closeMobileWindowsDom"); // 关闭弹窗
      } else {
        item.img = item.normal;
        window[item.layer].show = false;
      }
    },
    created () {
    },
    mounted () { },
    methods: {
        changeIconHide () {
            const isif = this.iconHide
            this.$store.commit('MSET_ICONHIDE', !isif)
        },
        leftNavClick (item) {
            // console.log(123132);
            // 判断并关闭已开启标签
            const lnd = this.leftNavData
            for (const k in lnd) {
                // console.log(this[this.leftNavData[k].layer]);
                if (lnd[k].label == item.label) {
                    // console.log(lnd[k].label, "当前点击");
                    continue
                }
                if (this[this.leftNavData[k].layer]._show) {
                    // console.log(lnd[k].label, "所有开启");
                    this.leftNavData[k].flag = false
                    this.leftNavData[k].img = this.leftNavData[k].normal
                    this[this.leftNavData[k].layer].show = false
                }
            }
    // flyTo(item) {
    //   const that = this;
    //   const posi = this[item.layer].positions[0];
    //   // console.log(posi);
    //   const lntLat =
    //     that.dimensionData.pitch == -45
    //       ? [posi.lng + 0.00917, posi.lat - 0.0188, 500]
    //       : [posi.lng + 0.01197, posi.lat - 0.00055, 500];
    //   // that.mviewer.camera.flyTo({
    //   //   destination: Cesium.Cartesian3.fromDegrees(
    //   //     lntLat[0],
    //   //     lntLat[1],
    //   //     lntLat[2]
    //   //   ),
    //   // });
    //   // return;
    //   this.$store.dispatch("mapFlyTo", {
    //     // 飞入
    //     lntLat: lntLat,
    //     // lntLat: [posi.lng + 0.01187, posi.lat - 0.0308, 4000],
    //     // lntLat: [121.50492752204283, 31.21567802276832, 2530],
    //     heading: that.dimensionData.heading,
    //     pitch: that.dimensionData.pitch,
    //     roll: that.dimensionData.roll,
    //     noOpen: true,
    //   });
    // },
    initialize() {
      var that = this;
      global.viewer.scene.globe.depthTestAgainstTerrain = false;
      window.tagLayer = new global.DC.HtmlLayer("tagLayer");
      global.viewer.addLayer(tagLayer);

            item.flag = !item.flag
            if (item.flag == true) {
                item.img = item.checked
                this[item.layer].show = true
                // console.log("飞入");
                // this.flyTo(item);
                this.$store.dispatch('closeMobileWindowsDom') // 关闭弹窗
            } else {
                item.img = item.normal
                this[item.layer].show = false
            }
        },
        flyTo (item) {
            const that = this
            const posi = this[item.layer].positions[0]
            // console.log(posi);
            const lntLat =
                that.dimensionData.pitch == -45
                    ? [posi.lng + 0.00917, posi.lat - 0.0188, 500]
                    : [posi.lng + 0.01197, posi.lat - 0.00055, 500]
            // that.mviewer.camera.flyTo({
            //   destination: Cesium.Cartesian3.fromDegrees(
            //     lntLat[0],
            //     lntLat[1],
            //     lntLat[2]
            //   ),
            // });
            // return;
            this.$store.dispatch('mapFlyTo', {
                // 飞入
                lntLat: lntLat,
                // lntLat: [posi.lng + 0.01187, posi.lat - 0.0308, 4000],
                // lntLat: [121.50492752204283, 31.21567802276832, 2530],
                heading: that.dimensionData.heading,
                pitch: that.dimensionData.pitch,
                roll: that.dimensionData.roll,
                noOpen: true
            })
        },
        initialize (viewer) {
            var that = this
            viewer.scene.globe.depthTestAgainstTerrain = false
            this.viewer = viewer
            this.tagLayer = new global.DC.HtmlLayer('tagLayer')
            viewer.addLayer(this.tagLayer)
      window.wayLayer = new global.DC.HtmlLayer("wayLayer");
      global.viewer.addLayer(wayLayer);

            this.wayLayer = new global.DC.HtmlLayer('wayLayer')
            viewer.addLayer(this.wayLayer)
      // sceneLayer = new global.DC.VectorLayer("sceneLayer");
      window.sceneLayer = new global.DC.HtmlLayer("sceneLayer");
      global.viewer.addLayer(sceneLayer);

            // this.sceneLayer = new global.DC.VectorLayer("sceneLayer");
            this.sceneLayer = new global.DC.HtmlLayer('sceneLayer')
            viewer.addLayer(this.sceneLayer)
      window.videoLayer = new global.DC.HtmlLayer("videoLayer");
      global.viewer.addLayer(videoLayer);

            this.videoLayer = new global.DC.HtmlLayer('videoLayer')
            viewer.addLayer(this.videoLayer)
      // activityLayer = new global.DC.VectorLayer("activityLayer");
      window.activityLayer = new global.DC.HtmlLayer("activityLayer");
      global.viewer.addLayer(activityLayer);

            // this.activityLayer = new global.DC.VectorLayer("activityLayer");
            this.activityLayer = new global.DC.HtmlLayer('activityLayer')
            viewer.addLayer(this.activityLayer)
      // aedLayer = new global.DC.VectorLayer("aedLayer");
      window.aedLayer = new global.DC.HtmlLayer("aedLayer");
      global.viewer.addLayer(aedLayer);

            // this.aedLayer = new global.DC.VectorLayer("aedLayer");
            this.aedLayer = new global.DC.HtmlLayer('aedLayer')
            viewer.addLayer(this.aedLayer)
      window.parkLayer = new global.DC.HtmlLayer("parkLayer");
      global.viewer.addLayer(parkLayer);

            this.parkLayer = new global.DC.HtmlLayer('parkLayer')
            viewer.addLayer(this.parkLayer)
      // comeLayer = new global.DC.VectorLayer("comeLayer");
      window.comeLayer = new global.DC.HtmlLayer("comeLayer");
      global.viewer.addLayer(comeLayer);

            // this.comeLayer = new global.DC.VectorLayer("comeLayer");
            this.comeLayer = new global.DC.HtmlLayer('comeLayer')
            viewer.addLayer(this.comeLayer)

            const ourNum = that.leftNavData.length
            for (let n = 0; n < ourNum; n++) {
                const ourD = this.leftNavData[n]
                const d = ourD.type ? { lifetype: ourD.type } : {}
                ourD.methods(d).then((res) => {
                    let dom
                    const data = res.data.data
                    const position = that.changePoiton(data)
                    const num = data.length
                    for (let k = 0; k < num; k++) {
                        if (ourD.label == '标签') {
                            dom = `
      const ourNum = that.leftNavData.length;
      for (let n = 0; n < ourNum; n++) {
        const ourD = this.leftNavData[n];
        const d = ourD.type ? { lifetype: ourD.type } : {};
        ourD.methods(d).then((res) => {
          let dom;
          const data = res.data.data;
          const position = that.changePoiton(data);
          const num = data.length;
          for (let k = 0; k < num; k++) {
            if (ourD.label == "标签") {
              dom = `
                        <div class="tag-entitys-box">
                            <div class="tag-content">
                               ${data[k].mechanismname}
@@ -295,12 +302,12 @@
                                <img src="${ourD.imgSrc}">
                            </div>
                        </div>
                    `
                        } else if (ourD.label == '道路') {
                            // <div  class="way-title" style="border: white 1px solid; padding-left: 2px;font-size: 12px; background: #0066ff;  width: 12px;line-height: 13px; padding:2px 1px 2px 1px; color:white;">
                            //    ${data[k].mechanismname}
                            // </div>
                            dom = `
                    `;
            } else if (ourD.label == "道路") {
              // <div  class="way-title" style="border: white 1px solid; padding-left: 2px;font-size: 12px; background: #0066ff;  width: 12px;line-height: 13px; padding:2px 1px 2px 1px; color:white;">
              //    ${data[k].mechanismname}
              // </div>
              dom = `
                        <div  class="way-entitys-box">
                            <div  class="way-title" style="border: white 1px solid; padding-left: 2px;font-size: 12px; background: #0066ff;  width: 12px;line-height: 13px; padding:2px 1px 2px 1px; color:white;">
                                 ${data[k].roadname}
@@ -309,19 +316,19 @@
                                <img src="https://map.hit.edu.cn/images/roadsign3.png">
                            </div>
                        </div>
                    `
                        } else if (ourD.label == '实景') {
                            // <div  class="way-title" style="border: white 1px solid; padding-left: 2px;font-size: 12px; background: #0066ff;  width: 12px;line-height: 13px; padding:2px 1px 2px 1px; color:white;">
                            //    ${data[k].mechanismname}
                            // </div>
                            dom = `
                    `;
            } else if (ourD.label == "实景") {
              // <div  class="way-title" style="border: white 1px solid; padding-left: 2px;font-size: 12px; background: #0066ff;  width: 12px;line-height: 13px; padding:2px 1px 2px 1px; color:white;">
              //    ${data[k].mechanismname}
              // </div>
              dom = `
                        <div class="scene-entitys-box">
                            <div>${data[k].mechanismname}</div>
                            <img src="/img/leftnav/map-panorama.png" alt="">
                        </div>
                        `
                        } else if (ourD.label == 'AED') {
                            dom = `
                        `;
            } else if (ourD.label == "AED") {
              dom = `
                        <div class="mobiletag-entitys-box">
                            <div class="tag-content">
                               ${data[k].mechanismname}
@@ -330,9 +337,9 @@
                                <img src="${ourD.imgSrc}">
                            </div>
                        </div>
                    `
                        } else if (ourD.label == '停车') {
                            dom = `
                    `;
            } else if (ourD.label == "停车") {
              dom = `
                        <div class="park-entitys-box">
                            <div class="park-title" alt="${data[k].mechanismname}">
                            </div>
@@ -345,9 +352,9 @@
                                </div>
                            </div>
                        </div>
                    `
                        } else if (ourD.label == '出入') {
                            dom = `
                    `;
            } else if (ourD.label == "出入") {
              dom = `
                        <div class="mobiletag-entitys-box-pink">
                            <div class="tag-content">
                               ${data[k].mechanismname}
@@ -356,141 +363,141 @@
                                <img src="${ourD.imgSrc}">
                            </div>
                        </div>
                    `
                        } else if (ourD.label == '监控') {
                            dom = `
                    `;
            } else if (ourD.label == "监控") {
              dom = `
                        <div class="monitor-entitys-box">
                            <div>${data[k].mechanismname}</div>
                            <img class="monitor-entitys-box" src="/img/leftnav/map-monitor.png" alt="">
                        </div>
                        `
                        }
                        const divIcon = new global.DC.DivIcon(position[k], dom)
                        // 订阅事件
                        divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
                            // console.log(data[k]);
                            const d = {
                                name:
                                    data[k].mechanismname ||
                                    data[k].roadname ||
                                    (ourD.label == '监控' ? '监控' : '无显示名字'),
                                bgImg: data[k].tpurl,
                                video: data[k].videourl || '',
                                from: 'labels',
                                introduce: data[k].introduce,
                                panoramaurl: data[k].panoramaurl
                            }
                            // 定制化窗体
                            that.openPopupS(
                                e.position,
                                [e.overlay._position._lng, e.overlay._position._lat],
                                d
                            )
                        })
                        that[that.leftNavData[n].layer].addOverlay(divIcon) // 加入图标
                    }
                    that[that.leftNavData[n].layer].positions = position
                    if (that.leftNavData[n].layer == 'tagLayer') {
                        // that.leftNavData[n].img = that.leftNavData[n].checked;
                    } else {
                        that[that.leftNavData[n].layer].show = false
                    }
                })
                        `;
            }
            // setTimeout(() => {
            //   this.tagLayer.show = false;
            // }, 500);
        },
        changePoiton (data) {
            // console.log(data);
            const list = []
            const num = data.length
            for (let i = 0; i < num; i++) {
                list.push(new global.DC.Position(data[i].jd, data[i].wd, 0))
            }
            return list
        },
        mobileOpenImgs1 () {
            const imgsDom = document.getElementById('mobileBigImgs')
            imgsDom.click()
        },
        goOn1 () { },
        openPopupS (position, lntLat, query) {
            const that = this
            // 定制化窗体
            const d = {
                position,
                lntLat,
                query: { ...(query || {}), position, lntLat },
                useJWD: true // 仅使用经纬度
            }
            that.$store.dispatch('setMobileWindows', d)
        }
    }
}
            const divIcon = new global.DC.DivIcon(position[k], dom);
            // 订阅事件
            divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
              // console.log(data[k]);
              const d = {
                name:
                  data[k].mechanismname ||
                  data[k].roadname ||
                  (ourD.label == "监控" ? "监控" : "无显示名字"),
                bgImg: data[k].tpurl,
                video: data[k].videourl || "",
                from: "labels",
                introduce: data[k].introduce,
                panoramaurl: data[k].panoramaurl,
              };
              // 定制化窗体
              that.openPopupS(
                e.position,
                [e.overlay._position._lng, e.overlay._position._lat],
                d
              );
            });
            window[that.leftNavData[n].layer].addOverlay(divIcon); // 加入图标
          }
          window[that.leftNavData[n].layer].positions = position;
          if (that.leftNavData[n].layer == "tagLayer") {
            // that.leftNavData[n].img = that.leftNavData[n].checked;
          } else {
            window[that.leftNavData[n].layer].show = false;
          }
        });
      }
      // setTimeout(() => {
      //   this.tagLayer.show = false;
      // }, 500);
    },
    changePoiton(data) {
      // console.log(data);
      const list = [];
      const num = data.length;
      for (let i = 0; i < num; i++) {
        list.push(new global.DC.Position(data[i].jd, data[i].wd, 0));
      }
      return list;
    },
    mobileOpenImgs1() {
      const imgsDom = document.getElementById("mobileBigImgs");
      imgsDom.click();
    },
    goOn1() {},
    openPopupS(position, lntLat, query) {
      const that = this;
      // 定制化窗体
      const d = {
        position,
        lntLat,
        query: { ...(query || {}), position, lntLat },
        useJWD: true, // 仅使用经纬度
      };
      that.$store.dispatch("setMobileWindows", d);
    },
  },
};
</script>

<style scoped lang="scss">
.m-left-nav {
    position: fixed;
    bottom: 30px;
    right: 0px;
    z-index: 200;
  position: fixed;
  bottom: 30px;
  right: 0px;
  z-index: 200;
  background-color: #fff;
  border-radius: 17px 0 0 17px;
  transition: all 0.5s;
  .m-left-coutrol {
    position: absolute;
    left: -24px;
    top: 79px;
    width: 25px;
    height: 60px;
    background-color: #fff;
    border-radius: 17px 0 0 17px;
    transition: all 0.5s;
    .m-left-coutrol {
        position: absolute;
        left: -24px;
        top: 79px;
        width: 25px;
        height: 60px;
        background-color: #fff;
        border-radius: 17px 0 0 17px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    ul {
        position: relative;
        top: 3px;
    }
    li {
        margin-bottom: 6px;
        font-weight: 400;
        display: block;
        width: 80px;
        height: 30px;
        line-height: 30px;
        background-color: #fff;
        border-radius: 15px;
        text-align: center;
        font-size: 0;
        cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  ul {
    position: relative;
    top: 3px;
  }
  li {
    margin-bottom: 6px;
    font-weight: 400;
    display: block;
    width: 80px;
    height: 30px;
    line-height: 30px;
    background-color: #fff;
    border-radius: 15px;
    text-align: center;
    font-size: 0;
    cursor: pointer;

        img {
            position: relative;
            transition: all 0.5s;
            width: 24px;
            height: 24px;
            vertical-align: middle;
            margin-right: 10px;
            image-rendering: -moz-crisp-edges;
            image-rendering: -o-crisp-edges;
            image-rendering: -webkit-optimize-contrast;
            image-rendering: crisp-edges;
            -ms-interpolation-mode: nearest-neighbor;
        }

        span {
            display: inline-block;
            vertical-align: middle;
            font-size: 14px;
            color: #2f2f2f;
        }
    img {
      position: relative;
      transition: all 0.5s;
      width: 24px;
      height: 24px;
      vertical-align: middle;
      margin-right: 10px;
      image-rendering: -moz-crisp-edges;
      image-rendering: -o-crisp-edges;
      image-rendering: -webkit-optimize-contrast;
      image-rendering: crisp-edges;
      -ms-interpolation-mode: nearest-neighbor;
    }

    span {
      display: inline-block;
      vertical-align: middle;
      font-size: 14px;
      color: #2f2f2f;
    }
  }
}
.nones {
    display: none;
  display: none;
}
</style>

 src/components/mobilePopupOur/index.vue

@@ -124,6 +124,13 @@
    // console.log("请求对应街道接口", this.popupOurOpenData);
    this.getDataHeardDown();
  },
  watch: {
    fullscreenLoading() {
      if (this.fullscreenLoading) {
        this.notLine();
      }
    },
  },
  methods: {
    handleClick(tab, event) {
      //头下部标签
@@ -294,7 +301,6 @@
        }
        that.tabTable[+campus - 1].child = outList;
      });
      this.notLine();
    },
    //搜索请求
    getListSearchMethod(name) {
@@ -340,11 +346,12 @@
        that.fullscreenLoading = false;
        that.onlyData = outList;
      });
      this.notLine();
    },
    notLine() {
      console.log("等待关闭");
      setTimeout(() => {
        this.fullscreenLoading = false;
        console.log("关闭dolog");
      }, 5000);
    },
  },

 src/components/mobilePopupOurOnce/index.vue

@@ -1,32 +1,34 @@
<template>
    <div class="mobilePopupOurOnce">
        <div
            class="mobilePopupOurOnce_center"
            :style="{
  <div class="mobilePopupOurOnce">
    <div
      class="mobilePopupOurOnce_center"
      :style="{
        borderBottom: !ends ? '#d4d4d4 dashed 1px' : '',
        marginBottom: !ends ? '6px' : '',
      }"
    >
      <div class="mobilePopupOurOnce_left">
        <!-- <img :src="icon" alt="" :key="icon" /> -->
        <el-image
          style="width: 80px; height: 80px"
          :src="icon"
          :id="'mobileBigImgs' + icon + ''"
          :preview-src-list="srcList"
        >
            <div class="mobilePopupOurOnce_left">
                <!-- <img :src="icon" alt="" :key="icon" /> -->
                <el-image
                    style="width: 80px; height: 80px"
                    :src="icon"
                    :id="'mobileBigImgs' + icon + ''"
                    :preview-src-list="srcList"
                >
                    <!-- v-show="false" -->
                </el-image>
            </div>
            <div class="mobilePopupOurOnce_right" @click.self.stop="openOnce('定位')">
                <div
                    class="mobilePopupOurOnce_r_up"
                    @click.self.stop="openOnce('定位')"
                >{{ onceData.name }}</div>
                <div class="mobilePopupOurOnce_r_down">
                    <div v-for="(item, index) in seebut" :key="index">
                        <el-link
                            :icon="
          <!-- v-show="false" -->
        </el-image>
      </div>
      <div class="mobilePopupOurOnce_right" @click.self.stop="openOnce('定位')">
        <div
          class="mobilePopupOurOnce_r_up"
          @click.self.stop="openOnce('定位')"
        >
          {{ onceData.name }}
        </div>
        <div class="mobilePopupOurOnce_r_down">
          <div v-for="(item, index) in seebut" :key="index">
            <el-link
              :icon="
                item.name == '实景'
                  ? 'el-icon-place'
                  : item.name == '图集'
@@ -35,188 +37,191 @@
                  ? '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>
              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'
import { getChildNavDetail } from '@/api/mobile/public/arc'
import { mapGetters } from "vuex";
import { getChildNavDetail } from "@/api/mobile/public/arc";
export default {
    props: ['onceData', 'ends'],
    name: 'mobilePopupOurOnce',
    created () {
        if (this.onceData.icon) {
            this.srcList = this.onceData.icon
            this.icon = this.srcList[0]
        }
        if (this.onceData.from == '校区建筑' || this.onceData.from == '文化风景') {
            this.getOnceCampus(this.onceData.id)
        } else {
            this.ourData = this.onceData
        }
    },
    data () {
        return {
            icon: '',
            srcList: [],
            ourData: {}
        }
    },
    computed: {
        ...mapGetters(['mviewer']),
        seebut () {
            const buts = this.onceData.buts
            let b = []
            for (const k in buts) {
                if (buts[k] == '实景') {
                    continue
                }
                b.push({
                    name: buts[k]
                })
            }
            if (this.ourData.panoramaurl) {
                b.push({
                    name: '实景'
                })
            } else {
                b = b.filter((res) => {
                    return res.name != '实景'
                })
            }
            return b
        }
    },
    methods: {
        openOnce (val) {
            if (!this.ourData.name) {
                console.log('数据传输失败')
                return
            }
            const that = this
            if (val == '定位') {
                // 活动定位
                if (this.ourData.name == '活动') {
                    console.log(this.ourData)
                    return
                }
                // 随地图移动窗口
                this.$store.commit('MSET_BIGPOPUP', false) // 关闭全屏弹窗
                setTimeout(() => {
                    //   // 定制化窗体
                    const d = {
                        position: {},
                        lntLat: that.ourData.lntLat,
                        query: { ...this.ourData, seebut: this.seebut },
                        useJWD: true, // 仅使用经纬度
                        from: 'PopupOurOnce'
                    }
                    that.popupsDom = that.$store.dispatch('setMobileWindows', d)
                }, 500)
                // 固定窗口
                // that.$store.dispatch("SET_OPENWIDOWFIXED", d);
            } else if (val == '实景') {
                this.$store.commit('MSET_OPENMOBILEPANORAMA', this.ourData.panoramaurl)
                // if(this.ourData.panoramaurl){
                // }
                // console.log(this.ourData.panoramaurl);
            } else if (val == '图集') {
                const imgsDom = document.getElementById('mobileBigImgs' + this.icon + '')
                imgsDom.click()
            }
        },
        // "校区建筑"↓
        getOnceCampus (id) {
            getChildNavDetail({ id: id }).then((res) => {
                var result = res.data.data[0].list
                const d = {
                    name: result.mechanismname,
                    lntLat: [result.jd, result.wd],
                    alt: result.gd,
                    heading: result.heading,
                    pitch: result.pitch,
                    roll: result.roll,
                    bgImg: result.tpurl,
                    QRImg: result.codeurl,
                    websiteUrl: result.websiteurl,
                    telePhone: result.telephone,
                    address: result.address,
                    introduce: result.introduce,
                    video: result.videourl,
                    panoramaurl: result.panoramaurl // 全景
                }
                this.ourData = d
            })
        }
        // "校区建筑"↑
  props: ["onceData", "ends"],
  name: "mobilePopupOurOnce",
  created() {
    if (this.onceData.icon) {
      this.srcList = this.onceData.icon;
      this.icon = this.srcList[0];
    }
}
    if (this.onceData.from == "校区建筑" || this.onceData.from == "文化风景") {
      this.getOnceCampus(this.onceData.id);
    } else {
      this.ourData = this.onceData;
    }
  },
  data() {
    return {
      icon: "",
      srcList: [],
      ourData: {},
    };
  },
  computed: {
    ...mapGetters(["mviewer"]),
    seebut() {
      const buts = this.onceData.buts;
      let b = [];
      for (const k in buts) {
        if (buts[k] == "实景") {
          continue;
        }
        b.push({
          name: buts[k],
        });
      }
      if (this.ourData.panoramaurl) {
        b.push({
          name: "实景",
        });
      } else {
        b = b.filter((res) => {
          return res.name != "实景";
        });
      }
      return b;
    },
  },
  methods: {
    openOnce(val) {
      if (!this.ourData.name) {
        console.log("数据传输失败");
        return;
      }
      const that = this;
      if (val == "定位") {
        // 活动定位
        if (this.ourData.name == "活动") {
          console.log(this.ourData);
          return;
        }
        // 随地图移动窗口
        this.$store.commit("MSET_BIGPOPUP", false); // 关闭全屏弹窗
        setTimeout(() => {
          //   // 定制化窗体
          const d = {
            position: {},
            lntLat: that.ourData.lntLat,
            query: { ...this.ourData, seebut: this.seebut },
            useJWD: true, // 仅使用经纬度
            from: "PopupOurOnce",
          };
          window.popupsDom = that.$store.dispatch("setMobileWindows", d);
        }, 500);
        // 固定窗口
        // that.$store.dispatch("SET_OPENWIDOWFIXED", d);
      } else if (val == "实景") {
        this.$store.commit("MSET_OPENMOBILEPANORAMA", this.ourData.panoramaurl);
        // if(this.ourData.panoramaurl){
        // }
        // console.log(this.ourData.panoramaurl);
      } else if (val == "图集") {
        const imgsDom = document.getElementById(
          "mobileBigImgs" + this.icon + ""
        );
        imgsDom.click();
      }
    },
    // "校区建筑"↓
    getOnceCampus(id) {
      getChildNavDetail({ id: id }).then((res) => {
        var result = res.data.data[0].list;
        const d = {
          name: result.mechanismname,
          lntLat: [result.jd, result.wd],
          alt: result.gd,
          heading: result.heading,
          pitch: result.pitch,
          roll: result.roll,
          bgImg: result.tpurl,
          QRImg: result.codeurl,
          websiteUrl: result.websiteurl,
          telePhone: result.telephone,
          address: result.address,
          introduce: result.introduce,
          video: result.videourl,
          panoramaurl: result.panoramaurl, // 全景
        };
        this.ourData = d;
      });
    },
    // "校区建筑"↑
  },
};
</script>

<style lang="scss" scoped>
// 继承类
.flexCenter {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.mobilePopupOurOnce {
    padding: 8px 0 0 0;
    margin: 0 8px;
    // background-image: linear-gradient(#29baf1, #28bbf0);
    .mobilePopupOurOnce_center {
        // margin-bottom: 8px;
  padding: 8px 0 0 0;
  margin: 0 8px;
  // background-image: linear-gradient(#29baf1, #28bbf0);
  .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;
      img {
        width: 80px;
        height: 80px;
        // border-bottom: #d4d4d4 dashed 1px;
        padding-bottom: 8px;
        @extend .flexCenter;
        .mobilePopupOurOnce_left {
            width: 32%;
            height: 100%;
            @extend .flexCenter;
            img {
                width: 80px;
                height: 80px;
            }
        }
        .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;
                // color: #fff;
            }
            .mobilePopupOurOnce_r_down {
                height: 50%;
                width: 100%;
                padding-left: 1em;
                display: flex !important;
                align-items: center !important;
                .mobilePopupOurOnce_r_d_in {
                    // color: #fff;
                    font-size: 17px;
                }
            }
        }
      }
    }
    .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;
        // color: #fff;
      }
      .mobilePopupOurOnce_r_down {
        height: 50%;
        width: 100%;
        padding-left: 1em;
        display: flex !important;
        align-items: center !important;
        .mobilePopupOurOnce_r_d_in {
          // color: #fff;
          font-size: 17px;
        }
      }
    }
  }
}
</style>

 src/components/mobileWindow/index.vue

@@ -101,7 +101,7 @@
      "query",
      "MobileWindowChangeData",
      "audioState",
      "areaLayerSelect",
      // "areaLayerSelect",
    ]),
  },
  watch: {
@@ -351,9 +351,9 @@
      if (!this.MobileWindowsHide) {
        let that = this;
        this.$store.dispatch("closeMobileWindowsDom"); //关闭随地图弹窗
        if (that.areaLayerSelect.overlay != undefined) {
          that.areaLayerSelect.overlay.setStyle({
            material: that.areaLayerSelect.color,
        if (window.select.overlay != undefined) {
          window.select.overlay.setStyle({
            material: window.select.color,
            outline: false,
          });


 src/components/mobilemap/index.vue

@@ -1,1135 +1,1127 @@
/* eslint-disable camelcase */
<template>
    <div id="mobile-viewer-container">
        <!-- 随地图改变图标弹窗↓ -->
        <div id="mobile-map_popup_content"></div>
        <mobileWindow></mobileWindow>
        <!-- 地图固定弹窗 -->
        <mobileWindowFixed></mobileWindowFixed>
        <!-- 地图图标弹窗↑ -->
        <!-- 控制↓ -->
        <mobileLeftNav ref="mobileLeftNav"></mobileLeftNav>
        <mobileCortrol ref="mobileCortrol"></mobileCortrol>
        <mobileCortrolButtom ref="mobileCortrolButtom"></mobileCortrolButtom>
        <mobileCortrolSearch ref="mobileCortrolSearch"></mobileCortrolSearch>
        <!-- 控制↑ -->
        <!-- 控制大弹窗的弹窗 -->
        <!-- v-if="mBigPopupAfter" -->
        <mobilePopupOurAfter></mobilePopupOurAfter>
        <!-- 大弹窗 -->
        <mobilePopupOur :style="[bigPopup]" v-if="mBigPopup"></mobilePopupOur>
        <!-- 测试-跳转位置 -->
        <mobileGoTo></mobileGoTo>
        <!-- 实景窗口 -->
        <mobilePanorama></mobilePanorama>
        <!-- 退出导航 -->
        <mobileCloseRouter></mobileCloseRouter>
        <!-- 退出活动 -->
        <mobileCloseRouterMany></mobileCloseRouterMany>
        <!-- 活动窗口 -->
        <mobileActivity></mobileActivity>
        <!-- 盖住左下角 -->
        <div class="cover_mobileMap">智慧校区</div>
        <!-- 指示器 -->
        <!-- <div class="heights">{{ heights }}---{{ heights1 }}</div> -->
    </div>
  <div id="mobile-viewer-container">
    <!-- 随地图改变图标弹窗↓ -->
    <div id="mobile-map_popup_content"></div>
    <mobileWindow></mobileWindow>
    <!-- 地图固定弹窗 -->
    <!-- <mobileWindowFixed></mobileWindowFixed> -->
    <!-- 地图图标弹窗↑ -->
    <!-- 控制↓ -->
    <mobileLeftNav ref="mobileLeftNav"></mobileLeftNav>
    <mobileCortrol ref="mobileCortrol"></mobileCortrol>
    <mobileCortrolButtom ref="mobileCortrolButtom"></mobileCortrolButtom>
    <mobileCortrolSearch ref="mobileCortrolSearch"></mobileCortrolSearch>
    <!-- 控制↑ -->
    <!-- 控制大弹窗的弹窗 -->
    <!-- v-if="mBigPopupAfter" -->
    <mobilePopupOurAfter></mobilePopupOurAfter>
    <!-- 大弹窗 -->
    <mobilePopupOur :style="[bigPopup]" v-if="mBigPopup"></mobilePopupOur>
    <!-- 测试-跳转位置 -->
    <!-- <mobileGoTo></mobileGoTo> -->
    <!-- 实景窗口 -->
    <mobilePanorama></mobilePanorama>
    <!-- 退出导航 -->
    <mobileCloseRouter></mobileCloseRouter>
    <!-- 退出活动 -->
    <mobileCloseRouterMany></mobileCloseRouterMany>
    <!-- 活动窗口 -->
    <mobileActivity></mobileActivity>
    <!-- 盖住左下角 -->
    <div class="cover_mobileMap">智慧校区</div>
    <!-- 指示器 -->
    <!-- <div class="heights">{{ heights }}---{{ heights1 }}</div> -->
  </div>
</template>
<script>
import axios from 'axios'
import { getBuildClock } from '@/api/mobile/buildsClock/buildsClock' // 楼栋详情
import { mapGetters } from 'vuex'
import axios from "axios";
import { getBuildClock } from "@/api/mobile/buildsClock/buildsClock"; // 楼栋详情
import { mapGetters } from "vuex";

//baselayer
window.baselayer = null;
window.conBack = null;
window.butbut = null;
window.butSetViews = null;
window.setViews = null;
window.tilesetLayer = null;
window.tileset = null;
window.silhouetteBlue = null;
window.highlighted = null;
window.selected = null;
window.usetowpointfive = null;
window.provider = null;
window.newLayer = null;
window.layerGroup = null;
window.areaLayer = null;
window.polygon = null;
window.doit2 = null;
window.wallLayer = null;
window.initViewer = null; //主方法

window.takes = null;
window.height1s = null;
window.height2s = null;
window.height3s = null;
window.height4s = null;

export default {
    name: 'mobilemapBox',
    data () {
        return {
            butbut: null,
            heights: 0,
            heights1: 0,
            bigPopup: {
                width: 0,
                height: 0
            },
            // transition: "all 3s",
            wallArr: [
                [116.41526036, 27.95352217, 100],
                [116.41128018, 27.95789328, 100],
                [116.40246486, 27.9639711, 100],
                [116.39728537, 27.96779573, 100],
                [116.39588026, 27.96862679, 100],
                [116.38903705, 27.97029865, 100],
                [116.38872398, 27.97051829, 100],
                [116.38892229, 27.9709012, 100],
                [116.38906721, 27.97190632, 100],
                [116.38706808, 27.97195638, 100],
                [116.38649076, 27.97114448, 100],
                [116.3821407, 27.97312735, 100],
                [116.37876213, 27.97582549, 100],
                [116.3785131, 27.97664153, 100],
                [116.37634915, 27.98039526, 100],
                [116.3743922, 27.98131916, 100],
                [116.36995935, 27.97936074, 100],
                [116.37217247, 27.97498147, 100],
                [116.35099819, 27.97539586, 100],
                [116.35103749, 27.9808805, 100],
                [116.3397246, 27.97987911, 100],
                [116.33950071, 27.97372028, 100],
                [116.32313266, 27.97004136, 100],
                [116.32606743, 27.95863979, 100],
                [116.34788837, 27.92538024, 100],
                [116.3456631, 27.92338627, 100],
                [116.3487449, 27.91718915, 100],
                [116.35311999, 27.91804451, 100],
                [116.35109257, 27.92284807, 100],
                [116.35975153, 27.92900526, 100],
                [116.35660704, 27.93816236, 100],
                [116.39585177, 27.93945304, 100],
                [116.41526036, 27.95352217, 100]
            ],
            areaLayer: null,
            mapCenter: [115.871863, 28.743861, 160.0],
            //   mapCenter: [114.04062292 - 0.00035, 27.62666834 + 0.0025, 160.0],
            // 控制4层缩放
            onelayerNum: 80,
            towlayerNum: 120,
            threelayerNum: 160,
            forlayerNum: null,
            intervallayerNum: 20,
            frislayertHeight: 120 // 默认高度
            // onelayerNum: 80,
            // towlayerNum: 200,
            // threelayerNum: 320,
            // forlayerNum: 440,
            // intervallayerNum: 60,
            // frislayertHeight: 320, //默认高度
        }
  name: "mobilemapBox",
  data() {
    return {
      // butbut: null,
      heights: 0,
      heights1: 0,
      bigPopup: {
        width: 0,
        height: 0,
      },
      // transition: "all 3s",
      wallArr: [
        [116.41526036, 27.95352217, 100],
        [116.41128018, 27.95789328, 100],
        [116.40246486, 27.9639711, 100],
        [116.39728537, 27.96779573, 100],
        [116.39588026, 27.96862679, 100],
        [116.38903705, 27.97029865, 100],
        [116.38872398, 27.97051829, 100],
        [116.38892229, 27.9709012, 100],
        [116.38906721, 27.97190632, 100],
        [116.38706808, 27.97195638, 100],
        [116.38649076, 27.97114448, 100],
        [116.3821407, 27.97312735, 100],
        [116.37876213, 27.97582549, 100],
        [116.3785131, 27.97664153, 100],
        [116.37634915, 27.98039526, 100],
        [116.3743922, 27.98131916, 100],
        [116.36995935, 27.97936074, 100],
        [116.37217247, 27.97498147, 100],
        [116.35099819, 27.97539586, 100],
        [116.35103749, 27.9808805, 100],
        [116.3397246, 27.97987911, 100],
        [116.33950071, 27.97372028, 100],
        [116.32313266, 27.97004136, 100],
        [116.32606743, 27.95863979, 100],
        [116.34788837, 27.92538024, 100],
        [116.3456631, 27.92338627, 100],
        [116.3487449, 27.91718915, 100],
        [116.35311999, 27.91804451, 100],
        [116.35109257, 27.92284807, 100],
        [116.35975153, 27.92900526, 100],
        [116.35660704, 27.93816236, 100],
        [116.39585177, 27.93945304, 100],
        [116.41526036, 27.95352217, 100],
      ],
      // areaLayer: null,
      // mapCenter: [115.871863, 28.743861, 160.0],
      mapCenter: [114.04062292 - 0.00035, 27.62666834 + 0.0025, 160.0],
      // 控制4层缩放
      // onelayerNum: 80,
      // towlayerNum: 120,
      // threelayerNum: 160,
      // forlayerNum: null,
      // intervallayerNum: 20,
      // frislayertHeight: 120, // 默认高度
      onelayerNum: 110,
      towlayerNum: 140,
      threelayerNum: 170,
      forlayerNum: 200,
      intervallayerNum: 15,
      frislayertHeight: 200, //默认高度
    };
  },
  computed: {
    ...mapGetters([
      // "mviewer",
      // "MobileWindowsHide",
      "mBigPopup",
      // "mBigPopupAfter",
      "iconHide",
      // "popupsDom",
      "dimension",
      "dimensionData",
      // "areaLayer", // 绿布
      // "areaLayerSelect", // 绿布颜色控制
      "urlParameterData", // url 参数
    ]),
  },
  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";
      }
    },
    computed: {
        ...mapGetters([
            'mviewer',
            'MobileWindowsHide',
            'mBigPopup',
            'mBigPopupAfter',
            'iconHide',
            'popupsDom',
            'MobileWindowsHideFixed',
            'dimension',
            'dimensionData',
            'areaLayer', // 绿布
            'areaLayerSelect', // 绿布颜色控制
            'urlParameterData' // url 参数
        ])
    },
    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 () {
        // return;
        var that = this
  },
  mounted() {
    // return;
    var that = this;

        let viewer
    // let viewer;

        function distanceSurface () {
            viewer.measure.distanceSurface()
        }

        function calcArea () {
            viewer.measure.area()
        }

        function areaSurface () {
            viewer.measure.areaSurface()
        }

        function calcAngle () {
            viewer.measure.angle()
        }

        function calcModelAngle () {
            viewer.measure.angle({
                clampToModel: true
            })
        }

        function calcHeight () {
            viewer.measure.height()
        }

        function calcModelHeight () {
            viewer.measure.height({
                clampToModel: true
            })
        }

        function calcHeading () {
            viewer.measure.heading()
        }

        function areaHeight () {
            viewer.measure.areaHeight()
        }

        function calcTriangleHeight () {
            viewer.measure.triangleHeight()
        }

        function calcModelTriangleHeight () {
            viewer.measure.triangleHeight({
                clampToModel: true
            })
        }

        function deactivate () {
            viewer.measure.deactivate()
        }

        function gotoModel () {
            viewer.flyTo(tileset)
        }

        function initViewer () {
            viewer = new global.DC.Viewer('mobile-viewer-container', {
                contextOptions: {
                    webgl: {
                        stencil: true,
                        preserveDrawingBuffer: true
                    }
                }
            })
            that.$refs.mobileLeftNav.initialize(viewer)
            that.$store.commit('MSET_VIEWER', viewer)
            // window.mviewer = viewer;
            // that.$store.commit("MSET_DC", DC);
            const popup = viewer.popup

            popup.hide()

            // const baselayer = DC.ImageryLayerFactory.createArcGisImageryLayer({
            //   url: "http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer",
            // });
            const baselayer = global.DC.ImageryLayerFactory.createImageryLayer(
                global.DC.ImageryType.XYZ,
                {
                    // url: 'https://webmap-tile.sf-express.com/MapTileService/rt?x={col}&y={row}&z={level}'

                    url: 'https://webmap-tile.sf-express.com/MapTileService/rt?fetchtype=static&x={x}&y={y}&z={z}&project=sfmap&pic_size=256&pic_type=png8&data_name=361100&data_format=merged-dat&data_type=normal' // 行政区划
                }
            )
            // viewer.addBaseLayer(baselayer, {
            //   iconUrl: "examples/images/icon/img.png",
            //   name: "影像",
            // });
            // eslint-disable-next-line camelcase
            // const baselayer_shaded = DC.ImageryLayerFactory.createArcGisImageryLayer({
            //   url: "http://services.arcgisonline.com/arcgis/rest/services/World_Shaded_Relief/MapServer",
            // });
            // viewer.addBaseLayer(baselayer_shaded, {
            //   iconUrl: "examples/images/icon/elec.png",
            //   name: "电子",
            // });

            // // eslint-disable-next-line camelcase
            // const baselayer_street = DC.ImageryLayerFactory.createArcGisImageryLayer({
            //   url: "http://services.arcgisonline.com/arcgis/rest/services/World_Physical_Map/MapServer",
            // });
            // viewer.addBaseLayer(baselayer_street, {
            //   iconUrl: "examples/images/icon/ter.png",
            //   name: "地形",
            // });

            // // eslint-disable-next-line camelcase
            // const baselayer_ter = DC.ImageryLayerFactory.createArcGisImageryLayer({
            //   url: "http://services.arcgisonline.com/arcgis/rest/services/World_Terrain_Base/MapServer",
            // });
            // viewer.addBaseLayer(baselayer_ter, {
            //   iconUrl: "examples/images/icon/ter.png",
            //   name: "地形",
            // });

            // 地图移动事件
            viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => {
                if (!that.iconHide) {
                    that.$store.commit('MSET_ICONHIDE', true)
                }
                if (!that.MobileWindowsHide) {
                    // that.$store.dispatch("closeMobileWindowsDom"); //关闭随地图弹窗
                }
                // let height = Math.ceil(viewer.camera.positionCartographic.height);
                // console.log(height);
            })

            // viewer.on(global.DC.SceneEventType.CAMERA_MOVE_END, (e) => {
            viewer.on(global.DC.SceneEventType.CAMERA_CHANGED, (e) => {
                // 相机移动最后参数
                // 控制高度
                const isSet = that.dimension != '3D'
                const height = Math.ceil(viewer.camera.positionCartographic.height)
                const conBack = (height) => {
                    viewer.camera.setView({
                        destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                            viewer.camera.positionCartographic.longitude,
                            viewer.camera.positionCartographic.latitude,
                            height
                        ),
                        orientation: {
                            heading: global.DC.Namespace.Cesium.Math.toRadians(
                                that.dimensionData.heading
                            ), // 方向
                            pitch: global.DC.Namespace.Cesium.Math.toRadians(
                                that.dimensionData.pitch
                            ), // 倾斜角度
                            roll: that.dimensionData.roll
                        }
                    })
                }
                // if (height < 300) {
                //   conBack(300);
                // }
                // if (height > 2000) {
                //   conBack(2000);
                // }
                // if (height <= 79 && isSet) {
                //   conBack(79);
                // }
                if (height <= that.onelayerNum - 1 && isSet) {
                    conBack(that.onelayerNum - 1)
                }
                // if (height > 220 && height <= 280 && isSet) {
                //   conBack(280);
                // }
                // if (height > 280 && height <= 340 && isSet) {
                //   conBack(340);
                // }
                // if (height > 340 && height <= 400 && isSet) {
                //   conBack(400);
                // }
                // if (height > 200 && isSet) {
                //   conBack(200);
                // }
                const usMun = that.forlayerNum ? that.forlayerNum : that.threelayerNum
                if (height > usMun && isSet) {
                    conBack(usMun)
                }
            })

            // 按钮事件
            const butSetViews = (num) => {
                viewer.camera.flyTo({
                    destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                        viewer.camera.positionCartographic.longitude,
                        viewer.camera.positionCartographic.latitude,
                        num
                    ),
                    orientation: {
                        // 指向
                        heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                        // 视角
                        pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                        roll: 0.0
                    },
                    duration: 0.5 // 定位的时间间隔
                })
                // overii();
            }
            that.butbut = function () {
                // 放大
                document.querySelector('.dc-zoom-controller').children[0].onclick =
                    function () {
                        if (that.dimension == '2.5D') {
                            const height = Math.ceil(
                                viewer.camera.positionCartographic.height
                            )
                            // if (height > 180) {
                            //   butSetViews(160);
                            //   return;
                            // }

                            // if (height > 140) {
                            //   butSetViews(120);
                            //   return;
                            // }

                            // if (height > 100) {
                            //   butSetViews(80);
                            // }
                            if (that.forlayerNum) {
                                if (height > that.forlayerNum - that.intervallayerNum) {
                                    butSetViews(that.threelayerNum)
                                    return
                                }
                            }

                            if (height > that.threelayerNum - that.intervallayerNum) {
                                butSetViews(that.towlayerNum)
                                return
                            }

                            if (height > that.towlayerNum - that.intervallayerNum) {
                                butSetViews(that.onelayerNum)
                            }
                        }
                    }
                // 缩小
                document.querySelector('.dc-zoom-controller').children[2].onclick =
                    function () {
                        if (that.dimension == '2.5D') {
                            const height = Math.ceil(
                                viewer.camera.positionCartographic.height
                            )
                            console.log(height)

                            // if (height <= 100) {
                            //   butSetViews(120);
                            // }

                            // if (height > 100 && height <= 140) {
                            //   butSetViews(160);
                            // }

                            // if (height > 140 && height < 180) {
                            //   butSetViews(200);
                            // }

                            if (height <= that.towlayerNum - that.intervallayerNum) {
                                butSetViews(that.towlayerNum)
                            }

                            if (
                                height > that.towlayerNum - that.intervallayerNum &&
                                height <= that.threelayerNum - that.intervallayerNum
                            ) {
                                butSetViews(that.threelayerNum)
                            }

                            if (that.forlayerNum) {
                                if (
                                    height > that.threelayerNum - that.intervallayerNum &&
                                    height < that.forlayerNum - that.intervallayerNum
                                ) {
                                    butSetViews(that.forlayerNum)
                                }
                            }
                        }
                    }
                // 滚轮事件
                // 指示器
                var ii = 1
                var startHeight = 0
                var cutHeight = 0
                var overii = function () {
                    ii = 1
                    startHeight = 0
                    cutHeight = 0
                }
                var setViews = (num) => {
                    viewer.camera.flyTo({
                        destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                            viewer.camera.positionCartographic.longitude,
                            viewer.camera.positionCartographic.latitude,
                            num
                        ),
                        orientation: {
                            // 指向
                            heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                            // 视角
                            pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                            roll: 0.0
                        },
                        duration: 0.5 // 定位的时间间隔
                    })
                    overii()
                }
                var isCameraTime = null
                viewer.on(global.DC.SceneEventType.CAMERA_CHANGED, (e) => {
                    if (that.dimension == '2.5D') {
                        // console.log(e);
                        const height = Math.ceil(viewer.camera.positionCartographic.height)
                        if (ii == 1 && startHeight == 0) {
                            startHeight = height
                        }
                        ii++
                        cutHeight = height - startHeight
                        // console.log(cutHeight);
                        that.heights = height
                        that.heights1 = cutHeight
                        // return;
                        if (isCameraTime) {
                            clearTimeout(isCameraTime)
                            isCameraTime = setTimeout(() => {
                                takes()
                                isCameraTime = null
                            }, 200)
                        } else {
                            isCameraTime = setTimeout(() => {
                                takes()
                                isCameraTime = null
                            }, 200)
                        }
                        const takes = () => {
                            if (ii != 1) {
                                if (cutHeight >= 0) {
                                    if (cutHeight > 2) {
                                        // if (height >= 83 && height < 120) {
                                        //   setViews(120);
                                        // }
                                        // if (height >= 123 && height < 160) {
                                        //   setViews(160);
                                        // }
                                        // if (height >= 163 && height < 200) {
                                        //   setViews(200);
                                        // }
                                        if (
                                            height >= that.onelayerNum + 2 &&
                                            height < that.towlayerNum
                                        ) {
                                            setViews(that.towlayerNum)
                                        }
                                        if (
                                            height >= that.towlayerNum + 2 &&
                                            height < that.threelayerNum
                                        ) {
                                            setViews(that.threelayerNum)
                                        }
                                        if (that.forlayerNum) {
                                            if (
                                                height >= that.threelayerNum + 2 &&
                                                height < that.forlayerNum
                                            ) {
                                                setViews(that.forlayerNum)
                                            }
                                        }
                                    }
                                    // 放大
                                } else {
                                    // 缩小
                                    // if (cutHeight < -3) {
                                    //   if (height <= 200 && height > 157) {
                                    //     setViews(160);
                                    //   }
                                    //   if (height <= 157 && height > 117) {
                                    //     setViews(120);
                                    //   }
                                    //   if (height <= 117 && height > 80) {
                                    //     setViews(80);
                                    //   }
                                    if (cutHeight < -2) {
                                        if (that.forlayerNum) {
                                            if (
                                                height <= that.forlayerNum &&
                                                height > that.threelayerNum - 2
                                            ) {
                                                setViews(that.threelayerNum)
                                            }
                                        }
                                        if (
                                            height <= that.threelayerNum - 2 &&
                                            height > that.towlayerNum - 2
                                        ) {
                                            setViews(that.towlayerNum)
                                        }
                                        if (
                                            height <= that.towlayerNum - 2 &&
                                            height > that.onelayerNum
                                        ) {
                                            setViews(that.onelayerNum)
                                        }
                                    }
                                }
                            }
                        }
                    }
                })
            }

            // 地图点击事件
            // viewer.on(DC.MouseEventType.CLICK, (e) => {
            //   // console.log(e);
            //   // 定制化窗体
            //   that.openPopupS(
            //     e.position,
            //     [e.wgs84SurfacePosition.lng, e.wgs84SurfacePosition.lat],
            //     {
            //       name: "地图点击",
            //       address: [e.wgs84SurfacePosition.lng, e.wgs84SurfacePosition.lat],
            //       introduce: [e.windowPosition.x, e.windowPosition.y],
            //       from: "地图点击",
            //     }
            //   );
            // });

            // 白模型↓
            // const layer = new DC.TilesetLayer("layer");
            // viewer.addLayer(layer);
            // const tileset = new DC.Tileset(
            //   "http://resource.dvgis.cn/data/3dtiles/ljz/tileset.json"
            // );
            // const style = new DC.TilesetStyle();
            // style.color = {
            //   conditions: [
            //     ["${Height} >= 300", "rgba(45, 0, 75, 0.5)"],
            //     ["${Height} >= 200", "rgb(102, 71, 151)"],
            //     ["${Height} >= 100", "rgb(170, 162, 204)"],
            //     ["${Height} >= 50", "rgb(224, 226, 238)"],
            //     ["${Height} >= 25", "rgb(252, 230, 200)"],
            //     ["${Height} >= 10", "rgb(248, 176, 87)"],
            //     ["${Height} >= 5", "rgb(198, 106, 11)"],
            //     ["true", "rgb(127, 59, 8)"],
            //   ],
            // };

            // viewer.use(new DC.Measure());

            // tileset.setStyle(style);
            // layer.addOverlay(tileset);
            // viewer.flyTo(tileset);
            // 白模型↑

            // 精细模型↓
            const tilesetLayer = new global.DC.TilesetLayer('tilesetLayer')
            viewer.addLayer(tilesetLayer)
            const tileset = new global.DC.Tileset('/mx/tileset.json', {
                luminanceAtZenith: 0.5
            })

            // tilesetLayer.addOverlay(tileset);
            // tilesetLayer.show = false;

            const silhouetteBlue =
                global.DC.Namespace.Cesium.PostProcessStageLibrary.createEdgeDetectionStage()
            silhouetteBlue.uniforms.color =
                global.DC.Namespace.Cesium.Color.fromBytes(9, 162, 40)
            silhouetteBlue.uniforms.length = 0.01
            silhouetteBlue.selected = []

            viewer.scene.postProcessStages.add(
                global.DC.Namespace.Cesium.PostProcessStageLibrary.createSilhouetteStage(
                    [silhouetteBlue]
                )
            )

            var highlighted = {
                feature: undefined,
                originalColor: new global.DC.Namespace.Cesium.Color()
            }

            var selected = {
                feature: undefined,
                originalColor: new global.DC.Namespace.Cesium.Color()
            }
            // 点击事件
            tileset.on(global.DC.MouseEventType.CLICK, (e) => {
                viewer.scene.globe.depthTestAgainstTerrain = false
                // console.log(e);

                viewer.flyToPosition(
                    new global.DC.Position(115.87186406, 28.74449337, 1800, 0, 45, 0)
                )

                // 定制化窗体
                that.openPopupS(
                    e.position,
                    [e.wgs84Position.lng, e.wgs84Position.lat],
                    {
                        name: e.overlay.attr.name,
                        address: e.layer._id,
                        introduce: e.overlay.attr.id,
                        data: e
                    }
                )
                // 高亮
                silhouetteBlue.selected = []

                if (global.DC.Namespace.Cesium.defined(highlighted.feature)) {
                    highlighted.feature.color = highlighted.originalColor
                    highlighted.feature = undefined
                }

                if (e.feature !== selected.feature) {
                    silhouetteBlue.selected = [e.feature]

                    highlighted.feature = e.feature

                    global.DC.Namespace.Cesium.Color.clone(
                        e.feature.color,
                        highlighted.originalColor
                    )
                    e.feature.color = global.DC.Namespace.Cesium.Color.fromBytes(
                        155,
                        255,
                        175
                    )
                }
            })
            // 移动事件
            // tileset.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => {
            //   silhouetteBlue.selected = [];

            //   if (global.DC.Namespace.Cesium.defined(highlighted.feature)) {
            //     highlighted.feature.color = highlighted.originalColor;
            //     highlighted.feature = undefined;
            //   }

            //   if (e.feature !== selected.feature) {
            //     silhouetteBlue.selected = [e.feature];

            //     highlighted.feature = e.feature;

            //     global.DC.Namespace.Cesium.Color.clone(
            //       e.feature.color,
            //       highlighted.originalColor
            //     );
            //     e.feature.color = global.DC.Namespace.Cesium.Color.fromBytes(
            //       155,
            //       255,
            //       175
            //     );
            //   }
            // });
            // tilesetLayer["changesilhouetteBlue"] = () => {
            //   silhouetteBlue.selected = [];
            // };
            // tilesetLayer.show = false;
            // 精细模型↑

            // 2.5D贴图↓
            const usetowpointfive = () => {
                var provider =
                    // new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                    //   url: "http://www.tdtfz.com/OneMapServer/rest/services/fzsw2019/MapServer/WMTS/tile/1.0.0/fzsw2019/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}",
                    //   layer: "fzsw2019",
                    //   style: "default",
                    //   tileMatrixSetID: "default028mm",
                    //   format: "image/jpgpng",
                    //   tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(),
                    //   maximumLevel: 19,
                    //   tileMatrixLabels: [
                    //     "0",
                    //     "1",
                    //     "2",
                    //     "3",
                    //     "4",
                    //     "5",
                    //     "6",
                    //     "7",
                    //     "8",
                    //     "9",
                    //     "10",
                    //     "11",
                    //     "12",
                    //     "13",
                    //     "14",
                    //     "15",
                    //     "16",
                    //     "17",
                    //     "18",
                    //     "19",
                    //   ],
                    // });
                    // new global.DC.Namespace.Cesium.ArcGisMapServerImageryProvider({
                    //   url: "http://arcgis.jxpskj.com:6080/arcgis/rest/services/PingXiang25DMapDN/MapServer",
                    // });
                    new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                        url: '/wp/{z}/{x}/{y}.png',
                        fileExtension: 'png'
                    })
                return viewer.imageryLayers.addImageryProvider(provider)
            }

            const newLayer = usetowpointfive()
            // 2.5d贴图事件
            const layerGroup = new global.DC.LayerGroup('modelBox')
            viewer.addLayerGroup(layerGroup)

            const areaLayer = new global.DC.VectorLayer('areaLayer')
            layerGroup.addLayer(areaLayer)
            axios
                .get(
                    'http://arcgis.jxpskj.com:6080/arcgis/rest/services/lxxqwxq/MapServer/0/query?where=1%3D1&text=&objectIds=&time=&geometry=&geometryType=esriGeometryEnvelope&inSR=&spatialRel=esriSpatialRelIntersects&relationParam=&outFields=*&returnGeometry=true&maxAllowableOffset=&geometryPrecision=&outSR=&returnIdsOnly=false&returnCountOnly=false&orderByFields=&groupByFieldsForStatistics=&outStatistics=&returnZ=false&returnM=false&gdbVersion=&returnDistinctValues=false&returnTrueCurves=false&resultOffset=&resultRecordCount=&f=pjson'
                )
                .then((resultData) => {
                    resultData.data.features.forEach((item) => {
                        item.geometry.rings[0].forEach((it) => {
                            it = it.join(',')
                        })

                        item.geometry.rings[0] = item.geometry.rings[0].join(';')

                        const polygon = new global.DC.Polygon(item.geometry.rings[0])
                        polygon.attr = item.attributes

                        polygon.setStyle({
                            material: global.DC.Namespace.Cesium.Color.fromBytes(
                                255,
                                255,
                                255,
                                1
                            )
                        })

                        areaLayer.addOverlay(polygon)
                    })

                    areaLayer.show = true
                })
            that.$store.commit('MSET_areaLayer', areaLayer)
            // var select = {
            //   overlay: undefined,
            //   color: undefined,
            // };
            viewer.on(global.DC.MouseEventType.CLICK, (e) => {
                // console.log(e);
                if (e.overlay != undefined && e.layer.id == 'areaLayer') {
                    if (that.areaLayerSelect.overlay != undefined) {
                        if (e.overlay != that.areaLayerSelect.overlay) {
                            that.areaLayerSelect.overlay.setStyle({
                                material: that.areaLayerSelect.color,
                                outline: false
                            })

                            that.$store.commit('mset_changeSelect', [undefined, undefined])
                        }
                    }

                    if (that.areaLayerSelect.overlay == undefined) {
                        that.areaLayerSelect.overlay = e.overlay

                        that.areaLayerSelect.color = e.overlay._style.material
                        that.areaLayerSelect.overlay.setStyle({
                            outline: true,
                            outlineColor: global.DC.Namespace.Cesium.Color.fromBytes(
                                3,
                                255,
                                13,
                                255
                            ), // 边框颜色
                            outlineWidth: 10, // 边框大小，
                            height: 0.01,
                            material: global.DC.Namespace.Cesium.Color.fromBytes(
                                108,
                                245,
                                113,
                                158
                            )
                        })
                    }

                    // 如果是地图点击建筑，调用接口查详情
                    const ids =
                        e.overlay.attr['楼栋号'] == '8栋'
                            ? '9栋'
                            : e.overlay.attr['楼栋号'] == '9栋'
                                ? '8栋'
                                : e.overlay.attr['楼栋号']
                    const eIntlat = [
                        e.wgs84SurfacePosition.lng,
                        e.wgs84SurfacePosition.lat
                    ]
                    getBuildClock({
                        mechanismname: '香琴湾' + ids
                    }).then((res) => {
                        const item = res.data.data
                        // data.query.bgImg = ds.mechanismname;
                        // data.query.name = ds.tpurl;
                        // data.query.panoramaurl = ds.panoramaurl;
                        // data.query.bgImg = ds.tpurl;
                        // data.query.bgImg = ds.tpurl;
                        const useData = {
                            name: item.mechanismname,
                            lntLat: eIntlat,
                            alt: item.gd,
                            heading: item.heading,
                            pitch: item.pitch,
                            roll: item.roll,
                            bgImg: item.tpurl,
                            QRImg: item.codeurl,
                            websiteUrl: item.websiteurl,
                            telePhone: item.telephone,
                            address: item.address,
                            introduce: item.introduce,
                            video: item.videourl,
                            buts: ['定位', '实景', '图集'],
                            panoramaurl: item.panoramaurl, // 全景
                            fromTo: 'mapClick'
                        }
                        // 定制化窗体
                        // console.log(item, useData, "111111");
                        // return;
                        that.openPopupS({}, eIntlat, useData)
                    })
                } else {
                    if (that.areaLayerSelect.overlay != undefined) {
                        that.areaLayerSelect.overlay.setStyle({
                            material: that.areaLayerSelect.color,
                            outline: false
                        })

                        that.$store.commit('mset_changeSelect', [undefined, undefined])
                    }
                }
            })

            // 2.5D贴图↑
            let startPoint
            if (true) {
                startPoint = () => {
                    const doit2 = (int, h) => {
                        viewer.camera.setView({
                            // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                            // fromDegrees()方法，将经纬度和高程转换为世界坐标
                            destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                                // 114.0351,
                                // 27.6314,
                                // 200.0
                                int[0],
                                int[1],
                                int[2]
                            ),
                            orientation: {
                                // 指向
                                heading: global.DC.Namespace.Cesium.Math.toRadians(h[0]),
                                // 视角
                                pitch: global.DC.Namespace.Cesium.Math.toRadians(h[1]),
                                roll: h[2]
                            }
                        })
                    }
                    that.dimension == '2.5D'
                        ? doit2(
                            [that.mapCenter[0], that.mapCenter[1], that.frislayertHeight],
                            // [114.04062292, 27.62666834, 220.0],
                            [
                                that.dimensionData.heading,
                                that.dimensionData.pitch,
                                that.dimensionData.roll
                            ]
                        )
                        : doit2([114.0351, 27.6314, 300.0], [108, -26.46, 0.0])
                    // : doit([116.39038494750986, 39.902393222208644, 330.0]);
                    // doit("建模");
                }
            } else {
                // startPoint(1);
            }
            // 传递默认位置
            that.$store.commit('MSET_MORENWEIZHI', startPoint)
            // let position = Cesium.Cartesian3.fromDegrees(108, 25, 0); //中心点位置
            // let cameraLimit = new xt3d.CameraDominate.CameraLimit(
            //   viewer,
            //   position,
            //   {
            //     radius: 2000,
            //     debugExtent: true,
            //   }
            // );

            // const currentViewRect = viewer.camera.computeViewRectangle();//东南西北数据
            // console.log(currentViewRect, 78);

            // 瀑布流↓
            const wallLayer = new global.DC.VectorLayer('wallLayer')
            // viewer.addLayer(wallLayer);
            // var arr = that.wallArr;
            // arr.forEach((item) => {
            //   item = item.join(",");
            // });
            // arr = arr.join(";");
            // const wall = new global.DC.Wall(arr);
            // wall.setStyle({
            //   material: new global.DC.WallTrailMaterialProperty({
            //     color: global.DC.Namespace.Cesium.Color.fromBytes(0, 142, 255, 150),
            //     // color: global.DC.Color.DEEPSKYBLUE,
            //     speed: 4,
            //   }),
            // });
            // wallLayer.addOverlay(wall);

            // viewer.use(new global.DC.Measure());
            // 瀑布流↑

            // 传入store
            that.$store.commit('MSET_MODEOLS', {
                tilesetLayer: tilesetLayer,
                // tileset: tileset,
                newLayer: newLayer,
                wallLayer: wallLayer,
                usetowpointfive: usetowpointfive
            })

            // 飞入起始点
            // that.$store.dispatch("mapFlyTo", {
            //   lntLat: [115.87186406, 28.74449337, 1200],
            //   heading: 0,
            //   pitch: -45,
            //   roll: 0,
            //   noOpen: true,
            // });
            // 地图渲染完成执行srore中MSET_CREADE
            // that.$store.dispatch("MSET_CREADE");

            viewer.compass.enable = false
            viewer.zoomController.enable = true
            viewer.locationBar.enable = false
            viewer.distanceLegend.enable = false
            // 判断默认维度
            // 原本默认是2.5d  改为3d默认时做出改变
            if (that.dimension == '2.5D') {
                that.$store.commit('set_frislayertHeight', that.frislayertHeight) // 送入默认弹窗高度
                that.$store.commit('set_zoomRange', [
                    that.onelayerNum,
                    that.forlayerNum ? that.forlayerNum : that.threelayerNum
                ]) // 送入移动端缩放范围
                that.$store.commit('MSET_DIMENSION', '2.5D') // 切换2.5D设置
            } else if (that.dimension == '3D') {
                // setTimeout((res) => {
                //   that.$store.dispatch("mapFlyTo", {
                //     lntLat: [111.25036579, 34.83767277, 11443175.85],
                //     heading: 0,
                //     pitch: -90,
                //     roll: 0,
                //     noOpen: true,
                //     fn: function () {
                // viewer.flyTo(tileset);
                // viewer.flyTo(provider);
                // 飞入起始点
                // that.$store.dispatch("mapFlyTo", {
                //   lntLat: [115.87186406, 28.74449337, 1200],
                //   heading: 0,
                //   pitch: -45,
                //   roll: 0,
                //   noOpen: true,
                // });

                // startPoint();
                that.$store.commit('MSET_DIMENSION', '3D') // 切换3D设置
                //     },
                //   });
                // }, 2000);
            }
            viewer.scene.screenSpaceCameraController._minimumZoomRate = 1000
            viewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000
        }

        global.DC.ready(initViewer)
        setTimeout(() => {
            that.butbut()

            // 判断是否有url参数
            // console.log(that.urlParameterData);
            if (typeof that.urlParameterData != 'string') {
                // console.log(that.urlParameterData);
                that.$store.commit('initurlParameterLayer') // 初始化自定义标签图层
                if (that.urlParameterData.methods == 'goto') {
                    // url有定位的参数
                    // alert(that.urlParameterData.jd);
                    // alert(that.urlParameterData.wd);
                    // 创建标记
                    const dsa = {
                        list: [
                            {
                                name: that.urlParameterData.name || '无标题',
                                jd: that.urlParameterData.jd,
                                wd: that.urlParameterData.wd
                            }
                        ],
                        clear: true
                    }
                    that.$store.dispatch('addurlParameterLayerIcon', dsa)
                    // that.flytos(
                    //   //飞入标记
                    //   +that.urlParameterData.jd + 0.012,
                    //   +that.urlParameterData.wd
                    // );

                    const d = {
                        position: {},
                        lntLat: [+that.urlParameterData.jd, +that.urlParameterData.wd],
                        query: {
                            introduce: '暂无内容',
                            address: '',
                            ...(that.urlParameterData || {}),
                            lntLat: [+that.urlParameterData.jd, +that.urlParameterData.wd]
                        },
                        useJWD: true // 仅使用经纬度
                    }
                    that.$store.dispatch('setMobileWindows', d)
                } else if (that.urlParameterData.methods == 'arc') {
                    const objInit = {
                        name: that.urlParameterData.mechanismname,
                        lntLat: [that.urlParameterData.jd, that.urlParameterData.wd],
                        alt: that.urlParameterData.gd,
                        heading: that.urlParameterData.heading,
                        pitch: that.urlParameterData.pitch,
                        roll: that.urlParameterData.roll,
                        bgImg: that.urlParameterData.tpurl,
                        QRImg: that.urlParameterData.codeurl,
                        websiteUrl: that.urlParameterData.websiteurl,
                        telePhone: that.urlParameterData.telephone,
                        address: that.urlParameterData.address,
                        introduce: that.urlParameterData.introduce,
                        video: that.urlParameterData.videourl,
                        panoramaurl: that.urlParameterData.panoramaurl // 全景
                    }

                    const dataInitialization = {
                        position: {},
                        lntLat: objInit.lntLat,
                        query: { ...objInit },
                        useJWD: true, // 仅使用经纬度
                        from: 'PopupOurOnce'
                    }

                    that.popupsDom = that.$store.dispatch('setMobileWindows', dataInitialization)
                }
            }
        }, 0)
    },
    methods: {
        openPopupS (position, lntLat, query) {
            const that = this
            // 定制化窗体
            const d = {
                position,
                lntLat,
                query: { introduce: position, address: lntLat, ...(query || {}) },
                useJWD: true // 仅使用经纬度
            }
            that.$store.dispatch('setMobileWindows', d)
    window.initViewer = () => {
      global.viewer = new global.DC.Viewer("mobile-viewer-container", {
        contextOptions: {
          webgl: {
            stencil: true,
            preserveDrawingBuffer: true,
          },
        },
        flytos (jd, wd) {
            const height = this.frislayertHeight
            this.$store.dispatch('mapFlyTo', {
                lntLat: [jd, wd, height], // 114.04020791, 27.62934732
                heading: 0,
                pitch: -90,
                roll: 0,
                noOpen: true
            })
      });

      // viewer = global.viewer;
      that.$refs.mobileLeftNav.initialize();
      // that.$store.commit("MSET_VIEWER", viewer);
      // window.mviewer = viewer;
      // that.$store.commit("MSET_DC", DC);
      global.viewer.popup.hide();

      // const baselayer = DC.ImageryLayerFactory.createArcGisImageryLayer({
      //   url: "http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer",
      // });
      window.baselayer = global.DC.ImageryLayerFactory.createImageryLayer(
        global.DC.ImageryType.XYZ,
        {
          // url: 'https://webmap-tile.sf-express.com/MapTileService/rt?x={col}&y={row}&z={level}'

          url: "https://webmap-tile.sf-express.com/MapTileService/rt?fetchtype=static&x={x}&y={y}&z={z}&project=sfmap&pic_size=256&pic_type=png8&data_name=361100&data_format=merged-dat&data_type=normal", // 行政区划
        }
    }
}
      );
      // global.viewer.addBaseLayer(baselayer, {
      //   iconUrl: "examples/images/icon/img.png",
      //   name: "影像",
      // });
      // eslint-disable-next-line camelcase
      // const baselayer_shaded = DC.ImageryLayerFactory.createArcGisImageryLayer({
      //   url: "http://services.arcgisonline.com/arcgis/rest/services/World_Shaded_Relief/MapServer",
      // });
      // global.viewer.addBaseLayer(baselayer_shaded, {
      //   iconUrl: "examples/images/icon/elec.png",
      //   name: "电子",
      // });

      // // eslint-disable-next-line camelcase
      // const baselayer_street = DC.ImageryLayerFactory.createArcGisImageryLayer({
      //   url: "http://services.arcgisonline.com/arcgis/rest/services/World_Physical_Map/MapServer",
      // });
      // global.viewer.addBaseLayer(baselayer_street, {
      //   iconUrl: "examples/images/icon/ter.png",
      //   name: "地形",
      // });

      // // eslint-disable-next-line camelcase
      // const baselayer_ter = DC.ImageryLayerFactory.createArcGisImageryLayer({
      //   url: "http://services.arcgisonline.com/arcgis/rest/services/World_Terrain_Base/MapServer",
      // });
      // global.viewer.addBaseLayer(baselayer_ter, {
      //   iconUrl: "examples/images/icon/ter.png",
      //   name: "地形",
      // });

      // 地图移动事件
      global.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => {
        if (!that.iconHide) {
          that.$store.commit("MSET_ICONHIDE", true);
        }
        // if (!that.MobileWindowsHide) {
        // that.$store.dispatch("closeMobileWindowsDom"); //关闭随地图弹窗
        // }
        // let height = Math.ceil(global.viewer.camera.positionCartographic.height);
        // console.log(height);
      });
      // global.viewer.on(global.DC.SceneEventType.CAMERA_MOVE_END, (e) => {
      global.viewer.on(global.DC.SceneEventType.CAMERA_CHANGED, (e) => {
        // 相机移动最后参数
        // 控制高度
        // return;
        const isSet = that.dimension != "3D";
        window.height1s = Math.ceil(
          global.viewer.camera.positionCartographic.height
        );
        window.conBack = (height) => {
          global.viewer.camera.setView({
            destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
              global.viewer.camera.positionCartographic.longitude,

              global.viewer.camera.positionCartographic.latitude,
              height
            ),
            orientation: {
              heading: global.DC.Namespace.Cesium.Math.toRadians(
                that.dimensionData.heading
              ), // 方向
              pitch: global.DC.Namespace.Cesium.Math.toRadians(
                that.dimensionData.pitch
              ), // 倾斜角度
              roll: that.dimensionData.roll,
            },
          });
        };
        // if (height < 300) {
        //   conBack(300);
        // }
        // if (height > 2000) {
        //   conBack(2000);
        // }
        // if (height <= 79 && isSet) {
        //   conBack(79);
        // }
        if (window.height1s <= that.onelayerNum - 1 && isSet) {
          window.conBack(that.onelayerNum - 1);
        }
        // if (height > 220 && height <= 280 && isSet) {
        //   conBack(280);
        // }
        // if (height > 280 && height <= 340 && isSet) {
        //   conBack(340);
        // }
        // if (height > 340 && height <= 400 && isSet) {
        //   conBack(400);
        // }
        // if (height > 200 && isSet) {
        //   conBack(200);
        // }
        const usMun = that.forlayerNum ? that.forlayerNum : that.threelayerNum;
        if (window.height1s > usMun && isSet) {
          window.conBack(usMun);
        }
      });

      // 按钮事件
      window.butSetViews = (num) => {
        global.viewer.camera.flyTo({
          destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
            global.viewer.camera.positionCartographic.longitude,
            global.viewer.camera.positionCartographic.latitude,
            num
          ),
          orientation: {
            // 指向
            heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
            // 视角
            pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
            roll: 0.0,
          },
          duration: 0.5, // 定位的时间间隔
        });
        // overii();
      };
      window.butbut = function () {
        // return;
        // 放大
        document.querySelector(".dc-zoom-controller").children[0].onclick =
          function () {
            if (that.dimension == "2.5D") {
              window.height2s = Math.ceil(
                global.viewer.camera.positionCartographic.height
              );
              // if (height > 180) {
              //   butSetViews(160);
              //   return;
              // }

              // if (height > 140) {
              //   butSetViews(120);
              //   return;
              // }

              // if (height > 100) {
              //   butSetViews(80);
              // }
              if (that.forlayerNum) {
                if (
                  window.height2s >
                  that.forlayerNum - that.intervallayerNum
                ) {
                  window.butSetViews(that.threelayerNum);
                  return;
                }
              }

              if (
                window.height2s >
                that.threelayerNum - that.intervallayerNum
              ) {
                window.butSetViews(that.towlayerNum);
                return;
              }

              if (window.height2s > that.towlayerNum - that.intervallayerNum) {
                window.butSetViews(that.onelayerNum);
              }
            }
          };

        // 缩小
        document.querySelector(".dc-zoom-controller").children[2].onclick =
          function () {
            if (that.dimension == "2.5D") {
              window.height3s = Math.ceil(
                global.viewer.camera.positionCartographic.height
              );
              console.log(window.height3s);

              // if (height <= 100) {
              //   butSetViews(120);
              // }

              // if (height > 100 && height <= 140) {
              //   butSetViews(160);
              // }

              // if (height > 140 && height < 180) {
              //   butSetViews(200);
              // }

              if (window.height3s <= that.towlayerNum - that.intervallayerNum) {
                window.butSetViews(that.towlayerNum);
              }

              if (
                window.height3s > that.towlayerNum - that.intervallayerNum &&
                window.height3s <= that.threelayerNum - that.intervallayerNum
              ) {
                window.butSetViews(that.threelayerNum);
              }

              if (that.forlayerNum) {
                if (
                  window.height3s >
                    that.threelayerNum - that.intervallayerNum &&
                  window.height3s < that.forlayerNum - that.intervallayerNum
                ) {
                  window.butSetViews(that.forlayerNum);
                }
              }
            }
          };
        // 滚轮事件
        // 指示器
        var ii = 1;
        var startHeight = 0;
        var cutHeight = 0;
        var overii = function () {
          ii = 1;
          startHeight = 0;
          cutHeight = 0;
        };
        window.setViews = (num) => {
          global.viewer.camera.flyTo({
            destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
              global.viewer.camera.positionCartographic.longitude,
              global.viewer.camera.positionCartographic.latitude,
              num
            ),
            orientation: {
              // 指向
              heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
              // 视角
              pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
              roll: 0.0,
            },
            duration: 0.5, // 定位的时间间隔
          });
          overii();
        };
        var isCameraTime = null;
        global.viewer.on(global.DC.SceneEventType.CAMERA_CHANGED, (e) => {
          if (that.dimension == "2.5D") {
            // console.log(e);
            window.height4s = Math.ceil(
              global.viewer.camera.positionCartographic.height
            );
            if (ii == 1 && startHeight == 0) {
              startHeight = window.height4s;
            }
            ii++;
            cutHeight = window.height4s - startHeight;
            // console.log(cutHeight);
            // that.heights = height;
            // that.heights1 = cutHeight;
            // return;
            if (isCameraTime) {
              clearTimeout(isCameraTime);
              isCameraTime = setTimeout(() => {
                window.takes();
                isCameraTime = null;
              }, 200);
            } else {
              isCameraTime = setTimeout(() => {
                window.takes();
                isCameraTime = null;
              }, 200);
            }
            window.takes = () => {
              if (ii != 1) {
                if (cutHeight >= 0) {
                  if (cutHeight > 2) {
                    // if (height >= 83 && height < 120) {
                    //   setViews(120);
                    // }
                    // if (height >= 123 && height < 160) {
                    //   setViews(160);
                    // }
                    // if (height >= 163 && height < 200) {
                    //   setViews(200);
                    // }
                    if (
                      window.height4s >= that.onelayerNum + 2 &&
                      window.height4s < that.towlayerNum
                    ) {
                      window.setViews(that.towlayerNum);
                    }
                    if (
                      window.height4s >= that.towlayerNum + 2 &&
                      window.height4s < that.threelayerNum
                    ) {
                      window.setViews(that.threelayerNum);
                    }
                    if (that.forlayerNum) {
                      if (
                        window.height4s >= that.threelayerNum + 2 &&
                        window.height4s < that.forlayerNum
                      ) {
                        window.setViews(that.forlayerNum);
                      }
                    }
                  }
                  // 放大
                } else {
                  // 缩小
                  // if (cutHeight < -3) {
                  //   if (height <= 200 && height > 157) {
                  //     setViews(160);
                  //   }
                  //   if (height <= 157 && height > 117) {
                  //     setViews(120);
                  //   }
                  //   if (height <= 117 && height > 80) {
                  //     setViews(80);
                  //   }
                  if (cutHeight < -2) {
                    if (that.forlayerNum) {
                      if (
                        window.height4s <= that.forlayerNum &&
                        window.height4s > that.threelayerNum - 2
                      ) {
                        window.setViews(that.threelayerNum);
                      }
                    }
                    if (
                      window.height4s <= that.threelayerNum - 2 &&
                      window.height4s > that.towlayerNum - 2
                    ) {
                      window.setViews(that.towlayerNum);
                    }
                    if (
                      window.height4s <= that.towlayerNum - 2 &&
                      window.height4s > that.onelayerNum
                    ) {
                      window.setViews(that.onelayerNum);
                    }
                  }
                }
              }
            };
          }
        });
      };

      // 地图点击事件
      // global.viewer.on(DC.MouseEventType.CLICK, (e) => {
      //   // console.log(e);
      //   // 定制化窗体
      //   that.openPopupS(
      //     e.position,
      //     [e.wgs84SurfacePosition.lng, e.wgs84SurfacePosition.lat],
      //     {
      //       name: "地图点击",
      //       address: [e.wgs84SurfacePosition.lng, e.wgs84SurfacePosition.lat],
      //       introduce: [e.windowPosition.x, e.windowPosition.y],
      //       from: "地图点击",
      //     }
      //   );
      // });

      // 白模型↓
      // const layer = new DC.TilesetLayer("layer");
      // global.viewer.addLayer(layer);
      // const tileset = new DC.Tileset(
      //   "http://resource.dvgis.cn/data/3dtiles/ljz/tileset.json"
      // );
      // const style = new DC.TilesetStyle();
      // style.color = {
      //   conditions: [
      //     ["${Height} >= 300", "rgba(45, 0, 75, 0.5)"],
      //     ["${Height} >= 200", "rgb(102, 71, 151)"],
      //     ["${Height} >= 100", "rgb(170, 162, 204)"],
      //     ["${Height} >= 50", "rgb(224, 226, 238)"],
      //     ["${Height} >= 25", "rgb(252, 230, 200)"],
      //     ["${Height} >= 10", "rgb(248, 176, 87)"],
      //     ["${Height} >= 5", "rgb(198, 106, 11)"],
      //     ["true", "rgb(127, 59, 8)"],
      //   ],
      // };

      // global.viewer.use(new DC.Measure());

      // tileset.setStyle(style);
      // layer.addOverlay(tileset);
      // global.viewer.flyTo(tileset);
      // 白模型↑

      // 精细模型↓
      window.tilesetLayer = new global.DC.TilesetLayer("tilesetLayer");
      global.viewer.addLayer(window.tilesetLayer);
      window.tileset = new global.DC.Tileset("/mx/tileset.json", {
        luminanceAtZenith: 0.5,
      });

      // window.tilesetLayer.addOverlay(window.tileset);
      // window.tilesetLayer.show = false;

      window.silhouetteBlue =
        global.DC.Namespace.Cesium.PostProcessStageLibrary.createEdgeDetectionStage();
      window.silhouetteBlue.uniforms.color =
        global.DC.Namespace.Cesium.Color.fromBytes(9, 162, 40);
      window.silhouetteBlue.uniforms.length = 0.01;
      window.silhouetteBlue.selected = [];

      global.viewer.scene.postProcessStages.add(
        global.DC.Namespace.Cesium.PostProcessStageLibrary.createSilhouetteStage(
          [window.silhouetteBlue]
        )
      );

      window.highlighted = {
        feature: undefined,
        originalColor: new global.DC.Namespace.Cesium.Color(),
      };

      window.selected = {
        feature: undefined,
        originalColor: new global.DC.Namespace.Cesium.Color(),
      };

      // 点击事件
      window.tileset.on(global.DC.MouseEventType.CLICK, (e) => {
        global.viewer.scene.globe.depthTestAgainstTerrain = false;
        // console.log(e);

        global.viewer.flyToPosition(
          new global.DC.Position(115.87186406, 28.74449337, 1800, 0, 45, 0)
        );

        // 定制化窗体
        that.openPopupS(
          e.position,
          [e.wgs84Position.lng, e.wgs84Position.lat],
          {
            name: e.overlay.attr.name,
            address: e.layer._id,
            introduce: e.overlay.attr.id,
            data: e,
          }
        );
        // 高亮
        window.silhouetteBlue.selected = [];

        if (global.DC.Namespace.Cesium.defined(window.highlighted.feature)) {
          window.highlighted.feature.color = window.highlighted.originalColor;
          window.highlighted.feature = undefined;
        }

        if (e.feature !== window.selected.feature) {
          window.silhouetteBlue.selected = [e.feature];

          window.highlighted.feature = e.feature;

          global.DC.Namespace.Cesium.Color.clone(
            e.feature.color,
            window.highlighted.originalColor
          );
          e.feature.color = global.DC.Namespace.Cesium.Color.fromBytes(
            155,
            255,
            175
          );
        }
      });

      // 移动事件
      // window.tileset.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => {
      //   window.silhouetteBlue.selected = [];

      //   if (global.DC.Namespace.Cesium.defined(window.highlighted.feature)) {
      //     window.highlighted.feature.color = window.highlighted.originalColor;
      //     window.highlighted.feature = undefined;
      //   }

      //   if (e.feature !== window.selected.feature) {
      //     window.silhouetteBlue.selected = [e.feature];

      //     window.highlighted.feature = e.feature;

      //     global.DC.Namespace.Cesium.Color.clone(
      //       e.feature.color,
      //       window.highlighted.originalColor
      //     );
      //     e.feature.color = global.DC.Namespace.Cesium.Color.fromBytes(
      //       155,
      //       255,
      //       175
      //     );
      //   }
      // });
      // window.tilesetLayer["changesilhouetteBlue"] = () => {
      //   window.silhouetteBlue.selected = [];
      // };
      // window.tilesetLayer.show = false;
      // 精细模型↑

      // 2.5D贴图↓
      window.usetowpointfive = () => {
        window.provider =
          // new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
          //   url: "http://www.tdtfz.com/OneMapServer/rest/services/fzsw2019/MapServer/WMTS/tile/1.0.0/fzsw2019/{Style}/{TileMatrixSet}/{TileMatrix}/{TileRow}/{TileCol}",
          //   layer: "fzsw2019",
          //   style: "default",
          //   tileMatrixSetID: "default028mm",
          //   format: "image/jpgpng",
          //   tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(),
          //   maximumLevel: 19,
          //   tileMatrixLabels: [
          //     "0",
          //     "1",
          //     "2",
          //     "3",
          //     "4",
          //     "5",
          //     "6",
          //     "7",
          //     "8",
          //     "9",
          //     "10",
          //     "11",
          //     "12",
          //     "13",
          //     "14",
          //     "15",
          //     "16",
          //     "17",
          //     "18",
          //     "19",
          //   ],
          // });
          // new global.DC.Namespace.Cesium.ArcGisMapServerImageryProvider({
          //   url: "http://arcgis.jxpskj.com:6080/arcgis/rest/services/PingXiang25DMapDN/MapServer",
          // });
          new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
            url: "/wp/{z}/{x}/{y}.png",
            fileExtension: "png",
          });
        return global.viewer.imageryLayers.addImageryProvider(window.provider);
      };

      window.newLayer = window.usetowpointfive();
      // 2.5d贴图事件

      window.layerGroup = new global.DC.LayerGroup("modelBox");
      global.viewer.addLayerGroup(window.layerGroup);

      window.areaLayer = new global.DC.VectorLayer("areaLayer");
      window.layerGroup.addLayer(window.areaLayer);
      axios
        .get(
          "http://arcgis.jxpskj.com:6080/arcgis/rest/services/lxxqwxq/MapServer/0/query?where=1%3D1&text=&objectIds=&time=&geometry=&geometryType=esriGeometryEnvelope&inSR=&spatialRel=esriSpatialRelIntersects&relationParam=&outFields=*&returnGeometry=true&maxAllowableOffset=&geometryPrecision=&outSR=&returnIdsOnly=false&returnCountOnly=false&orderByFields=&groupByFieldsForStatistics=&outStatistics=&returnZ=false&returnM=false&gdbVersion=&returnDistinctValues=false&returnTrueCurves=false&resultOffset=&resultRecordCount=&f=pjson"
        )
        .then((resultData) => {
          resultData.data.features.forEach((item) => {
            item.geometry.rings[0].forEach((it) => {
              it = it.join(",");
            });

            item.geometry.rings[0] = item.geometry.rings[0].join(";");

            window.polygon = new global.DC.Polygon(item.geometry.rings[0]);
            window.polygon.attr = item.attributes;

            window.polygon.setStyle({
              material: global.DC.Namespace.Cesium.Color.fromBytes(
                255,
                255,
                255,
                1
              ),
            });

            window.areaLayer.addOverlay(window.polygon);
          });

          window.areaLayer.show = true;
        });
      that.$store.commit("MSET_areaLayer", window.areaLayer);

      // var select = {
      //   overlay: undefined,
      //   color: undefined,
      // };
      global.viewer.on(global.DC.MouseEventType.CLICK, (e) => {
        // console.log(e);
        if (e.overlay != undefined && e.layer.id == "areaLayer") {
          if (window.select.overlay != undefined) {
            if (e.overlay != window.select.overlay) {
              window.select.overlay.setStyle({
                material: window.select.color,
                outline: false,
              });

              that.$store.commit("mset_changeSelect", [undefined, undefined]);
            }
          }

          if (window.select.overlay == undefined) {
            window.select.overlay = e.overlay;

            window.select.color = e.overlay._style.material;
            window.select.overlay.setStyle({
              outline: true,
              outlineColor: global.DC.Namespace.Cesium.Color.fromBytes(
                3,
                255,
                13,
                255
              ), // 边框颜色
              outlineWidth: 10, // 边框大小，
              height: 0.01,
              material: global.DC.Namespace.Cesium.Color.fromBytes(
                108,
                245,
                113,
                158
              ),
            });
          }

          // 如果是地图点击建筑，调用接口查详情
          const ids =
            e.overlay.attr["楼栋号"] == "8栋"
              ? "9栋"
              : e.overlay.attr["楼栋号"] == "9栋"
              ? "8栋"
              : e.overlay.attr["楼栋号"];
          const eIntlat = [
            e.wgs84SurfacePosition.lng,
            e.wgs84SurfacePosition.lat,
          ];
          getBuildClock({
            mechanismname: "香琴湾" + ids,
          }).then((res) => {
            const item = res.data.data;
            // data.query.bgImg = ds.mechanismname;
            // data.query.name = ds.tpurl;
            // data.query.panoramaurl = ds.panoramaurl;
            // data.query.bgImg = ds.tpurl;
            // data.query.bgImg = ds.tpurl;
            const useData = {
              name: item.mechanismname,
              lntLat: eIntlat,
              alt: item.gd,
              heading: item.heading,
              pitch: item.pitch,
              roll: item.roll,
              bgImg: item.tpurl,
              QRImg: item.codeurl,
              websiteUrl: item.websiteurl,
              telePhone: item.telephone,
              address: item.address,
              introduce: item.introduce,
              video: item.videourl,
              buts: ["定位", "实景", "图集"],
              panoramaurl: item.panoramaurl, // 全景
              fromTo: "mapClick",
            };
            // 定制化窗体
            // console.log(item, useData, "111111");
            // return;
            that.openPopupS({}, eIntlat, useData);
          });
        } else {
          if (window.select.overlay != undefined) {
            window.select.overlay.setStyle({
              material: window.select.color,
              outline: false,
            });

            that.$store.commit("mset_changeSelect", [undefined, undefined]);
          }
        }
      });

      // 2.5D贴图↑
      // let startPoint;
      if (true) {
        window.startPointFn = () => {
          window.doit2 = (int, h) => {
            global.viewer.camera.setView({
              // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
              // fromDegrees()方法，将经纬度和高程转换为世界坐标
              destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                // 114.0351,
                // 27.6314,
                // 200.0
                int[0],
                int[1],
                int[2]
              ),
              orientation: {
                // 指向
                heading: global.DC.Namespace.Cesium.Math.toRadians(h[0]),
                // 视角
                pitch: global.DC.Namespace.Cesium.Math.toRadians(h[1]),
                roll: h[2],
              },
            });
          };
          that.dimension == "2.5D"
            ? window.doit2(
                [that.mapCenter[0], that.mapCenter[1], that.frislayertHeight],
                // [114.04062292, 27.62666834, 220.0],
                [
                  that.dimensionData.heading,
                  that.dimensionData.pitch,
                  that.dimensionData.roll,
                ]
              )
            : window.doit2([114.0351, 27.6314, 300.0], [108, -26.46, 0.0]);
          // : doit([116.39038494750986, 39.902393222208644, 330.0]);
          // doit("建模");
        };
      } else {
        // startPoint(1);
      }

      // 传递默认位置
      // that.$store.commit("MSET_MORENWEIZHI", startPoint);
      // let position = Cesium.Cartesian3.fromDegrees(108, 25, 0); //中心点位置
      // let cameraLimit = new xt3d.CameraDominate.CameraLimit(
      //   global.viewer,
      //   position,
      //   {
      //     radius: 2000,
      //     debugExtent: true,
      //   }
      // );

      // const currentViewRect = global.viewer.camera.computeViewRectangle();//东南西北数据
      // console.log(currentViewRect, 78);

      // 瀑布流↓
      window.wallLayer = new global.DC.VectorLayer("wallLayer");
      // global.viewer.addLayer(wallLayer);
      // var arr = that.wallArr;
      // arr.forEach((item) => {
      //   item = item.join(",");
      // });
      // arr = arr.join(";");
      // const wall = new global.DC.Wall(arr);
      // wall.setStyle({
      //   material: new global.DC.WallTrailMaterialProperty({
      //     color: global.DC.Namespace.Cesium.Color.fromBytes(0, 142, 255, 150),
      //     // color: global.DC.Color.DEEPSKYBLUE,
      //     speed: 4,
      //   }),
      // });
      // wallLayer.addOverlay(wall);

      // global.viewer.use(new global.DC.Measure());
      // 瀑布流↑

      // 传入store
      that.$store.commit("MSET_MODEOLS", {
        tilesetLayer: window.tilesetLayer,
        // tileset: window.tileset,
        newLayer: window.newLayer,
        wallLayer: window.wallLayer,
        usetowpointfive: window.usetowpointfive,
      });

      // 飞入起始点
      // that.$store.dispatch("mapFlyTo", {
      //   lntLat: [115.87186406, 28.74449337, 1200],
      //   heading: 0,
      //   pitch: -45,
      //   roll: 0,
      //   noOpen: true,
      // });
      // 地图渲染完成执行srore中MSET_CREADE
      // that.$store.dispatch("MSET_CREADE");

      global.viewer.compass.enable = false;
      global.viewer.zoomController.enable = true;
      global.viewer.locationBar.enable = false;
      global.viewer.distanceLegend.enable = false;
      // 判断默认维度
      // 原本默认是2.5d  改为3d默认时做出改变
      if (that.dimension == "2.5D") {
        that.$store.commit("set_frislayertHeight", that.frislayertHeight); // 送入默认弹窗高度
        that.$store.commit("set_zoomRange", [
          that.onelayerNum,
          that.forlayerNum ? that.forlayerNum : that.threelayerNum,
        ]); // 送入移动端缩放范围
        that.$store.commit("MSET_DIMENSION", "2.5D"); // 切换2.5D设置
      } else if (that.dimension == "3D") {
        // setTimeout((res) => {
        //   that.$store.dispatch("mapFlyTo", {
        //     lntLat: [111.25036579, 34.83767277, 11443175.85],
        //     heading: 0,
        //     pitch: -90,
        //     roll: 0,
        //     noOpen: true,
        //     fn: function () {
        // global.viewer.flyTo(window.tileset);
        // global.viewer.flyTo(provider);
        // 飞入起始点
        // that.$store.dispatch("mapFlyTo", {
        //   lntLat: [115.87186406, 28.74449337, 1200],
        //   heading: 0,
        //   pitch: -45,
        //   roll: 0,
        //   noOpen: true,
        // });

        // startPoint();
        that.$store.commit("MSET_DIMENSION", "3D"); // 切换3D设置
        //     },
        //   });
        // }, 2000);
      }
      global.viewer.scene.screenSpaceCameraController._minimumZoomRate = 1000;
      global.viewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000;
      //渲染后操作
      setTimeout(() => {
        window.butbut();
        // return;

        // 判断是否有url参数
        // console.log(that.urlParameterData);
        if (typeof that.urlParameterData != "string") {
          // console.log(that.urlParameterData);
          that.$store.commit("initurlParameterLayer"); // 初始化自定义标签图层
          if (that.urlParameterData.methods == "goto") {
            // url有定位的参数
            // alert(that.urlParameterData.jd);
            // alert(that.urlParameterData.wd);
            // 创建标记
            const dsa = {
              list: [
                {
                  name: that.urlParameterData.name || "无标题",
                  jd: that.urlParameterData.jd,
                  wd: that.urlParameterData.wd,
                },
              ],
              clear: true,
            };
            that.$store.dispatch("addurlParameterLayerIcon", dsa);
            // that.flytos(
            //   //飞入标记
            //   +that.urlParameterData.jd + 0.012,
            //   +that.urlParameterData.wd
            // );

            const d = {
              position: {},
              lntLat: [+that.urlParameterData.jd, +that.urlParameterData.wd],
              query: {
                introduce: "暂无内容",
                address: "",
                ...(that.urlParameterData || {}),
                lntLat: [+that.urlParameterData.jd, +that.urlParameterData.wd],
              },
              useJWD: true, // 仅使用经纬度
            };
            that.$store.dispatch("setMobileWindows", d);
          } else if (that.urlParameterData.methods == "arc") {
            const objInit = {
              name: that.urlParameterData.mechanismname,
              lntLat: [that.urlParameterData.jd, that.urlParameterData.wd],
              alt: that.urlParameterData.gd,
              heading: that.urlParameterData.heading,
              pitch: that.urlParameterData.pitch,
              roll: that.urlParameterData.roll,
              bgImg: that.urlParameterData.tpurl,
              QRImg: that.urlParameterData.codeurl,
              websiteUrl: that.urlParameterData.websiteurl,
              telePhone: that.urlParameterData.telephone,
              address: that.urlParameterData.address,
              introduce: that.urlParameterData.introduce,
              video: that.urlParameterData.videourl,
              panoramaurl: that.urlParameterData.panoramaurl, // 全景
            };

            const dataInitialization = {
              position: {},
              lntLat: objInit.lntLat,
              query: { ...objInit },
              useJWD: true, // 仅使用经纬度
              // from: 'PopupOurOnce'
            };

            window.popupsDom = that.$store.dispatch(
              "setMobileWindows",
              dataInitialization
            );
          }
        }
      }, 0);
    };
    global.DC.ready(window.initViewer);
  },
  methods: {
    openPopupS(position, lntLat, query) {
      const that = this;
      // 定制化窗体
      const d = {
        position,
        lntLat,
        query: { introduce: position, address: lntLat, ...(query || {}) },
        useJWD: true, // 仅使用经纬度
      };
      that.$store.dispatch("setMobileWindows", d);
    },
    flytos(jd, wd) {
      const height = this.frislayertHeight;
      this.$store.dispatch("mapFlyTo", {
        lntLat: [jd, wd, height], // 114.04020791, 27.62934732
        heading: 0,
        pitch: -90,
        roll: 0,
        noOpen: true,
      });
    },
  },
};
</script>

<style lang="scss" scope>
#mobile-viewer-container {
    width: 100%;
    height: 100%;
    position: relative;
  width: 100%;
  height: 100%;
  position: relative;
}
.heights {
    background-color: #fff;
    font-size: 24px;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 9999999;
  background-color: #fff;
  font-size: 24px;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 9999999;
}
</style>

 src/pcviews/tool/sign.vue

@@ -1,188 +1,210 @@
<template>
    <public-box class="tool-sign">
        <template slot="public-box-header">
            <div class="title">
                <img class="icon deblurring" src="/img/icon/tool-sign.png" alt />
                <span>地图标记</span>
            </div>
            <img class="btn-box deblurring" @click.stop="addSign" src="/img/navicon/add.png" alt />
            <img class="close deblurring" src="/img/navicon/close.png" alt @click="closeModel" />
        </template>
        <template slot="public-box-content">
            <div class="list-box" v-loading="loading">
                <ul v-show="signShow">
                    <li v-for="(item, index) in signList" :key="index" @click="dingw(item)">
                        <img src="/img/icon/sign-list.png" alt />
                        {{ item.name }}
                        <el-button
                            type="danger"
                            size="mini"
                            icon="el-icon-delete"
                            circle
                            @click.stop="deleteIcon(item.id)"
                        ></el-button>
                    </li>
                </ul>
                <div v-show="!signShow" class="no-data">
                    <img src="/img/icon/no-data.png" alt />
                    <div>暂无数据</div>
                </div>
            </div>
        </template>
    </public-box>
  <public-box class="tool-sign">
    <template slot="public-box-header">
      <div class="title">
        <img class="icon deblurring" src="/img/icon/tool-sign.png" alt />
        <span>地图标记</span>
      </div>
      <img
        class="btn-box deblurring"
        @click.stop="addSign"
        src="/img/navicon/add.png"
        alt
      />
      <img
        class="close deblurring"
        src="/img/navicon/close.png"
        alt
        @click="closeModel"
      />
    </template>
    <template slot="public-box-content">
      <div class="list-box" v-loading="loading">
        <ul v-show="signShow">
          <li
            v-for="(item, index) in signList"
            :key="index"
            @click="dingw(item)"
          >
            <img src="/img/icon/sign-list.png" alt />
            {{ item.name }}
            <el-button
              type="danger"
              size="mini"
              icon="el-icon-delete"
              circle
              @click.stop="deleteIcon(item.id)"
            ></el-button>
          </li>
        </ul>
        <div v-show="!signShow" class="no-data">
          <img src="/img/icon/no-data.png" alt />
          <div>暂无数据</div>
        </div>
      </div>
    </template>
  </public-box>
</template>

<script>
import { mapGetters } from 'vuex'
import { getlabel, deletelabel } from '@/api/pc/label'
import { mapGetters } from "vuex";
import { getlabel, deletelabel } from "@/api/pc/label";

export default {
    data () {
        return {
            loading: true,
            signList: [],
            signShow: true,
            destroyedFlag: true
  data() {
    return {
      loading: true,
      signList: [],
      signShow: true,
      destroyedFlag: true,
    };
  },
  computed: {
    ...mapGetters(["addSignList"]),
  },
  mounted() {
    this.$store.commit("initLabelLayer", global.viewer);
    this.getData();
  },
  watch: {
    addSignList() {
      this.getData();
    },
  },
  methods: {
    dingw(item) {
      const that = this;
      // console.log(item);
      // this.$store.dispatch("mapFlyTo", {
      //   lntLat: [item.jd, item.wd, 120], //114.04020791, 27.62934732
      //   heading: 0,
      //   pitch: -90,
      //   roll: 0,
      //   noOpen: true,
      //   mviewer: that.viewer,
      // });
      global.viewer.camera.setView({
        // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
        // fromDegrees()方法，将经纬度和高程转换为世界坐标
        destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
          item.jd,
          item.wd,
          400.0
        ),
        orientation: {
          // 指向
          heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
          // 视角
          pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
          roll: 0.0,
        },
      });
    },
    deleteIcon(id) {
      const that = this;
      deletelabel(id).then((res) => {
        console.log(res);
        if (res.data.code == 200) {
          that.$message({
            message: "删除标签成功",
            type: "success",
          });
        } else {
          that.$message({
            message: "删除标签失败",
            type: "warning",
          });
        }
        that.getData();
      });
    },
    computed: {
        ...mapGetters(['addSignList'])
    getData() {
      const that = this;
      that.loading = true;
      let oks = setTimeout(() => {
        that.loading = false;
        that.signShow = false;
      }, 5000);
      getlabel().then((res) => {
        clearTimeout(oks);
        console.log(res);
        const data = res.data.data.records;
        that.signList = data;
        that.signList.length > 0
          ? (that.signShow = true)
          : (that.signShow = false);
        that.loading = false;
        // that.$store.commit("clearLabelLayerIcon");
        that.$store.dispatch("addLabelLayerIcon", {
          list: data,
          clear: true,
        });
      });
    },
    mounted () {
        this.$store.commit('initLabelLayer', global.viewer)
        this.getData()
    moveMessage(e, b) {
      if (b == "") {
        global.viewer.tooltip.enable = false;
      } else {
        global.viewer.tooltip.enable = true;
        global.viewer.tooltip.showAt(e.windowPosition, b);
      }
    },
    watch: {
        addSignList () {
            this.getData()
        }

    addSign() {
      var that = this;
      this.$store.commit("set_closeMapClick", true);
      // console.log("开始", "see");
      global.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) =>
        that.moveMessage(e, "点击确认标注位置")
      );

      global.viewer.once(global.DC.MouseEventType.CLICK, (e) => {
        if (that.destroyedFlag == false) return;

        global.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) =>
          that.moveMessage(e, "")
        );

        // eslint-disable-next-line no-unused-vars
        const popup = new global.DC.DivForms(global.viewer, {
          domId: "AddTagBox",
          position: [
            global.DC.Transform.transformWGS84ToCartesian(
              new global.DC.Position(
                Number(e.wgs84SurfacePosition.lng),
                Number(e.wgs84SurfacePosition.lat),
                Number(e.wgs84SurfacePosition.alt)
              )
            ),
          ],
        });

        that.$store.commit("SET_ADDTAGPOSITION", e.wgs84SurfacePosition);
        that.$store.commit("SET_ADDTAGPOPUP", true);
      });
    },
    methods: {
        dingw (item) {
            const that = this
            // console.log(item);
            // this.$store.dispatch("mapFlyTo", {
            //   lntLat: [item.jd, item.wd, 120], //114.04020791, 27.62934732
            //   heading: 0,
            //   pitch: -90,
            //   roll: 0,
            //   noOpen: true,
            //   mviewer: that.viewer,
            // });
            global.viewer.camera.setView({
                // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                // fromDegrees()方法，将经纬度和高程转换为世界坐标
                destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                    item.jd,
                    item.wd,
                    400.0
                ),
                orientation: {
                    // 指向
                    heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                    // 视角
                    pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                    roll: 0.0
                }
            })
        },
        deleteIcon (id) {
            const that = this
            deletelabel(id).then((res) => {
                console.log(res)
                if (res.data.code == 200) {
                    that.$message({
                        message: '删除标签成功',
                        type: 'success'
                    })
                } else {
                    that.$message({
                        message: '删除标签失败',
                        type: 'warning'
                    })
                }
                that.getData()
            })
        },
        getData () {
            const that = this
            getlabel().then((res) => {
                console.log(res)
                const data = res.data.data.records
                that.signList = data
                that.signList.length > 0 ? that.signShow = true : that.signShow = false
                that.loading = false
                // that.$store.commit("clearLabelLayerIcon");
                that.$store.dispatch('addLabelLayerIcon', {
                    list: data,
                    clear: true
                })
            })
        },
        moveMessage (e, b) {
            if (b == '') {
                global.viewer.tooltip.enable = false
            } else {
                global.viewer.tooltip.enable = true
                global.viewer.tooltip.showAt(e.windowPosition, b)
            }
        },

        addSign () {
            var that = this
            this.$store.commit('set_closeMapClick', true)
            // console.log("开始", "see");
            global.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) =>
                that.moveMessage(e, '点击确认标注位置')
            )

            global.viewer.once(global.DC.MouseEventType.CLICK, (e) => {
                if (that.destroyedFlag == false) return

                global.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) =>
                    that.moveMessage(e, '')
                )

                // eslint-disable-next-line no-unused-vars
                const popup = new global.DC.DivForms(global.viewer, {
                    domId: 'AddTagBox',
                    position: [
                        global.DC.Transform.transformWGS84ToCartesian(
                            new global.DC.Position(
                                Number(e.wgs84SurfacePosition.lng),
                                Number(e.wgs84SurfacePosition.lat),
                                Number(e.wgs84SurfacePosition.alt)
                            )
                        )
                    ]
                })

                that.$store.commit('SET_ADDTAGPOSITION', e.wgs84SurfacePosition)
                that.$store.commit('SET_ADDTAGPOPUP', true)
            })
        },

        closeModel () {
            this.$store.dispatch('delVisitedViews', this.$route)
            this.$router.push('/pcLayout/default')
            this.$store.commit('clearLabelLayerIcon')
        }
    closeModel() {
      this.$store.dispatch("delVisitedViews", this.$route);
      this.$router.push("/pcLayout/default");
      this.$store.commit("clearLabelLayerIcon");
    },
    destroyed () {
        var that = this
        that.destroyedFlag = false
        if (global.DC) {
            global.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) =>
                that.moveMessage(e, '')
            )
        }
        this.$store.commit('clearLabelLayerIcon')
  },
  destroyed() {
    var that = this;
    that.destroyedFlag = false;
    if (global.DC) {
      global.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) =>
        that.moveMessage(e, "")
      );
    }
}
    this.$store.commit("clearLabelLayerIcon");
  },
};
</script>

<style lang="scss" scoped>
.move {
    cursor: move;
  cursor: move;
}
</style>

 src/store/getters.js

@@ -1,6 +1,6 @@
// 手机端
const mobile = {
    mviewer: (state) => state.mobile.mviewer,
    // mviewer: (state) => state.mobile.mviewer,
    mBigPopup: (state) => state.mobile.mBigPopup,
    popupOurOpenData: (state) => state.mobile.popupOurOpenData,
    popupTableName: (state) => state.mobile.popupTableName,
@@ -8,7 +8,7 @@
    iconHide: (state) => state.mobile.iconHide,
    MobileWindowsHide: (state) => state.mobile.MobileWindowsHide, // 随地图移动窗口
    MobileWindowChangeData: (state) => state.mobile.MobileWindowChangeData, // 随地图移动窗口
    popupsDom: (state) => state.mobile.popupsDom,
    // popupsDom: (state) => state.mobile.popupsDom,
    query: (state) => state.mobile.query,
    openmobileGoTo: (state) => state.mobile.openmobileGoTo, // 测试
    ccDataState: (state) => state.mobile.ccDataState, // 测试
@@ -21,8 +21,8 @@
    dimensionData: (state) => state.mobile.dimensionData, // 维度镜头数据
    perspectiveControl: (state) => state.mobile.perspectiveControl, /// 视角控制：高度、角度  ()=>{}
    audioState: (state) => state.mobile.audioState, // 文字转语音状态
    areaLayer: (state) => state.mobile.areaLayer, // 文字转语音状态
    areaLayerSelect: (state) => state.mobile.select, // 文字转语音状态
    // areaLayer: (state) => state.mobile.areaLayer, // 
    // areaLayerSelect: (state) => state.mobile.select, // 

    isOpenDrawALine: (state) => state.mobile.isOpenDrawALine, // 是否开启路线
    isendPosition: (state) => state.mobile.isendPosition, // 路线导航终点数据改变
@@ -91,4 +91,4 @@
    addIconsLayerIconPopup: (state) => state.popupParams.addIconsLayerIconPopup, // 自定义标签编辑窗口
    addIconsLayerIconPosition: (state) => state.popupParams.addIconsLayerIconPosition // 自定义标签编辑窗口
}
export default getters
export default getters

 src/store/modules/mobile.js

@@ -2,10 +2,51 @@
import axios from 'axios'

import urlParameter from './mobiles/urlParameter'
window.popupsDom = null; // mobileDivForms的实体类
window.flytoPosition = null; // mobileDivForms的实体类
window.ellipsoid = null;
window.cartographic = null;


window.useHeight = null;
window.vecLayer = null;
window.vecLayer = null;
window.pointLayer = null;
window.drawALineLayerMany = null; //活动线
window.drawALineLayerManycolor = null; //活动线颜色
window.drawALineLayerManyStyle = null; //活动线样式
window.drawALineLayerManypolyline = null; //活动线样式
window.drawAPointLayerMany = null; //活动点
window.drawAPointLayerManyposition = null; //活动点位置
window.drawAPointLayerManyLabels = null; //活动点
window.tilesetLayer = null;
window.wallLayer = null;
window.areaLayer = null;
window.tileset = null;
window.drawALineLayer = null; // 导航路径图层
window.drawALineLayerGCJ02StartLngLat = null; // 导航路径图层转坐标
window.drawALineLayerGCJ02EndLngLat = null; // 导航路径图层转坐标
window.drawALineLayerdrawALine = null; // 导航路径画线方法
window.drawALineLayerIcon = null; // 导航路径图层图标
window.billboarddaohang = null; // 导航点
window.positiondaohang = null; // 导航点位置
window.polylinedaohang = null; // 导航线
window.polylinematerialdaohang = null; // 导航线属性

window.select = {
    // 绿色图层控制显示
    overlay: undefined,
    color: undefined
};

window.newLayer = null;
window.usetowpointfive = null;

window.startPointFn = null;
const mobile = {
    state: {
        ...urlParameter.state, // url参数
        mviewer: null, // 地图实体类
        // mviewer: null, // 地图实体类
        mBigPopup: false, // 全屏弹窗
        popupOurOpenData: [], // 全屏弹窗中下拉菜单数据
        popupTableName: [], // 全屏弹窗标签页数据
@@ -15,7 +56,7 @@
        // DC: '',//DC全局保存
        MobileWindowsHide: true, // 改变点击窗口的显示状态
        MobileWindowChangeData: false, // 改变点击窗口的数据
        popupsDom: '', // mobileDivForms的实体类
        // popupsDom: '', // mobileDivForms的实体类
        query: {}, // 传输数据
        openmobileGoTo: false, // 测试
        ccDataState: false, // 测试
@@ -23,7 +64,7 @@
        MobileWindowsHideFixed: true, // 改变点击窗口的显示状态--固定窗口
        MobileWindowChangeDataFixed: false, // 改变点击窗口的数据--固定窗口
        // 在每次飞行弹窗中  加入自己的点
        pointLayer: null,
        // pointLayer: null,
        pointLayerData: {
            flag: false,
            label: '选择点',
@@ -33,7 +74,7 @@
            layer: 'pointLayer'
        },
        // 默认起始点函数
        startPointFn: '',
        // startPointFn: '',
        dimension: '2.5D', // 维度
        dimensionData: {
            // 维度镜头数据
@@ -46,28 +87,28 @@
        perspectiveControl: '', // 视角控制：高度、角度  ()=>{}
        perspectiveControls: '', // 视角控制：高度、角度  ()=>{}

        tilesetLayer: null, // 3d模型
        tileset: null, // 3d模型
        tilesetLayer: null, // 2.5d模型
        usetowpointfive: null,
        tilesetLayer: null, // 瀑布流
        areaLayer: null, // 2.5d事件--绿色图层
        select: {
            // 绿色图层控制显示
            overlay: undefined,
            color: undefined
        },
        // tilesetLayer: null, // 3d模型
        // tileset: null, // 3d模型
        // tilesetLayer: null, // 2.5d模型
        // usetowpointfive: null,
        // wallLayer: null, // 瀑布流
        // areaLayer: null, // 2.5d事件--绿色图层
        // select: {
        //     // 绿色图层控制显示
        //     overlay: undefined,
        //     color: undefined
        // },

        vecLayer: null, // 3D底图
        cvaLayer: null, // 3D底图
        // vecLayer: null, // 3D底图
        // cvaLayer: null, // 3D底图

        audioData: null, // 语音
        audioState: false, // 语音状态

        navigationStartLngLat: '', // 导航起点
        navigationEndLngLat: '', // 导航终点
        drawALineLayer: null, // 导航路径图层
        drawALineLayerIcon: null, // 导航路径图层图标
        // drawALineLayer: null, // 导航路径图层
        // drawALineLayerIcon: null, // 导航路径图层图标
        isOpenDrawALine: false, // 是否开启路径
        endPosition: '', // 传送终点经纬度--
        isendPosition: false, // 传送终点经纬度--感应数据
@@ -77,63 +118,63 @@
        showActivity: false, // 是否显示活动弹窗
        showActivityData: {}, // 活动内容

        drawALineLayerMany: null, // 活动路线图层
        drawAPointLayerMany: null, // 活动点图层
        // drawALineLayerMany: null, // 活动路线图层
        // drawAPointLayerMany: null, // 活动点图层
        isOpenDrawALineMany: null, // 是否开启活动
        seeRight: true // 右侧控制栏显影
    },
    mutations: {
        ...urlParameter.mutations, // url参数
        MSET_VIEWER (state, viewer) {
            state.mviewer = viewer
        },
        MSET_BIGPOPUP (state, viewer) {
        // MSET_VIEWER (state, viewer) {
        //     global.viewer = viewer
        // },
        MSET_BIGPOPUP(state, viewer) {
            state.mBigPopup = viewer
            $store.dispatch('closeMobileWindowsDom') // 关闭弹窗
        },
        MSET_BIGPOPUPAFTER (state, viewer) {
        MSET_BIGPOPUPAFTER(state, viewer) {
            state.mBigPopupAfter = viewer
            $store.dispatch('closeMobileWindowsDom') // 关闭弹窗
        },
        MSET_POPUPOUROPENDATA (state, viewer) {
        MSET_POPUPOUROPENDATA(state, viewer) {
            state.popupOurOpenData = viewer
        },
        MSET_ICONHIDE (state, viewer) {
        MSET_ICONHIDE(state, viewer) {
            state.iconHide = viewer
        },
        MSET_POPUPTABLENAME (state, viewer) {
        MSET_POPUPTABLENAME(state, viewer) {
            state.popupTableName = viewer
        },
        MSET_MOBILEWINDOWSHIDE (state, viewer) {
        MSET_MOBILEWINDOWSHIDE(state, viewer) {
            // 随地图移动窗口
            state.MobileWindowChangeData = !state.MobileWindowChangeData
            state.MobileWindowsHide = viewer
        },
        MSETCC_SETCC (state, viewer) {
        MSETCC_SETCC(state, viewer) {
            state.ccDataState = !state.ccDataState // 专门测试
            state.query = viewer
        },
        MSET_POPUPDOM (state, viewer) {
            state.popupsDom = viewer
        },
        MSET_QUERY (state, viewer) {
        // MSET_POPUPDOM(state, viewer) {
        //     window.popupsDom = viewer
        // },
        MSET_QUERY(state, viewer) {
            state.query = viewer
        },
        MSET_OPENMOBILEGOTO (state, viewer) {
        MSET_OPENMOBILEGOTO(state, viewer) {
            state.openmobileGoTo = viewer
        },
        MSET_OPENMOBILEPANORAMA (state, viewer) {
        MSET_OPENMOBILEPANORAMA(state, viewer) {
            state.openmobilePanorama = viewer
        },
        MSET_MOBILEWINDOWSHIDEFIXED (state, viewer) {
        MSET_MOBILEWINDOWSHIDEFIXED(state, viewer) {
            // 固定窗口
            state.MobileWindowChangeDataFixed = !state.MobileWindowChangeDataFixed
            state.MobileWindowsHideFixed = viewer
        },
        // 默认位置
        MSET_MORENWEIZHI (state, data) {
            state.startPointFn = data
        },
        // MSET_MORENWEIZHI(state, data) {
        //     window.startPointFn = data
        // },
        // // 开关飞入点图标
        // MSET_OPENPOINTEL(state, val) {
        //     if (val) {
@@ -145,15 +186,15 @@
        //     }
        // },
        // 送入移动端缩放范围
        set_zoomRange (state, data) {
        set_zoomRange(state, data) {
            state.zoomRange = data
        },
        // 送入默认弹窗高度
        set_frislayertHeight (state, data) {
        set_frislayertHeight(state, data) {
            state.frislayertHeight = data
        },
        // 切换2D和2.5D
        MSET_DIMENSION (state, data) {
        MSET_DIMENSION(state, data) {
            // 关闭弹窗
            // 3d，2.5d转换事件
            state.dimension = data
@@ -166,7 +207,7 @@
                    roll: 0
                }
                // 加载底图
                state.vecLayer = state.mviewer.imageryLayers.addImageryProvider(
                window.vecLayer = global.viewer.imageryLayers.addImageryProvider(
                    new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                        url: ' http://t1.tianditu.gov.cn/vec_w/wmts?tk=9ae78c51a0a28f06444d541148496e36',
                        type: 'wmts',
@@ -178,7 +219,7 @@
                        maximumLevel: 18
                    })
                )
                state.cvaLayer = state.mviewer.imageryLayers.addImageryProvider(
                window.cvaLayer = global.viewer.imageryLayers.addImageryProvider(
                    new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                        url: ' http://t1.tianditu.gov.cn/cva_w/wmts?tk=9ae78c51a0a28f06444d541148496e36',
                        type: 'wmts',
@@ -191,31 +232,31 @@
                    })
                )
                // console.log(1321)
                state.wallLayer.show = false // 关闭瀑布   以及2.5d图形贴片
                state.mviewer.imageryLayers.remove(state.newLayer)
                state.newLayer = null
                window.wallLayer.show = false // 关闭瀑布   以及2.5d图形贴片
                global.viewer.imageryLayers.remove(window.newLayer)
                window.newLayer = null
                // state.silhouetteBlue.selected = []
                // state.tilesetLayer.changesilhouetteBlue(); //清空silhouetteBlue.selected = [];
                // console.log(state.tileset)
                state.tilesetLayer.show = true // 显示3d图形
                state.startPointFn() // 移动默认视角
                // state.mviewer.flyTo(state.tileset);
                state.areaLayer.show = false // 绿布
                // window.tilesetLayer.changesilhouetteBlue(); //清空silhouetteBlue.selected = [];
                // console.log(window.tileset)
                window.tilesetLayer.show = true // 显示3d图形
                window.startPointFn() // 移动默认视角
                // global.viewer.flyTo(window.tileset);
                window.areaLayer.show = false // 绿布

                // 3D视角不限制
                state.mviewer.scene.screenSpaceCameraController.minimumZoomDistance = 80
                global.viewer.scene.screenSpaceCameraController.minimumZoomDistance = 80
                // 最大
                state.mviewer.scene.screenSpaceCameraController.maximumZoomDistance = 4000000
                global.viewer.scene.screenSpaceCameraController.maximumZoomDistance = 4000000
                // 设置相机缩小时的速率
                state.mviewer.scene.screenSpaceCameraController._minimumZoomRate = 10000
                global.viewer.scene.screenSpaceCameraController._minimumZoomRate = 10000
                // 设置相机放大时的速率
                state.mviewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000
                global.viewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000
                // 视角平移
                state.mviewer.scene.screenSpaceCameraController.enableRotate = true
                global.viewer.scene.screenSpaceCameraController.enableRotate = true
                // 视角缩放
                state.mviewer.scene.screenSpaceCameraController.enableZoom = true
                global.viewer.scene.screenSpaceCameraController.enableZoom = true
                // 视角旋转
                state.mviewer.scene.screenSpaceCameraController.enableTilt = true
                global.viewer.scene.screenSpaceCameraController.enableTilt = true
            } else if (data == '2.5D') {
                state.dimensionData = {
                    // 维度镜头数据
@@ -227,12 +268,12 @@
                    // roll: 0,
                }
                // 取消3D底图
                // state.mviewer.imageryLayers.remove(state.vecLayer);
                // state.vecLayer = null;
                // state.mviewer.imageryLayers.remove(state.cvaLayer);
                // state.cvaLayer = null;
                // global.viewer.imageryLayers.remove(window.vecLayer);
                // window.vecLayer = null;
                // global.viewer.imageryLayers.remove(window.cvaLayer);
                // window.cvaLayer = null;
                // 加载底图
                state.vecLayer = state.mviewer.imageryLayers.addImageryProvider(
                window.vecLayer = global.viewer.imageryLayers.addImageryProvider(
                    new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                        url: 'http://t{s}.tianditu.gov.cn/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=9ae78c51a0a28f06444d541148496e36',
                        subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
@@ -242,7 +283,7 @@
                    })
                )

                state.cvaLayer = state.mviewer.imageryLayers.addImageryProvider(
                window.cvaLayer = global.viewer.imageryLayers.addImageryProvider(
                    new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                        url: 'http://t{s}.tianditu.gov.cn/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=9ae78c51a0a28f06444d541148496e36',
                        subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
@@ -252,46 +293,46 @@
                    })
                )

                state.tilesetLayer.show = false // 隐藏3d图形
                state.newLayer = state.usetowpointfive() // 添加2.5d图形贴片
                state.wallLayer.show = false // 打开瀑布
                state.startPointFn() // 移动默认视角
                state.areaLayer.show = true // 绿布
                window.tilesetLayer.show = false // 隐藏3d图形
                window.newLayer = window.usetowpointfive() // 添加2.5d图形贴片
                window.wallLayer.show = false // 打开瀑布
                window.startPointFn() // 移动默认视角
                window.areaLayer.show = true // 绿布
                // 2.5D视角限制
                state.mviewer.scene.screenSpaceCameraController.minimumZoomDistance = state.zoomRange[0]
                global.viewer.scene.screenSpaceCameraController.minimumZoomDistance = state.zoomRange[0]
                // 最大
                state.mviewer.scene.screenSpaceCameraController.maximumZoomDistance = state.zoomRange[1]
                global.viewer.scene.screenSpaceCameraController.maximumZoomDistance = state.zoomRange[1]
                // 设置相机缩小时的速率
                state.mviewer.scene.screenSpaceCameraController._minimumZoomRate = 2000
                global.viewer.scene.screenSpaceCameraController._minimumZoomRate = 2000
                // 设置相机放大时的速率
                state.mviewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000
                global.viewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000
                // 视角平移
                state.mviewer.scene.screenSpaceCameraController.enableRotate = true
                global.viewer.scene.screenSpaceCameraController.enableRotate = true
                // 视角缩放
                state.mviewer.scene.screenSpaceCameraController.enableZoom = true
                global.viewer.scene.screenSpaceCameraController.enableZoom = true
                // 视角旋转
                state.mviewer.scene.screenSpaceCameraController.enableTilt = false
                global.viewer.scene.screenSpaceCameraController.enableTilt = false
            }
        },
        // 绿布
        MSET_areaLayer (state, data) {
            state.areaLayer = data
        MSET_areaLayer(state, data) {
            window.areaLayer = data;
        },
        // 切换控制
        MSET_PERSPECTIVECONTROL (state, data) {
        MSET_PERSPECTIVECONTROL(state, data) {
            state.perspectiveControl = data
            state.perspectiveControls = !state.perspectiveControls
        },
        MSET_MODEOLS (state, data) {
            state.tilesetLayer = data.tilesetLayer
            state.newLayer = data.newLayer
            state.wallLayer = data.wallLayer
            state.tileset = data.tileset
            state.usetowpointfive = data.usetowpointfive
        MSET_MODEOLS(state, data) {
            window.tilesetLayer = data.tilesetLayer
            window.newLayer = data.newLayer
            window.wallLayer = data.wallLayer
            window.tileset = data.tileset
            window.usetowpointfive = data.usetowpointfive
        },
        // 直接移动
        cameraSetView (state, data) {
            state.mviewer.camera.setView({
        cameraSetView(state, data) {
            global.viewer.camera.setView({
                // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                // fromDegrees()方法，将经纬度和高程转换为世界坐标
                destination: new global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
@@ -316,46 +357,46 @@
            })
        },
        // 删除路线
        removePolyline (state) {
            if (state.drawALineLayer) {
                state.drawALineLayer.remove()
                state.drawALineLayer = null
        removePolyline(state) {
            if (window.drawALineLayer) {
                window.drawALineLayer.remove()
                window.drawALineLayer = null
                state.isOpenDrawALine = false
            }
        },
        removerPolyLineIcon (state) {
            if (state.drawALineLayerIcon) {
                state.drawALineLayerIcon.remove()
                state.drawALineLayerIcon = null
        removerPolyLineIcon(state) {
            if (window.drawALineLayerIcon) {
                window.drawALineLayerIcon.remove()
                window.drawALineLayerIcon = null
            }
        },
        removePolylineMany (state) {
            if (state.drawALineLayerMany) {
                state.drawALineLayerMany.remove()
                state.drawALineLayerMany = null
        removePolylineMany(state) {
            if (window.drawALineLayerMany) {
                window.drawALineLayerMany.remove()
                window.drawALineLayerMany = null
                state.isOpenDrawALineMany = false
            }
            if (state.drawAPointLayerMany) {
                state.drawAPointLayerMany.remove()
                state.drawAPointLayerMany = null
            if (window.drawALineLayerMany) {
                window.drawALineLayerMany.remove()
                window.drawALineLayerMany = null
                state.isOpenDrawALineMany = false
            }
        },
        // 显影线路或者点
        showLineOrPoint (state, val) {
        showLineOrPoint(state, val) {
            state[val.layer].show = val.flag
        },
        // 传送终点数据
        set_endPosition (state, data) {
        set_endPosition(state, data) {
            state.isendPosition = !state.isendPosition
            state.endPosition = data
        },
        // 传送当前选择的路径
        set_choiceRouterS (state, data) {
        set_choiceRouterS(state, data) {
            state.choiceRouterS = data
        },
        // 活动窗口是否显示
        set_showActivity (state, data) {
        set_showActivity(state, data) {
            state.showActivity = data
            if (data.state) {
                state.showActivityData = data.value
@@ -365,34 +406,34 @@
                state.showActivity = data.state
            }
        },
        mset_changeSelect (state, data) {
            state.select.overlay = data[0]
            state.select.color = data[1]
        mset_changeSelect(state, data) {
            window.select.overlay = data[0]
            window.select.color = data[1]
        },
        SET_SeeAndNotSee (state, data) {
        SET_SeeAndNotSee(state, data) {
            state.seeRight = data
        }
    },
    actions: {
        ...urlParameter.actions, // url参数
        MSET_CREADE ({
        MSET_CREADE({
            state,
            commit,
            dispatch
        }) {
            state.pointLayer = new global.DC.VectorLayer('pointLayer') // 创建图标实体类
            state.mviewer.addLayer(state.pointLayer) // 添加到地图
            window.pointLayer = new global.DC.VectorLayer('pointLayer') // 创建图标实体类
            global.viewer.addLayer(window.pointLayer) // 添加到地图
        },
        setMobileWindows ({
        setMobileWindows({
            state,
            commit,
            dispatch
        }, data) {
            // 打开随地图移动窗口
            let clas, Flys
            const nowHeight = Math.ceil(
                state.mviewer.camera.positionCartographic.height
            )
            // const nowHeight = Math.ceil(
            //     global.viewer.camera.positionCartographic.height
            // )
            // 传递响应数据
            commit('MSET_QUERY', data)
            // console.log(data);
@@ -406,9 +447,9 @@
                clas = [
                    data.from == 'PopupOurOnce' ? +data.lntLat[0] : +data.lntLat[0],
                    // data.from == 'PopupOurOnce' ? +data.lntLat[1] - 0.00108 : +data.lntLat[1],
                    data.from == 'PopupOurOnce'
                        ? +data.lntLat[1] - 0.00108
                        : +data.lntLat[1] - 0.00048,
                    data.from == 'PopupOurOnce' ?
                    +data.lntLat[1] - 0.00108 :
                    +data.lntLat[1] - 0.00048,
                    data.from == 'PopupOurOnce' ? 0 : 30.648862227
                ]
            } else if (state.dimension == '2.5D') {
@@ -430,19 +471,19 @@
            }

            if (data.useJWD) {
                var ellipsoid = state.mviewer.scene.globe.ellipsoid
                var cartographic = global.DC.Namespace.Cesium.Cartographic.fromDegrees(
                window.ellipsoid = global.viewer.scene.globe.ellipsoid
                window.cartographic = global.DC.Namespace.Cesium.Cartographic.fromDegrees(
                    // data.lntLat[0],
                    // data.lntLat[1] - 0.00048,//数值增大是下
                    // "90.648862227"
                    // clnt, clat, calt
                    ...clas
                )
                data.position = ellipsoid.cartographicToCartesian(cartographic)
                data.position = window.ellipsoid.cartographicToCartesian(window.cartographic)
            }

            // 定制化窗体
            const popupsDom = new global.DC.mobileDivForms(state.mviewer, {
            window.popupsDom = new global.DC.mobileDivForms(global.viewer, {
                domId: 'mobilePopup',
                title: data.query.name || '成教楼  ',
                className: 'mobilePopup',
@@ -473,7 +514,7 @@
            //     data.query.from == "地图点击" ? 330 : 330,
            // ]

            const Position = new global.DC.Position( // 转坐标
            window.flytoPosition = new global.DC.Position( // 转坐标
                // +data.lntLat[0] + 0.01197,
                // +data.lntLat[1] - 0.0021,
                // 330,
@@ -486,12 +527,12 @@
                commit('MSET_MOBILEWINDOWSHIDE', true)
            }
            if (
                state.select.overlay != undefined &&
                window.select.overlay != undefined &&
                data.query.fromTo != 'mapClick'
            ) {
                // 关闭绿色边框
                state.select.overlay.setStyle({
                    material: state.select.color,
                window.select.overlay.setStyle({
                    material: window.select.color,
                    outline: false
                })
                commit('mset_changeSelect', [undefined, undefined])
@@ -502,20 +543,20 @@
                // if (true) {
                dispatch('mapFlyTo', {
                    // 飞入
                    lntLat: [Position.lng, Position.lat, Position.alt],
                    heading: Position.heading,
                    pitch: Position.pitch,
                    roll: Position.roll
                    lntLat: [window.flytoPosition.lng, window.flytoPosition.lat, window.flytoPosition.alt],
                    heading: window.flytoPosition.heading,
                    pitch: window.flytoPosition.pitch,
                    roll: window.flytoPosition.roll
                })
            } else {
                dispatch('mapFlyTo', {
                    // 飞入
                    lntLat: [Position.lng, +Position.lat - 0.0003, Position.alt],
                    heading: Position.heading,
                    pitch: Position.pitch,
                    roll: Position.roll
                    lntLat: [window.flytoPosition.lng, +window.flytoPosition.lat - 0.0003, window.flytoPosition.alt],
                    heading: window.flytoPosition.heading,
                    pitch: window.flytoPosition.pitch,
                    roll: window.flytoPosition.roll
                })
                // state.mviewer.camera.setView({
                // global.viewer.camera.setView({
                //   // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                //   // fromDegrees()方法，将经纬度和高程转换为世界坐标
                //   destination: new global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
@@ -539,37 +580,37 @@
                // commit("MSET_MOBILEWINDOWSHIDE", false); // 显示弹窗
            }
            // })
            commit('MSET_POPUPDOM', popupsDom)
            // commit('MSET_POPUPDOM', popupsDom)
        },
        closeMobileWindowsDom ({
        closeMobileWindowsDom({
            state,
            commit,
            dispatch
        }) {
            commit('CLOSE_NOWPOSITION') // 中断定位获取
            if (!state.MobileWindowsHide && state.popupsDom) {
                state.popupsDom.closeOur()
            if (!state.MobileWindowsHide && window.popupsDom) {
                window.popupsDom.closeOur()
                commit('MSET_MOBILEWINDOWSHIDE', true)
                if (state.audioData) {
                    dispatch('MSET_GETAUDIOBEGIN', 'notOpen')
                }
            } // cancel
        },
        CHANGETOC3 ({
            state,
            commit
        }, data) {
            // //转换经纬度坐标 成世界坐标cartesian3
            var ellipsoid = state.mviewer.scene.globe.ellipsoid
            var cartographic = global.DC.Namespace.Cesium.Cartographic.fromDegrees(
                data.lnt,
                data.lat - 0.00006,
                data.alt || '90.648862227'
            )
            var position = ellipsoid.cartographicToCartesian(cartographic)
            return position
        },
        SET_OPENWIDOWFIXED ({
        // CHANGETOC3({
        //     state,
        //     commit
        // }, data) {
        //     // //转换经纬度坐标 成世界坐标cartesian3
        //     var ellipsoid = global.viewer.scene.globe.ellipsoid
        //     var cartographic = global.DC.Namespace.Cesium.Cartographic.fromDegrees(
        //         data.lnt,
        //         data.lat - 0.00006,
        //         data.alt || '90.648862227'
        //     )
        //     var position = ellipsoid.cartographicToCartesian(cartographic)
        //     return position
        // },
        SET_OPENWIDOWFIXED({
            state,
            commit
        }, data) {
@@ -578,7 +619,7 @@
            // 显示窗口
            commit('MSET_MOBILEWINDOWSHIDEFIXED', false)
            // 移动地图位置
            state.mviewer.zoomToPosition(
            global.viewer.zoomToPosition(
                new global.DC.Position(
                    data.lntLat[0],
                    data.lntLat[1] - 0.012,
@@ -588,7 +629,7 @@
                )
            )
        },
        CLOSE_WIDOWFIXED ({
        CLOSE_WIDOWFIXED({
            state,
            commit
        }) {
@@ -598,17 +639,17 @@
            }
        },
        // 加入当时的选点
        JOIN_POINT ({
        JOIN_POINT({
            state,
            commit
        }, data) { },
        }, data) {},
        // flyTo
        mapFlyTo ({
        mapFlyTo({
            state,
            commit,
            dispatch
        }, data) {
            state.mviewer.camera.flyTo({
            global.viewer.camera.flyTo({
                destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                    data.lntLat[0] - 0.012,
                    data.lntLat[1],
@@ -671,56 +712,56 @@
            // });
        },
        // 飞入点加入位置
        MSET_POINTDATA ({
            state,
            commit,
            dispatch
        }, data) {
            // 加入坐标
            const positions = new global.DC.Position(
                data[0] - 0.0119,
                data[1] + 0.0111,
                0
            )
            const billboard = new global.DC.Billboard(
                positions,
                '/img/leftnav/map-panorama.png'
            )
            billboard.size = [16, 16]
            // 订阅事件3
            billboard.on(global.DC.MouseEventType.CLICK, (e) => {
                // 定制化窗体
                const query = {
                    name: '选择点'
                }
                const intLat = [e.wgs84Position.lng, e.wgs84Position.lat]
                const d = {
                    position: null,
                    lntLat: intLat,
                    query: {
                        ...(query || {}),
                        introduce: null,
                        address: intLat
                    },
                    useJWD: true // 仅使用经纬度
                }
                dispatch('setMobileWindows', d)
            })
            state.pointLayer.addOverlay(billboard) // 实景
            // commit("MSET_OPENPOINTEL", true);
        },
        MSET_LOCKPERSPECTIVEL ({
        // MSET_POINTDATA({
        //     state,
        //     commit,
        //     dispatch
        // }, data) {
        //     // 加入坐标
        //     const positions = new global.DC.Position(
        //         data[0] - 0.0119,
        //         data[1] + 0.0111,
        //         0
        //     )
        //     const billboard = new global.DC.Billboard(
        //         positions,
        //         '/img/leftnav/map-panorama.png'
        //     )
        //     billboard.size = [16, 16]
        //     // 订阅事件3
        //     billboard.on(global.DC.MouseEventType.CLICK, (e) => {
        //         // 定制化窗体
        //         const query = {
        //             name: '选择点'
        //         }
        //         const intLat = [e.wgs84Position.lng, e.wgs84Position.lat]
        //         const d = {
        //             position: null,
        //             lntLat: intLat,
        //             query: {
        //                 ...(query || {}),
        //                 introduce: null,
        //                 address: intLat
        //             },
        //             useJWD: true // 仅使用经纬度
        //         }
        //         dispatch('setMobileWindows', d)
        //     })
        //     window.pointLayer.addOverlay(billboard) // 实景
        //     // commit("MSET_OPENPOINTEL", true);
        // },
        MSET_LOCKPERSPECTIVEL({
            state,
            commit,
            dispatch
        }, val) {
            // 锁定
            state.mviewer.camera.lookAtTransform(
            global.viewer.camera.lookAtTransform(
                global.DC.Namespace.Cesium.Matrix4.IDENTITY
            )
            // console.log(global.DC.Namespace.Cesium.Matrix4.IDENTITY)
        },
        MSET_DIMENSIONS ({
        MSET_DIMENSIONS({
            state,
            commit,
            dispatch
@@ -730,14 +771,14 @@
            // 3d，2.5d转换事件
            commit('MSET_DIMENSION', val)
            // 控制高度
            const height = Math.ceil(
                state.mviewer.camera.positionCartographic.height
            window.useHeight = Math.ceil(
                global.viewer.camera.positionCartographic.height
            )
            state.mviewer.camera.setView({
            global.viewer.camera.setView({
                destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                    state.mviewer.camera.positionCartographic.longitude,
                    state.mviewer.camera.positionCartographic.latitude,
                    height
                    global.viewer.camera.positionCartographic.longitude,
                    global.viewer.camera.positionCartographic.latitude,
                    window.useHeight
                ),
                orientation: {
                    heading: global.DC.Namespace.Cesium.Math.toRadians(
@@ -750,7 +791,7 @@
                }
            })
        },
        MSET_GOTOCC ({
        MSET_GOTOCC({
            state,
            commit,
            dispatch
@@ -758,11 +799,11 @@
            // 测试移动位置
            // commit("MSET_DIMENSION", val);
            // 控制高度
            // const height = Math.ceil(state.mviewer.camera.positionCartographic.height);
            state.mviewer.camera.setView({
            // const height = Math.ceil(global.viewer.camera.positionCartographic.height);
            global.viewer.camera.setView({
                destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
                    state.mviewer.camera.positionCartographic.longitude,
                    state.mviewer.camera.positionCartographic.latitude,
                    global.viewer.camera.positionCartographic.longitude,
                    global.viewer.camera.positionCartographic.latitude,
                    val.height
                ),
                orientation: {
@@ -773,7 +814,7 @@
            })
        },
        // 文字转语音控制↓
        MSET_GETAUDIO ({
        MSET_GETAUDIO({
            state,
            commit,
            dispatch
@@ -787,7 +828,7 @@
                state.audioState = false
            }
        },
        MSET_GETAUDIOBEGIN ({
        MSET_GETAUDIOBEGIN({
            state,
            commit,
            dispatch
@@ -803,7 +844,7 @@
        },
        // 文字转语音控制↑
        // 导航系统↓
        MSET_GOTOWHERE ({
        MSET_GOTOWHERE({
            state,
            commit,
            dispatch
@@ -815,11 +856,11 @@
            state.navigationStartLngLat = [+val.start[0], +val.start[1]] // 导航起点
            state.navigationEndLngLat = [+val.end[0], +val.end[1]] // 导航终点
            // 转换WGS84坐标为GCJ02
            const GCJ02StartLngLat = global.DC.CoordTransform.WGS84ToGCJ02(
            window.drawALineLayerGCJ02StartLngLat = global.DC.CoordTransform.WGS84ToGCJ02(
                Number(state.navigationStartLngLat[0]),
                Number(state.navigationStartLngLat[1])
            )
            const GCJ02EndLngLat = global.DC.CoordTransform.WGS84ToGCJ02(
            window.drawALineLayerGCJ02EndLngLat = global.DC.CoordTransform.WGS84ToGCJ02(
                Number(state.navigationEndLngLat[0]),
                Number(state.navigationEndLngLat[1])
            )
@@ -827,11 +868,11 @@

            let url = 'https://restapi.amap.com/v3/direction/walking' // 默认api步行
            const data = {
                origin: `${Number(GCJ02StartLngLat[0]).toFixed(6)},${Number(
                    GCJ02StartLngLat[1]
                origin: `${Number(window.drawALineLayerGCJ02StartLngLat[0]).toFixed(6)},${Number(
                    window.drawALineLayerGCJ02StartLngLat[1]
                ).toFixed(6)}`,
                destination: `${Number(GCJ02EndLngLat[0]).toFixed(6)},${Number(
                    GCJ02EndLngLat[1]
                destination: `${Number(window.drawALineLayerGCJ02EndLngLat[0]).toFixed(6)},${Number(
                    window.drawALineLayerGCJ02EndLngLat[1]
                ).toFixed(6)}`,
                key: '4b3e1db3211054ce5b466407cbb9d221',
                output: 'json'
@@ -856,13 +897,13 @@
                    const paths = res.data.route.paths
                    for (let i = 0; i < paths.length; i++) {
                        // 多条路线
                        drawALine(paths[i])
                        window.drawALineLayerdrawALine(paths[i])
                    }
                    // const paths = res.data.route.paths[0].steps;
                    // drawALine(paths, res.data.route.paths[0].strategy);
                    // window.drawALineLayerdrawALine (paths, res.data.route.paths[0].strategy);
                })
            // }
            const drawALine = (pathsour) => {
            window.drawALineLayerdrawALine = (pathsour) => {
                const paths = pathsour.steps
                const titles = pathsour.strategy
                // paths是个道路对象，其中polyline是String类型的经纬度
@@ -903,7 +944,7 @@
        },
        // 导航系统↑
        // 绘画线路
        MSET_DRAWALINELAYER ({
        MSET_DRAWALINELAYER({
            state,
            commit,
            dispatch
@@ -914,33 +955,33 @@
            commit('removePolylineMany')
            const color =
                global.DC.Namespace.Cesium.Color.fromCssColorString('#409EFF')
            const material = new global.DC.PolylineTrailMaterialProperty({
            window.polylinematerialdaohang = new global.DC.PolylineTrailMaterialProperty({
                color: color,
                speed: 10
            })
            state.drawALineLayer = new global.DC.VectorLayer('lineLayer')
            state.mviewer.addLayer(state.drawALineLayer)
            window.drawALineLayer = new global.DC.VectorLayer('lineLayer')
            global.viewer.addLayer(window.drawALineLayer)

            // 如果是添加  给第一个点加入图标 和事件
            if (value[1]) {
                commit('removerPolyLineIcon')
                state.drawALineLayerIcon = new global.DC.VectorLayer('pointLayer')
                state.mviewer.addLayer(state.drawALineLayerIcon)
                window.drawALineLayerIcon = new global.DC.VectorLayer('pointLayer')
                global.viewer.addLayer(window.drawALineLayerIcon)
                const useStr = Str.split(';')
                const post = useStr[useStr.length - 1].split(',')
                const position = new global.DC.Position(post[0], post[1])
                const billboard = new global.DC.Billboard(
                    position,
                window.positiondaohang = new global.DC.Position(post[0], post[1])
                window.billboarddaohang = new global.DC.Billboard(
                    window.positiondaohang,
                    'img/dingwei/dingwei1.png'
                ) // 加入绘画点
                billboard.setStyle({
                window.billboarddaohang.setStyle({
                    pixelOffset: {
                        x: 0,
                        y: -17
                    } // 偏移像素
                })
                // 订阅事件
                billboard.on(global.DC.MouseEventType.CLICK, (e) => {
                window.billboarddaohang.on(global.DC.MouseEventType.CLICK, (e) => {
                    // console.log(e);
                    // return;
                    // 定制化窗体
@@ -959,21 +1000,21 @@
                    }
                    dispatch('setMobileWindows', windowData)
                })
                state.drawALineLayerIcon.addOverlay(billboard)
                window.drawALineLayerIcon.addOverlay(window.billboarddaohang)
            }
            const polyline = new global.DC.Polyline(Str) // 加入线
            polyline.setStyle({
            window.polylinedaohang = new global.DC.Polyline(Str) // 加入线
            window.polylinedaohang.setStyle({
                width: 3,
                material: material,
                material: window.polylinematerialdaohang,
                clampToGround: true
            })
            state.drawALineLayer.addOverlay(polyline)
            window.drawALineLayer.addOverlay(window.polylinedaohang)

            state.isOpenDrawALine = true
            // commit("cameraSetView", state.navigationStartLngLat); //移动
        },
        // 绘画线路活动多条
        MSET_DRAWALINELAYERMANY ({
        MSET_DRAWALINELAYERMANY({
            state,
            commit,
            dispatch
@@ -983,15 +1024,15 @@
            commit('removePolyline')
            commit('removerPolyLineIcon')
            const Strs = value[0]
            const red = global.DC.Namespace.Cesium.Color.fromCssColorString('#FF0000')
            const white = global.DC.Namespace.Cesium.Color.fromCssColorString('#fff')
            const blue = global.DC.Namespace.Cesium.Color.fromCssColorString('#2196F3')
            const material = new global.DC.PolylineTrailMaterialProperty({
                color: red,
                speed: 10
            })
            const material1 = new global.DC.PolylineImageTrailMaterialProperty({
                color: red,
            window.drawALineLayerManycolor = global.DC.Namespace.Cesium.Color.fromCssColorString('#FF0000')
            // const white = global.DC.Namespace.Cesium.Color.fromCssColorString('#fff')
            // const blue = global.DC.Namespace.Cesium.Color.fromCssColorString('#2196F3')
            // const material = new global.DC.PolylineTrailMaterialProperty({
            //     color: red,
            //     speed: 10
            // })
            window.drawALineLayerManyStyle = new global.DC.PolylineImageTrailMaterialProperty({
                color: window.drawALineLayerManycolor,
                speed: 60,
                image: 'img/icon/right.png',
                repeat: {
@@ -999,19 +1040,19 @@
                    y: 1
                }
            })
            const drawALineLayerMany = new global.DC.VectorLayer('manyLinePointLayer')
            state.mviewer.addLayer(drawALineLayerMany)
            const drawAPointLayerMany = new global.DC.HtmlLayer('manyPointPointLayer')
            state.mviewer.addLayer(drawAPointLayerMany)
            window.drawALineLayerMany = new global.DC.VectorLayer('manyLinePointLayer')
            global.viewer.addLayer(window.drawALineLayerMany)
            window.drawAPointLayerMany = new global.DC.HtmlLayer('manyPointPointLayer')
            global.viewer.addLayer(window.drawAPointLayerMany)
            // 多条线
            for (const k in Strs) {
                const polyline = new global.DC.Polyline(Strs[k].value) // 加入绘画点
                polyline.setStyle({
                window.drawALineLayerManypolyline = new global.DC.Polyline(Strs[k].value) // 加入线
                window.drawALineLayerManypolyline.setStyle({
                    width: 6,
                    material: material1,
                    material: window.drawALineLayerManyStyle,
                    clampToGround: true
                })
                drawALineLayerMany.addOverlay(polyline)
                window.drawALineLayerMany.addOverlay(window.drawALineLayerManypolyline)
                // let post = Strs[k].value.split(";")[0].split(",");
                // let position = new global.DC.Position(post[0], post[1]);
                // let Label = new global.DC.Label(position, Strs[k].name);
@@ -1030,7 +1071,7 @@
            const point = value[1]
            for (const k in point) {
                const post = point[k].value
                const position = new global.DC.Position(post[0], post[1])
                window.drawAPointLayerManyposition = new global.DC.Position(post[0], post[1])

                // let billboard = new global.DC.Billboard(
                //   position,
@@ -1060,7 +1101,7 @@
                //   };
                //   dispatch("setMobileWindows", windowData);
                // });
                // drawALineLayerMany.addOverlay(billboard);
                // window.drawALineLayerMany.addOverlay(billboard);
                // let Labels = new global.DC.Label(position, point[k].name);
                // Labels.setStyle({
                //   font: "16px sans-serif", // CSS 字体设置
@@ -1072,9 +1113,9 @@
                //   // outlineWidth: 1, //边框大小，
                //   pixelOffset: { x: 0, y: -47 }, //偏移像素
                // });
                const Labels = new global.DC.DivIcon(
                window.drawAPointLayerManyLabels = new global.DC.DivIcon(
                    // new this.DC.Position(Number(item[0]), Number(item[1]), 0),
                    position,
                    window.drawAPointLayerManyposition,
                    `
              <div class="point-entitys-box">
                  <div class="point-logo">
@@ -1087,7 +1128,7 @@
          `
                )
                // 订阅事件
                Labels.on(global.DC.MouseEventType.CLICK, (e) => {
                window.drawAPointLayerManyLabels.on(global.DC.MouseEventType.CLICK, (e) => {
                    // console.log(e);
                    // return;
                    if (value[3]) {
@@ -1108,15 +1149,15 @@
                    }
                    dispatch('setMobileWindows', windowData)
                })
                drawAPointLayerMany.addOverlay(Labels)
                window.drawAPointLayerMany.addOverlay(window.drawAPointLayerManyLabels)
                // console.log(point[k]);
            }
            state.drawALineLayerMany = drawALineLayerMany
            state.drawAPointLayerMany = drawAPointLayerMany
            // state.drawALineLayerMany = drawALineLayerMany
            // state.drawAPointLayerMany = drawAPointLayerMany
            // state.isOpenDrawALineMany = value[2].name ? value[2].name : true;
            // commit("cameraSetView", state.navigationStartLngLat); //移动
        }
    }
}

export default mobile
export default mobile

 src/store/modules/mobiles/urlParameter.js

@@ -1,22 +1,26 @@
window.urlParameterLayer = null;
window.divIcon = null;


const urlParameter = {
    state: {
        urlParameterData: {},
        urlParameterLayer: null // 自定义标签图层
        // urlParameterLayer: null // 自定义标签图层
    },
    actions: {
        addurlParameterLayerIcon ({
        addurlParameterLayerIcon({
            state,
            commit,
            dispatch
        }, val) {
            const list = val.list
            if (val.clear) {
                //     state.urlParameterLayer.remove();
                state.urlParameterLayer.clear()
                //     window.urlParameterLayer.remove();
                window.urlParameterLayererLayer.clear()
            }
            for (const i in list) {
                // console.log(list[i], 112233)
                const divIcon = new global.DC.DivIcon(
                window.divIcon = new global.DC.DivIcon(
                    new global.DC.Position(
                        Number(list[i].jd),
                        Number(list[i].wd),
@@ -33,7 +37,7 @@
                          </div>
                      `
                )
                divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
                window.divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
                    const lntLat = [+list[i].jd, +list[i].wd]
                    const d = {
                        position: {},
@@ -48,27 +52,27 @@
                    }
                    dispatch('setMobileWindows', d)
                })
                state.urlParameterLayer.addOverlay(divIcon)
                window.urlParameterLayer.addOverlay(window.divIcon)
            }
        }
    },
    mutations: {
        initurlParameterLayer (state, val) {
            if (!state.urlParameterLayer) {
                state.urlParameterLayer = new global.DC.HtmlLayer('urlParameterLayer')
                state.mviewer.addLayer(state.urlParameterLayer)
        initurlParameterLayer(state, val) {
            if (!window.urlParameterLayer) {
                window.urlParameterLayer = new global.DC.HtmlLayer('urlParameterLayer')
                global.viewer.addLayer(window.urlParameterLayer)
            }
        },
        set_urlParameterData (state, val) {
        set_urlParameterData(state, val) {
            state.urlParameterData = val
        },

        clearurlParameterLayerIcon (state, val) {
            if (state.urlParameterLayer) {
                state.urlParameterLayer.clear()
        clearurlParameterLayerIcon(state, val) {
            if (window.urlParameterLayer) {
                window.urlParameterLayer.clear()
            }
        }
    }
}

export default urlParameter
export default urlParameter

 src/store/modules/popupParams copy.js

New file
@@ -0,0 +1,398 @@
import leftNavsData from './pc/leftNavsData'
window.labelLayer = null;
window.divIcon = null;


const popupParams = {
    state: {
        ...leftNavsData.state,
        popupBgUrl: null,
        pupupQRUrl: null,
        terminus: null,
        startingPoint: null,
        pointPosition: null,
        stateName: null,
        siteName: null,
        telephone: null,
        introduceText: null,
        detailsPopup: false,
        panoramaUrl: null,
        panoramaPopup: false,
        monitorUrl: null,
        monitorPopup: false,
        // 图集
        popupImgAtlas: [],
        teachList: [],
        liveList: [],
        addTagPopup: false,
        addTagPosition: null,

        // labelLayer: null, // 自定义标签图层
        addSignList: true,
        myviewer: null,
        nowlabelLayerData: {},
        labelLayerDataShow: false,

        closeMapClick: false // 关闭地图点击，防止新增标签误触
    },
    mutations: {
        ...leftNavsData.mutations,
        SET_POPUPBGURL(state, popupBgUrl) {
            // console.log(popupBgUrl, "see33333")
            if (!popupBgUrl) {
                return
            }
            state.popupBgUrl = popupBgUrl
        },
        SET_POPUPQRURL(state, pupupQRUrl) {
            state.pupupQRUrl = pupupQRUrl
        },
        SET_TERMINUS(state, terminus) {
            state.terminus = terminus
        },
        SET_STARTINGPOINT(state, startingPoint) {
            state.startingPoint = startingPoint
        },
        SET_POINTPOSITION(state, pointPosition) {
            state.pointPosition = pointPosition
        },
        SET_STATENAME(state, stateName) {
            state.stateName = stateName
        },
        SET_SITENAME(state, siteName) {
            state.siteName = siteName
        },
        SET_TELEPHONE(state, telephone) {
            state.telephone = telephone
        },
        SET_INTRODUCETEXT(state, introduceText) {
            state.introduceText = introduceText
        },
        SET_PANORAMAURL(state, panoramaUrl) {
            state.panoramaUrl = panoramaUrl
        },
        SET_PANORAMAPOPUP(state, panoramaPopup) {
            state.panoramaPopup = panoramaPopup
        },
        SET_MONITORURL(state, monitorUrl) {
            state.monitorUrl = monitorUrl
        },
        SET_MONITORPOPUP(state, monitorPopup) {
            state.monitorPopup = monitorPopup
        },
        SET_DETAILSPOPUP(state, detailsPopup) {
            state.detailsPopup = detailsPopup
        },
        SET_POPUPIMGATLAS(state, popupImgAtlas) {
            state.popupImgAtlas = popupImgAtlas
        },
        SET_TEACHLIST(state, teachList) {
            state.teachList = teachList
        },
        SET_LIVELIST(state, liveList) {
            state.liveList = liveList
        },

        SET_ADDTAGPOPUP(state, addTagPopup) {
            state.addTagPopup = addTagPopup
        },

        SET_ADDTAGPOSITION(state, addTagPosition) {
            state.addTagPosition = addTagPosition
        },
        initLabelLayer(state, val) {
            if (!window.labelLayer) {
                window.labelLayer = new global.DC.HtmlLayer('labelLayer')
                val.addLayer(window.labelLayer)
            }
            state.myviewer = val
        },

        clearLabelLayerIcon(state, val) {
            if (window.labelLayer) {
                window.labelLayer.clear()
            }
        },
        openLabelLayer(state, val) {
            // console.log(val, "see")
            if (val.show) {
                state.nowlabelLayerData = val.data
                state.labelLayerDataShow = true
            } else {
                state.nowlabelLayerData = {}
                state.labelLayerDataShow = false
            }
        },
        CLEAR_ALL(state, param) {
            state.siteName = param
            state.introduceText = param
            state.telephone = param
            state.panoramaUrl = param
            state.monitorUrl = param
            state.popupBgUrl = param
            state.teachList = []
            state.liveList = []
        },
        set_closeMapClick(state, val) {
            state.closeMapClick = val
        }
    },
    actions: {
        ...leftNavsData.actions,
        openPopups({
            state,
            commit,
            dispatch
        }, value) {
            //     //订阅事件
            //   divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
            //     console.log(item);
            //     that.openPopups({
            //       lng: e.overlay.position.lng,
            //       lat: e.overlay.position.lat,
            //       item: item,
            //     });
            //   });
            new global.DC.DivForms(state.viewer, {
                domId: 'divFormsDomBox',
                position: [
                    global.DC.Transform.transformWGS84ToCartesian(
                        new global.DC.Position(
                            Number(value.lng),
                            Number(value.lat),
                            Number(value.alt || 0)
                        )
                    )
                ]
            })
            dispatch('setOurDataInPoput', value)
            dispatch('pcFlyView', {
                jd: value.lng,
                wd: value.lat,
                viewer: this.viewer
            })
        },
        setOurDataInPoput({
            state,
            commit,
            dispatch
        }, value) {
            // 弹窗使用方法

            commit('CLEAR_ALL', null)
            commit('SET_MONITORPOPUP', false)
            commit('SET_PANORAMAPOPUP', false)
            commit('SET_STATENAME', value.item.mechanismname)
            commit('SET_PANORAMAURL', value.item.panoramaurl)
            commit('SET_INTRODUCETEXT', value.item.introduce)
            var imgArr = []
            if (value.item.tpurl) {
                imgArr = value.item.tpurl.split(',')
            }
            commit('SET_POPUPBGURL', imgArr[0])
            commit('SET_POPUPIMGATLAS', imgArr)
            commit('SET_POPUPQRURL', value.item.codeurl)
            commit('SET_POINTPOSITION', [
                Number(value.lng),
                Number(value.lat),
                Number(0),
                Number(0),
                Number(-90),
                Number(0)
            ])
            commit('SET_DETAILSPOPUP', true)
        },
        pcMoveView({
            state,
            commit,
            dispatch
        }, val) {
            global.viewer.camera.setView({
                // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                // fromDegrees()方法，将经纬度和高程转换为世界坐标
                destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                    +val.jd,
                    +val.wd,
                    400.0
                ),
                orientation: {
                    // 指向
                    heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                    // 视角
                    pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                    roll: 0.0
                }
            })
        },
        pcFlyView({
            state,
            commit,
            dispatch
        }, val) {
            val.viewer.flyToPosition(
                new global.DC.Position(Number(val.jd), Number(val.wd), Number(300), Number(0), Number(-90), Number(0)),
                function () {},
                2
            )
        },
        addLabelLayerIcon({
            state,
            commit,
            dispatch
        }, val) {
            const list = val.list
            if (val.clear) {
                //     window.labelLayer.remove();
                window.labelLayer.clear()
            }
            if (val.add) { // 刷新列表
                state.addSignList = !state.addSignList
                return
            }
            for (const i in list) {
                const divIcon = new global.DC.DivIcon(
                    new global.DC.Position(
                        Number(list[i].jd),
                        Number(list[i].wd),
                        0
                    ),
                    `
                              <div class="tag-entitys-box">
                                  <div class="tag-content">
                                      ${list[i].name}
                                  </div>
                                  <div class="tag-angle-content">
                                      <img src="https://map.hit.edu.cn/images/tarrow_xq.png">
                                  </div>
                              </div>
                          `
                )
                // 订阅事件
                window.divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
                    // console.log(e);
                    // return;
                    // 定制化窗体
                    const position = e.position
                    const lntLat = [e.overlay._position._lng, e.overlay._position._lat]
                    // console.log(position, lntLat, list[i], state.myviewer, "see")
                    new global.DC.DivForms(state.myviewer, {
                        domId: 'labelLayerid',
                        position: [
                            global.DC.Transform.transformWGS84ToCartesian(
                                new global.DC.Position(
                                    Number(lntLat[0]),
                                    Number(lntLat[1]),
                                    Number(0)
                                )
                            )
                        ]
                    })
                    state.myviewer.camera.setView({
                        // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                        // fromDegrees()方法，将经纬度和高程转换为世界坐标
                        destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                            lntLat[0],
                            lntLat[1],
                            400.0
                        ),
                        orientation: {
                            // 指向
                            heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                            // 视角
                            pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                            roll: 0.0
                        }
                    })
                    commit('openLabelLayer', {
                        show: true,
                        data: list[i]
                    })
                })
                window.labelLayer.addOverlay(window.divIcon)
            }
        },
        addLabelLayerIconMobelUse({
            state,
            commit,
            dispatch
        }, val) {
            const list = val.list
            if (!window.labelLayer) {
                window.labelLayer = new global.DC.HtmlLayer('labelLayer')
                global.viewer.addLayer(window.labelLayer)
                // state.myviewer = val.mviewer
            }
            if (val.clear) {
                //     window.labelLayer.remove();
                window.labelLayer.clear()
            }
            if (val.add) { // 刷新列表
                state.addSignList = !state.addSignList
                return
            }
            for (let i in list) {
                window.divIcon = new global.DC.DivIcon(
                    new global.DC.Position(
                        Number(list[i].jd),
                        Number(list[i].wd),
                        0
                    ),
                    `
                              <div class="tag-entitys-box">
                                  <div class="tag-content">
                                      ${list[i].name}
                                  </div>
                                  <div class="tag-angle-content">
                                      <img src="https://map.hit.edu.cn/images/tarrow_xq.png">
                                  </div>
                              </div>
                          `
                )
                // 订阅事件
                window.divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
                    // console.log(e);
                    // return;
                    // 定制化窗体
                    const position = e.position
                    const lntLat = [e.overlay._position._lng, e.overlay._position._lat]
                    // console.log(position, lntLat, list[i], state.myviewer, "see")
                    new global.DC.DivForms(state.myviewer, {
                        domId: 'labelLayerid',
                        position: [
                            global.DC.Transform.transformWGS84ToCartesian(
                                new global.DC.Position(
                                    Number(lntLat[0]),
                                    Number(lntLat[1]),
                                    Number(0)
                                )
                            )
                        ]
                    })
                    global.viewer.camera.setView({
                        // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                        // fromDegrees()方法，将经纬度和高程转换为世界坐标
                        destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                            lntLat[0],
                            lntLat[1],
                            400.0
                        ),
                        orientation: {
                            // 指向
                            heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                            // 视角
                            pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                            roll: 0.0
                        }
                    })
                    commit('openLabelLayer', {
                        show: true,
                        data: list[i]
                    })
                })
                window.labelLayer.addOverlay(window.divIcon)
            }
        }
    }
}

export default popupParams

 src/store/modules/popupParams.js

@@ -1,4 +1,8 @@
import leftNavsData from './pc/leftNavsData'
window.labelLayer = null;
window.divIcon = null;


const popupParams = {
    state: {
        ...leftNavsData.state,
@@ -23,7 +27,7 @@
        addTagPopup: false,
        addTagPosition: null,

        labelLayer: null, // 自定义标签图层
        // labelLayer: null, // 自定义标签图层
        addSignList: true,
        myviewer: null,
        nowlabelLayerData: {},
@@ -33,83 +37,83 @@
    },
    mutations: {
        ...leftNavsData.mutations,
        SET_POPUPBGURL (state, popupBgUrl) {
        SET_POPUPBGURL(state, popupBgUrl) {
            // console.log(popupBgUrl, "see33333")
            if (!popupBgUrl) {
                return
            }
            state.popupBgUrl = popupBgUrl
        },
        SET_POPUPQRURL (state, pupupQRUrl) {
        SET_POPUPQRURL(state, pupupQRUrl) {
            state.pupupQRUrl = pupupQRUrl
        },
        SET_TERMINUS (state, terminus) {
        SET_TERMINUS(state, terminus) {
            state.terminus = terminus
        },
        SET_STARTINGPOINT (state, startingPoint) {
        SET_STARTINGPOINT(state, startingPoint) {
            state.startingPoint = startingPoint
        },
        SET_POINTPOSITION (state, pointPosition) {
        SET_POINTPOSITION(state, pointPosition) {
            state.pointPosition = pointPosition
        },
        SET_STATENAME (state, stateName) {
        SET_STATENAME(state, stateName) {
            state.stateName = stateName
        },
        SET_SITENAME (state, siteName) {
        SET_SITENAME(state, siteName) {
            state.siteName = siteName
        },
        SET_TELEPHONE (state, telephone) {
        SET_TELEPHONE(state, telephone) {
            state.telephone = telephone
        },
        SET_INTRODUCETEXT (state, introduceText) {
        SET_INTRODUCETEXT(state, introduceText) {
            state.introduceText = introduceText
        },
        SET_PANORAMAURL (state, panoramaUrl) {
        SET_PANORAMAURL(state, panoramaUrl) {
            state.panoramaUrl = panoramaUrl
        },
        SET_PANORAMAPOPUP (state, panoramaPopup) {
        SET_PANORAMAPOPUP(state, panoramaPopup) {
            state.panoramaPopup = panoramaPopup
        },
        SET_MONITORURL (state, monitorUrl) {
        SET_MONITORURL(state, monitorUrl) {
            state.monitorUrl = monitorUrl
        },
        SET_MONITORPOPUP (state, monitorPopup) {
        SET_MONITORPOPUP(state, monitorPopup) {
            state.monitorPopup = monitorPopup
        },
        SET_DETAILSPOPUP (state, detailsPopup) {
        SET_DETAILSPOPUP(state, detailsPopup) {
            state.detailsPopup = detailsPopup
        },
        SET_POPUPIMGATLAS (state, popupImgAtlas) {
        SET_POPUPIMGATLAS(state, popupImgAtlas) {
            state.popupImgAtlas = popupImgAtlas
        },
        SET_TEACHLIST (state, teachList) {
        SET_TEACHLIST(state, teachList) {
            state.teachList = teachList
        },
        SET_LIVELIST (state, liveList) {
        SET_LIVELIST(state, liveList) {
            state.liveList = liveList
        },

        SET_ADDTAGPOPUP (state, addTagPopup) {
        SET_ADDTAGPOPUP(state, addTagPopup) {
            state.addTagPopup = addTagPopup
        },

        SET_ADDTAGPOSITION (state, addTagPosition) {
        SET_ADDTAGPOSITION(state, addTagPosition) {
            state.addTagPosition = addTagPosition
        },
        initLabelLayer (state, val) {
            if (!state.labelLayer) {
                state.labelLayer = new global.DC.HtmlLayer('labelLayer')
                val.addLayer(state.labelLayer)
        initLabelLayer(state, val) {
            if (!window.labelLayer) {
                window.labelLayer = new global.DC.HtmlLayer('labelLayer')
                val.addLayer(window.labelLayer)
            }
            state.myviewer = val
        },

        clearLabelLayerIcon (state, val) {
            if (state.labelLayer) {
                state.labelLayer.clear()
        clearLabelLayerIcon(state, val) {
            if (window.labelLayer) {
                window.labelLayer.clear()
            }
        },
        openLabelLayer (state, val) {
        openLabelLayer(state, val) {
            // console.log(val, "see")
            if (val.show) {
                state.nowlabelLayerData = val.data
@@ -119,7 +123,7 @@
                state.labelLayerDataShow = false
            }
        },
        CLEAR_ALL (state, param) {
        CLEAR_ALL(state, param) {
            state.siteName = param
            state.introduceText = param
            state.telephone = param
@@ -129,13 +133,13 @@
            state.teachList = []
            state.liveList = []
        },
        set_closeMapClick (state, val) {
        set_closeMapClick(state, val) {
            state.closeMapClick = val
        }
    },
    actions: {
        ...leftNavsData.actions,
        openPopups ({
        openPopups({
            state,
            commit,
            dispatch
@@ -149,7 +153,7 @@
            //       item: item,
            //     });
            //   });
            var popup = new global.DC.DivForms(state.viewer, {
            new global.DC.DivForms(state.viewer, {
                domId: 'divFormsDomBox',
                position: [
                    global.DC.Transform.transformWGS84ToCartesian(
@@ -168,7 +172,7 @@
                viewer: this.viewer
            })
        },
        setOurDataInPoput ({
        setOurDataInPoput({
            state,
            commit,
            dispatch
@@ -198,12 +202,12 @@
            ])
            commit('SET_DETAILSPOPUP', true)
        },
        pcMoveView ({
        pcMoveView({
            state,
            commit,
            dispatch
        }, val) {
            val.viewer.camera.setView({
            global.viewer.camera.setView({
                // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                // fromDegrees()方法，将经纬度和高程转换为世界坐标
                destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
@@ -220,26 +224,26 @@
                }
            })
        },
        pcFlyView ({
        pcFlyView({
            state,
            commit,
            dispatch
        }, val) {
            val.viewer.flyToPosition(
                new global.DC.Position(Number(val.jd), Number(val.wd), Number(300), Number(0), Number(-90), Number(0)),
                function () { },
                function () {},
                2
            )
        },
        addLabelLayerIcon ({
        addLabelLayerIcon({
            state,
            commit,
            dispatch
        }, val) {
            const list = val.list
            if (val.clear) {
                //     state.labelLayer.remove();
                state.labelLayer.clear()
                //     window.labelLayer.remove();
                window.labelLayer.clear()
            }
            if (val.add) { // 刷新列表
                state.addSignList = !state.addSignList
@@ -264,14 +268,14 @@
                          `
                )
                // 订阅事件
                divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
                window.divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
                    // console.log(e);
                    // return;
                    // 定制化窗体
                    const position = e.position
                    // const position = e.position
                    const lntLat = [e.overlay._position._lng, e.overlay._position._lat]
                    // console.log(position, lntLat, list[i], state.myviewer, "see")
                    new global.DC.DivForms(state.myviewer, {
                    new global.DC.DivForms(global.viewer, {
                        domId: 'labelLayerid',
                        position: [
                            global.DC.Transform.transformWGS84ToCartesian(
@@ -283,7 +287,7 @@
                            )
                        ]
                    })
                    state.myviewer.camera.setView({
                    global.viewer.camera.setView({
                        // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                        // fromDegrees()方法，将经纬度和高程转换为世界坐标
                        destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
@@ -304,30 +308,30 @@
                        data: list[i]
                    })
                })
                state.labelLayer.addOverlay(divIcon)
                window.labelLayer.addOverlay(window.divIcon)
            }
        },
        addLabelLayerIconMobelUse ({
        addLabelLayerIconMobelUse({
            state,
            commit,
            dispatch
        }, val) {
            const list = val.list
            if (!state.labelLayer) {
                state.labelLayer = new global.DC.HtmlLayer('labelLayer')
                val.mviewer.addLayer(state.labelLayer)
                state.myviewer = val.mviewer
            if (!window.labelLayer) {
                window.labelLayer = new global.DC.HtmlLayer('labelLayer')
                global.viewer.addLayer(window.labelLayer)
                // state.myviewer = val.mviewer
            }
            if (val.clear) {
                //     state.labelLayer.remove();
                state.labelLayer.clear()
                //     window.labelLayer.remove();
                window.labelLayer.clear()
            }
            if (val.add) { // 刷新列表
                state.addSignList = !state.addSignList
                return
            }
            for (const i in list) {
                const divIcon = new global.DC.DivIcon(
            for (let i in list) {
                window.divIcon = new global.DC.DivIcon(
                    new global.DC.Position(
                        Number(list[i].jd),
                        Number(list[i].wd),
@@ -345,14 +349,14 @@
                          `
                )
                // 订阅事件
                divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
                window.divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
                    // console.log(e);
                    // return;
                    // 定制化窗体
                    const position = e.position
                    // const position = e.position
                    const lntLat = [e.overlay._position._lng, e.overlay._position._lat]
                    // console.log(position, lntLat, list[i], state.myviewer, "see")
                    new global.DC.DivForms(state.myviewer, {
                    new global.DC.DivForms(global.viewer, {
                        domId: 'labelLayerid',
                        position: [
                            global.DC.Transform.transformWGS84ToCartesian(
@@ -364,7 +368,7 @@
                            )
                        ]
                    })
                    state.myviewer.camera.setView({
                    global.viewer.camera.setView({
                        // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                        // fromDegrees()方法，将经纬度和高程转换为世界坐标
                        destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
@@ -385,10 +389,10 @@
                        data: list[i]
                    })
                })
                state.labelLayer.addOverlay(divIcon)
                window.labelLayer.addOverlay(window.divIcon)
            }
        }
    }
}

export default popupParams
export default popupParams