refactor: 更新 eslint 和 prettier 配置 格式化代码

src/renderer/layout/AppLayout.vue

@@ -9,7 +9,11 @@
           <!-- 搜索栏 -->
           <search-bar />
           <!-- 主页面路由 -->
-          <div class="main-content" :native-scrollbar="false" :class="{'mobile-content': !shouldShowMobileMenu}">
+          <div
+            class="main-content"
+            :native-scrollbar="false"
+            :class="{ 'mobile-content': !shouldShowMobileMenu }"
+          >
             <router-view
               v-slot="{ Component }"
               class="main-page"
@@ -41,7 +45,7 @@
     <install-app-modal v-if="!isElectron"></install-app-modal>
     <update-modal v-if="isElectron" />
     <playlist-drawer v-model="showPlaylistDrawer" :song-id="currentSongId" />
-    <SleepTimerTop v-if="!isMobile"/>
+    <sleep-timer-top v-if="!isMobile" />
     <!-- 下载管理抽屉 -->
     <download-drawer
       v-if="
@@ -64,24 +68,24 @@ import DownloadDrawer from '@/components/common/DownloadDrawer.vue';
 import InstallAppModal from '@/components/common/InstallAppModal.vue';
 import PlayBottom from '@/components/common/PlayBottom.vue';
 import UpdateModal from '@/components/common/UpdateModal.vue';
+import SleepTimerTop from '@/components/player/SleepTimerTop.vue';
 import homeRouter from '@/router/home';
 import otherRouter from '@/router/other';
 import { useMenuStore } from '@/store/modules/menu';
 import { usePlayerStore } from '@/store/modules/player';
 import { useSettingsStore } from '@/store/modules/settings';
 import { isElectron, isMobile } from '@/utils';
-import SleepTimerTop from '@/components/player/SleepTimerTop.vue';
 
 const keepAliveInclude = computed(() => {
   const allRoutes = [...homeRouter, ...otherRouter];
-  
+
   return allRoutes
     .filter((item) => {
       return item.meta?.keepAlive;
     })
     .map((item) => {
-      return typeof item.name === 'string' 
-        ? item.name.charAt(0).toUpperCase() + item.name.slice(1) 
+      return typeof item.name === 'string'
+        ? item.name.charAt(0).toUpperCase() + item.name.slice(1)
         : '';
     })
     .filter(Boolean);
@@ -92,7 +96,9 @@ const PlayBar = defineAsyncComponent(() => import('@/components/player/PlayBar.v
 const MobilePlayBar = defineAsyncComponent(() => import('@/components/player/MobilePlayBar.vue'));
 const SearchBar = defineAsyncComponent(() => import('./components/SearchBar.vue'));
 const TitleBar = defineAsyncComponent(() => import('./components/TitleBar.vue'));
-const PlayingListDrawer = defineAsyncComponent(() => import('@/components/player/PlayingListDrawer.vue'));
+const PlayingListDrawer = defineAsyncComponent(
+  () => import('@/components/player/PlayingListDrawer.vue')
+);
 const PlaylistDrawer = defineAsyncComponent(() => import('@/components/common/PlaylistDrawer.vue'));
 
 const playerStore = usePlayerStore();

src/renderer/layout/components/AppMenu.vue

@@ -12,8 +12,17 @@
           <n-tooltip :delay="200" :disabled="isText || isMobile" placement="bottom">
             <template #trigger>
               <router-link class="app-menu-item-link" :to="item.path">
-                <i class="iconfont app-menu-item-icon" :style="iconStyle(index)" :class="item.meta.icon"></i>
-                <span v-if="isText" class="app-menu-item-text ml-3" :class="isChecked(index) ? 'text-green-500' : ''">{{ t(item.meta.title) }}</span>
+                <i
+                  class="iconfont app-menu-item-icon"
+                  :style="iconStyle(index)"
+                  :class="item.meta.icon"
+                ></i>
+                <span
+                  v-if="isText"
+                  class="app-menu-item-text ml-3"
+                  :class="isChecked(index) ? 'text-green-500' : ''"
+                  >{{ t(item.meta.title) }}</span
+                >
               </router-link>
             </template>
             <div v-if="!isText">{{ t(item.meta.title) }}</div>
@@ -25,9 +34,9 @@
 </template>
 
 <script lang="ts" setup>
-import { useRoute } from 'vue-router';
 import { ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
+import { useRoute } from 'vue-router';
 
 import icon from '@/assets/icon.png';
 import { isMobile } from '@/utils';

src/renderer/layout/components/SearchBar.vue

@@ -19,7 +19,7 @@
           <n-dropdown trigger="hover" :options="searchTypeOptions" @select="selectSearchType">
             <div class="w-20 px-3 flex justify-between items-center">
               <div>
-                {{ searchTypeOptions.find(item => item.key === searchStore.searchType)?.label }}
+                {{ searchTypeOptions.find((item) => item.key === searchStore.searchType)?.label }}
               </div>
               <i class="iconfont icon-xiasanjiaoxing"></i>
             </div>
@@ -64,16 +64,18 @@
           </div>
           <div class="menu-item" v-if="isElectron">
             <i class="iconfont ri-zoom-in-line"></i>
-            <span>{{ t('comp.searchBar.zoom')}}</span>
+            <span>{{ t('comp.searchBar.zoom') }}</span>
             <div class="zoom-controls ml-auto">
               <n-button quaternary circle size="tiny" @click="decreaseZoom">
                 <i class="ri-subtract-line"></i>
               </n-button>
               <n-tooltip trigger="hover">
                 <template #trigger>
-                  <span class="zoom-value" :class="{'zoom-100': isZoom100()}" @click="resetZoom">{{ Math.round(zoomFactor * 100) }}%</span>
+                  <span class="zoom-value" :class="{ 'zoom-100': isZoom100() }" @click="resetZoom"
+                    >{{ Math.round(zoomFactor * 100) }}%</span
+                  >
                 </template>
-                {{ isZoom100() ? t('comp.searchBar.zoom100'): t('comp.searchBar.resetZoom')}}
+                {{ isZoom100() ? t('comp.searchBar.zoom100') : t('comp.searchBar.resetZoom') }}
               </n-tooltip>
               <n-button quaternary circle size="tiny" @click="increaseZoom">
                 <i class="ri-add-line"></i>
@@ -126,13 +128,14 @@
 import { computed, onMounted, ref, watch, watchEffect } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
+
 import { getSearchKeyword } from '@/api/home';
 import { getUserDetail } from '@/api/login';
 import alipay from '@/assets/alipay.png';
 import wechat from '@/assets/wechat.png';
 import Coffee from '@/components/Coffee.vue';
-import { useZoom } from '@/hooks/useZoom';
 import { SEARCH_TYPES, USER_SET_OPTIONS } from '@/const/bar-const';
+import { useZoom } from '@/hooks/useZoom';
 import { useSearchStore } from '@/store/modules/search';
 import { useSettingsStore } from '@/store/modules/settings';
 import { useUserStore } from '@/store/modules/user';
@@ -149,14 +152,7 @@ const userSetOptions = ref(USER_SET_OPTIONS);
 const { t, locale } = useI18n();
 
 // 使用缩放hook
-const { 
-  zoomFactor, 
-  initZoomFactor, 
-  increaseZoom, 
-  decreaseZoom, 
-  resetZoom, 
-  isZoom100 
-} = useZoom();
+const { zoomFactor, initZoomFactor, increaseZoom, decreaseZoom, resetZoom, isZoom100 } = useZoom();
 
 // 显示返回按钮
 const showBackButton = computed(() => {
@@ -270,14 +266,14 @@ const selectSearchType = (key: number) => {
   }
 };
 
-const rawSearchTypes = ref(SEARCH_TYPES)
+const rawSearchTypes = ref(SEARCH_TYPES);
 const searchTypeOptions = computed(() => {
   // 引用 locale 以创建响应式依赖
   locale.value;
-  return rawSearchTypes.value.map(type => ({
+  return rawSearchTypes.value.map((type) => ({
     label: t(type.label),
     key: type.key
-  }))
+  }));
 });
 
 const selectItem = async (key: string) => {
@@ -418,17 +414,17 @@ const toGithubRelease = () => {
           @apply bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-300;
         }
       }
-      
+
       // 缩放控制样式
       .zoom-controls {
         @apply flex items-center gap-1;
-        
+
         .zoom-value {
           @apply text-xs px-2 py-0.5 rounded cursor-pointer;
           @apply bg-gray-100 dark:bg-gray-700 text-gray-600 dark:text-gray-300;
           @apply hover:bg-gray-200 dark:hover:bg-gray-600;
           transition: all 0.2s ease;
-          
+
           &.zoom-100 {
             @apply bg-green-100 dark:bg-green-900 text-green-700 dark:text-green-300 font-bold;
             @apply hover:bg-green-200 dark:hover:bg-green-800;