Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
zacharyzlj
Yz Music
提交
87cee60b
Y
Yz Music
项目概览
zacharyzlj
/
Yz Music
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
Y
Yz Music
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
前往新版Gitcode,体验更适合开发者的 AI 搜索 >>
提交
87cee60b
编写于
2月 24, 2021
作者:
Z
Zachary
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
feat: Add comments to all pages that need comments
* modify style * remove useless code
上级
5dc2bdbc
变更
10
隐藏空白更改
内联
并排
Showing
10 changed file
with
222 addition
and
128 deletion
+222
-128
src/api/toplist.js
src/api/toplist.js
+30
-0
src/assets/css/fakeqqmusic.scss
src/assets/css/fakeqqmusic.scss
+15
-0
src/components/common/DetailInfoCard.vue
src/components/common/DetailInfoCard.vue
+4
-7
src/components/common/DetailSonglist.vue
src/components/common/DetailSonglist.vue
+0
-9
src/components/common/LoginOpt.vue
src/components/common/LoginOpt.vue
+0
-1
src/components/common/RecommendedBar.vue
src/components/common/RecommendedBar.vue
+3
-37
src/views/musicLibrary/AlbumDetail.vue
src/views/musicLibrary/AlbumDetail.vue
+44
-4
src/views/musicLibrary/PlaylistDetail.vue
src/views/musicLibrary/PlaylistDetail.vue
+49
-2
src/views/musicLibrary/Ranking.vue
src/views/musicLibrary/Ranking.vue
+19
-40
src/views/musicLibrary/SongDetail.vue
src/views/musicLibrary/SongDetail.vue
+58
-28
未找到文件。
src/api/toplist.js
浏览文件 @
87cee60b
...
@@ -11,3 +11,33 @@ export const toplistTypes = {
...
@@ -11,3 +11,33 @@ export const toplistTypes = {
export
const
getTopList
=
toplistType
=>
export
const
getTopList
=
toplistType
=>
requset
.
get
(
`/top/list?id=
${
toplistType
}
`
);
requset
.
get
(
`/top/list?id=
${
toplistType
}
`
);
export
const
topRankingtype
=
[
{
name
:
"
飙升榜
"
,
dataId
:
"
19723756
"
},
{
name
:
"
新歌榜
"
,
dataId
:
"
3779629
"
},
{
name
:
"
热歌榜
"
,
dataId
:
"
3778678
"
},
{
name
:
"
原创榜
"
,
dataId
:
"
2884035
"
}
];
export
const
aereRankingtype
=
[
{
name
:
"
欧美榜
"
,
dataId
:
"
2809513713
"
},
{
name
:
"
韩语榜
"
,
dataId
:
"
745956260
"
},
{
name
:
"
日语榜
"
,
dataId
:
"
5059644681
"
}
];
export
const
specialRankingtype
=
[
{
name
:
"
古典榜
"
,
dataId
:
"
71384707
"
},
{
name
:
"
说唱榜
"
,
dataId
:
"
99131959
"
},
{
name
:
"
电子榜
"
,
dataId
:
"
1978921795
"
},
{
name
:
"
ACG榜
"
,
dataId
:
"
71385702
"
},
{
name
:
"
乡村榜
"
,
dataId
:
"
3112516681
"
},
{
name
:
"
摇滚榜
"
,
dataId
:
"
5059633707
"
},
{
name
:
"
古风榜
"
,
dataId
:
"
5059642708
"
},
{
name
:
"
民谣榜
"
,
dataId
:
"
5059661515
"
}
];
export
const
globalRankingtype
=
[
{
name
:
"
UK排行周榜
"
,
dataId
:
"
180106
"
},
{
name
:
"
美国Billboard榜
"
,
dataId
:
"
60198
"
},
{
name
:
"
Beatport全球电子舞曲榜
"
,
dataId
:
"
3812895
"
},
{
name
:
"
iTuness榜
"
,
dataId
:
"
11641012
"
},
{
name
:
"
日本Oricon
"
,
dataId
:
"
60131
"
},
{
name
:
"
法国 NRJ Vos Hits 周榜
"
,
dataId
:
"
27135204
"
}
];
src/assets/css/fakeqqmusic.scss
浏览文件 @
87cee60b
...
@@ -319,6 +319,21 @@ $black: #000;
...
@@ -319,6 +319,21 @@ $black: #000;
background
:
rgba
(
0
,
0
,
0
,
0
.1
);
background
:
rgba
(
0
,
0
,
0
,
0
.1
);
}
}
/* 超长滑动条(home)*/
.mod_slide
{
overflow
:
hidden
;
margin-bottom
:
20px
;
}
.slide__list
{
position
:
relative
;
font-size
:
0
;
width
:
1250%
;
transition-duration
:
1s
;
}
.slide__item
{
width
:
2%
;
}
/* 切换小圆点 */
/* 切换小圆点 */
.mod_slide_switch
{
.mod_slide_switch
{
width
:
100%
;
width
:
100%
;
...
...
src/components/common/DetailInfoCard.vue
浏览文件 @
87cee60b
...
@@ -117,7 +117,7 @@
...
@@ -117,7 +117,7 @@
href=
"#comment_box"
href=
"#comment_box"
@
click=
"btnClick('comment')"
@
click=
"btnClick('comment')"
>
>
<i
class=
"mod_btn__icon_comment"
></i>
评论()
<i
class=
"mod_btn__icon_comment"
></i>
评论(
{{
commentCount
}}
)
</a>
</a>
<a
<a
href=
"javascript:;"
href=
"javascript:;"
...
@@ -147,6 +147,9 @@ export default {
...
@@ -147,6 +147,9 @@ export default {
type
:
String
,
type
:
String
,
default
:
"
song
"
,
default
:
"
song
"
,
},
},
commentCount
:
{
default
:
0
,
},
},
},
methods
:
{
methods
:
{
btnClick
(
v
)
{
btnClick
(
v
)
{
...
@@ -160,12 +163,6 @@ export default {
...
@@ -160,12 +163,6 @@ export default {
</
script
>
</
script
>
<
style
scoped
>
<
style
scoped
>
h1
,
h2
,
h3
,
h4
,
h5
,
h6
,
li
,
li
,
ul
{
ul
{
margin
:
0
;
margin
:
0
;
...
...
src/components/common/DetailSonglist.vue
浏览文件 @
87cee60b
...
@@ -87,19 +87,10 @@ export default {
...
@@ -87,19 +87,10 @@ export default {
</
script
>
</
script
>
<
style
scoped
>
<
style
scoped
>
h1
,
h2
,
h3
,
h4
,
h5
,
h6
,
hr
,
li
,
li
,
ol
,
ol
,
p
,
p
,
pre
,
td
,
td
,
textarea
,
th
,
th
,
ul
{
ul
{
margin
:
0
;
margin
:
0
;
...
...
src/components/common/LoginOpt.vue
浏览文件 @
87cee60b
...
@@ -17,7 +17,6 @@
...
@@ -17,7 +17,6 @@
<!-- 未登录 -->
<!-- 未登录 -->
<a
<a
class=
"top_login__link js_login"
class=
"top_login__link js_login"
href=
"javascript:;"
:style=
"
{ display: isLogged ? 'none' : '' }"
:style=
"
{ display: isLogged ? 'none' : '' }"
@click="showLoginPopup"
@click="showLoginPopup"
>
>
...
...
src/components/common/RecommendedBar.vue
浏览文件 @
87cee60b
...
@@ -183,31 +183,15 @@ export default {
...
@@ -183,31 +183,15 @@ export default {
color
:
#31c27c
;
color
:
#31c27c
;
}
}
.mod_playlist
.playlist__list
{
padding
:
0
;
}
/* list */
/* list */
.mod_playlist
{
.mod_playlist
{
overflow
:
hidden
;
overflow
:
hidden
;
font-size
:
0
;
font-size
:
0
;
}
.mod_slide
{
overflow
:
hidden
;
margin-bottom
:
20px
;
}
.mod_playlist
{
margin-right
:
-20px
;
margin-right
:
-20px
;
}
}
.slide__list
{
position
:
relative
;
font-size
:
0
;
width
:
1250%
;
transition-duration
:
1s
;
}
.slide__item
{
width
:
2%
;
}
.mod_playlist
.playlist__list
{
margin-right
:
-20px
;
padding
:
0
;
}
.playlist__item
{
.playlist__item
{
display
:
inline-block
;
display
:
inline-block
;
/*width: 18%;*/
/*width: 18%;*/
...
@@ -223,30 +207,12 @@ export default {
...
@@ -223,30 +207,12 @@ export default {
width
:
1.6%
;
width
:
1.6%
;
padding-bottom
:
0
;
padding-bottom
:
0
;
}
}
.mod_playlist
.playlist__item_box
{
position
:
relative
;
margin-right
:
20px
;
}
.mod_index--hot
.playlist__item_box
{
.mod_index--hot
.playlist__item_box
{
position
:
absolute
;
position
:
absolute
;
top
:
0
;
top
:
0
;
left
:
0
;
left
:
0
;
right
:
0
;
right
:
0
;
}
}
.mod_playlist
.playlist__cover
{
position
:
relative
;
display
:
block
;
overflow
:
hidden
;
padding-top
:
100%
;
margin-bottom
:
15px
;
}
.mod_playlist
.playlist__pic
{
height
:
100%
;
object-fit
:
cover
;
}
.mod_playlist
.playlist__title
{
overflow
:
hidden
;
}
a
:hover
{
a
:hover
{
color
:
#31c27c
;
color
:
#31c27c
;
...
...
src/views/musicLibrary/AlbumDetail.vue
浏览文件 @
87cee60b
<
template
>
<
template
>
<div
class=
"main"
>
<div
class=
"main"
>
<detail-info-card
:obj=
"album"
:cardType=
"'album'"
@
btnClick=
"cardClick"
/>
<detail-info-card
:obj=
"album"
:cardType=
"'album'"
:commentCount=
"commentCount"
@
btnClick=
"cardClick"
/>
<div
class=
"detail_layout"
>
<div
class=
"detail_layout"
>
<div
class=
"detail_layout__main"
>
<div
class=
"detail_layout__main"
>
<detail-songlist
:songs=
"songs"
:listType=
"'album'"
/>
<detail-songlist
:songs=
"songs"
:listType=
"'album'"
/>
<!-- comment -->
<commont-box
:comments=
"comments"
:limit=
"pageSize"
:currentPage=
"commentPage"
:total=
"commentCount"
@
current-change=
"currentChange"
/>
</div>
</div>
<div
class=
"detail_layout__other"
>
<div
class=
"detail_layout__other"
>
...
@@ -40,8 +53,8 @@
...
@@ -40,8 +53,8 @@
<
script
>
<
script
>
import
DetailInfoCard
from
"
components/common/DetailInfoCard
"
;
import
DetailInfoCard
from
"
components/common/DetailInfoCard
"
;
import
DetailSonglist
from
"
components/common/DetailSonglist
"
;
import
DetailSonglist
from
"
components/common/DetailSonglist
"
;
import
ModListMenu
from
"
components/common/ModListMenu
"
;
import
CommontBox
from
"
components/common/CommontBox
"
;
import
{
getAlbum
}
from
"
api
"
;
import
{
getAlbum
,
getCommentsNew
}
from
"
api
"
;
import
{
createSong
,
playSonglist
,
formatDate
}
from
"
common/utils
"
;
import
{
createSong
,
playSonglist
,
formatDate
}
from
"
common/utils
"
;
export
default
{
export
default
{
...
@@ -51,6 +64,10 @@ export default {
...
@@ -51,6 +64,10 @@ export default {
id
:
this
.
$route
.
query
.
id
,
id
:
this
.
$route
.
query
.
id
,
album
:
{},
album
:
{},
songs
:
[],
songs
:
[],
pageSize
:
20
,
commentPage
:
1
,
commentCount
:
0
,
comments
:
[],
};
};
},
},
mounted
()
{
mounted
()
{
...
@@ -88,6 +105,7 @@ export default {
...
@@ -88,6 +105,7 @@ export default {
}
}
);
);
console
.
log
(
this
.
songs
);
console
.
log
(
this
.
songs
);
this
.
getComment
();
});
});
},
},
toggleShowMoreInfo
()
{
toggleShowMoreInfo
()
{
...
@@ -98,11 +116,33 @@ export default {
...
@@ -98,11 +116,33 @@ export default {
playSonglist
(
this
.
songs
);
playSonglist
(
this
.
songs
);
}
}
},
},
getComment
()
{
let
params
=
{
type
:
3
,
pageSize
:
this
.
pageSize
,
pageNo
:
this
.
commentPage
,
id
:
this
.
album
.
id
,
sortType
:
2
,
};
getCommentsNew
(
params
).
then
((
res
)
=>
{
this
.
commentCount
=
res
.
data
.
data
.
totalCount
>
5000
?
5000
:
res
.
data
.
data
.
totalCount
;
this
.
comments
=
res
.
data
.
data
.
comments
;
});
},
currentChange
(
v
)
{
this
.
commentPage
=
v
;
},
},
watch
:
{
commentPage
()
{
this
.
getComment
();
},
},
},
components
:
{
components
:
{
DetailInfoCard
,
DetailInfoCard
,
DetailSonglist
,
DetailSonglist
,
ModListMenu
,
CommontBox
,
},
},
};
};
</
script
>
</
script
>
...
...
src/views/musicLibrary/PlaylistDetail.vue
浏览文件 @
87cee60b
<
template
>
<
template
>
<div
class=
"main"
>
<div
class=
"main"
>
<detail-info-card
:obj=
"playlist"
:cardType=
"'pl'"
@
btnClick=
"cardClick"
/>
<detail-info-card
:obj=
"playlist"
:cardType=
"'pl'"
:commentCount=
"commentCount"
@
btnClick=
"cardClick"
/>
<div
class=
"detail_layout"
>
<div
class=
"detail_layout"
>
<div
class=
"detail_layout__main"
>
<div
class=
"detail_layout__main"
>
<detail-songlist
:songs=
"songs"
:listType=
"'playlist'"
/>
<detail-songlist
:songs=
"songs"
:listType=
"'playlist'"
/>
<!-- comment -->
<commont-box
:comments=
"comments"
:limit=
"pageSize"
:currentPage=
"commentPage"
:total=
"commentCount"
@
current-change=
"currentChange"
/>
</div>
</div>
<div
class=
"detail_layout__other"
>
<div
class=
"detail_layout__other"
>
...
@@ -44,7 +57,13 @@
...
@@ -44,7 +57,13 @@
<
script
>
<
script
>
import
DetailInfoCard
from
"
components/common/DetailInfoCard
"
;
import
DetailInfoCard
from
"
components/common/DetailInfoCard
"
;
import
DetailSonglist
from
"
components/common/DetailSonglist
"
;
import
DetailSonglist
from
"
components/common/DetailSonglist
"
;
import
{
getPlayList
,
getPlaylistDetial
,
getSongDetail
}
from
"
api
"
;
import
CommontBox
from
"
components/common/CommontBox
"
;
import
{
getPlayList
,
getPlaylistDetial
,
getSongDetail
,
getCommentsNew
,
}
from
"
api
"
;
import
{
processCount
,
createSong
,
playSonglist
}
from
"
common/utils
"
;
import
{
processCount
,
createSong
,
playSonglist
}
from
"
common/utils
"
;
export
default
{
export
default
{
...
@@ -53,6 +72,10 @@ export default {
...
@@ -53,6 +72,10 @@ export default {
id
:
this
.
$route
.
query
.
id
,
id
:
this
.
$route
.
query
.
id
,
playlist
:
{},
playlist
:
{},
songs
:
[],
songs
:
[],
pageSize
:
20
,
commentPage
:
1
,
commentCount
:
0
,
comments
:
[],
};
};
},
},
created
()
{
created
()
{
...
@@ -94,15 +117,39 @@ export default {
...
@@ -94,15 +117,39 @@ export default {
});
});
this
.
songs
=
songs
;
this
.
songs
=
songs
;
});
});
this
.
getComment
();
});
});
},
},
cardClick
(
v
)
{
cardClick
(
v
)
{
if
(
v
==
"
all
"
)
playSonglist
(
this
.
songs
);
if
(
v
==
"
all
"
)
playSonglist
(
this
.
songs
);
},
},
getComment
()
{
let
params
=
{
type
:
2
,
pageSize
:
this
.
pageSize
,
pageNo
:
this
.
commentPage
,
id
:
this
.
playlist
.
id
,
sortType
:
2
,
};
getCommentsNew
(
params
).
then
((
res
)
=>
{
this
.
commentCount
=
res
.
data
.
data
.
totalCount
>
5000
?
5000
:
res
.
data
.
data
.
totalCount
;
this
.
comments
=
res
.
data
.
data
.
comments
;
});
},
currentChange
(
v
)
{
this
.
commentPage
=
v
;
},
},
watch
:
{
commentPage
()
{
this
.
getComment
();
},
},
},
components
:
{
components
:
{
DetailInfoCard
,
DetailInfoCard
,
DetailSonglist
,
DetailSonglist
,
CommontBox
,
},
},
};
};
</
script
>
</
script
>
...
...
src/views/musicLibrary/Ranking.vue
浏览文件 @
87cee60b
...
@@ -3,7 +3,6 @@
...
@@ -3,7 +3,6 @@
<div
class=
"toplist_nav"
>
<div
class=
"toplist_nav"
>
<dl
class=
"toplist_nav__list"
>
<dl
class=
"toplist_nav__list"
>
<dt
class=
"toplist_nav__tit"
>
巅峰榜
</dt>
<dt
class=
"toplist_nav__tit"
>
巅峰榜
</dt>
<dd
class=
"toplist_nav__item"
>
<dd
class=
"toplist_nav__item"
>
<a
<a
class=
"toplist_nav__link"
class=
"toplist_nav__link"
...
@@ -20,7 +19,6 @@
...
@@ -20,7 +19,6 @@
<dl
class=
"toplist_nav__list"
>
<dl
class=
"toplist_nav__list"
>
<dt
class=
"toplist_nav__tit"
>
地区榜
</dt>
<dt
class=
"toplist_nav__tit"
>
地区榜
</dt>
<dd
class=
"toplist_nav__item"
>
<dd
class=
"toplist_nav__item"
>
<a
<a
class=
"toplist_nav__link"
class=
"toplist_nav__link"
...
@@ -37,7 +35,6 @@
...
@@ -37,7 +35,6 @@
<dl
class=
"toplist_nav__list"
>
<dl
class=
"toplist_nav__list"
>
<dt
class=
"toplist_nav__tit"
>
特色榜
</dt>
<dt
class=
"toplist_nav__tit"
>
特色榜
</dt>
<dd
class=
"toplist_nav__item"
>
<dd
class=
"toplist_nav__item"
>
<a
<a
class=
"toplist_nav__link"
class=
"toplist_nav__link"
...
@@ -54,7 +51,6 @@
...
@@ -54,7 +51,6 @@
<dl
class=
"toplist_nav__list"
>
<dl
class=
"toplist_nav__list"
>
<dt
class=
"toplist_nav__tit"
>
全球榜
</dt>
<dt
class=
"toplist_nav__tit"
>
全球榜
</dt>
<dd
class=
"toplist_nav__item"
>
<dd
class=
"toplist_nav__item"
>
<a
<a
class=
"toplist_nav__link"
class=
"toplist_nav__link"
...
@@ -103,19 +99,19 @@
...
@@ -103,19 +99,19 @@
<a
class=
"mod_btn_green js_all_play"
@
click=
"playSonglist(listDatas)"
<a
class=
"mod_btn_green js_all_play"
@
click=
"playSonglist(listDatas)"
><i
class=
"mod_btn_green__icon_play"
></i>
播放全部
</a
><i
class=
"mod_btn_green__icon_play"
></i>
播放全部
</a
>
>
<a
href=
"javascript:;"
class=
"mod_btn js_all_fav"
<a
class=
"mod_btn js_all_fav"
><i
class=
"mod_btn__icon_add"
></i>
添加到
</a
><i
class=
"mod_btn__icon_add"
></i>
添加到
</a
>
>
<a
href=
"javascript:;"
class=
"mod_btn js_all_down"
<a
class=
"mod_btn js_all_down"
><i
class=
"mod_btn__icon_down"
></i>
下载
</a
><i
class=
"mod_btn__icon_down"
></i>
下载
</a
>
>
<a
href=
"javascript:;"
class=
"mod_btn js_batch"
<a
class=
"mod_btn js_batch"
><i
class=
"mod_btn__icon_batch"
></i>
批量操作
</a
><i
class=
"mod_btn__icon_batch"
></i>
批量操作
</a
>
>
<a
class=
"mod_btn js_into_comment"
href=
"#comment_box"
<a
class=
"mod_btn js_into_comment"
href=
"#comment_box"
><i
class=
"mod_btn__icon_comment"
></i>
评论
(
{{
><i
class=
"mod_btn__icon_comment"
></i>
评论
{{
processCount
(
commentCount
)
"
(
"
+
processCount
(
commentCount
)
+
"
)
"
}}
)
</a
}}
</a
>
>
</div>
</div>
...
@@ -227,7 +223,15 @@
...
@@ -227,7 +223,15 @@
<
script
>
<
script
>
import
ModListMenu
from
"
components/common/ModListMenu
"
;
import
ModListMenu
from
"
components/common/ModListMenu
"
;
import
CommontBox
from
"
components/common/CommontBox
"
;
import
CommontBox
from
"
components/common/CommontBox
"
;
import
{
getPlaylistDetial
,
getSongDetail
,
getCommentsNew
}
from
"
api
"
;
import
{
topRankingtype
,
aereRankingtype
,
specialRankingtype
,
globalRankingtype
,
getPlaylistDetial
,
getSongDetail
,
getCommentsNew
,
}
from
"
api
"
;
import
{
import
{
isDef
,
isDef
,
createSong
,
createSong
,
...
@@ -240,35 +244,10 @@ export default {
...
@@ -240,35 +244,10 @@ export default {
data
()
{
data
()
{
return
{
return
{
loading
:
true
,
loading
:
true
,
topRankingtype
:
[
topRankingtype
,
{
name
:
"
飙升榜
"
,
dataId
:
"
19723756
"
},
aereRankingtype
,
{
name
:
"
新歌榜
"
,
dataId
:
"
3779629
"
},
specialRankingtype
,
{
name
:
"
热歌榜
"
,
dataId
:
"
3778678
"
},
globalRankingtype
,
{
name
:
"
原创榜
"
,
dataId
:
"
2884035
"
},
],
aereRankingtype
:
[
{
name
:
"
欧美榜
"
,
dataId
:
"
2809513713
"
},
{
name
:
"
韩语榜
"
,
dataId
:
"
745956260
"
},
{
name
:
"
日语榜
"
,
dataId
:
"
5059644681
"
},
],
specialRankingtype
:
[
{
name
:
"
古典榜
"
,
dataId
:
"
71384707
"
},
{
name
:
"
说唱榜
"
,
dataId
:
"
99131959
"
},
{
name
:
"
电子榜
"
,
dataId
:
"
1978921795
"
},
{
name
:
"
ACG榜
"
,
dataId
:
"
71385702
"
},
{
name
:
"
乡村榜
"
,
dataId
:
"
3112516681
"
},
{
name
:
"
摇滚榜
"
,
dataId
:
"
5059633707
"
},
{
name
:
"
古风榜
"
,
dataId
:
"
5059642708
"
},
{
name
:
"
民谣榜
"
,
dataId
:
"
5059661515
"
},
],
globalRankingtype
:
[
{
name
:
"
UK排行周榜
"
,
dataId
:
"
180106
"
},
{
name
:
"
美国Billboard榜
"
,
dataId
:
"
60198
"
},
{
name
:
"
Beatport全球电子舞曲榜
"
,
dataId
:
"
3812895
"
},
{
name
:
"
iTuness榜
"
,
dataId
:
"
11641012
"
},
{
name
:
"
日本Oricon
"
,
dataId
:
"
60131
"
},
{
name
:
"
法国 NRJ Vos Hits 周榜
"
,
dataId
:
"
27135204
"
},
],
seletedTypeName
:
"
飙升榜
"
,
seletedTypeName
:
"
飙升榜
"
,
seletedType
:
"
19723756
"
,
seletedType
:
"
19723756
"
,
listDatas
:
[],
listDatas
:
[],
...
...
src/views/musicLibrary/SongDetail.vue
浏览文件 @
87cee60b
<
template
>
<
template
>
<div
class=
"main"
>
<div
class=
"main"
>
<detail-info-card
:obj=
"song"
@
btnClick=
"cardClick"
/>
<detail-info-card
:obj=
"song"
:commentCount=
"commentCount"
@
btnClick=
"cardClick"
/>
<div
class=
"detail_layout"
>
<div
class=
"detail_layout"
>
<div
class=
"detail_layout__main"
>
<div
class=
"detail_layout__main"
>
...
@@ -30,6 +34,15 @@
...
@@ -30,6 +34,15 @@
</div>
</div>
</div>
</div>
<!--歌词 end-->
<!--歌词 end-->
<!-- comment -->
<commont-box
:comments=
"comments"
:limit=
"pageSize"
:currentPage=
"commentPage"
:total=
"commentCount"
@
current-change=
"currentChange"
/>
</div>
</div>
<!--相似歌曲-->
<!--相似歌曲-->
<div
class=
"detail_layout__other"
>
<div
class=
"detail_layout__other"
>
...
@@ -105,8 +118,21 @@
...
@@ -105,8 +118,21 @@
<
script
>
<
script
>
import
DetailInfoCard
from
"
components/common/DetailInfoCard
"
;
import
DetailInfoCard
from
"
components/common/DetailInfoCard
"
;
import
BlackTip
from
"
components/common/BlackTip
"
;
import
BlackTip
from
"
components/common/BlackTip
"
;
import
{
getSongDetail
,
getSongLiyric
,
getSimiSong
,
getMvDetail
}
from
"
api
"
;
import
CommontBox
from
"
components/common/CommontBox
"
;
import
{
createSong
,
formatDate
,
playTheSong
,
copyText
}
from
"
common/utils
"
;
import
{
getSongDetail
,
getSongLiyric
,
getSimiSong
,
getMvDetail
,
getCommentsNew
,
}
from
"
api
"
;
import
{
createSong
,
formatDate
,
playTheSong
,
copyText
,
gotoSongDetail
,
}
from
"
common/utils
"
;
export
default
{
export
default
{
data
()
{
data
()
{
...
@@ -118,6 +144,10 @@ export default {
...
@@ -118,6 +144,10 @@ export default {
lyric
:
[],
lyric
:
[],
simiSongs
:
null
,
simiSongs
:
null
,
mv
:
null
,
mv
:
null
,
pageSize
:
20
,
commentPage
:
1
,
commentCount
:
0
,
comments
:
[],
};
};
},
},
created
()
{
created
()
{
...
@@ -144,10 +174,9 @@ export default {
...
@@ -144,10 +174,9 @@ export default {
:
formatDate
(
d
.
publishTime
,
"
yyyy-MM-dd
"
),
:
formatDate
(
d
.
publishTime
,
"
yyyy-MM-dd
"
),
});
});
// 如果有mv, 获取mv信息
// 如果有mv, 获取mv信息
console
.
log
(
d
.
mv
);
if
(
d
.
mv
!=
0
)
{
if
(
d
.
mv
!=
0
)
{
getMvDetail
(
d
.
mv
).
then
((
res
)
=>
{
getMvDetail
(
d
.
mv
).
then
((
res
)
=>
{
console
.
log
(
res
);
//
console.log(res);
let
d
=
res
.
data
.
data
;
let
d
=
res
.
data
.
data
;
this
.
mv
=
{
this
.
mv
=
{
id
:
d
.
id
,
id
:
d
.
id
,
...
@@ -157,6 +186,7 @@ export default {
...
@@ -157,6 +186,7 @@ export default {
};
};
});
});
}
}
this
.
getComment
();
});
});
// 获取歌词
// 获取歌词
getSongLiyric
(
this
.
songId
).
then
((
res
)
=>
{
getSongLiyric
(
this
.
songId
).
then
((
res
)
=>
{
...
@@ -197,33 +227,42 @@ export default {
...
@@ -197,33 +227,42 @@ export default {
this
.
ifShowTip
=
false
;
this
.
ifShowTip
=
false
;
},
1000
);
},
1000
);
},
},
gotoSongDetail
(
id
)
{
gotoSongDetail
,
this
.
$router
.
push
({
cardClick
(
v
)
{
path
:
"
/musicLibrary/songDetail
"
,
if
(
v
==
"
all
"
)
playTheSong
(
this
.
song
);
query
:
{
id
:
id
},
},
getComment
()
{
let
params
=
{
type
:
0
,
pageSize
:
this
.
pageSize
,
pageNo
:
this
.
commentPage
,
id
:
this
.
song
.
id
,
sortType
:
2
,
};
getCommentsNew
(
params
).
then
((
res
)
=>
{
this
.
commentCount
=
res
.
data
.
data
.
totalCount
>
5000
?
5000
:
res
.
data
.
data
.
totalCount
;
this
.
comments
=
res
.
data
.
data
.
comments
;
});
});
},
},
play
(
)
{
currentChange
(
v
)
{
playTheSong
(
this
.
song
)
;
this
.
commentPage
=
v
;
},
},
cardClick
(
v
)
{
},
if
(
v
==
"
all
"
)
this
.
play
();
watch
:
{
commentPage
()
{
this
.
getComment
();
},
},
},
},
components
:
{
components
:
{
DetailInfoCard
,
DetailInfoCard
,
BlackTip
,
BlackTip
,
CommontBox
,
},
},
};
};
</
script
>
</
script
>
<
style
scoped
>
<
style
scoped
>
h1
,
h2
,
h3
,
h4
,
h5
,
h6
,
li
,
li
,
ol
,
ol
,
p
,
p
,
...
@@ -261,13 +300,4 @@ ul {
...
@@ -261,13 +300,4 @@ ul {
max-height
:
390px
;
max-height
:
390px
;
overflow
:
hidden
;
overflow
:
hidden
;
}
}
.lyric__cont
{
font-size
:
14px
;
color
:
#000
;
line-height
:
26px
;
}
.c_tx_current
,
.c_tx_highlight
{
color
:
#31c27c
;
}
</
style
>
</
style
>
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录