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

liuyg

2022-03-15 7366b0a279425cb6218bec8ba19774e5e8399b91

 src/components/map/components/mapPopup.vue

@@ -78,9 +78,7 @@
                                                    v-show="panoramaUrl != null && panoramaUrl != ''"
                                                    @click="panoramaClick"
                                                >
                                                    <i
                                                        class="popup-icon live-action-nav deblurring"
                                                    ></i>
                          <i class="popup-icon live-action-nav deblurring"></i>
                                                    实景
                                                </li>
                                                <!-- v-show="panoramaUrl != null && panoramaUrl != ''" -->
@@ -99,12 +97,16 @@
                                                    v-show="teachList.length > 0"
                                                    :class="{ on: tabBtnFlag == '教学科研行政' }"
                                                    @click="tabBtnClick('教学科研行政')"
                                                >教学科研行政</li>
                        >
                          教学科研行政
                        </li>
                                                <li
                                                    v-show="liveList.length > 0"
                                                    :class="{ on: tabBtnFlag == '生活服务' }"
                                                    @click="tabBtnClick('生活服务')"
                                                >生活服务</li>
                        >
                          生活服务
                        </li>
                                            </ul>
                                            <div class="btm-content">
                                                <div :class="{ on: tabBtnFlag == '教学科研行政' }">
@@ -251,10 +253,15 @@
                                    </div>
                                    <div class="add-tag-content">
                                        <div>
                                            <el-input v-model="addTagName" placeholder="请输入标签名称"></el-input>
                      <el-input
                        v-model="addTagName"
                        placeholder="请输入标签名称"
                      ></el-input>
                                        </div>
                                        <div>
                                            <el-button type="primary" @click="createTag">生成标记</el-button>
                      <el-button type="primary" @click="createTag"
                        >生成标记</el-button
                      >
                                        </div>
                                    </div>
                                </div>
@@ -309,7 +316,11 @@
        </div>

        <!-- 新增编辑标签 -->
        <div v-if="addIconsLayerIconPopup" class="monitor-dom add-sign-box-style" id="leftNavsAdd">
    <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">
@@ -392,14 +403,17 @@
                                                        v-for="(itemc, indexc) in item.chouse"
                                                        :key="indexc"
                                                        :command="{ index: index, indexc: indexc }"
                                                    >{{ itemc.value }}</el-dropdown-item>
                            >{{ 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>
                    <el-button type="primary" @click="saveIconsLayer"
                      >保存标签</el-button
                    >
                                    </div>
                                </div>
                            </div>
@@ -442,7 +456,9 @@
            line-height: 36px;
            text-align: center;
          "
                >(右键另存为图片)</div>
        >
          (右键另存为图片)
        </div>
            </div>
        </el-dialog>

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

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

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

                // {
                //   label: "图片",
@@ -686,171 +702,171 @@
                //   },
                //   span: 10,
                // },
            ]
        }
      ],
    };
    },
    computed: {
        ...mapGetters([
            'popupBgUrl',
            'pupupQRUrl',
      "popupBgUrl",
      "pupupQRUrl",
            // 终点
            'terminus',
      "terminus",
            // 起点
            'startingPoint',
      "startingPoint",
            // 点信息
            'pointPosition',
      "pointPosition",
            // 点名称
            'stateName',
      "stateName",
            // 地址
            'siteName',
      "siteName",
            // 电话
            'telephone',
      "telephone",
            // 介绍
            'introduceText',
      "introduceText",
            // 详情弹框显示关闭
            'detailsPopup',
      "detailsPopup",
            // 全景地址
            'panoramaUrl',
      "panoramaUrl",
            // 全景弹框显示关闭
            'panoramaPopup',
      "panoramaPopup",
            // 监控地址
            'monitorUrl',
      "monitorUrl",
            // 监控弹框显示关闭
            'monitorPopup',
      "monitorPopup",

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

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

        this.audioMsg.onend = function () {
            this.audioSynth.cancel()
            this.audioFlag = false
            this.audioCourse = false
        }
      this.audioSynth.cancel();
      this.audioFlag = false;
      this.audioCourse = false;
    };
    },
    mounted () {
        global.viewer.scene.globe.depthTestAgainstTerrain = false
    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]
        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
            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.addIconFromcolumn[k].valueid = "1";
            continue;
                    }
                    this.addIconFromcolumn[k].value = ''
          this.addIconFromcolumn[k].value = "";
                }
                this.ourImages = []
                this.$store.commit('set_closeMapClick', false) // 开启其他操作
        this.ourImages = [];
        this.$store.commit("set_closeMapClick", false); // 开启其他操作
            }
        },
        addTagPopup () {
            if (!this.addTagPopup) {
                // console.log("取消", "see");
                this.$store.commit('set_closeMapClick', false)
        this.$store.commit("set_closeMapClick", false);
            }
        },
        introduceText: {
            immediate: true,
            handler (newQuestion, oldQuestion) {
                this.audioSource = newQuestion
        this.audioSource = newQuestion;
                if (this.audioFlag == true) {
                    this.audioSynth.cancel()
                    this.audioFlag = false
                    this.audioCourse = false
          this.audioSynth.cancel();
          this.audioFlag = false;
          this.audioCourse = false;
                }
            }
      },
        },
        teachList: {
            immediate: true,
            handler (newCode, oldCode) {
                if (newCode.length > 0) {
                    this.tabBtnFlag = '教学科研行政'
          this.tabBtnFlag = "教学科研行政";
                }
            }
      },
        },
        liveList: {
            immediate: true,
            handler (newCode, oldCode) {
                if (newCode.length > 0 && this.teachList.length == 0) {
                    this.tabBtnFlag = '生活服务'
          this.tabBtnFlag = "生活服务";
                }
            }
      },
        },
        detailsPopup: {
            immediate: true,
            handler (newCode, oldCode) {
                if (newCode == false) {
                    this.audioSynth.cancel()
                    this.audioFlag = false
                    this.audioCourse = false
          this.audioSynth.cancel();
          this.audioFlag = false;
          this.audioCourse = false;
                } else {
                    if (this.audioFlag == true) {
                        this.audioSynth.cancel()
                        this.audioFlag = false
                        this.audioCourse = false
            this.audioSynth.cancel();
            this.audioFlag = false;
            this.audioCourse = false;
                    }
                }
            }
        }
      },
    },
    },
    methods: {
        onsuccess (response, file, fileList) {
            this.ourImages = fileList
      this.ourImages = fileList;
        },
        handleRemove (file, fileList) {
            this.ourImages = fileList
      this.ourImages = fileList;
        },
        handlePictureCardPreview (file) {
            this.dialogImageUrl = file.url
            this.dialogVisible = true
      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].chouse[item.indexc].value;
            this.addIconFromcolumn[item.index].valueid =
                this.addIconFromcolumn[item.index].chouse[item.indexc].id
        this.addIconFromcolumn[item.index].chouse[item.indexc].id;
        },
        closeaddIconsLayerIconPopup () {
            this.$store.commit('SET_addIconsLayerIconPopup', false)
      this.$store.commit("SET_addIconsLayerIconPopup", false);
        },
        saveIconsLayer () {
            var imgs = []
      var imgs = [];
            // console.log("see", this.ourImages);
            // return;
            for (var k in this.ourImages) {
                imgs.push(this.ourImages[k].response)
        imgs.push(this.ourImages[k].response);
            }
            const d = {
                tpurl: imgs.join(','),
        tpurl: imgs.join(","),
                mechanismname: this.addIconFromcolumn[0].value,
                telephone: this.addIconFromcolumn[1].value,
                type: this.addIconFromcolumn[2].valueid,
@@ -865,249 +881,256 @@
                heading: this.addIconFromcolumn[11].value,
                pitch: this.addIconFromcolumn[12].value,
                roll: this.addIconFromcolumn[13].value,
                gd: this.addIconFromcolumn[14].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()
            type: "success",
            message: "操作成功!",
          });
          this.closeaddIconsLayerIconPopup();
                },
                (error) => {
                    window.console.log(error)
          window.console.log(error);
                }
            )
      );
        },
        screen () {
            if (this.fullscreen) {
                this.fullScreenUrl = '/img/icon/bigScreen.png'
                this.fullscreen = !this.fullscreen
        this.fullScreenUrl = "/img/icon/bigScreen.png";
        this.fullscreen = !this.fullscreen;

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

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

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

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

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

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

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

        panoramaClick () {
            if (this.audioFlag == true) {
                this.audioSynth.cancel()
                this.audioFlag = false
                this.audioCourse = false
        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]
            })
        domId: "PanoramaBox",
        position: [positions],
      });

            this.$store.commit('SET_DETAILSPOPUP', false)
            this.$store.commit('SET_MONITORPOPUP', false)
            this.$store.commit('SET_PANORAMAPOPUP', true)
      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
        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)
        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]
            })
        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)
      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.audioSynth.cancel();
        this.audioFlag = false;
        this.audioCourse = false;
            }
            this.$store.commit('SET_DETAILSPOPUP', false)
      this.$store.commit("SET_DETAILSPOPUP", false);
        },

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

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

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

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

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

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

        closeMonitorPopupBox () {
            this.$store.commit('SET_MONITORURL', '')
            this.$store.commit('SET_MONITORPOPUP', false)
      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
        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
          this.audioSynth.pause();
          this.audioCourse = false;
                } else {
                    this.audioSynth.resume()
                    this.audioCourse = true
          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 result = res.data.data;
        this.$store.commit("CLEAR_ALL", null);

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

                this.$store.commit('SET_POPUPBGURL', imgArr[0])
                this.$store.commit('SET_POPUPQRURL', result.codeurl)
                this.$store.commit('SET_POINTPOSITION', [
        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)
          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)
        if (result.videourl && result.videourl != "") {
          this.$store.commit("SET_MONITORURL", result.videourl);
                }

                this.newPopup(result)
        this.newPopup(result);
                global.viewer.flyToPosition(
                    new global.DC.Position(
                        Number(result.jd),
@@ -1119,33 +1142,37 @@
                    ),
                    function () { },
                    3
                )
            })
        );
      });
        },

        newPopup (item) {
            const position = global.DC.Transform.transformWGS84ToCartesian(
                new global.DC.Position(Number(item.jd), Number(item.wd), Number(item.gd))
        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]
            })
        domId: "divFormsDomBox",
        position: [position],
      });

            this.$store.commit('SET_PANORAMAPOPUP', false)
            this.$store.commit('SET_MONITORPOPUP', false)
            this.$store.commit('SET_DETAILSPOPUP', true)
      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, '')
        }
    }
}
      return str.replace(/(^\s*)|(\s*$)/g, "");
    },
  },
};
</script>

<style lang="scss">