From 867ae2991c2579165b015ec28bd62a61bcdc5547 Mon Sep 17 00:00:00 2001 From: lyswhut Date: Thu, 30 Jan 2020 11:54:04 +0800 Subject: [PATCH] =?UTF-8?q?=E5=85=81=E8=AE=B8=E9=80=89=E4=B8=AD=E5=88=97?= =?UTF-8?q?=E8=A1=A8=E5=86=85=E7=9A=84=E9=83=A8=E5=88=86=E6=96=87=E5=AD=97?= =?UTF-8?q?=EF=BC=8C=E4=BC=98=E5=8C=96=E7=95=8C=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- publish/changeLog.md | 9 +++++++ .../assets/images/{hzwbg.jpeg => myzcbg.jpeg} | Bin src/renderer/assets/styles/index.less | 19 +++++++++++++-- src/renderer/assets/styles/variables.less | 10 ++++---- src/renderer/components/core/Player.vue | 4 ++-- src/renderer/components/material/SongList.vue | 22 ++++++++---------- src/renderer/utils/request.js | 10 ++++---- src/renderer/views/Download.vue | 9 ++++--- src/renderer/views/List.vue | 13 +++++++---- src/renderer/views/Search.vue | 21 +++++++---------- 10 files changed, 71 insertions(+), 46 deletions(-) rename src/renderer/assets/images/{hzwbg.jpeg => myzcbg.jpeg} (100%) diff --git a/publish/changeLog.md b/publish/changeLog.md index c91825e4..ec2ef7e9 100644 --- a/publish/changeLog.md +++ b/publish/changeLog.md @@ -1,3 +1,12 @@ +### 新增 + +- 允许选中列表内歌曲名、歌手名、专辑名内的文字，选中后可使用键盘快捷键进行复制 + +### 优化 + +- 优化木叶之村主题翻页器背景颜色 +- 优化其他一些界面细节 + ### 修复 - 修复启用透明窗口鼠标不穿透的bug diff --git a/src/renderer/assets/images/hzwbg.jpeg b/src/renderer/assets/images/myzcbg.jpeg similarity index 100% rename from src/renderer/assets/images/hzwbg.jpeg rename to src/renderer/assets/images/myzcbg.jpeg diff --git a/src/renderer/assets/styles/index.less b/src/renderer/assets/styles/index.less index febfbdd8..b2c5944d 100644 --- a/src/renderer/assets/styles/index.less +++ b/src/renderer/assets/styles/index.less @@ -20,6 +20,13 @@ word-break: break-all; } +.select { + user-select: text; +} +.no-select { + user-select: none; +} + table { width: 100%; border-spacing: 0; @@ -50,7 +57,7 @@ table { position: relative; transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1); font-size: 13px; - line-height: 1.3; + line-height: 1.4; vertical-align: middle; } } @@ -129,6 +136,10 @@ input, textarea { color: @color-theme_2-font-label; } } +::selection { + color: @color-theme_2; + background: @color-btn; +} .hover, a { cursor: pointer; @@ -206,7 +217,11 @@ each(@themes, { color: ~'@{color-@{value}-theme_2-font-label}'; } } - + ::selection { + color: ~'@{color-@{value}-theme_2}'; + background: ~'@{color-@{value}-btn}'; + } + .badge { &.badge-theme-success { color: ~'@{color-@{value}-badge-success-font}'; diff --git a/src/renderer/assets/styles/variables.less b/src/renderer/assets/styles/variables.less index 8f46ee1f..20c9faca 100644 --- a/src/renderer/assets/styles/variables.less +++ b/src/renderer/assets/styles/variables.less @@ -61,7 +61,7 @@ @color-green-badge-success-font: #fff; @color-green-badge-info: #4baed5; @color-green-badge-info-font: #fff; -@color-badge-success: #32bc63; +@color-badge-success: @color-theme; @color-badge-success-font: #fff; @color-badge-info: #4baed5; @color-badge-info-font: #fff; @@ -463,7 +463,7 @@ @color-midAutumn-badge-info-font: #fff; @color-dhHyrz-theme: rgb(87, 144, 167); -@color-dhHyrz-theme-bgimg: url(../images/hzwbg.jpeg); +@color-dhHyrz-theme-bgimg: url(../images/myzcbg.jpeg); @color-dhHyrz-theme-bgposition: center; @color-dhHyrz-theme-bgsize: auto 100%; @color-dhHyrz-theme-hover: fadeout(lighten(@color-dhHyrz-theme, 10%), 45%); @@ -481,10 +481,10 @@ @color-dhHyrz-theme-sidebar: rgba(255, 255, 255, .3); @color-dhHyrz-btn: fadeout(darken(@color-dhHyrz-theme, 5%), 15%); @color-dhHyrz-btn-background: fadeout(lighten(@color-dhHyrz-theme, 35%), 70%); -@color-dhHyrz-pagination-background: fadeout(lighten(@color-dhHyrz-theme, 45%), 50%); -@color-dhHyrz-pagination-hover: fadeout(lighten(@color-dhHyrz-theme, 10%), 70%); +@color-dhHyrz-pagination-background: fadeout(lighten(@color-dhHyrz-theme, 15%), 60%); +@color-dhHyrz-pagination-hover: fadeout(lighten(@color-dhHyrz-theme, 10%), 60%); @color-dhHyrz-pagination-active: fadeout(darken(@color-dhHyrz-theme, 10%), 70%); -@color-dhHyrz-pagination-select: fadeout(lighten(@color-dhHyrz-theme, 10%), 55%); +@color-dhHyrz-pagination-select: fadeout(lighten(@color-dhHyrz-theme, 10%), 50%); @color-dhHyrz-search-form-background: fadeout(lighten(@color-dhHyrz-theme, 30%), 20%); @color-dhHyrz-search-list-hover: fadeout(darken(@color-dhHyrz-theme, 10%), 50%); @color-dhHyrz-scrollbar-track: fadeout(@color-dhHyrz-theme, 80%); diff --git a/src/renderer/components/core/Player.vue b/src/renderer/components/core/Player.vue index 13ca8676..e53f9392 100644 --- a/src/renderer/components/core/Player.vue +++ b/src/renderer/components/core/Player.vue @@ -588,7 +588,7 @@ export default { } } .left { - width: @height-player; + width: @height-player - 2; color: @color-theme; transition: @transition-theme; transition-property: color; @@ -617,7 +617,7 @@ export default { .right { flex: auto; // margin-left: 10px; - padding: 5px 10px; + padding: 5px 10px 5px 8px; display: flex; flex-flow: column nowrap; } diff --git a/src/renderer/components/material/SongList.vue b/src/renderer/components/material/SongList.vue index 0a1e7fd1..bdd30f4f 100644 --- a/src/renderer/components/material/SongList.vue +++ b/src/renderer/components/material/SongList.vue @@ -17,15 +17,17 @@ div(:class="$style.songList") div.scroll(:class="$style.tbody" ref="dom_scrollContent") table tbody - tr(v-for='(item, index) in list' :key='item.songmid' @click="handleDoubleClick(index)") + 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") td.break(style="width: 25%;") - | {{item.name}} + span.select {{item.name}} span.badge.badge-theme-info(v-if="!(item._types.ape || item._types.flac) && item._types['320k']") 高品质 span.badge.badge-theme-success(v-if="item._types.ape || item._types.flac") 无损 - td.break(style="width: 20%;") {{item.singer}} - td.break(style="width: 20%;") {{item.albumName}} + td.break(style="width: 20%;") + span.select {{item.singer}} + td.break(style="width: 20%;") + span.select {{item.albumName}} td(style="width: 20%; padding-left: 0; padding-right: 0;") material-list-buttons(:index="index" :search-btn="true" :remove-btn="false" @btn-click="handleListBtnClick" @@ -131,7 +133,9 @@ export default { } }, methods: { - handleDoubleClick(index) { + handleDoubleClick(event, index) { + if (event.target.classList.contains('select')) return + if ( window.performance.now() - this.clickTime > 400 || this.clickIndex !== index @@ -197,13 +201,7 @@ export default { td { font-size: 12px; :global(.badge) { - margin-right: 3px; - &:first-child { - margin-left: 3px; - } - &:last-child { - margin-right: 0; - } + margin-left: 3px; } } :global(.badge) { diff --git a/src/renderer/utils/request.js b/src/renderer/utils/request.js index 4fecad68..164b14ba 100644 --- a/src/renderer/utils/request.js +++ b/src/renderer/utils/request.js @@ -27,7 +27,7 @@ const buildHttpPromose = (url, options) => { requestObj = fetchData(url, options.method, options, (err, resp, body) => { // options.isShowProgress && window.api.hideProgress() debugRequest && console.log(`\n---response------${url}------------`) - debugRequest && console.log(JSON.stringify(body)) + debugRequest && console.log(body) requestObj = null cancelFn = null if (err) { @@ -112,7 +112,7 @@ export const http = (url, options, cb) => { return fetchData(url, options.method, options, (err, resp, body) => { // options.isShowProgress && window.api.hideProgress() debugRequest && console.log(`\n---response------${url}------------`) - debugRequest && console.log(JSON.stringify(body)) + debugRequest && console.log(body) if (err) { debugRequest && console.log(JSON.stringify(err)) } @@ -141,7 +141,7 @@ export const httpGet = (url, options, callback) => { return fetchData(url, 'get', options, function(err, resp, body) { // options.isShowProgress && window.api.hideProgress() debugRequest && console.log(`\n---response------${url}------------`) - debugRequest && console.log(JSON.stringify(body)) + debugRequest && console.log(body) if (err) { debugRequest && console.log(JSON.stringify(err)) } @@ -172,7 +172,7 @@ export const httpPost = (url, data, options, callback) => { return fetchData(url, 'post', options, function(err, resp, body) { // options.isShowProgress && window.api.hideProgress() debugRequest && console.log(`\n---response------${url}------------`) - debugRequest && console.log(JSON.stringify(body)) + debugRequest && console.log(body) if (err) { debugRequest && console.log(JSON.stringify(err)) } @@ -209,7 +209,7 @@ export const http_jsonp = (url, options, callback) => { return fetchData(url, 'get', options, function(err, resp, body) { // options.isShowProgress && window.api.hideProgress() debugRequest && console.log(`\n---response------${url}------------`) - debugRequest && console.log(JSON.stringify(body)) + debugRequest && console.log(body) if (err) { debugRequest && console.log(JSON.stringify(err)) } else { diff --git a/src/renderer/views/Download.vue b/src/renderer/views/Download.vue index 23aad5ee..b7b98fd2 100644 --- a/src/renderer/views/Download.vue +++ b/src/renderer/views/Download.vue @@ -19,10 +19,11 @@ div(:class="$style.download") div.scroll(v-if="list.length" :class="$style.tbody") table tbody - tr(v-for='(item, index) in showList' :key='item.key' @click="handleDoubleClick(index)" :class="playListIndex === index ? $style.active : ''") + tr(v-for='(item, index) in showList' :key='item.key' @click="handleDoubleClick($event, index)" :class="playListIndex === index ? $style.active : ''") td.nobreak.center(style="width: 37px;" @click.stop) material-checkbox(:id="index.toString()" v-model="selectdData" :value="item") - td.break(style="width: 28%;") {{item.musicInfo.name}} - {{item.musicInfo.singer}} + td.break(style="width: 28%;") + span.select {{item.musicInfo.name}} - {{item.musicInfo.singer}} td.break(style="width: 22%;") {{item.progress.progress}}% td.break(style="width: 15%;") {{item.statusText}} td.break(style="width: 10%;") {{item.type && item.type.toUpperCase()}} @@ -133,7 +134,9 @@ export default { let dl = this.dls[info.key] dl ? dl.start() : this.startTask(info) }, - handleDoubleClick(index) { + handleDoubleClick(event, index) { + if (event.target.classList.contains('select')) return + if ( window.performance.now() - this.clickTime > 400 || this.clickIndex !== index diff --git a/src/renderer/views/List.vue b/src/renderer/views/List.vue index 4d248520..033bed89 100644 --- a/src/renderer/views/List.vue +++ b/src/renderer/views/List.vue @@ -18,19 +18,21 @@ table tbody tr(v-for='(item, index) in list' :key='item.songmid' :id="'mid_' + item.songmid" - @click="handleDoubleClick(index)" :class="[isPlayList && playIndex === index ? $style.active : '', (isAPITemp && item.source != 'kw') ? $style.disabled : '']") + @click="handleDoubleClick($event, index)" :class="[isPlayList && playIndex === index ? $style.active : '', (isAPITemp && item.source != 'kw') ? $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}} + span.select {{item.name}} span(:class="$style.labelSource" v-if="isShowSource") {{item.source}} //- span.badge.badge-light(v-if="item._types['128k']") 128K //- span.badge.badge-light(v-if="item._types['192k']") 192K //- span.badge.badge-secondary(v-if="item._types['320k']") 320K //- span.badge.badge-theme-info(v-if="item._types.ape") APE //- span.badge.badge-theme-success(v-if="item._types.flac") FLAC - td.break(style="width: 20%;") {{item.singer}} - td.break(style="width: 20%;") {{item.albumName}} + td.break(style="width: 20%;") + span.select {{item.singer}} + td.break(style="width: 20%;") + span.select {{item.albumName}} td(style="width: 20%; padding-left: 0; padding-right: 0;") material-list-buttons(:index="index" @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)') 下载 @@ -229,7 +231,8 @@ export default { }) }) }, - handleDoubleClick(index) { + handleDoubleClick(event, index) { + if (event.target.classList.contains('select')) return if ( window.performance.now() - this.clickTime > 400 || this.clickIndex !== index diff --git a/src/renderer/views/Search.vue b/src/renderer/views/Search.vue index c184fb1b..17cc9a94 100644 --- a/src/renderer/views/Search.vue +++ b/src/renderer/views/Search.vue @@ -19,16 +19,18 @@ div.scroll(:class="$style.tbody" ref="dom_scrollContent") table tbody - tr(v-for='(item, index) in listInfo.list' :key='item.songmid' @click="handleDoubleClick(index)") + 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") td.break(style="width: 25%;") - | {{item.name}} + span.select {{item.name}} span.badge.badge-theme-info(v-if="!(item._types.ape || item._types.flac) && item._types['320k']") 高品质 span.badge.badge-theme-success(v-if="item._types.ape || item._types.flac") 无损 span(:class="$style.labelSource" v-if="searchSourceId == 'all'") {{item.source}} - td.break(style="width: 20%;") {{item.singer}} - td.break(style="width: 25%;") {{item.albumName}} + td.break(style="width: 20%;") + span.select {{item.singer}} + td.break(style="width: 25%;") + span.select {{item.albumName}} td(style="width: 15%; padding-left: 0; padding-right: 0;") material-list-buttons(:index="index" :remove-btn="false" :class="$style.listBtn" :play-btn="item.source == 'kw' || !isAPITemp" @@ -152,7 +154,8 @@ export default { }) }) }, - handleDoubleClick(index) { + handleDoubleClick(event, index) { + if (event.target.classList.contains('select')) return if ( window.performance.now() - this.clickTime > 400 || this.clickIndex !== index @@ -279,13 +282,7 @@ export default { td { font-size: 12px; :global(.badge) { - margin-right: 3px; - &:first-child { - margin-left: 3px; - } - &:last-child { - margin-right: 0; - } + margin-left: 3px; } } :global(.badge) {