+
liuyg
2022-01-17 a3fadb577e4d18c1d7ff60e23be4f3d27f63b9a3
src/components/map/components/mapPopup.vue
@@ -204,12 +204,6 @@
                  :preview-src-list="popupImgAtlas"
                  ref="popupImgs">
        </el-image>
        <audio ref="audioControlPlay"
               style="position: fixed; left: 111111111px;"
               v-html="audioSource"
               @ended="overAudio">
        </audio>
    </div>
</template>
@@ -225,7 +219,10 @@
            tabBtnFlag: '教学科研行政',
            QRCodeFlag: false,
            audioSource: '',
            audioFlag: false
            audioFlag: false,
            audioCourse: false,
            audioSynth: null,
            audioMsg: null
        }
    },
    computed: {
@@ -263,17 +260,65 @@
            'teachList',
            // 科研
            'liveList',
            // 校内导航的显示关闭
            // 社区内导航的显示关闭
            'campusNavFlag'
        ])
    },
    created () {
        this.DC = global.DC
        this.audioSynth = window.speechSynthesis
        this.audioMsg = new window.SpeechSynthesisUtterance()
        this.audioMsg.onend = function () {
            this.audioSynth.cancel()
            this.audioFlag = false
            this.audioCourse = false
        }
    },
    watch: {
        introduceText: function (newQuestion, oldQuestion) {
            var zhText = encodeURI(newQuestion)
            this.audioSource = `<source src="http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&spd=4&text=${zhText}" type="audio/mpeg"><embed height="0" width="0" src="http://tts.baidu.com/text2audio?text=${zhText}">`
        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
                    }
                }
            }
        }
    },
    methods: {
@@ -303,9 +348,11 @@
        panoramaClick () {
            if (this.audioFlag == true) {
                this.$refs.audioControlPlay.pause()
                this.audioSynth.cancel()
                this.audioFlag = false
                this.audioCourse = false
            }
            // eslint-disable-next-line new-cap
            var positions = this.DC.Transform.transformWGS84ToCartesian(new this.DC.Position.fromArray(this.pointPosition))
            this.viewer.scene.globe.depthTestAgainstTerrain = false
@@ -324,8 +371,9 @@
        monitorClick () {
            if (this.audioFlag == true) {
                this.$refs.audioControlPlay.pause()
                this.audioSynth.cancel()
                this.audioFlag = false
                this.audioCourse = false
            }
            // eslint-disable-next-line new-cap
            var positions = this.DC.Transform.transformWGS84ToCartesian(new this.DC.Position.fromArray(this.pointPosition))
@@ -344,10 +392,10 @@
        closeMapPopupBox () {
            if (this.audioFlag == true) {
                this.$refs.audioControlPlay.pause()
                this.audioSynth.cancel()
                this.audioFlag = false
                this.audioCourse = false
            }
            this.audioSource = ''
            this.$store.commit('SET_DETAILSPOPUP', false)
        },
@@ -362,29 +410,24 @@
        },
        audioPlay () {
            if (this.audioSource == '') {
                var zhText = encodeURI(this.$refs.DomIntroduceText.innerText)
                this.audioSource = `<source src="http://tts.baidu.com/text2audio?lan=zh&ie=UTF-8&spd=4&text=${zhText}" type="audio/mpeg"><embed height="0" width="0" src="http://tts.baidu.com/text2audio?text=${zhText}">`
                this.$refs.audioControlPlay.play()
            if (this.audioFlag == false) {
                this.audioMsg.text = this.audioSource
                this.audioSynth.speak(this.audioMsg)
                this.audioFlag = true
                this.audioCourse = true
            } else {
                if (this.audioFlag == true) {
                    this.$refs.audioControlPlay.pause()
                    this.audioFlag = false
                if (this.audioCourse == true) {
                    this.audioSynth.pause()
                    this.audioCourse = false
                } else {
                    this.$refs.audioControlPlay.play()
                    this.audioFlag = true
                    this.audioSynth.resume()
                    this.audioCourse = true
                }
            }
        },
        overAudio () {
            this.audioFlag = false
        },
        mechanismDetailPopup (num, param) {
            getMechanismDetail({ num: num, mechanismName: param }).then(res => {
                console.log(res)
                var result = res.data.data
                this.$store.commit('CLEAR_ALL', null)
@@ -399,9 +442,13 @@
                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)
                this.viewer.flyToPosition(
                    new this.DC.Position(Number(result.jd), Number(result.wd), 3000, Number(result.heading), Number(result.pitch), Number(result.roll)),
                    new this.DC.Position(Number(result.jd), Number(result.wd), 300, Number(result.heading), Number(result.pitch), Number(result.roll)),
                    function () {
                    },
                    3
@@ -410,7 +457,7 @@
        },
        newPopup (item) {
            const position = this.DC.Transform.transformWGS84ToCartesian(new this.DC.Position(Number(item.jd), Number(item.wd), Number(item.gd), Number(item.heading), Number(item.pitch), Number(item.roll)))
            const position = this.DC.Transform.transformWGS84ToCartesian(new this.DC.Position(Number(item.jd), Number(item.wd), Number(item.gd)))
            // eslint-disable-next-line no-unused-vars
            var popup = new this.DC.DivForms(this.viewer, {
                domId: 'divFormsDomBox',
@@ -420,6 +467,7 @@
            })
            this.$store.commit('SET_PANORAMAPOPUP', false)
            this.$store.commit('SET_MONITORPOPUP', false)
            this.$store.commit('SET_DETAILSPOPUP', true)
        }
    }