新增设置-基本设置-软件字体设置

src/common/defaultSetting.js

@@ -2,7 +2,7 @@ const path = require('path')
 const os = require('os')
 
 const defaultSetting = {
-  version: '1.0.50',
+  version: '1.0.51',
   player: {
     togglePlayMethod: 'listLoop',
     highQuality: false,
@@ -102,6 +102,7 @@ const defaultSetting = {
   sourceId: 'kw',
   apiSource: 'temp',
   sourceNameType: 'alias',
+  font: '',
   isShowAnimation: true,
   randomAnimate: true,
   ignoreVersion: null,

src/lang/en-us.json

@@ -210,6 +210,7 @@
   "setting__basic_control_btn_position": "Control Button Position",
   "setting__basic_control_btn_position_left": "Left",
   "setting__basic_control_btn_position_right": "Right",
+  "setting__basic_font": "Font",
   "setting__basic_lang": "Language",
   "setting__basic_lang_title": "The language displayed in the software",
   "setting__basic_show_animation": "Show switching animation",

src/lang/zh-cn.json

@@ -210,6 +210,7 @@
   "setting__basic_control_btn_position": "控制按钮位置",
   "setting__basic_control_btn_position_left": "左边",
   "setting__basic_control_btn_position_right": "右边",
+  "setting__basic_font": "字体",
   "setting__basic_lang": "语言",
   "setting__basic_lang_title": "软件显示的语言",
   "setting__basic_show_animation": "显示切换动画",

src/lang/zh-tw.json

@@ -210,6 +210,7 @@
   "setting__basic_control_btn_position": "控制按鈕位置",
   "setting__basic_control_btn_position_left": "左邊",
   "setting__basic_control_btn_position_right": "右邊",
+  "setting__basic_font": "字體",
   "setting__basic_lang": "語言",
   "setting__basic_lang_title": "軟件顯示的語言",
   "setting__basic_show_animation": "顯示切換動畫",

src/renderer/App.vue

@@ -20,13 +20,20 @@ import useApp from '@renderer/core/useApp'
 export default {
   setup() {
     const theme = useRefGetter('theme')
+    const font = useRefGetter('font')
 
     const dom_root = document.getElementById('root')
 
     watch(theme, (val) => {
       dom_root.className = val
+    }, {
+      immediate: true,
+    })
+    watch(font, (val) => {
+      document.documentElement.style.fontFamily = val
+    }, {
+      immediate: true,
     })
-    dom_root.className = theme.value
 
     useApp()
 

src/renderer/assets/styles/reset.less

@@ -41,3 +41,6 @@ table {
 	border-collapse: collapse;
 	border-spacing: 0;
 }
+button {
+  font-family: inherit;
+}

src/renderer/store/getters.js

@@ -6,6 +6,9 @@ export default {
     let theme = themes.find(theme => theme.id == state.setting.themeId)
     return (theme && theme.className) || ''
   },
+  font(state) {
+    return state.setting.font
+  },
   themes(state) {
     return {
       active: state.setting.themeId,

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

@@ -45,12 +45,16 @@ dd(:tips="$t('setting__basic_sourcename_title')")
   div
     base-checkbox.gap-left(v-for="item in sourceNameTypes" :key="item.id" :id="`setting_abasic_sourcename_${item.id}`"
       name="setting_basic_sourcename" need v-model="currentStting.sourceNameType" :value="item.id" :label="item.label")
-
 dd
   h3#basic_control_btn_position {{$t('setting__basic_control_btn_position')}}
   div
     base-checkbox.gap-left(v-for="item in controlBtnPositionList" :key="item.id" :id="`setting_basic_control_btn_position_${item.id}`"
       name="setting_basic_control_btn_position" need v-model="currentStting.controlBtnPosition" :value="item.id" :label="item.name")
+dd
+  h3#basic_font {{$t('setting__basic_font')}}
+  div
+    base-selection.gap-teft(:list="fontList" v-model="currentStting.font" item-key="id" item-name="label")
+
 play-timeout-modal(v-model="isShowPlayTimeoutModal")
 user-api-modal(v-model="isShowUserApiModal")
 </template>
@@ -63,10 +67,12 @@ import { currentStting } from '../setting'
 import { setWindowSize } from '@renderer/utils'
 import apiSourceInfo from '@renderer/utils/music/api-source-info'
 import { useTimeout } from '@renderer/utils/timeoutStop'
+import { getSystemFonts } from '@renderer/utils/tools'
 
 import PlayTimeoutModal from './PlayTimeoutModal'
 import UserApiModal from './UserApiModal'
 
+
 export default {
   name: 'SettingBasic',
   components: {
@@ -144,6 +150,13 @@ export default {
       ]
     })
 
+    const systemFontList = ref([])
+    const fontList = computed(() => {
+      return [{ id: '', label: t('setting__desktop_lyric_font_default') }, ...systemFontList.value]
+    })
+    getSystemFonts().then(fonts => {
+      systemFontList.value = fonts.map(f => ({ id: f, label: f.replace(/(^"|"$)/g, '') }))
+    })
 
     return {
       currentStting,
@@ -156,6 +169,7 @@ export default {
       langList,
       sourceNameTypes,
       controlBtnPositionList,
+      fontList,
     }
   },
 }

src/renderer/views/setting/setting.js

@@ -75,6 +75,7 @@ export const currentStting = ref({
   langId: 'cns',
   themeId: 0,
   sourceId: 0,
+  font: '',
   isShowAnimation: true,
   randomAnimate: true,
   isAgreePact: false,