Merge remote-tracking branch 'origin/dev' into dev

peng

2025-07-02 be80b22a4a0fcd33e1b17ebdb86eba91cc7de4d2

 pages/mine/activity/reportActivity.vue

@@ -1,24 +1,24 @@
<template>
   <view class="wrapper">
      <top-bar selectedTitleIndex="activity" textColor="black" @changeTab="topBarChange" class="topBar"></top-bar>

      <view style="height: 100rpx;margin-top: 50px"></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>
@@ -26,48 +26,32 @@
               </view>
            </view>
         </view>
      <!--    <view style="height: 150rpx;"></view> -->
          <!-- 改进的加载更多提示 -->
               <view class="load-more">
                 <u-loadmore 
                   v-if="mockData.length > 0"
                   :status="loading ? 'loading' : noMore ? 'nomore' : 'loadmore'"
                   :load-text="{
         <!--    <view style="height: 150rpx;"></view> -->
         <!-- 改进的加载更多提示 -->
         <view class="load-more">
            <u-loadmore v-if="mockData.length > 0" :status="loading ? 'loading' : noMore ? 'nomore' : 'loadmore'"
               :load-text="{
                     loadmore: '上拉加载更多',
                     loading: '正在加载',
                     nomore: '没有更多了'
                   }"
                 />
               </view>
              <view style="height:150rpx">
					  
              </view>
                   }" />
         </view>
         <view style="height:150rpx">

         </view>
      </scroll-view>

		
	


   </view>
</template>

<script>
   import {
      changeCollect
   } from '@/api/collect.js'
   import {
      getFilePreviewUrl
   } from '@/api/common.js'
   import UButton from '@/uview-components/uview-ui/components/u-button/u-button.vue';
   import UImage from '@/uview-components/uview-ui/components/u-image/u-image.vue';
   import ULoadmore from '@/uview-components/uview-ui/components/u-loadmore/u-loadmore.vue'
   import {
      getActivityReportList,
   } from '@/api/activity.js';
   import TopBar from "@/components/TopBar.vue";
   import '@/components/uview-components/uview-ui';
   import {getActivityReportList} from '@/api/activity.js';
   export default {
      components: {
         UImage,
         UButton,
         ULoadmore
      },
      components: {TopBar},
      data() {
         return {
            columns: [
@@ -81,7 +65,8 @@
            baseTextHeight: 120, // 文字基础高度
            query: {
               pageNumber: 1,
               pageSize: 8,
               pageSize: 10,
               publish:1,
            },
            loading: false, // 是否正在加载
            noMore: false, // 是否没有更多数据
@@ -92,12 +77,17 @@
         this.getActivityList();
      },
      methods: {
         getUrl(params) {
            getFilePreviewUrl(params).then(res => {
               return res.data.data
            })
         topBarChange(titleObj) {
            if (titleObj.index === 'home') {
               uni.switchTab({
                  url: titleObj.pagePath
               });
            } else {
               uni.redirectTo({
                  url: titleObj.pagePath
               });
            }
         },

         /**
          * 下拉刷新时
          */
@@ -108,62 +98,65 @@
            this.getActivityList();
         },
         loadMore() {
			  
           // 显示加载状态
           this.loading = true;
			  
           // 延迟执行让UI有反应时间
           setTimeout(() => {
             this.query.pageNumber += 1;
             this.getActivityList();
           }, 300);
            // 显示加载状态
            this.loading = true;

            // 延迟执行让UI有反应时间
            setTimeout(() => {
               this.query.pageNumber += 1;
               this.getActivityList();
            }, 300);
         },
         async getActivityList() {
			  
           try {
			    
             const res = await getActivityReportList(this.query);
             this.loading = false;
             if (res.statusCode === 200) {
               const newData = res.data.data.map(value => ({
                 id: value.id,
                 type: value.coverType,
                 cover: value.cover,
                 height: value.coverType === '图片' ? this.baseImageHeight : 
                        value.coverType === '视频' ? this.baseVideoHeight : this.baseTextHeight,
                 title: value.activityName,
                 content: value.activityContent,
                 poster: '',
               }));
			      
               // 更新总数据量
               this.total = res.data.total || 0;
			      
               // 追加或替换数据
               this.mockData = this.query.pageNumber === 1 
                 ? newData
                 : [...this.mockData, ...newData];
			      
               // 判断是否还有更多数据
               this.noMore = newData.length < this.query.pageSize || 
                            this.mockData.length >= this.total;
			      
               // 布局更新
               this.$nextTick(() => {
                 this.layoutItems();
               });
             }
           } catch (error) {
             console.error('加载失败:', error);
             // 失败时回退页码
             if (this.query.pageNumber > 1) {
               this.query.pageNumber -= 1;
             }
           } finally {
             this.loading = false;
             uni.hideLoading();
             uni.stopPullDownRefresh();
           }
            if (this.noMore) {
               this.loading = false;
               return
            }
            try {

               const res = await getActivityReportList(this.query);
               this.loading = false;
               if (res.statusCode === 200) {
                  const newData = res.data.data.map(value => ({
                     id: value.id,
                     type: value.coverType,
                     cover: value.cover,
                     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.noMore = newData.length < this.query.pageSize ||
                     this.mockData.length >= this.total;

                  // 布局更新
                  this.$nextTick(() => {
                     this.layoutItems();
                  });
               }
            } catch (error) {
               console.error('加载失败:', error);
               // 失败时回退页码
               if (this.query.pageNumber > 1) {
                  this.query.pageNumber -= 1;
               }
            } finally {
               this.loading = false;
               uni.hideLoading();
               uni.stopPullDownRefresh();
            }
         },
         // 图片加载完成回调
         layoutItems() {
@@ -188,6 +181,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;
@@ -219,13 +216,14 @@

<style lang="scss">
   /* 新增加载更多样式 */
      .load-more {
         padding: 20rpx 0;
         text-align: center;
         color: #999;
         font-size: 26rpx;
         background-color: #f7f8fa;
      }
   .load-more {
      padding: 20rpx 0;
      text-align: center;
      color: #999;
      font-size: 26rpx;
      background-color: #f8f9fa;
   }

   .btn-container {
      display: flex;
      justify-content: center;
@@ -239,7 +237,7 @@
      height: 100vh;
      display: flex;
      flex-direction: column;
      background-color: #f7f8fa;
      background-color: #f8f9fa;
   }

   /* 导航栏优化 */
@@ -249,12 +247,12 @@

   /* 内容区域优化 */
   .content {
     flex: 1;
     overflow: hidden;
     padding: 0 20rpx;
     box-sizing: border-box;
     /* 确保可以滚动 */
     -webkit-overflow-scrolling: touch;
      flex: 1;
      overflow: hidden;
      padding: 0 20rpx;
      box-sizing: border-box;
      /* 确保可以滚动 */
      -webkit-overflow-scrolling: touch;
   }

   /* 瀑布流布局优化 */
@@ -271,17 +269,19 @@
      gap: 20rpx;
   }

   /* 卡片项优化 */
   /* 卡片项优化 - 使用绿色主题 */
   .item {
      background: #fff;
      background: #ffffff;
      border-radius: 16rpx;
      overflow: hidden;
      box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);
      transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
      border: 1px solid #e0f2e9;

      &:active {
         transform: scale(0.98);
         box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.12);
         background-color: #f0faf5;
      }
   }

@@ -290,7 +290,7 @@
      width: 100%;
      display: block;
      border-radius: 16rpx 16rpx 0 0;
      background-color: #f5f5f5;
      background-color: #f0faf5;

      &[mode="widthFix"] {
         height: auto;
@@ -302,17 +302,16 @@
      object-fit: cover;
   }

   /* 文字内容样式 */
   /* 文字内容样式 - 使用绿色渐变 */
   .text-content {
      padding: 24rpx;
      background: linear-gradient(135deg, #6a11cb 0%, #2575fc 100%);
      // background: linear-gradient(135deg, #38a169 0%, #48bb78 100%);
      min-height: 160rpx;
      display: flex;
      align-items: center;
      justify-content: center;

      .title {
         color: #fff;
         font-size: 32rpx;
         font-weight: 500;
         line-height: 1.4;
@@ -324,11 +323,11 @@
      }
   }

   /* 标题样式优化 */
   /* 标题样式优化 - 使用深绿色 */
   .title {
      padding: 20rpx 24rpx;
      font-size: 28rpx;
      color: #333;
      color: #2c7a7b;
      line-height: 1.5;
      display: -webkit-box;
      -webkit-box-orient: vertical;
@@ -337,7 +336,7 @@
      font-weight: 500;

      &:not(.text-content .title) {
         border-top: 1rpx solid #f0f0f0;
         border-top: 1rpx solid #e0f2e9;
      }
   }

@@ -385,4 +384,12 @@
         font-size: 28rpx;
      }
   }
</style>
	
   .topBar {
      position: fixed;
      top: 20rpx;
      left: 20rpx;
      z-index: 1000;
      background-color: #ffffff;
   }
</style>