1

mayisheng

2022-08-15 81f54040c2cb65537c6c6e1db8358a39a57dea0d

 src/components/map/components/mapPopup.vue

@@ -19,7 +19,7 @@
                                            v-show="introduceText != null && introduceText != ''"
                                            @click="audioPlay"
                                            class="audio-control"
                                            src="/img/navicon/audio.png"
                                            :src="audioImgUrl"
                                            alt
                                        />
                                        <img
@@ -66,7 +66,7 @@
                                                    <i class="popup-icon start-nav deblurring"></i>
                                                    出发
                                                </li>
                                                <li v-show="false" @click="qrCodeClick">
                                                <li v-show="pupupQRUrl != ''" @click="qrCodeClick">
                                                    <i class="popup-icon qr-code-nav deblurring"></i>
                                                    二维码
                                                </li>
@@ -164,6 +164,12 @@
                                id="FullScreenBox"
                            >
                                <div class="title">
                                    <img
                                        @click="returnDetailsPopup"
                                        class="return-btn"
                                        src="/img/icon/return.png"
                                        alt
                                    />
                                    {{ stateName }}
                                    <img
                                        @click="screen"
@@ -198,6 +204,12 @@
                        <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"
@@ -207,7 +219,10 @@
                                    />
                                </div>
                                <div class="content">
                                    <video :src="monitorUrl" controls autoplay></video>
                                    <play-video
                                        :sourceUrl="monitorUrl"
                                        @playStatus="changePlayStatus"
                                    ></play-video>
                                </div>
                            </div>
                        </div>
@@ -268,7 +283,7 @@
                                <div class="arrow-rb"></div>
                                <div class="label-wrap">
                                    <div class="title">
                                        {{ nowlabelLayerData.name }} &nbsp; 二维码分享
                                        {{ nowlabelLayerData.name }}
                                        <img
                                            @click="closelabelLayerid"
                                            class="close-box"
@@ -461,6 +476,7 @@
            apiUrls: null,
            tabBtnFlag: '教学科研行政',
            QRCodeFlag: false,
            audioImgUrl: '/img/icon/close-video.png',
            audioSource: '',
            audioFlag: false,
            audioCourse: false,
@@ -469,7 +485,6 @@
            fullscreen: false,
            fullScreenUrl: '/img/icon/bigScreen.png',
            addTagName: '',
            addTagLayer: null,
            addIconFromcolumn: [
                // 顺序不要随便换
                {
@@ -680,7 +695,6 @@
    },
    computed: {
        ...mapGetters([
            'viewer',
            'popupBgUrl',
            'pupupQRUrl',
            // 终点
@@ -725,18 +739,21 @@
        ])
    },
    created () {
        var that = this
        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
        }
        this.$nextTick(() => {
            this.audioMsg.onend = function () {
                that.audioSynth.cancel()
                that.audioFlag = false
                that.audioCourse = false
                that.audioImgUrl = '/img/icon/close-video.png'
            }
        })
    },
    mounted () { },
    watch: {
        addIconsLayerIconPopup () {
            if (this.addIconsLayerIconPopup) {
@@ -774,6 +791,7 @@
                    this.audioSynth.cancel()
                    this.audioFlag = false
                    this.audioCourse = false
                    this.audioImgUrl = '/img/icon/close-video.png'
                }
            }
        },
@@ -797,14 +815,19 @@
            immediate: true,
            handler (newCode, oldCode) {
                if (newCode == false) {
                    this.audioSynth.cancel()
                    if (this.audioSynth != null) {
                        this.audioSynth.cancel()
                    }
                    this.audioFlag = false
                    this.audioCourse = false
                } else {
                    if (this.audioFlag == true) {
                        this.audioSynth.cancel()
                        if (this.audioSynth != null) {
                            this.audioSynth.cancel()
                        }
                        this.audioFlag = false
                        this.audioCourse = false
                        this.audioImgUrl = '/img/icon/close-video.png'
                    }
                }
            }
@@ -859,11 +882,20 @@
            // return;
            // this.$store.commit("set_closeMapClick", false); //开启其他操作
            add(d).then(
                () => {
                    this.$message({
                        type: 'success',
                        message: '操作成功!'
                    })
                (res) => {
                    // console.log(res);
                    if (res.data.code == 200) {
                        this.$message({
                            type: 'success',
                            message: '操作成功!'
                        })
                    } else {
                        this.$message({
                            type: 'error',
                            message: '新增失败!'
                        })
                    }

                    this.closeaddIconsLayerIconPopup()
                },
                (error) => {
@@ -918,6 +950,7 @@
                this.audioSynth.cancel()
                this.audioFlag = false
                this.audioCourse = false
                this.audioImgUrl = '/img/icon/close-video.png'
            }

            // eslint-disable-next-line new-cap
@@ -925,9 +958,9 @@
                // eslint-disable-next-line new-cap
                new global.DC.Position.fromArray(this.pointPosition)
            )
            this.viewer.scene.globe.depthTestAgainstTerrain = false

            // eslint-disable-next-line no-unused-vars
            var panorama = new global.DC.PanoramaBox(this.viewer, {
            var panorama = new global.DC.PanoramaBox(global.viewer, {
                domId: 'PanoramaBox',
                position: [positions]
            })
@@ -942,15 +975,15 @@
                this.audioSynth.cancel()
                this.audioFlag = false
                this.audioCourse = false
                this.audioImgUrl = '/img/icon/close-video.png'
            }
            // 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)
            )
            this.viewer.scene.globe.depthTestAgainstTerrain = false
            // eslint-disable-next-line no-unused-vars
            var monitor = new global.DC.PanoramaBox(this.viewer, {
            var monitor = new global.DC.PanoramaBox(global.viewer, {
                domId: 'MonitorBox',
                position: [positions]
            })
@@ -959,11 +992,34 @@
            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.audioImgUrl = '/img/icon/close-video.png'
            }
            this.$store.commit('SET_DETAILSPOPUP', false)
        },
@@ -989,11 +1045,6 @@

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

            //   if (this.addTagLayer == null) {
            //     this.addTagLayer = new global.DC.HtmlLayer("addTagLayer");
            //     this.viewer.addLayer(this.addTagLayer);
            //   }

            // 2022.3.2对接接口
            // 新增标签
            const data = {
@@ -1002,7 +1053,14 @@
                wd: this.addTagPosition.lat
            }
            //   console.log(data);
            const oks = setTimeout(() => {
                that.$message({
                    message: '新增标签失败',
                    type: 'warning'
                })
            }, 5000)
            setlabel(data).then((res) => {
                clearTimeout(oks)
                if (res.data.code == 200) {
                    doit()
                    that.$message({
@@ -1022,24 +1080,6 @@
                    // list: [data],
                    add: true
                })
                // const divIcon = new global.DC.DivIcon(
                //   new global.DC.Position(
                //     Number(that.addTagPosition.lng),
                //     Number(that.addTagPosition.lat),
                //     0
                //   ),
                //   `
                //                 <div class="tag-entitys-box">
                //                     <div class="tag-content">
                //                         ${that.addTagName}
                //                     </div>
                //                     <div class="tag-angle-content">
                //                         <img src="https://map.hit.edu.cn/images/tarrow_xq.png">
                //                     </div>
                //                 </div>
                //             `
                // );
                // this.addTagLayer.addOverlay(divIcon);
            }
        },

@@ -1053,19 +1093,26 @@
            this.$store.commit('SET_MONITORPOPUP', false)
        },

        changePlayStatus (status) { // 获取子组件的播放状态
            console.log(status)
        },

        audioPlay () {
            if (this.audioFlag == false) {
                this.audioMsg.text = this.audioSource
                this.audioSynth.speak(this.audioMsg)
                this.audioFlag = true
                this.audioCourse = true
                this.audioImgUrl = '/img/icon/start-video.png'
            } else {
                if (this.audioCourse == true) {
                    this.audioSynth.pause()
                    this.audioCourse = false
                    this.audioImgUrl = '/img/icon/close-video.png'
                } else {
                    this.audioSynth.resume()
                    this.audioCourse = true
                    this.audioImgUrl = '/img/icon/start-video.png'
                }
            }
        },
@@ -1098,7 +1145,7 @@
                }

                this.newPopup(result)
                this.viewer.flyToPosition(
                global.viewer.flyToPosition(
                    new global.DC.Position(
                        Number(result.jd),
                        Number(result.wd),
@@ -1115,10 +1162,14 @@

        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(this.viewer, {
            var popup = new global.DC.DivForms(global.viewer, {
                domId: 'divFormsDomBox',
                position: [position]
            })
@@ -1166,4 +1217,9 @@
        padding: 0 10px;
    }
}
.introduce p {
    padding: 0px;
    height: 300px;
    overflow-y: scroll;
}
</style>