修复bug,添加我的积分页面

2026-08-05 10:55:30 +08:00
parent 466f710b33
commit 81e0ccf574
10 changed files with 1063 additions and 29 deletions
--- a/property-uniapp-project/pageSubPack/my/myPointsRecord.vue
+++ b/property-uniapp-project/pageSubPack/my/myPointsRecord.vue
@@ -0,0 +1,190 @@
+<template>
+	<view class="contentStyle">
+	<!-- 	<view class="status-bar"></view>
+		<uni-nav-bar title="积分明细" left-icon="left" @clickLeft="goBack" backgroundColor="transparent" :border="false">
+		</uni-nav-bar> -->
+
+		<pull-refresh-scroll
+			custom-class="page"
+			:refreshing="isRefreshing"
+			:loading-more="loading"
+			:no-more-data="noMoreData"
+			:empty="list.length === 0"
+			empty-text="暂无积分记录"
+			@refresh="onRefresh"
+			@loadMore="loadMore"
+		>
+			<view class="record-list">
+				<view class="record-card" v-for="(item, index) in list" :key="index">
+					<view class="record-left">
+						<text class="record-title">{{ item.title }}</text>
+						<text class="record-time">{{ item.createTime }}</text>
+					</view>
+					<view class="record-right">
+						<text class="record-points" :class="item.type === 'income' ? 'income' : 'expense'">
+							{{ item.type === 'income' ? '+' : '-' }}{{ item.points }}
+						</text>
+						<text class="record-balance">余额：{{ item.balance }}</text>
+					</view>
+				</view>
+			</view>
+		</pull-refresh-scroll>
+	</view>
+</template>
+
+<script setup>
+	import { ref, onMounted } from 'vue'
+	import { getPointsRecordList } from '/pageSubPack/api/apiSub.js'
+	import PullRefreshScroll from '/components/pull-refresh-scroll/pull-refresh-scroll.vue'
+
+	const list = ref([])
+	const pageNum = ref(1)
+	const pageSize = ref(10)
+	const noMoreData = ref(false)
+	const loading = ref(false)
+	const isRefreshing = ref(false)
+
+	const getList = async () => {
+		if (loading.value) return
+		loading.value = true
+		try {
+			const res = await getPointsRecordList({
+				pageNum: pageNum.value,
+				pageSize: pageSize.value
+			})
+			const newList = res.rows || res.data || []
+			if (pageNum.value === 1) {
+				list.value = newList
+			} else {
+				list.value = [...list.value, ...newList]
+			}
+			if (newList.length < pageSize.value) {
+				noMoreData.value = true
+			}
+		} catch (err) {
+			uni.showToast({ title: '加载失败', icon: 'none' })
+			console.error('积分明细接口报错：', err)
+		} finally {
+			loading.value = false
+			if (isRefreshing.value) isRefreshing.value = false
+		}
+	}
+
+	const onRefresh = () => {
+		isRefreshing.value = true
+		pageNum.value = 1
+		noMoreData.value = false
+		loading.value = false
+		getList()
+	}
+
+	const loadMore = () => {
+		if (loading.value || noMoreData.value) return
+		pageNum.value++
+		getList()
+	}
+
+	const goBack = () => {
+		uni.navigateBack({ delta: 1 })
+	}
+
+	onMounted(() => {
+		getList()
+	})
+</script>
+
+<style lang="scss">
+	page {
+		background: linear-gradient(to left bottom, #e2efff 0%, #f9f9f9 50%);
+	}
+</style>
+
+<style lang="scss" scoped>
+	.contentStyle {
+		display: flex;
+		flex-direction: column;
+		height: 100vh;
+		background-color: #f5f7fa;
+	}
+
+	.status-bar {
+		width: 100vw;
+		height: 46px;
+	}
+
+	.page {
+		flex: 1;
+		overflow-y: auto;
+		padding: 0 40rpx;
+		box-sizing: border-box;
+		background: #fff;
+		margin: 0 40rpx;
+		border-radius: 12rpx 12rpx 0 0;
+	}
+
+	.record-list {
+		padding: 20rpx 0;
+	}
+
+	.record-card {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		padding: 28rpx 20rpx;
+		border-bottom: 1rpx solid #f0f0f0;
+		background: #fff;
+	}
+
+	.record-card:last-child {
+		border-bottom: none;
+	}
+
+	.record-left {
+		display: flex;
+		flex-direction: column;
+		flex: 1;
+		overflow: hidden;
+	}
+
+	.record-title {
+		font-size: 28rpx;
+		color: #333;
+		font-weight: 500;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+	}
+
+	.record-time {
+		font-size: 24rpx;
+		color: #999;
+		margin-top: 8rpx;
+	}
+
+	.record-right {
+		display: flex;
+		flex-direction: column;
+		align-items: flex-end;
+		flex-shrink: 0;
+		margin-left: 20rpx;
+	}
+
+	.record-points {
+		font-size: 32rpx;
+		font-weight: 600;
+	}
+
+	.record-points.income {
+		color: #07c160;
+	}
+
+	.record-points.expense {
+		color: #333;
+	}
+
+	.record-balance {
+		font-size: 22rpx;
+		color: #999;
+		margin-top: 4rpx;
+	}
+</style>