From 05ebd198dd2f4d93a0d254fb69f9d92c0041f841 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BB=98=E6=96=87=E5=A7=9D?= <[15641272595]>
Date: Thu, 18 Jan 2024 15:42:16 +0800
Subject: [PATCH 1/9] fws
---
src/api/user/index.ts | 21 +
src/router/index.ts | 5 +
src/views/HomeView.vue | 2189 ++++++++++++++++++++++----------------
src/views/home/My/my.vue | 139 +++
4 files changed, 1439 insertions(+), 915 deletions(-)
create mode 100644 src/api/user/index.ts
create mode 100644 src/views/home/My/my.vue
diff --git a/src/api/user/index.ts b/src/api/user/index.ts
new file mode 100644
index 0000000..664ba50
--- /dev/null
+++ b/src/api/user/index.ts
@@ -0,0 +1,21 @@
+import request from "@/utils/request";
+
+// 视频相关api
+const apiPath = {
+ song: "/user/subcount", // 获取用户信息
+};
+
+/**
+ * 用户信息
+ * @说明 : 登录后调用此接口 , 传入用户 id, 可获取用户播放记录
+ * @必选参数 : uid : 用户 id
+ * @可选参数 : type : type=1 时只返回 weekData, type=0 时返回 allData
+ * @param {Number} limit : 返回数量 , 默认为 100 `可选`
+ */
+export function getRecentlyMusicList(params: { uid: number; type: number }) {
+ return request({
+ url: apiPath.song,
+ method: "get",
+ params,
+ });
+}
diff --git a/src/router/index.ts b/src/router/index.ts
index 94ceddf..11a13d5 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -53,6 +53,11 @@ const router = createRouter({
path: "/home/like",
component: () => import("@/views/home/myLike/index.vue"),
},
+ {
+ //我的
+ path: "/home/my",
+ component: () => import("@/views/home/My/my.vue"),
+ },
{
//用户歌单页
path: "/home/userSongSheet",
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 1da5963..31dee6b 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -1,1048 +1,1406 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- 账号登录
- |
- 验证码登录
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 账号登录
+ |
+ 验证码登录
+
+
+
+
+
+
+
+
+
+
+
![]()
+
+
美梦收藏家
+
+ 88关注 61粉丝 0获赞
+
+
19岁
+
+
+
+
![]()
-
+
@@ -336,6 +334,7 @@ const slider = ref(false)
const isSound = ref(false)//是否显示音量
const volume = ref(50)//音量
const sliderStyle = ref()// 获取包含样式的元素
+const codeBtnState = ref(false)// 控制发送验证码按钮的disabled
const coordinate = reactive({
X: 20, Y: 0
})
@@ -409,11 +408,8 @@ const handlePlayPause = () => {
const clickEven = () => visible.value = false
//获取搜索结果，进行跳转
const handleSearch = (e: any) => {
- // 当按下回车键时，执行搜索
if (e.keyCode === 13) {
- // 获取搜索框中的值
searchInput.value = e.target.value
- // 跳转到搜索页面
router.push({ path: '/home/search' })
}
}
@@ -468,15 +464,11 @@ const handleCanplay = (e: any) => {
}
//手动修改进度条
const handleChangeRangeInput = (value: number) => {
- // 设置当前时间
currentTime.value = value;
- // 设置urlAudeo的当前时间
urlAudeo.value.currentTime = value;
}
//修改歌曲当前的播放时间和进度条
-//
const handleTimeupdate = (event: any) => {
- // 更新当前时间
currentTime.value = event.target.currentTime;
}
//歌曲结束后触发换歌操作
@@ -493,27 +485,19 @@ const handleEnded = () => {
}
//切换上一首歌
const handlePreviousSong = () => {
- // 如果playIndex大于等于0，则执行以下操作
if (playIndex.value >= 0) {
- // 将songInfo的值设置为playList中playIndex-1的值
songInfo.value = playList.value[playIndex.value - 1]
}
- // 将currentTime的值设置为0
currentTime.value = 0
}
//获取歌曲的url地址
const getUrl = async () => {
- // 通过id获取音乐信息
const musicRespone = await getMusicURLByIds({ id: Number(songInfo.value?.id), level: "lossless" })
- // 判断是否获取到音乐信息
if (musicRespone.code === "error") {
console.log(musicRespone.error.message);
} else {
- // 判断是否获取到音乐地址
if (musicRespone.data.code === 200) {
- // 获取音乐地址
urlAudeo.value.src = musicRespone.data?.data[0]?.url
- // 设置播放状态
isPlay.value = true
}
}
@@ -521,9 +505,7 @@ const getUrl = async () => {
//监听songId的变化，songId表示歌曲的Id
watch(() => songInfo.value?.id, () => {
- // 当歌曲id发生变化时，调用getUrl函数
getUrl()
- // 将inputRangeDom的value值设置为0
inputRangeDom.value.value = 0
})
//监听当前播放时间的变化，currentTime表示当前播放的时间
@@ -532,20 +514,13 @@ watch(playSchedule, (newVal) => {
})
//监听路由变化切换背景色
watch(route, () => {
- // 当路由发生变化时，执行以下操作
if (route.path !== '/home/recommend') {
- // 获取侧边栏元素
const aside: any = document.querySelector('aside')
- // 设置侧边栏的背景色
aside.style.setProperty('--color-1', '38,38,38')
- // 设置按钮图片为true
isButImg.value = true
- // 设置过渡动画为空
transitionName.value = ''
} else {
- // 设置按钮图片为false
isButImg.value = false
- // 设置过渡动画为fadeTransform
transitionName.value = 'fadeTransform'
}
})
@@ -553,7 +528,22 @@ watch(route, () => {
//发送验证码事件
const getCode = () => {
- loginAPI.LoginCode({ phone: Number(phone.value) })
+ codeBtnState.value = true
+ let codeBtn = document.querySelector(".codeBtn")
+ let time = 5
+ const timer = setInterval(function () {
+ time -= 1
+ codeBtn.innerHTML = `重新获取(${time}s)`
+ if (time == 0) {
+ clearInterval(timer)
+ codeBtn.innerHTML = '获取验证码'
+ codeBtnState.value = false
+ }
+ 111
+ }, 1000)
+ // loginAPI.LoginCode({ phone: Number(phone.value) }).then(({ data }) => {
+ // console.log(data)
+ // })
}
//登录
const getLogin = () => {
@@ -912,11 +902,6 @@ const getLogin = () => {
width: 8vh;
border-radius: 10px;
}
-
- span:hover {
- cursor: pointer;
- border-bottom: 1px solid #fff;
- }
}
/* 动画 */
@@ -1055,4 +1040,5 @@ const getLogin = () => {
}
}
}
-} */
+} */
+
--
Gitee
From 9b7d3df8721a3b4da7ff99525e37d75fa76c0a58 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=85=B3=E5=BA=B7=E9=9B=A8?=
Date: Thu, 18 Jan 2024 20:05:37 +0800
Subject: [PATCH 4/9] =?UTF-8?q?=E4=BF=AE=E5=A4=8Dbug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/.env.development | 2 +-
src/router/index.ts | 5 +++--
src/utils/auth.ts | 40 ++++++++++++++++++++++-----------
src/utils/url.ts | 2 +-
src/views/home/myLike/index.vue | 5 +++--
5 files changed, 35 insertions(+), 19 deletions(-)
diff --git a/src/.env.development b/src/.env.development
index b8b6bd0..4355ff6 100644
--- a/src/.env.development
+++ b/src/.env.development
@@ -13,5 +13,5 @@ VITE_APP_BASE_API = 'http://localhost:3000'
# proxy代理配置
# 例如：VITE_APP_TARGET_URL = "http://vapi.youlai.tech"
# VITE_APP_TARGET_URL = "http://localhost:5173" # 线上接口
-VITE_APP_TARGET_URL = "http://43.139.205.178:3000" # 线上接口
+VITE_APP_TARGET_URL = "http://123.57.181.60:3000" # 线上接口
VITE_APP_TARGET_BASE_API = ''
\ No newline at end of file
diff --git a/src/router/index.ts b/src/router/index.ts
index 94ceddf..fbd4cf3 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -1,7 +1,8 @@
-import { createRouter, createWebHistory } from "vue-router";
+import { createRouter, createWebHashHistory } from "vue-router";
const router = createRouter({
- history: createWebHistory(import.meta.env.BASE_URL),
+ // history: createWebHistory(import.meta.env.BASE_URL),
+ history: createWebHashHistory(),
routes: [
{
path: "/",
diff --git a/src/utils/auth.ts b/src/utils/auth.ts
index 7aff99d..6073814 100644
--- a/src/utils/auth.ts
+++ b/src/utils/auth.ts
@@ -1,23 +1,37 @@
-const TOKEN_NAME = 'music_token'
-const TOKEN_USER = 'music_user'
-const TOKEN_RECORD = 'music_record'
+const TOKEN_NAME = "music_token";
+const TOKEN_USER = "music_user";
+const TOKEN_RECORD = "music_record";
/** 获取 token */
-const getToken = () => localStorage.getItem(TOKEN_NAME)
+const getToken = () => localStorage.getItem(TOKEN_NAME);
/**设置 token */
-const setToken = (value: String) => localStorage.setItem(TOKEN_NAME, JSON.stringify(value))
+const setToken = (value: String) =>
+ localStorage.setItem(TOKEN_NAME, JSON.stringify(value));
/** 删除 token */
-const removeToken = () => localStorage.removeItem(TOKEN_NAME)
+const removeToken = () => localStorage.removeItem(TOKEN_NAME);
/**获取用户信息 */
-const getUser = () => JSON.parse(localStorage.getItem(TOKEN_USER))
+const getUser = () => JSON.parse(String(localStorage.getItem(TOKEN_USER)));
/**设置用户 */
-const setUser = (value: Object) => localStorage.setItem(TOKEN_USER, JSON.stringify(value))
+const setUser = (value: Object) =>
+ localStorage.setItem(TOKEN_USER, JSON.stringify(value));
/**删除用户 */
-const removeUser = () => localStorage.removeItem(TOKEN_USER)
+const removeUser = () => localStorage.removeItem(TOKEN_USER);
/**是否登录（有权限） */
-const isAuth = () => !!getToken()
+const isAuth = () => !!getToken();
/** 存入播放记录*/
-const setPlayHistory = (value: Object) => localStorage.setItem(TOKEN_RECORD, JSON.stringify(value))
+const setPlayHistory = (value: Object) =>
+ localStorage.setItem(TOKEN_RECORD, JSON.stringify(value));
/**获取播放记录 */
-const getPlayHistory = () => JSON.parse(localStorage.getItem(TOKEN_RECORD))
+const getPlayHistory = () =>
+ JSON.parse(String(localStorage.getItem(TOKEN_RECORD)));
-export { getToken, setToken, removeToken, isAuth, removeUser, getUser, setUser, setPlayHistory, getPlayHistory }
+export {
+ getToken,
+ setToken,
+ removeToken,
+ isAuth,
+ removeUser,
+ getUser,
+ setUser,
+ setPlayHistory,
+ getPlayHistory,
+};
diff --git a/src/utils/url.ts b/src/utils/url.ts
index 4b68a93..0c3068d 100644
--- a/src/utils/url.ts
+++ b/src/utils/url.ts
@@ -1,2 +1,2 @@
// 获取环境变量中配置的URL地址
-export const BASE_URL = 'http://127.0.0.1:3000/'
+export const BASE_URL = 'http://123.57.181.60:3000/'
diff --git a/src/views/home/myLike/index.vue b/src/views/home/myLike/index.vue
index d32c033..74a6fea 100644
--- a/src/views/home/myLike/index.vue
+++ b/src/views/home/myLike/index.vue
@@ -37,15 +37,16 @@ const loading = ref(true)
onMounted(async () => {
// 获取音乐详情
const data = await getMusicDetail({ ids: musicLikeListId.value.join(",") })
+ console.log(data)
// 判断返回状态
if (data.code === "success") {
// 判断返回状态码
if (data.data.code === 200) {
// 将返回的数据赋值给likeList
likeList.value = data.data.songs ? data.data.songs : []
- // 将loading设置为false
- loading.value = false
}
+ // 将loading设置为false
+ loading.value = false
}
})
//播放当前全部历史歌曲
--
Gitee
From 82fcca57402401cc05039959e5cab96fffe05b6b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=85=B3=E5=BA=B7=E9=9B=A8?=
Date: Fri, 19 Jan 2024 09:29:19 +0800
Subject: [PATCH 5/9] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E4=B8=AA=E4=BA=BA?=
=?UTF-8?q?=E4=B8=AD=E5=BF=83=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/stores/counter.ts | 22 ++++----
src/views/HomeView.vue | 4 +-
src/views/home/My/my.vue | 91 ++++++++++++++++++---------------
src/views/home/myLike/index.vue | 1 +
4 files changed, 65 insertions(+), 53 deletions(-)
diff --git a/src/stores/counter.ts b/src/stores/counter.ts
index 2c915fb..75fb88a 100644
--- a/src/stores/counter.ts
+++ b/src/stores/counter.ts
@@ -1,6 +1,6 @@
import { ref, onMounted, watch } from "vue";
import { defineStore } from "pinia";
-import { getPlayHistory, setPlayHistory } from "../utils/auth";
+import { getPlayHistory, setPlayHistory, getUser } from "../utils/auth";
import { getMusicLikeList } from "@/api/music/index";
interface songInfoType {
@@ -37,11 +37,13 @@ const useCounterStore = defineStore("counter", () => {
if (playList.value.length > 0) {
songInfo.value = playList.value[0];
console.log(songInfo.value);
-
+
playIndex.value = 0;
}
//获取我的喜欢中的歌曲id
- const data = await getMusicLikeList();
+ const data = await getMusicLikeList(getUser().userId);
+ console.log(data, "///////////////////");
+
if (data.code == "success") {
if (data.data?.ids.length > 0) {
musicLikeListId.value = data.data?.ids;
@@ -49,7 +51,7 @@ const useCounterStore = defineStore("counter", () => {
}
});
- // 功能：格式化数字，数字转换为万单位
+ // 功能：格式化数字，数字转换为万单位
function formatNumber(num: number) {
// 将num转换为数字
num = Number(num);
@@ -63,10 +65,10 @@ const useCounterStore = defineStore("counter", () => {
}
}
//将秒转化为时分秒
- // 函数formateTime，用于格式化时间
- // 参数time，表示时间
- // 将time转换为数字
- function formateTime(time: any) {
+ // 函数formateTime，用于格式化时间
+ // 参数time，表示时间
+ // 将time转换为数字
+ function formateTime(time: any) {
time = Number(time);
// 如果time的值大于3位，则表示为秒，需要除以1000
if (time.toFixed(0).length > 3) {
@@ -107,7 +109,7 @@ const useCounterStore = defineStore("counter", () => {
songInfo.value = val;
}
//时间戳转换为正常的时间
- // 获取时间戳转换
+ // 获取时间戳转换
const getTimestampConversion = function (timestamp: number) {
let timeStamp;
// 获取时间戳长度
@@ -138,7 +140,7 @@ const useCounterStore = defineStore("counter", () => {
// 返回转换后的时间戳
return Y + M + D;
};
- // 监听歌曲信息，当歌曲信息改变时，更新播放列表的播放索引
+ // 监听歌曲信息，当歌曲信息改变时，更新播放列表的播放索引
watch(songInfo, () => {
// 获取播放列表中与歌曲信息id相同的项的索引
playIndex.value = playList.value.findIndex(
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 13532c2..6659727 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -17,7 +17,7 @@
![]()
-
+