<template>
	<!-- 订单详情 -->
	<view class="page1">
		<view style="height:100%" v-if="pintuan">
			<view class="title1">
				<view class="title-sreach1">
					<view class="back-btn1" @tap="back" :style="{'top': menuButtonInfo.top +'px'}">
						<uni-icons type="left" size="28"></uni-icons>
					</view>
				</view>
			</view>
			<view class="box11">
				<view class="ziqu-xuanfu1" v-if="orderDetail.deliveryType == 1">
					外卖配送
				</view>
				<view style="width: 100%;line-height: 70rpx;font-size: 28rpx;font-weight: 700;">
					{{orderDetail.shopName}}
				</view>
				<view style="display: flex;padding: 20rpx 0;background: #eee;border-radius: 20rpx;">
					<view class="goods-img1">
						<img src="/static/images/img/shangpintu.png" alt="">
					</view>
					<view class="goods-content1"   v-for="(item1,index1) in orderDetail.goodsList" :key="index1"   v-if="orderDetail.goodsList != null && orderDetail.goodsList.length > 0">
						<view class="goods-name1">
							{{item1.productName}}
						</view>
						<view class="goods-content-center1">
							<view>
								{{item1.specs}}
							</view>
						</view>
						<view class="goods-content-bottom1">
							<view style="width: 45%;">
								X{{item1.quantity}}
							</view>
							<view class="pintuan-left-price1">
								<view
									style="background: rgba(255, 57, 57, 0.2);padding: 0px 12rpx;border-radius: 20rpx;margin-left: 20rpx;">
									<text>拼团</text>
									<text style="color: red;">￥{{item1.price}}</text>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="box11" style="position: absolute;top: 800rpx;left: 2.5%;">
				<view class="kaituan11">
					<view class="kaituan1-title1">
						差{{orderDetail.groupInfo.targetMembers - orderDetail.groupInfo.currentMembers}}人即可成团
						<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/21b403bd13414ce79ad73cf1c8e3de98.png" alt="" style="width: 120rpx;height: 11px;position: absolute;bottom: 0;right: 15px;" />
					</view>
					<view class="kaituan1-title11">
						快呼唤小伙伴参加吧！
					</view>
				</view>
				<view class="kaituan21">
					<view class="kaituan221">
						<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/801c569079da4540990c1cc634186fdd.png" alt="" style="width: 90rpx;height: 90rpx;border-radius: 90rpx;margin: 0 auto;display: block;" />
					</view>
					<view class="kaituan221">
						<view class="weipincheng1" v-for="(item1,index1) in (orderDetail.groupInfo.targetMembers - orderDetail.groupInfo.currentMembers)" :key="index1">
							+
						</view>
					</view>
				</view>
				<view class="kaituan41">
					分享至微信 <uni-icons type="weixin" size="15"></uni-icons>
				</view>
				<view class="kaituan41" v-if="orderStatus(orderDetail)" @tap="returnPopupProp(orderDetail)">
					取消订单 <uni-icons type="weixin" size="15"></uni-icons>
				</view>
				<view class="kaituan41"   v-if="orderStatusBuy(orderDetail)" @tap="returnPopupPropBuy(orderDetail)">
					取消拼团转直接购买 <uni-icons type="weixin" size="15"></uni-icons>
				</view>
				<view class="kaituan41" @tap="refreah(orderDetail)">
					刷新 <uni-icons type="weixin" size="15"></uni-icons>
				</view>
				<view class="kaituan51">
					<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/c1f1b45c98fa4db1a1e5f98b3a0573c2.png" alt="" style="width: 520rpx;height: 150rpx;margin: 0 auto;display: block;" />
				</view>
			</view>
		</view>
		<view class="" v-else>
			<view class="title">
				<view class="title-sreach">
					<view class="back-btn" @tap="back" :style="{'top': menuButtonInfo.top +'px'}">
						<uni-icons type="left" size="28"></uni-icons>
					</view>
				</view>
			</view>
			<view class="content">
				<view class="box1" style="display: flex;">
					<view class="status-img">
						<img v-if="orderDetail.status == 0 || (orderDetail.status == 3 && orderDetail.deliveryType == 2)" src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/6cf6fff020614ebebb34f7c371e11331.png" alt="" />
						<img v-if="orderDetail.status == 2" src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/35ff6276eb3a4e58b8baa724ca44d5dc.png" alt="" />
						<img v-if="orderDetail.status == 5 || orderDetail.status == 8 || orderDetail.status == 12" src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/dbfa6dc934e2414c912c67430d5f802c.png" alt="" />
						<img v-if="orderDetail.status == 6" src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/03d7e8d5914e4b9ca04728113900d1fe.png" alt="" />
						<img v-if="orderDetail.status == 7 || orderDetail.status == 11" src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/35ff6276eb3a4e58b8baa724ca44d5dc.png" alt="" />
						<img v-if="(orderDetail.status == 3 && orderDetail.deliveryType == 1) || (orderDetail.status == 4 && orderDetail.deliveryType == 1)" src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/0ab87a35cbca473997c679a023337df6.png" alt="" />
						<!-- 
							待支付  https://jewel-shop.oss-cn-beijing.aliyuncs.com/6cf6fff020614ebebb34f7c371e11331.png
							订单取消  https://jewel-shop.oss-cn-beijing.aliyuncs.com/03d7e8d5914e4b9ca04728113900d1fe.png
							等待商家接单、等待配送员接单、等待商家同意  https://jewel-shop.oss-cn-beijing.aliyuncs.com/35ff6276eb3a4e58b8baa724ca44d5dc.png
							配送中、配送员已接单、配送员已到店、等待配送员接单  https://jewel-shop.oss-cn-beijing.aliyuncs.com/0ab87a35cbca473997c679a023337df6.png
							订单完成  https://jewel-shop.oss-cn-beijing.aliyuncs.com/dbfa6dc934e2414c912c67430d5f802c.png
						 -->
					</view>
					<view class="status-text">
						<view class="status-zhu">
							<text v-if="orderDetail.status == 0">待支付</text>
							<text v-if="orderDetail.status == 2">等待配送员接单</text>
							<text v-if="orderDetail.status == 3 && orderDetail.deliveryType == 1">配送员已接单</text>
							<text v-if="orderDetail.status == 3 && orderDetail.deliveryType == 2">待消费</text>
							<text v-if="orderDetail.status == 4 && orderDetail.deliveryType == 1">配送员已取货</text>
							<text v-if="orderDetail.status == 5">订单已完成</text>
							<text v-if="orderDetail.status == 7">等待同意退款</text>
							<text v-if="orderDetail.status == 6">订单已取消</text>
							<text v-if="orderDetail.status == 8">订单已退款</text>
							<text v-if="orderDetail.status == 11">售后中</text>
							<text v-if="orderDetail.status == 12">订单已售后</text>
							<text v-if="orderDetail.status != 5 && orderDetail.status != 8 && orderDetail.status != 12 && orderDetail.returnStatus == 1">(商家拒绝退款)</text>
						</view>
						<view class="status-fu" v-if="orderDetail.deliveryInfo">
							<view class="">预计<text>{{orderDetail.deliveryInfo.mustFinishTime | formatHourMinute }}</text>送达</view>
							<!-- <view class="">超过15分钟未支付，订单自动取消</view>
							<view class="">您申请了取消订单，请等待商家同意</view>
							<view class="">商家已同意取消订单，订单金额将原路返回</view>
							<view class="">商家已拒绝取消订单，将会继续为您配送</view> -->
						</view>
						<view class="status-address" v-if="orderDetail.deliveryInfo">
							送至 <text>{{orderDetail.deliveryInfo.receiverAddress}}</text>
						</view>
						<view class="status-btn" style="top: 0;" v-if="orderStatus(orderDetail)" @tap="returnPopupProp(orderDetail)">
							取消订单
						</view>
						<view class="status-btn" style="top: 0;" v-if="orderDetail.status == 5 && orderDetail.mallRefundRecord.length < 1" @tap="returnProducts(orderDetail)">
							申请售后
						</view>
						<view  class="status-btn" style="top: 35px;"  @tap="refreah(orderDetail)">
							刷新
						</view>
						<!-- <view class="status-btn">
							去评价
						</view> -->
					</view>
				</view>
				<view class="btn-box">
					<view class="btn" v-if="orderDetail.status == 3 && orderDetail.deliveryType == 2" @tap="openCode">
						核销取餐码 需要画二维码
					</view>
					<view class="btn" v-if="orderDetail.status == 3 && orderDetail.deliveryType == 2" @tap="openCode">
						立即备餐
					</view>
					<view class="btn" style="width: 40%;" v-if="orderDetail.status == 2" @tap="">
						增加配送佣金
					</view>
					<view class="btn" style="width: 40%;" v-if="orderDetail.status == 2" @tap="">
						指派配送员
					</view>
					<!-- <view class="btn">
						再来一单
					</view>
					<view class="btn">
						￥5 去支付
					</view>
					<view class="btn">
						增加配送佣金
					</view>
					<view class="btn">
						取消申请
					</view> -->
				</view>
				<view class="box1" v-if="orderDetail.mallRefundRecord != null && orderDetail.mallRefundRecord.length > 0">
					<view style="width: 100%;line-height: 70rpx;font-size: 30rpx;font-weight: 700;">
						退款/售后
					</view>
					<view style="display: flex;padding: 20rpx;background: #eee;border-radius: 20rpx;" v-for="(item2,index2) in orderDetail.mallRefundRecord" :key="index2">
						
						<view>
							<view style="height: 80rpx;line-height: 80rpx;display: flex;">
								<view style="flex: 1;color: #777;font-weight: 700;">
									申请时间
								</view>
								<view style="color: #000;font-weight:700;">
									{{item2.createTime | formatTime}}
								</view>
							</view>
							<view style="height: 80rpx;line-height: 80rpx;display: flex;">
								<view style="flex: 1;color: #777;font-weight: 700;">
									金额
								</view>
								<view style="color: #000;font-weight:700;">
									{{item2.refundAmount}}
								</view>
							</view>
							<view  v-for="(item3,index3) in item2.items" :key="index3"   v-if="item2.items != null && item2.items.length > 0" style="display: flex;padding: 20rpx;background: #eee;border-radius: 20rpx;">
								<view class="goods-img">
									<img :src="item3.productPicture" alt="">
								</view>
								<view class="goods-content">
									<view class="goods-name">
										{{item3.productName}}
									</view>
									<view class="goods-content-center">
										<view class="goods-deal1">
											{{item3.specs}}
										</view>
									</view>
									<view class="goods-content-bottom">
										<view style="width: 50%;">
											X{{item3.quantity}}
										</view>
										<view class="pintuan-left-price">
											￥{{item3.price}}
										</view>
									</view>
								</view>
							</view>
							<view style="height: 80rpx;line-height: 80rpx;display: flex;">
								<view style="flex: 1;color: #777;font-weight: 700;">
									原因
								</view>
								<view style="color: #000;font-weight:700;">
									{{item2.reason != null ? item2.reason : ''}}
								</view>
							</view>
							<view style="height: 80rpx;line-height: 80rpx;display: flex;">
								<view style="flex: 1;color: #777;font-weight: 700;">
									图片
								</view>
								<view style="color: #000;font-weight:700;">
									<image v-if="item2.pictures != null" :src="item2.pictures"></image>
								</view>
							</view>
							<view style="height: 80rpx;line-height: 80rpx;display: flex;">
								<view style="flex: 1;color: #777;font-weight: 700;">
									退款类型
								</view>
								<view style="color: #000;font-weight:700;">
									{{item2.refundType == 1 ? '退商品' : item2.refundType == 2 ? '退配送费' : '全额退款' }}
									<text v-if="item2.refundTypeStatus != null">
										| {{item2.refundTypeStatus == 1 ? '商家原因' : item2.refundTypeStatus == 2 ? '配送员原因' : item2.refundTypeStatus == 3 ? '商家/配送员都有原因' : '平台退款' }}
									</text>
								</view>
							</view>
							<view style="height: 80rpx;line-height: 80rpx;display: flex;">
								<view style="flex: 1;color: #777;font-weight: 700;">
									退款状态
								</view>
								<view style="color: #000;font-weight:700;">
									{{item2.status == 0 ? '处理退款中' : item2.status == 1 ? '同意退款' : item2.status == 2 ? '拒绝退款' : item2.status == 3 ? '处理售后中' : item2.status == 4 ? '同意售后' : '拒绝售后' }}
								</view>
							</view>
							<view style="height: 80rpx;line-height: 80rpx;display: flex;" v-if="item2.successTime != null">
								<view style="flex: 1;color: #777;font-weight: 700;">
									处理退款/售后时间
								</view>
								<view style="color: #000;font-weight:700;">
									{{item2.successTime | formatTime}}
								</view>
							</view>
						</view>
					</view>
					
				</view>
				
				<view class="box1">
					<view style="width: 100%;line-height: 70rpx;font-size: 28rpx;font-weight: 700;">
						{{orderDetail.shopName}} 
						<img @tap="makeCall(orderDetail.shopPhone)"
							src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/869a7af6a1c24bf3a0d523c4a18b55c6.png"
							alt="" style="width: 60rpx;height: 60rpx;" />
					</view>
					
					<view  v-for="(item1,index1) in orderDetail.goodsList" :key="index1"   v-if="orderDetail.goodsList != null && orderDetail.goodsList.length > 0" style="display: flex;padding: 20rpx;background: #eee;border-radius: 20rpx;">
						<view class="goods-img">
							<img :src="item1.productPicture" alt="">
						</view>
						<view class="goods-content">
							<view class="goods-name">
								{{item1.productName}}
							</view>
							<view class="goods-content-center">
								<view class="goods-deal1">
									{{item1.specs}}
								</view>
							</view>
							<view class="goods-content-bottom">
								<view style="width: 50%;">
									X{{item1.quantity}}
								</view>
								<view class="pintuan-left-price">
									￥{{item1.price}}
								</view>
							</view>
						</view>
					</view>
					<view>
						<view style="height: 80rpx;line-height: 80rpx;display: flex;" v-if="orderDetail.packageFee != null && orderDetail.packageFee > 0">
							<view style="flex: 1;color: #777;font-weight: 700;">
								打包费
							</view>
							<view style="color: #000;font-weight:700;">
								￥{{orderDetail.packageFee}}
							</view>
						</view>
						<view style="height: 80rpx;line-height: 80rpx;display: flex;" v-if="orderDetail.deliveryType == 1">
							<view style="flex: 1;color: #777;font-weight: 700;">
								配送费
							</view>
							<view style="color: #000;font-weight:700;">
								￥{{orderDetail.deliveryFee}}
							</view>
						</view>
						<view style="height: 80rpx;line-height: 80rpx;display: flex;">
							<view style="flex: 1;color: #777;font-weight: 700;">
								优惠券
							</view>
							<view style="color: #000;font-weight:700;">
								-￥1 <uni-icons type="right" size="12"></uni-icons>
							</view>
						</view>
					</view>
					<view style="display: flex;height: 80rpx;line-height: 100rpx;border-top: 1px solid #eee;font-size: 32rpx;font-weight: 700;">
						<view style="flex: 1;">
							实付
						</view>
						<view class="">
							￥{{orderDetail.totalAmount}}
						</view>
					</view>
				</view>
				
				<view class="box1">
					<view>
						<!-- <view style="height: 80rpx;line-height: 80rpx;display: flex;">
							<view style="flex: 1;color: #777;font-weight: 700;">
								收件地址
							</view>
							<view style="color: #000;font-weight: 700;">
								北校区1号宿舍楼5楼512(0702)
							</view>
						</view> -->
						<view style="height: 80rpx;line-height: 80rpx;display: flex;" v-if="orderDetail.numberCode != null">
							<view style="flex: 1;color: #777;font-weight: 700;">
								订单号
							</view>
							<view style="color: #000;font-weight: 700;">
								{{orderDetail.numberCode}}
							</view>
						</view>
						<view style="height: 80rpx;line-height: 80rpx;display: flex;">
							<view style="flex: 1;color: #777;font-weight: 700;">
								下单时间
							</view>
							<view style="color: #000;font-weight: 700;">
								{{orderDetail.createTime | formatTime}}
							</view>
						</view>
						<view style="height: 80rpx;line-height: 80rpx;display: flex;" v-if="orderDetail.deliveryType == 1">
							<view style="flex: 1;color: #777;font-weight: 700;">
								配送员
							</view>
							<view style="color: #000;font-weight: 700;" v-if="orderDetail.deliveryInfo && orderDetail.deliveryInfo.workerId != null && orderDetail.deliveryInfo.workerId != ''">
								{{orderDetail.deliveryInfo.workerName != null ? orderDetail.deliveryInfo.workerName : ''}}
								<img @tap="makeCall(orderDetail.deliveryInfo.workerPhone)"
									src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/869a7af6a1c24bf3a0d523c4a18b55c6.png"
									alt="" style="width: 60rpx;height: 60rpx;" />
							</view>
							<view style="color: #000;font-weight: 700;" v-else>
								未指定等待接单中
							</view>
						</view>
						<view style="height: 80rpx;line-height: 80rpx;display: flex;" v-if="orderDetail.deliveryInfo && orderDetail.deliveryType == 1 && orderDetail.deliveryInfo.workerId">
							<view style="flex: 1;color: #777;font-weight: 700;">
								配送员接单时间
							</view>
							<view style="color: #000;font-weight: 700;">
								{{orderDetail.deliveryInfo.acceptTime | formatTime}}
							</view>
						</view>
						<view style="height: 80rpx;line-height: 80rpx;display: flex;" v-if="orderDetail.deliveryType == 1">
							<view style="flex: 1;color: #777;font-weight: 700;">
								商家出餐时间
							</view>
							<view style="color: #000;font-weight: 700;" v-if="orderDetail.deliveryInfo && orderDetail.deliveryInfo.workerId != null && orderDetail.deliveryInfo.workerId != ''">
								{{orderDetail.shopMakeTime ? orderDetail.shopMakeTime : ''  | formatTime}}
							</view>
						</view>
						<view style="height: 80rpx;line-height: 80rpx;display: flex;" v-if="orderDetail.deliveryInfo && orderDetail.deliveryType == 1 && orderDetail.deliveryInfo.workerId != ''">
							<view style="flex: 1;color: #777;font-weight: 700;">
								配送员到店时间
							</view>
							<view style="color: #000;font-weight: 700;" v-if="orderDetail.deliveryInfo">
								{{orderDetail.deliveryInfo.arriveTime ? orderDetail.deliveryInfo.arriveTime : ''  | formatTime}}
							</view>
						</view>
						<view style="height: 80rpx;line-height: 80rpx;display: flex;" v-if="orderDetail.deliveryInfo && orderDetail.deliveryType == 1 && orderDetail.deliveryInfo.workerId != ''">
							<view style="flex: 1;color: #777;font-weight: 700;">
								配送员取货时间
							</view>
							<view style="color: #000;font-weight: 700;">
								{{orderDetail.deliveryInfo.getTime ? orderDetail.deliveryInfo.getTime : ''  | formatTime}}
							</view>
						</view>
						<view style="height: 80rpx;line-height: 80rpx;display: flex;" v-if="orderDetail.deliveryType == 1">
							<view style="flex: 1;color: #777;font-weight: 700;">
								送达时间
							</view>
							<view style="color: #000;font-weight: 700;" v-if="orderDetail.deliveryInfo">
								{{orderDetail.deliveryInfo.finishTime ? orderDetail.deliveryInfo.finishTime : '尽快送达'  | formatTime}}
							</view>
						</view>
						
					</view>
				</view>
			</view>
		</view>
		<!-- 核销二维码弹出层 -->
		<uni-popup ref="imgPopup" background-color="#fff">
			<view class="img-popup-content" @tap="$refs.imgPopup.close()">
				<img :src="codeImg" alt="" style="width: 330rpx;height: 330rpx;margin: 282rpx 0 0 136rpx;border: 20rpx solid rgba(222, 255, 248, 1);border-radius: 20rpx;">
			</view>
		</uni-popup>
		
		<uni-popup ref="returnPopup" background-color="#fff" style="height: 1600rpx !important;">
			<view class="car-content" v-if="orderDetail.deliveryType == 1 && orderDetail.status != 10">
				<view class="car-close">
					<uni-icons type="close" size="30" color="#fff"></uni-icons>
				</view>
				<view class="car-title">
					选择退款原因
				</view>
				<view class="">
					<view class="">
						全额退款（商家原因）
						<radio :checked="sellTime==2" name="sellTime" @click="checkSellTime(2)" />
					</view>
					<view class="">
						全额退款（配送员原因）
						<radio :checked="sellTime==3" name="sellTime" @click="checkSellTime(3)" />
					</view>
					<view class="">
						全额退款（商家+配送员原因）
						<radio :checked="sellTime==4" name="sellTime" @click="checkSellTime(4)" />
					</view>
				</view>
			</view>
			<view class="guize-list">
				<view style="height: 80rpx;line-height: 80rpx;font-size: 36rpx;font-weight: 700;text-align: center;">
					确定要取消订单吗
					<text v-if="((payData.orderType == 2 || payData.orderType == 3) && payData.status == 2) || ((payData.orderType == 2 || payData.orderType == 3) && payData.status == 3)  || (payData.deliveryType == 1 && payData.status == 3) || payData.status == 4">取消订单需要商家同意</text>
					<view v-if="(payData.status == 3 && payData.deliveryType ==1) || payData.status == 4">
						<text v-if="payData.shopMakeTime == null">商家还未出餐</text>
						<text v-else>本单商家备餐时长共计{{shopTime}} 配送员配送时长共计{{peisongTime}}</text>
					</view>
				</view>
				<view class="btn" @tap="returnOrder()">
					确认取消
				</view>
			</view>
		</uni-popup>
		
		<uni-popup ref="returnPopupBuy" background-color="#fff" style="height: 1600rpx !important;">
			
			<view class="guize-list">
				<view style="height: 80rpx;line-height: 80rpx;font-size: 36rpx;font-weight: 700;text-align: center;">
					确定要取消拼团吗
				</view>
				<view class="btn" @tap="returnOrderBuy()">
					确认取消
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				pintuan:false,
				sellTime:2,
				menuButtonInfo: {},
				refundType:3,
				refundTypeStatus:4,
				shopTime:'',
				peisongTime:'',
				orderId:'',
				payData:{},
				orderDetail:{},
				codeImg:'https://jewel-shop.oss-cn-beijing.aliyuncs.com/3a4e68eb14d7417cbb4f15fa85907c64.jpg'
			}
		},
		components: {
	
		},
		filters: {
		  formatHourMinute(value) {
		    if (!value) return '';
		        
		        const date = new Date(value);
		        
		        // 获取日 (getDate)，并补齐0
		        const day = String(date.getDate()).padStart(2, '0');
		        
		        // 获取小时 (getHours)，并补齐0
		        const hour = String(date.getHours()).padStart(2, '0');
		        
		        // 获取分钟 (getMinutes)，并补齐0
		        const minute = String(date.getMinutes()).padStart(2, '0');
		        
		        // 拼接格式：日-日-时:分
		        return `${day}-${hour}:${minute}`;
		  },
		  formatTime(value) {
		    if (!value) return '';
		    if(value == '尽快送达')  return '尽快送达';
		    const date = new Date(value);
		    
		    // 获取年份
		    const year = date.getFullYear();
		    
		    // 获取月份 (getMonth 返回 0-11，所以需要 +1)，并补齐0
		    const month = String(date.getMonth() + 1).padStart(2, '0');
		    
		    // 获取日 (getDate)，并补齐0
		    const day = String(date.getDate()).padStart(2, '0');
		    
		    // 获取小时 (getHours)，并补齐0
		    const hour = String(date.getHours()).padStart(2, '0');
		    
		    // 获取分钟 (getMinutes)，并补齐0
		    const minute = String(date.getMinutes()).padStart(2, '0');
		    
		    // 获取秒 (getSeconds)，并补齐0
		    const second = String(date.getSeconds()).padStart(2, '0');
		    
		    // 拼接格式：年-月-日 时:分:秒
		    return `${year}-${month}-${day} ${hour}:${minute}:${second}`;
		  }
		},
		onLoad(option) {
			if (option.id) {
				this.orderId = option.id
				this.getOrderDetail(this.orderId)
			}
		},
		onShow() {
			this.menuButtonInfo = uni.getMenuButtonBoundingClientRect()
		},
		methods: {
			openCode(){
				this.$refs.imgPopup.open()
			},
			checkSellTime(type){
				this.sellTime = type;
				if(this.sellTime == 2){
					//this.returnData.refundAmount = this.orderDetail.totalAmount
					this.refundType = 3
					this.refundTypeStatus = 1
				}else if(this.sellTime == 3){
					//this.returnData.refundAmount = this.orderDetail.totalAmount
					this.refundType = 3
					this.refundTypeStatus = 2
				}else{
					//this.returnData.refundAmount = this.orderDetail.totalAmount
					this.refundType = 3
					this.refundTypeStatus = 3
				}
			},
			makeCall(phone){
				uni.makePhoneCall({
					phoneNumber: phone
				});
			},
			orderStatus(item){
				if(item.status == 0 || item.status == 10 || item.status == 2 || (item.status == 3 && item.deliveryType == 1) || (item.status == 3 && item.deliveryType == 2) || item.status == 4){
					return true;
				}
				return false;
			},
			orderStatusBuy(item){
				if(item.status == 10){
					return true;
				}
				return false;
			},
			returnPopupProp(item){
				this.payData = item;
				if(this.payData.shopMakeTime != null){
					const date1 = new Date(this.payData.deliveryInfo.acceptTime);
					const date2 = new Date(this.payData.shopMakeTime);
													
					// 2. 计算毫秒差值 (取绝对值，防止结果为负数)
					let diffMs = Math.abs(date2 - date1);
													
					// 3. 数学换算
					// 1秒 = 1000毫秒
					// 1分 = 60秒
					// 1时 = 60分
					const seconds = Math.floor((diffMs / 1000) % 60);
					const minutes = Math.floor((diffMs / (1000 * 60)) % 60);
					const hours = Math.floor(diffMs / (1000 * 60 * 60));
													
					// 4. 格式化输出 (可选：补零操作，例如 9秒 -> 09秒)
					const fmt = (num) => num.toString().padStart(2, '0');
													
					this.shopTime = `${fmt(hours)}时${fmt(minutes)}分${fmt(seconds)}秒`; 
					
					const date3 = new Date();
							  
					// 2. 计算毫秒差值 (取绝对值，防止结果为负数)
					let diffMs1 = Math.abs(date3 - date2);
							  
					// 3. 数学换算
					// 1秒 = 1000毫秒
					// 1分 = 60秒
					// 1时 = 60分
					const seconds1 = Math.floor((diffMs1 / 1000) % 60);
					const minutes1 = Math.floor((diffMs1 / (1000 * 60)) % 60);
					const hours1 = Math.floor(diffMs1 / (1000 * 60 * 60));
							  
					this.peisongTime =  `${fmt(hours1)}时${fmt(minutes1)}分${fmt(seconds1)}秒`;
				}
				this.$refs.returnPopup.open('bottom');
			},
			returnPopupPropBuy(item){
				this.payData = item;
				if(this.payData.shopMakeTime != null){
					const date1 = new Date(this.payData.deliveryInfo.acceptTime);
					const date2 = new Date(this.payData.shopMakeTime);
													
					// 2. 计算毫秒差值 (取绝对值，防止结果为负数)
					let diffMs = Math.abs(date2 - date1);
													
					// 3. 数学换算
					// 1秒 = 1000毫秒
					// 1分 = 60秒
					// 1时 = 60分
					const seconds = Math.floor((diffMs / 1000) % 60);
					const minutes = Math.floor((diffMs / (1000 * 60)) % 60);
					const hours = Math.floor(diffMs / (1000 * 60 * 60));
													
					// 4. 格式化输出 (可选：补零操作，例如 9秒 -> 09秒)
					const fmt = (num) => num.toString().padStart(2, '0');
													
					this.shopTime = `${fmt(hours)}时${fmt(minutes)}分${fmt(seconds)}秒`; 
					
					const date3 = new Date();
							  
					// 2. 计算毫秒差值 (取绝对值，防止结果为负数)
					let diffMs1 = Math.abs(date3 - date2);
							  
					// 3. 数学换算
					// 1秒 = 1000毫秒
					// 1分 = 60秒
					// 1时 = 60分
					const seconds1 = Math.floor((diffMs1 / 1000) % 60);
					const minutes1 = Math.floor((diffMs1 / (1000 * 60)) % 60);
					const hours1 = Math.floor(diffMs1 / (1000 * 60 * 60));
							  
					this.peisongTime =  `${fmt(hours1)}时${fmt(minutes1)}分${fmt(seconds1)}秒`;
				}
				this.$refs.returnPopupBuy.open('bottom');
			},
			returnOrder(){
				this.$refs.returnPopup.close();
				let item = this.payData
				let that = this
				that.tui.request("/mall/order/cancel", "POST", {refundType:this.refundType,refundTypeStatus:this.refundTypeStatus,orderId:item.id,userId:uni.getStorageSync('id')}, false, true).then((res) => {
					if (res.code == 200) {
						that.tui.toast("取消订单成功");
						that.getOrderDetail(item.id)
						that.$forceUpdate();
					} else {
						that.tui.toast(res.message);
						return;
					}
					uni.hideLoading();
				}).catch((res) => {});
			},
			returnOrderBuy(){
				this.$refs.returnPopupBuy.close();
				let item = this.payData
				let that = this
				that.tui.request("/mall/order/cancel", "POST", {refundType:3,refundTypeStatus:4,orderId:item.id,userId:uni.getStorageSync('id')}, false, true).then((res) => {
					if (res.code == 200) {
						that.tui.request("/app/shop/getShopInfoById", "POST", {id:that.payData.shopId,regionId:JSON.parse(uni.getStorageSync('area')).id}, false, true).then((res1) => {
							if (res1.code == 200) {
								uni.hideLoading();
								// 类似普通订单结算逻辑
								let cartItems = [];
								for(let i = 0;i<that.payData.goodsList.length;i++){
									let productPrice = that.payData.goodsList[i].price
									for(let a = 0;a<res1.result.products.length;a++){
										if(res1.result.products[a].id == that.payData.goodsList[i].productId){
											let priceToUse = 0;
											if (res1.result.products[a].attributeListPrice) {
												try {
													let pObj = typeof res1.result.products[a].attributeListPrice === 'string' ? JSON.parse(res1.result.products[a].attributeListPrice) :
														res1.result.products[a].attributeListPrice;
													if (Array.isArray(pObj) && pObj.length > 0) {
														priceToUse = parseFloat(pObj[0].specPrice);
													} else {
														for (let k in pObj) {
															priceToUse = parseFloat(pObj[k].specPrice);
															break;
														}
													}
												} catch (e) {}
											}
											productPrice = priceToUse
										}
									}
									that.payData.goodsList[i].id = that.payData.goodsList[i].productId
									let specStr = that.payData.goodsList[i].specs;
									let cartId = that.payData.goodsList[i].productId + '_' + specStr;
									cartItems.push({
										cartId: cartId,
										item: that.payData.goodsList[i],
										specs: JSON.parse(that.payData.goodsList[i].specs),
										quantity: that.payData.goodsList[i].quantity,
										price: productPrice.toFixed(2)
									});
								}
								uni.navigateTo({
									url: '/package1/buyFood/buyFood?cart=' + encodeURIComponent(JSON.stringify(cartItems)) +
										'&shopItem=' + encodeURIComponent(JSON.stringify(res1.result.shop)) + '&packageFee=' +
										that.payData.packageFee
								});
							} else {
								that.tui.toast(res.message);
								return;
							}
							uni.hideLoading();
						}).catch((res1) => {});
					} else {
						that.tui.toast(res.message);
						return;
					}
					uni.hideLoading();
				}).catch((res) => {});
			},
			refreah(item){
				this.getOrderDetail(item.id)
				this.$forceUpdate();
			},
			returnProducts(item){
				uni.navigateTo({
					url: '/package1/order/returnOrder?order=' + encodeURIComponent(JSON.stringify(item))
				});
			},
			getOrderDetail(id){
				this.pintuan = false;
				let that = this
				that.tui.request("/mall/order/detail/"+id, "GET", {}, false, true).then((res) => {
					if (res.code == 200) {
						that.orderDetail = res.result;
						if(that.orderDetail.groupInfo){
							//还没有拼团成功拼团状态 0:拼团中 1:拼团成功 2:拼团失败 3:面对面团(不公开)
							if(that.orderDetail.groupInfo.status != 1 && that.orderDetail.groupInfo.status != 2){
								that.pintuan = true;
							}
						}
						that.$forceUpdate();
					} else {
						that.tui.toast(res.message)
						return
					}
				}).catch((res) => {})
			},
			back() {
				uni.navigateBack()
			}
		}
	
	}
</script>

<style lang="scss">
	page {
		width: 100%;
		height: 100%;
		font-size: 24rpx;
		background: #F5F8F5;
		color: #00231C;
	}
	
	.page1 {
		width: 100%;
		height: 100%;
		font-size: 24rpx;
		position: relative;
	}
	
	.title{
		background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat;
		width: 100%;
		height: 54%;
	}
	
	.content{
		position: absolute;
		top: 200rpx;
		width: 95%;
		margin-left: 2.5%;
	}
	
	.title-sreach{
		width: 100%;
		display: flex;
		height: 200rpx;
		position: relative;
	}
	
	.back-btn{
		position: absolute;
		bottom: 0;
		left: 0;
	}
	.box1{
		width: 95%;
		margin: 0 auto 20rpx;
		background: #fff;
		border-radius: 20rpx;
		    padding: 20rpx;
	}
	.goods-img {
		width: 160rpx;
		height: 160rpx;
		position: relative;
	
		img {
			width: 100%;
			background-size: 100%;
			height: 100%;
		}
	}
	.goods-content {
		flex: 1;
		padding-left: 20rpx;
	}
	
	.goods-name {
		font-size: 32rpx;
		font-weight: 900;
	}
	
	.goods-content-center {
		display: flex;
		    margin: 16rpx 0;
		    color: #777;
	}
	.goods-deal1 {
		width: 60%;
	}
	.goods-content-bottom {
		    display: flex;
		    line-height: 56rpx;
		    color: #777;
	}
	.pintuan-left-price {
		    width: 50%;
		    text-align: right;
		    font-weight: 700;
		    color: #000;
	}
	.status-img{
		    width: 84rpx;
		    height: 84rpx;
			img{
				    width: 84rpx;
				    height: 84rpx;
				    background-size: 100%;
			}
	}
	.status-text{
		flex: 1;
		    position: relative;
		    padding-left: 20rpx;
	}
	.status-zhu{
		    font-size: 32rpx;
		    font-weight: 700;
	}
	.status-fu{
		    height: 50rpx;
		    line-height: 50rpx;
	}
	.status-address{
		    font-weight: 700;
	}
	.status-btn{
		position: absolute;
		    top: 20rpx;
		    right: 0;
		    background: #eee;
		    width: 130rpx;
		    height: 50rpx;
		    text-align: center;
		    line-height: 50rpx;
		    border-radius: 16rpx;
		    color: #777;
		    border: 1px solid #777;
		    font-size: 20rpx;
	}
	.btn-box{
		height: 120rpx;
	}
	.btn{
		width: 90%;
		height: 100rpx;
		line-height: 100rpx;
		background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1));
		font-size: 32rpx;
		border-radius: 120rpx;
		text-align: center;
		margin: 0 auto;
		font-weight: 700;
	}
	.img-popup-content {
		width: 600rpx;
		height: 800rpx;
		background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/73e684e3319c468d9252461ba3c9e95b.png') no-repeat;
		background-size: 100%;
	}
	
	.title1 {
		background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/69c894452e924bedbb5a24bf978f47c7.png') no-repeat;
		width: 100%;
		height: 30%;
		background-size: 100%;
	}
	
	.title-sreach1 {
		width: 100%;
		display: flex;
		height: 200rpx;
		position: relative;
	}
	
	.back-btn1 {
		position: absolute;
		bottom: 0;
		left: 0;
	}
	
	.box11 {
		width: 95%;
		margin: 0 auto 20rpx;
		background: #fff;
		border-radius: 20rpx;
		padding: 20rpx;
		position: absolute;top: 450rpx;left: 2.5%;
	}
	
	.goods-img1 {
		width: 160rpx;
		height: 160rpx;
		position: relative;
	
		img {
			width: 100%;
			background-size: 100%;
			height: 100%;
		}
	}
	
	.goods-content1 {
		flex: 1;
		padding-left: 20rpx;
	}
	
	.goods-name1 {
		font-size: 32rpx;
		font-weight: 900;
	}
	
	.goods-content-center1 {
		display: flex;
		margin: 16rpx 0;
		color: #777;
	}
	
	.pintuan-left-price1 {
		width: 55%;
		text-align: right;
		font-weight: 700;
		color: #000;
		display: flex;
	}
	
	.goods-content-bottom {
		display: flex;
		line-height: 56rpx;
		color: #777;
	}
	
	.ziqu-xuanfu1 {
		position: absolute;
		top: 0;
		right: 0;
		background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1));
		border-top-right-radius: 20rpx;
		border-bottom-left-radius: 20rpx;
		font-weight: 700;
		font-size: 20rpx;
		height: 56rpx;
		width: 120rpx;
		text-align: center;
		line-height: 56rpx;
	}
	
	.weipincheng1 {
		width: 90rpx;
		height: 90rpx;
		background: #a6ffea;
		border-radius: 90rpx;
		text-align: center;
		font-size: 60rpx;
		font-weight: 700;
		margin-left: -6rpx;
		z-index: 97;
		color: #02fbdd;
		border: 1px solid #a6ffea;
		line-height: 80rpx;
		    margin: 0 auto;
	}
	.kaituan11{
		display: flex;
		    height: 70rpx;
		    font-size: 44rpx;
		    font-weight: 700;
		    margin-top: 20rpx;
	}
	.kaituan1-title1{
		position: relative;
		    margin-left: 20rpx;
	}
	.kaituan1-title11{
		    font-size: 24rpx;
		    background: rgba(224, 255, 222, 0.65);
		    border: 1px solid rgba(166, 255, 234, 1);
		    border-radius: 20rpx;
		    height: 44rpx;
		    line-height: 38rpx;
		    width: 280rpx;
		    text-align: center;
		    margin: 10rpx 0 0 20rpx;
	}
	.kaituan21{
		display: flex;
		    width: 90%;
		    margin: 40rpx auto;
	}
	.kaituan221{
		    flex: 1;
	}
	.kaituan31{
		height: 80rpx;
		    line-height: 80rpx;
		    text-align: center;
		    color: #777;
	}
	.kaituan41{
		    width: 95%;
		    height: 100rpx;
		    background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1));
		    border-radius: 100rpx;
		    text-align: center;
		    line-height: 100rpx;
		    font-size: 30rpx;
		    font-weight: 700;
		    margin: 20rpx auto;
	}
	.kaituan51{
		margin: 80rpx 0 40rpx;
	}
</style>