订单详情页面最新版修改

pages/house/orderDetails.vue

@@ -80,7 +80,7 @@
 					<text slot="icon" class="txt">预约手机号</text>
 					>
 					<text slot="title" class="val">{{list.guestPhoneCopy}}</text>
-					<image style="width: 48rpx;height: 48rpx;" slot="right-icon" src="https://i.ringzle.com/file/20240605/54be8cae94374d898e4f64ca1fc2b655.png" @click="callPhone(list.guestPhone)"></image>
+					<image style="width: 48rpx;height: 48rpx;" slot="right-icon" src="https://fsy.shengsi.gov.cn/file/20240605/20affd94bb514035b654823fefcaba2e.png" @click="callPhone(list.guestPhone)"></image>
 				</u-cell>
 
 				<u-cell :border="false" v-if="list.comboType==2">

pages/house/orderInfo.vue

@@ -4,72 +4,155 @@
 		<view class="body" v-if="orderInfo.detailFormList[0]">
 			<!-- 个人信息 -->
 			<view class="uname">
-				<text style="margin-right: 50rpx;">{{orderInfo.guestName}}</text>
-				<text style="margin-right: 20rpx;">{{orderInfo.guestPhoneCopy}}</text>
-				<image class="callphone" src="https://i.ringzle.com/file/20240605/54be8cae94374d898e4f64ca1fc2b655.png" @click="callPhone(orderInfo.guestPhone)"></image>
+				<text class="dtitle" style="margin-right: 50rpx;">{{orderInfo.guestName}}</text>
+				<text class="dtitle" style="margin-right: 20rpx;">{{orderInfo.guestPhoneCopy}}</text>
+				<image class="callphone" src="https://fsy.shengsi.gov.cn/file/20240605/20affd94bb514035b654823fefcaba2e.png" @click="callPhone(orderInfo.guestPhone)"></image>
 			</view>
 			<!-- 房间信息  -->
 			<view class="room">
 				<!-- 房间/预定信息 -->
 				<view class="reservations">
-					<text
-						style="font-size: 30rpx; color: #333333; font-weight: 700;">{{orderInfo.houseBaseName}}-{{orderInfo.detailFormList[0].roomNumber}}</text>
-					<text style="font-size: 24rpx; color: #39CE77;" v-if="isOrderPanding">{{getStatusText()}}</text>
+					<text class="dtitle">{{orderInfo.houseBaseName}}-{{orderInfo.detailFormList[0].roomNumber}}</text>				
+					<text class="r_status" :style="{'background': scolor[orderInfo.orderStatus]}">{{getStatusText()}}</text>
 				</view>
 				<!-- 时间/价格 -->
 				<view class="time-price">
 					<text style="font-size: 30rpx; color: #777;">{{orderInfo.arriveDate}}入住 {{orderInfo.num}}晚</text>
-					<text style="font-size: 30rpx; color: #245BED;">￥{{orderInfo.orderAmount}}</text>
+					<text style="font-size: 30rpx;font-weight: bold; color: #111;">￥{{orderInfo.orderAmount}}</text>
 				</view>
 				<!-- 入住人数 -->
 				<view class="house-person">
 					<text style="font-size: 30rpx; color: #777;">入住人</text>
 					<view class="right">
 						<text
-							style="font-size: 30rpx; color: #777; ">{{orderInfo.detailFormList[0].checkInPersonList.length}}人
+							style="font-size: 30rpx;font-weight: bold; color: #111; ">{{orderInfo.detailFormList[0].checkInPersonList.length}}人
 						</text>
-						<!-- <u-icon name="arrow-right" @click.native="goStayCheck"></u-icon> -->
-						<!-- <u-icon name="arrow-right" ></u-icon>  -->
 					</view>
 				</view>
+				<!-- 订单信息 -->
+				<view class="r_line"></view>
+				<view class="house-person">
+					<text style="font-size: 30rpx; color: #777;">订单号</text>
+					<view class="right">
+						<text style="font-size: 30rpx; color: #111; text-align: right;">
+							{{orderInfo.orderCode}}
+						</text>
+					</view>
+				</view>
+				<view class="house-person">
+					<text style="font-size: 30rpx; color: #777;">创建时间</text>
+					<view class="right">
+						<text style="font-size: 30rpx; color: #111; text-align: right;">
+							{{orderInfo.orderTime}}
+						</text>
+					</view>
+				</view>
+				<view class="house-person" v-if="orderInfo.orderStatus==4">
+					<text style="font-size: 30rpx; color: #777;">取消原因</text>
+					<view class="right">
+						<text style="font-size: 30rpx; color: #111; text-align: right;">
+							{{orderInfo.refundReason}}
+						</text>
+					</view>
+				</view>
+				<view class="house-person">
+					<text style="font-size: 30rpx; color: #777;">备注</text>
+					<view class="right">
+						<text style="font-size: 30rpx; color: #111; text-align: right;">
+							{{orderInfo.remarks}}
+						</text>
+					</view>
+				</view>
 			</view>
-			<!-- 订单信息 -->
-
-			<u-cell-group :border="false"
-				customStyle="background-color: #fff;border-radius: 16rpx;width: 690rpx;margin:0 auto;">
-				<u-cell>
-					<text slot="icon" style="font-size: 30rpx; margin-right: 50rpx;">订单号</text>
-					<view slot="title" class="title">
-						<text>{{orderInfo.orderCode}}</text>
-					</view>
-				</u-cell>
-				<u-cell>
-					<text slot="icon" style="font-size: 30rpx; margin-right: 20rpx;">创建时间</text>
-					<view slot="title" class="title">
-						<text>{{orderInfo.orderTime}}</text>
-					</view>
-				</u-cell>
-				<!-- <u-cell>
-					<text slot="icon" style="font-size: 30rpx; margin-right: 20rpx;">办理员工</text>
-					<view slot="title" class="title">
-						<text>何伟婷</text>
+			<!-- 其他消费  -->
+			<view class="room" v-if="breakFastList.length>0||otherList.length>0">
+				<view class="reservations">
+					<text class="dtitle">其他消费</text>				
+				</view>
+				<view class="house-person" v-for="(item,index) in breakFastList" :key="index" v-if="breakFastList.length>0">
+					<text style="font-size: 30rpx; color: #777;">{{item.breakfastName}} X{{item.num}}</text>
+					<view class="right">
+						<text style="font-size: 30rpx;font-weight: bold; color: #111; ">
+							￥{{item.price*item.num}}
+						</text>
 					</view>
-				</u-cell> -->
-				<u-cell v-if="orderInfo.orderStatus==4">
-					<text slot="icon" style="font-size: 30rpx; margin-right: 20rpx;">取消原因</text>
-					<view slot="title" class="title">
-						<text>{{orderInfo.refundReason}}</text>
+				</view>
+				<view class="house-person" v-for="(item,index) in otherList" :key="index" v-if="otherList.length>0">
+					<text style="font-size: 30rpx; color: #777;">{{item.projectName}} X{{item.num}}</text>
+					<view class="right">
+						<text style="font-size: 30rpx;font-weight: bold; color: #111; ">
+							￥{{item.defaultPrice*item.num}}
+						</text>
 					</view>
-				</u-cell>
-				<u-cell>
-					<text slot="icon" style="font-size: 30rpx; margin-right: 80rpx;">备注</text>
-					<view slot="title" class="title">
-						<text>{{orderInfo.remarks}}</text>
+				</view>
+			</view>
+			<block v-if="orderInfo.repastList&&orderInfo.repastList.length>0">
+				<view class="room" v-for="(item,index) in orderInfo.repastList" :key="index">
+					<view class="dtitle" style="margin: 6rpx 0 40rpx;">餐饮订单详情</view>
+					<view class="reservations">
+						<text class="dtitle" style="color: #111;">{{item.comboName}}</text>				
+						<text class="r_status" :style="{'background': scolor[item.orderStatus]}">{{repastStr[item.orderStatus]}}</text>
+					</view>
+					<view class="time-price">
+						<text style="font-size: 28rpx; color: #717171;">预约时间  {{item.repastTime}}</text>
+						<text style="font-size: 30rpx;font-weight: bold; color: #111;">￥{{item.orderAmount}}</text>
+					</view>
+					<view class="r_line"></view>
+					<view class="house-person">
+						<text style="font-size: 30rpx; color: #777;">预约人姓名</text>
+						<view class="right">
+							<text style="font-size: 30rpx; color: #111; text-align: right;">
+								{{item.guestName}}
+							</text>
+						</view>
+					</view>
+					<block v-if="item.comboType==1">
+						<view class="house-person">
+							<text style="font-size: 30rpx; color: #777;">成人人数</text>
+							<view class="right">
+								<text style="font-size: 30rpx; color: #111; text-align: right;">
+									{{item.num}}
+								</text>
+							</view>
+						</view>
+						<view class="house-person">
+							<text style="font-size: 30rpx; color: #777;">儿童人数</text>
+							<view class="right">
+								<text style="font-size: 30rpx; color: #111; text-align: right;">
+									{{item.repastNum}}
+								</text>
+							</view>
+						</view>
+					</block>
+					<block v-if="item.comboType==2">
+						<view class="house-person">
+							<text style="font-size: 30rpx; color: #777;">就餐份数</text>
+							<view class="right">
+								<text style="font-size: 30rpx; color: #111; text-align: right;">
+									{{item.num}}份
+								</text>
+							</view>
+						</view>
+					</block>
+					<view class="house-person">
+						<text style="font-size: 30rpx; color: #777;">订单编号</text>
+						<view class="right">
+							<text style="font-size: 30rpx; color: #111; text-align: right;">
+								{{item.orderCode}}
+							</text>
+						</view>
+					</view>
+					<view class="house-person">
+						<text style="font-size: 30rpx; color: #777;">备注</text>
+						<view class="right">
+							<text style="font-size: 30rpx; color: #111; text-align: right;">
+								{{item.remarks}}
+							</text>
+						</view>
 					</view>
-				</u-cell>
-
-
-			</u-cell-group>
+				</view>
+			</block>
+			
 			<!-- 按钮 -->
 			<view class="button" v-if="orderInfo.orderStatus==-1||orderInfo.orderStatus==1||orderInfo.orderStatus==2">
 				<!-- 待确认 -->
@@ -139,7 +222,25 @@
 				orderInfo: {
 					detailFormList: []
 				},
-				id: ''
+				id: '',
+				scolor:{
+					'-2':'#FF4141',
+					'-1':'#FEA400',
+					'1':'#FEA400',
+					'2':'#A9B4C1',
+					'3':'#A9B4C1',
+					'4':'#A9B4C1',
+					'5':'#A9B4C1',
+				},
+				repastStr:{
+					'-2':'待支付',
+					'1':'未核销',
+					'2':'已核销',
+					'4':'已取消',
+					'5':'已退款'
+				},
+				breakFastList:[],
+				otherList:[],
 			}
 		},
 		onLoad(opt) {
@@ -166,6 +267,8 @@
 				this.$api.get(`/merchant/hotel/order/getOrderDetail/${this.orderId}`).then((res) => {
 					if (res.data.code == 0) {
 						this.orderInfo = res.data.data;
+						this.breakFastList = this.orderInfo.detailFormList[0].breakfastData||[];
+						this.otherList = this.orderInfo.detailFormList[0].otherData||[];
 						if(this.orderInfo.guestPhone) this.orderInfo.guestPhoneCopy = this.$aesTm.tuomin(this.orderInfo.guestPhone,2)
 						if (new Date(this.orderInfo.arriveDate).Format('yyyy-MM-dd') == new Date().Format(
 								'yyyy-MM-dd')) {
@@ -179,6 +282,8 @@
 				this.$api.get(`/merchant/hotel/repast${this.id}`).then((res) => {
 					if (res.data.code == 0) {
 						this.orderInfo = res.data.data;
+						this.breakFastList = this.orderInfo.detailFormList[0].breakfastData||[];
+						this.otherList = this.orderInfo.detailFormList[0].otherData||[];
 						if(this.orderInfo.guestPhone) this.orderInfo.guestPhoneCopy = this.$aesTm.tuomin(this.orderInfo.guestPhone,2)
 						if (new Date(this.orderInfo.arriveDate).Format('yyyy-MM-dd') == new Date().Format(
 								'yyyy-MM-dd')) {
@@ -327,17 +432,31 @@
 			margin-top: -24rpx;
 			right: 30rpx;
 		}
+	}
+	
+	.dtitle{
+		font-family: PingFang-SC, PingFang-SC;
+		font-weight: bold;
+		font-size: 36rpx;
+		color: #333333;
+		line-height: 32rpx;
 	}
 
 	.room {
 		margin-top: 20rpx;
 		width: 100%;
-		height: 246rpx;
 		background-color: #fff;
 		margin-bottom: 20rpx;
 		border-radius: 10rpx;
 		padding: 30rpx;
-		box-sizing: border-box;
+		box-sizing: border-box;
+		
+		.r_line{
+			width: 100%;
+			height: 1rpx;
+			background: #efefef;
+			margin: 24rpx 0;
+		}
 	}
 
 	.orderTip {
@@ -386,7 +505,18 @@
 
 	.reservations {
 		display: flex;
-		justify-content: space-between;
+		justify-content: space-between;
+		
+		.r_status{
+			font-family: PingFang-SC, PingFang-SC;
+			font-weight: bold;
+			font-size: 24rpx;
+			color: #FFFFFF;
+			line-height: 33rpx;
+			color: #fff;
+			padding: 4rpx 9rpx;
+			border-radius: 8rpx;
+		}
 	}
 
 	.time-price {