From 245533a78452b287c769d721495dda9e089a1cd8 Mon Sep 17 00:00:00 2001
From: zpc <zpc1131@gamil.com>
Date: Fri, 11 Apr 2025 15:21:42 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E8=AE=A2=E5=8D=95=E8=AF=A6?=
 =?UTF-8?q?=E6=83=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages.json                 |  14 ++
 pages/other/order_info.vue | 214 ++++++++++++++++++++++++++
 pages/other/order_list.vue | 160 ++++++++++++++++++++
 pages/user/index.vue       |   2 +-
 pages/user/xfjl.vue        | 302 ++++++++++++++++++-------------------
 5 files changed, 540 insertions(+), 152 deletions(-)
 create mode 100644 pages/other/order_info.vue
 create mode 100644 pages/other/order_list.vue

diff --git a/pages.json b/pages.json
index 38004a9..409f439 100644
--- a/pages.json
+++ b/pages.json
@@ -480,6 +480,20 @@
 			{
 				"navigationStyle": "custom"
 			}
+		},
+		{
+			"path" : "pages/other/order_list",
+			"style" : 
+			{
+				"navigationStyle": "custom"
+			}
+		},
+		{
+			"path" : "pages/other/order_info",
+			"style" : 
+			{
+				"navigationStyle": "custom"
+			}
 		}
 	],
 	"subPackages": [{
diff --git a/pages/other/order_info.vue b/pages/other/order_info.vue
new file mode 100644
index 0000000..19975c3
--- /dev/null
+++ b/pages/other/order_info.vue
@@ -0,0 +1,214 @@
+<template>
+	<page-container title="订单详情" :showBack="true">
+		<view class="order-info" v-if="orderInfo">
+			<view class="info-section">
+				<view class="section-title">订单信息</view>
+				<view class="info-item">
+					<text class="label">订单名称：</text>
+					<text class="value">{{orderInfo.goods_title}}</text>
+				</view>
+				<view class="info-item">
+					<text class="label">购买数量：</text>
+					<text class="value">{{orderInfo.prize_num}}</text>
+				</view>
+				<view class="info-item">
+					<text class="label">单价：</text>
+					<text class="value">¥{{orderInfo.goods_price}}</text>
+				</view>
+			</view>
+			
+			<view class="info-section">
+				<view class="section-title">支付信息</view>
+				<view class="info-item">
+					<text class="label">订单原价：</text>
+					<text class="value">¥{{orderInfo.order_total}}</text>
+				</view>
+				<view class="info-item">
+					<text class="label">实际支付：</text>
+					<text class="value price">¥{{orderInfo.order_zhe_total}}</text>
+				</view>
+				<view class="info-item">
+					<text class="label">微信支付：</text>
+					<text class="value">¥{{orderInfo.price}}</text>
+				</view>
+				<view class="info-item">
+					<text class="label">钻石支付：</text>
+					<text class="value">¥{{orderInfo.use_money}}</text>
+				</view>
+				<view class="info-item">
+					<text class="label">UU币支付：</text>
+					<text class="value">¥{{orderInfo.use_integral}}</text>
+				</view>
+				<view class="info-item">
+					<text class="label">达达卷支付：</text>
+					<text class="value">¥{{orderInfo.use_money2}}</text>
+				</view>
+				<view class="info-item">
+					<text class="label">优惠金额：</text>
+					<text class="value">¥{{orderInfo.use_coupon}}</text>
+				</view>
+				<view class="info-item">
+					<text class="label">支付时间：</text>
+					<text class="value">{{orderInfo.pay_time}}</text>
+				</view>
+			</view>
+			
+			<view class="info-section" v-if="orderInfo.goods_list && orderInfo.goods_list.length > 0">
+				<view class="section-title">奖品列表</view>
+				<view class="prize-list">
+					<view class="prize-item" v-for="(item, index) in orderInfo.goods_list" :key="index">
+						<image class="prize-image" :src="item.goodslist_imgurl" mode="aspectFill"></image>
+						<view class="prize-info">
+							<view class="prize-title">{{item.goodslist_title}}</view>
+							<view class="prize-price">¥{{item.goodslist_price}}</view>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		
+		<view class="loading" v-else-if="loading">加载中...</view>
+		<view class="error" v-else>订单数据加载失败</view>
+	</page-container>
+
+</template>
+
+<script>
+	import PageContainer from '@/components/page-container/page-container.vue'
+	export default {
+		components: {
+			PageContainer
+		},
+		data() {
+			return {
+				orderNum: '',
+				orderInfo: null,
+				loading: true
+			}
+		},
+		onLoad(options) {
+			if (options.order_num) {
+				this.orderNum = options.order_num;
+				this.load();
+			} else {
+				this.$c.msg('订单参数缺失');
+				setTimeout(() => {
+					uni.navigateBack();
+				}, 1500);
+			}
+		},
+		methods: {
+			async load() {
+				this.loading = true;
+				try {
+					const { status, data, msg } = await this.$request.post('order_detail', { 
+						order_num: this.orderNum 
+					});
+					
+					if (status !== 1) {
+						this.$c.msg(msg);
+						return;
+					}
+					
+					this.orderInfo = data;
+				} catch (error) {
+					console.error('加载订单详情失败', error);
+					this.$c.msg('加载失败，请重试');
+				} finally {
+					this.loading = false;
+				}
+			},
+
+		}
+	}
+</script>
+
+<style lang="scss">
+.order-info {
+	padding: 30rpx;
+	
+	.info-section {
+		background-color: #fff;
+		border-radius: 12rpx;
+		padding: 30rpx;
+		margin-bottom: 30rpx;
+		box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+		
+		.section-title {
+			font-size: 32rpx;
+			font-weight: bold;
+			margin-bottom: 24rpx;
+			border-bottom: 1px solid #eee;
+			padding-bottom: 16rpx;
+		}
+		
+		.info-item {
+			display: flex;
+			margin-bottom: 16rpx;
+			font-size: 28rpx;
+			line-height: 1.5;
+			
+			.label {
+				color: #666;
+				width: 180rpx;
+				flex-shrink: 0;
+			}
+			
+			.value {
+				flex: 1;
+				
+				&.price {
+					color: #f56c6c;
+					font-weight: bold;
+				}
+			}
+		}
+		
+		.prize-list {
+			.prize-item {
+				display: flex;
+				margin-bottom: 20rpx;
+				padding-bottom: 20rpx;
+				border-bottom: 1px solid #f5f5f5;
+				
+				&:last-child {
+					margin-bottom: 0;
+					padding-bottom: 0;
+					border-bottom: none;
+				}
+				
+				.prize-image {
+					width: 120rpx;
+					height: 120rpx;
+					border-radius: 8rpx;
+					margin-right: 20rpx;
+					background-color: #f5f5f5;
+				}
+				
+				.prize-info {
+					flex: 1;
+					display: flex;
+					flex-direction: column;
+					justify-content: space-between;
+					
+					.prize-title {
+						font-size: 28rpx;
+					}
+					
+					.prize-price {
+						font-size: 28rpx;
+						color: #f56c6c;
+					}
+				}
+			}
+		}
+	}
+}
+
+.loading, .error {
+	text-align: center;
+	padding: 100rpx 0;
+	color: #999;
+	font-size: 28rpx;
+}
+</style>
diff --git a/pages/other/order_list.vue b/pages/other/order_list.vue
new file mode 100644
index 0000000..b242a3b
--- /dev/null
+++ b/pages/other/order_list.vue
@@ -0,0 +1,160 @@
+<template>
+	<page-container title="订单列表" :showBack="true">
+		<scroll-view scroll-y="true" 
+			:refresher-enabled="true" 
+			:refresher-triggered="refreshing" 
+			@refresherrefresh="onRefresh" 
+			@scrolltolower="onLoadMore"
+			class="order-list">
+			<view class="order-item" v-for="(item, index) in orderList" :key="index" @click="goOrderDetail(item)">
+				<view class="corner-tag">已发放到盒柜中</view>
+				<view class="order-title">{{item.goods_title}}</view>
+				<view class="order-info">
+					<view class="order-time">{{item.pay_time}}</view>
+					<view class="order-price">¥{{item.order_zhe_total}}</view>
+				</view>
+			</view>
+			<view class="loading" v-if="loading">加载中...</view>
+			<view class="no-more" v-if="!hasMore && orderList.length > 0">没有更多数据了</view>
+			<view class="empty" v-if="!loading && orderList.length === 0">暂无订单数据</view>
+		</scroll-view>
+	</page-container>
+</template>
+
+<script>
+import PageContainer from '@/components/page-container/page-container.vue'
+
+
+export default {
+	components: {
+		PageContainer
+	},
+	data() {
+		return {
+			orderList: [],
+			page: 1,
+			pageSize: 20,
+			totalPages: 1,
+			loading: false,
+			refreshing: false,
+			hasMore: true
+		}
+	},
+	onLoad() {
+		this.load();
+	},
+	methods: {
+		async load() {
+			this.loading = true;
+			try {
+				const { status, data, msg } = await this.$request.post('order_list', { 
+					page: this.page, 
+					page_size: this.pageSize 
+				});
+				
+				if (status !== 1) {
+					this.$c.msg(msg);
+					return;
+				}
+				
+				if (this.page === 1) {
+					this.orderList = data.list;
+				} else {
+					this.orderList = [...this.orderList, ...data.list];
+				}
+				
+				this.totalPages = data.total_pages;
+				this.hasMore = this.page < this.totalPages;
+			} catch (error) {
+				console.error('加载订单列表失败', error);
+				this.$c.msg('加载失败，请重试');
+			} finally {
+				this.loading = false;
+				this.refreshing = false;
+			}
+		},
+		
+		async onRefresh() {
+			this.refreshing = true;
+			this.page = 1;
+			this.hasMore = true;
+			await this.load();
+		},
+		
+		async onLoadMore() {
+			if (!this.hasMore || this.loading) return;
+			
+			this.page++;
+			await this.load();
+		},
+		
+		goOrderDetail(item) {
+			uni.navigateTo({
+				url: `/pages/other/order_info?order_num=${item.order_num}`
+			});
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.order-list {
+	height: calc(100vh - 160rpx);
+	box-sizing: border-box;
+	padding: 20rpx;
+	
+	.order-item {
+		background-color: #f5f5f5;
+		border-radius: 12rpx;
+		padding: 24rpx;
+		margin-bottom: 20rpx;
+		box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+		position: relative;
+		overflow: hidden;
+		
+		.corner-tag {
+			position: absolute;
+			top: 0;
+			right: 0;
+			background-color: #67c23a;
+			color: #fff;
+			font-size: 22rpx;
+			padding: 4rpx 16rpx;
+			// transform: rotate(45deg) translate(20%, -50%);
+			transform-origin: center;
+			width: 220rpx;
+			text-align: center;
+			box-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.2);
+		}
+		
+		.order-title {
+			font-size: 32rpx;
+			font-weight: bold;
+			margin-bottom: 16rpx;
+		}
+		
+		.order-info {
+			display: flex;
+			justify-content: space-between;
+			font-size: 28rpx;
+			color: #666;
+			
+			.order-time {
+				color: #909399;
+			}
+			
+			.order-price {
+				color: #f56c6c;
+				font-weight: bold;
+			}
+		}
+	}
+	
+	.loading, .no-more, .empty {
+		text-align: center;
+		padding: 30rpx;
+		color: #999;
+		font-size: 28rpx;
+	}
+}
+</style>
\ No newline at end of file
diff --git a/pages/user/index.vue b/pages/user/index.vue
index 7a4f792..4ebb694 100644
--- a/pages/user/index.vue
+++ b/pages/user/index.vue
@@ -303,7 +303,7 @@
 						show: true,
 						title: '消费记录',
 						icon: 'my/s1.png',
-						path: '/pages/user/xfjl'
+						path: '/pages/other/order_list'
 					},
 					{
 						id: 2,
diff --git a/pages/user/xfjl.vue b/pages/user/xfjl.vue
index fe10e99..e905241 100644
--- a/pages/user/xfjl.vue
+++ b/pages/user/xfjl.vue
@@ -19,176 +19,176 @@
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				z_imgPath: this.$z_img2 + 'mine/',
-				statusBarHeight: uni.getSystemInfoSync().statusBarHeight,
-				arr: ['全部', '充值', '消费'],
-				show: 1,
-				listData: [],
+export default {
+	data() {
+		return {
+			z_imgPath: this.$z_img2 + 'mine/',
+			statusBarHeight: uni.getSystemInfoSync().statusBarHeight,
+			arr: ['全部', '充值', '消费'],
+			show: 1,
+			listData: [],
 
-				// 是否显示参与
-				downOption: {
-					auto: false
-				}
-			}
-		},
-		onLoad(e) {
-			// setTimeout(() => {
-			//   this.listData=[
-			//     {
-			//       content:'哈哈哈哈哈哈哈哈哈',
-			//       addtime:'2333-23-23 23:23:23',
-			//       change_money:233
-			//     }
-			//   ]
-			// }, 1000);
-		},
-		methods: {
-			back() {
-				uni.navigateBack()
-			},
-			getlist(v) {
-				this.show = v
-				this.loadData(1)
-			},
-
-			/*下拉刷新的回调 */
-			downCallback() {
-				//联网加载数据
-				this.loadData(1)
-			},
-			/*上拉加载的回调: 其中page.num:当前页 从1开始, page.size:每页数据条数,默认10 */
-			upCallback(page) {
-				//联网加载数据
-				this.loadData(page.num)
-			},
-			loadData(pageNo) {
-				// 模拟接口
-				let that = this
-				that.req({
-					url: 'profitPay',
-					Loading: true,
-					data: {
-						page: pageNo
-						// type: that.show
-					},
-					success(res) {
-						console.log(res)
-						that.mescroll.endByPage(res.data.data.length, res.data.last_page)
-						if (pageNo == 1) {
-							that.listData = res.data.data
-						} else {
-							that.listData = that.listData.concat(res.data.data)
-						}
-					}
-				})
+			// 是否显示参与
+			downOption: {
+				auto: false
 			}
 		}
+	},
+	onLoad(e) {
+		// setTimeout(() => {
+		//   this.listData=[
+		//     {
+		//       content:'哈哈哈哈哈哈哈哈哈',
+		//       addtime:'2333-23-23 23:23:23',
+		//       change_money:233
+		//     }
+		//   ]
+		// }, 1000);
+	},
+	methods: {
+		back() {
+			uni.navigateBack()
+		},
+		getlist(v) {
+			this.show = v
+			this.loadData(1)
+		},
+
+		/*下拉刷新的回调 */
+		downCallback() {
+			//联网加载数据
+			this.loadData(1)
+		},
+		/*上拉加载的回调: 其中page.num:当前页 从1开始, page.size:每页数据条数,默认10 */
+		upCallback(page) {
+			//联网加载数据
+			this.loadData(page.num)
+		},
+		loadData(pageNo) {
+			// 模拟接口
+			let that = this
+			that.req({
+				url: 'profitPay',
+				Loading: true,
+				data: {
+					page: pageNo
+					// type: that.show
+				},
+				success(res) {
+					console.log(res)
+					that.mescroll.endByPage(res.data.data.length, res.data.last_page)
+					if (pageNo == 1) {
+						that.listData = res.data.data
+					} else {
+						that.listData = that.listData.concat(res.data.data)
+					}
+				}
+			})
+		}
 	}
+}
 </script>
 
 <style lang="scss">
-	.coupon_r>image {
-		width: 32rpx;
-		height: 32rpx;
-		margin-left: 10rpx;
+.coupon_r>image {
+	width: 32rpx;
+	height: 32rpx;
+	margin-left: 10rpx;
+}
+
+.coupon_r {
+	font-size: 24rpx;
+	/* font-family: 'zcq'; */
+	color: #333333;
+}
+
+.coupon_item_1>view:nth-of-type(2) {
+	font-size: 20rpx;
+	color: #676767;
+	margin-top: 10rpx;
+}
+
+.coupon_item_1>view:nth-of-type(1) {
+	font-size: 24rpx;
+	// font-weight: bold;
+	color: #333333;
+}
+
+.coupon_item {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	padding: 30rpx 0;
+	box-sizing: border-box;
+	// background-color: rgba(255, 255, 255, 0.08);
+	// margin-top: 20rpx;
+	// border-radius: 10rpx;
+	position: relative;
+
+	&::after {
+		content: '';
+		display: block;
+		position: absolute;
+		left: 0;
+		bottom: 0;
+		width: 100%;
+		height: 2rpx;
+		background: rgba(255, 255, 255, 0.3);
 	}
+}
 
-	.coupon_r {
-		font-size: 24rpx;
-		/* font-family: 'zcq'; */
-		color: #333333;
-	}
-
-	.coupon_item_1>view:nth-of-type(2) {
-		font-size: 20rpx;
-		color: #676767;
-		margin-top: 10rpx;
-	}
-
-	.coupon_item_1>view:nth-of-type(1) {
-		font-size: 24rpx;
-		// font-weight: bold;
-		color: #333333;
-	}
-
-	.coupon_item {
-		display: flex;
-		justify-content: space-between;
-		align-items: center;
-		padding: 30rpx 0;
-		box-sizing: border-box;
-		// background-color: rgba(255, 255, 255, 0.08);
-		// margin-top: 20rpx;
-		// border-radius: 10rpx;
-		position: relative;
-
-		&::after {
-			content: '';
-			display: block;
-			position: absolute;
-			left: 0;
-			bottom: 0;
-			width: 100%;
-			height: 2rpx;
-			background: rgba(255, 255, 255, 0.3);
-		}
-	}
-
-	.coupon {
-		width: 690rpx;
-		margin: 20rpx auto;
-		background-color: #FFFFFF;
-		padding: 0 32rpx;
-		border-radius: 16rpx;
-		/* background: #11141D;
+.coupon {
+	width: 690rpx;
+	margin: 20rpx auto;
+	background-color: #FFFFFF;
+	padding: 0 32rpx;
+	border-radius: 16rpx;
+	/* background: #11141D;
 		box-shadow: 0px 0px 10rpx 0px rgba(150, 255, 254, 0.7);
 		 */
-		box-sizing: border-box;
-		/* border-radius: 20rpx; */
-	}
+	box-sizing: border-box;
+	/* border-radius: 20rpx; */
+}
 
-	.content {
-		width: 100vw;
-		min-height: 100vh;
-		box-sizing: border-box;
-		color: #fff;
-		background-color: #F7F7F7;
+.content {
+	width: 100vw;
+	min-height: 100vh;
+	box-sizing: border-box;
+	color: #fff;
+	background-color: #F7F7F7;
 
-		.head {
-			position: fixed;
-			top: 0;
-			z-index: 20;
+	.head {
+		position: fixed;
+		top: 0;
+		z-index: 20;
 
-			.header_title {
-				height: 70rpx;
-				line-height: 70rpx;
-				width: 100%;
-				box-sizing: border-box;
-				font-weight: bold;
+		.header_title {
+			height: 70rpx;
+			line-height: 70rpx;
+			width: 100%;
+			box-sizing: border-box;
+			font-weight: bold;
+			display: flex;
+			align-items: center;
+			padding-left: 30rpx;
+			box-sizing: border-box;
+
+			>view:nth-of-type(1) {
 				display: flex;
 				align-items: center;
-				padding-left: 30rpx;
-				box-sizing: border-box;
+			}
 
-				>view:nth-of-type(1) {
-					display: flex;
-					align-items: center;
-				}
+			>view:nth-of-type(2) {
+				width: 520rpx;
+				text-align: center;
+				/* margin: auto; */
+			}
 
-				>view:nth-of-type(2) {
-					width: 520rpx;
-					text-align: center;
-					/* margin: auto; */
-				}
-
-				image {
-					width: 48rpx;
-					height: 48rpx;
-				}
+			image {
+				width: 48rpx;
+				height: 48rpx;
 			}
 		}
 	}
+}
 </style>
\ No newline at end of file