【类型】：docs

【原因】：和main目录下的order组件重名【过程】：shop目录下order组件更名为confirm 【影响】： # 类型包含: # feat：新功能（feature） # fix：修补bug # docs：文档（documentation） # style：格式（不影响代码运行的变动） # refactor：重构（即不是新增功能，也不是修改bug的代码变动） # test：增加测试 # chore：构建过程或辅助工具的变动
【类型】：feat
2024-12-18 17:59:59 +08:00 · 2024-12-18 17:54:05 +08:00 · 2024-12-18 17:52:08 +08:00
6 changed files with 152 additions and 260 deletions
--- a/App.vue
+++ b/App.vue
@ -3,8 +3,8 @@
 		// 数据初始化
 		onLaunch: function(options) {
 			//从二维码获取站点id 商铺id
-			this.$store.commit('setShopId', String(options.query.s));
-			this.$store.commit('setSiteId', String(options.query.z));
+			this.$store.commit('setShopId', String(options.query.s))
+			this.$store.commit('setSiteId', String(options.query.z))
 			//异步加载商铺信息
 			this.$store.dispatch('fetchShopCon')
 			//异步加载站点列表
--- a/components/orderItem/orderItem.vue
+++ b/components/orderItem/orderItem.vue
@ -0,0 +1,84 @@
+<template>
+	<view class="mealsBox rad8 flex column m-r-24 m-l-24 m-t-24 p-24 bg-w boxshadow">
+		<view class="flex">
+			<view class="flex3 ofh">
+				<view class="fz24 fcb m-t-12">订单号：{{order.order_sn}}</view>
+				<view class="fz24 fcb">{{order.order_time | parseTime}}</view>
+				<view class="fz32 l-h-18 fb">取餐点：{{order.receive_site_name}}</view>
+				<view class="spuGmap flex m-t-12 ofa">
+					<view class="m-r-12" v-for="(ps,index) in order.product_snapshot" :key="index">
+						<u--image :src="ps.spu_photo[0]" width="147rpx" height="110rpx" radius="4rpx" />
+					</view>
+				</view>
+			</view>
+			<view class="flex1 flex column md">
+				<view class="fz28 fb fcm l-h-18">{{order.shipment_status}}</view>
+				<view class="priceBox fz36 fb">
+					¥{{Number(order.transport_price) + Number(order.pack_price) + Number(order.total_price) | formatPrice}}
+				</view>
+				<view class="fz24 fcb">共{{order.total_num}}件</view>
+			</view>
+		</view>
+		<view class="m-t-24 flex mr">
+			<view class="numberBut bg-m fci rad8 fz28 fb flex mac mc" :key="foodSn">
+				{{ foodSn }}
+			</view>
+			<view class="nullBut border fcb rad8 fz28 flex mac mc m-l-24">申请售后</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import {
+		parseTime,
+		formatPrice
+	} from '@/utils/index.js'
+	export default {
+		name: 'orderItem',
+		data() {
+			return {
+				foodSn: '取餐号', //取餐号 文字轮播
+				intervalId: null, // 存储定时器ID，用于清除定时器
+			}
+		},
+		onReady() {
+			this.intervalId = setInterval(() => {
+				this.foodSn = this.foodSn === '取餐号' ? this.order.food_sn : '取餐号'
+			}, 1200)
+		},
+		destroyed() {
+			// 清除定时器，避免内存泄漏
+			clearInterval(this.intervalId);
+		},
+		props: {
+			order: {
+				type: Object,
+				deep: true
+			}
+		},
+		filters: {
+			parseTime, //日期 格式化
+			formatPrice //价格 格式化
+		},
+	}
+</script>
+
+<style lang="scss" scoped>
+	.spuGmap {
+		height: 110rpx;
+	}
+
+	.priceBox {
+		margin-top: 85rpx;
+	}
+
+	.numberBut {
+		width: 130rpx;
+		height: 48rpx;
+	}
+
+	.nullBut {
+		width: 159rpx;
+		height: 48rpx;
+	}
+</style>
--- a/pages.json
+++ b/pages.json
@ -34,7 +34,7 @@
 			}
 		},
 		{
-			"path": "pages/shop/order",
+			"path": "pages/shop/confirm",
 			"style": {
 				"navigationStyle": "custom"
 			}
--- a/pages/main/index.vue
+++ b/pages/main/index.vue
@ -1,5 +1,46 @@
 <template>
 	<view class="vh100 flex column">
+		<!-- topbar -->
+		<u-navbar title="我的" bgColor="#d43030" :titleStyle="{ color: '#FFF'}" :autoBack="true" placeholder>
+			<view class="u-nav-slot" slot="left">
+				<u-icon name="arrow-left" color="#fff" size="19"></u-icon>
+			</view>
+		</u-navbar>
+		<!-- 头像 -->
+		<view class="flex mc">
+			<view class="avatarBox rad-c">
+				<u-avatar size="300rpx" :src="avatarSrc"></u-avatar>
+			</view>
+		</view>
+		<!-- 昵称 -->
+		<view class="flex mc fz28 fb m-t-24">
+			{{userInfo.name}}
+		</view>
+		<!-- 菜单栏 -->
+		<view class="m-t-24 m-r-24 m-l-24 bg-w p-24 rad8 boxshadow">
+			<view class="fb fz36 p-b-12 borderBDas">常用功能</view>
+			<view class="flex msb">
+				<view class="setItemBox flex mac column p-24">
+					<u-icon name="order" size="28"></u-icon>
+					<view class="fz24">订单</view>
+				</view>
+				<view class="setItemBox flex mac column p-24">
+					<u-icon name="map-fill" size="28"></u-icon>
+					<view class="fz24">地图</view>
+				</view>
+				<view class="setItemBox flex mac column p-24">
+					<u-icon name="server-fill" size="28"></u-icon>
+					<view class="fz24">客服</view>
+				</view>
+				<view class="setItemBox flex mac column p-24">
+					<u-icon name="setting-fill" size="28"></u-icon>
+					<view class="fz24">设置</view>
+				</view>
+			</view>
+		</view>
+		<!-- 取餐列表 -->
+		<orderItem v-for="order in orderList" :order=order :key="order.id"></orderItem>
+		<view class="reserveBox"></view>
 		<!-- tabbar -->
 		<view>
 			<tabbar></tabbar>
@ -19,15 +60,31 @@
 			// 当页面显示时，设置tabber的激活项
 			this.$store.commit('setTabbarCurrent', 2)
 		},
-		methods: {
-		}
+		computed: {
+			userInfo() {
+				return this.$store.state.userInfo
+			},
+			//订单列表 过滤出 已付款的状态订单
+			orderList() {
+				return this.$store.state.orderList.filter(item => item.main_status === '已付款')
+			}
+		},
+		watch: {},
+		methods: {}
 	}
 </script>

-<style lang="scss">
-	.topbar {
-		background-color: $uni-color-error;
-		height: 176rpx;
+<style lang="scss" scoped>
+	.avatarBox {
+		margin-top: 89rpx;
+		border: 12rpx solid #fff;
 	}
-	.topTit{margin-right: 104rpx;}
+	.setItemBox {
+		width: 72rpx;
+		height: 72rpx;
+	}
+	.reserveBox {
+		margin-bottom: 60rpx;
+	}
+	
 </style>
--- a/pages/shop/list.vue
+++ b/pages/shop/list.vue
@ -283,7 +283,7 @@
 				const regex = /^(\+?\d{1,4}[\s-]?)?\d{3}\*{4}\d{4}$/
 				if (regex.test(this.$store.state.userInfo.tel)) { //手机号合法
 					uni.navigateTo({ //跳转到订单页面
-						url: '/pages/shop/order'
+						url: '/pages/shop/confirm'
 					})
 				} else { //手机号不合法 获取为空
 					uni.navigateTo({ //跳转到获取手机号页面
--- a/pages/shop/order.vue
+++ b/pages/shop/order.vue
@ -1,249 +0,0 @@
-<template>
-	<view class="flex column">
-		<!-- topbar -->
-		<u-navbar title="确认订单" bgColor="#d43030" :titleStyle="{ color: '#FFF'}" :autoBack="true" placeholder>
-			<view class="u-nav-slot" slot="left">
-				<u-icon name="arrow-left" color="#fff" size="19"></u-icon>
-			</view>
-		</u-navbar>
-		<!-- 地址框 -->
-		<view class="m-l-24 m-r-24 m-t-24 p-t-24 p-b-24 bg-w rad8 boxshadow">
-			<view class="flex md msb p-b-24 p-l-24 p-r-24">
-				<view class="flex md">
-					<u--image src="/static/icons/site-48.svg" width="75rpx" height="75rpx" />
-					<view class="m-l-24 fz36 fb">收货站点：<font class="fcm">{{siteCon.sitename}}</font>
-					</view>
-				</view>
-				<view>
-					<u--image src="/static/icons/pulldown-40.svg" width="40rpx" height="40rpx" />
-				</view>
-			</view>
-			<view class="colorBar"></view>
-			<view class="flex m-t-24 p-l-24 p-r-24 fz28 msb">
-				<view>配置物流</view>
-				<view>{{shopCon.name}}</view>
-			</view>
-			<view class="flex m-t-12 p-l-24 p-r-24 fz28 msb">
-				<view>送达时间</view>
-				<view>预估{{estimated}}分钟之后送达</view>
-			</view>
-		</view>
-		<!-- 订单详情 -->
-		<view class="m-l-24 m-r-24 m-t-24 p-24 bg-w rad8 boxshadow">
-			<view class="fb fz36 m-b-24">餐品详情</view>
-			<!-- cart -->
-			<view class="flex m-t-24 msb" v-for="(item,index) in cartList" :key="index">
-				<view class="flex">
-					<u--image :src="item.photo" width="192rpx" height="144rpx" />
-					<view class="m-l-24 flex column">
-						<view class="fz32 m-b-12">{{item.spu_name}}</view>
-						<view class="fz24 fcb" v-for="(i,index) in item.sku_nameG" :key="index"
-							v-if="item.sku_nameG.length>1">
-							X1 {{i}}
-						</view>
-						<view class="fz24 m-t-12">X{{item.countG[0]}}</view>
-					</view>
-				</view>
-				<view class="fz36 fb m-l-12">¥{{item | calculateTotal}}</view>
-			</view>
-		</view>
-		<!-- 价格明细 -->
-		<view class="m-l-24 m-r-24 m-t-24 p-24 bg-w rad8 boxshadow">
-			<view class="fb fz36 m-b-24 borderBDas p-b-12">价格明细</view>
-			<view class="flex msb fb m-b-12">
-				<view class="fz28">商品小计</view>
-				<view class="fz36">¥{{total | formatPrice}}</view>
-			</view>
-			<view class="flex msb fz28 m-b-12">
-				<view>外送费</view>
-				<view>¥{{transportPrice | formatPrice}}</view>
-			</view>
-			<view class="flex msb fz28 m-b-24 p-b-24 borderBDas">
-				<view>打包服务费</view>
-				<view>¥{{packPrice | formatPrice}}</view>
-			</view>
-			<view class="flex mr mac">
-				<view class="fcb fz24">合计</view>
-				<view class="m-l-12 fz36 fb">¥{{fullPrice | formatPrice}}</view>
-			</view>
-		</view>
-		<!-- 客户备注 -->
-		<view class="flex msb m-l-24 m-r-24 m-t-24 p-24 bg-w rad8 boxshadow backBox">
-			<view class="fz28">备注</view>
-			<view class="fcb fz28 flex mac">
-				<view class="fz24">口味、偏好等要求</view>
-				<u-icon name="arrow-right" size="28rpx"></u-icon>
-			</view>
-		</view>
-		<!-- 提交订单 -->
-		<view class="subBox flex mr mu p-t-24 p-b-24">
-			<view class="fz24 fcb m-r-12 l-h-18">
-				合计
-			</view>
-			<view class="flex column m-r-12">
-				<view class="fb fz36">¥{{fullPrice | formatPrice}}</view>
-				<view class="fz24">共{{totalCount}}件</view>
-			</view>
-			<view class="fz32 flex column mac mc fci rad8 m-r-24" style="width:220rpx;height:100rpx;"
-				@click="handleCheckout" :class="isPressed?'bg-g':'bg-m'">
-				<view>提交订单</view>
-				<view>Checkout</view>
-			</view>
-		</view>
-	</view>
-	</view>
-</template>
-
-<script>
-	import {
-		calculateTotal,
-		formatPrice,
-		totalPrice
-	} from '@/utils/index.js'
-
-	export default {
-		data() {
-			return {
-				isPressed: false, //提交按钮是否锁定
-				remark: '' //用户备注
-			}
-		},
-		computed: {
-			//站点信息
-			siteCon() {
-				return this.$store.state.siteList.find(item => item.id === this.$store.state.site_id.toString())
-			},
-			//商铺信息
-			shopCon() {
-				return this.$store.state.shopCon
-			},
-			//预估送达时间
-			estimated() {
-				return 30
-			},
-			//购物车列表
-			cartList() {
-				return this.$store.state.cartList
-			},
-			//购物车总价
-			total() {
-				return Number(this.totalPrice(this.$store.state.cartList))
-			},
-			//外送费
-			transportPrice() {
-				return Number(this.$store.state.shopCon.default_transport_price)
-			},
-			//打包服务费
-			packPrice() {
-				return Number(this.$store.state.shopCon.default_pack_price)
-			},
-			//购物车货品总数 ps:sku的总数 即单品总数
-			totalCount() {
-				let total = 0
-				for (let i = 0; i < this.cartList.length; i++) {
-					for (let j = 0; j < this.cartList[i].countG.length; j++) {
-						total += this.cartList[i].countG[j]
-					}
-				}
-				return total
-			},
-			//所有总价包括 商品总价 打包费 等总和
-			fullPrice() {
-				return Number(this.total) + Number(this.transportPrice) + Number(this.packPrice)
-			},
-			//用户信息
-			userInfo() {
-				return this.$store.state.userInfo
-			}
-		},
-		methods: {
-			//计算购物车总价
-			totalPrice,
-			//提交订单
-			handleCheckout() {
-				if (this.isPressed) { //防止提交订单按钮重复点击
-					return
-				}
-				this.isPressed = true
-				//提交订单
-				uni.$u.http.post('/Api/Check/checkout', {
-					cartList: JSON.stringify(this.cartList), //购物车列表
-					shop_id: this.$store.state.shop_id, //商铺id
-					total: this.total, //商品总价格
-					transport_price: this.transportPrice, //运费
-					pack_price: this.packPrice, //打包费
-					site_id: this.$store.state.site_id, //站点id
-					remark: this.remark //客户订单备注
-				}, {
-					header: {
-						'Token': this.$store.state.userInfo.token,
-						'Content-Type': 'application/x-www-form-urlencoded'
-					}
-				}).then(res => {
-					//订单添加成功
-					if (res.data.status === 1) {
-						let fullPrice = String(this.fullPrice)
-						//清空购物车
-						this.$store.commit('clearCartList')
-						//跳转到支付页面
-						uni.navigateTo({
-							url: `/pages/shop/pay?order_sn=${res.data.order_sn}&fullPrice=${fullPrice}`
-						})
-					} else if (res.data.status === -1) {
-						uni.removeStorage({ //清除用户信息 跳转首页
-							key: 'userInfo',
-							success: (res) => {
-								this.$store.commit('clearUserInfo')
-								uni.redirectTo({
-									url: '/pages/index/index'
-								})
-							}
-						})
-					} else {
-						uni.showToast({
-							title: res.data.msg,
-							icon: 'error'
-						})
-						this.isPressed = false
-					}
-				})
-			}
-		},
-		filters: {
-			calculateTotal, //计算spu单价
-			formatPrice, //格式化价格
-		},
-		onShow() {
-			//购物车没有信息 跳转到订单查询页面
-			if (this.$store.state.cartList.length === 0) {
-				uni.redirectTo({
-					url: '/pages/main/order'
-				})
-			}
-		}
-	}
-</script>
-
-<style lang="scss" scoped>
-	.subBox {
-		height: 122rpx;
-		background-color: $uni-bg-color;
-		z-index: 10076;
-		width: 100vw;
-		position: fixed;
-		bottom: 0rpx;
-	}
-
-	.backBox {
-		margin-bottom: 194rpx;
-	}
-
-	.colorBar {
-		height: 5rpx;
-		background-image: url('/static/colorBar.png');
-		background-size: contain;
-		/* 防止图像重复 */
-		background-position: center;
-		/* 居中显示 */
-	}
-</style>