🗄️ Store 状态管理

GlassMusicPlayer 使用 Pinia 进行状态管理，所有 Store 均支持持久化存储。

🎧 useAudioStore

音频播放器核心状态。

📁 文件位置：src/stores/modules/audio.ts

📊 状态

interface AudioStoreState {
  count: number
  audio: {
    audio: HTMLAudioElement | null  // 音频元素
    isPlaying: boolean              // 是否播放中
    isPaused: boolean               // 是否已暂停
    isLoading: boolean              // 是否加载中
    currentSong: Song | null        // 当前歌曲
    currentIndex: number            // 当前索引
    playlist: Song[]                // 播放列表
    originalPlaylist: Song[]        // 原始列表（随机模式用）
    playMode: PlayMode              // 播放模式
    volume: number                  // 音量 (0-1)
    isMuted: boolean                // 是否静音
    currentTime: number             // 当前时间（秒）
    duration: number                // 总时长（秒）
    playHistory: Song[]             // 播放历史
    error: string | null            // 错误信息
  }
}

🔁 播放模式枚举

enum PlayMode {
  LIST = 'list',      // 列表循环
  SINGLE = 'single',  // 单曲循环
  RANDOM = 'random',  // 随机播放
}

📤 Getters

Getter	返回类型	说明
getCurrentSong	Song | null	当前歌曲
getIsPlaying	boolean	是否播放中
getPlaylist	Song[]	播放列表
getPlayMode	PlayMode	播放模式
getVolume	number	音量
getCurrentTime	number	当前时间
getDuration	number	总时长
getProgress	number	进度百分比
hasNext	boolean	是否有下一首
hasPrevious	boolean	是否有上一首

⚡ Actions

Action	参数	说明
initAudio()	-	初始化音频播放器
playSong(song?, index?)	Song, number	播放歌曲
pause()	-	暂停
resume()	-	继续播放
togglePlay()	-	切换播放/暂停
nextSong()	-	下一首
previousSong()	-	上一首
stop()	-	停止播放
togglePlayMode()	-	切换播放模式
setPlayMode(mode)	PlayMode	设置播放模式
setVolume(vol)	number	设置音量
toggleMute()	-	切换静音
setCurrentTime(time)	number	设置播放时间
setProgress(prog)	number	设置播放进度
addSong(song)	Song	添加歌曲
addSongs(songs)	Song[]	批量添加
removeSong(id)	string | number	移除歌曲
removeSongs(ids)	Array	批量移除
moveSong(from, to)	number, number	移动歌曲
queueNext(id)	string | number	下一首播放
clearPlaylist()	-	清空列表
setPlaylist(songs, startIndex?)	Song[], number	设置播放列表
playByIndex(index)	number	按索引播放
addToHistory(song)	Song	添加到历史
clearHistory()	-	清空历史
clearError()	-	清除错误
destroy()	-	销毁播放器

💾 持久化字段

• count
• audio.currentSong
• audio.currentIndex
• audio.playlist
• audio.originalPlaylist
• audio.playMode
• audio.volume
• audio.isMuted
• audio.playHistory

---

🌐 useGlobalStore

全局应用状态。

📁 文件位置：src/stores/modules/global.ts

📊 状态

interface GlobalState {
  count: number
  theme?: 'light' | 'dark' | 'system'  // 主题模式
  searchHistory: string[]               // 搜索历史
  lang?: 'zh' | 'en' | 'ja'            // 语言
}

⚡ Actions

Action	参数	说明
setGlobalState(key, value)	keyof GlobalState, any	设置全局状态
setTheme(theme)	'light' | 'dark' | 'system'	设置主题
toggleTheme()	-	切换主题（浅/深）
setLang(lang)	'zh' | 'en' | 'ja'	设置语言
addSearchHistory(q)	string	添加搜索历史
removeSearchHistory(q)	string	移除搜索历史
clearSearchHistory()	-	清空搜索历史

---

⚙️ useSettingsStore

设置状态（背景、歌词显示等）。

📁 文件位置：src/stores/modules/settings.ts

📊 状态

interface SettingsState {
  aurora: AuroraSettingsState           // 极光背景设置
  colorBends: ColorBendsSettingsState   // 渐变背景设置
  ultimate: UltimateSettingsState       // 终极背景设置
  footerLyrics: FooterLyricsSettingsState // 底栏歌词设置
  backgroundType: 'aurora' | 'colorbends' | 'ultimate'
}

🌌 Aurora 设置

interface AuroraSettingsState {
  colorStops: string[]        // 颜色数组
  amplitude: number           // 振幅
  blend: number               // 混合度
  speed: number               // 速度
  intensity: number           // 强度
  colorPositions: number[]    // 颜色位置
}

🌈 ColorBends 设置

interface ColorBendsSettingsState {
  colors: string[]            // 颜色数组
  rotation: number            // 旋转角度
  speed: number               // 速度
  scale: number               // 缩放
  frequency: number           // 频率
  warpStrength: number        // 扭曲强度
  mouseInfluence: number      // 鼠标影响
  parallax: number            // 视差
  noise: number               // 噪点
  transparent: boolean        // 透明
  autoRotate: number          // 自动旋转
}

✨ Ultimate 设置

interface UltimateSettingsState {
  bg1: string                 // 背景色1
  bg2: string                 // 背景色2
  color1: string              // 颜色1
  color2: string              // 颜色2
  color3: string              // 颜色3
  color4: string              // 颜色4
  color5: string              // 颜色5
  interactiveColor: string    // 交互颜色
  circleSize: string          // 圆形大小
  blending: string            // 混合模式
}

🎵 底栏歌词设置

interface FooterLyricsSettingsState {
  enabled: boolean                           // 是否启用
  modes: Array<'original' | 'trans' | 'roma'> // 显示模式
}

⚡ Actions

Action	参数	说明
setBackgroundType(type)	'aurora' | 'colorbends' | 'ultimate'	设置背景类型
setAurora(partial)	Partial<AuroraSettingsState>	更新极光设置
setColorStops(stops)	string[]	设置极光颜色
resetAurora()	-	重置极光设置
setColorBends(partial)	Partial<ColorBendsSettingsState>	更新渐变设置
setBendsColors(colors)	string[]	设置渐变颜色
resetColorBends()	-	重置渐变设置
setUltimate(partial)	Partial<UltimateSettingsState>	更新终极设置
resetUltimate()	-	重置终极设置
setFooterLyricsEnabled(val)	boolean	设置底栏歌词开关
setFooterLyricsModes(modes)	Array	设置底栏歌词模式

---

👤 useUserStore

用户登录状态。

📁 文件位置：src/stores/modules/user.ts

📊 状态

interface UserState {
  isLoggedIn: boolean           // 是否已登录
  profile: UserProfile | null   // 用户资料
  lastLoginAt: number           // 上次登录时间
}

interface UserProfile {
  userId: number
  nickname: string
  avatarUrl: string
  vipType?: number
}

📤 Getters

Getter	返回类型	说明
nickname	string	用户昵称
avatarUrl	string	头像 URL

⚡ Actions

Action	参数	说明
setUser(profile)	UserProfile	设置用户信息
logout()	-	退出登录

💾 持久化字段

• isLoggedIn
• profile
• lastLoginAt