+
+
+
+
@@ -91,20 +97,12 @@ const showNotify = ref(false);
const currentLyricText = ref("");
let notifyTimer = null;
let lrcLines = [];
-let lrcAbortController = null;
-// 同步播放状态到 store
watch(isPlaying, (val) => {
- store.playerState = val;
if (val) document.body.classList.add('music-playing');
else document.body.classList.remove('music-playing');
});
-// 同步歌词到 store
-watch(currentLyricText, (val) => {
- store.playerLrc = val;
-});
-
onMounted(async () => {
try {
const list = await getPlayerList();
@@ -121,7 +119,6 @@ onMounted(async () => {
onBeforeUnmount(() => {
if (notifyTimer) clearTimeout(notifyTimer);
- if (lrcAbortController) lrcAbortController.abort();
document.body.classList.remove('music-playing');
});
@@ -160,22 +157,17 @@ const updateBySongObject = (song) => {
cover: song.cover || song.pic,
lrc: song.lrc
};
- // 同步歌曲信息到 store，供顶部通知和 Footer 使用
- store.playerTitle = currentSong.value.name;
- store.playerArtist = currentSong.value.artist;
parseLrc(song.lrc);
};
const onPlay = () => {
isPlaying.value = true;
- store.playerState = true;
updateByIndex();
triggerNotify();
};
const onPause = () => {
isPlaying.value = false;
- store.playerState = false;
};
const onListSwitch = (data) => {
@@ -192,15 +184,8 @@ const onTimeUpdate = (e) => {
updateByIndex();
}
- // APlayer timeupdate 事件传递当前播放时间（秒）
- let time = 0;
- if (typeof e === 'number') {
- time = e;
- } else if (e?.target?.currentTime !== undefined) {
- time = e.target.currentTime;
- } else if (e?.currentTime !== undefined) {
- time = e.currentTime;
- }
+ // 兼容数字和 DOM Event 两种传参方式
+ const time = typeof e === 'number' ? e : e?.target?.currentTime ?? 0;
if (lrcLines.length) {
let idx = -1;
for (let i = 0; i < lrcLines.length; i++) {
@@ -221,29 +206,18 @@ const parseLrc = async (lrcUrl) => {
lrcLines = [];
currentLyricText.value = " ";
if (!lrcUrl) return;
-
- // 取消上一次歌词请求
- if (lrcAbortController) lrcAbortController.abort();
- lrcAbortController = new AbortController();
-
try {
- const res = await fetch(lrcUrl, { signal: lrcAbortController.signal });
+ const res = await fetch(lrcUrl);
const text = await res.text();
text.split('\n').forEach(line => {
- const match = /^\[(\d{2}):(\d{2})\.(\d{1,3})\](.*)$/.exec(line);
+ const match = /^\[(\d{2}):(\d{2})\.(\d{2,3})\](.*)$/.exec(line);
if (match) {
- // 兼容 1-3 位毫秒数: .2 → 200ms, .20 → 200ms, .200 → 200ms
- const rawMs = match[3];
- const divisor = Math.pow(10, 3 - rawMs.length);
- const ms = parseInt(rawMs) * divisor;
- const time = parseInt(match[1])*60 + parseInt(match[2]) + ms / 1000;
+ const time = parseInt(match[1])*60 + parseInt(match[2]) + parseInt(match[3].padEnd(3,'0'))/1000;
const text = match[4].trim();
if (text) lrcLines.push({ time, text });
}
});
- } catch (e) {
- console.warn('歌词解析失败:', e);
- }
+ } catch (e) {}
};
@@ -304,8 +278,20 @@ const parseLrc = async (lrcUrl) => {
.notify-capsule .text-info .name { font-weight: bold; }
.notify-capsule .text-info .artist { opacity: 0.8; font-size: 12px; }
+.footer-lyric-bar {
+ position: fixed; bottom: 0; left: 0; width: 100%; height: 46px;
+ display: flex; align-items: center; justify-content: center; z-index: 2000; pointer-events: none;
+}
+.footer-lyric-bar .text {
+ font-size: 14px; color: rgba(255, 255, 255, 0.85);
+ text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
+ max-width: 85%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: 1px;
+}
+
body.music-playing footer, body.music-playing .footer { opacity: 0 !important; transition: opacity 0.3s ease; }
@keyframes rotate-cover { to { transform: rotate(360deg); } }
.notify-slide-enter-active, .notify-slide-leave-active { transition: all 0.4s ease; }
.notify-slide-enter-from, .notify-slide-leave-to { opacity: 0; transform: translateY(-30px); }
-
+.lyric-fade-enter-active, .lyric-fade-leave-active { transition: all 0.5s ease; }
+.lyric-fade-enter-from, .lyric-fade-leave-to { opacity: 0; transform: translateY(10px); }
+
\ No newline at end of file
diff --git a/src/components/SocialLinks.vue b/src/components/SocialLinks.vue
index fa14d45..c1837ad 100644
--- a/src/components/SocialLinks.vue
+++ b/src/components/SocialLinks.vue
@@ -1,11 +1,10 @@
-
+