fix: 修复音量调整不同步的问题

algerkong · algerkong · commit 679089eda92e · 2025-07-29T22:19:34.000+08:00
fixed(#331): 软件存在两套音量调整逻辑，快捷键调整和音量条调整音量不一致
diff --git a/src/renderer/components/player/PlayBar.vue b/src/renderer/components/player/PlayBar.vue
@@ -123,7 +123,7 @@
         <template #trigger>
           <i
             class="iconfont ri-netease-cloud-music-line"
-            :class="{ 'text-green-500': isLyricWindowOpen, 'disabled-icon': !(playMusic?.id) }"
+            :class="{ 'text-green-500': isLyricWindowOpen, 'disabled-icon': !playMusic?.id }"
             @click="playMusic?.id && openLyricWindow()"
           ></i>
         </template>
@@ -245,27 +245,22 @@ const formatTooltip = (value: number) => {
   return `${secondToMinute(value)} / ${secondToMinute(allTime.value)}`;
 };
 
-// 音量条
-const audioVolume = ref(
-  localStorage.getItem('volume') ? parseFloat(localStorage.getItem('volume') as string) : 1
-);
+// 音量条 - 使用 playerStore 的统一音量管理
 const getVolumeIcon = computed(() => {
   // 0 静音 ri-volume-mute-line 0.5 ri-volume-down-line 1 ri-volume-up-line
-  if (audioVolume.value === 0) {
+  if (playerStore.volume === 0) {
     return 'ri-volume-mute-line';
   }
-  if (audioVolume.value <= 0.5) {
+  if (playerStore.volume <= 0.5) {
     return 'ri-volume-down-line';
   }
   return 'ri-volume-up-line';
 });
 
 const volumeSlider = computed({
-  get: () => audioVolume.value * 100,
+  get: () => playerStore.volume * 100,
   set: (value) => {
-    localStorage.setItem('volume', (value / 100).toString());
-    audioService.setVolume(value / 100);
-    audioVolume.value = value / 100;
+    playerStore.setVolume(value / 100);
   }
 });
 
diff --git a/src/renderer/store/modules/player.ts b/src/renderer/store/modules/player.ts
@@ -411,6 +411,9 @@ export const usePlayerStore = defineStore('player', () => {
   // 播放速度状态
   const playbackRate = ref(parseFloat(getLocalStorageItem('playbackRate', '1.0')));
 
+  // 音量状态管理
+  const volume = ref(parseFloat(getLocalStorageItem('volume', '1')));
+
   // 清空播放列表
   const clearPlayAll = async () => {
     audioService.pause();
@@ -1439,6 +1442,35 @@ export const usePlayerStore = defineStore('player', () => {
     }
   };
 
+  // 音量管理方法
+  const setVolume = (newVolume: number) => {
+    // 确保音量值在0-1范围内
+    const normalizedVolume = Math.max(0, Math.min(1, newVolume));
+    volume.value = normalizedVolume;
+
+    // 保存到localStorage
+    localStorage.setItem('volume', normalizedVolume.toString());
+
+    // 应用到音频服务
+    audioService.setVolume(normalizedVolume);
+  };
+
+  const getVolume = () => {
+    return volume.value;
+  };
+
+  const increaseVolume = (step: number = 0.1) => {
+    const newVolume = Math.min(1, volume.value + step);
+    setVolume(newVolume);
+    return newVolume;
+  };
+
+  const decreaseVolume = (step: number = 0.1) => {
+    const newVolume = Math.max(0, volume.value - step);
+    setVolume(newVolume);
+    return newVolume;
+  };
+
   return {
     play,
     isPlay,
@@ -1491,6 +1523,13 @@ export const usePlayerStore = defineStore('player', () => {
     setPlayListDrawerVisible,
     handlePause,
     playbackRate,
-    setPlaybackRate
+    setPlaybackRate,
+
+    // 音量管理
+    volume,
+    setVolume,
+    getVolume,
+    increaseVolume,
+    decreaseVolume
   };
 });
diff --git a/src/renderer/utils/appShortcuts.ts b/src/renderer/utils/appShortcuts.ts
@@ -96,23 +96,17 @@ export async function handleShortcutAction(action: string) {
         showToast(t('player.playBar.next'), 'ri-skip-forward-line');
         break;
       case 'volumeUp':
-        // 从localStorage获取当前音量
-        const currentVolumeUp = parseFloat(localStorage.getItem('volume') || '1');
-        if (currentVolumeUp < 1) {
-          const newVolume = Math.min(1, currentVolumeUp + 0.1);
-          await audioService.setVolume(newVolume);
+        if (playerStore.getVolume() < 1) {
+          const newVolume = playerStore.increaseVolume(0.1);
           showToast(
             `${t('player.playBar.volume')}${Math.round(newVolume * 100)}%`,
             'ri-volume-up-line'
           );
         }
         break;
       case 'volumeDown':
-        // 从localStorage获取当前音量
-        const currentVolumeDown = parseFloat(localStorage.getItem('volume') || '1');
-        if (currentVolumeDown > 0) {
-          const newVolume = Math.max(0, currentVolumeDown - 0.1);
-          await audioService.setVolume(newVolume);
+        if (playerStore.getVolume() > 0) {
+          const newVolume = playerStore.decreaseVolume(0.1);
           showToast(
             `${t('player.playBar.volume')}${Math.round(newVolume * 100)}%`,
             'ri-volume-down-line'
