From 8a2d6949a4525f90e0e75f2f3f83c13b8830a758 Mon Sep 17 00:00:00 2001 From: peng <peng.com> Date: 星期五, 08 八月 2025 17:37:50 +0800 Subject: [PATCH] 修改商品广场和购物车 --- pages/mine/activity/reportActivity.vue | 85 ++++++++++++++++-------------------------- 1 files changed, 32 insertions(+), 53 deletions(-) diff --git a/pages/mine/activity/reportActivity.vue b/pages/mine/activity/reportActivity.vue index 6e6e2ed..5741ab1 100644 --- a/pages/mine/activity/reportActivity.vue +++ b/pages/mine/activity/reportActivity.vue @@ -1,10 +1,14 @@ <template> <view class="wrapper"> <top-bar selectedTitleIndex="activity" textColor="black" @changeTab="topBarChange" class="topBar"></top-bar> - - <view style="height: 100rpx"></view> + + <view style="height: 50rpx;margin-top: 150rpx"></view> + <u-empty v-if="mockData.length === 0 && !loading" style="margin-top: 130rpx;" + mode="data" + icon="http://cdn.uviewui.com/uview/empty/data.png"> + </u-empty> <!-- 鍐呭鍖哄煙 --> - <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,7 +30,8 @@ </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'" @@ -108,7 +113,10 @@ }, 300); }, async getActivityList() { - + if (this.noMore) { + this.loading = false; + return + } try { const res = await getActivityReportList(this.query); @@ -162,7 +170,7 @@ [] ]; this.colHeight = [0, 0]; - + this.mockData.forEach(item => { const minIndex = this.colHeight.indexOf(Math.min(...this.colHeight)); this.columns[minIndex].push(item); //鑾峰緱楂樺害鏇村皬鐨� 鏀惧叆鍏冪礌 @@ -212,38 +220,26 @@ </script> <style lang="scss"> - /* 鏂板鍔犺浇鏇村鏍峰紡 */ + + /*鏂板鍔犺浇鏇村鏍峰紡 */ .load-more { padding: 20rpx 0; text-align: center; color: #999; font-size: 26rpx; - background-color: #f7f8fa; + background-color: #f8f9fa; } - - .btn-container { - display: flex; - justify-content: center; - align-items: center; - margin-top: 8px; - /* 涓庝笂鏂规爣棰樹繚鎸侀棿璺� */ - } - /* 鍏ㄥ眬鏍峰紡浼樺寲 */ .wrapper { height: 100vh; display: flex; flex-direction: column; - background-color: #f7f8fa; + 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; @@ -266,17 +262,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; } } @@ -285,7 +283,7 @@ width: 100%; display: block; border-radius: 16rpx 16rpx 0 0; - background-color: #f5f5f5; + background-color: #f0faf5; &[mode="widthFix"] { height: auto; @@ -297,17 +295,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; @@ -319,11 +316,11 @@ } } - /* 鏍囬鏍峰紡浼樺寲 */ + /* 鏍囬鏍峰紡浼樺寲 - 浣跨敤娣辩豢鑹� */ .title { padding: 20rpx 24rpx; font-size: 28rpx; - color: #333; + color: #2c7a7b; line-height: 1.5; display: -webkit-box; -webkit-box-orient: vertical; @@ -332,7 +329,7 @@ font-weight: 500; &:not(.text-content .title) { - border-top: 1rpx solid #f0f0f0; + border-top: 1rpx solid #e0f2e9; } } @@ -360,30 +357,12 @@ } } - /* 绌虹姸鎬佹牱寮� */ - .empty-state { - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - height: 60vh; - text-align: center; - - image { - width: 240rpx; - opacity: 0.6; - margin-bottom: 30rpx; - } - - text { - color: #c0c4cc; - font-size: 28rpx; - } - } + .topBar { position: fixed; top: 20rpx; left: 20rpx; - z-index: 1000 + z-index: 1000; + background-color: #ffffff; } </style> -- Gitblit v1.8.0