diff --git a/components.d.ts b/components.d.ts index b6817ad..6c86794 100644 --- a/components.d.ts +++ b/components.d.ts @@ -23,6 +23,7 @@ declare module 'vue' { NPopover: typeof import('naive-ui')['NPopover'] NScrollbar: typeof import('naive-ui')['NScrollbar'] NSlider: typeof import('naive-ui')['NSlider'] + NSpin: typeof import('naive-ui')['NSpin'] NSwitch: typeof import('naive-ui')['NSwitch'] NTooltip: typeof import('naive-ui')['NTooltip'] PlayBottom: typeof import('./src/components/common/PlayBottom.vue')['default'] diff --git a/package.json b/package.json index ae49fd9..72359bb 100644 --- a/package.json +++ b/package.json @@ -40,7 +40,7 @@ "eslint-plugin-vue": "^9.21.1", "eslint-plugin-vue-scoped-css": "^2.7.2", "lodash": "^4.17.21", - "naive-ui": "^2.34.4", + "naive-ui": "^2.38.2", "postcss": "^7.0.36", "prettier": "^3.2.5", "remixicon": "^4.2.0", diff --git a/src/App.vue b/src/App.vue index a059d87..18855c3 100644 --- a/src/App.vue +++ b/src/App.vue @@ -3,7 +3,9 @@ - + + + diff --git a/src/api/home.ts b/src/api/home.ts index 44ba9fd..ce20cc0 100644 --- a/src/api/home.ts +++ b/src/api/home.ts @@ -1,4 +1,6 @@ +import { IData } from '@/type'; import { IAlbumNew } from '@/type/album'; +import { IDayRecommend } from '@/type/day_recommend'; import { IRecommendMusic } from '@/type/music'; import { IPlayListSort } from '@/type/playlist'; import { IHotSearch, ISearchKeyword } from '@/type/search'; @@ -39,6 +41,11 @@ export const getRecommendMusic = (params: IRecommendMusicParams) => { return request.get('/personalized/newsong', { params }); }; +// 获取每日推荐 +export const getDayRecommend = () => { + return request.get>('/recommend/songs'); +}; + // 获取最新专辑推荐 export const getNewAlbum = () => { return request.get('/album/newest'); diff --git a/src/components/MusicList.vue b/src/components/MusicList.vue index 0e3422b..a6493db 100644 --- a/src/components/MusicList.vue +++ b/src/components/MusicList.vue @@ -10,7 +10,7 @@ v-for="(item, index) in songList" :key="item.id" :class="setAnimationClass('animate__bounceInUp')" - :style="setAnimationDelay(index, 100)" + :style="setAnimationDelay(index, 50)" > diff --git a/src/components/RecommendSinger.vue b/src/components/RecommendSinger.vue index 01b9117..360dce3 100644 --- a/src/components/RecommendSinger.vue +++ b/src/components/RecommendSinger.vue @@ -3,11 +3,34 @@
+
+
+
每日推荐列表
+ +
+

+ {{ item.name }} +
+

+
+
+
+
{{ item.musicSize }}首
@@ -16,34 +39,58 @@
-
{{ item.name }}
-
{{ item.name }}
+
{{ item.name }}
+
{{ item.name }}
+ + diff --git a/src/views/list/index.vue b/src/views/list/index.vue index 2c36675..4b9ef77 100644 --- a/src/views/list/index.vue +++ b/src/views/list/index.vue @@ -2,12 +2,15 @@ import { useRoute } from 'vue-router'; import { getListByCat, getListDetail, getRecommendList } from '@/api/list'; -import PlayBottom from '@/components/common/PlayBottom.vue'; import MusicList from '@/components/MusicList.vue'; import type { IRecommendItem } from '@/type/list'; import type { IListDetail } from '@/type/listDetail'; import { formatNumber, getImgUrl, setAnimationClass, setAnimationDelay } from '@/utils'; +defineOptions({ + name: 'List', +}); + const recommendList = ref(); const showMusic = ref(false); @@ -82,7 +85,6 @@ watch(
{{ item.name }}
- { loadLogin(); }); +const timerRef = ref(null); + const loadLogin = async () => { - const qrKey = await getQrKey(); - const key = qrKey.data.data.unikey; - const { data } = await createQr(key); - qrUrl.value = data.data.qrimg; - timerIsQr(key); + try { + const qrKey = await getQrKey(); + const key = qrKey.data.data.unikey; + const { data } = await createQr(key); + qrUrl.value = data.data.qrimg; + + const timer = timerIsQr(key); + // 添加对定时器的引用，以便在出现错误时可以清除 + timerRef.value = timer as any; + } catch (error) { + console.error('加载登录信息时出错:', error); + } }; +// 使用 ref 来保存定时器，便于在任何地方清除它 + const timerIsQr = (key: string) => { const timer = setInterval(async () => { - const { data } = await checkQr(key); + try { + const { data } = await checkQr(key); - if (data.code === 800) { - clearInterval(timer); - } - if (data.code === 803) { - // 将token存入localStorage - localStorage.setItem('token', data.cookie); - const user = await getUserDetail(); - store.state.user = user.data.profile; - message.success('登录成功'); + if (data.code === 800) { + clearInterval(timer); + timerRef.value = null; + } + if (data.code === 803) { + localStorage.setItem('token', data.cookie); + const user = await getUserDetail(); + store.state.user = user.data.profile; + message.success('登录成功'); - await getLoginStatus().then((res) => { - console.log(res); - }); - clearInterval(timer); - setTimeout(() => { + clearInterval(timer); + timerRef.value = null; router.push('/user'); - }, 1000); + } + } catch (error) { + console.error('检查二维码状态时出错:', error); + // 在出现错误时清除定时器 + clearInterval(timer); + timerRef.value = null; } - }, 5000); + }, 2000); + + return timer; }; // 是否扫码登陆 diff --git a/src/views/lyric/index.vue b/src/views/lyric/index.vue index 3ba9312..c333f3e 100644 --- a/src/views/lyric/index.vue +++ b/src/views/lyric/index.vue @@ -48,6 +48,10 @@