From c9928dd4f6d25e2339ea1400f59ec58674a927a7 Mon Sep 17 00:00:00 2001 From: zxl <763096477@qq.com> Date: 星期四, 19 六月 2025 20:07:42 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/dev' into dev --- pages/video/home-page.vue | 163 +++++++++++++++++++++++++++++++++++++++++------------- 1 files changed, 124 insertions(+), 39 deletions(-) diff --git a/pages/video/home-page.vue b/pages/video/home-page.vue index 11cc980..5ce3063 100644 --- a/pages/video/home-page.vue +++ b/pages/video/home-page.vue @@ -4,9 +4,6 @@ <view class="user-header"> <view class="user-avatar-container"> <image class="user-avatar" :src="userInfo.avatar" mode="aspectFill"></image> - <view class="edit-icon" @click="editProfile" v-if="isSelf"> - <uni-icons type="compose" size="20" color="#666"></uni-icons> - </view> </view> <view class="user-info"> <view class="user-name">{{userInfo.nickName}}</view> @@ -38,6 +35,10 @@ {{userInfo.hasSub ? '鍙栨秷鍏虫敞' : '鍏虫敞'}} </button> </view> + + <view class="edit-icon" @click="editInfo" v-if="userInfo.self"> + <uni-icons type="compose" size="20" color="#666"></uni-icons>缂栬緫涓婚〉淇℃伅 + </view> </view> <!-- 浣滃搧/鍠滄鍒囨崲 --> @@ -65,18 +66,26 @@ class="video-item" v-for="(item, index) in videoList" :key="item.id" - @click="playAuthorVideo(index)" > - <image class="video-cover" :src="item.coverUrl" mode="aspectFill"></image> + <image class="video-cover" @click="playAuthorVideo(index)" :src="item.videoContentType === 'video' ? item.coverUrl : item.imgs[0]" mode="aspectFill"></image> <view class="video-info"> <view class="video-stats"> <view class="stat"> <uni-icons type="heart" size="16" color="#fff"></uni-icons> <text>{{item.collectNum}}</text> + <view class="more-op" v-if="userInfo.self"> + <dropdown-menu + :options="item.options" + :data="{id: item.id, title: item.title}" + placement="top" + theme-color="#07C160" + @change="handleChange" + ></dropdown-menu> + </view> </view> </view> </view> - </view> + </view> </view> </scroll-view> <scroll-view class="video-list" scroll-y :show-scrollbar="false" @scrolltolower="getPage" v-show="currentTab === 'likes' && collectVideoList.length > 0"> @@ -87,7 +96,7 @@ :key="item.id" @click="playCollectVideo(index)" > - <image class="video-cover" :src="item.coverUrl" mode="aspectFill"></image> + <image class="video-cover" :src="item.videoContentType === 'video' ? item.coverUrl : item.imgs[0]" mode="aspectFill"></image> <view class="video-info"> <view class="video-stats"> <view class="stat"> @@ -110,15 +119,39 @@ <!-- <image src="/static/images/empty.png" mode="aspectFit" class="empty-image"></image> --> <text class="empty-text">杩樻病鏈夌偣璧炰綔鍝佸摝~</text> </view> + + <!-- 鍒犻櫎瑙嗛鎻愰啋妗� --> + <uni-popup ref="delDialog" type="dialog"> + <uni-popup-dialog type="error" cancelText="鍙栨秷" confirmText="鍒犻櫎" title="鎻愰啋" :content="`鎮ㄦ鍦ㄥ垹闄わ細${opVideo.title}`" @confirm="deleteVideo" + @close="dialogClose"></uni-popup-dialog> + </uni-popup> + + <!-- 涓嬫灦瑙嗛鎻愰啋妗� --> + <uni-popup ref="downDialog" type="dialog"> + <uni-popup-dialog type="error" cancelText="鍙栨秷" confirmText="涓嬫灦" title="鎻愰啋" :content="`鎮ㄦ鍦ㄤ笅鏋讹細${opVideo.title}`" @confirm="downVideo" + @close="dialogClose"></uni-popup-dialog> + </uni-popup> </view> </template> <script> +import DropdownMenu from '@/components/dropdown-menu.vue' + import {getAuthorInfo, getAuthorVideoPage, getAuthorCollectVideoPage} from '@/api/user.js' -import {subscribe, unSubscribe} from '@/api/video.js' +import {subscribe, unSubscribe, delVideo, updateVideo, userDownVideo} from '@/api/video.js' export default { + components: {DropdownMenu}, data() { return { + options: [ + { command: 1, label: '鍖椾含' }, + { command: 2, label: '涓婃捣' }, + { command: 3, label: '骞垮窞' } + ], + opVideo: { // 姝e湪鎿嶄綔鐨勮棰� + id: '', + title: '' + }, currentTab: 'works', // works: 浣滃搧, likes: 鍠滄 authorId: '', userInfo: { @@ -149,12 +182,63 @@ nomoreCollectVideo: false } }, + onShow() { + this.getAuthorInfo(); + }, onLoad(option) { this.authorId = option.authorId; this.getAuthorInfo(); this.getAuthorVideoPage(); }, methods: { + dialogClose() { + this.opVideo = { + id: '', + title: '' + } + }, + // 涓嬫灦瑙嗛 + downVideo() { + userDownVideo(this.opVideo.id).then(res => { + uni.showToast({ + title: '涓嬫灦鎴愬姛', + duration: 2000 + }); + // 鍒锋柊鏁版嵁 + this.videoList = []; + this.videoQuery.pageNumber = 1; + this.getAuthorVideoPage(); + }) + }, + // 鍒犻櫎瑙嗛 + deleteVideo() { + delVideo(this.opVideo.id).then(res => { + uni.showToast({ + title: '鍒犻櫎鎴愬姛', + duration: 2000 + }); + // 鍒锋柊鏁版嵁 + this.videoList = []; + this.videoQuery.pageNumber = 1; + this.getAuthorVideoPage(); + }) + }, + // 瑙﹀彂瑙嗛鎿嶄綔 + handleChange(value, data) { + console.log('閫変腑鍊�:', value) + this.opVideo.id = data.id; + this.opVideo.title = data.title; + if (value === 'DELETE') { + this.$refs.delDialog.open() + } else if (value === 'DOWN') { + this.$refs.downDialog.open() + } else if (value === 'EDIT') { + // 璺宠浆缂栬緫瑙嗛椤甸潰 + uni.navigateTo({ + url: `/pages/video/video-edit?id=${this.opVideo.id}` + }); + } + }, getPage() { if(this.currentTab === 'works') { if(this.nomoreVideo) { @@ -281,7 +365,7 @@ }); }, // 鎾斁鏀惰棌瑙嗛 - playAuthorVideo(index) { + playCollectVideo(index) { const playInfo = { videoList: this.collectVideoList, nomore: this.nomoreCollectVideo, @@ -294,9 +378,9 @@ }); }, // 缂栬緫涓汉璧勬枡 - editProfile() { + editInfo() { uni.navigateTo({ - url: '/pages/user/edit' + url: `/pages/video/home-page-edit?authorId=${this.authorId}&avatar=${this.userInfo.avatar}&motto=${this.userInfo.motto || ''}&nickName=${this.userInfo.nickName}` }); }, @@ -351,16 +435,13 @@ .edit-icon { position: absolute; - right: 0; - bottom: 0; + right: 30rpx; + top: 30rpx; background-color: #fff; - border-radius: 50%; - width: 40rpx; height: 40rpx; display: flex; justify-content: center; align-items: center; - box-shadow: 0 0 10rpx rgba(0, 0, 0, 0.1); } .user-info { @@ -443,16 +524,21 @@ } .video-list { - width: calc(100% - 20rpx); - padding: 0 10rpx; - height: calc(100vh - 554rpx); - background-color: #fff; + width: 100%; + padding: 0 10rpx; + height: calc(100vh - 554rpx); + background-color: #fff; +} + +.video-container { + display: flex; + flex-wrap: wrap; + justify-content: space-between; } .video-item { - width: 50%; - padding: 10rpx; - box-sizing: border-box; + width: 49%; + margin-bottom: 20rpx; position: relative; } @@ -465,11 +551,11 @@ .video-info { position: absolute; - bottom: 20rpx; - left: 20rpx; - right: 20rpx; - color: #fff; - font-size: 24rpx; + bottom: 10rpx; + left: 0; + right: 0; + padding: 0 10rpx; + box-sizing: border-box; } .video-title { @@ -483,17 +569,25 @@ .video-stats { display: flex; + width: 100%; } .stat { display: flex; + width: 100%; align-items: center; - margin-right: 20rpx; - text-shadow: 0 0 5rpx rgba(0, 0, 0, 0.5); + position: relative; +} + +.more-op { + position: absolute; + right: 0; } .stat text { margin-left: 5rpx; + color: #fff; + font-size: 14px; } .empty-state { @@ -541,13 +635,4 @@ } } -/* 濡傛灉鏄嚜宸辩殑涓婚〉锛岄殣钘忓叧娉ㄦ寜閽� */ -.user-header { - position: relative; -} - -.video-container { - display: flex; - flex-wrap: wrap -} </style> \ No newline at end of file -- Gitblit v1.8.0