github
/
lx-music-desktop
mirror of https://github.com/lyswhut/lx-music-desktop
1
0
Fork 0
Code Issues Releases Wiki Activity

新增在列表可选内容区域鼠标右击时自动复制列表已选文字的功能

pull/166/head
lyswhut 2020-02-10 17:25:07 +08:00
parent b4ee1ade2d
commit 4896c4dda5
4 changed files with 68 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
publish/changeLog.md
View File

@ -1,6 +1,7 @@
### 新增
- 允许选中列表内歌曲名、歌手名、专辑名内的文字，选中后可使用键盘快捷键进行复制
- 新增在列表可选内容区域鼠标右击时自动复制列表已选文字的功能
- 任务下载失败时将显示搜索按钮，方便在其他源搜索该歌曲
### 优化

25
src/renderer/components/material/SongList.vue
View File

@ -16,7 +16,7 @@ div(:class="$style.songList")
th.nobreak(style="width: 10%;") 时长
div.scroll(:class="$style.tbody" ref="dom_scrollContent")
table
tbody
tbody(@contextmenu="handleContextMenu")
tr(v-for='(item, index) in list' :key='item.songmid' @click="handleDoubleClick($event, index)")
td.nobreak.center(style="width: 37px;" @click.stop)
material-checkbox(:id="index.toString()" v-model="selectdList" @change="handleChangeSelect" :value="item")
@ -37,7 +37,8 @@ div(:class="$style.songList")
//- 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)') ＋
td(style="width: 10%;") {{item.interval || '--/--'}}
td(style="width: 10%;")
span(:class="$style.time") {{item.interval || '--/--'}}
div(:class="$style.pagination")
material-pagination(:count="total" :limit="limit" :page="page" @btn-click="handleTogglePage")
div(v-else :class="$style.noitem")
@ -47,7 +48,7 @@ div(:class="$style.songList")
<script>
import { mapGetters } from 'vuex'
import { scrollTo } from '../../utils'
import { scrollTo, clipboardWriteText } from '../../utils'
export default {
name: 'MaterialSongList',
model: {
@ -171,6 +172,18 @@ export default {
handleChangeSelect() {
this.$emit('input', [...this.selectdList])
},
handleContextMenu(event) {
if (!event.target.classList.contains('select')) return
let classList = this.$refs.dom_scrollContent.classList
classList.add(this.$style.copying)
window.requestAnimationFrame(() => {
let str = window.getSelection().toString()
classList.remove(this.$style.copying)
str = str.trim()
if (!str.length) return
clipboardWriteText(str)
})
},
},
}
</script>
@ -207,6 +220,12 @@ export default {
:global(.badge) {
opacity: .85;
}
&.copying {
.labelSource, .time {
display: none;
}
}
}
.pagination {
text-align: center;

26
src/renderer/views/List.vue
View File

@ -16,7 +16,7 @@
th.nobreak(style="width: 10%;") 时长
div.scroll(:class="$style.tbody" @scroll="handleScroll" ref="dom_scrollContent")
table
tbody
tbody(@contextmenu="handleContextMenu")
tr(v-for='(item, index) in list' :key='item.songmid' :id="'mid_' + item.songmid"
@click="handleDoubleClick($event, index)" :class="[isPlayList && playIndex === index ? $style.active : '', (isAPITemp && item.source != 'kw') ? $style.disabled : '']")
td.nobreak.center(style="width: 37px;" @click.stop)
@ -39,7 +39,8 @@
//- button.btn-secondary(type='button' v-if="item._types['128k'] || item._types['192k'] || item._types['320k']" @click.stop='testPlay(index)') 试听
//- button.btn-secondary(type='button' @click.stop='handleRemove(index)') 删除
//- 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 || '--/--'}}
td(style="width: 10%;")
span(:class="$style.time") {{item.interval || '--/--'}}
div(:class="$style.noItem" v-else)
p(v-text="list.length ? '加载中...' : '列表竟然是空的...'")
material-download-modal(:show="isShowDownload" :musicInfo="musicInfo" @select="handleAddDownload" @close="isShowDownload = false")
@ -51,7 +52,7 @@
<script>
import { mapMutations, mapGetters, mapActions } from 'vuex'
import { throttle, asyncSetArray, scrollTo } from '../utils'
import { throttle, asyncSetArray, scrollTo, clipboardWriteText } from '../utils'
export default {
name: 'List',
data() {
@ -327,6 +328,19 @@ export default {
// handleScroll(e) {
// console.log(e.target.scrollTop)
// },
handleContextMenu(event) {
if (!event.target.classList.contains('select')) return
let classList = this.$refs.dom_scrollContent.classList
classList.add(this.$style.copying)
window.requestAnimationFrame(() => {
let str = window.getSelection().toString()
classList.remove(this.$style.copying)
str = str.trim()
if (!str.length) return
console.log(str)
clipboardWriteText(str)
})
},
},
}
</script>
@ -371,6 +385,12 @@ export default {
color: @color-theme;
}
}
&.copying {
.labelSource, .time {
display: none;
}
}
}
.labelSource {

25
src/renderer/views/Search.vue
View File

@ -18,7 +18,7 @@
th.nobreak(style="width: 10%;") 时长
div.scroll(:class="$style.tbody" ref="dom_scrollContent")
table
tbody
tbody(@contextmenu="handleContextMenu")
tr(v-for='(item, index) in listInfo.list' :key='item.songmid' @click="handleDoubleClick($event, index)")
td.nobreak.center(style="width: 37px;" @click.stop)
material-checkbox(:id="index.toString()" v-model="selectdData" :value="item")
@ -36,7 +36,8 @@
:play-btn="item.source == 'kw' || !isAPITemp"
:download-btn="item.source == 'kw' || !isAPITemp"
@btn-click="handleListBtnClick")
td(style="width: 10%;") {{item.interval || '--/--'}}
td(style="width: 10%;")
span(:class="$style.time") {{item.interval || '--/--'}}
div(:class="$style.pagination")
material-pagination(:count="listInfo.total" :limit="listInfo.limit" :page="page" @btn-click="handleTogglePage")
div(v-else :class="$style.noitem")
@ -50,7 +51,7 @@
<script>
import { mapGetters, mapActions, mapMutations } from 'vuex'
import { scrollTo } from '../utils'
import { scrollTo, clipboardWriteText } from '../utils'
// import music from '../utils/music'
export default {
name: 'Search',
@ -248,6 +249,18 @@ export default {
if (isSelect) this.resetSelect()
this.isShowListAddMultiple = false
},
handleContextMenu(event) {
if (!event.target.classList.contains('select')) return
let classList = this.$refs.dom_scrollContent.classList
classList.add(this.$style.copying)
window.requestAnimationFrame(() => {
let str = window.getSelection().toString()
classList.remove(this.$style.copying)
str = str.trim()
if (!str.length) return
clipboardWriteText(str)
})
},
},
}
</script>
@ -288,6 +301,12 @@ export default {
:global(.badge) {
opacity: .85;
}
&.copying {
.labelSource, .time {
display: none;
}
}
}
.listBtn {
min-height: 24px;