视频相关页面优化、功能bug

xiangpei

5 天以前 4e9d7c0e363d313a273700865afb8b0d665e6c69

 pages/video/home-page.vue

@@ -61,12 +61,13 @@
        
        <!-- 视频列表 -->
      <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"
            >
              <image class="video-cover" @click="playAuthorVideo(index)" :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">
@@ -83,6 +84,7 @@
                  </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">
@@ -93,7 +95,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">
@@ -301,7 +303,7 @@
      });
    },
    // 播放收藏视频
    playAuthorVideo(index) {
    playCollectVideo(index) {
      const playInfo = {
         videoList: this.collectVideoList,
         nomore: this.nomoreCollectVideo,
@@ -460,16 +462,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;
}

@@ -481,15 +488,12 @@
}

.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;
  bottom: 10rpx;
  left: 0;
  right: 0;
  padding: 0 10rpx;
  box-sizing: border-box;
}

.video-title {
@@ -569,8 +573,4 @@
  }
}

.video-container {
   display: flex;
   flex-wrap: wrap
}
</style>