修复讲解详情播放器语言切换重复显示

src/components/audio/AudioPlayer.vue

@@ -15,7 +15,6 @@
             mode="aspectFill"
           />
           <view class="expanded-copy">
-            <text class="player-kicker">讲解音频</text>
             <text class="expanded-title">{{ displayAudio.name }}</text>
             <text class="expanded-subtitle" :class="{ error: displayPlaybackError }">{{ expandedSubtitle }}</text>
           </view>
@@ -95,7 +94,6 @@
         </view>
 
         <view class="mini-copy">
-          <text class="player-kicker">讲解音频</text>
           <text class="mini-title">{{ displayAudio.name }}</text>
         </view>
 
@@ -750,7 +748,6 @@ defineExpose({
   min-width: 0;
 }
 
-.player-kicker,
 .expanded-title,
 .expanded-subtitle,
 .mini-title,
@@ -761,15 +758,7 @@ defineExpose({
   display: block;
 }
 
-.player-kicker {
-  font-size: 17px;
-  line-height: 23px;
-  font-weight: 900;
-  color: #ffffff;
-}
-
 .expanded-title {
-  margin-top: 8px;
   font-size: 30px;
   line-height: 37px;
   font-weight: 900;
@@ -928,24 +917,36 @@ defineExpose({
   min-height: 116px;
   padding: 12px 14px 14px;
   display: grid;
-  grid-template-columns: 56px minmax(0, 1fr) auto auto;
+  grid-template-columns: 56px minmax(0, 1fr) auto;
   grid-template-areas:
-    "play spacer spacer expand"
-    "copy copy copy copy"
-    "progress progress progress progress";
+    "play copy expand"
+    "progress progress progress";
   column-gap: 10px;
-  row-gap: 7px;
+  row-gap: 10px;
   align-items: center;
   box-sizing: border-box;
   border-radius: 30px;
 }
 
 .mini-player.with-close {
-  grid-template-columns: 56px minmax(0, 1fr) auto auto auto;
+  grid-template-columns: 56px minmax(0, 1fr) auto auto;
   grid-template-areas:
-    "play spacer spacer expand close"
-    "copy copy copy copy copy"
-    "progress progress progress progress progress";
+    "play copy expand close"
+    "progress progress progress progress";
+}
+
+.mini-player.is-static {
+  grid-template-columns: 56px minmax(0, 1fr);
+  grid-template-areas:
+    "play copy"
+    "progress progress";
+}
+
+.mini-player.with-close.is-static {
+  grid-template-columns: 56px minmax(0, 1fr) auto;
+  grid-template-areas:
+    "play copy close"
+    "progress progress progress";
 }
 
 .mini-play {
@@ -957,20 +958,13 @@ defineExpose({
 .mini-copy {
   grid-area: copy;
   display: flex;
-  align-items: baseline;
-  gap: 8px;
+  align-items: center;
   overflow: hidden;
 }
 
-.mini-copy .player-kicker {
-  flex: 0 0 auto;
-  white-space: nowrap;
-}
-
 .mini-title {
   flex: 1 1 auto;
   min-width: 0;
-  margin-top: 2px;
   font-size: 22px;
   line-height: 28px;
   font-weight: 900;
@@ -1123,21 +1117,33 @@ defineExpose({
     padding: 10px 12px 12px;
     grid-template-columns: 50px minmax(0, 1fr) auto;
     grid-template-areas:
-      "play spacer expand"
-      "copy copy copy"
+      "play copy expand"
       "progress progress progress";
     column-gap: 8px;
-    row-gap: 6px;
+    row-gap: 9px;
   }
 
   .mini-player.with-close {
     grid-template-columns: 50px minmax(0, 1fr) auto auto;
     grid-template-areas:
-      "play spacer expand close"
-      "copy copy copy copy"
+      "play copy expand close"
       "progress progress progress progress";
   }
 
+  .mini-player.is-static {
+    grid-template-columns: 50px minmax(0, 1fr);
+    grid-template-areas:
+      "play copy"
+      "progress progress";
+  }
+
+  .mini-player.with-close.is-static {
+    grid-template-columns: 50px minmax(0, 1fr) auto;
+    grid-template-areas:
+      "play copy close"
+      "progress progress progress";
+  }
+
   .mini-play {
     width: 50px;
     height: 50px;

src/components/audio/GlobalAudioPlayerHost.vue

@@ -54,12 +54,14 @@ const {
   currentTime,
   duration,
   displayMode: currentDisplayMode,
+  activeHostId,
   hasAudio
 } = player
 const hostId = player.registerHost()
 const isHostVisible = computed(() => (
   visible.value
   && hasAudio.value
+  && activeHostId.value === hostId
 ))
 
 const handleToggle = () => {