refactor: partial refactoring

src/api/index.ts

@@ -1,5 +1,5 @@
 import { get } from '@/utils/http'
-import { SongsDetail, SongState, Albums, Song } from '@/interface/index'
+import { SongsDetail, PlayList, Albums, Song } from '@/interface/index'
 import { SubscribeActionType } from '@/shared/subscribe'
 
 export const getSongUrl = async <T>(id: number | number[]): Promise<T> => {
@@ -19,15 +19,10 @@ export const getSongDetail = async (
   return data.songs
 }
 
-export const getPlayList = async (
-  id: number
-): Promise<SongState['playlist']> => {
-  const data = await get<{ playlist: SongState['playlist'] }>(
-    '/api/playlist/detail',
-    {
-      id
-    }
-  )
+export const getPlayList = async (id: number): Promise<PlayList> => {
+  const data = await get<{ playlist: PlayList }>('/api/playlist/detail', {
+    id
+  })
   return data.playlist
 }
 

src/interface/utils.ts

@@ -1,2 +1,8 @@
 // Get the type in the array object
 export type ArrayItem<T> = T extends Array<infer K> ? K : never
+
+// Combine two types
+export type Merage<P, T = {}> = P & T
+
+// Declare optional and non-optional parameters
+export type RequiredPartial<P, T> = Merage<Required<P>, Partial<T>>

src/pages/footer/components/music-controller/index.tsx

@@ -203,7 +203,6 @@ export const MusicControl = defineComponent({
         audioElement.value.addEventListener('canplaythrough', canplaythrough)
         audioElement.value.addEventListener('loadstart', loadstart)
         audioElement.value.addEventListener('progress', progress)
-        // audioElement.value.addEventListener('timeupdate', timeUpdate)
         audioElement.value.addEventListener('ended', ended)
         audioElement.value.addEventListener('playing', () => {
           playingIcon.value = 'pause'
@@ -213,7 +212,6 @@ export const MusicControl = defineComponent({
         })
         audioElement.value.addEventListener('canplay', () => {
           useMutations(FooterMutations.CAN_PLAY, true)
-          // useMutations(FooterMutations.PLAY_MUSIC)
         })
       }
     })

src/pages/footer/interface.ts

@@ -29,7 +29,6 @@ export interface FooterState {
   duration: number
   volume: number
   lyriceEmbedMinWidth: number
-  lyriceFloatMinWidth: number
 }
 
 export interface FooterGetter {
@@ -65,6 +64,5 @@ export const enum FooterMutations {
   REMOVE_STACK = 'REMOVE_STACK',
   REMOVE_HISTORY = 'REMOVE_HISTORY',
   CLEAR_STACK = 'CLEAR_STACK',
-  LYRICE_EMBED_MIN_WIDTH = 'LYRICE_EMBED_MIN_WIDTH',
-  LYRICE_FLOAT_MIN_WIDTH = 'LYRICE_FLOAT_MIN_WIDTH'
+  LYRICE_EMBED_MIN_WIDTH = 'LYRICE_EMBED_MIN_WIDTH'
 }

src/pages/footer/sage.ts

@@ -152,17 +152,6 @@ export const mutations: MutationTree<FooterState> = {
   [FooterMutations.LYRICE_EMBED_MIN_WIDTH](state, width: number) {
     state.lyriceEmbedMinWidth = width
   },
-  [FooterMutations.LYRICE_FLOAT_MIN_WIDTH](state, width: number) {
-    if (state.lyriceFloatMinWidth !== width) {
-      state.lyriceFloatMinWidth = width
-      // if (VUE_APP_PLATFORM === Platform.ELECTRON) {
-      //   // Send data to ipc, modify the size of the window
-      //   importIpc().then(v => {
-      //     v.sendAsyncIpcRendererEvent(UpdateType.UPDATE_WIDTH, width)
-      //   })
-      // }
-    }
-  },
   [FooterMutations.CLEAR_STACK](state) {
     state.musicStack = []
   },

src/pages/footer/state.ts

@@ -20,7 +20,6 @@ export const state: FooterState = {
   visibleFlash: false,
   duration: 0,
   lyriceEmbedMinWidth: 0,
-  lyriceFloatMinWidth: 0,
   electronLyrice: {
     screenSize: LayoutSize.SM,
     visibleFlash: true,

src/pages/list/interface.ts

@@ -1,43 +1,42 @@
 import { Avatar, GlobalBase, SongsDetail, Albums } from '@/interface/index'
+import { Merage, RequiredPartial } from '@/interface/utils'
 
-type Merage<P, T = {}> = P & T
-export type RequiredPartial<P, T> = Merage<Required<P>, Partial<T>>
-
-export type Tracks = SongsDetail
+export type PlayList = RequiredPartial<
+  {
+    tracks: SongsDetail[]
+    tags: string[]
+    description: string
+    shareCount: number
+    playCount: number
+    dt: number
+    createTime: number
+    coverImgUrl: string
+    trackCount: number
+    creator: Avatar
+    subscribed: boolean
+  } & GlobalBase,
+  Merage<{
+    subscribers: Avatar[]
+    userId: number
+  }>
+>
+export interface AlbumList {
+  song: SongsDetail[]
+  album: {
+    description: string
+    publishTime: number
+    size: number
+    picUrl: string
+    trackCount: number
+    shareCount: number
+    playCount: number
+    subscribed: boolean
+  } & Albums
+}
 
 export interface SongState {
-  playlist: RequiredPartial<
-    {
-      tracks: SongsDetail[]
-      tags: string[]
-      description: string
-      shareCount: number
-      playCount: number
-      dt: number
-      createTime: number
-      coverImgUrl: string
-      trackCount: number
-      creator: Avatar
-      subscribed: boolean
-    } & GlobalBase,
-    Merage<{
-      subscribers: Avatar[]
-      userId: number
-    }>
-  >
-  albumList: {
-    song: SongsDetail[]
-    album: {
-      description: string
-      publishTime: number
-      size: number
-      picUrl: string
-      trackCount: number
-      shareCount: number
-      playCount: number
-      subscribed: boolean
-    } & Albums
-  }
+  playlist: PlayList
+  albumList: AlbumList
 }
 
 export enum SongActions {

src/pages/list/sage.ts

@@ -1,5 +1,5 @@
 import { MutationTree, ActionTree } from 'vuex'
-import { SongState, SongActions, SongMutations } from './interface'
+import { SongState, PlayList, SongActions, SongMutations } from './interface'
 import { RootState } from '@/store/index'
 import { getPlayList, getAlbumList } from '@/api/index'
 import { getRecommendSong } from './api/index'
@@ -21,7 +21,7 @@ export const actions: ActionTree<SongState, RootState> = {
   }
 }
 export const mutations: MutationTree<SongState> = {
-  [SongMutations.SET_PLAYLIST](state, playlist: SongState['playlist']) {
+  [SongMutations.SET_PLAYLIST](state, playlist: PlayList) {
     state.playlist = playlist
   },
   [SongMutations.SET_ALBUMLIST](state, { songs, album }) {

src/pages/list/view/index.tsx

@@ -12,7 +12,8 @@ import { FooterMutations } from '@/interface'
 import {
   FormatSource,
   SongsDetail,
-  SongState,
+  PlayList,
+  AlbumList,
   SongActions
 } from '@/interface/index'
 import { SecondaryList } from '@/components-business/secondary-list'
@@ -26,10 +27,7 @@ const isCopyright = (song: SongsDetail) => {
   return true
 }
 
-const formatPlayListData = (
-  item: SongState['playlist'],
-  id: string
-): FormatSource => {
+const formatPlayListData = (item: PlayList, id: string): FormatSource => {
   if (id === '-1') {
     return {
       id: Number(id),
@@ -70,7 +68,7 @@ const formatPlayListData = (
   }
 }
 
-const formatAlbumListData = (item: SongState['albumList']): FormatSource => {
+const formatAlbumListData = (item: AlbumList): FormatSource => {
   return {
     id: item.album.id,
     name: item.album.name,

src/pages/news/children/top-list/view/index.tsx

@@ -1,7 +1,7 @@
 import { computed, defineComponent, toRefs } from 'vue'
 import { SongList } from '@/components-business/song-list/index'
 import { useTopListModule } from '@/modules'
-import { SongState, TopListActions } from '@/interface/index'
+import { PlayList, TopListActions } from '@/interface/index'
 import { getPlayList } from '@/api/index'
 import { Image } from '@/components/image/index'
 import { playMusic as music } from '@/shared/music-shared'
@@ -20,7 +20,7 @@ export const TopList = defineComponent({
     const play = music()
     const toSongList = jumpSongList()
     const playMusic = async (songlistID: number, index: number) => {
-      let songlist: SongState['playlist']
+      let songlist: PlayList
       if (cacheSongListDetail.has(songlistID)) {
         songlist = cacheSongListDetail.get(songlistID)
       } else {