很多页面

2025-09-03 17:13:10 +08:00
parent 92bfc36d51
commit 84f59b20f6
26 changed files with 29536 additions and 616 deletions
@@ -0,0 +1,113 @@
+<template>
+	<view class="page">
+		<uni-nav-bar left-icon="left" title="我的兑换" fixed color="#8B2316" height="140rpx" :border="false" backgroundColor="#ffffff" @clickLeft="goBack" />
+
+		<scroll-view 
+			scroll-y 
+			class="content"
+			refresher-enabled
+			:refresher-triggered="refresherTriggered"
+			@refresherrefresh="onRefresh"
+			@scrolltolower="onReachBottom"
+			:lower-threshold="80"
+		>
+			<view v-if="!orderList.length" class="empty">暂无兑换记录</view>
+			<view v-for="item in orderList" :key="item.uuid" class="card">
+				<view class="row">
+					<text class="label">兑换物品：</text>
+					<text class="value">{{ item.goods_name }}</text>
+				</view>
+				<view class="row">
+					<text class="label">兑换时间：</text>
+					<text class="value">{{ formatDate(item.create_date) }}</text>
+				</view>
+				<view class="row">
+					<text class="label">状态：</text>
+					<text class="status" :class="statusClass(item.status)">{{ statusText(item.status) }}</text>
+				</view>
+			</view>
+			<view class="list-footer" v-if="isLoading">加载中...</view>
+			<view class="list-footer" v-else-if="noMore && orderList.length">没有更多了</view>
+		</scroll-view>
+	</view>
+</template>
+
+<script setup>
+import goods_api from '@/api/goods_api'
+import { ref, onMounted } from 'vue'
+const orderList = ref([])
+const page = ref(1)
+const pageSize = ref(10)
+const isLoading = ref(false)
+const noMore = ref(false)
+const refresherTriggered = ref(false)
+
+const fetchList = () => {
+	if (isLoading.value || noMore.value) return
+	isLoading.value = true
+	goods_api.getGoodsOrderList({ page: page.value, pageSize: pageSize.value }).then(res => {
+		if (res.code == 200 && res.data) {
+			const list = Array.isArray(res.data.list) ? res.data.list : []
+			orderList.value = page.value === 1 ? list : orderList.value.concat(list)
+			noMore.value = !!res.data.isLastPage
+			page.value = (res.data.pageNum || page.value) + 1
+		}
+	}).finally(() => {
+		isLoading.value = false
+		refresherTriggered.value = false
+	})
+}
+
+const onRefresh = () => {
+	refresherTriggered.value = true
+	noMore.value = false
+	page.value = 1
+	fetchList()
+}
+
+const onReachBottom = () => {
+	fetchList()
+}
+
+const formatDate = (sec) => {
+	if (!sec) return ''
+	const d = new Date(Number(sec) * 1000)
+	const y = d.getFullYear()
+	const m = String(d.getMonth() + 1).padStart(2, '0')
+	const day = String(d.getDate()).padStart(2, '0')
+	return `${y}-${m}-${day}`
+}
+
+const statusText = (s) => {
+	if (s === 1 || s === 2) return '已支付'
+	if (s === 3) return '待支付'
+	return ''
+}
+
+const statusClass = (s) => {
+	return (s === 1 || s === 2) ? 'paid' : 'unpaid'
+}
+
+onMounted(() => {
+	page.value = 1
+	noMore.value = false
+	orderList.value = []
+	fetchList()
+})
+const goBack = () => uni.navigateBack()
+</script>
+
+<style scoped>
+.page { min-height: 100vh; background: #fff; }
+.content { position: absolute; top: 140rpx; bottom: 0; left: 0; right: 0; background: #fff; }
+.card { background: #fff; padding: 24rpx; border-bottom: 16rpx solid #f5f5f5; }
+.row { display: flex; align-items: center; padding: 10rpx 0; }
+.label { color: #333; font-size: 30rpx; width: 180rpx; }
+.value { color: #333; font-size: 30rpx; }
+.status { font-size: 30rpx; }
+.status.paid { color: #333; }
+.status.unpaid { color: #333; }
+.list-footer { text-align: center; color: #999; padding: 24rpx 0; }
+.empty { text-align: center; color: #999; padding: 40rpx 0; }
+</style>
+