新增桌面歌词字体设置

src/renderer/App.vue

@@ -288,7 +288,7 @@ export default {
       })
 
       rendererOn(NAMES.mainWindow.set_config, (event, config) => {
-        console.log(config)
+        // console.log(config)
         // this.setDesktopLyricConfig(config)
         // console.log('set_config', JSON.stringify(this.setting) === JSON.stringify(config))
         this.setSetting(Object.assign({}, this.setting, config))

src/renderer/components/material/Selection.vue

@@ -45,8 +45,8 @@ export default {
   },
   computed: {
     label() {
-      if (!this.value) return ''
-      if (!this.itemName) return this.value
+      if (this.value == null) return ''
+      if (this.itemName == null) return this.value
       const item = this.list.find(l => l[this.itemKey] == this.value)
       if (!item) return ''
       return item[this.itemName]

src/renderer/lang/en-us/view/setting.json

@@ -51,6 +51,8 @@
   "desktop_lyric": "Desktop Lyric Settings",
   "desktop_lyric_always_on_top": "Make the lyrics always above other windows",
   "desktop_lyric_enable": "Display lyrics",
+  "desktop_lyric_font": "Lyric font",
+  "desktop_lyric_font_default": "Default",
   "desktop_lyric_lock": "Lock lyrics",
   "desktop_lyric_lock_screen": "It is not allowed to drag the lyrics window out of the main screen",
   "download": "Download",

src/renderer/lang/zh-cn/view/setting.json

@@ -51,6 +51,8 @@
   "desktop_lyric": "桌面歌词设置",
   "desktop_lyric_always_on_top": "使歌词总是在其他窗口之上",
   "desktop_lyric_enable": "显示歌词",
+  "desktop_lyric_font": "歌词字体",
+  "desktop_lyric_font_default": "默认",
   "desktop_lyric_lock": "锁定歌词",
   "desktop_lyric_lock_screen": "不允许歌词窗口拖出主屏幕之外",
   "download": "下载设置",

src/renderer/lang/zh-tw/view/setting.json

@@ -51,6 +51,8 @@
   "desktop_lyric": "桌面歌詞設置",
   "desktop_lyric_always_on_top": "使歌詞總是在其他窗口之上",
   "desktop_lyric_enable": "顯示歌詞",
+  "desktop_lyric_font": "歌詞字體",
+  "desktop_lyric_font_default": "默認",
   "desktop_lyric_lock": "鎖定歌詞",
   "desktop_lyric_lock_screen": "不允許歌詞窗口拖出主屏幕之外",
   "download": "下載設置",

src/renderer/views/Setting.vue

@@ -91,6 +91,10 @@ div(:class="$style.main")
           material-checkbox(id="setting_desktop_lyric_alwaysOnTop" v-model="current_setting.desktopLyric.isAlwaysOnTop" :label="$t('view.setting.desktop_lyric_always_on_top')")
         div(:class="$style.gapTop")
           material-checkbox(id="setting_desktop_lyric_lockScreen" v-model="current_setting.desktopLyric.isLockScreen" :label="$t('view.setting.desktop_lyric_lock_screen')")
+      dd
+        h3#desktop_lyric_font {{$t('view.setting.desktop_lyric_font')}}
+        div
+          material-selection(:list="fontList" :class="$style.gapLeft" v-model="current_setting.desktopLyric.style.font" item-key="id" item-name="label")
 
       dt#search {{$t('view.setting.search')}}
       dd
@@ -468,6 +472,9 @@ export default {
         ? this.sync.status.devices.map(d => `${d.deviceName} (${d.clientId.substring(0, 5)})`).join(', ')
         : ''
     },
+    fontList() {
+      return [{ id: '', label: this.$t('view.setting.desktop_lyric_font_default') }, ...this.systemFontList]
+    },
   },
   data() {
     return {
@@ -489,6 +496,7 @@ export default {
           y: -1,
           theme: '',
           style: {
+            font: '',
             fontSize: 125,
             opacity: 80,
             isZoomActiveLrc: true,
@@ -680,6 +688,7 @@ export default {
           devices: [],
         },
       },
+      systemFontList: [],
     }
   },
   watch: {
@@ -753,6 +762,7 @@ export default {
       if (!window.currentWindowSizeId) window.currentWindowSizeId = this.setting.windowSizeId
       // this.initTOC()
       this.getCacheSize()
+      this.getSystemFonts()
       this.getMediaDevice()
       this.current_hot_key = window.appHotKeyConfig
       this.initHotKeyConfig()
@@ -1261,6 +1271,13 @@ export default {
     handleRefreshSyncCode() {
       rendererInvoke(NAMES.mainWindow.sync_generate_code)
     },
+    getSystemFonts() {
+      rendererInvoke(NAMES.mainWindow.get_system_fonts).then(fonts => {
+        this.systemFontList = fonts.map(f => ({ id: f, label: f.replace(/(^"|"$)/g, '') }))
+      }).catch(() => {
+        this.systemFontList = []
+      })
+    },
   },
 }
 </script>