From a5bf5939ca642071bf95ccbe802fa5d253051641 Mon Sep 17 00:00:00 2001 From: zyronon Date: Wed, 29 Sep 2021 13:53:42 +0800 Subject: [PATCH] =?UTF-8?q?=E9=9F=B3=E4=B9=90=E6=94=B6=E8=97=8F=E9=A1=B5?= =?UTF-8?q?=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.vue | 6 +- src/assets/scss/utils.less | 2 +- src/components/BaseButton.vue | 19 +- src/mock/index.js | 4 +- src/pages/me/Me.vue | 18 +- src/pages/me/collect/MusicCollect.vue | 304 ++++++++++++++++++++++++++ src/pages/me/collect/VideoCollect.vue | 47 ++++ src/router/index.js | 6 + 8 files changed, 390 insertions(+), 16 deletions(-) create mode 100644 src/pages/me/collect/MusicCollect.vue create mode 100644 src/pages/me/collect/VideoCollect.vue diff --git a/src/App.vue b/src/App.vue index 9bc063e..bd77da4 100644 --- a/src/App.vue +++ b/src/App.vue @@ -45,7 +45,7 @@ export default { this.$store.commit('setMaskDialog', {state: false, mode: this.maskDialogMode}) //footer下面的5个按钮，对跳不要用动画 - let noAnimation = ['/', '/home', '/me', '/attention', '/message', '/publish','/home/live'] + let noAnimation = ['/', '/home', '/me', '/attention', '/message', '/publish', '/home/live'] if (noAnimation.indexOf(from.path) !== -1 && noAnimation.indexOf(to.path) !== -1) { return this.transitionName = '' } @@ -82,12 +82,16 @@ export default { '/message/chat', '/message/chat-detail', '/set-remark', + '/me/request-update', '/me/right-menu/look-history', '/me/right-menu/minor-protection/index', '/me/right-menu/minor-protection/detail-setting', '/me/right-menu/minor-protection/trigger-time', '/me/right-menu/setting', + '/me/collect/video-collect', + '/me/collect/music-collect', + '/login', '/login/other', '/login/password', diff --git a/src/assets/scss/utils.less b/src/assets/scss/utils.less index e208b3a..cc4478b 100644 --- a/src/assets/scss/utils.less +++ b/src/assets/scss/utils.less @@ -85,7 +85,7 @@ margin .mt(@n, (@i + 1)); } -.mb(5); +.mb(7); .mb(@n, @i: 1) when (@i =< @n) { .mb@{i}r { margin-bottom: (1rem * @i) !important; diff --git a/src/components/BaseButton.vue b/src/components/BaseButton.vue index 0293a75..9dc1f2a 100644 --- a/src/components/BaseButton.vue +++ b/src/components/BaseButton.vue @@ -39,6 +39,11 @@ export default { type: Boolean, default: true }, + size: { + type: String, + default: 'normal' + //small + }, }, data() { return {} @@ -50,6 +55,7 @@ export default { this.active ? '' : 'no-active', this.border ? '' : 'no-border', this.disabled && 'disabled', + this.size ] }, showText() { @@ -121,7 +127,7 @@ export default { } &.dark2 { - border:1px solid @second-btn-color; + border: 1px solid @second-btn-color; background: white; color: #000; } @@ -140,8 +146,9 @@ export default { background: rgb(27, 177, 228); color: white; } + &.webo { - background: rgb(242,95,67); + background: rgb(242, 95, 67); color: white; } @@ -224,8 +231,14 @@ export default { } &.no-border { - border: none!important; + border: none !important; background: rgb(212 212 212 / 36%); } + + &.small { + font-size: 1.2rem; + width: 6.2rem; + height: 2.6rem; + } } diff --git a/src/mock/index.js b/src/mock/index.js index df3756d..bb0cb89 100644 --- a/src/mock/index.js +++ b/src/mock/index.js @@ -114,11 +114,11 @@ Mock.mock(/collect/, options => { return Mock.mock({ data: { video: { - total: 0, + total: resource.videos.length, list: resource.videos, }, music: { - total: 0, + total: resource.music.length, list: resource.music, } }, code: 200, msg: '', diff --git a/src/pages/me/Me.vue b/src/pages/me/Me.vue index 7988722..f3a1d7b 100644 --- a/src/pages/me/Me.vue +++ b/src/pages/me/Me.vue @@ -158,20 +158,20 @@ 只有你能看到自己的收藏列表
-
-
+
+
视频
全部 - +
+ v-for="i in videos.collect.video.total>3?videos.collect.video.list.slice(0,3):videos.collect.video.list">
@@ -181,20 +181,20 @@
-
-
+
+
音乐
全部 - +
+ v-for="i in videos.collect.music.total>3?videos.collect.music.list.slice(0,3):videos.collect.music.list">
{{ i.name }}
@@ -505,7 +505,7 @@ export default { if (newVal === 3) { if (videoOb.video.total === -1) { this.loadings['loading' + newVal] = true - let res = await this.$api.videos.collect({pageNo: this.videos.collect.pageNo, pageSize: this.pageSize,}) + let res = await this.$api.videos.collect() if (res.code === this.SUCCESS) this.videos.collect = res.data } } else { diff --git a/src/pages/me/collect/MusicCollect.vue b/src/pages/me/collect/MusicCollect.vue new file mode 100644 index 0000000..a77ea37 --- /dev/null +++ b/src/pages/me/collect/MusicCollect.vue @@ -0,0 +1,304 @@ + + + + diff --git a/src/pages/me/collect/VideoCollect.vue b/src/pages/me/collect/VideoCollect.vue new file mode 100644 index 0000000..8fdd597 --- /dev/null +++ b/src/pages/me/collect/VideoCollect.vue @@ -0,0 +1,47 @@ + + + + diff --git a/src/router/index.js b/src/router/index.js index 0828974..7e72e3e 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -53,6 +53,8 @@ import Test4 from "../pages/Test4"; import Search from "../pages/home/SearchPage"; import LivePage from "../pages/home/LivePage"; import Test5 from "../pages/Test5"; +import MusicCollect from "../pages/me/collect/MusicCollect"; +import VideoCollect from "../pages/me/collect/VideoCollect"; const routes = [ // {path: '', component: Music}, @@ -101,11 +103,15 @@ const routes = [ {path: '/scan', component: Scan}, {path: '/face-to-face', component: FaceToFace}, {path: '/set-remark', component: SetRemark}, + {path: '/me/right-menu/look-history', component: LookHistory}, {path: '/me/right-menu/minor-protection/index', component: MinorProtectionIndex}, {path: '/me/right-menu/minor-protection/detail-setting', component: MinorProtectionDetailSetting}, {path: '/me/right-menu/minor-protection/trigger-time', component: TriggerTime}, {path: '/me/right-menu/setting', component: Setting}, + {path: '/me/collect/music-collect', component: MusicCollect}, + {path: '/me/collect/video-collect', component: VideoCollect}, + {path: '/login', component: Login}, {path: '/login/other', component: OtherLogin}, {path: '/login/password', component: PasswordLogin},