绿满眶商城微信小程序-uniapp
zxl
7 天以前 232225891f27532a550ab9eb50d84f2f07dfac7f
pages/mine/activity/reportActivity.vue
@@ -1,24 +1,24 @@
<template>
   <view class="wrapper">
      <view style="height: 100rpx"></view>
      <!-- 内容区域 -->
      <scroll-view scroll-y class="content" style="height: 100vh;"   @scrolltolower="loadMore"
          :lower-threshold="100"
         >
      <scroll-view scroll-y class="content" style="height: 40vh;" @scrolltolower="loadMore" :lower-threshold="100">
         <view class="waterfall">
            <view class="column" v-for="(column, index) in columns" :key="index">
               <!-- 遍历每列内容 -->
               <view class="item" v-for="(item, idx) in column" :key="item.id" @click="handleItemClick(item)">
                  <!-- 图片类型 -->
                  <image v-if="item.type === '图片'" :src="getUrl(item.cover)" mode="widthFix" class="media"
                     @load="imageLoad" :data-item="item" :style="{ height: item.height + 'px' }" />
                  <image v-if="item.type === 'image'" :src="item.url" mode="widthFix" class="media" @load="imageLoad"  :data-item="item"
                     :style="{ height: item.height + 'px' }" />
                  <!-- 视频类型 -->
                  <video v-if="item.type === '视频'" :src="getUrl(item.cover)" class="media" controls
                     :poster="item.poster" @play="handleVideoPlay"
                     :style="{ height: item.height + 'px' }"></video>
                  <video v-if="item.type === 'video'" :src="item.url" class="media" controls :poster="item.poster"  :data-item="item"
                     @play="handleVideoPlay" :style="{ height: item.height + 'px' }"></video>
                  <!-- 文字类型 -->
                  <view v-if="item.type === '文字'" class="text-content">
                  <view v-if="item.type === 'text'" class="text-content">
                     <text class="title">{{ item.cover }}</text>
                  </view>
                  <text class="title">{{ item.title }}</text>
@@ -29,15 +29,12 @@
      <!--    <view style="height: 150rpx;"></view> -->
          <!-- 改进的加载更多提示 -->
               <view class="load-more">
                 <u-loadmore
                   v-if="mockData.length > 0"
                   :status="loading ? 'loading' : noMore ? 'nomore' : 'loadmore'"
            <u-loadmore v-if="mockData.length > 0" :status="loading ? 'loading' : noMore ? 'nomore' : 'loadmore'"
                   :load-text="{
                     loadmore: '上拉加载更多',
                     loading: '正在加载',
                     nomore: '没有更多了'
                   }"
                 />
                   }" />
               </view>
              <view style="height:150rpx">
                 
@@ -81,7 +78,7 @@
            baseTextHeight: 120, // 文字基础高度
            query: {
               pageNumber: 1,
               pageSize: 8,
               pageSize: 10,
            },
            loading: false, // 是否正在加载
            noMore: false, // 是否没有更多数据
@@ -92,12 +89,6 @@
         this.getActivityList();
      },
      methods: {
         getUrl(params) {
            getFilePreviewUrl(params).then(res => {
               return res.data.data
            })
         },
         /**
          * 下拉刷新时
          */
@@ -129,20 +120,21 @@
                 id: value.id,
                 type: value.coverType,
                 cover: value.cover,
                 height: value.coverType === '图片' ? this.baseImageHeight :
                        value.coverType === '视频' ? this.baseVideoHeight : this.baseTextHeight,
                     height: value.coverType === 'image' ? this.baseImageHeight : value.coverType ===
                        'video' ? this.baseVideoHeight : this.baseTextHeight,
                 title: value.activityName,
                 content: value.activityContent,
                 poster: '',
                     url: value.url
               }));
               
               // 更新总数据量
               this.total = res.data.total || 0;
               
               // 追加或替换数据
               this.mockData = this.query.pageNumber === 1
                 ? newData
                 : [...this.mockData, ...newData];
                  this.mockData = this.query.pageNumber === 1 ?
                     newData :
                     [...this.mockData, ...newData];
               
               // 判断是否还有更多数据
               this.noMore = newData.length < this.query.pageSize || 
@@ -188,6 +180,10 @@
            const ratio = height / width;
            const item = e.currentTarget.dataset.item;
             if (!item) {
                  console.error('无法获取图片项数据', e);
                  return;
               }
            // 重新计算实际显示高度
            const viewWidth = uni.upx2px(345); // 将rpx转换为px
            const viewHeight = viewWidth * ratio;
@@ -226,6 +222,7 @@
         font-size: 26rpx;
         background-color: #f7f8fa;
      }
   .btn-container {
      display: flex;
      justify-content: center;