From a3fadb577e4d18c1d7ff60e23be4f3d27f63b9a3 Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Mon, 17 Jan 2022 17:07:52 +0800
Subject: [PATCH] +

---
 src/components/map/components/mapPopup.vue |  110 +++++++++++++++++++++++++++++++++++++++---------------
 1 files changed, 79 insertions(+), 31 deletions(-)

diff --git a/src/components/map/components/mapPopup.vue b/src/components/map/components/mapPopup.vue
index d3a9c40..675dd4e 100644
--- a/src/components/map/components/mapPopup.vue
+++ b/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)
         }
     }

--
Gitblit v1.9.3