收藏页面调整

zxl

2025-08-11 4636de7dcbd3bd4eba7597536b9bdebb1c33900c

 pages/video/myCollect.vue

File was renamed from pages/mine/myCollect/myCollect.vue
@@ -10,7 +10,7 @@

      <!-- 视频收藏列表 -->
      <view v-if="currentTab === 0" class="list-container">
         <scroll-view scroll-y class="scroll-view" @scrolltolower="loadMore" :lower-threshold="100">
         <scroll-view scroll-y :lower-threshold="100" class="scroll-view-container" @scrolltolower="loadMore" >
            <view v-if="videoCollects.length > 0">
               <view v-for="(item, idx) in videoCollects" :key="item.id" class="collect-item">
                  <!-- 视频封面 -->
@@ -24,10 +24,6 @@
                     :controls="false"
                     :show-center-play-btn="false"
                     object-fit="cover"></video>
                     <!--  <image :src="getVideoCover()" mode="aspectFill" class="cover-image" /> -->
                     <!--   <view v-if="item.duration" class="duration">
                {{ formatDuration(item.duration) }}
              </view> -->
                  </view>

                  <!-- 视频信息 -->
@@ -55,7 +51,7 @@
               </view>
            </view>
            <view v-else class="empty-tip">
               <image src="/static/empty.png" mode="aspectFit" />
					
               <text>暂无收藏视频</text>
            </view>
            <view class="load-more">
@@ -70,7 +66,7 @@

      <!-- 商品收藏列表 -->
      <view v-if="currentTab === 1" class="list-container">
         <scroll-view scroll-y class="scroll-view" @scrolltolower="loadMore" :lower-threshold="100">
         <scroll-view scroll-y class="scroll-view-container" @scrolltolower="loadMore" :lower-threshold="100">
            <view v-if="goodsCollects.length > 0">
               <view v-for="(item, idx) in goodsCollects" :key="item.id" class="collect-item">
                  <!-- 商品封面 -->
@@ -103,7 +99,6 @@
               </view>
            </view>
            <view v-else class="empty-tip">
               <image src="/static/empty.png" mode="aspectFit" />
               <text>暂无收藏商品</text>
            </view>
            <view class="load-more">
@@ -118,7 +113,7 @@

      <!-- 活动收藏列表 -->
      <view v-if="currentTab === 2" class="list-container">
         <scroll-view scroll-y class="scroll-view" @scrolltolower="loadMore" :lower-threshold="100">
         <scroll-view scroll-y class="scroll-view-container" @scrolltolower="loadMore" :lower-threshold="100">
            <view v-if="activityCollects.length > 0">
               <view v-for="(item, idx) in activityCollects" :key="item.id" class="collect-item">
                  <!-- 活动封面 -->
@@ -155,7 +150,6 @@
               </view>
            </view>
            <view v-else class="empty-tip">
               <image src="/static/empty.png" mode="aspectFit" />
               <text>暂无收藏活动</text>
            </view>
            <view class="load-more">
@@ -171,13 +165,15 @@
</template>

<script>
   import {
   import { onMounted } from "vue"
import {
      getMyCollectList,
      changeCollect
   } from '@/api/collect.js'
   import storage from '@/utils/storage'

   export default {
      name:'myCollect',
      data() {
         return {
            currentTab: 0,
@@ -201,9 +197,9 @@
            return this.loading ? 'loading' : this.noMore ? 'nomore' : 'loadmore'
         }
      },
      onLoad() {
         this.query.authorId = storage.getUserInfo().id
         this.loadData()
      mounted() {
         this.query.authorId = storage.getUserInfo().id;
         this.loadData();
      },
      onPullDownRefresh() {
         this.query.pageNumber = 1
@@ -342,7 +338,6 @@
   .page-container {
      padding: 20rpx;
      background-color: #f5f5f5;
      min-height: 100vh;
   }

   .tab-nav {
@@ -384,12 +379,18 @@
      border-radius: 12rpx;
      padding: 20rpx;
      box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);

      .scroll-view {
         height: calc(100vh - 200rpx);
      }
      height: 70vh;
		
   }

   /* 内容区域优化 */
   .scroll-view-container {
      width: 100%;
      padding: 0 10rpx;
      height: calc(100vh - 554rpx);
      background-color: #fff;
      overflow: hidden;
      padding: 0 10rpx;
   }
   .collect-item {
      display: flex;
      padding: 24rpx 0;