优化列表加载体验,移除失效源
parent
22d56d31a9
commit
67ff5e5a4a
|
@ -7,8 +7,12 @@
|
|||
### 优化
|
||||
|
||||
- 略微优化最小化按钮字符
|
||||
- 优化试听列表的加载体验,当歌曲数过多时列表将延迟加载
|
||||
|
||||
### 修复
|
||||
|
||||
- 修复下载管理的一些Bug
|
||||
|
||||
### 移除
|
||||
|
||||
- 因接口失效,移除网易云音源,酷狗音源仅支持播放128k音质
|
||||
|
|
|
@ -105,8 +105,8 @@ each(@themes, {
|
|||
content: ' ';
|
||||
display: block;
|
||||
border-radius: 50%;
|
||||
width: 13px;
|
||||
height: 13px;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
transition: background-color 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
|
@ -145,7 +145,7 @@ each(@themes, {
|
|||
width: 8px;
|
||||
height: 2px;
|
||||
left: @height-toolbar / 2 - 4;
|
||||
top: @height-toolbar / 2;
|
||||
top: @height-toolbar / 2 - 1;
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -5,7 +5,7 @@ material-modal(:show="show" :bg-close="bgClose" @close="handleClose")
|
|||
| {{ info.name }}
|
||||
br
|
||||
| {{ info.singer }}
|
||||
material-btn(:class="$style.btn" :title="!checkSource(type.type) && '目前网易云音源仅支持下载128k音质'" :disabled="!checkSource(type.type)" :key="type.type" @click="handleClick(type.type)" v-for="type in info.types") {{getTypeName(type.type)}} {{ type.type.toUpperCase() }}{{ type.size && ` - ${type.size.toUpperCase()}` }}
|
||||
material-btn(:class="$style.btn" :title="!checkSource(type.type) && '目前酷狗音源仅支持下载128k音质'" :disabled="!checkSource(type.type)" :key="type.type" @click="handleClick(type.type)" v-for="type in info.types") {{getTypeName(type.type)}} {{ type.type.toUpperCase() }}{{ type.size && ` - ${type.size.toUpperCase()}` }}
|
||||
|
||||
</template>
|
||||
|
||||
|
@ -52,7 +52,7 @@ export default {
|
|||
checkSource(type) {
|
||||
switch (this.musicInfo.source) {
|
||||
case 'wy':
|
||||
// case 'kg':
|
||||
case 'kg':
|
||||
return type == '128k'
|
||||
|
||||
default:
|
||||
|
|
|
@ -27,7 +27,7 @@ div(:class="$style.songList")
|
|||
td.break(style="width: 20%;") {{item.singer}}
|
||||
td.break(style="width: 22%;") {{item.albumName}}
|
||||
td(style="width: 18%;")
|
||||
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")
|
||||
material-list-buttons(:index="index" :search-btn="true" :play-btn="item.source == 'kw' || (!isAPITemp && item.source != 'tx' && item.source != 'wy')" :download-btn="item.source == 'kw' || (!isAPITemp && item.source != 'tx' && item.source != 'wy')" :remove-btn="false" @btn-click="handleListBtnClick")
|
||||
//- button.btn-info(type='button' v-if="item._types['128k'] || item._types['192k'] || item._types['320k'] || item._types.flac" @click.stop='openDownloadModal(index)') 下载
|
||||
//- button.btn-secondary(type='button' v-if="item._types['128k'] || item._types['192k'] || item._types['320k']" @click.stop='testPlay(index)') 试听
|
||||
//- button.btn-success(type='button' v-if="(item._types['128k'] || item._types['192k'] || item._types['320k']) && userInfo" @click.stop='showListModal(index)') +
|
||||
|
@ -136,7 +136,7 @@ export default {
|
|||
this.clickIndex = index
|
||||
return
|
||||
}
|
||||
this.emitEvent((this.source == 'kw' || (!this.isAPITemp && this.list[index].source != 'tx')) ? 'testPlay' : 'search', index)
|
||||
this.emitEvent((this.source == 'kw' || (!this.isAPITemp && this.list[index].source != 'tx' && this.list[index].source != 'wy')) ? 'testPlay' : 'search', index)
|
||||
this.clickTime = 0
|
||||
this.clickIndex = -1
|
||||
},
|
||||
|
|
|
@ -7,7 +7,7 @@
|
|||
const types = ['flac', 'ape', '320k', '192k', '128k']
|
||||
export const getMusicType = (info, type) => {
|
||||
switch (window.globalObj.apiSource) {
|
||||
// case 'kg':
|
||||
case 'kg':
|
||||
case 'wy':
|
||||
return '128k'
|
||||
}
|
||||
|
|
|
@ -117,7 +117,7 @@ export default {
|
|||
},
|
||||
handleAddDownloadMultiple(type) {
|
||||
switch (this.source) {
|
||||
// case 'kg':
|
||||
case 'kg':
|
||||
case 'wy':
|
||||
type = '128k'
|
||||
}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<template lang="pug">
|
||||
div(:class="$style.list")
|
||||
//- transition
|
||||
div(v-if="list.length" :class="$style.content")
|
||||
div(v-if="delayShow && list.length" :class="$style.content")
|
||||
div(:class="$style.thead")
|
||||
table
|
||||
thead
|
||||
|
@ -18,7 +18,7 @@
|
|||
table
|
||||
tbody
|
||||
tr(v-for='(item, index) in list' :key='item.songmid'
|
||||
@click="handleDoubleClick(index)" :class="[isPlayList && playIndex === index ? $style.active : '', (isAPITemp && item.source != 'kw') || item.source == 'tx' ? $style.disabled : '']")
|
||||
@click="handleDoubleClick(index)" :class="[isPlayList && playIndex === index ? $style.active : '', (isAPITemp && item.source != 'kw') || item.source == 'tx' || item.source == 'wy' ? $style.disabled : '']")
|
||||
td.nobreak.center(style="width: 37px;" @click.stop)
|
||||
material-checkbox(:id="index.toString()" v-model="selectdData" :value="item")
|
||||
td.break(style="width: 25%;") {{item.name}}
|
||||
|
@ -37,6 +37,7 @@
|
|||
//- button.btn-success(type='button' v-if="(item._types['128k'] || item._types['192k'] || item._types['320k']) && userInfo" @click.stop='showListModal(index)') +
|
||||
td(style="width: 10%;") {{item.interval || '--/--'}}
|
||||
div(:class="$style.noItem" v-else)
|
||||
p 加载中...
|
||||
material-download-modal(:show="isShowDownload" :musicInfo="musicInfo" @select="handleAddDownload" @close="isShowDownload = false")
|
||||
material-download-multiple-modal(:show="isShowDownloadMultiple" :list="selectdData" @select="handleAddDownloadMultiple" @close="isShowDownloadMultiple = false")
|
||||
material-flow-btn(:show="isShowEditBtn" :add-btn="false" :play-btn="false" @btn-click="handleFlowBtnClick")
|
||||
|
@ -57,6 +58,7 @@ export default {
|
|||
isIndeterminate: false,
|
||||
isShowEditBtn: false,
|
||||
isShowDownloadMultiple: false,
|
||||
delayShow: false,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
@ -119,6 +121,11 @@ export default {
|
|||
// this.handleSearch(this.text, this.page)
|
||||
// }
|
||||
// },
|
||||
mounted() {
|
||||
if (this.list.length > 150) {
|
||||
setTimeout(() => this.delayShow = true, 200)
|
||||
} else this.delayShow = true
|
||||
},
|
||||
methods: {
|
||||
...mapMutations('list', ['defaultListRemove', 'defaultListRemoveMultiple']),
|
||||
...mapActions('download', ['createDownload', 'createDownloadMultiple']),
|
||||
|
@ -137,7 +144,7 @@ export default {
|
|||
this.clickIndex = -1
|
||||
},
|
||||
testPlay(index) {
|
||||
if ((this.isAPITemp && this.list[index].source != 'kw') || this.list[index].source == 'tx') return
|
||||
if ((this.isAPITemp && this.list[index].source != 'kw') || this.list[index].source == 'tx' || this.list[index].source == 'wy') return
|
||||
this.setList({ list: this.list, listId: 'test', index })
|
||||
},
|
||||
handleRemove(index) {
|
||||
|
@ -147,7 +154,7 @@ export default {
|
|||
switch (info.action) {
|
||||
case 'download':
|
||||
const minfo = this.list[info.index]
|
||||
if ((this.isAPITemp && minfo.source != 'kw') || minfo.source == 'tx') return
|
||||
if ((this.isAPITemp && minfo.source != 'kw') || minfo.source == 'tx' || minfo.source == 'wy') return
|
||||
this.musicInfo = minfo
|
||||
this.$nextTick(() => {
|
||||
this.isShowDownload = true
|
||||
|
@ -173,7 +180,7 @@ export default {
|
|||
this.selectdData = []
|
||||
},
|
||||
handleAddDownloadMultiple(type) {
|
||||
const list = this.setting.apiSource == 'temp' ? this.selectdData.filter(s => s.source == 'kw') : this.selectdData.filter(s => s.source != 'tx')
|
||||
const list = this.setting.apiSource == 'temp' ? this.selectdData.filter(s => s.source == 'kw') : this.selectdData.filter(s => s.source != 'tx' && s.source != 'wy')
|
||||
this.createDownloadMultiple({ list, type })
|
||||
this.resetSelect()
|
||||
this.isShowDownloadMultiple = false
|
||||
|
@ -239,6 +246,20 @@ export default {
|
|||
opacity: .5;
|
||||
}
|
||||
|
||||
.no-item {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
p {
|
||||
font-size: 24px;
|
||||
color: #ccc;
|
||||
}
|
||||
}
|
||||
|
||||
each(@themes, {
|
||||
:global(#container.@{value}) {
|
||||
.tbody {
|
||||
|
|
|
@ -103,16 +103,6 @@ div.scroll(:class="$style.setting")
|
|||
p.small
|
||||
| 软件的常见问题可转至:
|
||||
span.hover.underline(title="点击打开" @click="handleOpenUrl('https://github.com/lyswhut/lx-music-desktop#常见问题')") 常见问题
|
||||
p.small
|
||||
| 本软件仅用于学习交流使用,禁止将本软件用于
|
||||
strong 非法用途
|
||||
| 或
|
||||
strong 商业用途
|
||||
| 。
|
||||
p.small
|
||||
| 使用本软件造成的一切后果由
|
||||
strong 使用者
|
||||
| 承担!
|
||||
//- p.small
|
||||
| 怀念曾经的
|
||||
strong @messoer
|
||||
|
@ -130,6 +120,16 @@ div.scroll(:class="$style.setting")
|
|||
span 如果你资金充裕,还可以
|
||||
material-btn(@click="handleOpenUrl('https://cdn.stsky.cn/qrc.png')" min title="土豪,你好 🙂") 打赏下作者
|
||||
span ,以帮我分担点服务器费用~❤️
|
||||
p.small
|
||||
| 本软件仅用于学习交流使用,禁止将本软件用于
|
||||
strong 非法用途
|
||||
| 或
|
||||
strong 商业用途
|
||||
| 。
|
||||
p.small
|
||||
| 使用本软件造成的一切后果由
|
||||
strong 使用者
|
||||
| 承担!
|
||||
p
|
||||
small By:
|
||||
| 落雪无痕
|
||||
|
|
|
@ -191,7 +191,7 @@ export default {
|
|||
},
|
||||
handleAddDownloadMultiple(type) {
|
||||
switch (this.source) {
|
||||
// case 'kg':
|
||||
case 'kg':
|
||||
case 'wy':
|
||||
type = '128k'
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue