diff --git a/app.js b/app.js index 74cf120..06a38d9 100644 --- a/app.js +++ b/app.js @@ -39,6 +39,7 @@ function createWindow() { label: '退出', click: () => { win.destroy(); + app.quit(); }, }, ]); diff --git a/electron/lyric.js b/electron/lyric.js index 5306762..bb307e4 100644 --- a/electron/lyric.js +++ b/electron/lyric.js @@ -3,7 +3,7 @@ const path = require('path'); let lyricWindow = null; -const loadLyricWindow = (ipcMain) => { +const createWin = () => { lyricWindow = new BrowserWindow({ width: 800, height: 300, @@ -16,8 +16,16 @@ const loadLyricWindow = (ipcMain) => { contextIsolation: false, }, }); - +}; +const loadLyricWindow = (ipcMain) => { ipcMain.on('open-lyric', () => { + if (lyricWindow) { + if (lyricWindow.isMinimized()) lyricWindow.restore(); + lyricWindow.focus(); + lyricWindow.show(); + return; + } + createWin(); if (process.env.NODE_ENV === 'development') { lyricWindow.webContents.openDevTools({ mode: 'detach' }); lyricWindow.loadURL('http://localhost:4678/#/lyric'); @@ -26,11 +34,35 @@ const loadLyricWindow = (ipcMain) => { lyricWindow.loadURL(`file://${distPath}/index.html#/lyric`); } + lyricWindow.setMinimumSize(600, 200); + + // 隐藏任务栏 + lyricWindow.setSkipTaskbar(true); + lyricWindow.show(); }); ipcMain.on('send-lyric', (e, data) => { - lyricWindow.webContents.send('receive-lyric', data); + if (lyricWindow) { + lyricWindow.webContents.send('receive-lyric', data); + } + }); + + ipcMain.on('top-lyric', (e, data) => { + lyricWindow.setAlwaysOnTop(data); + }); + + ipcMain.on('close-lyric', () => { + lyricWindow.close(); + lyricWindow = null; + }); + + ipcMain.on('mouseenter-lyric', () => { + lyricWindow.setIgnoreMouseEvents(true); + }); + + ipcMain.on('mouseleave-lyric', () => { + lyricWindow.setIgnoreMouseEvents(false); }); }; diff --git a/package.json b/package.json index 800c6a7..5550899 100644 --- a/package.json +++ b/package.json @@ -39,8 +39,8 @@ "@vitejs/plugin-vue": "^4.2.3", "@vue/compiler-sfc": "^3.3.4", "@vue/eslint-config-typescript": "^12.0.0", - "electron": "^28.0.0", - "electron-builder": "^24.9.1", + "electron": "^30.0.6", + "electron-builder": "^24.13.0", "eslint": "^8.56.0", "eslint-config-airbnb-base": "^15.0.0", "eslint-config-prettier": "^9.0.0", diff --git a/src/components/common/SongItem.vue b/src/components/common/SongItem.vue index f95818b..7ac07f5 100644 --- a/src/components/common/SongItem.vue +++ b/src/components/common/SongItem.vue @@ -18,8 +18,8 @@
@@ -51,6 +51,8 @@ const play = computed(() => store.state.play as boolean); const playMusic = computed(() => store.state.playMusic); +const playLoading = computed(() => playMusic.value.id === props.item.id && playMusic.value.playLoading); + // 判断是否为正在播放的音乐 const isPlaying = computed(() => { return playMusic.value.id === props.item.id; @@ -59,8 +61,11 @@ const isPlaying = computed(() => { const emits = defineEmits(['play']); // 播放音乐 设置音乐详情 打开音乐底栏 -const playMusicEvent = (item: any) => { - store.commit('setPlay', item); +const playMusicEvent = async (item: any) => { + if (playMusic.value.id === item.id) { + return; + } + await store.commit('setPlay', item); store.commit('setIsPlay', true); emits('play', item); }; @@ -105,6 +110,7 @@ const playMusicEvent = (item: any) => { } &-play { @apply cursor-pointer border border-gray-500 rounded-full w-10 h-10 flex justify-center items-center hover:bg-green-600 transition; + animation-iteration-count: infinite; } } } diff --git a/src/hooks/MusicHook.ts b/src/hooks/MusicHook.ts index a495746..5cc4f99 100644 --- a/src/hooks/MusicHook.ts +++ b/src/hooks/MusicHook.ts @@ -133,7 +133,7 @@ export const getLrcTimeRange = (index: any) => { return { currentTime, nextTime }; }; -export const sendLyricToWin = (isPlay: boolean) => { +export const sendLyricToWin = (isPlay: boolean = true) => { try { // 设置lyricWinData 获取 当前播放的两句歌词 和歌词时间 let lyricWinData = null; @@ -166,4 +166,5 @@ export const sendLyricToWin = (isPlay: boolean) => { export const openLyric = () => { const windowData = window as any; windowData.electronAPI.openLyric(); + sendLyricToWin(); }; diff --git a/src/store/index.ts b/src/store/index.ts index 4ebf96d..c6321fe 100644 --- a/src/store/index.ts +++ b/src/store/index.ts @@ -16,6 +16,7 @@ interface State { playList: SongResult[]; playListIndex: number; setData: any; + lyric: any; } const state: State = { @@ -28,6 +29,7 @@ const state: State = { playList: [], playListIndex: 0, setData: null, + lyric: {}, }; const windowData = window as any; @@ -39,10 +41,11 @@ const mutations = { state.menus = menus; }, async setPlay(state: State, playMusic: SongResult) { - state.playMusic = playMusic; + state.playMusic = { ...playMusic, playLoading: true }; state.playMusicUrl = await getSongUrl(playMusic.id); state.play = true; musicHistory.addMusic(playMusic); + state.playMusic.playLoading = false; }, setIsPlay(state: State, isPlay: boolean) { state.isPlay = isPlay; diff --git a/src/type/music.ts b/src/type/music.ts index 93bd8a1..cb88a4b 100644 --- a/src/type/music.ts +++ b/src/type/music.ts @@ -15,6 +15,7 @@ export interface SongResult { song: Song; alg: string; count?: number; + playLoading?: boolean; } interface Song { diff --git a/src/views/lyric/index.vue b/src/views/lyric/index.vue index aa2e2d9..3ba9312 100644 --- a/src/views/lyric/index.vue +++ b/src/views/lyric/index.vue @@ -1,5 +1,6 @@