添加音频可视化与音频输出设备冲突的提示

src/renderer/components/core/PlayDetail/components/ControlBtns.vue

@@ -46,12 +46,15 @@ import {
 
 import useNextTogglePlay from '@renderer/utils/compositions/useNextTogglePlay'
 import useToggleDesktopLyric from '@renderer/utils/compositions/useToggleDesktopLyric'
+import { dialog } from '@renderer/plugins/Dialog'
+import { setMediaDeviceId } from '@renderer/plugins/player'
 
 export default {
   setup() {
     const { t } = useI18n()
     const setting = useRefGetter('setting')
     const setAudioVisualization = useCommit('setAudioVisualization')
+    const saveMediaDeviceId = useCommit('setMediaDeviceId')
 
     const toggleVisibleLrc = () => {
       setShowPlayLrcSelectContentLrc(!isShowLrcSelectContent.value)
@@ -72,8 +75,19 @@ export default {
 
     const isShowAddMusicTo = ref(false)
 
-    const toggleAudioVisualization = () => {
-      setAudioVisualization(!setting.value.player.audioVisualization)
+    const toggleAudioVisualization = async() => {
+      const newSetting = !setting.value.player.audioVisualization
+      if (newSetting && setting.value.player.mediaDeviceId != 'default') {
+        const confirm = await dialog.confirm({
+          message: t('setting__player_audio_visualization_tip'),
+          cancelButtonText: t('cancel_button_text'),
+          confirmButtonText: t('confirm_button_text'),
+        })
+        if (!confirm) return
+        saveMediaDeviceId('default')
+        await setMediaDeviceId('default').catch(_ => _)
+      }
+      setAudioVisualization(newSetting)
     }
 
     return {

src/renderer/views/setting/Setting.vue

@@ -115,6 +115,9 @@ export default {
     watch(() => setting.value.player.togglePlayMethod, val => {
       currentStting.value.player.togglePlayMethod = val
     })
+    watch(() => setting.value.player.audioVisualization, val => {
+      currentStting.value.player.audioVisualization = val
+    })
   },
   data() {
     return {

src/renderer/views/setting/components/SettingPlay.vue

@@ -18,18 +18,21 @@ dd
 dd(:tips="$t('setting__play_mediaDevice_title')")
   h3#play_mediaDevice {{$t('setting__play_mediaDevice')}}
   div
-    base-selection.gap-left(:list="mediaDevices" v-model="currentStting.player.mediaDeviceId" item-key="deviceId" item-name="label")
+    base-selection.gap-left(:list="mediaDevices" v-model="mediaDeviceId" @change="handleMediaDeviceIdChnage" item-key="deviceId" item-name="label")
 </template>
 
 <script>
-import { ref, onBeforeUnmount, watch, nextTick } from '@renderer/utils/vueTools'
+import { ref, onBeforeUnmount, watch, nextTick, useI18n } from '@renderer/utils/vueTools'
 import { setTaskBarProgress } from '@renderer/utils/tools'
+import { dialog } from '@renderer/plugins/Dialog'
 
 import { currentStting } from '../setting'
 
 export default {
   name: 'SettingPlay',
   setup() {
+    const { t } = useI18n()
+
     const mediaDevices = ref([])
     const getMediaDevice = async() => {
       const devices = await navigator.mediaDevices.enumerateDevices()
@@ -51,10 +54,28 @@ export default {
       })
     })
 
+    const mediaDeviceId = ref(currentStting.value.player.mediaDeviceId)
+    const handleMediaDeviceIdChnage = async() => {
+      if (currentStting.value.player.audioVisualization) {
+        await dialog({
+          message: t('setting__play_media_device_tip'),
+          confirmButtonText: t('alert_button_text'),
+        })
+        mediaDeviceId.value = currentStting.value.player.mediaDeviceId
+      } else {
+        currentStting.value.player.mediaDeviceId = mediaDeviceId.value
+      }
+    }
+    watch(() => currentStting.value.player.mediaDeviceId, val => {
+      mediaDeviceId.value = val
+    })
+
 
     return {
       currentStting,
       mediaDevices,
+      mediaDeviceId,
+      handleMediaDeviceIdChnage,
     }
   },
 }

src/renderer/views/setting/setting.js

@@ -2,14 +2,20 @@ import { ref } from '@renderer/utils/vueTools'
 
 export const currentStting = ref({
   player: {
-    togglePlayMethod: 'random',
+    togglePlayMethod: 'listLoop',
     highQuality: false,
     isShowTaskProgess: true,
     volume: 1,
+    isMute: false,
     mediaDeviceId: 'default',
     isMediaDeviceRemovedStopPlay: false,
+    isShowLyricTranslation: false,
+    isS2t: false, // 是否将歌词从简体转换为繁体
+    isPlayLxlrc: true,
+    isSavePlayTime: false,
+    audioVisualization: false,
     waitPlayEndStop: true,
-    waitPlayEndStopTime: 0,
+    waitPlayEndStopTime: '',
   },
   playDetail: {
     isZoomActiveLrc: true,