Skip to content

Commit a035a25

Browse files
lyswhutlyswhut
committed
完成歌单功能
1 parent 9727601 commit a035a25

9 files changed

Lines changed: 248 additions & 79 deletions

File tree

‎src/renderer/components/core/Player.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -283,7 +283,7 @@ export default {
283283
}
284284
},
285285
checkDelayNextTimeout() {
286-
console.log(this.delayNextTimeout)
286+
// console.log(this.delayNextTimeout)
287287
if (this.delayNextTimeout) {
288288
clearTimeout(this.delayNextTimeout)
289289
this.delayNextTimeout = null

‎src/renderer/components/material/SongList.vue‎

Lines changed: 47 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,41 @@
11
<template lang="pug">
22
div(:class="$style.songList")
3-
div(v-if="list.length" :class="$style.list")
4-
div(:class="$style.thead")
5-
table
6-
thead
7-
tr
8-
th.nobreak.center(style="width: 37px;")
9-
material-checkbox(id="search_select_all" v-model="isSelectAll" @change="handleSelectAllData"
10-
:indeterminate="isIndeterminate" :title="isSelectAll && !isIndeterminate ? '全不选' : '全选'")
11-
th.nobreak(style="width: 25%;") 歌曲名
12-
th.nobreak(style="width: 20%;") 歌手
13-
th.nobreak(style="width: 22%;") 专辑
14-
th.nobreak(style="width: 18%;") 操作
15-
th.nobreak(style="width: 10%;") 时长
16-
div.scroll(:class="$style.tbody" ref="dom_scrollContent")
17-
table
18-
tbody
19-
tr(v-for='(item, index) in list' :key='item.songmid' @click="handleDoubleClick(index)")
20-
td.nobreak.center(style="width: 37px;" @click.stop)
21-
material-checkbox(:id="index.toString()" v-model="selectdList" @change="handleChangeSelect" :value="item")
22-
td.break(style="width: 25%;")
23-
| {{item.name}}
24-
span.badge.badge-info(v-if="item._types['320k']") 高品质
25-
span.badge.badge-success(v-if="item._types.ape || item._types.flac") 无损
26-
td.break(style="width: 20%;") {{item.singer}}
27-
td.break(style="width: 22%;") {{item.albumName}}
28-
td(style="width: 18%;")
29-
material-list-buttons(:index="index" :search-btn="true" :play-btn="item.source == 'kw' || (!isAPITemp && item.source != 'tx')" :download-btn="item.source == 'kw' || (!isAPITemp && item.source != 'tx')" :remove-btn="false" @btn-click="handleListBtnClick")
30-
//- button.btn-info(type='button' v-if="item._types['128k'] || item._types['192k'] || item._types['320k'] || item._types.flac" @click.stop='openDownloadModal(index)') 下载
31-
//- button.btn-secondary(type='button' v-if="item._types['128k'] || item._types['192k'] || item._types['320k']" @click.stop='testPlay(index)') 试听
32-
//- button.btn-success(type='button' v-if="(item._types['128k'] || item._types['192k'] || item._types['320k']) && userInfo" @click.stop='showListModal(index)') ＋
33-
td(style="width: 10%;") {{item.interval || '--/--'}}
34-
div(:class="$style.pagination")
35-
material-pagination(:count="total" :limit="limit" :page="page" @btn-click="handleTogglePage")
36-
div(v-else :class="$style.noitem")
37-
p(v-html="noItem")
3+
transition(enter-active-class="animated fadeIn" leave-active-class="animated fadeOut")
4+
div(v-if="list.length" :class="$style.list")
5+
div(:class="$style.thead")
6+
table
7+
thead
8+
tr
9+
th.nobreak.center(style="width: 37px;")
10+
material-checkbox(id="search_select_all" v-model="isSelectAll" @change="handleSelectAllData"
11+
:indeterminate="isIndeterminate" :title="isSelectAll && !isIndeterminate ? '全不选' : '全选'")
12+
th.nobreak(style="width: 25%;") 歌曲名
13+
th.nobreak(style="width: 20%;") 歌手
14+
th.nobreak(style="width: 22%;") 专辑
15+
th.nobreak(style="width: 18%;") 操作
16+
th.nobreak(style="width: 10%;") 时长
17+
div.scroll(:class="$style.tbody" ref="dom_scrollContent")
18+
table
19+
tbody
20+
tr(v-for='(item, index) in list' :key='item.songmid' @click="handleDoubleClick(index)")
21+
td.nobreak.center(style="width: 37px;" @click.stop)
22+
material-checkbox(:id="index.toString()" v-model="selectdList" @change="handleChangeSelect" :value="item")
23+
td.break(style="width: 25%;")
24+
| {{item.name}}
25+
span.badge.badge-info(v-if="item._types['320k']") 高品质
26+
span.badge.badge-success(v-if="item._types.ape || item._types.flac") 无损
27+
td.break(style="width: 20%;") {{item.singer}}
28+
td.break(style="width: 22%;") {{item.albumName}}
29+
td(style="width: 18%;")
30+
material-list-buttons(:index="index" :search-btn="true" :play-btn="item.source == 'kw' || (!isAPITemp && item.source != 'tx')" :download-btn="item.source == 'kw' || (!isAPITemp && item.source != 'tx')" :remove-btn="false" @btn-click="handleListBtnClick")
31+
//- button.btn-info(type='button' v-if="item._types['128k'] || item._types['192k'] || item._types['320k'] || item._types.flac" @click.stop='openDownloadModal(index)') 下载
32+
//- button.btn-secondary(type='button' v-if="item._types['128k'] || item._types['192k'] || item._types['320k']" @click.stop='testPlay(index)') 试听
33+
//- button.btn-success(type='button' v-if="(item._types['128k'] || item._types['192k'] || item._types['320k']) && userInfo" @click.stop='showListModal(index)') ＋
34+
td(style="width: 10%;") {{item.interval || '--/--'}}
35+
div(:class="$style.pagination")
36+
material-pagination(:count="total" :limit="limit" :page="page" @btn-click="handleTogglePage")
37+
div(v-else :class="$style.noitem")
38+
p(v-html="noItem")
3839
material-flow-btn(:show="isShowEditBtn && (source == 'kw' || !isAPITemp)" :remove-btn="false" @btn-click="handleFlowBtnClick")
3940
</template>
4041

@@ -111,6 +112,7 @@ export default {
111112
},
112113
list(n) {
113114
this.resetSelect()
115+
if (!this.list.length) return
114116
this.$nextTick(() => scrollTo(this.$refs.dom_scrollContent, 0))
115117
},
116118
},
@@ -143,6 +145,7 @@ export default {
143145
},
144146
handleSelectAllData(isSelect) {
145147
this.selectdList = isSelect ? [...this.list] : []
148+
this.$emit('input', [...this.selectdList])
146149
},
147150
resetSelect() {
148151
this.selectdList = false
@@ -183,6 +186,7 @@ export default {
183186
}
184187
.thead {
185188
flex: none;
189+
background-color: @color-theme_2;
186190
}
187191
.tbody {
188192
flex: auto;
@@ -220,4 +224,12 @@ export default {
220224
}
221225
}
222226
227+
each(@themes, {
228+
:global(#container.@{value}) {
229+
.thead {
230+
background-color: ~'@color-@{value}-theme_2';
231+
}
232+
}
233+
})
234+
223235
</style>

‎src/renderer/components/material/TagList.vue‎

Lines changed: 23 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
div(:class="$style.label" ref="dom_btn" @click="handleShow") {{value.name}}
44
div.scroll(:class="$style.list" @click.stop ref="dom_list" :style="listStyle")
55
div(:class="$style.tag" @click="handleClick(null)") 全部
6-
dl(:class="$style.type" v-for="type in list")
6+
dl(v-for="type in list")
77
dt(:class="$style.type") {{type.name}}
88
dd(:class="$style.tag" v-for="tag in type.list" @click="handleClick(tag)") {{tag.name}}
99
</template>
@@ -114,7 +114,7 @@ export default {
114114
.list {
115115
position: absolute;
116116
top: 100%;
117-
width: 644px;
117+
width: 646px;
118118
left: 0;
119119
border-bottom: 2px solid @color-tab-border-bottom;
120120
border-right: 2px solid @color-tab-border-bottom;
@@ -125,6 +125,8 @@ export default {
125125
transition: .25s ease;
126126
transition-property: height, opacity;
127127
z-index: 10;
128+
padding: 10px;
129+
box-sizing: border-box;
128130
129131
li {
130132
cursor: pointer;
@@ -145,11 +147,18 @@ export default {
145147
}
146148
}
147149
150+
.type {
151+
padding-top: 10px;
152+
padding-bottom: 3px;
153+
color: #999;
154+
}
155+
148156
.tag {
149157
display: inline-block;
150158
margin: 5px;
151159
background-color: @color-btn-background;
152-
padding: 5px;
160+
padding: 8px 10px;
161+
border-radius: @radius-progress-border;
153162
cursor: pointer;
154163
&:hover {
155164
background-color: @color-theme_2-hover;
@@ -176,6 +185,7 @@ each(@themes, {
176185
177186
.list {
178187
border-bottom-color: ~'@{color-@{value}-tab-border-bottom}';
188+
border-right-color: ~'@{color-@{value}-tab-border-bottom}';
179189
// border-left-color: ~'@{color-@{value}-tab-border-bottom}';
180190
li {
181191
// color: ~'@{color-@{value}-btn}';
@@ -188,6 +198,16 @@ each(@themes, {
188198
}
189199
}
190200
}
201+
202+
.tag {
203+
background-color: ~'@{color-@{value}-btn-background}';
204+
&:hover {
205+
background-color: ~'@{color-@{value}-theme_2-hover}';
206+
}
207+
&:active {
208+
background-color: ~'@{color-@{value}-theme_2-active}';
209+
}
210+
}
191211
}
192212
})
193213

‎src/renderer/store/modules/songList.js‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ const state = {
2525
limit: 30,
2626
key: null,
2727
},
28+
selectListInfo: {},
2829
isVisibleListDetail: false,
2930
}
3031

@@ -38,6 +39,7 @@ const getters = {
3839
sourceInfo: () => ({ sources, sortList }),
3940
tags: state => state.tags,
4041
isVisibleListDetail: state => state.isVisibleListDetail,
42+
selectListInfo: state => state.selectListInfo,
4143
listData(state) {
4244
return state.list
4345
},
@@ -56,7 +58,7 @@ const actions = {
5658
let source = rootState.setting.songList.source
5759
let tabId = rootState.setting.songList.tagInfo.id
5860
let sortId = rootState.setting.songList.sortId
59-
console.log(sortId)
61+
// console.log(sortId)
6062
let key = `${source}${sortId}${tabId}${page}`
6163
if (state.list.list.length && state.list.key == key) return true
6264
return music[source].songList.getList(sortId, tabId, page).then(result => commit('setList', { result, key, page }))
@@ -65,7 +67,7 @@ const actions = {
6567
let source = rootState.setting.songList.source
6668
let key = `${source}${id}${page}`
6769
if (state.listDetail.list.length && state.listDetail.key == key) return true
68-
console.log(id, page)
70+
commit('clearListDetail')
6971
return music[source].songList.getListDetail(id, page).then(result => commit('setListDetail', { result, key, page }))
7072
},
7173
}
@@ -92,6 +94,12 @@ const mutations = {
9294
setVisibleListDetail(state, bool) {
9395
state.isVisibleListDetail = bool
9496
},
97+
setSelectListInfo(state, info) {
98+
state.selectListInfo = info
99+
},
100+
clearListDetail(state) {
101+
state.listDetail.list = []
102+
},
95103
}
96104

97105
export default {

‎src/renderer/utils/index.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -184,8 +184,8 @@ export const updateSetting = setting => {
184184
tabId: 'kwbiaosb',
185185
},
186186
songList: {
187-
source: 'kw',
188-
sortId: 'hot',
187+
source: 'kg',
188+
sortId: '5',
189189
tagInfo: {
190190
name: '全部',
191191
id: null,

‎src/renderer/utils/music/bd/songList.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -144,7 +144,7 @@ export default {
144144
this.getListUrl(sortId, tagId, page)
145145
)
146146
return this._requestObj_list.promise.then(({ body }) => {
147-
if (body.error_code !== this.successCode) return this.getSongList(sortId, tagId, page)
147+
if (body.error_code !== this.successCode) return this.getList(sortId, tagId, page)
148148
return {
149149
list: this.filterList(body.diyInfo),
150150
total: body.nums,

‎src/renderer/utils/music/kg/songList.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -231,7 +231,7 @@ export default {
231231
return info
232232
})
233233
)
234-
if (!tagId) tasks.push(this.getSongListRecommend()) // 如果是所有类别，则顺便获取推荐列表
234+
if (!tagId && page === 1) tasks.push(this.getSongListRecommend()) // 如果是所有类别，则顺便获取推荐列表
235235
return Promise.all(tasks).then(([list, info, recommendList]) => {
236236
if (recommendList) list.unshift(...recommendList)
237237
return {

0 commit comments

Comments
 (0)