绿满眶商城微信小程序-uniapp
zxl
2025-07-31 f654d570332e2c16379e08ad1e3bb8a24d92656e
pages/mine/activity/reportActivity.vue
@@ -2,9 +2,9 @@
   <view class="wrapper">
      <top-bar selectedTitleIndex="activity" textColor="black" @changeTab="topBarChange" class="topBar"></top-bar>
      <view style="height: 100rpx;margin-top: 50px"></view>
      <view style="height: 50rpx;margin-top: 50px"></view>
      <!-- 内容区域 -->
      <scroll-view scroll-y class="content" style="height: 40vh;" @scrolltolower="loadMore" :lower-threshold="100">
      <scroll-view scroll-y class="scroll-view-container" style="height: 40vh;" @scrolltolower="loadMore" :lower-threshold="100">
         <view class="waterfall">
            <view class="column" v-for="(column, index) in columns" :key="index">
               <!-- 遍历每列内容 -->
@@ -26,6 +26,9 @@
               </view>
            </view>
         </view>
         <view class="empty-state" v-if="mockData.length === 0 && !loading">
                 <text>暂无内容,下拉刷新试试</text>
             </view>
         <!--    <view style="height: 150rpx;"></view> -->
         <!-- 改进的加载更多提示 -->
         <view class="load-more">
@@ -165,7 +168,7 @@
               []
            ];
            this.colHeight = [0, 0];
            this.mockData.forEach(item => {
               const minIndex = this.colHeight.indexOf(Math.min(...this.colHeight));
               this.columns[minIndex].push(item); //获得高度更小的 放入元素
@@ -215,6 +218,19 @@
</script>
<style lang="scss">
   /* 空状态样式 */
   .empty-state {
       display: flex;
       flex-direction: column;
       align-items: center;
       justify-content: center;
       height: 50vh;
       text-align: center;
       color: #999;
       text {
           font-size: 28rpx;
       }
   }
   /* 新增加载更多样式 */
   .load-more {
      padding: 20rpx 0;
@@ -223,15 +239,6 @@
      font-size: 26rpx;
      background-color: #f8f9fa;
   }
   .btn-container {
      display: flex;
      justify-content: center;
      align-items: center;
      margin-top: 8px;
      /* 与上方标题保持间距 */
   }
   /* 全局样式优化 */
   .wrapper {
      height: 100vh;
@@ -240,13 +247,9 @@
      background-color: #f8f9fa;
   }
   /* 导航栏优化 */
   .u-navbar {
      box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
   }
   /* 内容区域优化 */
   .content {
   .scroll-view-container {
      flex: 1;
      overflow: hidden;
      padding: 0 20rpx;