绿满眶商城微信小程序-uniapp
zhanghua
2025-06-11 1eefd113e28e802348a9cae69a41945c1dc48b0f
pages/video/home-page.vue
@@ -61,23 +61,28 @@
        
        <!-- 视频列表 -->
      <scroll-view class="video-list" scroll-y :show-scrollbar="false" @scrolltolower="getPage" v-show="currentTab === 'works' && videoList.length > 0">
         <view class="video-container">
            <view
              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.coverUrl" 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">
                     <dropdown-menu
                     :options="item.options"
                     placement="top"
                     theme-color="#07C160"
                     @change="handleChange"
                     ></dropdown-menu>
                  </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">
@@ -115,11 +120,19 @@
</template>
<script>
import DropdownMenu from '@/components/dropdown-menu.vue'
import {getAuthorInfo, getAuthorVideoPage, getAuthorCollectVideoPage} from '@/api/user.js'
import {subscribe, unSubscribe} from '@/api/video.js'
export default {
  components: {DropdownMenu},
  data() {
    return {
      options: [
              { command: 1, label: '北京' },
              { command: 2, label: '上海' },
              { command: 3, label: '广州' }
            ],
      currentTab: 'works', // works: 作品, likes: 喜欢
      authorId: '',
      userInfo: {
@@ -159,6 +172,9 @@
   this.getAuthorVideoPage();
  },
  methods: {
     handleChange(value) {
           console.log('选中值:', value)
         },
   getPage() {
      if(this.currentTab === 'works') {
         if(this.nomoreVideo) {
@@ -465,12 +481,15 @@
}
.video-info {
  display: flex;
  height: 60rpx;
  align-items: center;
  font-size: 24rpx;
  width: 100%;
  padding-right: 20rpx;
  box-sizing: border-box;
  position: absolute;
  bottom: 20rpx;
  left: 20rpx;
  right: 20rpx;
  color: #fff;
  font-size: 24rpx;
}
.video-title {
@@ -484,17 +503,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 {