From d456ea68f7531bf6a45c1a7e9c982e3b0fa8c31c Mon Sep 17 00:00:00 2001
From: kuaifan <aipaw@live.cn>
Date: Sun, 5 Jun 2022 20:49:16 +0800
Subject: [PATCH] =?UTF-8?q?=E5=90=8C=E6=97=B6=E6=92=AD=E6=94=BE=E4=B8=A4?=
 =?UTF-8?q?=E4=B8=AA=E8=AF=AD=E9=9F=B3=E6=97=B6=E4=B8=8A=E4=B8=80=E4=B8=AA?=
 =?UTF-8?q?=E6=B2=A1=E6=9C=89=E5=81=9C=E6=AD=A2=E5=8A=A8=E7=94=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 resources/assets/js/components/AudioManager.vue   | 15 +++++++++------
 .../js/pages/manage/components/DialogView.vue     |  8 ++------
 resources/assets/js/store/state.js                |  3 +++
 3 files changed, 14 insertions(+), 12 deletions(-)

diff --git a/resources/assets/js/components/AudioManager.vue b/resources/assets/js/components/AudioManager.vue
index 61e23eb16..46f4871b3 100644
--- a/resources/assets/js/components/AudioManager.vue
+++ b/resources/assets/js/components/AudioManager.vue
@@ -30,7 +30,6 @@ export default {
             audioTimer: null,
             audioId: 0,
             audioSrc: null,
-            callback: null,
         }
     },
     mounted() {
@@ -44,9 +43,7 @@ export default {
     },
     watch: {
         audioPlay(play) {
-            if (typeof this.callback === "function") {
-                this.callback(play)
-            }
+            this.updateState();
             //
             this.audioTimer && clearTimeout(this.audioTimer);
             if (!play) {
@@ -57,6 +54,9 @@ export default {
                     }
                 }, 3000)
             }
+        },
+        audioSrc() {
+            this.updateState();
         }
     },
     methods: {
@@ -75,8 +75,7 @@ export default {
                 }
                 return
             }
-            const {id, src, callback} = msg
-            this.callback = callback || null;
+            const {id, src} = msg
             if (src === this.audioSrc) {
                 if (ended) {
                     audio.play()
@@ -94,6 +93,10 @@ export default {
             }
         },
 
+        updateState() {
+            this.$store.state.audioPlaying = this.audioPlay && this.audioSrc ? this.audioSrc : null;
+        },
+
         overAudio() {
             this.audioPlay = false;
         },
diff --git a/resources/assets/js/pages/manage/components/DialogView.vue b/resources/assets/js/pages/manage/components/DialogView.vue
index 0a3aec8e8..79f089f99 100644
--- a/resources/assets/js/pages/manage/components/DialogView.vue
+++ b/resources/assets/js/pages/manage/components/DialogView.vue
@@ -33,7 +33,7 @@
                 </div>
                 <!--录音-->
                 <div v-else-if="msgData.type === 'record'" class="content-record no-dark-content">
-                    <div class="dialog-record" :class="{playing: recordPlay}" :style="recordStyle(msgData.msg)" @click="playRecord">
+                    <div class="dialog-record" :class="{playing: audioPlaying === msgData.msg.path}" :style="recordStyle(msgData.msg)" @click="playRecord">
                         <div class="record-time">{{recordDuration(msgData.msg.duration)}}</div>
                         <div class="record-icon taskfont"></div>
                     </div>
@@ -159,7 +159,6 @@ export default {
             popperLoad: 0,
             popperShow: false,
             timeShow: false,
-            recordPlay: false,
             operateEnter: false,
             allList: [],
         }
@@ -174,7 +173,7 @@ export default {
     },
 
     computed: {
-        ...mapState(['userToken', 'userId', 'dialogMsgs']),
+        ...mapState(['userToken', 'userId', 'dialogMsgs', 'audioPlaying']),
 
         viewClass() {
             const {msgData, operateAction, operateEnter} = this;
@@ -391,9 +390,6 @@ export default {
             Store.set('audioSubscribe', {
                 id: this.msgData.id,
                 src: this.msgData.msg.path,
-                callback: (play) => {
-                    this.recordPlay = play;
-                }
             });
         },
 
diff --git a/resources/assets/js/store/state.js b/resources/assets/js/store/state.js
index 89c63657f..e4ba68705 100644
--- a/resources/assets/js/store/state.js
+++ b/resources/assets/js/store/state.js
@@ -7,6 +7,9 @@ const stateData = {
     // 浏览器宽度≤768返回true
     windowMax768: window.innerWidth <= 768,
 
+    // 播放中的音频地址
+    audioPlaying: null,
+
     // 路由记录
     routeHistorys: [],
     routeHistoryLast: {},