From a25ef6e2a0977da487940f3131d195f64203415b Mon Sep 17 00:00:00 2001 From: lyswhut Date: Thu, 22 Oct 2020 21:00:12 +0800 Subject: [PATCH 01/14] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=92=AD=E6=94=BE?= =?UTF-8?q?=E8=AF=A6=E6=83=85=E9=A1=B5=E7=9A=84=E6=AD=8C=E6=9B=B2=E5=9B=BE?= =?UTF-8?q?=E7=89=87=E7=9A=84=E6=98=BE=E7=A4=BA=E6=95=88=E6=9E=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- publish/changeLog.md | 5 +++-- src/renderer/components/core/PlayerDetail.vue | 8 ++++++-- 2 files changed, 9 insertions(+), 4 deletions(-) diff --git a/publish/changeLog.md b/publish/changeLog.md index 3390a8ac..dffcaabf 100644 --- a/publish/changeLog.md +++ b/publish/changeLog.md @@ -1,3 +1,4 @@ -### 修复 +### 优化 + +- 修改播放详情页的歌曲图片的显示效果 -- 降级 Electron 到 9.x.x 版本修复 Linux 版桌面歌词窗口变白的问题 diff --git a/src/renderer/components/core/PlayerDetail.vue b/src/renderer/components/core/PlayerDetail.vue index c085d7c3..3004125b 100644 --- a/src/renderer/components/core/PlayerDetail.vue +++ b/src/renderer/components/core/PlayerDetail.vue @@ -472,7 +472,10 @@ export default { img { max-width: 100%; max-height: 100%; - border: 5px solid @color-theme-hover; + box-shadow: 0 0 4px @color-theme-hover; + border-radius: 6px; + opacity: .8; + // border: 5px solid @color-theme-hover; // border-radius: @radius-border; // border: 5px solid #fff; } @@ -687,7 +690,8 @@ each(@themes, { } .img { img { - border-color: ~'@{color-@{value}-theme-hover}'; + box-shadow: 0 0 4px ~'@{color-@{value}-theme-hover}'; + // border-color: ~'@{color-@{value}-theme-hover}'; } } .lrc-active { From aa948b0149b5d8f9d3e4577524ae1a89a48fb85c Mon Sep 17 00:00:00 2001 From: lyswhut Date: Fri, 23 Oct 2020 22:40:23 +0800 Subject: [PATCH 02/14] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E8=AF=84=E8=AE=BA?= =?UTF-8?q?=E7=95=8C=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/renderer/assets/images/defaultUser.jpg | Bin 0 -> 4394 bytes src/renderer/assets/styles/variables.less | 15 ++ src/renderer/components/core/PlayerDetail.vue | 248 +++++++++++++++--- .../components/material/CommentFloor.vue | 130 +++++++++ 4 files changed, 355 insertions(+), 38 deletions(-) create mode 100644 src/renderer/assets/images/defaultUser.jpg create mode 100644 src/renderer/components/material/CommentFloor.vue diff --git a/src/renderer/assets/images/defaultUser.jpg b/src/renderer/assets/images/defaultUser.jpg new file mode 100644 index 0000000000000000000000000000000000000000..51d5929d296467f607d4622404bfc8be76e236ea GIT binary patch literal 4394 zcmcgud00|u7r$^5atVjhYRV?UMhis*1%+ZH1#`(YP?O3*KyyJ1aIHpZTGXZ*Et|?H zGn*8b(#mqoY^E&3nl`mEwPoDW%+xen%nuY4zsG0(`2P6bhlhLC-#O=f&w1}1eKPtI zn9qn03jqLER}3%{m|UZ80303(m!N|ApQ|b;;HB{aEg*viE(Jun298Uie9CPiVE=XMmY&Z zd=$~j2Fta^<547%72cLeBH=Aj1ZzA2XRZ8^uy|VvkwhWbq0|elj3(lRP<-jm>R3vS zidGjD7Z+z0XJaK4h2rpJGFgQ|AYhdiSaCv>gcFaA5}Rre=zK9(6c#NB6Gov_h@4Wn__9gwRFU3j3=SYMircfBE=>YFdLWxkkNf?cCT1!GL^AC&S3FE}eRmU@4EuAk4 zi{eSWg;emB|iEBOtuHe+L?kAR^_OLm#e17a5jo#bFt52jJNW&P}>n@@Mk z{L^Q@TRwkRKeNu_)Ty$gCe2lKu~`=&Y;mTdSX6MVAiP{8A1`TECc=VE%YUILP8(jF zxhJOw*m$lf{5K>$w6*T(A-GkN{F3zYWSA-YO&s253R`5j2Qzg1O}gWermJsRU{=Fp zrvIJu%paa--xv-&mXgd#9`}YUlh>~%vWmkSADb~4(1Gp$v~bqB26mgRPxmZGeyP3J z4XvAqqa9{`edcDLwYPl;Pa4eVm9--CTtpCi9dVmem)ZK_nw#qzno?k>2~VJNJ`C4k z+J6yI_WRPe)SqI{T*N_ZG-~aJLd0E}zyFv#z%=Hf>*yPKX$W9pHR-d8nIgGe`i`WywpD zP4t>g8<^q`xqpe%Tu5Boxu*S$BkqE}dU&;}f}1c)So0{$rj9jq6!_zI$RZrosqm|x zls}HC-QTU5>BFoTpOANLTM|vOxl@7youA7WbM0ZdvlQvC8hfoKP>L}2Wp8uSx_+VNJudct6vF5bnrG{=pA5IOyVP?V%gFoO zjpxaLkK@jeitE;H$5ydTAN+XwDr-&gr~IT`#Lw>TIwsidvXq;4r~Nbi20@f25}QmU9b~$r{+fZF;``MV0gn7Ao@9PF0Rh(am+u5`~ z{7j*tvOfJ65ah?;uep^ig(I}U&N$J&O!m@Ipdyp-A>$@` zfHZ;%5cAfgBu}IPXpP>ua5u4-5pi^1cn8DX+d$X4khK16PFnrnMZ(Zek>H|egC(Mm zwqN5$UQoZ?&RN6uP2Dq?xuKf{QZVr-_a(dR*QW1v{**j489+&CpV$kjcn>u zt2+Sz{>w$%cRxw`t`9ct9h4USw)n4{i!1M?!ozjAnW#;dgV3OEYn-$<(V ztl~e9H@wgy?>%~4=e_BH&j$_tdU?0|9+b4~#%wV%I3(n`e>~_VtWR9gkOJdvxwot8 zAJ?1?vCmo-bJmW4o8Q{~xo!cbY4A-FD>-sOdnNLYh+1%@rYw6gO;gt7o>*i0+!k2) zCN%E%dMHe2*3EJ;mKSx48XGA*`X8=-^CKf5 z4f4C7)duhC@JqM*DXKpn&C5reUF(>!>v&jCqdMppC7<>@>>vGn!>umps zB|#Q?UkW$&f7);&dlpocOJjj-qBeDnV545@>*E=#EOHXJ-epq~Xl0zw_ukz~vB|nq z;*fv!Z8G+OyUCr%5^AaQo1!g#b>38!qhSoKC+^AAx7$&v0CxL z)wE%Cr9j+NCO?~Nn5>Sa^?+@Ieb3r``+;eabIvP=(kJO;DP>W#iO?H=GQ^qM&6S^Q>dEL z`G+#%yHIfN_~saxIA1(yl)0`N$I-9w)+pQwrEXPbd(EO;EO5XT1?bCOU9<~2c;B6_)h2AC>~pujmQ{>MQpp0 z*%Exd7N4Yd06kDCejftW`l!;v7$aZX>%<*98L_eKt_M#fl5Z`z4|}6JIv7^q=IeXU zxA$SN+#J(Rf0!+bBi|DrZ|fm<$vd!J<=4~~=6?gKcwt=Z+1g-(y?!-a2d;~f=Ee@T zf~TZ*Vc@f&=RNhH$G(q-rl0rYUkvZTxsT|x*y6bI1E(=e7dG|aM zju0Hpwiid%L#}6q2;;lU~G^3~v-y_ng@s8v5#zdB7s`q33V9ph<$z Kt{BMZ)BgayX^m6> literal 0 HcmV?d00001 diff --git a/src/renderer/assets/styles/variables.less b/src/renderer/assets/styles/variables.less index 225eaab4..ba2a8e4f 100644 --- a/src/renderer/assets/styles/variables.less +++ b/src/renderer/assets/styles/variables.less @@ -23,6 +23,7 @@ @color-theme_2-font-label: fadeout(@color-theme_2-font, 50%); // @color-theme_2-line: transparent; @color-theme_2-line: lighten(@color-theme, 35%); +@color-reply-floor: fadeout(@color-theme, 95%); @color-theme-sidebar: @color-theme; @color-btn: lighten(@color-theme, 5%); @color-btn-background: fadeout(lighten(@color-theme, 35%), 70%); @@ -91,6 +92,7 @@ @color-green-theme_2-font-label: fadeout(@color-green-theme_2-font, 50%); // @color-green-theme_2-line: transparent; @color-green-theme_2-line: lighten(@color-green-theme, 45%); +@color-green-reply-floor: lighten(@color-green-theme, 45%); @color-green-theme-sidebar: @color-green-theme; @color-green-btn: lighten(@color-green-theme, 5%); @color-green-btn-background: fadeout(lighten(@color-green-theme, 35%), 70%); @@ -148,6 +150,7 @@ @color-yellow-theme_2-font-label: fadeout(@color-yellow-theme_2-font, 50%); // @color-yellow-theme_2-line: transparent; @color-yellow-theme_2-line: lighten(@color-yellow-theme, 28%); +@color-yellow-reply-floor: lighten(@color-yellow-theme, 28%); @color-yellow-theme-sidebar: @color-yellow-theme; @color-yellow-btn: darken(@color-yellow-theme, 5%); @color-yellow-btn-background: fadeout(lighten(@color-yellow-theme, 25%), 60%); @@ -204,6 +207,7 @@ @color-orange-theme_2-font-label: fadeout(@color-orange-theme_2-font, 50%); // @color-orange-theme_2-line: transparent; @color-orange-theme_2-line: lighten(@color-orange-theme, 36%); +@color-orange-reply-floor: lighten(@color-orange-theme, 36%); @color-orange-theme-sidebar: @color-orange-theme; @color-orange-btn: lighten(@color-orange-theme, 5%); @color-orange-btn-background: fadeout(lighten(@color-orange-theme, 25%), 60%); @@ -260,6 +264,7 @@ @color-blue-theme_2-font-label: fadeout(@color-blue-theme_2-font, 50%); // @color-blue-theme_2-line: transparent; @color-blue-theme_2-line: lighten(@color-blue-theme, 42%); +@color-blue-reply-floor: lighten(@color-blue-theme, 42%); @color-blue-theme-sidebar: @color-blue-theme; @color-blue-btn: lighten(@color-blue-theme, 5%); @color-blue-btn-background: fadeout(lighten(@color-blue-theme, 35%), 50%); @@ -316,6 +321,7 @@ @color-red-theme_2-font-label: fadeout(@color-red-theme_2-font, 50%); // @color-red-theme_2-line: transparent; @color-red-theme_2-line: lighten(@color-red-theme, 42%); +@color-red-reply-floor: lighten(@color-red-theme, 42%); @color-red-theme-sidebar: @color-red-theme; @color-red-btn: lighten(@color-red-theme, 5%); @color-red-btn-background: fadeout(lighten(@color-red-theme, 35%), 70%); @@ -374,6 +380,7 @@ @color-pink-theme_2-font-label: fadeout(@color-pink-theme_2-font, 50%); // @color-pink-theme_2-line: transparent; @color-pink-theme_2-line: lighten(@color-pink-theme, 25%); +@color-pink-reply-floor: lighten(@color-pink-theme, 25%); @color-pink-theme-sidebar: @color-pink-theme; @color-pink-btn: darken(@color-pink-theme, 3%); @color-pink-btn-background: fadeout(lighten(@color-pink-theme, 20%), 50%); @@ -430,6 +437,7 @@ @color-purple-theme_2-font-label: fadeout(@color-purple-theme_2-font, 50%); // @color-purple-theme_2-line: transparent; @color-purple-theme_2-line: lighten(@color-purple-theme, 43%); +@color-purple-reply-floor: lighten(@color-purple-theme, 43%); @color-purple-theme-sidebar: @color-purple-theme; @color-purple-btn: lighten(@color-purple-theme, 5%); @color-purple-btn-background: fadeout(lighten(@color-purple-theme, 35%), 70%); @@ -486,6 +494,7 @@ @color-grey-theme_2-font-label: fadeout(@color-grey-theme_2-font, 50%); // @color-grey-theme_2-line: transparent; @color-grey-theme_2-line: lighten(@color-grey-theme, 47%); +@color-grey-reply-floor: lighten(@color-grey-theme, 47%); @color-grey-theme-sidebar: @color-grey-theme; @color-grey-btn: lighten(@color-grey-theme, 5%); @color-grey-btn-background: fadeout(lighten(@color-grey-theme, 35%), 70%); @@ -543,6 +552,7 @@ @color-ming-theme_2-font-label: fadeout(@color-ming-theme_2-font, 50%); // @color-ming-theme_2-line: transparent; @color-ming-theme_2-line: lighten(@color-ming-theme, 60%); +@color-ming-reply-floor: lighten(@color-ming-theme, 60%); @color-ming-theme-sidebar: @color-ming-theme; @color-ming-btn: lighten(@color-ming-theme, 5%); @color-ming-btn-background: fadeout(lighten(@color-ming-theme, 35%), 75%); @@ -602,6 +612,7 @@ @color-blue2-theme_2-font-label: fadeout(@color-blue2-theme_2-font, 50%); // @color-blue2-theme_2-line: transparent; @color-blue2-theme_2-line: lighten(@color-blue2-theme, 41%); +@color-blue2-reply-floor: lighten(@color-blue2-theme, 41%); @color-blue2-theme-sidebar: @color-blue2-theme; @color-blue2-btn: lighten(@color-blue2-theme, 5%); @color-blue2-btn-background: fadeout(lighten(@color-blue2-theme, 30%), 70%); @@ -659,6 +670,7 @@ @color-mid_autumn-theme_2-font-label: desaturate(lighten(@color-mid_autumn-theme, 30%), 45%); // @color-mid_autumn-theme_2-line: transparent; @color-mid_autumn-theme_2-line: lighten(@color-mid_autumn-theme, 61%); +@color-mid_autumn-reply-floor: lighten(@color-mid_autumn-theme, 61%); @color-mid_autumn-theme-sidebar: rgba(255, 255, 255, 0); @color-mid_autumn-btn: lighten(@color-mid_autumn-theme, 10%); @color-mid_autumn-btn-background: fadeout(lighten(@color-mid_autumn-theme, 35%), 70%); @@ -716,6 +728,7 @@ @color-mid_autumn-theme_2-font-label: desaturate(lighten(@color-mid_autumn-theme, 30%), 45%); // @color-mid_autumn-theme_2-line: transparent; @color-mid_autumn-theme_2-line: darken(@color-mid_autumn-theme, 18%); +@color-mid_autumn-reply-floor: darken(@color-mid_autumn-theme, 18%); @color-mid_autumn-theme-sidebar: rgba(255, 255, 255, 0); @color-mid_autumn-btn: darken(@color-mid_autumn-theme, 10%); @color-mid_autumn-btn-background: fadeout(lighten(@color-mid_autumn-theme, 35%), 70%); @@ -772,6 +785,7 @@ @color-naruto-theme_2-font-label: desaturate(lighten(@color-naruto-theme, 10%), 45%); // @color-naruto-theme_2-line: transparent; @color-naruto-theme_2-line: fadeout(lighten(@color-naruto-theme, 36%), 70%); +@color-naruto-reply-floor: fadeout(lighten(@color-naruto-theme, 36%), 70%); @color-naruto-theme-sidebar: rgba(255, 255, 255, .3); @color-naruto-btn: lighten(@color-naruto-theme, 2%); @color-naruto-btn-background: fadeout(lighten(@color-naruto-theme, 35%), 70%); @@ -828,6 +842,7 @@ @color-happy_new_year-theme_2-font-label: desaturate(darken(@color-happy_new_year-theme, 5%), 50%); // @color-happy_new_year-theme_2-line: transparent; @color-happy_new_year-theme_2-line: fadeout(lighten(@color-happy_new_year-theme, 16%), 70%); +@color-happy_new_year-reply-floor: fadeout(lighten(@color-happy_new_year-theme, 16%), 70%); @color-happy_new_year-theme-sidebar: rgba(119, 37, 18, 0.1); @color-happy_new_year-btn: desaturate(@color-happy_new_year-theme, 10%); @color-happy_new_year-btn-background: fadeout(lighten(@color-happy_new_year-theme, 15%), 60%); diff --git a/src/renderer/components/core/PlayerDetail.vue b/src/renderer/components/core/PlayerDetail.vue index 3004125b..d018c9d8 100644 --- a/src/renderer/components/core/PlayerDetail.vue +++ b/src/renderer/components/core/PlayerDetail.vue @@ -16,23 +16,35 @@ svg(:class="$style.controBtnIcon" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' width='100%' viewBox='0 0 24 24' space='preserve') use(xlink:href='#icon-window-close') - div(:class="$style.main") + div(:class="[$style.main, isShowComment ? $style.showComment : null]") div(:class="$style.left") + //- div(:class="$style.info") div(:class="$style.info") - div(:class="$style.img") - img(:src="musicInfo.img" v-if="musicInfo.img") - div(:class="$style.description") + img(:class="$style.img" :src="musicInfo.img" v-if="musicInfo.img") + div(:class="$style.description" @click="isShowComment = true") p {{$t('core.player.name')}}{{musicInfo.name}} p {{$t('core.player.singer')}}{{musicInfo.singer}} p(v-if="musicInfo.album") {{$t('core.player.album')}}{{musicInfo.album}} - //- div(:class="$style.list") - ul div(:class="$style.right") div(:class="[$style.lyric, lyricEvent.isMsDown ? $style.draging : null]" @wheel="handleWheel" @mousedown="handleLyricMouseDown" ref="dom_lyric") div(:class="$style.lyricSpace") p(v-for="(info, index) in lyricLines" :key="index" :class="lyric.line == index ? $style.lrcActive : null") {{info.text}} div(:class="$style.lyricSpace") + + div(:class="$style.comment") + div(:class="$style.commentHeader" @click="isShowComment = false") + h3 {{title}} + div.scroll(:class="$style.commentMain") + div + h2(:class="$style.commentType") 热门评论 + material-comment-floor(v-if="comment.hotComments.length" :class="$style.reply_floor" :comments="comment.hotComments") + div + h2(:class="$style.commentType") 最新评论 + material-comment-floor(v-if="comment.comments.length" :class="$style.reply_floor" :comments="comment.comments") + div(:class="$style.pagination") + material-pagination(:count="comment.total" :limit="comment.limit" :page="comment.page" @btn-click="handleToggleCommentPage") + div(:class="$style.footer") div(:class="$style.left") div(:class="$style.progressContainer") @@ -205,6 +217,109 @@ export default { _lyricLines: [], lyricLines: [], isSetedLines: false, + isShowComment: false, + comment: { + page: 1, + total: 10, + maxPage: 1, + limit: 5, + comments: [{ + text: ['123123hhh'], + userName: 'dsads', + avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', + time: '2020-10-22 22:14:17', + likedCount: 100, + reply: [ + { + text: ['123123hhh'], + userName: 'dsads', + avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', + time: '2020-10-22 22:14:17', + likedCount: 100, + }, + ], + }, { + text: ['123123hhh'], + userName: 'dsads', + avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', + time: '2020-10-22 22:14:17', + likedCount: 100, + reply: [ + { + text: ['123123hhh'], + userName: 'dsads', + avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', + time: '2020-10-22 22:14:17', + likedCount: 100, + }, + { + text: ['123123hhh'], + userName: 'dsads', + avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', + time: '2020-10-22 22:14:17', + likedCount: 100, + }, + ], + }, { + text: ['123123hhh'], + userName: 'dsads', + avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', + time: '2020-10-22 22:14:17', + likedCount: 100, + reply: [], + }, { + text: ['123123hhh'], + userName: 'dsads', + avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', + time: '2020-10-22 22:14:17', + likedCount: 100, + reply: [], + }, { + text: ['123123hhh'], + userName: 'dsads', + avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', + time: '2020-10-22 22:14:17', + likedCount: 100, + reply: [], + }, { + text: ['123123hhh'], + userName: 'dsads', + avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', + time: '2020-10-22 22:14:17', + likedCount: 100, + reply: [], + }, { + text: ['123123hhh'], + userName: 'dsads', + avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', + time: '2020-10-22 22:14:17', + likedCount: 100, + reply: [], + }, { + text: ['123123hhh'], + userName: 'dsads', + avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', + time: '2020-10-22 22:14:17', + likedCount: 100, + reply: [], + }], + hotComments: [{ + text: ['123123hhh'], + userName: 'dsads', + avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', + time: '2020-10-22 22:14:17', + likedCount: 100, + reply: [ + { + text: ['123123hhh'], + userName: 'dsads', + avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', + time: '2020-10-22 22:14:17', + likedCount: 100, + }, + ], + }], + }, } }, mounted() { @@ -224,6 +339,11 @@ export default { computed: { ...mapGetters(['setting']), ...mapGetters('player', ['isShowPlayerDetail']), + title() { + return this.musicInfo.name + ? this.setting.download.fileName.replace('歌名', this.musicInfo.name).replace('歌手', this.musicInfo.singer) + : '^-^' + }, }, methods: { ...mapMutations('player', [ @@ -325,6 +445,9 @@ export default { close() { window.eventHub.$emit(eventBaseName.close) }, + handleToggleCommentPage(page) { + + }, }, } @@ -452,36 +575,56 @@ export default { overflow: hidden; display: flex; padding: 0 30px; + + &.showComment { + .left { + flex-basis: 18%; + .description p { + font-size: 12px; + } + } + .right { + flex-basis: 30%; + .lyric { + font-size: 13px; + } + } + .comment { + flex-basis: 50%; + opacity: 1; + } + } } .left { - flex: 0 0 40%; - overflow: hidden; -} -.info { + flex: auto; display: flex; flex-flow: column nowrap; align-items: center; + padding: 13px; + overflow: hidden; + transition: flex-basis @transition-theme; +} + +.info { + display: flex; + flex-flow: column nowrap; + justify-content: flex-start; + max-width: 300px; + } .img { - width: 300px; - height: 300px; - display: flex; - justify-content: flex-start; - align-items: center; - - img { - max-width: 100%; - max-height: 100%; - box-shadow: 0 0 4px @color-theme-hover; - border-radius: 6px; - opacity: .8; - // border: 5px solid @color-theme-hover; - // border-radius: @radius-border; - // border: 5px solid #fff; - } + max-width: 100%; + max-height: 100%; + min-width: 100%; + box-shadow: 0 0 4px @color-theme-hover; + border-radius: 6px; + opacity: .8; + // border: 5px solid @color-theme-hover; + // border-radius: @radius-border; + // border: 5px solid #fff; } .description { - width: 300px; + max-width: 300px; padding: 15px 0; overflow: hidden; p { @@ -495,6 +638,8 @@ export default { flex: 0 0 60%; // padding: 0 30px; position: relative; + transition: flex-basis @transition-theme; + &:before { position: absolute; top: 0; @@ -540,19 +685,48 @@ export default { color: @color-theme; font-size: 1.2em; } + +.comment { + flex: 0 0 0; + display: flex; + flex-flow: column nowrap; + transition: @transition-theme; + transition-property: flex-basis opacity; + overflow: hidden; + opacity: 0; + +} +.commentHeader { + flex: none; + padding-bottom: 10px; + // border-bottom: 1px solid #eee; + h3 { + font-size: 14px; + } +} +.commentMain { + flex: auto; + padding-left: 15px; + padding-right: 10px; + background-color: @color-reply-floor; + border-radius: 4px; +} +.commentType { + padding: 10px 0; + font-size: 13px; + color: @color-theme_2-font; +} +.pagination { + padding: 10px 0; +} + .footer { flex: 0 0 100px; overflow: hidden; display: flex; align-items: center; } -.left { - flex: auto; - display: flex; - flex-flow: column nowrap; - align-items: center; - padding-top: 13px; -} + .progress-container { width: 100%; position: relative; @@ -689,10 +863,8 @@ each(@themes, { } } .img { - img { - box-shadow: 0 0 4px ~'@{color-@{value}-theme-hover}'; - // border-color: ~'@{color-@{value}-theme-hover}'; - } + box-shadow: 0 0 4px ~'@{color-@{value}-theme-hover}'; + // border-color: ~'@{color-@{value}-theme-hover}'; } .lrc-active { color: ~'@{color-@{value}-theme}'; diff --git a/src/renderer/components/material/CommentFloor.vue b/src/renderer/components/material/CommentFloor.vue new file mode 100644 index 00000000..5cda949c --- /dev/null +++ b/src/renderer/components/material/CommentFloor.vue @@ -0,0 +1,130 @@ + + + + + From 8d8cabd5b3b8b9842419995c646509e0be26b3d0 Mon Sep 17 00:00:00 2001 From: lyswhut Date: Sat, 24 Oct 2020 02:08:31 +0800 Subject: [PATCH 03/14] =?UTF-8?q?=E5=AE=8C=E5=96=84=E8=AF=84=E8=AE=BA?= =?UTF-8?q?=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/renderer/components/core/Icons.vue | 3 + src/renderer/components/core/Player.vue | 3 +- src/renderer/components/core/PlayerDetail.vue | 182 ++++++++--------- .../components/material/CommentFloor.vue | 27 ++- src/renderer/utils/index.js | 33 ++++ src/renderer/utils/music/kg/comment.js | 75 +++++++ src/renderer/utils/music/kg/index.js | 2 + src/renderer/utils/music/kw/comment.js | 60 ++++++ src/renderer/utils/music/kw/index.js | 2 + src/renderer/utils/music/mg/album.js | 30 +++ src/renderer/utils/music/mg/comment.js | 95 +++++++++ src/renderer/utils/music/mg/index.js | 2 + src/renderer/utils/music/mg/leaderboard.js | 3 +- src/renderer/utils/music/mg/musicSearch.js | 3 +- src/renderer/utils/music/mg/songList.js | 20 +- src/renderer/utils/music/tx/comment.js | 187 ++++++++++++++++++ src/renderer/utils/music/tx/index.js | 2 + src/renderer/utils/music/wy/comment.js | 78 ++++++++ src/renderer/utils/music/wy/index.js | 2 + src/renderer/utils/music/xm/comment.js | 47 +++++ src/renderer/utils/music/xm/index.js | 10 +- src/renderer/utils/music/xm/musicInfo.js | 14 ++ 22 files changed, 753 insertions(+), 127 deletions(-) create mode 100644 src/renderer/utils/music/kg/comment.js create mode 100644 src/renderer/utils/music/kw/comment.js create mode 100644 src/renderer/utils/music/mg/album.js create mode 100644 src/renderer/utils/music/mg/comment.js create mode 100644 src/renderer/utils/music/tx/comment.js create mode 100644 src/renderer/utils/music/wy/comment.js create mode 100644 src/renderer/utils/music/xm/comment.js create mode 100644 src/renderer/utils/music/xm/musicInfo.js diff --git a/src/renderer/components/core/Icons.vue b/src/renderer/components/core/Icons.vue index c7e1332d..e765f0c2 100644 --- a/src/renderer/components/core/Icons.vue +++ b/src/renderer/components/core/Icons.vue @@ -206,5 +206,8 @@ svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/19 path(d='M256,170s-62.469-76.808-141-24C44.762,222.824,84.909,325.08,256,415c21.339-8.361,44-17,44-17,19-6.392,28.155,20.742,16,26-27.589,11.935,5.974-4.141-60,28C-35.524,313.85,43.993,149.031,95,117c86.8-65.89,162,10,162,10s58.158-60.523,140-23c104.032,58.528,64,161.9,45,196-9.152,15.154-39.559-4.159-32-16,20.34-37.888,45.522-107.349-25-150C314.919,103.92,256,170,256,170Z') path(d='M383,368c-8.1.01-24.77-.155-40,0-15.713.16-15.282,34.964,0,35,15.1,0.035,40,0,40,0s-0.068,42.8,0,48c0.208,15.961,32.261,15.791,32-1-0.072-4.649,0-47,0-47s38.008-.031,43,0c15.732,0.046,14.947-33.98-1-34-4.884.093-42,0-42,0s-0.053-28.341,0-46c0.046-15.189-32.028-15.512-32,0C383.027,337.74,382.782,365.139,383,368Z') + g#icon-thumbs-up(fill='currentColor') + // 0 0 512 512 + path(d='M466.27 286.69C475.04 271.84 480 256 480 236.85c0-44.015-37.218-85.58-85.82-85.58H357.7c4.92-12.81 8.85-28.13 8.85-46.54C366.55 31.936 328.86 0 271.28 0c-61.607 0-58.093 94.933-71.76 108.6-22.747 22.747-49.615 66.447-68.76 83.4H32c-17.673 0-32 14.327-32 32v240c0 17.673 14.327 32 32 32h64c14.893 0 27.408-10.174 30.978-23.95 44.509 1.001 75.06 39.94 177.802 39.94 7.22 0 15.22.01 22.22.01 77.117 0 111.986-39.423 112.94-95.33 13.319-18.425 20.299-43.122 17.34-66.99 9.854-18.452 13.664-40.343 8.99-62.99zm-61.75 53.83c12.56 21.13 1.26 49.41-13.94 57.57 7.7 48.78-17.608 65.9-53.12 65.9h-37.82c-71.639 0-118.029-37.82-171.64-37.82V240h10.92c28.36 0 67.98-70.89 94.54-97.46 28.36-28.36 18.91-75.63 37.82-94.54 47.27 0 47.27 32.98 47.27 56.73 0 39.17-28.36 56.72-28.36 94.54h103.99c21.11 0 37.73 18.91 37.82 37.82.09 18.9-12.82 37.81-22.27 37.81 13.489 14.555 16.371 45.236-5.21 65.62zM88 432c0 13.255-10.745 24-24 24s-24-10.745-24-24 10.745-24 24-24 24 10.745 24 24z') diff --git a/src/renderer/components/core/Player.vue b/src/renderer/components/core/Player.vue index 09af86de..4cdb2237 100644 --- a/src/renderer/components/core/Player.vue +++ b/src/renderer/components/core/Player.vue @@ -63,7 +63,7 @@ div(:class="$style.player") //- transition(enter-active-class="animated lightSpeedIn" transition(enter-active-class="animated lightSpeedIn" leave-active-class="animated slideOutDown") - core-player-detail(v-if="isShowPlayerDetail" :musicInfo="musicInfo" + core-player-detail(v-if="isShowPlayerDetail" :musicInfo="listId == 'download' ? targetSong.musicInfo : targetSong" :lyric="lyric" :list="list" :listId="listId" :playInfo="{ nowPlayTimeStr, maxPlayTimeStr, progress, nowPlayTime, status }" :isPlay="isPlay" @action="handlePlayDetailAction") @@ -767,6 +767,7 @@ export default { }) }, showPlayerDetail() { + if (!this.targetSong) return this.visiblePlayerDetail(true) }, handleTransitionEnd(e) { diff --git a/src/renderer/components/core/PlayerDetail.vue b/src/renderer/components/core/PlayerDetail.vue index d018c9d8..d697ae8e 100644 --- a/src/renderer/components/core/PlayerDetail.vue +++ b/src/renderer/components/core/PlayerDetail.vue @@ -21,7 +21,7 @@ //- div(:class="$style.info") div(:class="$style.info") img(:class="$style.img" :src="musicInfo.img" v-if="musicInfo.img") - div(:class="$style.description" @click="isShowComment = true") + div(:class="$style.description" @click="handleShowComment") p {{$t('core.player.name')}}{{musicInfo.name}} p {{$t('core.player.singer')}}{{musicInfo.singer}} p(v-if="musicInfo.album") {{$t('core.player.album')}}{{musicInfo.album}} @@ -35,15 +35,15 @@ div(:class="$style.comment") div(:class="$style.commentHeader" @click="isShowComment = false") h3 {{title}} - div.scroll(:class="$style.commentMain") - div + div.scroll(:class="$style.commentMain" ref="dom_comment") + div(v-if="comment.page == 1") h2(:class="$style.commentType") 热门评论 material-comment-floor(v-if="comment.hotComments.length" :class="$style.reply_floor" :comments="comment.hotComments") div h2(:class="$style.commentType") 最新评论 material-comment-floor(v-if="comment.comments.length" :class="$style.reply_floor" :comments="comment.comments") div(:class="$style.pagination") - material-pagination(:count="comment.total" :limit="comment.limit" :page="comment.page" @btn-click="handleToggleCommentPage") + material-pagination(:count="comment.total" :btnLength="5" :limit="comment.limit" :page="comment.page" @btn-click="handleToggleCommentPage") div(:class="$style.footer") div(:class="$style.left") @@ -80,6 +80,7 @@ import { mapGetters, mapMutations } from 'vuex' import { base as eventBaseName } from '../../event/names' import { scrollTo } from '../../utils' +import music from '../../utils/music' let cancelScrollFn = null @@ -219,106 +220,45 @@ export default { isSetedLines: false, isShowComment: false, comment: { + musicInfo: { + name: '', + singer: '', + }, page: 1, total: 10, maxPage: 1, - limit: 5, - comments: [{ - text: ['123123hhh'], - userName: 'dsads', - avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', - time: '2020-10-22 22:14:17', - likedCount: 100, - reply: [ - { - text: ['123123hhh'], - userName: 'dsads', - avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', - time: '2020-10-22 22:14:17', - likedCount: 100, - }, - ], - }, { - text: ['123123hhh'], - userName: 'dsads', - avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', - time: '2020-10-22 22:14:17', - likedCount: 100, - reply: [ - { - text: ['123123hhh'], - userName: 'dsads', - avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', - time: '2020-10-22 22:14:17', - likedCount: 100, - }, - { - text: ['123123hhh'], - userName: 'dsads', - avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', - time: '2020-10-22 22:14:17', - likedCount: 100, - }, - ], - }, { - text: ['123123hhh'], - userName: 'dsads', - avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', - time: '2020-10-22 22:14:17', - likedCount: 100, - reply: [], - }, { - text: ['123123hhh'], - userName: 'dsads', - avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', - time: '2020-10-22 22:14:17', - likedCount: 100, - reply: [], - }, { - text: ['123123hhh'], - userName: 'dsads', - avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', - time: '2020-10-22 22:14:17', - likedCount: 100, - reply: [], - }, { - text: ['123123hhh'], - userName: 'dsads', - avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', - time: '2020-10-22 22:14:17', - likedCount: 100, - reply: [], - }, { - text: ['123123hhh'], - userName: 'dsads', - avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', - time: '2020-10-22 22:14:17', - likedCount: 100, - reply: [], - }, { - text: ['123123hhh'], - userName: 'dsads', - avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', - time: '2020-10-22 22:14:17', - likedCount: 100, - reply: [], - }], - hotComments: [{ - text: ['123123hhh'], - userName: 'dsads', - avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', - time: '2020-10-22 22:14:17', - likedCount: 100, - reply: [ - { - text: ['123123hhh'], - userName: 'dsads', - avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', - time: '2020-10-22 22:14:17', - likedCount: 100, - }, - ], - }], + limit: 20, + comments: [ + // { + // text: ['123123hhh'], + // userName: 'dsads', + // avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', + // time: '2020-10-22 22:14:17', + // timeStr: '2020-10-22 22:14:17', + // likedCount: 100, + // reply: [], + // }, + ], + hotComments: [ + // { + // text: ['123123hhh'], + // userName: 'dsads', + // avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', + // time: '2020-10-22 22:14:17', + // timeStr: '2020-10-22 22:14:17', + // likedCount: 100, + // reply: [ + // { + // text: ['123123hhh'], + // userName: 'dsads', + // avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', + // time: '2020-10-22 22:14:17', + // timeStr: '2020-10-22 22:14:17', + // likedCount: 100, + // }, + // ], + // }, + ], }, } }, @@ -340,8 +280,8 @@ export default { ...mapGetters(['setting']), ...mapGetters('player', ['isShowPlayerDetail']), title() { - return this.musicInfo.name - ? this.setting.download.fileName.replace('歌名', this.musicInfo.name).replace('歌手', this.musicInfo.singer) + return this.comment.musicInfo.name + ? this.setting.download.fileName.replace('歌名', this.comment.musicInfo.name).replace('歌手', this.comment.musicInfo.singer) : '^-^' }, }, @@ -445,8 +385,40 @@ export default { close() { window.eventHub.$emit(eventBaseName.close) }, + handleShowComment() { + if (!this.musicInfo.songmid || !music[this.musicInfo.source].comment) return + if (this.musicInfo.songmid != this.comment.musicInfo.songmid) { + this.comment.page = 1 + this.comment.total = 0 + this.comment.maxPage = 1 + } + this.isShowComment = true + this.comment.musicInfo = this.musicInfo + music[this.comment.musicInfo.source].comment.getComment(this.comment.musicInfo, this.comment.page, this.comment.limit).then(comment => { + this.comment.comments = comment.comments + this.comment.total = comment.total + this.comment.maxPage = comment.maxPage + this.$nextTick(() => { + scrollTo(this.$refs.dom_comment, 0, 300, () => { + this.comment.comments = comment.comments + }) + }) + }) + music[this.comment.musicInfo.source].comment.getHotComment(this.comment.musicInfo, this.comment.page, this.comment.limit).then(hotComment => { + this.comment.hotComments = hotComment.comments + }) + }, handleToggleCommentPage(page) { - + music[this.comment.musicInfo.source].comment.getComment(this.comment.musicInfo, page, this.comment.limit).then(comment => { + this.comment.page = page + this.comment.total = comment.total + this.comment.maxPage = comment.maxPage + this.$nextTick(() => { + scrollTo(this.$refs.dom_comment, 0, 300, () => { + this.comment.comments = comment.comments + }) + }) + }) }, }, } @@ -596,7 +568,7 @@ export default { } } .left { - flex: auto; + flex: 40%; display: flex; flex-flow: column nowrap; align-items: center; diff --git a/src/renderer/components/material/CommentFloor.vue b/src/renderer/components/material/CommentFloor.vue index 5cda949c..1c6cf26c 100644 --- a/src/renderer/components/material/CommentFloor.vue +++ b/src/renderer/components/material/CommentFloor.vue @@ -7,10 +7,13 @@ img( :class="$style.avatar" :src="item.avatar || commentDefImg" @error="handleUserImg") div(:class="$style.right") div(:class="$style.info") - div(:class="$style.name") {{item.userName}} - time(:class="$style.time") {{timeFormat(item.time)}} - div(:class="$style.likes") {{item.likedCount}} - div(:class="$style.comment_text") + div.select(:class="$style.name") {{item.userName}} + time(:class="$style.time" v-if="item.timeStr") {{timeFormat(item.timeStr)}} + div(:class="$style.likes" v-if="item.likedCount != null") + svg(:class="$style.likesIcon" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' viewBox='0 0 512 512' space='preserve') + use(xlink:href='#icon-thumbs-up') + | {{item.likedCount}} + div.select(:class="$style.comment_text") p(v-for="text in item.text") {{text}} material-comment-floor(v-if="item.reply && item.reply.length" :class="$style.reply_floor" :comments="item.reply") @@ -84,7 +87,7 @@ export default { min-width: 0; } .name { - flex: auto; + flex: 0 1 auto; min-width: 0; .mixin-ellipsis-1; } @@ -92,21 +95,29 @@ export default { flex: none; color: @color-theme_2-font-label; font-size: 11px; - margin-left: 10px; + margin-left: 5px; } .likes { - flex: none; + flex: 1 0 auto; margin-left: 10px; color: @color-theme_2-font-label; font-size: 11px; align-self: flex-end; + text-align: right; +} +.likesIcon { + width: 12px; + height: 12px; + margin-right: 3px; + color: @color-theme-active; } .comment_text { text-align: justify; font-size: 14px; + padding-top: 8px; p { line-height: 1.5; - margin-top: 8px; + word-break: break-all; } } diff --git a/src/renderer/utils/index.js b/src/renderer/utils/index.js index 3b30ed43..ad84275e 100644 --- a/src/renderer/utils/index.js +++ b/src/renderer/utils/index.js @@ -20,6 +20,39 @@ export const sizeFormate = size => { return `${(size / Math.pow(1024, Math.floor(number))).toFixed(2)} ${units[number]}` } +/** + * 日期格式化 + * @param {*} date 时间 + * @param {String} format 时间格式,默认YYYY-MM-DD hh:mm:ss + */ +export const dateFormat = (date = new Date(), format = 'YYYY-MM-DD hh:mm:ss') => { + if (typeof date != 'object') date = new Date(date) + const munFix = (n) => n < 10 ? ('0' + n) : n + return format + .replace('YYYY', date.getFullYear()) + .replace('MM', munFix(date.getMonth() + 1)) + .replace('DD', munFix(date.getDate())) + .replace('hh', munFix(date.getHours())) + .replace('mm', munFix(date.getMinutes())) + .replace('ss', munFix(date.getSeconds())) +} + +/** + * 时间格式化 + */ +export const dateFormat2 = time => { + let differ = parseInt((Date.now() - time) / 1000) + if (differ < 60) { + return differ + '秒前' + } else if (differ < 3600) { + return parseInt(differ / 60) + '分钟前' + } else if (differ < 86400) { + return parseInt(differ / 3600) + '小时前' + } else { + return dateFormat(time) + } +} + export const formatPlayTime = time => { let m = parseInt(time / 60) let s = parseInt(time % 60) diff --git a/src/renderer/utils/music/kg/comment.js b/src/renderer/utils/music/kg/comment.js new file mode 100644 index 00000000..44f2fb8d --- /dev/null +++ b/src/renderer/utils/music/kg/comment.js @@ -0,0 +1,75 @@ +import { httpFetch } from '../../request' +import { dateFormat2 } from '../../' + +export default { + _requestObj: null, + _requestObj2: null, + async getComment({ hash }, page = 1, limit = 20) { + if (this._requestObj) this._requestObj.cancelHttp() + + const _requestObj = httpFetch(`http://comment.service.kugou.com/index.php?r=commentsv2/getCommentWithLike&code=fc4be23b4e972707f36b8a828a93ba8a&extdata=${hash}&p=${page}&pagesize=${limit}&ver=1.01&clientver=8373&appid=1001&kugouid=687373022`, { + headers: { + 'User-Agent': 'Android712-AndroidPhone-8983-18-0-COMMENT-wifi', + }, + }) + const { body, statusCode } = await _requestObj.promise + // console.log(body) + if (statusCode != 200 || body.err_code !== 0) throw new Error('获取评论失败') + return { source: 'kg', comments: this.filterComment(body.list), total: body.count, page, limit, maxPage: Math.ceil(body.count / limit) || 1 } + }, + async getHotComment({ hash, songmid }, page = 1, limit = 100) { + console.log(songmid) + if (this._requestObj2) this._requestObj2.cancelHttp() + + const _requestObj2 = httpFetch(`http://comment.service.kugou.com/index.php?r=commentsv2/getCommentWithLike&code=fc4be23b4e972707f36b8a828a93ba8a&extdata=${hash}&p=${page}&pagesize=${limit}&ver=1.01&clientver=8373&appid=1001&kugouid=687373022`, { + headers: { + 'User-Agent': 'Android712-AndroidPhone-8983-18-0-COMMENT-wifi', + }, + }) + const { body, statusCode } = await _requestObj2.promise + // console.log(body) + if (statusCode != 200 || body.err_code !== 0) throw new Error('获取热门评论失败') + return { source: 'kg', comments: this.filterComment(body.weightList) } + }, + async getReplyComment({ songmid }, replyId, page = 1, limit = 100) { + if (this._requestObj2) this._requestObj2.cancelHttp() + + const _requestObj2 = httpFetch(`http://comment.service.kugou.com/index.php?r=commentsv2/getReplyWithLike&code=fc4be23b4e972707f36b8a828a93ba8a&p=${page}&pagesize=${limit}&ver=1.01&clientver=8373&kugouid=687373022&appid=1001&childrenid=${songmid}&tid=${replyId}`, { + headers: { + 'User-Agent': 'Android712-AndroidPhone-8983-18-0-COMMENT-wifi', + }, + }) + const { body, statusCode } = await _requestObj2.promise + // console.log(body) + if (statusCode != 200 || body.err_code !== 0) throw new Error('获取回复评论失败') + return { source: 'kg', comments: this.filterComment(body.list) } + }, + filterComment(rawList) { + return rawList.map(item => { + let data = { + id: item.id, + text: item.content.split('\n'), + time: item.addtime, + timeStr: dateFormat2(new Date(item.addtime).getTime()), + userName: item.user_name, + avatar: item.user_pic, + userId: item.user_id, + likedCount: item.like.likenum, + replyNum: item.reply_num, + reply: [], + } + + return item.pcontent ? { + id: item.id, + text: item.pcontent.split('\n'), + time: null, + userName: item.puser, + avatar: null, + userId: item.puser_id, + likedCount: null, + replyNum: null, + reply: [data], + } : data + }) + }, +} diff --git a/src/renderer/utils/music/kg/index.js b/src/renderer/utils/music/kg/index.js index 524c5fbd..c0ccfbb2 100644 --- a/src/renderer/utils/music/kg/index.js +++ b/src/renderer/utils/music/kg/index.js @@ -5,12 +5,14 @@ import musicSearch from './musicSearch' import pic from './pic' import lyric from './lyric' import hotSearch from './hotSearch' +import comment from './comment' const kg = { leaderboard, songList, musicSearch, hotSearch, + comment, getMusicUrl(songInfo, type) { return apis('kg').getMusicUrl(songInfo, type) }, diff --git a/src/renderer/utils/music/kw/comment.js b/src/renderer/utils/music/kw/comment.js new file mode 100644 index 00000000..ec265945 --- /dev/null +++ b/src/renderer/utils/music/kw/comment.js @@ -0,0 +1,60 @@ +import { httpFetch } from '../../request' +import { dateFormat2 } from '../../' + +export default { + _requestObj: null, + _requestObj2: null, + async getComment({ songmid }, page = 1, limit = 20) { + if (this._requestObj) this._requestObj.cancelHttp() + + const _requestObj = httpFetch(`http://comment.kuwo.cn/com.s?type=get_comment&uid=0&digest=15&sid=${songmid}&page=${page}&rows=${limit}&f=web&prod=MUSIC_8.7.7.0_BCS37&devid=28556413`, { + headers: { + 'User-Agent': 'Dalvik/2.1.0 (Linux; U; Android 9;)', + }, + }) + const { body, statusCode } = await _requestObj.promise + if (statusCode != 200 || body.result !== 'ok') throw new Error('获取评论失败') + console.log(body) + return { source: 'kw', comments: this.filterComment(body.rows), total: body.total, page, limit, maxPage: Math.ceil(body.total / limit) || 1 } + }, + async getHotComment({ songmid }, page = 1, limit = 100) { + if (this._requestObj2) this._requestObj2.cancelHttp() + + const _requestObj2 = httpFetch(`http://comment.kuwo.cn/com.s?type=get_rec_comment&uid=0&digest=15&sid=${songmid}&page=${page}&rows=${limit}&f=web&prod=MUSIC_8.7.7.0_BCS37&devid=28556413`, { + headers: { + 'User-Agent': 'Dalvik/2.1.0 (Linux; U; Android 9;)', + }, + }) + const { body, statusCode } = await _requestObj2.promise + if (statusCode != 200 || body.result !== 'ok') throw new Error('获取热门评论失败') + // console.log(body) + return { source: 'kw', comments: this.filterComment(body.rows) } + }, + filterComment(rawList) { + return rawList.map(item => { + let data = { + id: item.id, + text: item.msg.split('\n'), + time: item.time, + timeStr: dateFormat2(new Date(item.time).getTime()), + userName: decodeURIComponent(item.u_name), + avatar: item.u_pic, + userId: item.u_id, + likedCount: item.like_num, + reply: [], + } + return item.reply ? { + id: item.id, + rootId: item.reply.id, + text: item.reply.msg.split('\n'), + time: item.reply.time, + timeStr: dateFormat2(new Date(item.reply.time).getTime()), + userName: decodeURIComponent(item.reply.u_name), + avatar: item.reply.u_pic, + userId: item.reply.u_id, + likedCount: item.reply.like_num, + reply: [data], + } : data + }) + }, +} diff --git a/src/renderer/utils/music/kw/index.js b/src/renderer/utils/music/kw/index.js index 19c0c143..1039305e 100644 --- a/src/renderer/utils/music/kw/index.js +++ b/src/renderer/utils/music/kw/index.js @@ -8,6 +8,7 @@ import pic from './pic' import { apis } from '../api-source' import songList from './songList' import hotSearch from './hotSearch' +import comment from './comment' const kw = { _musicInfoRequestObj: null, @@ -36,6 +37,7 @@ const kw = { leaderboard, songList, hotSearch, + comment, getLyric(songInfo, isGetLyricx) { // let singer = songInfo.singer.indexOf('、') > -1 ? songInfo.singer.split('、')[0] : songInfo.singer return lyric.getLyric(songInfo.songmid, isGetLyricx) diff --git a/src/renderer/utils/music/mg/album.js b/src/renderer/utils/music/mg/album.js new file mode 100644 index 00000000..625fc3ac --- /dev/null +++ b/src/renderer/utils/music/mg/album.js @@ -0,0 +1,30 @@ +import { httpFetch } from '../../request' + +export default { + getAlbum(songInfo, tryNum = 0) { + let requestObj = httpFetch(`http://app.c.nf.migu.cn/MIGUM2.0/v1.0/content/queryAlbumSong?albumId=${songInfo.albumId}&pageNo=1`, { + headers: { + sign: '46DB65104950B98FE451AD41047CC6C4', + timestamp: 1603451430776, + appId: 'yyapp2', + mode: 'android', + ua: 'Android_migu', + version: '6.9.4', + osVersion: 'android 7.0', + 'User-Agent': 'okhttp/3.9.1', + channel: '0146832', + }, + }) + requestObj.promise = requestObj.promise.then(({ body }) => { + if (body.code !== '000000') { + if (tryNum > 5) return Promise.reject('获取专辑失败') + let tryRequestObj = this.getAlbum(songInfo, ++tryNum) + requestObj.cancelHttp = tryRequestObj.cancelHttp.bind(tryRequestObj) + return tryRequestObj.promise + } + console.log(body) + return body.songList + }) + return requestObj + }, +} diff --git a/src/renderer/utils/music/mg/comment.js b/src/renderer/utils/music/mg/comment.js new file mode 100644 index 00000000..2e9f1621 --- /dev/null +++ b/src/renderer/utils/music/mg/comment.js @@ -0,0 +1,95 @@ +import { httpFetch } from '../../request' +import album from './album' +import { dateFormat2 } from '../../' + +export default { + _requestObj: null, + _requestObj2: null, + _requestObj3: null, + async getSongId(musicInfo) { + if (this._requestObj3) this._requestObj3.cancelHttp() + this.requestObj3 = album.getAlbum(musicInfo) + const list = await this.requestObj3.promise + const copyrightId = musicInfo.copyrightId + let info = list.find(s => s.copyrightId == copyrightId) + const songmid = musicInfo.songmid + if (!info) info = list.find(s => s.songId == songmid) + return info ? info.songId : null + }, + async getComment(musicInfo, page = 1, limit = 20) { + if (this._requestObj) this._requestObj.cancelHttp() + if (!musicInfo.songId) { + let id = await this.getSongId(musicInfo) + if (!id) throw new Error('获取评论失败') + musicInfo.songId = id + } + + const _requestObj = httpFetch(`https://music.migu.cn/v3/api/comment/listComments?targetId=${musicInfo.songId}&pageSize=${limit}&pageNo=${page}`, { + headers: { + 'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/86.0.4195.1 Safari/537.36', + Referer: 'https://music.migu.cn', + }, + }) + const { body, statusCode } = await _requestObj.promise + console.log(body) + if (statusCode != 200 || body.returnCode !== '000000') throw new Error('获取评论失败') + return { source: 'mg', comments: this.filterComment(body.data.items), total: body.data.itemTotal, page, limit, maxPage: Math.ceil(body.data.itemTotal / limit) || 1 } + }, + async getHotComment(musicInfo, page = 1, limit = 100) { + if (this._requestObj2) this._requestObj2.cancelHttp() + + if (!musicInfo.songId) { + let id = await this.getSongId(musicInfo) + if (!id) throw new Error('获取评论失败') + musicInfo.songId = id + } + + const _requestObj2 = httpFetch(`https://music.migu.cn/v3/api/comment/listTopComments?targetId=${musicInfo.songId}&pageSize=${limit}&pageNo=${page}`, { + headers: { + 'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/86.0.4195.1 Safari/537.36', + Referer: 'https://music.migu.cn', + }, + }) + const { body, statusCode } = await _requestObj2.promise + // console.log(body) + if (statusCode != 200 || body.returnCode !== '000000') throw new Error('获取热门评论失败') + return { source: 'mg', comments: this.filterComment(body.data.items) } + }, + async getReplyComment(musicInfo, replyId, page = 1, limit = 100) { + if (this._requestObj2) this._requestObj2.cancelHttp() + + const _requestObj2 = httpFetch(`https://music.migu.cn/v3/api/comment/listCommentsById?commentId=${replyId}&pageSize=${limit}&pageNo=${page}`, { + headers: { + 'User-Agent': 'Android712-AndroidPhone-8983-18-0-COMMENT-wifi', + }, + }) + const { body, statusCode } = await _requestObj2.promise + // console.log(body) + if (statusCode != 200 || body.returnCode !== '000000') throw new Error('获取回复评论失败') + return { source: 'mg', comments: this.filterComment(body.data.items) } + }, + filterComment(rawList) { + return rawList.map(item => ({ + id: item.commentId, + text: item.body.split('\n'), + time: item.createTime, + timeStr: dateFormat2(new Date(item.createTime).getTime()), + userName: item.author.name, + avatar: item.author.avatar, + userId: item.author.id, + likedCount: item.praiseCount, + replyNum: item.replyTotal, + reply: item.replyCommentList.map(c => ({ + id: c.commentId, + text: c.body.split('\n'), + time: c.createTime, + timeStr: dateFormat2(new Date(c.createTime).getTime()), + userName: c.author.name, + avatar: c.author.avatar, + userId: c.author.id, + likedCount: c.praiseCount, + replyNum: c.replyTotal, + })), + })) + }, +} diff --git a/src/renderer/utils/music/mg/index.js b/src/renderer/utils/music/mg/index.js index 3ee240a8..72ccde6a 100644 --- a/src/renderer/utils/music/mg/index.js +++ b/src/renderer/utils/music/mg/index.js @@ -5,12 +5,14 @@ import musicSearch from './musicSearch' import pic from './pic' import lyric from './lyric' import hotSearch from './hotSearch' +import comment from './comment' const mg = { songList, musicSearch, leaderboard, hotSearch, + comment, getMusicUrl(songInfo, type) { return apis('mg').getMusicUrl(songInfo, type) }, diff --git a/src/renderer/utils/music/mg/leaderboard.js b/src/renderer/utils/music/mg/leaderboard.js index 32602ffb..37dba46c 100644 --- a/src/renderer/utils/music/mg/leaderboard.js +++ b/src/renderer/utils/music/mg/leaderboard.js @@ -137,6 +137,7 @@ export default { albumName: item.album, albumId: item.albumId, songmid: item.copyrightId, + songId: item.songId, copyrightId: item.copyrightId, source: 'mg', interval: null, @@ -195,7 +196,7 @@ export default { getList(bangid, page, retryNum = 0) { if (++retryNum > 3) return Promise.reject(new Error('try max num')) return this.getData(this.getUrl(bangid, page)).then(({ statusCode, body }) => { - // console.log(body) + console.log(body) if (statusCode !== 200 || body.code !== this.successCode) return this.getList(bangid, page, retryNum) const list = this.filterData(body.data.columnInfo.dataList) return { diff --git a/src/renderer/utils/music/mg/musicSearch.js b/src/renderer/utils/music/mg/musicSearch.js index 9433596d..9e370395 100644 --- a/src/renderer/utils/music/mg/musicSearch.js +++ b/src/renderer/utils/music/mg/musicSearch.js @@ -36,7 +36,7 @@ export default { return arr.join('、') }, handleResult(rawData) { - // console.log(rawData) + console.log(rawData) let ids = new Set() const list = [] rawData.forEach(item => { @@ -82,6 +82,7 @@ export default { albumName: albumNInfo.name, albumId: albumNInfo.id, songmid: item.id, + songId: item.songId, copyrightId: item.copyrightId, source: 'mg', interval: null, diff --git a/src/renderer/utils/music/mg/songList.js b/src/renderer/utils/music/mg/songList.js index 0fa8ec33..2def8cce 100644 --- a/src/renderer/utils/music/mg/songList.js +++ b/src/renderer/utils/music/mg/songList.js @@ -24,25 +24,25 @@ export default { list: /
  • .+?<\/li>/g, listInfo: /.+data-original="(.+?)".*data-id="(\d+)".*
    (.+?)<\/a>.+<\/i>(.+?)<\/div>/, - // http://music.migu.cn/v3/music/playlist/161044573?page=1 + // https://music.migu.cn/v3/music/playlist/161044573?page=1 listDetailLink: /^.+\/playlist\/(\d+)(?:\?.*|&.*$|#.*$|$)/, }, tagsUrl: 'https://app.c.nf.migu.cn/MIGUM2.0/v1.0/content/indexTagPage.do?needAll=0', getSongListUrl(sortId, tagId, page) { // if (tagId == null) { // return sortId == 'recommend' - // ? `http://music.migu.cn/v3/music/playlist?page=${page}&from=migu` - // : `http://music.migu.cn/v3/music/playlist?sort=${sortId}&page=${page}&from=migu` + // ? `https://music.migu.cn/v3/music/playlist?page=${page}&from=migu` + // : `https://music.migu.cn/v3/music/playlist?sort=${sortId}&page=${page}&from=migu` // } - // return `http://music.migu.cn/v3/music/playlist?tagId=${tagId}&page=${page}&from=migu` + // return `https://music.migu.cn/v3/music/playlist?tagId=${tagId}&page=${page}&from=migu` if (tagId == null) { - // return `http://app.c.nf.migu.cn/MIGUM2.0/v2.0/content/getMusicData.do?count=${this.limit_list}&start=${page}&templateVersion=5&type=1` + // return `https://app.c.nf.migu.cn/MIGUM2.0/v2.0/content/getMusicData.do?count=${this.limit_list}&start=${page}&templateVersion=5&type=1` // return `https://c.musicapp.migu.cn/MIGUM2.0/v2.0/content/getMusicData.do?count=${this.limit_list}&start=${page}&templateVersion=5&type=${sortId}` - // http://app.c.nf.migu.cn/MIGUM2.0/v2.0/content/getMusicData.do?count=50&start=2&templateVersion=5&type=1 - return `http://m.music.migu.cn/migu/remoting/playlist_bycolumnid_tag?playListType=2&type=1&columnId=${sortId}&startIndex=${(page - 1) * 10}` + // https://app.c.nf.migu.cn/MIGUM2.0/v2.0/content/getMusicData.do?count=50&start=2&templateVersion=5&type=1 + return `https://m.music.migu.cn/migu/remoting/playlist_bycolumnid_tag?playListType=2&type=1&columnId=${sortId}&startIndex=${(page - 1) * 10}` } // return `https://app.c.nf.migu.cn/MIGUM2.0/v2.0/content/getMusicData.do?area=2&count=${this.limit_list}&start=${page}&tags=${tagId}&templateVersion=5&type=3` - return `http://m.music.migu.cn/migu/remoting/playlist_bycolumnid_tag?playListType=2&type=1&tagId=${tagId}&startIndex=${(page - 1) * 10}` + return `https://m.music.migu.cn/migu/remoting/playlist_bycolumnid_tag?playListType=2&type=1&tagId=${tagId}&startIndex=${(page - 1) * 10}` }, getSongListDetailUrl(id, page) { return `https://app.c.nf.migu.cn/MIGUM2.0/v1.0/user/queryMusicListSongs.do?musicListId=${id}&pageNo=${page}&pageSize=${this.limit_song}` @@ -74,7 +74,7 @@ export default { return this._requestObj_listDetail.promise.then(({ body }) => { if (body.code !== this.successCode) return this.getListDetail(id, page, ++tryNum) // console.log(JSON.stringify(body)) - console.log(body) + // console.log(body) return { list: this.filterListDetail(body.list), page, @@ -135,6 +135,7 @@ export default { albumId: item.albumId, songmid: item.copyrightId, copyrightId: item.copyrightId, + songId: item.songId, source: 'mg', interval: null, img: item.albumImgs && item.albumImgs.length ? item.albumImgs[0].img : null, @@ -185,7 +186,6 @@ export default { // }) return this._requestObj_list.promise.then(({ body }) => { if (body.retCode !== '100000' || body.retMsg.code !== this.successCode) return this.getList(sortId, tagId, page, ++tryNum) - // console.log(body) return { list: this.filterList(body.retMsg.playlist), total: parseInt(body.retMsg.countSize), diff --git a/src/renderer/utils/music/tx/comment.js b/src/renderer/utils/music/tx/comment.js new file mode 100644 index 00000000..31874017 --- /dev/null +++ b/src/renderer/utils/music/tx/comment.js @@ -0,0 +1,187 @@ +import { httpFetch } from '../../request' +import { dateFormat2 } from '../../' + +const emojis = { + e400846: '😘', + e400874: '😴', + e400825: '😃', + e400847: '😙', + e400835: '😍', + e400873: '😳', + e400836: '😎', + e400867: '😭', + e400832: '😊', + e400837: '😏', + e400875: '😫', + e400831: '😉', + e400855: '😡', + e400823: '😄', + e400862: '😨', + e400844: '😖', + e400841: '😓', + e400830: '😈', + e400828: '😆', + e400833: '😋', + e400822: '😀', + e400843: '😕', + e400829: '😇', + e400824: '😂', + e400834: '😌', + e400877: '😷', + e400132: '🍉', + e400181: '🍺', + e401067: '☕️', + e400186: '🥧', + e400343: '🐷', + e400116: '🌹', + e400126: '🍃', + e400613: '💋', + e401236: '❤️', + e400622: '💔', + e400637: '💣', + e400643: '💩', + e400773: '🔪', + e400102: '🌛', + e401328: '🌞', + e400420: '👏', + e400914: '🙌', + e400408: '👍', + e400414: '👎', + e401121: '✋', + e400396: '👋', + e400384: '👉', + e401115: '✊', + e400402: '👌', + e400905: '🙈', + e400906: '🙉', + e400907: '🙊', + e400562: '👻', + e400932: '🙏', + e400644: '💪', + e400611: '💉', + e400185: '🎁', + e400655: '💰', + e400325: '🐥', + e400612: '💊', + e400198: '🎉', + e401685: '⚡️', + e400631: '💝', + e400768: '🔥', + e400432: '👑', +} + +export default { + _requestObj: null, + _requestObj2: null, + async getComment({ songId }, page = 1, limit = 20) { + if (this._requestObj) this._requestObj.cancelHttp() + + const _requestObj = httpFetch('http://c.y.qq.com/base/fcgi-bin/fcg_global_comment_h5.fcg', { + headers: { + 'User-Agent': 'Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/5.0)', + }, + form: { + uin: '0', + format: 'json', + cid: '205360772', + reqtype: '2', + biztype: '1', + topid: songId, + cmd: '8', + needmusiccrit: '1', + pagenum: page - 1, + pagesize: limit, + }, + }) + const { body, statusCode } = await _requestObj.promise + if (statusCode != 200 || body.code !== 0) throw new Error('获取评论失败') + // console.log(body, statusCode) + const comment = body.comment + return { + source: 'tx', + comments: this.filterComment(comment.commentlist), + total: comment.commenttotal, + page, + limit, + maxPage: Math.ceil(comment.commenttotal / limit) || 1, + } + }, + async getHotComment({ songId }, page = 1, limit = 100) { + if (this._requestObj2) this._requestObj2.cancelHttp() + + const _requestObj2 = httpFetch('http://c.y.qq.com/base/fcgi-bin/fcg_global_comment_h5.fcg', { + headers: { + 'User-Agent': 'Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/5.0)', + }, + form: { + uin: '0', + format: 'json', + cid: '205360772', + reqtype: '2', + biztype: '1', + topid: songId, + cmd: '9', + needmusiccrit: '1', + pagenum: page - 1, + pagesize: limit, + }, + }) + const { body, statusCode } = await _requestObj2.promise + if (statusCode != 200 || body.code !== 0) throw new Error('获取热门评论失败') + // console.log(body, statusCode) + const comment = body.comment + return { + source: 'tx', + comments: this.filterComment(comment.commentlist), + total: comment.commenttotal, + } + }, + replaceEmoji(msg) { + let rxp = /^\[em\](e\d+)\[\/em\]$/ + let result = msg.match(/\[em\]e\d+\[\/em\]/g) + if (!result) return msg + result = Array.from(new Set(result)) + for (let item of result) { + let code = item.replace(rxp, '$1') + msg = msg.replace(new RegExp(item.replace('[em]', '\\[em\\]').replace('[/em]', '\\[\\/em\\]'), 'g'), emojis[code] || '') + } + return msg + }, + filterComment(rawList) { + return rawList.map(item => { + let time = item.rootcommentid ? parseInt(item.rootcommentid.substring(item.rootcommentid.lastIndexOf('_') + 1) + '000') : null + if (item.middlecommentcontent) { + let firstItem = item.middlecommentcontent[0] + firstItem.avatarurl = item.avatarurl + firstItem.praisenum = item.praisenum + item.avatarurl = null + item.praisenum = null + item.middlecommentcontent.reverse() + } + return { + id: item.subcommentid, + rootId: item.rootcommentid, + text: item.rootcommentcontent ? this.replaceEmoji(item.rootcommentcontent).split('\n') : [], + time, + timeStr: time ? dateFormat2(time) : null, + userName: item.rootcommentnick ? item.rootcommentnick.substring(1) : '', + avatar: item.avatarurl, + userId: item.encrypt_rootcommentuin, + likedCount: item.praisenum, + reply: item.middlecommentcontent ? item.middlecommentcontent.map(c => { + let index = c.subcommentid.lastIndexOf('_') + return { + id: c.subcommentid, + text: this.replaceEmoji(c.subcommentcontent).split('\n'), + time: parseInt(c.subcommentid.substring(index + 1) + '000'), + timeStr: dateFormat2(parseInt(c.subcommentid.substring(index + 1) + '000')), + userName: c.replynick.substring(1), + avatar: c.avatarurl, + userId: c.encrypt_replyuin, + likedCount: c.praisenum, + } + }) : [], + } + }) + }, +} diff --git a/src/renderer/utils/music/tx/index.js b/src/renderer/utils/music/tx/index.js index ffa94b54..6c1bd568 100644 --- a/src/renderer/utils/music/tx/index.js +++ b/src/renderer/utils/music/tx/index.js @@ -4,12 +4,14 @@ import songList from './songList' import musicSearch from './musicSearch' import { apis } from '../api-source' import hotSearch from './hotSearch' +import comment from './comment' const tx = { leaderboard, songList, musicSearch, hotSearch, + comment, getMusicUrl(songInfo, type) { return apis('tx').getMusicUrl(songInfo, type) diff --git a/src/renderer/utils/music/wy/comment.js b/src/renderer/utils/music/wy/comment.js new file mode 100644 index 00000000..f5ab0a5a --- /dev/null +++ b/src/renderer/utils/music/wy/comment.js @@ -0,0 +1,78 @@ +import { httpFetch } from '../../request' +import { weapi } from './utils/crypto' +import { dateFormat2 } from '../../' + +export default { + _requestObj: null, + _requestObj2: null, + async getComment({ songmid }, page = 1, limit = 20) { + if (this._requestObj) this._requestObj.cancelHttp() + + const _requestObj = httpFetch(`https://music.163.com/api/v1/resource/comments/R_SO_4_${songmid}`, { + method: 'post', + headers: { + 'User-Agent': 'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.90 Safari/537.36', + origin: 'https://music.163.com', + }, + form: weapi({ + rid: songmid, + limit: limit, + offset: (page - 1) * limit, + beforeTime: 0, + }), + }) + const { body, statusCode } = await _requestObj.promise + if (statusCode != 200 || body.code !== 200) throw new Error('获取评论失败') + console.log(body) + return { source: 'wy', comments: this.filterComment(body.comments), total: body.total, page, limit, maxPage: Math.ceil(body.total / limit) || 1 } + }, + async getHotComment({ songmid }, page = 1, limit = 100) { + if (this._requestObj2) this._requestObj2.cancelHttp() + + const _requestObj2 = httpFetch(`https://music.163.com/api/v1/resource/comments/R_SO_4_${songmid}`, { + method: 'post', + headers: { + 'User-Agent': 'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.90 Safari/537.36', + origin: 'https://music.163.com', + }, + form: weapi({ + rid: songmid, + limit: limit, + offset: (page - 1) * limit, + beforeTime: 0, + }), + }) + const { body, statusCode } = await _requestObj2.promise + if (statusCode != 200 || body.code !== 200) throw new Error('获取热门评论失败') + // console.log(body) + return { source: 'wy', comments: this.filterComment(body.hotComments) } + }, + filterComment(rawList) { + return rawList.map(item => { + let data = { + id: item.commentId, + text: item.content ? item.content.split('\n') : '', + time: item.time ? item.time : '', + timeStr: item.time ? dateFormat2(item.time) : '', + userName: item.user.nickname, + avatar: item.user.avatarUrl, + userId: item.user.userId, + likedCount: item.likedCount, + reply: [], + } + let replyData = item.beReplied[0] + return replyData ? { + id: item.commentId, + rootId: replyData.beRepliedCommentId, + text: replyData.content ? replyData.content.split('\n') : '', + time: null, + timeStr: null, + userName: replyData.user.nickname, + avatar: replyData.user.avatarUrl, + userId: replyData.user.userId, + likedCount: null, + reply: [data], + } : data + }) + }, +} diff --git a/src/renderer/utils/music/wy/index.js b/src/renderer/utils/music/wy/index.js index a06284a4..69830372 100644 --- a/src/renderer/utils/music/wy/index.js +++ b/src/renderer/utils/music/wy/index.js @@ -5,12 +5,14 @@ import getMusicInfo from './musicInfo' import musicSearch from './musicSearch' import songList from './songList' import hotSearch from './hotSearch' +import comment from './comment' const wy = { leaderboard, musicSearch, songList, hotSearch, + comment, getMusicUrl(songInfo, type) { return apis('wy').getMusicUrl(songInfo, type) }, diff --git a/src/renderer/utils/music/xm/comment.js b/src/renderer/utils/music/xm/comment.js new file mode 100644 index 00000000..d8432cbe --- /dev/null +++ b/src/renderer/utils/music/xm/comment.js @@ -0,0 +1,47 @@ +import { xmRequest } from './util' +import { dateFormat2 } from '../../' + +export default { + _requestObj: null, + _requestObj2: null, + async getComment({ songmid }, page = 1, limit = 20) { + if (this._requestObj) this._requestObj.cancelHttp() + + const _requestObj = xmRequest('/api/comment/getCommentList', { objectId: songmid, objectType: 'song', pagingVO: { page, pageSize: limit } }) + const { body, statusCode } = await _requestObj.promise + // console.log(body) + if (statusCode != 200 || body.code !== 'SUCCESS') throw new Error('获取评论失败') + return { source: 'xm', comments: this.filterComment(body.result.data.commentList), total: body.result.data.pagingVO.count, page, limit, maxPage: Math.ceil(body.result.data.pagingVO.count / limit) || 1 } + }, + async getHotComment({ songmid }, page = 1, limit = 100) { + if (this._requestObj2) this._requestObj2.cancelHttp() + if (!songmid) throw new Error('获取失败') + const _requestObj2 = xmRequest('/api/comment/getHotCommentList', { objectId: songmid, objectType: 'song', pagingVO: { page, pageSize: limit } }) + const { body, statusCode } = await _requestObj2.promise + // console.log(body) + if (statusCode != 200 || body.code !== 'SUCCESS') throw new Error('获取热门评论失败') + return { source: 'xm', comments: this.filterComment(body.result.data.hotList) } + }, + filterComment(rawList) { + return rawList.map(item => ({ + id: item.commentId, + text: item.message.split('\n').filter(t => !!t), + time: item.gmtCreate, + timeStr: dateFormat2(item.gmtCreate), + userName: item.nickName, + avatar: item.avatar, + userId: item.userId, + likedCount: item.likes, + reply: item.replyData ? item.replyData.map(c => ({ + id: c.commentId, + text: c.message.split('\n').filter(t => !!t), + time: c.gmtCreate, + timeStr: dateFormat2(c.gmtCreate), + userName: c.nickName, + avatar: c.avatar, + userId: c.userId, + likedCount: c.likes, + })) : [], + })) + }, +} diff --git a/src/renderer/utils/music/xm/index.js b/src/renderer/utils/music/xm/index.js index 06c07b2c..e586bf25 100644 --- a/src/renderer/utils/music/xm/index.js +++ b/src/renderer/utils/music/xm/index.js @@ -5,6 +5,8 @@ import musicSearch from './musicSearch' // import pic from './pic' import lyric from './lyric' import hotSearch from './hotSearch' +import comment from './comment' +import musicInfo from './musicInfo' import { closeVerifyModal } from './util' const xm = { @@ -13,6 +15,7 @@ const xm = { leaderboard, hotSearch, closeVerifyModal, + comment, getMusicUrl(songInfo, type) { return apis('xm').getMusicUrl(songInfo, type) }, @@ -24,7 +27,12 @@ const xm = { // return pic.getPic(songInfo) }, getMusicDetailPageUrl(songInfo) { - return songInfo.songStringId ? `https://www.xiami.com/song/${songInfo.songStringId}` : null + if (songInfo.songStringId) return `https://www.xiami.com/song/${songInfo.songStringId}` + + musicInfo.getMusicInfo(songInfo).then(({ data }) => { + songInfo.songStringId = data.songStringId + }) + return `https://www.xiami.com/song/${songInfo.songmid}` }, // init() { // getToken() diff --git a/src/renderer/utils/music/xm/musicInfo.js b/src/renderer/utils/music/xm/musicInfo.js new file mode 100644 index 00000000..7ca9b1be --- /dev/null +++ b/src/renderer/utils/music/xm/musicInfo.js @@ -0,0 +1,14 @@ +import { xmRequest } from './util' + +export default { + _requestObj: null, + async getMusicInfo({ songmid }, page = 1, limit = 20) { + if (this._requestObj) this._requestObj.cancelHttp() + + const _requestObj = xmRequest('/api/song/initialize', { songId: songmid }) + const { body, statusCode } = await _requestObj.promise + // console.log(body) + if (statusCode != 200 || body.code !== 'SUCCESS') throw new Error('获取歌曲信息失败') + return { source: 'xm', data: body.result.data.songDetail } + }, +} From 8c76c3d81c5254602391bf71eaace740f8f751e3 Mon Sep 17 00:00:00 2001 From: lyswhut Date: Tue, 27 Oct 2020 18:09:17 +0800 Subject: [PATCH 04/14] =?UTF-8?q?=E6=92=AD=E6=94=BE=E8=AF=A6=E6=83=85?= =?UTF-8?q?=E9=A1=B5=E6=96=B0=E5=A2=9E=E6=AD=8C=E6=9B=B2=E8=AF=84=E8=AE=BA?= =?UTF-8?q?=E5=8A=A0=E8=BD=BD=E6=98=BE=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- publish/changeLog.md | 4 + src/renderer/assets/styles/variables.less | 30 +- src/renderer/components/core/Icons.vue | 12 +- src/renderer/components/core/Player.vue | 4 +- src/renderer/components/core/PlayerDetail.vue | 184 ++++-------- .../components/material/CommentFloor.vue | 24 +- .../components/material/MusicComment.vue | 268 ++++++++++++++++++ src/renderer/lang/en-us/base.json | 5 + src/renderer/lang/en-us/core/player.json | 13 +- src/renderer/lang/zh-cn/base.json | 5 + src/renderer/lang/zh-cn/core/player.json | 13 +- src/renderer/lang/zh-tw/base.json | 5 + src/renderer/lang/zh-tw/core/player.json | 13 +- src/renderer/utils/index.js | 6 +- src/renderer/utils/music/kg/comment.js | 8 +- src/renderer/utils/music/tx/comment.js | 4 +- 17 files changed, 442 insertions(+), 158 deletions(-) create mode 100644 src/renderer/components/material/MusicComment.vue create mode 100644 src/renderer/lang/en-us/base.json create mode 100644 src/renderer/lang/zh-cn/base.json create mode 100644 src/renderer/lang/zh-tw/base.json diff --git a/package.json b/package.json index bd609886..d0a1a5da 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "lx-music-desktop", - "version": "1.2.2", + "version": "1.3.0", "description": "一个免费的音乐下载助手", "main": "./dist/electron/main.js", "productName": "lx-music-desktop", diff --git a/publish/changeLog.md b/publish/changeLog.md index dffcaabf..df42ba36 100644 --- a/publish/changeLog.md +++ b/publish/changeLog.md @@ -1,3 +1,7 @@ +### 新增 + +- 播放详情页新增歌曲评论加载显示(某些平台暂不支持显示子评论) + ### 优化 - 修改播放详情页的歌曲图片的显示效果 diff --git a/src/renderer/assets/styles/variables.less b/src/renderer/assets/styles/variables.less index ba2a8e4f..1957fa74 100644 --- a/src/renderer/assets/styles/variables.less +++ b/src/renderer/assets/styles/variables.less @@ -92,7 +92,7 @@ @color-green-theme_2-font-label: fadeout(@color-green-theme_2-font, 50%); // @color-green-theme_2-line: transparent; @color-green-theme_2-line: lighten(@color-green-theme, 45%); -@color-green-reply-floor: lighten(@color-green-theme, 45%); +@color-green-reply-floor: fadeout(@color-green-theme, 95%); @color-green-theme-sidebar: @color-green-theme; @color-green-btn: lighten(@color-green-theme, 5%); @color-green-btn-background: fadeout(lighten(@color-green-theme, 35%), 70%); @@ -150,7 +150,7 @@ @color-yellow-theme_2-font-label: fadeout(@color-yellow-theme_2-font, 50%); // @color-yellow-theme_2-line: transparent; @color-yellow-theme_2-line: lighten(@color-yellow-theme, 28%); -@color-yellow-reply-floor: lighten(@color-yellow-theme, 28%); +@color-yellow-reply-floor: fadeout(@color-yellow-theme, 94%); @color-yellow-theme-sidebar: @color-yellow-theme; @color-yellow-btn: darken(@color-yellow-theme, 5%); @color-yellow-btn-background: fadeout(lighten(@color-yellow-theme, 25%), 60%); @@ -207,7 +207,7 @@ @color-orange-theme_2-font-label: fadeout(@color-orange-theme_2-font, 50%); // @color-orange-theme_2-line: transparent; @color-orange-theme_2-line: lighten(@color-orange-theme, 36%); -@color-orange-reply-floor: lighten(@color-orange-theme, 36%); +@color-orange-reply-floor: fadeout(@color-orange-theme, 95%); @color-orange-theme-sidebar: @color-orange-theme; @color-orange-btn: lighten(@color-orange-theme, 5%); @color-orange-btn-background: fadeout(lighten(@color-orange-theme, 25%), 60%); @@ -264,7 +264,7 @@ @color-blue-theme_2-font-label: fadeout(@color-blue-theme_2-font, 50%); // @color-blue-theme_2-line: transparent; @color-blue-theme_2-line: lighten(@color-blue-theme, 42%); -@color-blue-reply-floor: lighten(@color-blue-theme, 42%); +@color-blue-reply-floor: fadeout(@color-blue-theme, 95%); @color-blue-theme-sidebar: @color-blue-theme; @color-blue-btn: lighten(@color-blue-theme, 5%); @color-blue-btn-background: fadeout(lighten(@color-blue-theme, 35%), 50%); @@ -321,7 +321,7 @@ @color-red-theme_2-font-label: fadeout(@color-red-theme_2-font, 50%); // @color-red-theme_2-line: transparent; @color-red-theme_2-line: lighten(@color-red-theme, 42%); -@color-red-reply-floor: lighten(@color-red-theme, 42%); +@color-red-reply-floor: fadeout(@color-red-theme, 95%); @color-red-theme-sidebar: @color-red-theme; @color-red-btn: lighten(@color-red-theme, 5%); @color-red-btn-background: fadeout(lighten(@color-red-theme, 35%), 70%); @@ -380,7 +380,7 @@ @color-pink-theme_2-font-label: fadeout(@color-pink-theme_2-font, 50%); // @color-pink-theme_2-line: transparent; @color-pink-theme_2-line: lighten(@color-pink-theme, 25%); -@color-pink-reply-floor: lighten(@color-pink-theme, 25%); +@color-pink-reply-floor: fadeout(@color-pink-theme, 93%); @color-pink-theme-sidebar: @color-pink-theme; @color-pink-btn: darken(@color-pink-theme, 3%); @color-pink-btn-background: fadeout(lighten(@color-pink-theme, 20%), 50%); @@ -437,7 +437,7 @@ @color-purple-theme_2-font-label: fadeout(@color-purple-theme_2-font, 50%); // @color-purple-theme_2-line: transparent; @color-purple-theme_2-line: lighten(@color-purple-theme, 43%); -@color-purple-reply-floor: lighten(@color-purple-theme, 43%); +@color-purple-reply-floor: fadeout(@color-purple-theme, 95%); @color-purple-theme-sidebar: @color-purple-theme; @color-purple-btn: lighten(@color-purple-theme, 5%); @color-purple-btn-background: fadeout(lighten(@color-purple-theme, 35%), 70%); @@ -494,7 +494,7 @@ @color-grey-theme_2-font-label: fadeout(@color-grey-theme_2-font, 50%); // @color-grey-theme_2-line: transparent; @color-grey-theme_2-line: lighten(@color-grey-theme, 47%); -@color-grey-reply-floor: lighten(@color-grey-theme, 47%); +@color-grey-reply-floor: fadeout(@color-grey-theme, 95%); @color-grey-theme-sidebar: @color-grey-theme; @color-grey-btn: lighten(@color-grey-theme, 5%); @color-grey-btn-background: fadeout(lighten(@color-grey-theme, 35%), 70%); @@ -552,7 +552,7 @@ @color-ming-theme_2-font-label: fadeout(@color-ming-theme_2-font, 50%); // @color-ming-theme_2-line: transparent; @color-ming-theme_2-line: lighten(@color-ming-theme, 60%); -@color-ming-reply-floor: lighten(@color-ming-theme, 60%); +@color-ming-reply-floor: fadeout(@color-ming-theme, 95%); @color-ming-theme-sidebar: @color-ming-theme; @color-ming-btn: lighten(@color-ming-theme, 5%); @color-ming-btn-background: fadeout(lighten(@color-ming-theme, 35%), 75%); @@ -612,7 +612,7 @@ @color-blue2-theme_2-font-label: fadeout(@color-blue2-theme_2-font, 50%); // @color-blue2-theme_2-line: transparent; @color-blue2-theme_2-line: lighten(@color-blue2-theme, 41%); -@color-blue2-reply-floor: lighten(@color-blue2-theme, 41%); +@color-blue2-reply-floor: fadeout(@color-blue2-theme, 95%); @color-blue2-theme-sidebar: @color-blue2-theme; @color-blue2-btn: lighten(@color-blue2-theme, 5%); @color-blue2-btn-background: fadeout(lighten(@color-blue2-theme, 30%), 70%); @@ -662,7 +662,7 @@ @color-mid_autumn-theme-font: rgba(246, 233, 255, 0.9); @color-mid_autumn-theme-font-label: fadeout(lighten(@color-mid_autumn-theme, 20%), 20%); @color-mid_autumn-theme_2: rgba(255, 255, 255, .9); -@color-mid_autumn-theme_2-background_1: #e7e7e9; +@color-mid_autumn-theme_2-background_1: #ececec; @color-mid_autumn-theme_2-background_2: fadeout(@color-mid_autumn-theme_2-background_1, 2%); @color-mid_autumn-theme_2-hover: fadeout(lighten(@color-mid_autumn-theme, 15%), 80%); @color-mid_autumn-theme_2-active: fadeout(lighten(@color-mid_autumn-theme, 15%), 70%); @@ -670,7 +670,7 @@ @color-mid_autumn-theme_2-font-label: desaturate(lighten(@color-mid_autumn-theme, 30%), 45%); // @color-mid_autumn-theme_2-line: transparent; @color-mid_autumn-theme_2-line: lighten(@color-mid_autumn-theme, 61%); -@color-mid_autumn-reply-floor: lighten(@color-mid_autumn-theme, 61%); +@color-mid_autumn-reply-floor: fadeout(@color-mid_autumn-theme, 95%); @color-mid_autumn-theme-sidebar: rgba(255, 255, 255, 0); @color-mid_autumn-btn: lighten(@color-mid_autumn-theme, 10%); @color-mid_autumn-btn-background: fadeout(lighten(@color-mid_autumn-theme, 35%), 70%); @@ -728,7 +728,7 @@ @color-mid_autumn-theme_2-font-label: desaturate(lighten(@color-mid_autumn-theme, 30%), 45%); // @color-mid_autumn-theme_2-line: transparent; @color-mid_autumn-theme_2-line: darken(@color-mid_autumn-theme, 18%); -@color-mid_autumn-reply-floor: darken(@color-mid_autumn-theme, 18%); +@color-mid_autumn-reply-floor: fadeout(@color-mid_autumn-theme, 95%); @color-mid_autumn-theme-sidebar: rgba(255, 255, 255, 0); @color-mid_autumn-btn: darken(@color-mid_autumn-theme, 10%); @color-mid_autumn-btn-background: fadeout(lighten(@color-mid_autumn-theme, 35%), 70%); @@ -785,7 +785,7 @@ @color-naruto-theme_2-font-label: desaturate(lighten(@color-naruto-theme, 10%), 45%); // @color-naruto-theme_2-line: transparent; @color-naruto-theme_2-line: fadeout(lighten(@color-naruto-theme, 36%), 70%); -@color-naruto-reply-floor: fadeout(lighten(@color-naruto-theme, 36%), 70%); +@color-naruto-reply-floor: fadeout(lighten(@color-naruto-theme, 12%), 90%); @color-naruto-theme-sidebar: rgba(255, 255, 255, .3); @color-naruto-btn: lighten(@color-naruto-theme, 2%); @color-naruto-btn-background: fadeout(lighten(@color-naruto-theme, 35%), 70%); @@ -842,7 +842,7 @@ @color-happy_new_year-theme_2-font-label: desaturate(darken(@color-happy_new_year-theme, 5%), 50%); // @color-happy_new_year-theme_2-line: transparent; @color-happy_new_year-theme_2-line: fadeout(lighten(@color-happy_new_year-theme, 16%), 70%); -@color-happy_new_year-reply-floor: fadeout(lighten(@color-happy_new_year-theme, 16%), 70%); +@color-happy_new_year-reply-floor: fadeout(lighten(@color-happy_new_year-theme, 12%), 85%); @color-happy_new_year-theme-sidebar: rgba(119, 37, 18, 0.1); @color-happy_new_year-btn: desaturate(@color-happy_new_year-theme, 10%); @color-happy_new_year-btn-background: fadeout(lighten(@color-happy_new_year-theme, 15%), 60%); diff --git a/src/renderer/components/core/Icons.vue b/src/renderer/components/core/Icons.vue index e765f0c2..cef053fd 100644 --- a/src/renderer/components/core/Icons.vue +++ b/src/renderer/components/core/Icons.vue @@ -75,8 +75,8 @@ svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/19 // 0 0 512 512 path(d='M511.563,434.259c-1.728-142.329-124.42-258.242-277.087-263.419V95.999c0-17.645-14.342-31.999-31.974-31.999 c-7.931,0-15.591,3.042-21.524,8.562c0,0-134.828,124.829-173.609,163.755C2.623,241.109,0,248.088,0,255.994 c0,7.906,2.623,14.885,7.369,19.687c38.781,38.915,173.609,163.745,173.609,163.745c5.933,5.521,13.593,8.562,21.524,8.562 c17.631,0,31.974-14.354,31.974-31.999v-74.591c153.479,2.156,255.792,50.603,255.792,95.924c0,5.896,4.767,10.666,10.658,10.666 c0.167,0.021,0.333,0.01,0.416,0c5.891,0,10.658-4.771,10.658-10.666C512,436.259,511.854,435.228,511.563,434.259z') g#icon-refresh(fill='currentColor') - // 0 0 512 512 - path(d='M440.65 12.57l4 82.77A247.16 247.16 0 0 0 255.83 8C134.73 8 33.91 94.92 12.29 209.82A12 12 0 0 0 24.09 224h49.05a12 12 0 0 0 11.67-9.26 175.91 175.91 0 0 1 317-56.94l-101.46-4.86a12 12 0 0 0-12.57 12v47.41a12 12 0 0 0 12 12H500a12 12 0 0 0 12-12V12a12 12 0 0 0-12-12h-47.37a12 12 0 0 0-11.98 12.57zM255.83 432a175.61 175.61 0 0 1-146-77.8l101.8 4.87a12 12 0 0 0 12.57-12v-47.4a12 12 0 0 0-12-12H12a12 12 0 0 0-12 12V500a12 12 0 0 0 12 12h47.35a12 12 0 0 0 12-12.6l-4.15-82.57A247.17 247.17 0 0 0 255.83 504c121.11 0 221.93-86.92 243.55-201.82a12 12 0 0 0-11.8-14.18h-49.05a12 12 0 0 0-11.67 9.26A175.86 175.86 0 0 1 255.83 432z') + // 0 0 24 24 + path(d='M12,6V9L16,5L12,1V4A8,8 0 0,0 4,12C4,13.57 4.46,15.03 5.24,16.26L6.7,14.8C6.25,13.97 6,13 6,12A6,6 0 0,1 12,6M18.76,7.74L17.3,9.2C17.74,10.04 18,11 18,12A6,6 0 0,1 12,18V15L8,19L12,23V20A8,8 0 0,0 20,12C20,10.43 19.54,8.97 18.76,7.74Z') g#icon-eraser(fill='currentColor') // 0 0 512 512 path(d='M497.941 273.941c18.745-18.745 18.745-49.137 0-67.882l-160-160c-18.745-18.745-49.136-18.746-67.883 0l-256 256c-18.745 18.745-18.745 49.137 0 67.882l96 96A48.004 48.004 0 0 0 144 480h356c6.627 0 12-5.373 12-12v-40c0-6.627-5.373-12-12-12H355.883l142.058-142.059zm-302.627-62.627l137.373 137.373L265.373 416H150.628l-80-80 124.686-124.686z') @@ -209,5 +209,13 @@ svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/19 g#icon-thumbs-up(fill='currentColor') // 0 0 512 512 path(d='M466.27 286.69C475.04 271.84 480 256 480 236.85c0-44.015-37.218-85.58-85.82-85.58H357.7c4.92-12.81 8.85-28.13 8.85-46.54C366.55 31.936 328.86 0 271.28 0c-61.607 0-58.093 94.933-71.76 108.6-22.747 22.747-49.615 66.447-68.76 83.4H32c-17.673 0-32 14.327-32 32v240c0 17.673 14.327 32 32 32h64c14.893 0 27.408-10.174 30.978-23.95 44.509 1.001 75.06 39.94 177.802 39.94 7.22 0 15.22.01 22.22.01 77.117 0 111.986-39.423 112.94-95.33 13.319-18.425 20.299-43.122 17.34-66.99 9.854-18.452 13.664-40.343 8.99-62.99zm-61.75 53.83c12.56 21.13 1.26 49.41-13.94 57.57 7.7 48.78-17.608 65.9-53.12 65.9h-37.82c-71.639 0-118.029-37.82-171.64-37.82V240h10.92c28.36 0 67.98-70.89 94.54-97.46 28.36-28.36 18.91-75.63 37.82-94.54 47.27 0 47.27 32.98 47.27 56.73 0 39.17-28.36 56.72-28.36 94.54h103.99c21.11 0 37.73 18.91 37.82 37.82.09 18.9-12.82 37.81-22.27 37.81 13.489 14.555 16.371 45.236-5.21 65.62zM88 432c0 13.255-10.745 24-24 24s-24-10.745-24-24 10.745-24 24-24 24 10.745 24 24z') + + g#icon-close(fill='currentColor') + // 0 0 24 24 + path(d='M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z') + + g#icon-comment(fill='currentColor') + // 0 0 24 24 + path(d='M16 11H8V9H16V11M22 4V16C22 17.11 21.11 18 20 18H13.9L10.2 21.71C10 21.9 9.75 22 9.5 22H9C8.45 22 8 21.55 8 21V18H4C2.9 18 2 17.11 2 16V4C2 2.89 2.9 2 4 2H20C21.11 2 22 2.9 22 4M20 4H4V16H10V19.08L13.08 16H20V4') diff --git a/src/renderer/components/core/Player.vue b/src/renderer/components/core/Player.vue index 4cdb2237..b9aa6405 100644 --- a/src/renderer/components/core/Player.vue +++ b/src/renderer/components/core/Player.vue @@ -66,7 +66,9 @@ div(:class="$style.player") core-player-detail(v-if="isShowPlayerDetail" :musicInfo="listId == 'download' ? targetSong.musicInfo : targetSong" :lyric="lyric" :list="list" :listId="listId" :playInfo="{ nowPlayTimeStr, maxPlayTimeStr, progress, nowPlayTime, status }" - :isPlay="isPlay" @action="handlePlayDetailAction") + :isPlay="isPlay" @action="handlePlayDetailAction" + :nextTogglePlayName="nextTogglePlayName" + @toggle-next-play-mode="toggleNextPlayMode" @add-music-to="addMusicTo") material-list-add-modal(:show="isShowAddMusicTo" :musicInfo="listId == 'download' ? targetSong.musicInfo : targetSong" @close="isShowAddMusicTo = false") svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' style="display: none;") diff --git a/src/renderer/components/core/PlayerDetail.vue b/src/renderer/components/core/PlayerDetail.vue index d697ae8e..7dea972a 100644 --- a/src/renderer/components/core/PlayerDetail.vue +++ b/src/renderer/components/core/PlayerDetail.vue @@ -21,7 +21,7 @@ //- div(:class="$style.info") div(:class="$style.info") img(:class="$style.img" :src="musicInfo.img" v-if="musicInfo.img") - div(:class="$style.description" @click="handleShowComment") + div(:class="$style.description") p {{$t('core.player.name')}}{{musicInfo.name}} p {{$t('core.player.singer')}}{{musicInfo.singer}} p(v-if="musicInfo.album") {{$t('core.player.album')}}{{musicInfo.album}} @@ -32,21 +32,28 @@ p(v-for="(info, index) in lyricLines" :key="index" :class="lyric.line == index ? $style.lrcActive : null") {{info.text}} div(:class="$style.lyricSpace") - div(:class="$style.comment") - div(:class="$style.commentHeader" @click="isShowComment = false") - h3 {{title}} - div.scroll(:class="$style.commentMain" ref="dom_comment") - div(v-if="comment.page == 1") - h2(:class="$style.commentType") 热门评论 - material-comment-floor(v-if="comment.hotComments.length" :class="$style.reply_floor" :comments="comment.hotComments") - div - h2(:class="$style.commentType") 最新评论 - material-comment-floor(v-if="comment.comments.length" :class="$style.reply_floor" :comments="comment.comments") - div(:class="$style.pagination") - material-pagination(:count="comment.total" :btnLength="5" :limit="comment.limit" :page="comment.page" @btn-click="handleToggleCommentPage") + material-music-comment(:class="$style.comment" :titleFormat="this.setting.download.fileName" :musicInfo="musicInfo" v-model="isShowComment") div(:class="$style.footer") - div(:class="$style.left") + div(:class="$style.footerLeft") + div(:class="$style.footerLeftControlBtns") + div(:class="[$style.footerLeftControlBtn, isShowComment ? $style.active : null]" @click="isShowComment = !isShowComment" :tips="$t('core.player.comment_show')") + svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' width='95%' viewBox='0 0 24 24' space='preserve') + use(xlink:href='#icon-comment') + div(:class="$style.footerLeftControlBtn" @click="$emit('toggle-next-play-mode')" :tips="nextTogglePlayName") + svg(v-if="setting.player.togglePlayMethod == 'listLoop'" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' viewBox='0 0 24 24' space='preserve') + use(xlink:href='#icon-list-loop') + svg(v-else-if="setting.player.togglePlayMethod == 'random'" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' viewBox='0 0 24 24' space='preserve') + use(xlink:href='#icon-list-random') + svg(v-else-if="setting.player.togglePlayMethod == 'list'" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' width='120%' viewBox='0 0 24 24' space='preserve') + use(xlink:href='#icon-list-order') + svg(v-else-if="setting.player.togglePlayMethod == 'singleLoop'" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' width='110%' viewBox='0 0 24 24' space='preserve') + use(xlink:href='#icon-single-loop') + svg(v-else version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' width='120%' viewBox='0 0 24 24' space='preserve') + use(xlink:href='#icon-single') + div(:class="$style.footerLeftControlBtn" @click="$emit('add-music-to', musicInfo)" :tips="$t('core.player.add_music_to')") + svg(version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' viewBox='0 0 512 512' space='preserve') + use(xlink:href='#icon-add-2') div(:class="$style.progressContainer") div(:class="$style.progressContent") div(:class="$style.progress") @@ -80,7 +87,6 @@ import { mapGetters, mapMutations } from 'vuex' import { base as eventBaseName } from '../../event/names' import { scrollTo } from '../../utils' -import music from '../../utils/music' let cancelScrollFn = null @@ -137,6 +143,7 @@ export default { type: Boolean, default: false, }, + nextTogglePlayName: String, }, watch: { // 'musicInfo.img': { @@ -219,47 +226,6 @@ export default { lyricLines: [], isSetedLines: false, isShowComment: false, - comment: { - musicInfo: { - name: '', - singer: '', - }, - page: 1, - total: 10, - maxPage: 1, - limit: 20, - comments: [ - // { - // text: ['123123hhh'], - // userName: 'dsads', - // avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', - // time: '2020-10-22 22:14:17', - // timeStr: '2020-10-22 22:14:17', - // likedCount: 100, - // reply: [], - // }, - ], - hotComments: [ - // { - // text: ['123123hhh'], - // userName: 'dsads', - // avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', - // time: '2020-10-22 22:14:17', - // timeStr: '2020-10-22 22:14:17', - // likedCount: 100, - // reply: [ - // { - // text: ['123123hhh'], - // userName: 'dsads', - // avatar: 'http://img4.kuwo.cn/star/userhead/39/52/1602393411654_512039239s.jpg', - // time: '2020-10-22 22:14:17', - // timeStr: '2020-10-22 22:14:17', - // likedCount: 100, - // }, - // ], - // }, - ], - }, } }, mounted() { @@ -279,11 +245,6 @@ export default { computed: { ...mapGetters(['setting']), ...mapGetters('player', ['isShowPlayerDetail']), - title() { - return this.comment.musicInfo.name - ? this.setting.download.fileName.replace('歌名', this.comment.musicInfo.name).replace('歌手', this.comment.musicInfo.singer) - : '^-^' - }, }, methods: { ...mapMutations('player', [ @@ -385,41 +346,6 @@ export default { close() { window.eventHub.$emit(eventBaseName.close) }, - handleShowComment() { - if (!this.musicInfo.songmid || !music[this.musicInfo.source].comment) return - if (this.musicInfo.songmid != this.comment.musicInfo.songmid) { - this.comment.page = 1 - this.comment.total = 0 - this.comment.maxPage = 1 - } - this.isShowComment = true - this.comment.musicInfo = this.musicInfo - music[this.comment.musicInfo.source].comment.getComment(this.comment.musicInfo, this.comment.page, this.comment.limit).then(comment => { - this.comment.comments = comment.comments - this.comment.total = comment.total - this.comment.maxPage = comment.maxPage - this.$nextTick(() => { - scrollTo(this.$refs.dom_comment, 0, 300, () => { - this.comment.comments = comment.comments - }) - }) - }) - music[this.comment.musicInfo.source].comment.getHotComment(this.comment.musicInfo, this.comment.page, this.comment.limit).then(hotComment => { - this.comment.hotComments = hotComment.comments - }) - }, - handleToggleCommentPage(page) { - music[this.comment.musicInfo.source].comment.getComment(this.comment.musicInfo, page, this.comment.limit).then(comment => { - this.comment.page = page - this.comment.total = comment.total - this.comment.maxPage = comment.maxPage - this.$nextTick(() => { - scrollTo(this.$refs.dom_comment, 0, 300, () => { - this.comment.comments = comment.comments - }) - }) - }) - }, }, } @@ -660,36 +586,8 @@ export default { .comment { flex: 0 0 0; - display: flex; - flex-flow: column nowrap; - transition: @transition-theme; - transition-property: flex-basis opacity; - overflow: hidden; opacity: 0; - -} -.commentHeader { - flex: none; - padding-bottom: 10px; - // border-bottom: 1px solid #eee; - h3 { - font-size: 14px; - } -} -.commentMain { - flex: auto; - padding-left: 15px; - padding-right: 10px; - background-color: @color-reply-floor; - border-radius: 4px; -} -.commentType { - padding: 10px 0; - font-size: 13px; - color: @color-theme_2-font; -} -.pagination { - padding: 10px 0; + margin-left: 10px; } .footer { @@ -698,7 +596,39 @@ export default { display: flex; align-items: center; } +.footerLeft { + flex: auto; + display: flex; + flex-flow: column nowrap; + padding: 13px; + overflow: hidden; +} +.footerLeftControlBtns { + color: @color-theme_2-font; + display: flex; + flex-flow: row nowrap; + justify-content: flex-end; +} +.footerLeftControlBtn { + width: 18px; + height: 18px; + opacity: .5; + cursor: pointer; + transition: opacity @transition-theme; + &:hover { + opacity: .9; + } + + +.footerLeftControlBtn { + margin-left: 6px; + } + + &.active { + color: @color-theme; + opacity: .8; + } +} .progress-container { width: 100%; position: relative; @@ -757,6 +687,7 @@ export default { } .time-label { width: 100%; + height: 18px; display: flex; justify-content: space-between; span { @@ -806,6 +737,9 @@ each(@themes, { border-left-color: ~'@{color-@{value}-theme}'; background-color: ~'@{color-@{value}-theme_2-background_1}'; } + .leftControlBtns { + color: ~'@{color-@{value}-theme_2-font}'; + } .right { &:before { background-image: linear-gradient(0deg,rgba(255,255,255,0) 0%,~'@{color-@{value}-theme_2-background_1}' 95%); diff --git a/src/renderer/components/material/CommentFloor.vue b/src/renderer/components/material/CommentFloor.vue index 1c6cf26c..8abfbf31 100644 --- a/src/renderer/components/material/CommentFloor.vue +++ b/src/renderer/components/material/CommentFloor.vue @@ -85,6 +85,7 @@ export default { flex-flow: row nowrap; align-items: flex-end; min-width: 0; + color: @color-theme_2-font-label; } .name { flex: 0 1 auto; @@ -93,14 +94,12 @@ export default { } .time { flex: none; - color: @color-theme_2-font-label; font-size: 11px; margin-left: 5px; } .likes { flex: 1 0 auto; margin-left: 10px; - color: @color-theme_2-font-label; font-size: 11px; align-self: flex-end; text-align: right; @@ -138,4 +137,25 @@ export default { background-color: @color-reply-floor; } + +each(@themes, { + :global(#container.@{value}) { + .listItem { + border-bottom-color: ~'@{color-@{value}-theme_2-active}'; + } + .content { + color: ~'@{color-@{value}-theme_2-font}'; + } + .info { + color: ~'@{color-@{value}-theme_2-font-label}'; + } + .likesIcon { + color: ~'@{color-@{value}-theme-active}'; + } + .reply_floor { + background-color: ~'@{color-@{value}-reply-floor}'; + } + } +}) + diff --git a/src/renderer/components/material/MusicComment.vue b/src/renderer/components/material/MusicComment.vue new file mode 100644 index 00000000..b45e66a6 --- /dev/null +++ b/src/renderer/components/material/MusicComment.vue @@ -0,0 +1,268 @@ + + + + + diff --git a/src/renderer/lang/en-us/base.json b/src/renderer/lang/en-us/base.json new file mode 100644 index 00000000..09199968 --- /dev/null +++ b/src/renderer/lang/en-us/base.json @@ -0,0 +1,5 @@ +{ + "date_format_second": "{num} seconds ago", + "date_format_minute": "{num} minutes ago", + "date_format_hour": "{num} hours ago" +} diff --git a/src/renderer/lang/en-us/core/player.json b/src/renderer/lang/en-us/core/player.json index 64cc68c1..2de3604c 100644 --- a/src/renderer/lang/en-us/core/player.json +++ b/src/renderer/lang/en-us/core/player.json @@ -27,5 +27,16 @@ "play_toggle_mode_random": "List Random", "play_toggle_mode_list": "Play in order", "play_toggle_mode_single_loop": "Single Loop", - "play_toggle_mode_off": "Disable" + "play_toggle_mode_off": "Disable", + + "comment_show": "Show song comments", + "comment_hot_loading": "Hot comments are loading", + "comment_new_loading": "Latest comments are loading", + "comment_hot_load_error": "Hot comments failed to load, click to try to reload", + "comment_new_load_error": "The latest comment failed to load, click to try to reload", + "comment_refresh": "Refresh comments", + "comment_no_content": "No comments yet", + "comment_hot_title": "Hot Comment", + "comment_new_title": "Latest comment", + "comment_title": "{name} comment" } diff --git a/src/renderer/lang/zh-cn/base.json b/src/renderer/lang/zh-cn/base.json new file mode 100644 index 00000000..6a12f4bf --- /dev/null +++ b/src/renderer/lang/zh-cn/base.json @@ -0,0 +1,5 @@ +{ + "date_format_second": "{num}秒前", + "date_format_minute": "{num}分钟前", + "date_format_hour": "{num}小时前" +} diff --git a/src/renderer/lang/zh-cn/core/player.json b/src/renderer/lang/zh-cn/core/player.json index 31be9f68..bcdf2b7e 100644 --- a/src/renderer/lang/zh-cn/core/player.json +++ b/src/renderer/lang/zh-cn/core/player.json @@ -27,5 +27,16 @@ "play_toggle_mode_random": "列表随机", "play_toggle_mode_list": "顺序播放", "play_toggle_mode_single_loop": "单曲循环", - "play_toggle_mode_off": "禁用" + "play_toggle_mode_off": "禁用", + + "comment_show": "显示歌曲评论", + "comment_hot_loading": "热门评论加载中", + "comment_new_loading": "最新评论加载中", + "comment_hot_load_error": "热门评论加载失败,点击尝试重新加载", + "comment_new_load_error": "最新评论加载失败,点击尝试重新加载", + "comment_refresh": "刷新评论", + "comment_no_content": "暂无评论", + "comment_hot_title": "热门评论", + "comment_new_title": "最新评论", + "comment_title": "{name} 的评论" } diff --git a/src/renderer/lang/zh-tw/base.json b/src/renderer/lang/zh-tw/base.json new file mode 100644 index 00000000..8c323e89 --- /dev/null +++ b/src/renderer/lang/zh-tw/base.json @@ -0,0 +1,5 @@ +{ + "date_format_second": "{num}秒前", + "date_format_minute": "{num}分鐘前", + "date_format_hour": "{num}小時前" +} diff --git a/src/renderer/lang/zh-tw/core/player.json b/src/renderer/lang/zh-tw/core/player.json index c727ccb0..05eaa62c 100644 --- a/src/renderer/lang/zh-tw/core/player.json +++ b/src/renderer/lang/zh-tw/core/player.json @@ -27,5 +27,16 @@ "play_toggle_mode_random": "列表隨機", "play_toggle_mode_list": "順序播放", "play_toggle_mode_single_loop": "單曲循環", - "play_toggle_mode_off": "禁用" + "play_toggle_mode_off": "禁用", + + "comment_show": "顯示歌曲評論", + "comment_hot_loading": "熱門評論加載中", + "comment_new_loading": "最新評論加載中", + "comment_hot_load_error": "熱門評論加載失敗,點擊嘗試重新加載", + "comment_new_load_error": "最新評論加載失敗,點擊嘗試重新加載", + "comment_refresh": "刷新評論", + "comment_no_content": "暫無評論", + "comment_hot_title": "熱門評論", + "comment_new_title": "最新評論", + "comment_title": "{name} 的評論" } diff --git a/src/renderer/utils/index.js b/src/renderer/utils/index.js index ad84275e..2c73e0fd 100644 --- a/src/renderer/utils/index.js +++ b/src/renderer/utils/index.js @@ -43,11 +43,11 @@ export const dateFormat = (date = new Date(), format = 'YYYY-MM-DD hh:mm:ss') => export const dateFormat2 = time => { let differ = parseInt((Date.now() - time) / 1000) if (differ < 60) { - return differ + '秒前' + return window.i18n.t('base.date_format_second', { num: differ }) } else if (differ < 3600) { - return parseInt(differ / 60) + '分钟前' + return window.i18n.t('base.date_format_minute', { num: parseInt(differ / 60) }) } else if (differ < 86400) { - return parseInt(differ / 3600) + '小时前' + return window.i18n.t('base.date_format_hour', { num: parseInt(differ / 3600) }) } else { return dateFormat(time) } diff --git a/src/renderer/utils/music/kg/comment.js b/src/renderer/utils/music/kg/comment.js index 44f2fb8d..71515fc1 100644 --- a/src/renderer/utils/music/kg/comment.js +++ b/src/renderer/utils/music/kg/comment.js @@ -15,10 +15,10 @@ export default { const { body, statusCode } = await _requestObj.promise // console.log(body) if (statusCode != 200 || body.err_code !== 0) throw new Error('获取评论失败') - return { source: 'kg', comments: this.filterComment(body.list), total: body.count, page, limit, maxPage: Math.ceil(body.count / limit) || 1 } + return { source: 'kg', comments: this.filterComment(body.list || []), total: body.count, page, limit, maxPage: Math.ceil(body.count / limit) || 1 } }, async getHotComment({ hash, songmid }, page = 1, limit = 100) { - console.log(songmid) + // console.log(songmid) if (this._requestObj2) this._requestObj2.cancelHttp() const _requestObj2 = httpFetch(`http://comment.service.kugou.com/index.php?r=commentsv2/getCommentWithLike&code=fc4be23b4e972707f36b8a828a93ba8a&extdata=${hash}&p=${page}&pagesize=${limit}&ver=1.01&clientver=8373&appid=1001&kugouid=687373022`, { @@ -29,7 +29,7 @@ export default { const { body, statusCode } = await _requestObj2.promise // console.log(body) if (statusCode != 200 || body.err_code !== 0) throw new Error('获取热门评论失败') - return { source: 'kg', comments: this.filterComment(body.weightList) } + return { source: 'kg', comments: this.filterComment(body.weightList || []) } }, async getReplyComment({ songmid }, replyId, page = 1, limit = 100) { if (this._requestObj2) this._requestObj2.cancelHttp() @@ -42,7 +42,7 @@ export default { const { body, statusCode } = await _requestObj2.promise // console.log(body) if (statusCode != 200 || body.err_code !== 0) throw new Error('获取回复评论失败') - return { source: 'kg', comments: this.filterComment(body.list) } + return { source: 'kg', comments: this.filterComment(body.list || []) } }, filterComment(rawList) { return rawList.map(item => { diff --git a/src/renderer/utils/music/tx/comment.js b/src/renderer/utils/music/tx/comment.js index 31874017..23c3a4e7 100644 --- a/src/renderer/utils/music/tx/comment.js +++ b/src/renderer/utils/music/tx/comment.js @@ -161,7 +161,7 @@ export default { return { id: item.subcommentid, rootId: item.rootcommentid, - text: item.rootcommentcontent ? this.replaceEmoji(item.rootcommentcontent).split('\n') : [], + text: item.rootcommentcontent ? this.replaceEmoji(item.rootcommentcontent).replace(/\\\n/g, '\n').split('\n') : [], time, timeStr: time ? dateFormat2(time) : null, userName: item.rootcommentnick ? item.rootcommentnick.substring(1) : '', @@ -172,7 +172,7 @@ export default { let index = c.subcommentid.lastIndexOf('_') return { id: c.subcommentid, - text: this.replaceEmoji(c.subcommentcontent).split('\n'), + text: this.replaceEmoji(c.subcommentcontent).replace(/\\\n/g, '\n').split('\n'), time: parseInt(c.subcommentid.substring(index + 1) + '000'), timeStr: dateFormat2(parseInt(c.subcommentid.substring(index + 1) + '000')), userName: c.replynick.substring(1), From dec1b24c86367a2f5532d1b1b21e3c909bd282c0 Mon Sep 17 00:00:00 2001 From: lyswhut Date: Wed, 28 Oct 2020 11:02:21 +0800 Subject: [PATCH 05/14] =?UTF-8?q?=E4=BF=AE=E6=AD=A3=E9=94=99=E5=88=AB?= =?UTF-8?q?=E5=AD=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 93febdc8..a9d6fd8e 100644 --- a/README.md +++ b/README.md @@ -100,7 +100,7 @@ npm run pack:linux 5. 由于使用本项目产生的包括由于本协议或由于使用或无法使用本项目而引起的任何性质的任何直接、间接、特殊、偶然或结果性损害(包括但不限于因商誉损失、停工、计算机故障或故障引起的损害赔偿,或任何及所有其他商业损害或损失)由使用者负责。 6. 本项目完全免费,且开源发布于 GitHub 面向全世界人用作对技术的学习交流,本项目不对项目内的技术可能存在违反当地法律法规的行为作保证,**禁止在违反当地法律法规的情况下使用本项目**,对于使用者在明知或不知当地法律法规不允许的情况下使用本项目所造成的任何违法违规行为由使用者承担,本项目不承担由此造成的任何直接、间接、特殊、偶然或结果性责任。 -若你使用了本项目,将代表你接收以上协议。 +若你使用了本项目,将代表你接受以上协议。 音乐平台不易,请尊重版权,支持正版。
    若对此有疑问请 mail to: lyswhut+qq.com (请将`+`替换成`@`) From 93064bb18b3dadf956c034c565611fd5f916c1bd Mon Sep 17 00:00:00 2001 From: lyswhut Date: Thu, 29 Oct 2020 09:07:25 +0800 Subject: [PATCH 06/14] =?UTF-8?q?=E5=AE=8C=E5=96=84=E8=AF=84=E8=AE=BA?= =?UTF-8?q?=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/renderer/components/core/Player.vue | 4 ++-- src/renderer/components/core/PlayerDetail.vue | 11 ++++++++--- src/renderer/components/material/MusicComment.vue | 2 +- src/renderer/utils/music/kw/comment.js | 3 ++- 4 files changed, 13 insertions(+), 7 deletions(-) diff --git a/src/renderer/components/core/Player.vue b/src/renderer/components/core/Player.vue index b9aa6405..9f6d9053 100644 --- a/src/renderer/components/core/Player.vue +++ b/src/renderer/components/core/Player.vue @@ -17,9 +17,9 @@ div(:class="$style.player") div(:class="$style.volumeMask" @mousedown="handleVolumeMsDown" ref="dom_volumeMask" :tips="`${$t('core.player.volume')}${parseInt(volume * 100)}%`") div(:class="$style.titleBtn" @click='toggleDesktopLyric' @contextmenu="handleToggleLockDesktopLyric" :tips="toggleDesktopLyricBtnTitle") svg(v-if="setting.desktopLyric.enable" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 512 512' space='preserve') - use(xlink:href='#icon-desktop-lyric-off') - svg(v-else version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 512 512' space='preserve') use(xlink:href='#icon-desktop-lyric-on') + svg(v-else version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='100%' viewBox='0 0 512 512' space='preserve') + use(xlink:href='#icon-desktop-lyric-off') div(:class="$style.titleBtn" @click='toggleNextPlayMode' :tips="nextTogglePlayName") svg(v-if="setting.player.togglePlayMethod == 'listLoop'" version='1.1' xmlns='http://www.w3.org/2000/svg' xlink='http://www.w3.org/1999/xlink' height='80%' viewBox='0 0 24 24' space='preserve') use(xlink:href='#icon-list-loop') diff --git a/src/renderer/components/core/PlayerDetail.vue b/src/renderer/components/core/PlayerDetail.vue index 7dea972a..2aad7d09 100644 --- a/src/renderer/components/core/PlayerDetail.vue +++ b/src/renderer/components/core/PlayerDetail.vue @@ -737,9 +737,6 @@ each(@themes, { border-left-color: ~'@{color-@{value}-theme}'; background-color: ~'@{color-@{value}-theme_2-background_1}'; } - .leftControlBtns { - color: ~'@{color-@{value}-theme_2-font}'; - } .right { &:before { background-image: linear-gradient(0deg,rgba(255,255,255,0) 0%,~'@{color-@{value}-theme_2-background_1}' 95%); @@ -775,6 +772,14 @@ each(@themes, { .lrc-active { color: ~'@{color-@{value}-theme}'; } + .footerLeftControlBtns { + color: ~'@{color-@{value}-theme_2-font}'; + } + .footerLeftControlBtn { + &.active { + color: ~'@{color-@{value}-theme}'; + } + } .progress { background-color: ~'@{color-@{value}-player-progress}'; } diff --git a/src/renderer/components/material/MusicComment.vue b/src/renderer/components/material/MusicComment.vue index b45e66a6..fc63e7eb 100644 --- a/src/renderer/components/material/MusicComment.vue +++ b/src/renderer/components/material/MusicComment.vue @@ -165,8 +165,8 @@ export default { this.isShowComment = true this.currentMusicInfo = this.musicInfo + if (this.page == 1) this.handleGetHotComment(this.currentMusicInfo) this.handleGetNewComment(this.currentMusicInfo, this.page, this.limit) - this.handleGetHotComment(this.currentMusicInfo) }, handleToggleCommentPage(page) { this.nextPage = page diff --git a/src/renderer/utils/music/kw/comment.js b/src/renderer/utils/music/kw/comment.js index ec265945..99f160b4 100644 --- a/src/renderer/utils/music/kw/comment.js +++ b/src/renderer/utils/music/kw/comment.js @@ -14,7 +14,7 @@ export default { }) const { body, statusCode } = await _requestObj.promise if (statusCode != 200 || body.result !== 'ok') throw new Error('获取评论失败') - console.log(body) + // console.log(body) return { source: 'kw', comments: this.filterComment(body.rows), total: body.total, page, limit, maxPage: Math.ceil(body.total / limit) || 1 } }, async getHotComment({ songmid }, page = 1, limit = 100) { @@ -31,6 +31,7 @@ export default { return { source: 'kw', comments: this.filterComment(body.rows) } }, filterComment(rawList) { + if (!rawList) return [] return rawList.map(item => { let data = { id: item.id, From d55c65e275fdf7e86494556848e814b640d71e6b Mon Sep 17 00:00:00 2001 From: lyswhut Date: Thu, 29 Oct 2020 09:08:39 +0800 Subject: [PATCH 07/14] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E4=BE=9D=E8=B5=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 128 +++++++++++++++++-------------------- package.json | 18 +++--- src/main/utils/flacMeta.js | 4 +- 3 files changed, 70 insertions(+), 80 deletions(-) diff --git a/package-lock.json b/package-lock.json index 0e5b9c0f..3d7bf4ce 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "lx-music-desktop", - "version": "1.2.1", + "version": "1.3.0", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -2716,9 +2716,9 @@ } }, "@eslint/eslintrc": { - "version": "0.1.3", - "resolved": "https://registry.npm.taobao.org/@eslint/eslintrc/download/@eslint/eslintrc-0.1.3.tgz?cache=0&sync_timestamp=1598984683755&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40eslint%2Feslintrc%2Fdownload%2F%40eslint%2Feslintrc-0.1.3.tgz", - "integrity": "sha1-fRorI1hVLMBINMCXm9QnU2LjcIU=", + "version": "0.2.1", + "resolved": "https://registry.npm.taobao.org/@eslint/eslintrc/download/@eslint/eslintrc-0.2.1.tgz?cache=0&sync_timestamp=1603766307701&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40eslint%2Feslintrc%2Fdownload%2F%40eslint%2Feslintrc-0.2.1.tgz", + "integrity": "sha1-9yBpwzBGGgZoTRGThENeEqXXbjw=", "dev": true, "requires": { "ajv": "^6.12.4", @@ -3009,9 +3009,9 @@ "dev": true }, "@vue/component-compiler-utils": { - "version": "3.1.2", - "resolved": "https://registry.npmjs.org/@vue/component-compiler-utils/-/component-compiler-utils-3.1.2.tgz", - "integrity": "sha512-QLq9z8m79mCinpaEeSURhnNCN6djxpHw0lpP/bodMlt5kALfONpryMthvnrQOlTcIKoF+VoPi+lPHUYeDFPXug==", + "version": "3.2.0", + "resolved": "https://registry.npm.taobao.org/@vue/component-compiler-utils/download/@vue/component-compiler-utils-3.2.0.tgz", + "integrity": "sha1-j4UYLO7Sjps8dTE95mn4MWbRHl0=", "dev": true, "requires": { "consolidate": "^0.15.1", @@ -3027,8 +3027,8 @@ "dependencies": { "lru-cache": { "version": "4.1.5", - "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-4.1.5.tgz", - "integrity": "sha512-sWZlbEP2OsHNkXrMl5GYk/jKk70MBng6UU4YI/qGDYbgf6YbP4EvmqISbXCoJiRKs+1bSpFHVgQxvJ17F2li5g==", + "resolved": "https://registry.npm.taobao.org/lru-cache/download/lru-cache-4.1.5.tgz?cache=0&sync_timestamp=1594427567713&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Flru-cache%2Fdownload%2Flru-cache-4.1.5.tgz", + "integrity": "sha1-i75Q6oW+1ZvJ4z3KuCNe6bz0Q80=", "dev": true, "requires": { "pseudomap": "^1.0.2", @@ -3037,8 +3037,8 @@ }, "source-map": { "version": "0.6.1", - "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", - "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==", + "resolved": "https://registry.npm.taobao.org/source-map/download/source-map-0.6.1.tgz", + "integrity": "sha1-dHIq8y6WFOnCh6jQu95IteLxomM=", "dev": true }, "yallist": { @@ -5837,8 +5837,8 @@ }, "consolidate": { "version": "0.15.1", - "resolved": "https://registry.npmjs.org/consolidate/-/consolidate-0.15.1.tgz", - "integrity": "sha512-DW46nrsMJgy9kqAbPt5rKaCr7uFtpo4mSUvLHIUbJEjm0vo+aY5QLwBUq3FK4tRnJr/X0Psc0C4jf/h+HtXSMw==", + "resolved": "https://registry.npm.taobao.org/consolidate/download/consolidate-0.15.1.tgz?cache=0&sync_timestamp=1599596647062&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fconsolidate%2Fdownload%2Fconsolidate-0.15.1.tgz", + "integrity": "sha1-IasEMjXHGgfUXZqtmFk7DbpWurc=", "dev": true, "requires": { "bluebird": "^3.1.1" @@ -7081,9 +7081,9 @@ } }, "electron": { - "version": "9.3.2", - "resolved": "https://registry.npm.taobao.org/electron/download/electron-9.3.2.tgz?cache=0&sync_timestamp=1602791331702&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Felectron%2Fdownload%2Felectron-9.3.2.tgz", - "integrity": "sha1-r6KULiZC7iW0IrkPFJf32bvuxVA=", + "version": "9.3.3", + "resolved": "https://registry.npm.taobao.org/electron/download/electron-9.3.3.tgz", + "integrity": "sha1-maZhnV32j5dpel0dgu86imP83zY=", "dev": true, "requires": { "@electron/get": "^1.0.1", @@ -7092,9 +7092,9 @@ }, "dependencies": { "@types/node": { - "version": "12.12.68", - "resolved": "https://registry.npm.taobao.org/@types/node/download/@types/node-12.12.68.tgz?cache=0&sync_timestamp=1602874228094&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40types%2Fnode%2Fdownload%2F%40types%2Fnode-12.12.68.tgz", - "integrity": "sha1-3VrPSlKkWP8dnvT9ZkBvugr7uzM=", + "version": "12.19.2", + "resolved": "https://registry.npm.taobao.org/@types/node/download/@types/node-12.19.2.tgz", + "integrity": "sha1-lWXtXHK6lgOPw63WQ+3V54IFmOc=", "dev": true } } @@ -7521,13 +7521,13 @@ "dev": true }, "eslint": { - "version": "7.11.0", - "resolved": "https://registry.npm.taobao.org/eslint/download/eslint-7.11.0.tgz", - "integrity": "sha1-qvLSOgtfHWUqCO2s6gwZ9/rcCzs=", + "version": "7.12.1", + "resolved": "https://registry.npm.taobao.org/eslint/download/eslint-7.12.1.tgz?cache=0&sync_timestamp=1603768145986&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Feslint%2Fdownload%2Feslint-7.12.1.tgz", + "integrity": "sha1-vZqB+memz9UWVs24iBLOSczsWAE=", "dev": true, "requires": { "@babel/code-frame": "^7.0.0", - "@eslint/eslintrc": "^0.1.3", + "@eslint/eslintrc": "^0.2.1", "ajv": "^6.10.0", "chalk": "^4.0.0", "cross-spawn": "^7.0.2", @@ -8060,9 +8060,9 @@ "dev": true }, "eslint-plugin-standard": { - "version": "4.0.1", - "resolved": "https://registry.npmjs.org/eslint-plugin-standard/-/eslint-plugin-standard-4.0.1.tgz", - "integrity": "sha512-v/KBnfyaOMPmZc/dmc6ozOdWqekGp7bBGq4jLAecEfPGmfKiWS4sA8sC0LqiV9w5qmXAtXVn4M3p1jSyhY85SQ==", + "version": "4.0.2", + "resolved": "https://registry.npm.taobao.org/eslint-plugin-standard/download/eslint-plugin-standard-4.0.2.tgz?cache=0&sync_timestamp=1603323739415&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Feslint-plugin-standard%2Fdownload%2Feslint-plugin-standard-4.0.2.tgz", + "integrity": "sha1-AhIRqfB35jpoR+e7mrQkcyesjgw=", "dev": true }, "eslint-scope": { @@ -8629,9 +8629,9 @@ } }, "file-loader": { - "version": "6.1.1", - "resolved": "https://registry.npm.taobao.org/file-loader/download/file-loader-6.1.1.tgz", - "integrity": "sha1-pvKd+z9ZM6HDULLbqiCsW+BTm6o=", + "version": "6.2.0", + "resolved": "https://registry.npm.taobao.org/file-loader/download/file-loader-6.2.0.tgz?cache=0&sync_timestamp=1603816843418&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ffile-loader%2Fdownload%2Ffile-loader-6.2.0.tgz", + "integrity": "sha1-uu98+OGEDfMl5DkLRISHlIDuvk0=", "dev": true, "requires": { "loader-utils": "^2.0.0", @@ -10380,9 +10380,9 @@ "dev": true }, "image-size": { - "version": "0.9.1", - "resolved": "https://registry.npmjs.org/image-size/-/image-size-0.9.1.tgz", - "integrity": "sha512-yBo6xGGjiWtApYroCGR9wTvaIgande5vmAfTYIld5ss5kN4tyDG5lrW1qGomOXgB05ss7GLXLpDYXEiFqSqkzg==", + "version": "0.9.3", + "resolved": "https://registry.npm.taobao.org/image-size/download/image-size-0.9.3.tgz?cache=0&sync_timestamp=1603729042810&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fimage-size%2Fdownload%2Fimage-size-0.9.3.tgz", + "integrity": "sha1-9+/OawoWSbRLm8Q7nZpazyciZLY=", "requires": { "queue": "6.0.1" } @@ -11514,8 +11514,8 @@ }, "merge-source-map": { "version": "1.1.0", - "resolved": "https://registry.npmjs.org/merge-source-map/-/merge-source-map-1.1.0.tgz", - "integrity": "sha512-Qkcp7P2ygktpMPh2mCQZaf3jhN6D3Z/qVZHSdWvQ+2Ef5HgRAPBO57A77+ENm0CPx2+1Ce/MYKi3ymqdfuqibw==", + "resolved": "https://registry.npm.taobao.org/merge-source-map/download/merge-source-map-1.1.0.tgz", + "integrity": "sha1-L93n5gIJOfcJBqaPLXrmheTIxkY=", "dev": true, "requires": { "source-map": "^0.6.1" @@ -11523,8 +11523,8 @@ "dependencies": { "source-map": { "version": "0.6.1", - "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", - "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==", + "resolved": "https://registry.npm.taobao.org/source-map/download/source-map-0.6.1.tgz", + "integrity": "sha1-dHIq8y6WFOnCh6jQu95IteLxomM=", "dev": true } } @@ -11945,21 +11945,11 @@ "dev": true }, "node-id3": { - "version": "0.1.19", - "resolved": "https://registry.npm.taobao.org/node-id3/download/node-id3-0.1.19.tgz", - "integrity": "sha1-cQAMuCna3HYQAKSBAV5T88ydqto=", + "version": "0.2.0", + "resolved": "https://registry.npm.taobao.org/node-id3/download/node-id3-0.2.0.tgz", + "integrity": "sha1-42U1zpQFFI/ciEh+NXH6Xbv3pV0=", "requires": { - "iconv-lite": "0.5.1" - }, - "dependencies": { - "iconv-lite": { - "version": "0.5.1", - "resolved": "https://registry.npm.taobao.org/iconv-lite/download/iconv-lite-0.5.1.tgz?cache=0&sync_timestamp=1594184250387&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ficonv-lite%2Fdownload%2Ficonv-lite-0.5.1.tgz", - "integrity": "sha1-skJdPHsY9yGfLKZj0QO925FxjWQ=", - "requires": { - "safer-buffer": ">= 2.1.2 < 3" - } - } + "iconv-lite": "0.6.2" } }, "node-libs-browser": { @@ -13374,8 +13364,8 @@ }, "prettier": { "version": "1.19.1", - "resolved": "https://registry.npmjs.org/prettier/-/prettier-1.19.1.tgz", - "integrity": "sha512-s7PoyDv/II1ObgQunCbB9PdLmUcBZcnWOcxDh7O0N/UwDEsHyqkW+Qh28jW+mVuCdx7gLB0BotYI1Y6uI9iyew==", + "resolved": "https://registry.npm.taobao.org/prettier/download/prettier-1.19.1.tgz?cache=0&sync_timestamp=1600215482255&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fprettier%2Fdownload%2Fprettier-1.19.1.tgz", + "integrity": "sha1-99f1/4qc2HKnvkyhQglZVqYHl8s=", "dev": true, "optional": true }, @@ -13740,8 +13730,8 @@ }, "queue": { "version": "6.0.1", - "resolved": "https://registry.npmjs.org/queue/-/queue-6.0.1.tgz", - "integrity": "sha512-AJBQabRCCNr9ANq8v77RJEv73DPbn55cdTb+Giq4X0AVnNVZvMHlYp7XlQiN+1npCZj1DuSmaA2hYVUUDgxFDg==", + "resolved": "https://registry.npm.taobao.org/queue/download/queue-6.0.1.tgz", + "integrity": "sha1-q9WlsDdpEvBwolcp4Lan1WVoN5E=", "requires": { "inherits": "~2.0.3" } @@ -16716,19 +16706,19 @@ }, "vue-hot-reload-api": { "version": "2.3.4", - "resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz", - "integrity": "sha512-BXq3jwIagosjgNVae6tkHzzIk6a8MHFtzAdwhnV5VlvPTFxDCvIttgSiHWjdGoTJvXtmRu5HacExfdarRcFhog==", + "resolved": "https://registry.npm.taobao.org/vue-hot-reload-api/download/vue-hot-reload-api-2.3.4.tgz", + "integrity": "sha1-UylVzB6yCKPZkLOp+acFdGV+CPI=", "dev": true }, "vue-i18n": { - "version": "8.22.0", - "resolved": "https://registry.npm.taobao.org/vue-i18n/download/vue-i18n-8.22.0.tgz?cache=0&sync_timestamp=1602001179053&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fvue-i18n%2Fdownload%2Fvue-i18n-8.22.0.tgz", - "integrity": "sha1-ZAM4Gm6rHSKeUVpirdspsv86v+0=" + "version": "8.22.1", + "resolved": "https://registry.npm.taobao.org/vue-i18n/download/vue-i18n-8.22.1.tgz", + "integrity": "sha1-ud0Jihfh9a25G9+WEfA4UxDafLE=" }, "vue-loader": { - "version": "15.9.3", - "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.9.3.tgz", - "integrity": "sha512-Y67VnGGgVLH5Voostx8JBZgPQTlDQeOVBLOEsjc2cXbCYBKexSKEpOA56x0YZofoDOTszrLnIShyOX1p9uCEHA==", + "version": "15.9.4", + "resolved": "https://registry.npm.taobao.org/vue-loader/download/vue-loader-15.9.4.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fvue-loader%2Fdownload%2Fvue-loader-15.9.4.tgz", + "integrity": "sha1-wuzvihoIAqx2xtaGZBtd3lIq4mc=", "dev": true, "requires": { "@vue/component-compiler-utils": "^3.1.0", @@ -16739,14 +16729,14 @@ } }, "vue-router": { - "version": "3.4.7", - "resolved": "https://registry.npm.taobao.org/vue-router/download/vue-router-3.4.7.tgz", - "integrity": "sha1-vxibr9FvTk73g8SmJQowkPLB+hs=" + "version": "3.4.8", + "resolved": "https://registry.npm.taobao.org/vue-router/download/vue-router-3.4.8.tgz?cache=0&sync_timestamp=1603710629657&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fvue-router%2Fdownload%2Fvue-router-3.4.8.tgz", + "integrity": "sha1-LAYmHTXYB1iTRwNS1C1wtih7gZQ=" }, "vue-style-loader": { "version": "4.1.2", - "resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.2.tgz", - "integrity": "sha512-0ip8ge6Gzz/Bk0iHovU9XAUQaFt/G2B61bnWa2tCcqqdgfHs1lF9xXorFbE55Gmy92okFT+8bfmySuUOu13vxQ==", + "resolved": "https://registry.npm.taobao.org/vue-style-loader/download/vue-style-loader-4.1.2.tgz", + "integrity": "sha1-3t80mAbyXOtOZPOtfApE+6c1/Pg=", "dev": true, "requires": { "hash-sum": "^1.0.2", @@ -16765,8 +16755,8 @@ }, "vue-template-es2015-compiler": { "version": "1.9.1", - "resolved": "https://registry.npmjs.org/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz", - "integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==", + "resolved": "https://registry.npm.taobao.org/vue-template-es2015-compiler/download/vue-template-es2015-compiler-1.9.1.tgz", + "integrity": "sha1-HuO8mhbsv1EYvjNLsV+cRvgvWCU=", "dev": true }, "vuex": { diff --git a/package.json b/package.json index d0a1a5da..0788a113 100644 --- a/package.json +++ b/package.json @@ -176,11 +176,11 @@ "cross-env": "^7.0.2", "css-loader": "^4.3.0", "del": "^6.0.0", - "electron": "^9.3.2", + "electron": "^9.3.3", "electron-builder": "^22.9.1", "electron-debug": "^3.1.0", "electron-devtools-installer": "^3.1.1", - "eslint": "^7.11.0", + "eslint": "^7.12.1", "eslint-config-standard": "^14.1.1", "eslint-formatter-friendly": "^7.0.0", "eslint-loader": "^4.0.2", @@ -188,8 +188,8 @@ "eslint-plugin-import": "^2.22.1", "eslint-plugin-node": "^11.1.0", "eslint-plugin-promise": "^4.2.1", - "eslint-plugin-standard": "^4.0.1", - "file-loader": "^6.1.1", + "eslint-plugin-standard": "^4.0.2", + "file-loader": "^6.2.0", "friendly-errors-webpack-plugin": "^1.7.0", "html-webpack-plugin": "^4.5.0", "less": "^3.12.2", @@ -209,7 +209,7 @@ "stylus-loader": "^4.1.1", "terser-webpack-plugin": "^4.2.3", "url-loader": "^4.1.1", - "vue-loader": "^15.9.3", + "vue-loader": "^15.9.4", "vue-template-compiler": "^2.6.12", "webpack": "^4.44.2", "webpack-cli": "^3.3.12", @@ -224,15 +224,15 @@ "electron-store": "^6.0.1", "electron-updater": "^4.3.5", "iconv-lite": "^0.6.2", - "image-size": "^0.9.1", + "image-size": "^0.9.3", "js-htmlencode": "^0.3.0", "lrc-file-parser": "^1.0.5", "needle": "^2.5.2", - "node-id3": "^0.1.19", + "node-id3": "^0.2.0", "request": "^2.88.2", "vue": "^2.6.12", - "vue-i18n": "^8.22.0", - "vue-router": "^3.4.7", + "vue-i18n": "^8.22.1", + "vue-router": "^3.4.8", "vuex": "^3.5.1", "vuex-router-sync": "^5.0.0" } diff --git a/src/main/utils/flacMeta.js b/src/main/utils/flacMeta.js index ab9a18ba..43362ac4 100644 --- a/src/main/utils/flacMeta.js +++ b/src/main/utils/flacMeta.js @@ -72,9 +72,9 @@ module.exports = (filePath, meta) => { if (respones.statusCode !== 200 && respones.statusCode != 206) return writeMeta(filePath, meta) respones .pipe(fs.createWriteStream(picPath)) - .on('finish', () => { + .on('finish', async() => { if (respones.complete) { - writeMeta(filePath, meta, picPath) + await writeMeta(filePath, meta, picPath) } else { writeMeta(filePath, meta) } From fe1c2a18969502e1824bef7aa90996d3dfb83b70 Mon Sep 17 00:00:00 2001 From: lyswhut Date: Fri, 30 Oct 2020 08:37:32 +0800 Subject: [PATCH 08/14] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E7=9B=AE=E5=BD=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/renderer/views/Setting.vue | 197 +++++++++++++++++++++++++-------- 1 file changed, 149 insertions(+), 48 deletions(-) diff --git a/src/renderer/views/Setting.vue b/src/renderer/views/Setting.vue index 2b79d302..9d15b908 100644 --- a/src/renderer/views/Setting.vue +++ b/src/renderer/views/Setting.vue @@ -1,9 +1,19 @@