diff --git a/package.json b/package.json
index e1d465e..85200a1 100644
--- a/package.json
+++ b/package.json
@@ -68,21 +68,24 @@
     "lodash": "^4.17.21",
     "marked": "^15.0.7",
     "naive-ui": "^2.41.0",
-    "prettier": "^3.5.3",
-    "remixicon": "^4.6.0",
-    "sass": "^1.86.0",
+    "postcss": "^8.4.49",
+    "prettier": "^3.3.2",
+    "pinia": "^3.0.1",
+    "remixicon": "^4.2.0",
+    "sass": "^1.83.4",
     "tailwindcss": "^3.4.17",
     "tinycolor2": "^1.6.0",
     "tunajs": "^1.0.15",
-    "typescript": "^5.8.2",
-    "unplugin-auto-import": "^19.1.1",
-    "unplugin-vue-components": "^28.4.1",
-    "vite": "^6.2.2",
+    "typescript": "^5.5.2",
+    "unplugin-auto-import": "^0.18.2",
+    "unplugin-vue-components": "^0.27.4",
+    "vfonts": "^0.1.0",
+    "vite": "^5.3.1",
     "vite-plugin-compression": "^0.5.1",
     "vite-plugin-vue-devtools": "7.7.2",
     "vue": "^3.5.13",
     "vue-router": "^4.5.0",
-    "vue-tsc": "^2.2.8",
+    "vue-tsc": "^2.0.22",
     "vuex": "^4.1.0"
   },
   "build": {
diff --git a/src/i18n/lang/en-US/player.ts b/src/i18n/lang/en-US/player.ts
index e2d93d5..d5dcf4d 100644
--- a/src/i18n/lang/en-US/player.ts
+++ b/src/i18n/lang/en-US/player.ts
@@ -11,6 +11,7 @@ export default {
   mute: 'Mute',
   unmute: 'Unmute',
   songNum: 'Song Number: {num}',
+  playFailed: 'Play Failed, Play Next Song',
   playMode: {
     sequence: 'Sequence',
     loop: 'Loop',
diff --git a/src/i18n/lang/zh-CN/player.ts b/src/i18n/lang/zh-CN/player.ts
index 428c214..fb4b1cf 100644
--- a/src/i18n/lang/zh-CN/player.ts
+++ b/src/i18n/lang/zh-CN/player.ts
@@ -11,6 +11,7 @@ export default {
   mute: '静音',
   unmute: '取消静音',
   songNum: '歌曲总数：{num}',
+  playFailed: '当前歌曲播放失败，播放下一首',
   playMode: {
     sequence: '顺序播放',
     loop: '循环播放',
diff --git a/src/renderer/App.vue b/src/renderer/App.vue
index b62ef37..348a616 100644
--- a/src/renderer/App.vue
+++ b/src/renderer/App.vue
@@ -12,90 +12,67 @@
 
 <script setup lang="ts">
 import { darkTheme, lightTheme } from 'naive-ui';
-import { computed, onMounted, onUnmounted, watch } from 'vue';
+import { computed, onMounted, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 
 import homeRouter from '@/router/home';
-import globalStore from '@/store';
+import { useMenuStore } from '@/store/modules/menu';
+import { usePlayerStore } from '@/store/modules/player';
+import { useSettingsStore } from '@/store/modules/settings';
 import { isElectron } from '@/utils';
 
 import { isMobile } from './utils';
 
 const { locale } = useI18n();
+const settingsStore = useSettingsStore();
+const menuStore = useMenuStore();
+const playerStore = usePlayerStore();
 
-const savedLanguage = isElectron
-  ? window.electron.ipcRenderer.sendSync('get-store-value', 'set.language')
-  : JSON.parse(localStorage.getItem('appSettings') || '{}').language || 'zh-CN';
-if (savedLanguage) {
-  locale.value = savedLanguage;
-}
-
-const theme = computed(() => {
-  return globalStore.state.theme;
-});
-
-// 监听字体变化并应用
+// 监听语言变化
 watch(
-  () => [globalStore.state.setData.fontFamily, globalStore.state.setData.fontScope],
-  ([newFont, fontScope]) => {
-    const appElement = document.body;
-    if (!appElement) return;
-
-    const defaultFonts =
-      'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif';
-
-    // 只有在全局模式下才应用字体
-    if (fontScope !== 'global') {
-      appElement.style.fontFamily = defaultFonts;
-      return;
-    }
-
-    if (newFont === 'system-ui') {
-      appElement.style.fontFamily = defaultFonts;
-    } else {
-      // 处理多个字体，确保每个字体名都被正确引用
-      const fontList = newFont.split(',').map((font) => {
-        const trimmedFont = font.trim();
-        // 如果字体名包含空格或特殊字符，添加引号（如果还没有引号的话）
-        return /[\s'"()]/.test(trimmedFont) && !/^['"].*['"]$/.test(trimmedFont)
-          ? `"${trimmedFont}"`
-          : trimmedFont;
-      });
-
-      // 将选择的字体和默认字体组合
-      appElement.style.fontFamily = `${fontList.join(', ')}, ${defaultFonts}`;
+  () => settingsStore.setData.language,
+  (newLanguage) => {
+    if (newLanguage && newLanguage !== locale.value) {
+      locale.value = newLanguage;
     }
   },
   { immediate: true }
 );
 
-// 监听来自主进程的语言切换事件
+const theme = computed(() => {
+  return settingsStore.theme;
+});
+
+// 监听字体变化并应用
+watch(
+  () => [settingsStore.setData.fontFamily, settingsStore.setData.fontScope],
+  ([newFont, fontScope]) => {
+    const appElement = document.body;
+    if (newFont && fontScope === 'global') {
+      appElement.style.fontFamily = newFont;
+    } else {
+      appElement.style.fontFamily = '';
+    }
+  }
+);
+
 const handleSetLanguage = (_: any, value: string) => {
-  // 更新 i18n locale
   locale.value = value;
-  // 通过 mutation 更新 store
-  globalStore.commit('setLanguage', value);
+  // settingsStore.setLanguage(value);
 };
 
 onMounted(() => {
-  globalStore.dispatch('initializeSettings');
-  globalStore.dispatch('initializeTheme');
-  globalStore.dispatch('initializeSystemFonts');
-  globalStore.dispatch('initializePlayState');
+  settingsStore.initializeSettings();
+  handleSetLanguage(null, settingsStore.setData.language);
+  settingsStore.initializeTheme();
+  settingsStore.initializeSystemFonts();
+  playerStore.initializePlayState();
   if (isMobile.value) {
-    globalStore.commit(
-      'setMenus',
-      homeRouter.filter((item) => item.meta.isMobile)
-    );
+    menuStore.setMenus(homeRouter.filter((item) => item.meta.isMobile));
   }
-  if (isElectron) {
-    window.electron.ipcRenderer.on('set-language', handleSetLanguage);
-  }
-});
 
-onUnmounted(() => {
   if (isElectron) {
-    window.electron.ipcRenderer.removeListener('set-language', handleSetLanguage);
+    window.electron.ipcRenderer.on('language-changed', handleSetLanguage);
   }
 });
 </script>
diff --git a/src/renderer/api/music.ts b/src/renderer/api/music.ts
index 50bef20..ace8793 100644
--- a/src/renderer/api/music.ts
+++ b/src/renderer/api/music.ts
@@ -1,5 +1,5 @@
 import { musicDB } from '@/hooks/MusicHook';
-import store from '@/store';
+import { useSettingsStore, useUserStore } from '@/store';
 import type { ILyric } from '@/type/lyric';
 import { isElectron } from '@/utils';
 import request from '@/utils/request';
@@ -14,14 +14,16 @@ export const getMusicQualityDetail = (id: number) => {
 
 // 根据音乐Id获取音乐播放URl
 export const getMusicUrl = async (id: number, isDownloaded: boolean = false) => {
+  const userStore = useUserStore();
+  const settingStore = useSettingsStore();
   // 判断是否登录
   try {
-    if (store.state.user && isDownloaded && store.state.user.vipType !== 0) {
+    if (userStore.user && isDownloaded && userStore.user.vipType !== 0) {
       const url = '/song/download/url/v1';
       const res = await request.get(url, {
         params: {
           id,
-          level: store.state.setData.musicQuality || 'higher',
+          level: settingStore.setData.musicQuality || 'higher',
           cookie: `${localStorage.getItem('token')} os=pc;`
         }
       });
@@ -37,7 +39,7 @@ export const getMusicUrl = async (id: number, isDownloaded: boolean = false) =>
   return await request.get('/song/url/v1', {
     params: {
       id,
-      level: store.state.setData.musicQuality || 'higher'
+      level: settingStore.setData.musicQuality || 'higher'
     }
   });
 };
diff --git a/src/renderer/components.d.ts b/src/renderer/components.d.ts
index 7e15b09..962303b 100644
--- a/src/renderer/components.d.ts
+++ b/src/renderer/components.d.ts
@@ -2,7 +2,6 @@
 // @ts-nocheck
 // Generated by unplugin-vue-components
 // Read more: https://github.com/vuejs/core/pull/3399
-// biome-ignore lint: disable
 export {}
 
 /* prettier-ignore */
diff --git a/src/renderer/components/LanguageSwitcher.vue b/src/renderer/components/LanguageSwitcher.vue
index b01094f..3955c30 100644
--- a/src/renderer/components/LanguageSwitcher.vue
+++ b/src/renderer/components/LanguageSwitcher.vue
@@ -1,11 +1,10 @@
 <script setup lang="ts">
-import { computed, onMounted, onUnmounted } from 'vue';
+import { computed } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useStore } from 'vuex';
 
-import { isElectron } from '@/utils';
+import { useSettingsStore } from '@/store/modules/settings';
 
-const store = useStore();
+const settingsStore = useSettingsStore();
 const { locale } = useI18n();
 
 const languages = [
@@ -13,40 +12,12 @@ const languages = [
   { label: 'English', value: 'en-US' }
 ];
 
+console.log('locale', locale);
 // 使用计算属性来获取当前语言
 const currentLanguage = computed({
-  get: () => store.state.setData.language || 'zh-CN',
-  set: (value: string) => {
-    handleLanguageChange(value);
-  }
-});
-
-// 当语言改变时的处理函数
-const handleLanguageChange = (value: string) => {
-  // 更新 i18n locale
-  locale.value = value;
-  // 通过 mutation 更新 store
-  store.commit('setLanguage', value);
-  // 通知主进程语言已更改
-  if (isElectron) {
-    window.electron.ipcRenderer.send('change-language', value);
-  }
-};
-
-// 监听来自主进程的语言切换事件
-const handleSetLanguage = (_: any, value: string) => {
-  handleLanguageChange(value);
-};
-
-onMounted(() => {
-  if (isElectron) {
-    window.electron.ipcRenderer.on('set-language', handleSetLanguage);
-  }
-});
-
-onUnmounted(() => {
-  if (isElectron) {
-    window.electron.ipcRenderer.removeListener('set-language', handleSetLanguage);
+  get: () => locale.value,
+  set: (value) => {
+    settingsStore.setLanguage(value);
   }
 });
 </script>
diff --git a/src/renderer/components/MusicList.vue b/src/renderer/components/MusicList.vue
index aac4ce2..ef8a834 100644
--- a/src/renderer/components/MusicList.vue
+++ b/src/renderer/components/MusicList.vue
@@ -87,16 +87,16 @@
 <script setup lang="ts">
 import { computed, onUnmounted, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useStore } from 'vuex';
 
 import { getMusicDetail } from '@/api/music';
 import SongItem from '@/components/common/SongItem.vue';
+import { usePlayerStore } from '@/store/modules/player';
 import { getImgUrl, isMobile, setAnimationClass, setAnimationDelay } from '@/utils';
 
 import PlayBottom from './common/PlayBottom.vue';
 
 const { t } = useI18n();
-const store = useStore();
+const playerStore = usePlayerStore();
 
 const props = withDefaults(
   defineProps<{
@@ -236,13 +236,13 @@ const loadFullPlaylist = async () => {
 // 处理播放
 const handlePlay = async () => {
   // 先使用当前已加载的歌曲开始播放
-  store.commit('setPlayList', displayedSongs.value.map(formatSong));
+  playerStore.setPlayList(displayedSongs.value.map(formatSong));
 
   // 在后台加载完整播放列表
   loadFullPlaylist().then(() => {
     // 加载完成后，更新播放列表为完整列表
     if (completePlaylist.value.length > 0) {
-      store.commit('setPlayList', completePlaylist.value.map(formatSong));
+      playerStore.setPlayList(completePlaylist.value.map(formatSong));
     }
   });
 };
diff --git a/src/renderer/components/MvPlayer.vue b/src/renderer/components/MvPlayer.vue
index 8680ac8..5f6bded 100644
--- a/src/renderer/components/MvPlayer.vue
+++ b/src/renderer/components/MvPlayer.vue
@@ -191,9 +191,9 @@
 import { NButton, NIcon, NSlider, NTooltip } from 'naive-ui';
 import { computed, nextTick, onMounted, onUnmounted, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useStore } from 'vuex';
 
 import { getMvUrl } from '@/api/mv';
+import { usePlayerStore } from '@/store/modules/player';
 import { IMvItem } from '@/type/mv';
 
 const { t } = useI18n();
@@ -222,7 +222,7 @@ const emit = defineEmits<{
   (e: 'prev', loading: (value: boolean) => void): void;
 }>();
 
-const store = useStore();
+const playerStore = usePlayerStore();
 const mvUrl = ref<string>();
 const playMode = ref<PlayMode>(PLAY_MODE.Auto);
 
@@ -359,8 +359,8 @@ const loadMvUrl = async (mv: IMvItem) => {
 
 const handleClose = () => {
   emit('update:show', false);
-  if (store.state.playMusicUrl) {
-    store.commit('setIsPlay', true);
+  if (playerStore.playMusicUrl) {
+    playerStore.setIsPlay(true);
   }
 };
 
@@ -543,7 +543,11 @@ watch(showControls, (newValue) => {
   }
 });
 
-const isMobile = computed(() => store.state.isMobile);
+const isMobile = computed(() => false); // TODO: 从 settings store 获取
+
+const handlePlay = () => {
+  playerStore.setIsPlay(true);
+};
 </script>
 
 <style scoped lang="scss">
diff --git a/src/renderer/components/common/ArtistDrawer.vue b/src/renderer/components/common/ArtistDrawer.vue
index eab91e0..377efb6 100644
--- a/src/renderer/components/common/ArtistDrawer.vue
+++ b/src/renderer/components/common/ArtistDrawer.vue
@@ -90,14 +90,14 @@
 
 <script setup lang="ts">
 import { useDateFormat } from '@vueuse/core';
-import { ref, watch } from 'vue';
+import { computed, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useStore } from 'vuex';
 
 import { getArtistAlbums, getArtistDetail, getArtistTopSongs } from '@/api/artist';
 import { getMusicDetail } from '@/api/music';
 import SearchItem from '@/components/common/SearchItem.vue';
 import SongItem from '@/components/common/SongItem.vue';
+import { usePlayerStore, useSettingsStore } from '@/store';
 import { IArtist } from '@/type/artist';
 import { getImgUrl } from '@/utils';
 
@@ -105,11 +105,17 @@ import PlayBottom from './PlayBottom.vue';
 
 const { t } = useI18n();
 
+const settingsStore = useSettingsStore();
+const playerStore = usePlayerStore();
+
+const currentArtistId = computed({
+  get: () => settingsStore.currentArtistId,
+  set: (val) => settingsStore.setCurrentArtistId(val as number)
+});
+
 const modelValue = defineModel<boolean>('show', { required: true });
 
-const store = useStore();
 const activeTab = ref('songs');
-const currentArtistId = ref<number>();
 
 // 歌手信息
 const artistInfo = ref<IArtist>();
@@ -134,7 +140,7 @@ const albumPage = ref({
 });
 
 watch(modelValue, (newVal) => {
-  store.commit('setShowArtistDrawer', newVal);
+  settingsStore.setShowArtistDrawer(newVal);
 });
 const loading = ref(false);
 // 加载歌手信息
@@ -260,8 +266,7 @@ const formatPublishTime = (time: number) => {
 };
 
 const handlePlay = () => {
-  store.commit(
-    'setPlayList',
+  playerStore.setPlayList(
     songs.value.map((item) => ({
       ...item,
       picUrl: item.al.picUrl
diff --git a/src/renderer/components/common/DownloadDrawer.vue b/src/renderer/components/common/DownloadDrawer.vue
index fd44335..45aa24d 100644
--- a/src/renderer/components/common/DownloadDrawer.vue
+++ b/src/renderer/components/common/DownloadDrawer.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="download-drawer-trigger">
     <n-badge :value="downloadingCount" :max="99" :show="downloadingCount > 0">
-      <n-button circle @click="store.commit('setShowDownloadDrawer', true)">
+      <n-button circle @click="settingsStore.showDownloadDrawer = true">
         <template #icon>
           <i class="iconfont ri-download-cloud-2-line"></i>
         </template>
@@ -179,9 +179,10 @@ import type { ProgressStatus } from 'naive-ui';
 import { useMessage } from 'naive-ui';
 import { computed, onMounted, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useStore } from 'vuex';
 
 import { getMusicDetail } from '@/api/music';
+import { usePlayerStore } from '@/store/modules/player';
+import { useSettingsStore } from '@/store/modules/settings';
 // import { audioService } from '@/services/audioService';
 import { getImgUrl } from '@/utils';
 
@@ -208,11 +209,14 @@ interface DownloadedItem {
 }
 
 const message = useMessage();
-const store = useStore();
+const playerStore = usePlayerStore();
+const settingsStore = useSettingsStore();
 
 const showDrawer = computed({
-  get: () => store.state.showDownloadDrawer,
-  set: (val) => store.commit('setShowDownloadDrawer', val)
+  get: () => settingsStore.showDownloadDrawer,
+  set: (val) => {
+    settingsStore.showDownloadDrawer = val;
+  }
 });
 
 const downloadList = ref<DownloadItem[]>([]);
@@ -224,10 +228,6 @@ const downList = computed(() => {
   return (downloadedList.value as DownloadedItem[]).reverse();
 });
 
-// 获取播放状态
-// const play = computed(() => store.state.play as boolean);
-// const currentMusic = computed(() => store.state.playMusic);
-
 // 计算下载中的任务数量
 const downloadingCount = computed(() => {
   return downloadList.value.filter((item) => item.status === 'downloading').length;
@@ -343,51 +343,11 @@ const confirmDelete = async () => {
 };
 
 // 播放音乐
-// const handlePlayMusic = async (item: DownloadedItem) => {
-//   // 确保路径正确编码
-//   const encodedPath = encodeURIComponent(item.path);
-//   const localUrl = `local://${encodedPath}`;
-
-//   const musicInfo = {
-//     name: item.filename,
-//     id: item.id,
-//     url: localUrl,
-//     playMusicUrl: localUrl,
-//     picUrl: item.picUrl,
-//     ar: item.ar || [{ name: '本地音乐' }],
-//     song: {
-//       artists: item.ar || [{ name: '本地音乐' }]
-//     },
-//     al: {
-//       picUrl: item.picUrl || '/images/default_cover.png'
-//     }
-//   };
-
-//   // 如果是当前播放的音乐，则切换播放状态
-//   if (currentMusic.value?.id === item.id) {
-//     if (play.value) {
-//       audioService.getCurrentSound()?.pause();
-//       store.commit('setPlayMusic', false);
-//     } else {
-//       audioService.getCurrentSound()?.play();
-//       store.commit('setPlayMusic', true);
-//     }
-//     return;
-//   }
-
-//   // 播放新的音乐
-//   store.commit('setPlay', musicInfo);
-//   store.commit('setPlayMusic', true);
-//   store.commit('setIsPlay', true);
-
-//   store.commit(
-//     'setPlayList',
-//     downloadedList.value.map((item) => ({
-//       ...item,
-//       playMusicUrl: `local://${encodeURIComponent(item.path)}`
-//     }))
-//   );
-// };
+const handlePlay = async (musicInfo: SongResult) => {
+  await playerStore.setPlay(musicInfo);
+  playerStore.setPlayMusic(true);
+  playerStore.setIsPlay(true);
+};
 
 // 获取已下载音乐列表
 const refreshDownloadedList = async () => {
@@ -522,7 +482,7 @@ onMounted(() => {
 });
 
 const handleDrawerClose = () => {
-  store.commit('setShowDownloadDrawer', false);
+  settingsStore.showDownloadDrawer = false;
 };
 </script>
 
diff --git a/src/renderer/components/common/PlayBottom.vue b/src/renderer/components/common/PlayBottom.vue
index 622353d..ada3112 100644
--- a/src/renderer/components/common/PlayBottom.vue
+++ b/src/renderer/components/common/PlayBottom.vue
@@ -3,10 +3,13 @@
 </template>
 
 <script setup lang="ts">
-import { useStore } from 'vuex';
+import { computed } from 'vue';
+
+import { usePlayerStore } from '@/store/modules/player';
+
+const playerStore = usePlayerStore();
+const isPlay = computed(() => playerStore.isPlay);
 
-const store = useStore();
-const isPlay = computed(() => store.state.isPlay as boolean);
 defineProps({
   height: {
     type: String,
diff --git a/src/renderer/components/common/PlaylistDrawer.vue b/src/renderer/components/common/PlaylistDrawer.vue
index b588ce7..42679a8 100644
--- a/src/renderer/components/common/PlaylistDrawer.vue
+++ b/src/renderer/components/common/PlaylistDrawer.vue
@@ -110,12 +110,13 @@
 import { useMessage } from 'naive-ui';
 import { computed, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useStore } from 'vuex';
 
 import { createPlaylist, updatePlaylistTracks } from '@/api/music';
 import { getUserPlaylist } from '@/api/user';
+import { useUserStore } from '@/store';
 import { getImgUrl } from '@/utils';
 
+const store = useUserStore();
 const { t } = useI18n();
 const props = defineProps<{
   modelValue: boolean;
@@ -127,7 +128,6 @@ const emit = defineEmits(['update:modelValue']);
 const message = useMessage();
 const playlists = ref<any[]>([]);
 const creating = ref(false);
-const store = useStore();
 const isCreating = ref(false);
 
 const formValue = ref({
@@ -151,7 +151,7 @@ const toggleCreateForm = () => {
 // 获取用户歌单
 const fetchUserPlaylists = async () => {
   try {
-    const { user } = store.state;
+    const { user } = store;
     if (!user?.userId) {
       message.error(t('comp.playlistDrawer.loginFirst'));
       emit('update:modelValue', false);
diff --git a/src/renderer/components/common/SearchItem.vue b/src/renderer/components/common/SearchItem.vue
index 626b2ae..ed07220 100644
--- a/src/renderer/components/common/SearchItem.vue
+++ b/src/renderer/components/common/SearchItem.vue
@@ -40,11 +40,10 @@
 </template>
 
 <script setup lang="ts">
-import { useStore } from 'vuex';
-
 import { getAlbum, getListDetail } from '@/api/list';
 import MvPlayer from '@/components/MvPlayer.vue';
 import { audioService } from '@/services/audioService';
+import { usePlayerStore } from '@/store/modules/player';
 import { IMvItem } from '@/type/mv';
 import { getImgUrl } from '@/utils';
 
@@ -72,6 +71,8 @@ const songList = ref<any[]>([]);
 const showPop = ref(false);
 const listInfo = ref<any>(null);
 
+const playerStore = usePlayerStore();
+
 const getCurrentMv = () => {
   return {
     id: props.item.id,
@@ -79,8 +80,6 @@ const getCurrentMv = () => {
   } as unknown as IMvItem;
 };
 
-const store = useStore();
-
 const handleClick = async () => {
   listInfo.value = null;
   if (props.item.type === '专辑') {
@@ -108,12 +107,17 @@ const handleClick = async () => {
   }
 
   if (props.item.type === 'mv') {
-    store.commit('setIsPlay', false);
-    store.commit('setPlayMusic', false);
-    audioService.getCurrentSound()?.pause();
-    showPop.value = true;
+    handleShowMv(getCurrentMv());
   }
 };
+
+const handleShowMv = async (item: IMvItem) => {
+  playerStore.setIsPlay(false);
+  playerStore.setPlayMusic(false);
+  audioService.getCurrentSound()?.pause();
+  showPop.value = true;
+  currentMv.value = item;
+};
 </script>
 
 <style scoped lang="scss">
diff --git a/src/renderer/components/common/SongItem.vue b/src/renderer/components/common/SongItem.vue
index fb6c869..f175878 100644
--- a/src/renderer/components/common/SongItem.vue
+++ b/src/renderer/components/common/SongItem.vue
@@ -90,10 +90,10 @@ import type { MenuOption } from 'naive-ui';
 import { NImage, NText, useMessage } from 'naive-ui';
 import { computed, h, inject, ref, useTemplateRef } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useStore } from 'vuex';
 
 import { getSongUrl } from '@/hooks/MusicListHook';
 import { audioService } from '@/services/audioService';
+import { usePlayerStore, useSettingsStore } from '@/store';
 import type { SongResult } from '@/type/music';
 import { getImgUrl, isElectron } from '@/utils';
 import { getImageBackground } from '@/utils/linearColor';
@@ -120,11 +120,13 @@ const props = withDefaults(
   }
 );
 
-const store = useStore();
+const playerStore = usePlayerStore();
+const settingsStore = useSettingsStore();
+
 const message = useMessage();
 
-const play = computed(() => store.state.play as boolean);
-const playMusic = computed(() => store.state.playMusic);
+const play = computed(() => playerStore.isPlay);
+const playMusic = computed(() => playerStore.playMusic);
 const playLoading = computed(
   () => playMusic.value.id === props.item.id && playMusic.value.playLoading
 );
@@ -356,31 +358,31 @@ const imageLoad = async () => {
 const playMusicEvent = async (item: SongResult) => {
   if (playMusic.value.id === item.id) {
     if (play.value) {
-      store.commit('setPlayMusic', false);
+      playerStore.setPlayMusic(false);
       audioService.getCurrentSound()?.pause();
     } else {
-      store.commit('setPlayMusic', true);
+      playerStore.setPlayMusic(true);
       audioService.getCurrentSound()?.play();
     }
     return;
   }
-  await store.commit('setPlay', item);
-  store.commit('setIsPlay', true);
+  await playerStore.setPlay(item);
+  playerStore.isPlay = true;
   emits('play', item);
 };
 
 // 判断是否已收藏
 const isFavorite = computed(() => {
-  return store.state.favoriteList.includes(props.item.id);
+  return playerStore.favoriteList.includes(props.item.id);
 });
 
 // 切换收藏状态
 const toggleFavorite = async (e: Event) => {
   e.stopPropagation();
   if (isFavorite.value) {
-    store.commit('removeFromFavorite', props.item.id);
+    playerStore.removeFromFavorite(props.item.id);
   } else {
-    store.commit('addToFavorite', props.item.id);
+    playerStore.addToFavorite(props.item.id);
   }
 };
 
@@ -390,7 +392,7 @@ const toggleSelect = () => {
 };
 
 const handleArtistClick = (id: number) => {
-  store.commit('setCurrentArtistId', id);
+  settingsStore.currentArtistId = id;
 };
 
 // 获取歌手列表（最多显示5个）
@@ -400,7 +402,7 @@ const artists = computed(() => {
 
 // 添加到下一首播放
 const handlePlayNext = () => {
-  store.commit('addToNextPlay', props.item);
+  playerStore.addToNextPlay(props.item);
   message.success(t('songItem.message.addedToNextPlay'));
 };
 </script>
diff --git a/src/renderer/components/common/UpdateModal.vue b/src/renderer/components/common/UpdateModal.vue
index 99a1de0..6eaad8d 100644
--- a/src/renderer/components/common/UpdateModal.vue
+++ b/src/renderer/components/common/UpdateModal.vue
@@ -73,8 +73,8 @@
 import { marked } from 'marked';
 import { computed, onMounted, onUnmounted, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useStore } from 'vuex';
 
+import { useSettingsStore } from '@/store/modules/settings';
 import { checkUpdate, getProxyNodes, UpdateResult } from '@/utils/update';
 
 import config from '../../../../package.json';
@@ -87,7 +87,13 @@ marked.setOptions({
   gfm: true // 启用 GitHub 风格的 Markdown
 });
 
-const showModal = ref(false);
+const settingsStore = useSettingsStore();
+
+const showModal = computed({
+  get: () => settingsStore.showUpdateModal,
+  set: (val) => settingsStore.setShowUpdateModal(val)
+});
+
 const updateInfo = ref<UpdateResult>({
   hasUpdate: false,
   latestVersion: '',
@@ -95,28 +101,6 @@ const updateInfo = ref<UpdateResult>({
   releaseInfo: null
 });
 
-const store = useStore();
-
-// 添加计算属性
-const showUpdateModalState = computed({
-  get: () => store.state.showUpdateModal,
-  set: (val) => store.commit('setShowUpdateModal', val)
-});
-
-// 替换原来的 watch
-watch(showUpdateModalState, (newVal) => {
-  if (newVal) {
-    showModal.value = true;
-  }
-});
-
-watch(
-  () => showModal.value,
-  (newVal) => {
-    showUpdateModalState.value = newVal;
-  }
-);
-
 // 解析 Markdown
 const parsedReleaseNotes = computed(() => {
   if (!updateInfo.value.releaseInfo?.body) return '';
diff --git a/src/renderer/components/home/RecommendSonglist.vue b/src/renderer/components/home/RecommendSonglist.vue
index 0e1e0ed..924e9e7 100644
--- a/src/renderer/components/home/RecommendSonglist.vue
+++ b/src/renderer/components/home/RecommendSonglist.vue
@@ -24,15 +24,15 @@
 
 <script lang="ts" setup>
 import { useI18n } from 'vue-i18n';
-import { useStore } from 'vuex';
 
 import { getRecommendMusic } from '@/api/home';
 import SongItem from '@/components/common/SongItem.vue';
+import { usePlayerStore } from '@/store/modules/player';
 import type { IRecommendMusic } from '@/type/music';
 import { setAnimationClass, setAnimationDelay } from '@/utils';
 
 const { t } = useI18n();
-const store = useStore();
+const playerStore = usePlayerStore();
 // 推荐歌曲
 const recommendMusic = ref<IRecommendMusic>();
 const loading = ref(false);
@@ -51,7 +51,9 @@ onMounted(() => {
 });
 
 const handlePlay = () => {
-  store.commit('setPlayList', recommendMusic.value?.result);
+  if (recommendMusic.value?.result) {
+    playerStore.setPlayList(recommendMusic.value.result);
+  }
 };
 </script>
 
diff --git a/src/renderer/hooks/MusicHook.ts b/src/renderer/hooks/MusicHook.ts
index 1bf98ec..132bc88 100644
--- a/src/renderer/hooks/MusicHook.ts
+++ b/src/renderer/hooks/MusicHook.ts
@@ -1,15 +1,17 @@
 import { createDiscreteApi } from 'naive-ui';
 import { computed, nextTick, onMounted, onUnmounted, ref, watch } from 'vue';
 
+import i18n from '@/../i18n/renderer';
 import useIndexedDB from '@/hooks/IndexDBHook';
 import { audioService } from '@/services/audioService';
-import store from '@/store';
+import pinia, { usePlayerStore } from '@/store';
 import type { Artist, ILyricText, SongResult } from '@/type/music';
 import { isElectron } from '@/utils';
 import { getTextColors } from '@/utils/linearColor';
 
 const windowData = window as any;
 
+const playerStore = usePlayerStore(pinia);
 export const lrcArray = ref<ILyricText[]>([]); // 歌词数组
 export const lrcTimeArray = ref<number[]>([]); // 歌词时间数组
 export const nowTime = ref(0); // 当前播放时间
@@ -17,12 +19,12 @@ export const allTime = ref(0); // 总播放时间
 export const nowIndex = ref(0); // 当前播放歌词
 export const correctionTime = ref(0.4); // 歌词矫正时间Correction time
 export const currentLrcProgress = ref(0); // 来存储当前歌词的进度
-export const playMusic = computed(() => store.state.playMusic as SongResult); // 当前播放歌曲
+export const playMusic = computed(() => playerStore.playMusic as SongResult); // 当前播放歌曲
 export const sound = ref<Howl | null>(audioService.getCurrentSound());
 export const isLyricWindowOpen = ref(false); // 新增状态
 export const textColors = ref<any>(getTextColors());
 export const artistList = computed(
-  () => (store.state.playMusic.ar || store.state.playMusic?.song?.artists) as Artist[]
+  () => (playerStore.playMusic.ar || playerStore.playMusic?.song?.artists) as Artist[]
 );
 
 export const musicDB = await useIndexedDB('musicDB', [
@@ -40,11 +42,11 @@ document.onkeyup = (e) => {
 
   switch (e.code) {
     case 'Space':
-      if (store.state.play) {
-        store.commit('setPlayMusic', false);
+      if (playerStore.play) {
+        playerStore.setPlayMusic(false);
         audioService.getCurrentSound()?.pause();
       } else {
-        store.commit('setPlayMusic', true);
+        playerStore.setPlayMusic(true);
         audioService.getCurrentSound()?.play();
       }
       break;
@@ -68,7 +70,7 @@ const stopProgressAnimation = () => {
 
 // 全局更新函数
 const updateProgress = () => {
-  if (!store.state.play) {
+  if (!playerStore.play) {
     stopProgressAnimation();
     return;
   }
@@ -105,11 +107,11 @@ const updateProgress = () => {
 
       // 保存当前播放进度到 localStorage (每秒保存一次，避免频繁写入)
       if (Math.floor(currentTime) % 2 === 0) {
-        if (store.state.playMusic && store.state.playMusic.id) {
+        if (playerStore.playMusic && playerStore.playMusic.id) {
           localStorage.setItem(
             'playProgress',
             JSON.stringify({
-              songId: store.state.playMusic.id,
+              songId: playerStore.playMusic.id,
               progress: currentTime
             })
           );
@@ -158,7 +160,7 @@ const initProgressAnimation = () => {
   let debounceTimer: any = null;
 
   watch(
-    () => store.state.play,
+    () => playerStore.play,
     (newIsPlaying) => {
       console.log('播放状态变化:', newIsPlaying);
 
@@ -200,7 +202,7 @@ const initProgressAnimation = () => {
   // 监听当前歌词索引变化
   watch(nowIndex, () => {
     currentLrcProgress.value = 0;
-    if (store.state.play) {
+    if (playerStore.play) {
       startProgressAnimation();
     }
   });
@@ -208,7 +210,7 @@ const initProgressAnimation = () => {
   // 监听音频对象变化
   watch(sound, (newSound) => {
     console.log('sound 对象变化:', !!newSound);
-    if (newSound && store.state.play) {
+    if (newSound && playerStore.play) {
       startProgressAnimation();
     }
   });
@@ -219,12 +221,12 @@ initProgressAnimation();
 
 // 简化后的 watch 函数，只保留核心逻辑
 watch(
-  () => store.state.playMusicUrl,
+  () => playerStore.playMusicUrl,
   async (newVal) => {
     if (newVal && playMusic.value) {
       try {
         // 保存当前播放状态
-        const shouldPlay = store.state.play;
+        const shouldPlay = playerStore.play;
 
         // 检查是否有保存的进度
         let initialPosition = 0;
@@ -247,20 +249,20 @@ watch(
         setupAudioListeners();
 
         // 确保状态与 localStorage 同步
-        localStorage.setItem('currentPlayMusic', JSON.stringify(store.state.playMusic));
+        localStorage.setItem('currentPlayMusic', JSON.stringify(playerStore.playMusic));
         localStorage.setItem('currentPlayMusicUrl', newVal);
       } catch (error) {
         console.error('播放音频失败:', error);
-        store.commit('setPlayMusic', false);
-        message.error('当前歌曲播放失败，播放下一首');
-        store.commit('nextPlay');
+        // store.commit('setPlayMusic', false);
+        playerStore.setPlayMusic(false);
+        message.error(i18n.global.t('player.playFailed'));
       }
     }
   }
 );
 
 watch(
-  () => store.state.playMusic,
+  () => playerStore.playMusic,
   () => {
     nextTick(async () => {
       console.log('歌曲切换，更新歌词数据');
@@ -322,7 +324,7 @@ const setupAudioListeners = () => {
 
   // 监听播放
   audioService.on('play', () => {
-    store.commit('setPlayMusic', true);
+    playerStore.setPlayMusic(true);
     clearInterval();
     interval = window.setInterval(() => {
       try {
@@ -371,7 +373,7 @@ const setupAudioListeners = () => {
   // 监听暂停
   audioService.on('pause', () => {
     console.log('音频暂停事件触发');
-    store.commit('setPlayMusic', false);
+    playerStore.setPlayMusic(false);
     clearInterval();
     if (isElectron && isLyricWindowOpen.value) {
       sendLyricToWin();
@@ -388,17 +390,17 @@ const setupAudioListeners = () => {
       }
 
       // 重新播放当前歌曲
-      if (store.state.playMusicUrl && playMusic.value) {
-        const newSound = await audioService.play(store.state.playMusicUrl, playMusic.value);
+      if (playerStore.playMusicUrl && playMusic.value) {
+        const newSound = await audioService.play(playerStore.playMusicUrl, playMusic.value);
         sound.value = newSound as Howl;
         setupAudioListeners();
       } else {
         console.error('No music URL or playMusic data available');
-        store.commit('nextPlay');
+        playerStore.nextPlay();
       }
     } catch (error) {
       console.error('Error replaying song:', error);
-      store.commit('nextPlay');
+      playerStore.nextPlay();
     }
   };
 
@@ -407,27 +409,27 @@ const setupAudioListeners = () => {
     console.log('音频播放结束事件触发');
     clearInterval();
 
-    if (store.state.playMode === 1) {
+    if (playerStore.playMode === 1) {
       // 单曲循环模式
       if (sound.value) {
         replayMusic();
       }
-    } else if (store.state.playMode === 2) {
+    } else if (playerStore.playMode === 2) {
       // 随机播放模式
-      const { playList } = store.state;
-      if (playList.length <= 1) {
+
+      if (playerStore.playList.length <= 1) {
         replayMusic();
       } else {
         let randomIndex;
         do {
-          randomIndex = Math.floor(Math.random() * playList.length);
-        } while (randomIndex === store.state.playListIndex && playList.length > 1);
-        store.state.playListIndex = randomIndex;
-        store.commit('setPlay', playList[randomIndex]);
+          randomIndex = Math.floor(Math.random() * playerStore.playList.length);
+        } while (randomIndex === playerStore.playListIndex && playerStore.playList.length > 1);
+        playerStore.playListIndex = randomIndex;
+        playerStore.setPlay(playerStore.playList[randomIndex]);
       }
     } else {
       // 列表循环模式
-      store.commit('nextPlay');
+      playerStore.nextPlay();
     }
   });
 
@@ -444,11 +446,11 @@ export const pause = () => {
     try {
       // 保存当前播放进度
       const currentTime = currentSound.seek() as number;
-      if (store.state.playMusic && store.state.playMusic.id) {
+      if (playerStore.playMusic && playerStore.playMusic.id) {
         localStorage.setItem(
           'playProgress',
           JSON.stringify({
-            songId: store.state.playMusic.id,
+            songId: playerStore.playMusic.id,
             progress: currentTime
           })
         );
@@ -572,7 +574,7 @@ export const sendLyricToWin = () => {
         nowTime: nowTime.value,
         startCurrentTime: lrcTimeArray.value[nowIndex] || 0,
         nextTime: lrcTimeArray.value[nowIndex + 1] || 0,
-        isPlay: store.state.play,
+        isPlay: playerStore.play,
         lrcArray: lrcArray.value,
         lrcTimeArray: lrcTimeArray.value,
         allTime: allTime.value,
@@ -591,7 +593,7 @@ export const sendLyricToWin = () => {
         nowTime: nowTime.value,
         startCurrentTime: 0,
         nextTime: 0,
-        isPlay: store.state.play,
+        isPlay: playerStore.play,
         lrcArray: [{ text: '当前歌曲暂无歌词', trText: '' }],
         lrcTimeArray: [0],
         allTime: allTime.value,
@@ -616,14 +618,14 @@ const startLyricSync = () => {
 
   // 每秒同步一次歌词数据
   lyricSyncInterval = setInterval(() => {
-    if (isElectron && isLyricWindowOpen.value && store.state.play && playMusic.value?.id) {
+    if (isElectron && isLyricWindowOpen.value && playerStore.play && playMusic.value?.id) {
       // 发送当前播放进度的更新
       try {
         const updateData = {
           type: 'update',
           nowIndex: getLrcIndex(nowTime.value),
           nowTime: nowTime.value,
-          isPlay: store.state.play
+          isPlay: playerStore.play
         };
         window.api.sendLyric(JSON.stringify(updateData));
       } catch (error) {
@@ -669,7 +671,7 @@ export const openLyric = () => {
         nowTime: nowTime.value,
         startCurrentTime: 0,
         nextTime: 0,
-        isPlay: store.state.play,
+        isPlay: playerStore.play,
         lrcArray: [{ text: '加载歌词中...', trText: '' }],
         lrcTimeArray: [0],
         allTime: allTime.value,
@@ -707,7 +709,7 @@ export const closeLyric = () => {
 
 // 在组件挂载时设置对播放状态的监听
 watch(
-  () => store.state.play,
+  () => playerStore.play,
   (isPlaying) => {
     // 如果歌词窗口打开，根据播放状态控制同步
     if (isElectron && isLyricWindowOpen.value) {
@@ -735,19 +737,20 @@ if (isElectron) {
   windowData.electron.ipcRenderer.on('lyric-control-back', (_, command: string) => {
     switch (command) {
       case 'playpause':
-        if (store.state.play) {
-          store.commit('setPlayMusic', false);
+        if (playerStore.play) {
+          playerStore.setPlayMusic(false);
           audioService.getCurrentSound()?.pause();
         } else {
-          store.commit('setPlayMusic', true);
+          playerStore.setPlayMusic(true);
+
           audioService.getCurrentSound()?.play();
         }
         break;
       case 'prev':
-        store.commit('prevPlay');
+        playerStore.prevPlay();
         break;
       case 'next':
-        store.commit('nextPlay');
+        playerStore.nextPlay();
         break;
       case 'close':
         isLyricWindowOpen.value = false; // 确保状态更新
@@ -776,15 +779,15 @@ onMounted(() => {
     sound.value = audioService.getCurrentSound();
 
     // 如果当前处于播放状态，启动进度更新
-    if (store.state.play && sound.value) {
+    if (playerStore.play && sound.value) {
       // 如果有保存的播放进度，应用它
-      if (store.state.savedPlayProgress !== undefined && sound.value) {
+      if (playerStore.savedPlayProgress !== undefined && sound.value) {
         try {
           // 设置音频位置
-          sound.value.seek(store.state.savedPlayProgress);
+          sound.value.seek(playerStore.savedPlayProgress);
           // 同时更新时间显示，这样进度条也会更新
-          nowTime.value = store.state.savedPlayProgress;
-          console.log('恢复播放进度:', store.state.savedPlayProgress);
+          nowTime.value = playerStore.savedPlayProgress;
+          console.log('恢复播放进度:', playerStore.savedPlayProgress);
         } catch (e) {
           console.error('恢复播放进度失败:', e);
         }
diff --git a/src/renderer/layout/AppLayout.vue b/src/renderer/layout/AppLayout.vue
index b9be4c3..1de059d 100644
--- a/src/renderer/layout/AppLayout.vue
+++ b/src/renderer/layout/AppLayout.vue
@@ -21,18 +21,18 @@
             </router-view>
           </div>
           <play-bottom height="5rem" />
-          <app-menu v-if="isMobile && !store.state.musicFull" class="menu" :menus="menus" />
+          <app-menu v-if="isMobile && !playerStore.musicFull" class="menu" :menus="menus" />
         </div>
       </div>
       <!-- 底部音乐播放 -->
-      <play-bar v-show="isPlay" :style="isMobile && store.state.musicFull ? 'bottom: 0;' : ''" />
+      <play-bar v-show="isPlay" :style="isMobile && playerStore.musicFull ? 'bottom: 0;' : ''" />
       <!-- 下载管理抽屉 -->
       <download-drawer
         v-if="
           isElectron &&
-          (store.state.setData?.alwaysShowDownloadButton ||
-            store.state.showDownloadDrawer ||
-            store.state.hasDownloadingTasks)
+          (settingsStore.setData?.alwaysShowDownloadButton ||
+            settingsStore.showDownloadDrawer ||
+            settingsStore.setData?.hasDownloadingTasks)
         "
       />
     </div>
@@ -46,13 +46,15 @@
 <script lang="ts" setup>
 import { computed, defineAsyncComponent, nextTick, onMounted, provide, ref, watch } from 'vue';
 import { useRoute } from 'vue-router';
-import { useStore } from 'vuex';
 
 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 homeRouter from '@/router/home';
+import { useMenuStore } from '@/store/modules/menu';
+import { usePlayerStore } from '@/store/modules/player';
+import { useSettingsStore } from '@/store/modules/settings';
 import { isElectron, isMobile } from '@/utils';
 
 const keepAliveInclude = computed(() =>
@@ -73,26 +75,28 @@ const TitleBar = defineAsyncComponent(() => import('./components/TitleBar.vue'))
 const ArtistDrawer = defineAsyncComponent(() => import('@/components/common/ArtistDrawer.vue'));
 const PlaylistDrawer = defineAsyncComponent(() => import('@/components/common/PlaylistDrawer.vue'));
 
-const store = useStore();
+const playerStore = usePlayerStore();
+const settingsStore = useSettingsStore();
+const menuStore = useMenuStore();
 
-const isPlay = computed(() => store.state.isPlay as boolean);
-const { menus } = store.state;
+const isPlay = computed(() => playerStore.playMusic && playerStore.playMusic.id);
+const { menus } = menuStore;
 const route = useRoute();
 
 onMounted(() => {
-  store.dispatch('initializeSettings');
-  store.dispatch('initializeTheme');
+  settingsStore.initializeSettings();
+  settingsStore.initializeTheme();
 });
 
 const artistDrawerRef = ref<InstanceType<typeof ArtistDrawer>>();
 const artistDrawerShow = computed({
-  get: () => store.state.showArtistDrawer,
-  set: (val) => store.commit('setShowArtistDrawer', val)
+  get: () => settingsStore.showArtistDrawer,
+  set: (val) => settingsStore.setShowArtistDrawer(val)
 });
 
 // 监听歌手ID变化
 watch(
-  () => store.state.currentArtistId,
+  () => settingsStore.currentArtistId,
   (newId) => {
     if (newId) {
       artistDrawerShow.value = true;
diff --git a/src/renderer/layout/components/MusicFull.vue b/src/renderer/layout/components/MusicFull.vue
index f84741f..664fc4a 100644
--- a/src/renderer/layout/components/MusicFull.vue
+++ b/src/renderer/layout/components/MusicFull.vue
@@ -131,7 +131,6 @@
 import { useDebounceFn } from '@vueuse/core';
 import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useStore } from 'vuex';
 
 import LyricSettings from '@/components/lyric/LyricSettings.vue';
 import {
@@ -143,6 +142,8 @@ import {
   textColors,
   useLyricProgress
 } from '@/hooks/MusicHook';
+import { usePlayerStore } from '@/store/modules/player';
+import { useSettingsStore } from '@/store/modules/settings';
 import { getImgUrl, isMobile } from '@/utils';
 import { animateGradient, getHoverBackgroundColor, getTextColors } from '@/utils/linearColor';
 
@@ -372,13 +373,15 @@ onBeforeUnmount(() => {
   }
 });
 
-const store = useStore();
+const playerStore = usePlayerStore();
+const settingsStore = useSettingsStore();
+
 const handleArtistClick = (id: number) => {
   isVisible.value = false;
-  store.commit('setCurrentArtistId', id);
+  settingsStore.currentArtistId = id;
 };
 
-const setData = computed(() => store.state.setData);
+const setData = computed(() => settingsStore.setData);
 
 // 监听字体变化并更新 CSS 变量
 watch(
diff --git a/src/renderer/layout/components/PlayBar.vue b/src/renderer/layout/components/PlayBar.vue
index d083b11..1258e80 100644
--- a/src/renderer/layout/components/PlayBar.vue
+++ b/src/renderer/layout/components/PlayBar.vue
@@ -13,7 +13,7 @@
         ? textColors.theme === 'dark'
           ? '#000000'
           : '#ffffff'
-        : store.state.theme === 'dark'
+        : settingsStore.theme === 'dark'
           ? '#ffffff'
           : '#000000'
     }"
@@ -178,7 +178,6 @@
 import { useThrottleFn } from '@vueuse/core';
 import { computed, ref, useTemplateRef, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useStore } from 'vuex';
 
 import SongItem from '@/components/common/SongItem.vue';
 import EqControl from '@/components/EQControl.vue';
@@ -193,23 +192,26 @@ import {
   textColors
 } from '@/hooks/MusicHook';
 import { audioService } from '@/services/audioService';
+import { usePlayerStore } from '@/store/modules/player';
+import { useSettingsStore } from '@/store/modules/settings';
 import type { SongResult } from '@/type/music';
 import { getImgUrl, isElectron, isMobile, secondToMinute, setAnimationClass } from '@/utils';
 import { showShortcutToast } from '@/utils/shortcutToast';
 
 import MusicFull from './MusicFull.vue';
 
-const store = useStore();
+const playerStore = usePlayerStore();
+const settingsStore = useSettingsStore();
 const { t } = useI18n();
 // 是否播放
-const play = computed(() => store.state.play as boolean);
+const play = computed(() => playerStore.isPlay);
 // 播放列表
-const playList = computed(() => store.state.playList as SongResult[]);
+const playList = computed(() => playerStore.playList as SongResult[]);
 // 背景颜色
 const background = ref('#000');
 
 watch(
-  () => store.state.playMusic,
+  () => playerStore.playMusic,
   async () => {
     background.value = playMusic.value.backgroundColor as string;
   },
@@ -268,7 +270,7 @@ const mute = () => {
 };
 
 // 播放模式
-const playMode = computed(() => store.state.playMode);
+const playMode = computed(() => playerStore.playMode);
 const playModeIcon = computed(() => {
   switch (playMode.value) {
     case 0:
@@ -296,15 +298,15 @@ const playModeText = computed(() => {
 
 // 切换播放模式
 const togglePlayMode = () => {
-  store.commit('togglePlayMode');
+  playerStore.togglePlayMode();
 };
 
 function handleNext() {
-  store.commit('nextPlay');
+  playerStore.nextPlay();
 }
 
 function handlePrev() {
-  store.commit('prevPlay');
+  playerStore.prevPlay();
 }
 
 const MusicFullRef = ref<any>(null);
@@ -313,9 +315,9 @@ const MusicFullRef = ref<any>(null);
 const playMusicEvent = async () => {
   try {
     // 检查是否有有效的音乐对象和 URL
-    if (!playMusic.value?.id || !store.state.playMusicUrl) {
+    if (!playMusic.value?.id || !playerStore.playMusicUrl) {
       console.warn('No valid music or URL available');
-      store.commit('setPlay', playMusic.value);
+      playerStore.setPlay(playMusic.value);
       return;
     }
 
@@ -323,7 +325,7 @@ const playMusicEvent = async () => {
       // 暂停播放
       if (audioService.getCurrentSound()) {
         audioService.pause();
-        store.commit('setPlayMusic', false);
+        playerStore.setPlayMusic(false);
       }
     } else {
       // 开始播放
@@ -332,13 +334,13 @@ const playMusicEvent = async () => {
         audioService.play();
       } else {
         // 如果没有音频实例，重新创建并播放
-        await audioService.play(store.state.playMusicUrl, playMusic.value);
+        await audioService.play(playerStore.playMusicUrl, playMusic.value);
       }
-      store.commit('setPlayMusic', true);
+      playerStore.setPlayMusic(true);
     }
   } catch (error) {
     console.error('播放出错:', error);
-    store.commit('nextPlay');
+    playerStore.nextPlay();
   }
 };
 
@@ -347,31 +349,31 @@ const musicFullVisible = ref(false);
 // 设置musicFull
 const setMusicFull = () => {
   musicFullVisible.value = !musicFullVisible.value;
-  store.commit('setMusicFull', musicFullVisible.value);
+  playerStore.setMusicFull(musicFullVisible.value);
   if (musicFullVisible.value) {
-    store.commit('setShowArtistDrawer', false);
+    settingsStore.showArtistDrawer = false;
   }
 };
 
-const palyListRef = useTemplateRef('palyListRef');
+const palyListRef = useTemplateRef('palyListRef') as any;
 
 const scrollToPlayList = (val: boolean) => {
   if (!val) return;
   setTimeout(() => {
-    palyListRef.value?.scrollTo({ top: store.state.playListIndex * 62 });
+    palyListRef.value?.scrollTo({ top: playerStore.playListIndex * 62 });
   }, 50);
 };
 
 const isFavorite = computed(() => {
-  return store.state.favoriteList.includes(playMusic.value.id);
+  return playerStore.favoriteList.includes(playMusic.value.id);
 });
 
 const toggleFavorite = async (e: Event) => {
   e.stopPropagation();
   if (isFavorite.value) {
-    store.commit('removeFromFavorite', playMusic.value.id);
+    playerStore.removeFromFavorite(playMusic.value.id);
   } else {
-    store.commit('addToFavorite', playMusic.value.id);
+    playerStore.addToFavorite(playMusic.value.id);
   }
 };
 
@@ -381,7 +383,7 @@ const openLyricWindow = () => {
 
 const handleArtistClick = (id: number) => {
   musicFullVisible.value = false;
-  store.commit('setCurrentArtistId', id);
+  settingsStore.currentArtistId = id;
 };
 
 // 添加全局快捷键处理
@@ -392,8 +394,8 @@ if (isElectron) {
       case 'togglePlay':
         playMusicEvent();
         showShortcutToast(
-          store.state.play ? t('player.playBar.play') : t('player.playBar.pause'),
-          store.state.play ? 'ri-pause-circle-line' : 'ri-play-circle-line'
+          play.value ? t('player.playBar.play') : t('player.playBar.pause'),
+          play.value ? 'ri-pause-circle-line' : 'ri-play-circle-line'
         );
         break;
       case 'prevPlay':
diff --git a/src/renderer/layout/components/SearchBar.vue b/src/renderer/layout/components/SearchBar.vue
index ea2eac0..97fa5f4 100644
--- a/src/renderer/layout/components/SearchBar.vue
+++ b/src/renderer/layout/components/SearchBar.vue
@@ -16,7 +16,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 === store.state.searchType)?.label }}
+                {{ searchTypeOptions.find((item) => item.key === searchStore.searchType)?.label }}
               </div>
               <i class="iconfont icon-xiasanjiaoxing"></i>
             </div>
@@ -28,11 +28,11 @@
       <template #trigger>
         <div class="user-box">
           <n-avatar
-            v-if="store.state.user"
+            v-if="userStore.user"
             class="cursor-pointer"
             circle
             size="medium"
-            :src="getImgUrl(store.state.user.avatarUrl)"
+            :src="getImgUrl(userStore.user.avatarUrl)"
             @click="selectItem('user')"
           />
           <div v-else class="mx-2 rounded-full cursor-pointer text-sm" @click="toLogin">
@@ -41,16 +41,16 @@
         </div>
       </template>
       <div class="user-popover">
-        <div v-if="store.state.user" class="user-header" @click="selectItem('user')">
-          <n-avatar circle size="small" :src="getImgUrl(store.state.user?.avatarUrl)" />
-          <span class="username">{{ store.state.user?.nickname || 'Theodore' }}</span>
+        <div v-if="userStore.user" class="user-header" @click="selectItem('user')">
+          <n-avatar circle size="small" :src="getImgUrl(userStore.user?.avatarUrl)" />
+          <span class="username">{{ userStore.user?.nickname || 'Theodore' }}</span>
         </div>
         <div class="menu-items">
-          <div v-if="!store.state.user" class="menu-item" @click="toLogin">
+          <div v-if="!userStore.user" class="menu-item" @click="toLogin">
             <i class="iconfont ri-login-box-line"></i>
             <span>{{ t('comp.searchBar.toLogin') }}</span>
           </div>
-          <div v-if="store.state.user" class="menu-item" @click="selectItem('logout')">
+          <div v-if="userStore.user" class="menu-item" @click="selectItem('logout')">
             <i class="iconfont ri-logout-box-r-line"></i>
             <span>{{ t('comp.searchBar.logout') }}</span>
           </div>
@@ -60,9 +60,9 @@
             <span>{{ t('comp.searchBar.set') }}</span>
           </div>
           <div class="menu-item">
-            <i class="iconfont" :class="isDarkTheme ? 'ri-moon-line' : 'ri-sun-line'"></i>
+            <i class="iconfont" :class="isDark ? 'ri-moon-line' : 'ri-sun-line'"></i>
             <span>{{ t('comp.searchBar.theme') }}</span>
-            <n-switch v-model:value="isDarkTheme" class="ml-auto">
+            <n-switch v-model:value="isDark" class="ml-auto">
               <template #checked>
                 <i class="ri-moon-line"></i>
               </template>
@@ -105,7 +105,6 @@
 import { computed, onMounted, ref, watchEffect } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
-import { useStore } from 'vuex';
 
 import { getSearchKeyword } from '@/api/home';
 import { getUserDetail } from '@/api/login';
@@ -113,13 +112,20 @@ import alipay from '@/assets/alipay.png';
 import wechat from '@/assets/wechat.png';
 import Coffee from '@/components/Coffee.vue';
 import { SEARCH_TYPES, USER_SET_OPTIONS } from '@/const/bar-const';
+import { usePlayerStore } from '@/store/modules/player';
+import { useSearchStore } from '@/store/modules/search';
+import { useSettingsStore } from '@/store/modules/settings';
+import { useUserStore } from '@/store/modules/user';
 import { getImgUrl } from '@/utils';
 import { checkUpdate, UpdateResult } from '@/utils/update';
 
 import config from '../../../../package.json';
 
 const router = useRouter();
-const store = useStore();
+const playerStore = usePlayerStore();
+const searchStore = useSearchStore();
+const settingsStore = useSettingsStore();
+const userStore = useUserStore();
 const userSetOptions = ref(USER_SET_OPTIONS);
 const { t } = useI18n();
 
@@ -137,15 +143,15 @@ const loadPage = async () => {
   if (!token) return;
   const { data } = await getUserDetail();
   console.log('data', data);
-  store.state.user =
-    data.profile || store.state.user || JSON.parse(localStorage.getItem('user') || '{}');
-  localStorage.setItem('user', JSON.stringify(store.state.user));
+  userStore.user =
+    data.profile || userStore.user || JSON.parse(localStorage.getItem('user') || '{}');
+  localStorage.setItem('user', JSON.stringify(userStore.user));
 };
 
 loadPage();
 
 watchEffect(() => {
-  if (store.state.user) {
+  if (userStore.user) {
     userSetOptions.value = USER_SET_OPTIONS;
   } else {
     userSetOptions.value = USER_SET_OPTIONS.filter((item) => item.key !== 'logout');
@@ -167,9 +173,9 @@ onMounted(() => {
   checkForUpdates();
 });
 
-const isDarkTheme = computed({
-  get: () => store.state.theme === 'dark',
-  set: () => store.commit('toggleTheme')
+const isDark = computed({
+  get: () => settingsStore.theme === 'dark',
+  set: () => settingsStore.toggleTheme()
 });
 
 // 搜索词
@@ -182,7 +188,7 @@ const search = () => {
   }
 
   if (router.currentRoute.value.path === '/search') {
-    store.state.searchValue = value;
+    searchStore.searchValue = value;
     return;
   }
 
@@ -190,13 +196,13 @@ const search = () => {
     path: '/search',
     query: {
       keyword: value,
-      type: store.state.searchType
+      type: searchStore.searchType
     }
   });
 };
 
 const selectSearchType = (key: number) => {
-  store.state.searchType = key;
+  searchStore.searchType = key;
   if (searchValue.value) {
     search();
   }
@@ -208,7 +214,7 @@ const selectItem = async (key: string) => {
   // switch 判断
   switch (key) {
     case 'logout':
-      store.commit('logout');
+      userStore.handleLogout();
       break;
     case 'login':
       router.push('/login');
@@ -250,7 +256,7 @@ const checkForUpdates = async () => {
 
 const toGithubRelease = () => {
   if (updateInfo.value.hasUpdate) {
-    store.commit('setShowUpdateModal', true);
+    settingsStore.showUpdateModal = true;
   } else {
     window.open('https://github.com/algerkong/AlgerMusicPlayer/releases', '_blank');
   }
diff --git a/src/renderer/layout/components/TitleBar.vue b/src/renderer/layout/components/TitleBar.vue
index 39a9430..88509b6 100644
--- a/src/renderer/layout/components/TitleBar.vue
+++ b/src/renderer/layout/components/TitleBar.vue
@@ -55,13 +55,13 @@
 <script setup lang="ts">
 import { ref } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useStore } from 'vuex';
 
+import { useSettingsStore } from '@/store/modules/settings';
 import { isElectron } from '@/utils';
 
 const { t } = useI18n();
 
-const store = useStore();
+const settingsStore = useSettingsStore();
 const showCloseModal = ref(false);
 const rememberChoice = ref(false);
 
@@ -80,38 +80,30 @@ const minimize = () => {
 
 const handleAction = (action: 'minimize' | 'close') => {
   if (rememberChoice.value) {
-    store.commit('setSetData', {
-      ...store.state.setData,
+    settingsStore.setSettings({
+      ...settingsStore.setData,
       closeAction: action
     });
   }
 
   if (action === 'minimize') {
-    window.api.miniTray();
+    window.api.minimize();
   } else {
     window.api.close();
   }
   showCloseModal.value = false;
 };
 
-const close = () => {
-  if (!isElectron) {
-    return;
-  }
-
-  const { closeAction } = store.state.setData;
+const handleClose = () => {
+  const { closeAction } = settingsStore.setData;
 
   if (closeAction === 'minimize') {
-    window.api.miniTray();
-    return;
-  }
-
-  if (closeAction === 'close') {
+    window.api.minimize();
+  } else if (closeAction === 'close') {
     window.api.close();
-    return;
+  } else {
+    showCloseModal.value = true;
   }
-
-  showCloseModal.value = true;
 };
 
 const drag = (event: MouseEvent) => {
@@ -120,6 +112,10 @@ const drag = (event: MouseEvent) => {
   }
   window.api.dragStart(event as unknown as string);
 };
+
+const handleThemeChange = () => {
+  settingsStore.toggleTheme();
+};
 </script>
 
 <style scoped lang="scss">
diff --git a/src/renderer/main.ts b/src/renderer/main.ts
index 94f0577..fe70128 100644
--- a/src/renderer/main.ts
+++ b/src/renderer/main.ts
@@ -6,7 +6,7 @@ import { createApp } from 'vue';
 
 import i18n from '@/../i18n/renderer';
 import router from '@/router';
-import store from '@/store';
+import pinia from '@/store';
 
 import App from './App.vue';
 import directives from './directive';
@@ -17,7 +17,7 @@ Object.keys(directives).forEach((key: string) => {
   app.directive(key, directives[key as keyof typeof directives]);
 });
 
+app.use(pinia);
 app.use(router);
-app.use(store);
 app.use(i18n);
 app.mount('#app');
diff --git a/src/renderer/store/index.ts b/src/renderer/store/index.ts
index 04f087e..cb2402f 100644
--- a/src/renderer/store/index.ts
+++ b/src/renderer/store/index.ts
@@ -1,9 +1,11 @@
-import { createStore } from 'vuex';
+import { createPinia } from 'pinia';
+import { markRaw } from 'vue';
 
 import setData from '@/../main/set.json';
 import { logout } from '@/api/login';
 import { getLikedList, likeSong } from '@/api/music';
 import { useMusicListHook } from '@/hooks/MusicListHook';
+import router from '@/router';
 import homeRouter from '@/router/home';
 import type { SongResult } from '@/type/music';
 import { isElectron } from '@/utils';
@@ -409,10 +411,20 @@ const actions = {
   }
 };
 
-const store = createStore({
-  state,
-  mutations,
-  actions
+// 创建 pinia 实例
+const pinia = createPinia();
+
+// 添加路由到 Pinia
+pinia.use(({ store }) => {
+  store.router = markRaw(router);
 });
 
-export default store;
+// 导出所有 store
+export * from './modules/lyric';
+export * from './modules/menu';
+export * from './modules/player';
+export * from './modules/search';
+export * from './modules/settings';
+export * from './modules/user';
+
+export default pinia;
diff --git a/src/renderer/store/modules/lyric.ts b/src/renderer/store/modules/lyric.ts
new file mode 100644
index 0000000..2b264d6
--- /dev/null
+++ b/src/renderer/store/modules/lyric.ts
@@ -0,0 +1,15 @@
+import { defineStore } from 'pinia';
+import { ref } from 'vue';
+
+export const useLyricStore = defineStore('lyric', () => {
+  const lyric = ref({});
+
+  const setLyric = (newLyric: any) => {
+    lyric.value = newLyric;
+  };
+
+  return {
+    lyric,
+    setLyric
+  };
+});
diff --git a/src/renderer/store/modules/menu.ts b/src/renderer/store/modules/menu.ts
new file mode 100644
index 0000000..50589ab
--- /dev/null
+++ b/src/renderer/store/modules/menu.ts
@@ -0,0 +1,17 @@
+import { defineStore } from 'pinia';
+import { ref } from 'vue';
+
+import homeRouter from '@/router/home';
+
+export const useMenuStore = defineStore('menu', () => {
+  const menus = ref(homeRouter);
+
+  const setMenus = (newMenus: any[]) => {
+    menus.value = newMenus;
+  };
+
+  return {
+    menus,
+    setMenus
+  };
+});
diff --git a/src/renderer/store/modules/player.ts b/src/renderer/store/modules/player.ts
new file mode 100644
index 0000000..b0bebec
--- /dev/null
+++ b/src/renderer/store/modules/player.ts
@@ -0,0 +1,455 @@
+import { cloneDeep } from 'lodash';
+import { defineStore } from 'pinia';
+import { computed, ref } from 'vue';
+
+import { getLikedList, getMusicLrc, getMusicUrl, getParsingMusicUrl } from '@/api/music';
+import { useMusicHistory } from '@/hooks/MusicHistoryHook';
+import type { ILyric, ILyricText, SongResult } from '@/type/music';
+import { getImgUrl } from '@/utils';
+import { getImageLinearBackground } from '@/utils/linearColor';
+
+import { useSettingsStore } from './settings';
+import { useUserStore } from './user';
+
+const musicHistory = useMusicHistory();
+
+const preloadingSounds = ref<Howl[]>([]);
+
+function getLocalStorageItem<T>(key: string, defaultValue: T): T {
+  try {
+    const item = localStorage.getItem(key);
+    return item ? JSON.parse(item) : defaultValue;
+  } catch {
+    return defaultValue;
+  }
+}
+
+export const getSongUrl = async (id: number, songData: any, isDownloaded: boolean = false) => {
+  const { data } = await getMusicUrl(id, isDownloaded);
+  let url = '';
+  let songDetail = null;
+  try {
+    if (data.data[0].freeTrialInfo || !data.data[0].url) {
+      const res = await getParsingMusicUrl(id, songData);
+      url = res.data.data.url;
+      songDetail = res.data.data;
+    } else {
+      songDetail = data.data[0] as any;
+    }
+  } catch (error) {
+    console.error('error', error);
+  }
+  if (isDownloaded) {
+    return songDetail;
+  }
+  url = url || data.data[0].url;
+  return url;
+};
+const parseTime = (timeString: string): number => {
+  const [minutes, seconds] = timeString.split(':');
+  return Number(minutes) * 60 + Number(seconds);
+};
+
+const parseLyricLine = (lyricLine: string): { time: number; text: string } => {
+  const TIME_REGEX = /(\d{2}:\d{2}(\.\d*)?)/g;
+  const LRC_REGEX = /(\[(\d{2}):(\d{2})(\.(\d*))?\])/g;
+  const timeText = lyricLine.match(TIME_REGEX)?.[0] || '';
+  const time = parseTime(timeText);
+  const text = lyricLine.replace(LRC_REGEX, '').trim();
+  return { time, text };
+};
+
+const parseLyrics = (lyricsString: string): { lyrics: ILyricText[]; times: number[] } => {
+  const lines = lyricsString.split('\n');
+  const lyrics: ILyricText[] = [];
+  const times: number[] = [];
+  lines.forEach((line) => {
+    const { time, text } = parseLyricLine(line);
+    times.push(time);
+    lyrics.push({ text, trText: '' });
+  });
+  return { lyrics, times };
+};
+
+export const loadLrc = async (playMusicId: number): Promise<ILyric> => {
+  try {
+    const { data } = await getMusicLrc(playMusicId);
+    const { lyrics, times } = parseLyrics(data.lrc.lyric);
+    const tlyric: Record<string, string> = {};
+
+    if (data.tlyric && data.tlyric.lyric) {
+      const { lyrics: tLyrics, times: tTimes } = parseLyrics(data.tlyric.lyric);
+      tLyrics.forEach((lyric, index) => {
+        tlyric[tTimes[index].toString()] = lyric.text;
+      });
+    }
+
+    lyrics.forEach((item, index) => {
+      item.trText = item.text ? tlyric[times[index].toString()] || '' : '';
+    });
+    return {
+      lrcTimeArray: times,
+      lrcArray: lyrics
+    };
+  } catch (err) {
+    console.error('Error loading lyrics:', err);
+    return {
+      lrcTimeArray: [],
+      lrcArray: []
+    };
+  }
+};
+
+const getSongDetail = async (playMusic: SongResult) => {
+  playMusic.playLoading = true;
+  const playMusicUrl =
+    playMusic.playMusicUrl || (await getSongUrl(playMusic.id, cloneDeep(playMusic)));
+  const { backgroundColor, primaryColor } =
+    playMusic.backgroundColor && playMusic.primaryColor
+      ? playMusic
+      : await getImageLinearBackground(getImgUrl(playMusic?.picUrl, '30y30'));
+
+  playMusic.playLoading = false;
+  return { ...playMusic, playMusicUrl, backgroundColor, primaryColor } as SongResult;
+};
+
+const preloadNextSong = (nextSongUrl: string) => {
+  try {
+    // 限制同时预加载的数量
+    if (preloadingSounds.value.length >= 2) {
+      const oldestSound = preloadingSounds.value.shift();
+      if (oldestSound) {
+        oldestSound.unload();
+      }
+    }
+
+    const sound = new Howl({
+      src: [nextSongUrl],
+      html5: true,
+      preload: true,
+      autoplay: false
+    });
+
+    preloadingSounds.value.push(sound);
+
+    // 添加加载错误处理
+    sound.on('loaderror', () => {
+      console.error('预加载音频失败:', nextSongUrl);
+      const index = preloadingSounds.value.indexOf(sound);
+      if (index > -1) {
+        preloadingSounds.value.splice(index, 1);
+      }
+      sound.unload();
+    });
+
+    return sound;
+  } catch (error) {
+    console.error('预加载音频出错:', error);
+    return null;
+  }
+};
+
+const fetchSongs = async (playList: SongResult[], startIndex: number, endIndex: number) => {
+  try {
+    const songs = playList.slice(Math.max(0, startIndex), Math.min(endIndex, playList.length));
+
+    const detailedSongs = await Promise.all(
+      songs.map(async (song: SongResult) => {
+        try {
+          // 如果歌曲详情已经存在，就不重复请求
+          if (!song.playMusicUrl) {
+            return await getSongDetail(song);
+          }
+          return song;
+        } catch (error) {
+          console.error('获取歌曲详情失败:', error);
+          return song;
+        }
+      })
+    );
+
+    // 加载下一首的歌词
+    const nextSong = detailedSongs[0];
+    if (nextSong && !(nextSong.lyric && nextSong.lyric.lrcTimeArray.length > 0)) {
+      try {
+        nextSong.lyric = await loadLrc(nextSong.id);
+      } catch (error) {
+        console.error('加载歌词失败:', error);
+      }
+    }
+
+    // 更新播放列表中的歌曲详情
+    detailedSongs.forEach((song, index) => {
+      if (song && startIndex + index < playList.length) {
+        playList[startIndex + index] = song;
+      }
+    });
+
+    // 只预加载下一首歌曲
+    if (nextSong && nextSong.playMusicUrl) {
+      preloadNextSong(nextSong.playMusicUrl);
+    }
+  } catch (error) {
+    console.error('获取歌曲列表失败:', error);
+  }
+};
+
+// 异步加载歌词的方法
+const loadLrcAsync = async (playMusic: SongResult) => {
+  if (playMusic.lyric && playMusic.lyric.lrcTimeArray.length > 0) {
+    return;
+  }
+  const lyrics = await loadLrc(playMusic.id);
+  playMusic.lyric = lyrics;
+};
+
+export const usePlayerStore = defineStore('player', () => {
+  // 状态
+  const play = ref(false);
+  const isPlay = ref(false);
+  const playMusic = ref<SongResult>(getLocalStorageItem('currentPlayMusic', {} as SongResult));
+  const playMusicUrl = ref(getLocalStorageItem('currentPlayMusicUrl', ''));
+  const playList = ref<SongResult[]>(getLocalStorageItem('playList', []));
+  const playListIndex = ref(getLocalStorageItem('playListIndex', 0));
+  const playMode = ref(getLocalStorageItem('playMode', 0));
+  const musicFull = ref(false);
+  const favoriteList = ref<number[]>(getLocalStorageItem('favoriteList', []));
+  const savedPlayProgress = ref<number | undefined>();
+
+  // 计算属性
+  const currentSong = computed(() => playMusic.value);
+  const isPlaying = computed(() => isPlay.value);
+  const currentPlayList = computed(() => playList.value);
+  const currentPlayListIndex = computed(() => playListIndex.value);
+
+  const handlePlayMusic = async (music: SongResult, isPlay: boolean = true) => {
+    const updatedPlayMusic = await getSongDetail(music);
+    playMusic.value = updatedPlayMusic;
+    playMusicUrl.value = updatedPlayMusic.playMusicUrl as string;
+
+    // 记录当前设置的播放状态
+    play.value = isPlay;
+
+    // 每次设置新歌曲时，立即更新 localStorage
+    localStorage.setItem('currentPlayMusic', JSON.stringify(playMusic.value));
+    localStorage.setItem('currentPlayMusicUrl', playMusicUrl.value);
+    localStorage.setItem('isPlaying', play.value.toString());
+
+    // 设置网页标题
+    document.title = `${updatedPlayMusic.name} - ${updatedPlayMusic?.song?.artists?.reduce((prev, curr) => `${prev}${curr.name}/`, '')}`;
+    loadLrcAsync(playMusic.value);
+    musicHistory.addMusic(playMusic.value);
+    playListIndex.value = playList.value.findIndex((item: SongResult) => item.id === music.id);
+    // 请求后续五首歌曲的详情
+    fetchSongs(playList.value, playListIndex.value + 1, playListIndex.value + 6);
+  };
+
+  // 方法
+  const setPlay = async (song: SongResult) => {
+    await handlePlayMusic(song);
+    localStorage.setItem('currentPlayMusic', JSON.stringify(playMusic.value));
+    localStorage.setItem('currentPlayMusicUrl', playMusicUrl.value);
+  };
+
+  const setIsPlay = (value: boolean) => {
+    isPlay.value = value;
+    localStorage.setItem('isPlaying', value.toString());
+  };
+
+  const setPlayMusic = async (value: boolean | SongResult) => {
+    if (typeof value === 'boolean') {
+      play.value = value;
+      isPlay.value = value;
+      localStorage.setItem('isPlaying', value.toString());
+    } else {
+      await handlePlayMusic(value);
+      play.value = true;
+      isPlay.value = true;
+      localStorage.setItem('currentPlayMusic', JSON.stringify(playMusic.value));
+      localStorage.setItem('currentPlayMusicUrl', playMusicUrl.value);
+    }
+  };
+
+  const setMusicFull = (value: boolean) => {
+    musicFull.value = value;
+  };
+
+  const setPlayList = (list: SongResult[]) => {
+    playListIndex.value = list.findIndex((item) => item.id === playMusic.value.id);
+    playList.value = list;
+    localStorage.setItem('playList', JSON.stringify(list));
+    localStorage.setItem('playListIndex', playListIndex.value.toString());
+  };
+
+  const addToNextPlay = (song: SongResult) => {
+    const list = [...playList.value];
+    const currentIndex = playListIndex.value;
+
+    const existingIndex = list.findIndex((item) => item.id === song.id);
+    if (existingIndex !== -1) {
+      list.splice(existingIndex, 1);
+    }
+
+    list.splice(currentIndex + 1, 0, song);
+    setPlayList(list);
+  };
+
+  const nextPlay = async () => {
+    if (playList.value.length === 0) {
+      play.value = true;
+      return;
+    }
+
+    let nowPlayListIndex: number;
+
+    if (playMode.value === 2) {
+      // 随机播放模式
+      do {
+        nowPlayListIndex = Math.floor(Math.random() * playList.value.length);
+      } while (nowPlayListIndex === playListIndex.value && playList.value.length > 1);
+    } else {
+      // 列表循环模式
+      nowPlayListIndex = (playListIndex.value + 1) % playList.value.length;
+    }
+
+    playListIndex.value = nowPlayListIndex;
+    await handlePlayMusic(playList.value[playListIndex.value]);
+  };
+
+  const prevPlay = async () => {
+    if (playList.value.length === 0) {
+      play.value = true;
+      return;
+    }
+    const nowPlayListIndex =
+      (playListIndex.value - 1 + playList.value.length) % playList.value.length;
+    await handlePlayMusic(playList.value[nowPlayListIndex]);
+    await fetchSongs(playList.value, playListIndex.value - 5, nowPlayListIndex);
+  };
+
+  const togglePlayMode = () => {
+    playMode.value = (playMode.value + 1) % 3;
+    localStorage.setItem('playMode', JSON.stringify(playMode.value));
+  };
+
+  const addToFavorite = async (id: number) => {
+    if (!favoriteList.value.includes(id)) {
+      favoriteList.value.push(id);
+      localStorage.setItem('favoriteList', JSON.stringify(favoriteList.value));
+    }
+  };
+
+  const removeFromFavorite = async (id: number) => {
+    favoriteList.value = favoriteList.value.filter((item) => item !== id);
+    localStorage.setItem('favoriteList', JSON.stringify(favoriteList.value));
+  };
+
+  // 初始化播放状态
+  const initializePlayState = async () => {
+    const settingStore = useSettingsStore();
+    const savedPlayList = getLocalStorageItem('playList', []);
+    const savedPlayMusic = getLocalStorageItem<SongResult | null>('currentPlayMusic', null);
+    const savedProgress = localStorage.getItem('playProgress');
+
+    if (savedPlayList.length > 0) {
+      setPlayList(savedPlayList);
+    }
+
+    if (savedPlayMusic && Object.keys(savedPlayMusic).length > 0) {
+      try {
+        console.log('settingStore.setData', settingStore.setData);
+        const isPlaying = settingStore.setData.autoPlay;
+        await handlePlayMusic(savedPlayMusic, isPlaying);
+
+        if (savedProgress) {
+          try {
+            const progress = JSON.parse(savedProgress);
+            if (progress && progress.songId === savedPlayMusic.id) {
+              savedPlayProgress.value = progress.progress;
+            } else {
+              localStorage.removeItem('playProgress');
+            }
+          } catch (e) {
+            console.error('解析保存的播放进度失败', e);
+            localStorage.removeItem('playProgress');
+          }
+        }
+      } catch (error) {
+        console.error('重新获取音乐链接失败:', error);
+        play.value = false;
+        isPlay.value = false;
+        playMusic.value = {} as SongResult;
+        playMusicUrl.value = '';
+        localStorage.removeItem('currentPlayMusic');
+        localStorage.removeItem('currentPlayMusicUrl');
+        localStorage.removeItem('isPlaying');
+        localStorage.removeItem('playProgress');
+      }
+    }
+  };
+
+  const initializeFavoriteList = async () => {
+    const userStore = useUserStore();
+    // 先获取本地收藏列表
+    const localFavoriteList = localStorage.getItem('favoriteList');
+    const localList: number[] = localFavoriteList ? JSON.parse(localFavoriteList) : [];
+
+    // 如果用户已登录，尝试获取服务器收藏列表并合并
+    if (userStore.user && userStore.user.userId) {
+      try {
+        const res = await getLikedList(userStore.user.userId);
+        if (res.data?.ids) {
+          // 合并本地和服务器的收藏列表，去重
+          const serverList = res.data.ids.reverse();
+          const mergedList = Array.from(new Set([...localList, ...serverList]));
+          favoriteList.value = mergedList;
+        } else {
+          favoriteList.value = localList;
+        }
+      } catch (error) {
+        console.error('获取服务器收藏列表失败，使用本地数据:', error);
+        favoriteList.value = localList;
+      }
+    } else {
+      favoriteList.value = localList;
+    }
+
+    // 更新本地存储
+    localStorage.setItem('favoriteList', JSON.stringify(favoriteList.value));
+  };
+
+  return {
+    // 状态
+    play,
+    isPlay,
+    playMusic,
+    playMusicUrl,
+    playList,
+    playListIndex,
+    playMode,
+    musicFull,
+    savedPlayProgress,
+    favoriteList,
+
+    // 计算属性
+    currentSong,
+    isPlaying,
+    currentPlayList,
+    currentPlayListIndex,
+
+    // 方法
+    setPlay,
+    setIsPlay,
+    nextPlay,
+    prevPlay,
+    setPlayMusic,
+    setMusicFull,
+    setPlayList,
+    addToNextPlay,
+    togglePlayMode,
+    initializePlayState,
+    initializeFavoriteList,
+    addToFavorite,
+    removeFromFavorite
+  };
+});
diff --git a/src/renderer/store/modules/search.ts b/src/renderer/store/modules/search.ts
new file mode 100644
index 0000000..14c018b
--- /dev/null
+++ b/src/renderer/store/modules/search.ts
@@ -0,0 +1,22 @@
+import { defineStore } from 'pinia';
+import { ref } from 'vue';
+
+export const useSearchStore = defineStore('search', () => {
+  const searchValue = ref('');
+  const searchType = ref(1);
+
+  const setSearchValue = (value: string) => {
+    searchValue.value = value;
+  };
+
+  const setSearchType = (type: number) => {
+    searchType.value = type;
+  };
+
+  return {
+    searchValue,
+    searchType,
+    setSearchValue,
+    setSearchType
+  };
+});
diff --git a/src/renderer/store/modules/settings.ts b/src/renderer/store/modules/settings.ts
new file mode 100644
index 0000000..f220097
--- /dev/null
+++ b/src/renderer/store/modules/settings.ts
@@ -0,0 +1,127 @@
+import { cloneDeep } from 'lodash';
+import { defineStore } from 'pinia';
+import { ref } from 'vue';
+
+import setDataDefault from '@/../main/set.json';
+import { isElectron } from '@/utils';
+import { applyTheme, getCurrentTheme, ThemeType } from '@/utils/theme';
+
+export const useSettingsStore = defineStore('settings', () => {
+  // 初始化时先从存储中读取设置
+  const getInitialSettings = () => {
+    if (isElectron) {
+      const savedSettings = window.electron.ipcRenderer.sendSync('get-store-value', 'set');
+      return savedSettings || setDataDefault;
+    }
+    const savedSettings = localStorage.getItem('appSettings');
+    return savedSettings ? JSON.parse(savedSettings) : setDataDefault;
+  };
+
+  const setData = ref(getInitialSettings());
+  const theme = ref<ThemeType>(getCurrentTheme());
+  const isMobile = ref(false);
+  const showUpdateModal = ref(false);
+  const showArtistDrawer = ref(false);
+  const currentArtistId = ref<number | null>(null);
+  const systemFonts = ref<{ label: string; value: string }[]>([
+    { label: '系统默认', value: 'system-ui' }
+  ]);
+  const showDownloadDrawer = ref(false);
+
+  const setSetData = (data: any) => {
+    if (isElectron) {
+      console.log('data', data);
+      window.electron.ipcRenderer.send('set-store-value', 'set', cloneDeep(data));
+      setData.value = cloneDeep(data);
+    } else {
+      localStorage.setItem('appSettings', JSON.stringify(cloneDeep(data)));
+    }
+  };
+
+  const toggleTheme = () => {
+    theme.value = theme.value === 'dark' ? 'light' : 'dark';
+    applyTheme(theme.value);
+  };
+
+  const setShowUpdateModal = (value: boolean) => {
+    showUpdateModal.value = value;
+  };
+
+  const setShowArtistDrawer = (show: boolean) => {
+    showArtistDrawer.value = show;
+    if (!show) {
+      currentArtistId.value = null;
+    }
+  };
+
+  const setCurrentArtistId = (id: number) => {
+    currentArtistId.value = id;
+  };
+
+  const setSystemFonts = (fonts: string[]) => {
+    systemFonts.value = [
+      { label: '系统默认', value: 'system-ui' },
+      ...fonts.map((font) => ({
+        label: font,
+        value: font
+      }))
+    ];
+  };
+
+  const setShowDownloadDrawer = (show: boolean) => {
+    showDownloadDrawer.value = show;
+  };
+
+  const setLanguage = (language: string) => {
+    setSetData({
+      ...setData.value,
+      language
+    });
+    if (isElectron) {
+      window.electron.ipcRenderer.send('change-language', language);
+    }
+  };
+
+  const initializeSettings = () => {
+    // const savedSettings = getInitialSettings();
+    // setData.value = savedSettings;
+  };
+
+  const initializeTheme = () => {
+    applyTheme(theme.value);
+  };
+
+  const initializeSystemFonts = async () => {
+    if (!isElectron) return;
+    if (systemFonts.value.length > 1) return;
+
+    try {
+      const fonts = await window.api.invoke('get-system-fonts');
+      setSystemFonts(fonts);
+    } catch (error) {
+      console.error('获取系统字体失败:', error);
+    }
+  };
+
+  return {
+    setData,
+    theme,
+    isMobile,
+    showUpdateModal,
+    showArtistDrawer,
+    currentArtistId,
+    systemFonts,
+    showDownloadDrawer,
+    setSetData,
+    toggleTheme,
+    setShowUpdateModal,
+    setShowArtistDrawer,
+    setCurrentArtistId,
+    setSystemFonts,
+    setShowDownloadDrawer,
+    setLanguage,
+    initializeSettings,
+    initializeTheme,
+    initializeSystemFonts
+  };
+});
diff --git a/src/renderer/store/modules/user.ts b/src/renderer/store/modules/user.ts
new file mode 100644
index 0000000..1c4fe67
--- /dev/null
+++ b/src/renderer/store/modules/user.ts
@@ -0,0 +1,84 @@
+import { defineStore } from 'pinia';
+import { ref } from 'vue';
+
+import { logout } from '@/api/login';
+import { getLikedList } from '@/api/music';
+
+interface UserData {
+  userId: number;
+  [key: string]: any;
+}
+
+function getLocalStorageItem<T>(key: string, defaultValue: T): T {
+  try {
+    const item = localStorage.getItem(key);
+    return item ? JSON.parse(item) : defaultValue;
+  } catch {
+    return defaultValue;
+  }
+}
+
+export const useUserStore = defineStore('user', () => {
+  // 状态
+  const user = ref<UserData | null>(getLocalStorageItem('user', null));
+  const searchValue = ref('');
+  const searchType = ref(1);
+
+  // 方法
+  const setUser = (userData: UserData) => {
+    user.value = userData;
+    localStorage.setItem('user', JSON.stringify(userData));
+  };
+
+  const handleLogout = async () => {
+    try {
+      await logout();
+      user.value = null;
+      localStorage.removeItem('user');
+      localStorage.removeItem('token');
+    } catch (error) {
+      console.error('登出失败:', error);
+    }
+  };
+
+  const setSearchValue = (value: string) => {
+    searchValue.value = value;
+  };
+
+  const setSearchType = (type: number) => {
+    searchType.value = type;
+  };
+
+  // 初始化
+  const initializeUser = async () => {
+    const savedUser = getLocalStorageItem<UserData | null>('user', null);
+    if (savedUser) {
+      user.value = savedUser;
+      // 如果用户已登录，获取收藏列表
+      if (localStorage.getItem('token')) {
+        try {
+          const { data } = await getLikedList(savedUser.userId);
+          return data?.ids || [];
+        } catch (error) {
+          console.error('获取收藏列表失败:', error);
+          return [];
+        }
+      }
+    }
+    return [];
+  };
+
+  return {
+    // 状态
+    user,
+    searchValue,
+    searchType,
+
+    // 方法
+    setUser,
+    handleLogout,
+    setSearchValue,
+    setSearchType,
+    initializeUser
+  };
+});
diff --git a/src/renderer/utils/index.ts b/src/renderer/utils/index.ts
index dfc78b4..8b0028e 100644
--- a/src/renderer/utils/index.ts
+++ b/src/renderer/utils/index.ts
@@ -1,6 +1,6 @@
 import { computed } from 'vue';
 
-import store from '@/store';
+import { useSettingsStore } from '@/store/modules/settings';
 
 // 设置歌手背景图片
 export const setBackgroundImg = (url: String) => {
@@ -8,10 +8,11 @@ export const setBackgroundImg = (url: String) => {
 };
 // 设置动画类型
 export const setAnimationClass = (type: String) => {
-  if (store.state.setData && store.state.setData.noAnimate) {
+  const settingsStore = useSettingsStore();
+  if (settingsStore.setData && settingsStore.setData.noAnimate) {
     return '';
   }
-  const speed = store.state.setData?.animationSpeed || 1;
+  const speed = settingsStore.setData?.animationSpeed || 1;
 
   let speedClass = '';
   if (speed <= 0.3) speedClass = 'animate__slower';
@@ -23,10 +24,11 @@ export const setAnimationClass = (type: String) => {
 };
 // 设置动画延时
 export const setAnimationDelay = (index: number = 6, time: number = 50) => {
-  if (store.state.setData?.noAnimate) {
+  const settingsStore = useSettingsStore();
+  if (settingsStore.setData?.noAnimate) {
     return '';
   }
-  const speed = store.state.setData?.animationSpeed || 1;
+  const speed = settingsStore.setData?.animationSpeed || 1;
   return `animation-delay:${(index * time) / (speed * 2)}ms`;
 };
 
@@ -75,7 +77,8 @@ export const isMobile = computed(() => {
     /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
   );
 
-  store.state.isMobile = !!flag;
+  const settingsStore = useSettingsStore();
+  settingsStore.isMobile = !!flag;
 
   // 给html标签 添加mobile
   if (flag) document.documentElement.classList.add('mobile');
diff --git a/src/renderer/utils/request.ts b/src/renderer/utils/request.ts
index 64aad76..642b34a 100644
--- a/src/renderer/utils/request.ts
+++ b/src/renderer/utils/request.ts
@@ -1,6 +1,7 @@
 import axios, { InternalAxiosRequestConfig } from 'axios';
 
-import store from '@/store';
+import { useSettingsStore } from '@/store/modules/settings';
+import { useUserStore } from '@/store/modules/user';
 
 import { isElectron } from '.';
 
@@ -8,9 +9,13 @@ let setData: any = null;
 const getSetData = () => {
   if (window.electron) {
     setData = window.electron.ipcRenderer.sendSync('get-store-value', 'set');
+  } else {
+    const settingsStore = useSettingsStore();
+    setData = settingsStore.setData;
   }
+  return setData;
 };
-getSetData();
+
 // 扩展请求配置接口
 interface CustomAxiosRequestConfig extends InternalAxiosRequestConfig {
   retryCount?: number;
@@ -34,6 +39,9 @@ const RETRY_DELAY = 500;
 request.interceptors.request.use(
   (config: CustomAxiosRequestConfig) => {
     getSetData();
+    config.baseURL = window.electron
+      ? `http://127.0.0.1:${setData?.musicApiPort}`
+      : import.meta.env.VITE_API;
     // 只在retryCount未定义时初始化为0
     if (config.retryCount === undefined) {
       config.retryCount = 0;
@@ -86,8 +94,9 @@ request.interceptors.response.use(
     // 处理 301 状态码
     if (error.response?.status === 301 && config.params.noLogin !== true) {
       // 使用 store mutation 清除用户信息
-      store.commit('logout');
-      console.error(`301 状态码，清除登录信息后重试第 ${config.retryCount} 次`, config);
+      const userStore = useUserStore();
+      userStore.handleLogout();
+      console.log(`301 状态码，清除登录信息后重试第 ${config.retryCount} 次`);
       config.retryCount = 3;
     }
 
diff --git a/src/renderer/views/favorite/index.vue b/src/renderer/views/favorite/index.vue
index 501a58e..370f32e 100644
--- a/src/renderer/views/favorite/index.vue
+++ b/src/renderer/views/favorite/index.vue
@@ -88,18 +88,18 @@ import { useMessage } from 'naive-ui';
 import { computed, onMounted, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
-import { useStore } from 'vuex';
 
 import { getMusicDetail } from '@/api/music';
 import SongItem from '@/components/common/SongItem.vue';
 import { getSongUrl } from '@/hooks/MusicListHook';
+import { usePlayerStore } from '@/store';
 import type { SongResult } from '@/type/music';
 import { isElectron, setAnimationClass, setAnimationDelay } from '@/utils';
 
 const { t } = useI18n();
-const store = useStore();
+const playerStore = usePlayerStore();
 const message = useMessage();
-const favoriteList = computed(() => store.state.favoriteList);
+const favoriteList = computed(() => playerStore.favoriteList);
 const favoriteSongs = ref<SongResult[]>([]);
 const loading = ref(false);
 const noMore = ref(false);
@@ -277,7 +277,7 @@ const handleScroll = (e: any) => {
 };
 
 onMounted(async () => {
-  await store.dispatch('initializeFavoriteList');
+  await playerStore.initializeFavoriteList();
   await getFavoriteSongs();
 });
 
@@ -293,7 +293,7 @@ watch(
 );
 
 const handlePlay = () => {
-  store.commit('setPlayList', favoriteSongs.value);
+  playerStore.setPlayList(favoriteSongs.value);
 };
 
 const getItemAnimationDelay = (index: number) => {
diff --git a/src/renderer/views/history/index.vue b/src/renderer/views/history/index.vue
index 23d4215..43e4880 100644
--- a/src/renderer/views/history/index.vue
+++ b/src/renderer/views/history/index.vue
@@ -34,11 +34,11 @@
 <script setup lang="ts">
 import { onMounted, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useStore } from 'vuex';
 
 import { getMusicDetail } from '@/api/music';
 import SongItem from '@/components/common/SongItem.vue';
 import { useMusicHistory } from '@/hooks/MusicHistoryHook';
+import { usePlayerStore } from '@/store/modules/player';
 import type { SongResult } from '@/type/music';
 import { setAnimationClass, setAnimationDelay } from '@/utils';
 
@@ -47,12 +47,12 @@ defineOptions({
 });
 
 const { t } = useI18n();
-const store = useStore();
 const { delMusic, musicList } = useMusicHistory();
 const scrollbarRef = ref();
 const loading = ref(false);
 const noMore = ref(false);
 const displayList = ref<SongResult[]>([]);
+const playerStore = usePlayerStore();
 
 // 无限滚动相关配置
 const pageSize = 20;
@@ -112,7 +112,7 @@ const handleScroll = (e: any) => {
 
 // 播放全部
 const handlePlay = () => {
-  store.commit('setPlayList', displayList.value);
+  playerStore.setPlayList(displayList.value);
 };
 
 onMounted(() => {
diff --git a/src/renderer/views/login/index.vue b/src/renderer/views/login/index.vue
index c749ff6..0f2f028 100644
--- a/src/renderer/views/login/index.vue
+++ b/src/renderer/views/login/index.vue
@@ -3,9 +3,9 @@ import { useMessage } from 'naive-ui';
 import { onMounted } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
-import { useStore } from 'vuex';
 
 import { checkQr, createQr, getQrKey, getUserDetail, loginByCellphone } from '@/api/login';
+import { useUserStore } from '@/store/modules/user';
 import { setAnimationClass } from '@/utils';
 
 defineOptions({
@@ -14,11 +14,12 @@ defineOptions({
 
 const { t } = useI18n();
 const message = useMessage();
-const store = useStore();
 const router = useRouter();
 const isQr = ref(true);
 
 const qrUrl = ref<string>();
+const userStore = useUserStore();
+
 onMounted(() => {
   loadLogin();
 });
@@ -56,7 +57,7 @@ const timerIsQr = (key: string) => {
       if (data.code === 803) {
         localStorage.setItem('token', data.cookie);
         const user = await getUserDetail();
-        store.state.user = user.data.profile;
+        userStore.user = user.data.profile;
         localStorage.setItem('user', JSON.stringify(user.data.profile));
         message.success(t('login.message.loginSuccess'));
 
@@ -95,7 +96,7 @@ const loginPhone = async () => {
   const { data } = await loginByCellphone(phone.value, password.value);
   if (data.code === 200) {
     message.success(t('login.message.loginSuccess'));
-    store.state.user = data.profile;
+    userStore.user = data.profile;
     localStorage.setItem('token', data.cookie);
     setTimeout(() => {
       router.push('/user');
diff --git a/src/renderer/views/mv/index.vue b/src/renderer/views/mv/index.vue
index 3659c64..c61261f 100644
--- a/src/renderer/views/mv/index.vue
+++ b/src/renderer/views/mv/index.vue
@@ -64,11 +64,11 @@
 
 <script setup lang="ts">
 import { computed, onMounted, ref, watch } from 'vue';
-import { useStore } from 'vuex';
 
 import { getAllMv, getTopMv } from '@/api/mv';
 import MvPlayer from '@/components/MvPlayer.vue';
 import { audioService } from '@/services/audioService';
+import { usePlayerStore } from '@/store/modules/player';
 import { IMvItem } from '@/type/mv';
 import { formatNumber, getImgUrl, setAnimationClass, setAnimationDelay } from '@/utils';
 
@@ -79,7 +79,6 @@ defineOptions({
 const showMv = ref(false);
 const mvList = ref<Array<IMvItem>>([]);
 const playMvItem = ref<IMvItem>();
-const store = useStore();
 const initLoading = ref(false);
 const loadingMore = ref(false);
 const currentIndex = ref(0);
@@ -97,6 +96,8 @@ const categories = [
 ];
 const selectedCategory = ref('全部');
 
+const playerStore = usePlayerStore();
+
 watch(selectedCategory, async () => {
   offset.value = 0;
   mvList.value = [];
@@ -114,8 +115,8 @@ onMounted(async () => {
 });
 
 const handleShowMv = async (item: IMvItem, index: number) => {
-  store.commit('setIsPlay', false);
-  store.commit('setPlayMusic', false);
+  playerStore.setIsPlay(false);
+  playerStore.setPlayMusic(false);
   audioService.getCurrentSound()?.pause();
   showMv.value = true;
   currentIndex.value = index;
diff --git a/src/renderer/views/search/index.vue b/src/renderer/views/search/index.vue
index c79eb2b..9c8f0e8 100644
--- a/src/renderer/views/search/index.vue
+++ b/src/renderer/views/search/index.vue
@@ -107,12 +107,13 @@ import { useDateFormat } from '@vueuse/core';
 import { onMounted, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRoute } from 'vue-router';
-import { useStore } from 'vuex';
 
 import { getHotSearch } from '@/api/home';
 import { getSearch } from '@/api/search';
 import SearchItem from '@/components/common/SearchItem.vue';
 import SongItem from '@/components/common/SongItem.vue';
+import { usePlayerStore } from '@/store/modules/player';
+import { useSearchStore } from '@/store/modules/search';
 import type { IHotSearch } from '@/type/search';
 import { isMobile, setAnimationClass, setAnimationDelay } from '@/utils';
 
@@ -122,10 +123,11 @@ defineOptions({
 
 const { t } = useI18n();
 const route = useRoute();
-const store = useStore();
+const playerStore = usePlayerStore();
+const searchStore = useSearchStore();
 
 const searchDetail = ref<any>();
-const searchType = computed(() => store.state.searchType as number);
+const searchType = computed(() => searchStore.searchType as number);
 const searchDetailLoading = ref(false);
 const searchHistory = ref<string[]>([]);
 
@@ -188,23 +190,6 @@ onMounted(() => {
 
 const hotKeyword = ref(route.query.keyword || t('search.title.searchList'));
 
-watch(
-  () => store.state.searchValue,
-  (value) => {
-    loadSearch(value);
-  }
-);
-
-watch(
-  () => searchType.value,
-  () => {
-    if (store.state.searchValue) {
-      loadSearch(store.state.searchValue);
-    }
-  }
-);
-
-const dateFormat = (time: any) => useDateFormat(time, 'YYYY.MM.DD').value;
 const loadSearch = async (keywords: any, type: any = null, isLoadMore = false) => {
   if (!keywords) return;
 
@@ -295,6 +280,31 @@ const loadSearch = async (keywords: any, type: any = null, isLoadMore = false) =
   }
 };
 
+watch(
+  () => searchStore.searchValue,
+  (value) => {
+    loadSearch(value);
+  }
+);
+
+watch(
+  () => searchType.value,
+  () => {
+    if (searchStore.searchValue) {
+      loadSearch(searchStore.searchValue);
+    }
+  }
+);
+// 修改 store.state 的访问
+if (searchStore.searchValue) {
+  loadSearch(searchStore.searchValue);
+}
+
+// 修改 store.state 的设置
+searchStore.searchValue = route.query.keyword as string;
+
+const dateFormat = (time: any) => useDateFormat(time, 'YYYY.MM.DD').value;
+
 // 添加滚动处理函数
 const handleScroll = (e: any) => {
   const { scrollTop, scrollHeight, clientHeight } = e.target;
@@ -308,14 +318,14 @@ watch(
   () => route.path,
   async (path) => {
     if (path === '/search') {
-      store.state.searchValue = route.query.keyword;
+      searchStore.searchValue = route.query.keyword as string;
     }
   }
 );
 
 const handlePlay = () => {
   const tracks = searchDetail.value?.songs || [];
-  store.commit('setPlayList', tracks);
+  playerStore.setPlayList(tracks);
 };
 
 // 点击搜索历史
diff --git a/src/renderer/views/set/index.vue b/src/renderer/views/set/index.vue
index 6a752bf..59092e8 100644
--- a/src/renderer/views/set/index.vue
+++ b/src/renderer/views/set/index.vue
@@ -205,7 +205,7 @@
                 </div>
               </div>
               <div class="flex items-center gap-2">
-                <n-button size="small" @click="store.commit('setShowDownloadDrawer', true)">
+                <n-button size="small" @click="settingsStore.showDownloadDrawer = true">
                   {{ t('settings.application.download') }}
                 </n-button>
               </div>
@@ -461,11 +461,11 @@
 </template>
 
 <script setup lang="ts">
+import { cloneDeep } from 'lodash';
 import type { FormRules } from 'naive-ui';
 import { useMessage } from 'naive-ui';
 import { computed, h, nextTick, onMounted, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
-import { useStore } from 'vuex';
 
 import localData from '@/../main/set.json';
 import Coffee from '@/components/Coffee.vue';
@@ -473,13 +473,17 @@ import DonationList from '@/components/common/DonationList.vue';
 import PlayBottom from '@/components/common/PlayBottom.vue';
 import LanguageSwitcher from '@/components/LanguageSwitcher.vue';
 import ShortcutSettings from '@/components/settings/ShortcutSettings.vue';
+import { useSettingsStore } from '@/store/modules/settings';
+import { useUserStore } from '@/store/modules/user';
 import { isElectron } from '@/utils';
 import { openDirectory, selectDirectory } from '@/utils/fileOperation';
 import { checkUpdate, UpdateResult } from '@/utils/update';
 
 import config from '../../../../package.json';
 
-const store = useStore();
+const settingsStore = useSettingsStore();
+const userStore = useUserStore();
+
 const checking = ref(false);
 const updateInfo = ref<UpdateResult>({
   hasUpdate: false,
@@ -490,37 +494,23 @@ const updateInfo = ref<UpdateResult>({
 
 const { t } = useI18n();
 
-const setData = computed(() => {
-  const data = store.state.setData;
-  // 确保代理配置存在
-  if (!data.proxyConfig) {
-    data.proxyConfig = {
-      enable: false,
-      protocol: 'http',
-      host: '127.0.0.1',
-      port: 7890
-    };
-  }
-  // 确保音质设置存在
-  if (!data.musicQuality) {
-    data.musicQuality = 'higher';
-  }
-  return data;
-});
-
-watch(
-  () => setData.value,
-  (newVal) => {
-    store.commit('setSetData', newVal);
-  },
-  { deep: true }
-);
-
+const setData = ref(settingsStore.setData);
 const isDarkTheme = computed({
-  get: () => store.state.theme === 'dark',
-  set: () => store.commit('toggleTheme')
+  get: () => settingsStore.theme === 'dark',
+  set: () => settingsStore.toggleTheme()
 });
 
+// watch(
+//   () => setData.value,
+//   (newData) => {
+//     console.log('newData', newData);
+//     settingsStore.setSetData(newData);
+//   },
+//   {
+//     deep: true
+//   }
+// );
+
 const openAuthor = () => {
   window.open(setData.value.authorUrl);
 };
@@ -552,16 +542,16 @@ const checkForUpdates = async (isClick = false) => {
 };
 
 const openReleasePage = () => {
-  store.commit('setShowUpdateModal', true);
+  settingsStore.showUpdateModal = true;
 };
 
 const selectDownloadPath = async () => {
   const path = await selectDirectory(message);
   if (path) {
-    store.commit('setSetData', {
+    setData.value = {
       ...setData.value,
       downloadPath: path
-    });
+    };
   }
 };
 
@@ -606,7 +596,7 @@ const proxyRules: FormRules = {
 };
 
 // 使用 store 中的字体列表
-const systemFonts = computed(() => store.state.systemFonts);
+const systemFonts = computed(() => settingsStore.systemFonts);
 
 // 已选择的字体列表
 const selectedFonts = ref<string[]>([]);
@@ -622,17 +612,17 @@ watch(
   (newFonts) => {
     // 如果没有选择任何字体，使用系统默认字体
     if (newFonts.length === 0) {
-      store.commit('setSetData', {
+      setData.value = {
         ...setData.value,
         fontFamily: 'system-ui'
-      });
+      };
       return;
     }
     // 将选择的字体组合成字体列表
-    store.commit('setSetData', {
+    setData.value = {
       ...setData.value,
       fontFamily: newFonts.join(',')
-    });
+    };
   },
   { deep: true }
 );
@@ -660,10 +650,10 @@ onMounted(async () => {
   }
   // 确保enableRealIP有默认值
   if (setData.value.enableRealIP === undefined) {
-    store.commit('setSetData', {
+    setData.value = {
       ...setData.value,
       enableRealIP: false
-    });
+    };
   }
 });
 
@@ -686,7 +676,7 @@ const handleProxyConfirm = async () => {
   try {
     await formRef.value?.validate();
     // 保存代理配置时保留enable状态
-    store.commit('setSetData', {
+    setData.value = {
       ...setData.value,
       proxyConfig: {
         enable: setData.value.proxyConfig?.enable || false,
@@ -694,7 +684,7 @@ const handleProxyConfirm = async () => {
         host: proxyForm.value.host,
         port: proxyForm.value.port
       }
-    });
+    };
     showProxyModal.value = false;
     message.success(t('settings.network.messages.proxySuccess'));
   } catch (err) {
@@ -705,20 +695,20 @@ const handleProxyConfirm = async () => {
 const validateAndSaveRealIP = () => {
   const ipRegex = /^(\d{1,3}\.){3}\d{1,3}$/;
   if (!setData.value.realIP || ipRegex.test(setData.value.realIP)) {
-    store.commit('setSetData', {
+    setData.value = {
       ...setData.value,
       realIP: setData.value.realIP,
       enableRealIP: true
-    });
+    };
     if (setData.value.realIP) {
       message.success(t('settings.network.messages.realIPSuccess'));
     }
   } else {
     message.error(t('settings.network.messages.realIPError'));
-    store.commit('setSetData', {
+    setData.value = {
       ...setData.value,
       realIP: ''
-    });
+    };
   }
 };
 
@@ -727,11 +717,11 @@ watch(
   () => setData.value.enableRealIP,
   (newVal) => {
     if (!newVal) {
-      store.commit('setSetData', {
+      setData.value = {
         ...setData.value,
         realIP: '',
         enableRealIP: false
-      });
+      };
     }
   }
 );
@@ -795,7 +785,7 @@ const clearCache = async () => {
         localStorage.removeItem('favoriteList');
         break;
       case 'user':
-        store.commit('logout');
+        userStore.handleLogout();
         break;
       case 'settings':
         if (window.electron) {
diff --git a/src/renderer/views/user/index.vue b/src/renderer/views/user/index.vue
index ae8541a..a76945a 100644
--- a/src/renderer/views/user/index.vue
+++ b/src/renderer/views/user/index.vue
@@ -99,7 +99,6 @@ import { useMessage } from 'naive-ui';
 import { computed, onBeforeUnmount, ref, watch } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
-import { useStore } from 'vuex';
 
 import { getListDetail } from '@/api/list';
 import { updatePlaylistTracks } from '@/api/music';
@@ -107,6 +106,8 @@ import { getUserDetail, getUserPlaylist, getUserRecord } from '@/api/user';
 import PlayBottom from '@/components/common/PlayBottom.vue';
 import SongItem from '@/components/common/SongItem.vue';
 import MusicList from '@/components/MusicList.vue';
+import { usePlayerStore } from '@/store/modules/player';
+import { useUserStore } from '@/store/modules/user';
 import type { Playlist } from '@/type/listDetail';
 import type { IUserDetail } from '@/type/user';
 import { getImgUrl, isMobile, setAnimationClass, setAnimationDelay } from '@/utils';
@@ -116,7 +117,8 @@ defineOptions({
 });
 
 const { t } = useI18n();
-const store = useStore();
+const userStore = useUserStore();
+const playerStore = usePlayerStore();
 const router = useRouter();
 const userDetail = ref<IUserDetail>();
 const playList = ref<any[]>([]);
@@ -128,7 +130,7 @@ const list = ref<Playlist>();
 const listLoading = ref(false);
 const message = useMessage();
 
-const user = computed(() => store.state.user);
+const user = computed(() => userStore.user);
 
 onBeforeUnmount(() => {
   mounted.value = false;
@@ -145,8 +147,8 @@ const checkLoginStatus = () => {
   }
 
   // 如果store中没有用户数据，但localStorage中有，则恢复用户数据
-  if (!store.state.user && userData) {
-    store.state.user = JSON.parse(userData);
+  if (!userStore.user && userData) {
+    userStore.setUser(JSON.parse(userData));
   }
 
   return true;
@@ -184,7 +186,7 @@ const loadData = async () => {
     console.error('加载用户页面失败:', error);
     // 如果获取用户数据失败，可能是token过期
     if (error.response?.status === 401) {
-      store.commit('logout');
+      userStore.logout();
       router.push('/login');
     }
   } finally {
@@ -208,17 +210,13 @@ watch(
 
 // 监听用户状态变化
 watch(
-  () => store.state.user,
+  () => userStore.user,
   (newUser) => {
     if (!mounted.value) return;
-
-    if (!newUser) {
-      router.push('/login');
-    } else {
-      loadPage();
+    if (newUser) {
+      loadUserData();
     }
-  },
-  { immediate: true }
+  }
 );
 
 // 页面挂载时检查登录状态
@@ -271,7 +269,7 @@ const handleRemoveFromPlaylist = async (songId: number) => {
 
 const handlePlay = () => {
   const tracks = recordList.value || [];
-  store.commit('setPlayList', tracks);
+  playerStore.setPlayList(tracks);
 };
 </script>