<template>
	<view class="page-box">
		<view class="order-titleTips" v-if="orderInfo.channelType==8">
			温馨提示：如需退票，请向您购票的渠道咨询
		</view>
		<view class="order-titleTips" v-if="orderInfo.orderStatus==6">
			温馨提示：系统将在3个工作日内核实情况，符合退改规则，退款 金额将在3个工作日内原路退还。
		</view>
		<view class="order-status">
		    <view class="status-box">
						<template v-if="orderInfo.channelType==8">
							<view class="status-type">
								{{orderInfo.channelName}}<text style="font-size: 28rpx;margin-left: 10rpx;">{{orderInfo.merchantName}}（{{orderInfo.productName}}）</text>
							</view>
							
						</template>
						<template v-else>
							<view class="status-type">
								{{orderInfo.orderStatus|orderStatus1}}
							</view>
							<!-- {{orderInfo.merchantName}}（{{orderInfo.productName}}） -->
							<!-- <view class="status-product" v-if="orderInfo.orderStatus==6">款项预计1-7个工作日退回原支付账户</view> -->
						</template>
		        
		    </view>
		</view>
		<view class="order-unsubscribe" v-if="orderInfo.orderStatus==3||orderInfo.orderStatus==6||orderInfo.orderStatus==7||orderInfo.orderStatus==8">
			<view class="unsubscribe-title" :class="unsubscribeType==true?'unsubscribe-title2':''" @click="unsubscribeUpDownFun()">
				<view class="title-name">退订详情</view>
				<view class="title-right">
					<view class="right-name">查看详情</view>
					<u-icon name="arrow-down" color="#3688FF" size="24" v-if="unsubscribeType==false"></u-icon>
					<u-icon name="arrow-up" color="#3688FF" size="24" v-else></u-icon>
				</view>
			</view>
			<view class="unsubscribe-timeline" v-if="unsubscribeType">
				<view class="timeline-list" v-for="(item,index) in timelineList" :key="index">
					<view class="list-box">
						<view class="list-line"></view>
						<view class="list-line2"></view>
						<view class="list-markers">
							<u-icon name="checkbox-mark" color="#FFFFFF" size="16"></u-icon>
						</view>
						<view class="list-markersBig">
							<view class="markersBig-In"></view>
						</view>
					</view>
					<view class="list-case">
						<view class="case-name">{{item.refundStatusName}}</view>
						<view class="case-text">{{item.refundReason}}</view>
						<view class="case-timer">{{item.refundDate}}</view>
					</view>
				</view>
			</view>
		</view>
		<template v-if="orderInfo.orderType==1&&ticketCode!=null&&orderInfo.orderStatus==2||orderInfo.orderType==1&&ticketCode!=null&&orderInfo.orderStatus==4||orderInfo.orderType==1&&ticketCode!=null&&orderInfo.orderStatus==5||orderInfo.orderType==1&&ticketCode!=null&&orderInfo.orderStatus==7||orderInfo.orderType==3&&ticketCode!=null&&orderInfo.orderStatus==4||orderInfo.orderType==3&&ticketCode!=null&&orderInfo.orderStatus==2||orderInfo.orderType==3&&ticketCode!=null&&orderInfo.orderStatus==5||orderInfo.orderType==3&&ticketCode!=null&&orderInfo.orderStatus==7">
			<view class="order-certificate order-allType order-positionTop" :class="orderInfo.orderStatus==6?'order-positionTopAct':''" >
					<!-- <view class="alltype-title">
							<view class="title-line">
									<view></view>
							</view>
							<view class="title-label">入园凭证</view>
					</view> -->
					<view class="certificate-box" v-if="ifyukuaiCode!=''&&ifyukuaiCode!='undefined'">
						<view class="box-prompt2">温馨提示</view>
						<!-- <view class="box-prompt2">验证码用于入园游玩时核验使用</view>
						<view class="box-prompt2">注：验证码信息已自动同步至订单所有游玩人渝快码，游玩人直接使用本人渝快码即可入园核验</view> -->
						<view class="box-prompt2">购票用户直接使用本人渝快码即可入园核验</view>
						<view class="box-promptBtn" @click="returnMini()">我知道了</view>
					</view>
					<view class="certificate-box" v-else-if="orderInfo.exchangeMode==1||orderInfo.exchangeMode==4||orderInfo.exchangeMode==5">
							<view class="box-verificationCode">验证码：{{ticketCode}}</view>
							<!-- <uqrcode ref="uqrcode" canvas-id="qrcode" size="200" class="box-QRcode" :value="uqrcodeVal" :options="{ margin: 10 }" ></uqrcode> -->
							<!--后端生成-->
							<!-- <image :src="imgUrlList" style="width: 180px;height: 180px;margin: 0 auto;display: block;" v-if="imgUrlListType"></image> -->
							<!--显示图片用的标签-->
							<image class="code_view" :src="imagePath"></image>
							<view class="progress-box" v-if="qrCodeType==true">
									<progress :percent="percentage" activeColor="#3688FF" stroke-width="3" />
							</view>
							<!-- <view class="box-prompt">自动更新，截屏无效</view> -->
							<view class="box-prompt2">{{qrCodeType==true?'二维码自动更新，截屏无法验证':''}}</view>
					</view>
					<view class="certificate-box" v-else-if="orderInfo.exchangeMode==2">
							<view class="box-verificationCode">验证码：{{ticketCode}}</view>
							<view class="box-verificationCode">请使用身份证过闸</view>
					</view>
					<view class="certificate-box" v-else-if="orderInfo.exchangeMode==3">
							<view class="box-verificationCode">兑换码：{{ticketCode}}</view>
					</view>
			</view>
		</template>
		<!--sceneSortStatus  是否上下架 1是上架-->
		<view class="order-queueUp order-allType order-positionTop" v-if="orderInfo.isFetch==1&&sortsInfo&&sortData[0].config.sceneSortStatus==1&&orderInfo.orderStatus==4||orderInfo.isFetch==1&&sortsInfo&&sortData[0].config.sceneSortStatus==1&&orderInfo.orderStatus==2||orderInfo.isFetch==1&&sortsInfo&&sortData[0].config.sceneSortStatus==1&&orderInfo.orderStatus==5||orderInfo.isFetch==1&&sortsInfo&&sortData[0].config.sceneSortStatus==1&&orderInfo.orderStatus==7">
		    <view class="alltype-title">
		        <!-- <view class="title-line">
		            <view></view>
		        </view> -->
		        <view class="title-label">排队详情</view>
		        <!-- <u-icon name="reload"></u-icon> -->
		    </view>
				<!-- 未过号 -->
				<!-- <template v-if="sortData[0].sortFair===0">
					<view class="queueUp-rowNumber" v-for="(item,index) in sortData" :key="index">
							<view class="rowNumber-list">
									<text class="list-name">正排队号区间：</text>
									<view class="list-value">{{item.showStart}} ~ {{item.showEnd}}<text style="font-size: 28rpx;margin-left: 8rpx;line-height: 56rpx;">({{item.projectName}})</text></view>
							</view>
							<view class="rowNumber-list">
									<text class="list-name">我的排队号：</text>
									<view class="list-value">{{item.sortNo}}<text style="font-size: 28rpx;margin-left: 8rpx;line-height: 56rpx;">({{item.projectName}})</text></view>
							</view>
							
							<view class="rowNumber-list">
									<text class="list-name">预计进入时间：</text>
									<text class="list-value">{{item.sortNoTime}}</text>
							</view>
							<view class="rowNumber-list">
									<text class="list-name">排号温馨提示：</text>
									<text class="list-value2">{{item.config.paRowNumHint}}</text>
							</view>
					</view>
				</template> -->
				<!-- 返程排号/第一次取号 -->
				<template v-if="sortData[0].sortFair===4||sortData[0].sortFair===5">
					<view class="queueUp-rowNumber" v-for="(item,index) in sortData" :key="index">
							<view class="rowNumber-list rowNumber-list2">
									<text class="list-name">正排队号区间：</text>
									<view class="list-value3">{{item.showStart}} ~ {{item.showEnd}}<text style="font-size: 28rpx;margin-left: 8rpx;line-height: 56rpx;">({{item.projectName}})</text></view>
							</view>
							<view class="rowNumber-takeNum" v-if="returnTripType==true&&item.config.paReturnTripNumEnable==1" @click="sortAgain(item)">取号</view>
							<view class="rowNumber-takeTimer" v-if="returnTripType==false&&item.config.paReturnTripNumEnable==1">{{m}}分{{s}}秒后可取号</view>
							<view class="rowNumber-takeTimer" v-if="item.config.paReturnTripNumEnable==0">{{item.config.paReturnTripHint}}</view>
					</view>
				</template>
				<!-- 可进入 -->
				<template v-else-if="sortData[0].sortFair===1">
					<view class="queueUp-rowNumber queueUp-rowNumber2" v-for="(item,index) in sortData" :key="index">
							<view class="rowNumber-list">
									<text class="list-name">正排队号区间：</text>
									<view class="list-value">{{item.showStart}} ~ {{item.showEnd}}<text style="font-size: 28rpx;margin-left: 8rpx;line-height: 56rpx;">({{item.projectName}})</text></view>
							</view>
							<view class="rowNumber-list">
									<text class="list-name">我的排队号：</text>
									<view class="list-value">{{item.sortNo}}<text style="font-size: 28rpx;margin-left: 8rpx;line-height: 56rpx;">({{item.projectName}})</text></view>
							</view>
							
							<view class="rowNumber-list">
									<text class="list-name">预计进入时间：</text>
									<text class="list-value">{{item.sortNoTime}}</text>
							</view>
							<view class="rowNumber-list">
									<text class="list-name">排号温馨提示：</text>
									<text class="list-value2">{{item.config.paRowNumHint}}</text>
							</view>
							<view class="rowNumber-list">
									<text class="list-name">&nbsp;</text>
									<text class="list-value2">{{item.config.paArrivalNumHint}}</text>
							</view>
					</view>
				</template>
				<!-- 过号 -->
				<template v-else-if="sortData[0].sortFair===2||sortData[0].sortFair===3">
					<view class="queueUp-rowNumber queueUp-rowNumber3" v-for="(item,index) in sortData" :key="index">
							<view class="rowNumber-list rowNumber-list2">
									<text class="list-name">正排队号区间：</text>
									<view class="list-value3">{{item.showStart}} ~ {{item.showEnd}}<text style="font-size: 28rpx;margin-left: 8rpx;line-height: 56rpx;">({{item.projectName}})</text></view>
							</view>
							<view class="rowNumber-list rowNumber-list2" v-if="item.config.paPassedNumEnable==1">
								<view class="rowNumber-signOver">我的排号：</view>
								<view class="list-value">{{item.sortNo}}<text style="font-size: 28rpx;margin-left: 8rpx;line-height: 56rpx;flex-shrink: 0;">({{item.projectName}})</text></view>
							</view>
							<view class="rowNumber-list rowNumber-list2" v-if="item.config.paPassedNumEnable==1">
								<view class="rowNumber-signOver">您排队号已过</view>
								<view class="rowNumber-takeNum2" v-if="item.sortFair===3" @click="signOverFun(item)">取号</view>
							</view> 
							<view class="rowNumber-list rowNumber-list2" v-else>
								<view class="rowNumber-signOver">{{item.config.paPassedNumHint}}</view>
							</view>
					</view>
				</template>
				<!-- 可进入 -->
				<template v-else-if="sortData[0].sortFair===6">
					<view class="queueUp-rowNumber queueUp-rowNumber2" v-for="(item,index) in sortData" :key="index">
							<view class="rowNumber-list">
									<text class="list-name">排号温馨提示：</text>
									<text class="list-value2">您已过闸</text>
							</view>
					</view>
				</template>
				<!-- 提前通知 -->
				<template v-else-if="sortData[0].sortFair===7">
					<view class="queueUp-rowNumber" v-for="(item,index) in sortData" :key="index">
							<view class="rowNumber-list" v-if="item.config.paHideNum==0||item.config.paHideNum==undefined">
									<text class="list-name">正排队号区间：</text>
									<view class="list-value3">{{item.showStart}} ~ {{item.showEnd}}<text style="font-size: 28rpx;margin-left: 8rpx;line-height: 56rpx;">({{item.projectName}})</text></view>
							</view>
							<view class="rowNumber-list" v-if="item.config.paHideEstimatedTime==0||item.config.paHideEstimatedTime==undefined">
									<text class="list-name">预计进入时间：</text>
									<text class="list-value">{{item.sortNoTime}}</text>
							</view>
							<view class="rowNumber-list">
									<text class="list-name">我的排队号：</text>
									<view class="list-value">{{item.sortNo}}<text style="font-size: 28rpx;margin-left: 8rpx;line-height: 56rpx;">({{item.projectName}})</text></view>
							</view>
							<view class="rowNumber-list" style="margin-bottom: 0;">
									<text class="list-name">排号温馨提示：</text>
									<text class="list-value2">
										{{item.config.paRowNumHint}}
									</text>
									
							</view>
							<view class="rowNumber-list">
									<text class="list-name">&nbsp;</text>
									<text class="list-value2" style="color: #3688FF;" v-if="item.config.paAdvanceNoticeDisplay!=undefined">
											{{item.config.paAdvanceNoticeDisplay}}
									</text>
									<text class="list-value2" style="color: #3688FF;" v-else>
										请尽快赶到现场等候，避免错过游玩时间。
									</text>
							</view>
							
					</view>
				</template>
				<!-- 未过号 -->
				<template v-else>
					<view class="queueUp-rowNumber" v-for="(item,index) in sortData" :key="index">
							<view class="rowNumber-list">
									<text class="list-name">正排队号区间：</text>
									<view class="list-value">{{item.showStart}} ~ {{item.showEnd}}<text style="font-size: 28rpx;margin-left: 8rpx;line-height: 56rpx;">({{item.projectName}})</text></view>
							</view>
							<view class="rowNumber-list">
									<text class="list-name">我的排队号：</text>
									<view class="list-value">{{item.sortNo}}<text style="font-size: 28rpx;margin-left: 8rpx;line-height: 56rpx;">({{item.projectName}})</text></view>
							</view>
							
							<view class="rowNumber-list">
									<text class="list-name">预计进入时间：</text>
									<text class="list-value">{{item.sortNoTime}}</text>
							</view>
							<view class="rowNumber-list">
									<text class="list-name">排号温馨提示：</text>
									<text class="list-value2">{{item.config.paRowNumHint}}</text>
							</view>
					</view>
				</template>
				<!-- 历史排号 未过号 -->
				<view class="queueUp-historyNum">
					历史排号：
					<template v-for="(item,index) in sortsAll">
						<text v-if="index!==0||item.sortFair==6" :key="index">{{item.sortNo}}({{item.projectName}})</text>
					</template>
				</view>
		</view>
		<view class="order-vouchers" v-if="photoType==true">
			<image class="vouchers-img" src="../../../../static/img/my/bookmark.png"></image>
			<view class="vouchers-title">恭喜您！获得摄影抵用券{{findCouponPhoto.couponPrice}}元</view>
			<view class="vouchers-address">使用地址：长江索道南站观景台旁</view>
			<view class="vouchers-btn">
				<view class="btn-click" @click="immediateClaim()" v-if="claimStatus==0">立即领取</view>
				<view class="btn-click" v-else>已领取</view>
				<view class="btn-to" @click="toMyCoupon()">
					使用规则
					<u-icon name="arrow-right" color="#333333"></u-icon>
				</view>
			</view>
		</view>
		<view class="order-mes order-allType order-positionTop">
		    <view class="alltype-title" @click="orderTypeNumFun()">
		        <!-- <view class="title-line">
		            <view></view>
		        </view> -->
		        <view class="title-label">订单信息</view>
		        <u-icon name="arrow-down" v-if="orderTypeNum==0" style="color: #999999 !important;"></u-icon>
						<u-icon name="arrow-up" v-if="orderTypeNum==1" style="color: #999999 !important;"></u-icon>
		    </view>
		    <view class="mes-box" v-if="orderTypeNum==1">
		        <view class="box-case">
		            <view class="case-list">
		                <view class="list-name">订单编号</view>
		                <view class="list-text list-text2">{{orderInfo.id}}</view>
										<image class="list-btn"  @click="copyText(orderInfo.id)" src="../../static/orderList/icon01.png"></image>
		                <!-- <view class="list-btn" @click="copyText(orderInfo.id)">复制</view> -->
		            </view>
		            <view class="case-list">
		                <view class="list-name">产品名称</view>
		                <view class="list-text">{{orderInfo.merchantName}}（{{orderInfo.productName}}）</view>
		            </view>
		            <view class="case-list">
		                <view class="list-name">购买数量</view>
		                <view class="list-text">{{orderInfo.orderNum}}</view>
		            </view>
		            <view class="case-list">
		                <view class="list-name">购买时间</view>
		                <view class="list-text">{{orderInfo.orderTime}}</view>
		            </view>
		            <view class="case-list">
		                <view class="list-name">使用日期</view>
		                <view class="list-text">{{orderInfo.playDate?orderInfo.playDate.substr(0,10):""}}</view>
		            </view>
		            <view class="case-list">
		                <view class="list-name">游玩时间</view>
		                <view class="list-text">{{orderInfo.startPlayTime?orderInfo.startPlayTime.substr(0,5):""}} ~ {{orderInfo.endPlayTime?orderInfo.endPlayTime.substr(0,5):""}}</view>
		            </view>
		            <view class="case-list" v-for="(item,index) in orderExtendList" :key="index">
		                <view class="list-name">{{item.title}}</view>
		                <view class="list-text">{{item.content}}</view>
		            </view>
		        </view>
		        <view class="box-case" v-if="touristInfo.length>0">
		            <view class="case-list">
		                <view class="list-name">联系信息</view>
		                <view class="list-text">
		                    <view >
													<view>{{touristInfo[0].name}} {{touristInfo[0].phone}}</view>
												</view>
		                </view>
		            </view>
								<view class="case-list">
								    <view class="list-name">用户信息</view>
								    <view class="list-text">
								        <view v-for="(list,index) in touristInfo" :key="index">
													<view style="margin-right: 24rpx;">{{list.name}}</view>
												</view>
								    </view>
								</view>
		        </view>
		        <view class="box-case">
		            <view class="case-list">
		                <view class="list-name">退票规则</view>
		                <view class="list-text list-text3">
											<template v-if="orderInfo.isRefund==0">不可退</template>
											<template v-else-if="orderInfo.isRefund==1">
												<!-- <div>
													规定时间可退
												</div> -->
												<!-- <text v-if="orderInfo.orderRefundRuleList[0]&&orderInfo.orderRefundRuleList[0].refundDay!=0">使用日期截止前{{orderInfo.orderRefundRuleList[0].refundDay}}天</text>
												<text v-else>游玩当天</text>
												<text v-if="orderInfo.orderRefundRuleList[0]">{{orderInfo.orderRefundRuleList[0].refundTime.substr(0,5)}}之前可退</text> -->
												<view v-for="(item,index) in orderRefundRuleListShowMessage" :key="index">
													<!--已配置文字内容 -->
													<text v-if="item.refundShowMessage">
														{{item.refundShowMessage}}
													</text>
													<!-- 未配置文字内容  refundTimeType 1 为过期前 2为过期后-->
													<template v-else>
														<text v-if="item.refundTimeType==1">
															<text v-if="item.refundDay==0">
																使用日期当天{{item.refundTime}}之前可退
															</text>
															<text v-else>
																使用日期前{{item.refundDay}}天{{item.refundTime}}之前可退
															</text>
														</text>
														<text v-if="item.refundTimeType==2">
															<text v-if="item.refundDay==0">
																过期当天{{item.refundTime}}之前可退
															</text>
															<text v-else>
																过期后{{item.refundDay}}天{{item.refundTime}}之前可退
															</text>
														</text>
													</template>
												</view>
											</template>
											<template v-else-if="orderInfo.isRefund==2">随时可退</template>
											<template v-if="ticketStatus">
												<view class="list-btnRefund" v-if="orderInfo.orderStatus==2&&orderInfo.isRefund!=0&&orderRefundRuleListShowBtn==true&&ticketStatus==0||orderInfo.orderStatus==7&&orderInfo.isRefund!=0&&orderRefundRuleListShowBtn==true&&ticketStatus==0" @click="refundJump(orderInfo.id)">退款/售后</view>
											</template>
											<template v-else>
												<view class="list-btnRefund" v-if="orderInfo.orderStatus==2&&orderInfo.isRefund!=0&&orderRefundRuleListShowBtn==true||orderInfo.orderStatus==7&&orderInfo.isRefund!=0&&orderRefundRuleListShowBtn==true" @click="refundJump(orderInfo.id)">退款/售后</view>
											</template>
											
										</view>
		            </view>
		        </view>
		    </view>
		</view>
		<!--遮罩-->
		<view class="order-mask" v-if="maskType==true">
			<view class="mask-case">
				<view class="case-title">
					温馨提示
				</view>
				<view class="case-body">
					{{overSignedData.config.paPassedNumTakeTypeHint}}
				</view>
				<view class="case-btn">
					<view class="btn-typeAll btn-type1" @click="sortAgain(overSignedData)">取号</view>
					<view class="btn-typeAll btn-type2" @click="maskType=false">返回</view>
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
// import uQRCode from '@/common/uqrcode4.js'
import QRCode from '@/common/weapp-qrcode.js'
export default {
  components: {
  },
  filters:{
    orderStatus1(i){//景区订单状态
      switch(i){
      case 0:
        return '待支付'
        break
      case 1:
        return '出票中'
        break
      case 2:
        return '出票成功'
        break
      case 3:
        return '出票失败'
        break
      case 4:
        return '核销中'
        break
      case 5:
        return '核销完成'
        break
      case 6:
        return '退款中'
        break
      case 7:
        return '部分退退货退款'
        break
      case 8:
        return '全部退退货退款'
        break
      case 9:
        return '取消'
        break
      case 10:
        return '已完成 '
        break
      case 11:
        return '已过期 '
        break
      case 12:
        return '退票审核中 '
        break
      }
    },
    orderStatus2(i){//酒店订单状态
      switch(i){
      case 0:
        return '待支付'
        break
      case 1:
        return '确认中'
        break
      case 2:
        return '预定成功'
        break
      case 3:
        return '预定失败'
        break
      case 4:
        return '核销中'
        break
      case 5:
        return '核销完成'
        break
      case 6:
        return '退款中'
        break
      case 7:
        return '部分退退货退款'
        break
      case 8:
        return '全部退退货退款'
        break
      case 9:
        return '取消 '
        break
      case 10:
        return '已完成 '
        break
      }
    },
    orderStatus3(i){//餐饮订单状态
      switch(i){
      case 0:
        return '待支付'
        break
      case 1:
        return '确认中'
        break
      case 2:
        return '预定成功'
        break
      case 3:
        return '预定失败'
        break
      case 4:
        return '核销中'
        break
      case 5:
        return '核销完成'
        break
      case 6:
        return '退款中'
        break
      case 7:
        return '部分退货退款'
        break
      case 8:
        return '全部退款退货'
        break
      case 9:
        return '取消 '
        break
      case 10:
        return '已完成 '
        break
      }
    },
    orderStatus4(i){//特产订单状态
      switch(i){
      case 0:
        return '待支付'
        break
      case 1:
        return '待发货'
        break
      case 2:
        return '待收货'
        break
      case 3:
        return '预定失败'
        break
      case 4:
        return '核销中'
        break
      case 5:
        return '已收货'
        break
      case 6:
        return '退款中'
        break
      case 7:
        return '部分退货/退款'
        break
      case 8:
        return '全部退款退货 '
        break
      case 9:
        return '取消 '
        break
      case 10:
        return '已完成 '
        break
      }
    }
  },
  data() {
    return {
      uqrcodeVal:'',
      orderDataType:false,
      openId:'',//用户信息
      id:'',//订单ID
      companyId:'',//公司ID
      orderInfo:{},//订单信息
      sortsInfo:'',//取号数据
      sortData:[],//排队号信息
      sortsAll:[],//所有排号信息
      overSignedData:{},//过号数据
      ticketCode:null,//订单编码
      verifyCode:null,//二维码
      ticketStatus:null,//票状态  0未使用，1已核销，2退票，3过期
      codeStart:'',//开始时间
      codes:[],//我二维码数组
      percentage:0,//进度条百分比
      orderExtendList:[],//订单拓展信息
      touristInfo:[],//游客信息
      orderTypeNum:1,//订单是否展开
      timer1:null,
      timer2:null,
      timer3:null,
      maskType :false,
      d:'',//倒计时 天
      h: '',//倒计时 时
      m: '',//倒计时 分
      s: '',//倒计时 秒
      sum_h: '',//倒计时
      timerType:null,//清除标记
      returnTripType:false,//返程取号设置
      Brightness:'',//屏幕亮度
      qrCodeType:false,//是否是多个二维码
      btnRefundType:false,//是否可退款
      ifyukuaiCode:'',
      visitorIndex:'',//短信特殊字段
      photoType:false,//是否显示优惠券
      claimStatus:1,//领取状态 0未领取 1已领取
      findCouponPhoto:{},//相册优惠券
      imgUrlList:'',
      imgUrlListType:false,
      imagePath:'',//图片接受地址
      imgTypeShow:true,//是否展示图片
      sortRefreshNew:null,//当前时间
      unsubscribeType:false,//头部 退订详情 收起/展开
      timelineList:[
			  // {
			  //   name:'退订来源',
			  //   message:'系统',
			  //   timer:'2023/09/05 17:42:32',
			  // },
			  // {
			  //   name:'退订原因',
			  //   message:'购买门票次数超过今日上限（每日限购 2 次）',
			  //   timer:'2023/09/05 17:42:32',
			  // },
			  // {
			  //   name:'退订结果',
			  //   message:'退订成功',
			  //   timer:'2023/09/05 17:42:32',
			  // },
			  // {
			  //   name:'退款进度',
			  //   message:'￥60.00 已原路退回',
			  //   timer:'2023/09/05 17:42:32',
			  // },
      ],//退单进程
      orderRefundRuleListShowMessage:[],//退票规则列表
      orderRefundRuleListShowBtn:true,//退票是否超时
    }
  },
  onShow() {
		  let _this=this
		  uni.getScreenBrightness({
		    success: function(res){
		      // 这里是把获取到的手机屏幕亮度，存储到data里面，方便给到页面生命周期隐藏和卸载方法里面用
					   _this.Brightness = res.value
					   if(res.value != 1){
		        uni.setScreenBrightness({
		          value: 1
		        })
					   }
		    }
		  })
  },
  onHide: function () {
		  uni.setScreenBrightness({// 恢复之前屏幕亮度
		    value: this.Brightness
		  })
  },
  onLoad(option) {
    if(option.orderId!=undefined){
      this.id = option.orderId
      this.orderDataType = true
    }else{
      this.id = option.thirdOrderId
      this.visitorIndex = option.visitorIndex
      this.orderDataType = false
    }
		
    this.ifyukuaiCode = option.ifyukuaiCode||''
    //this.id = "z00167956572219584dc15634b62cf75"
    this.openId = uni.getStorageSync('openid') //openid oroHZ5FaUQ_SOOC_uQQP92fJpBRE oh2UV1lyYABHMZ1rMlgjhVHyyYDQ
    //this.openId = 'oroHZ5FaUQ_SOOC_uQQP92fJpBRE'//'oh2UV1lyYABHMZ1rMlgjhVHyyYDQ'  oroHZ5FaUQ_SOOC_uQQP92fJpBRE
    this.getDetail()
  },
  onUnload() {
    if(this.timer1) {  
      clearTimeout(this.timer1)
      this.timer1 = null
    }  
    if(this.timer2) {
      clearTimeout(this.timer2)
      this.timer2 = null
    } 
    if(this.timer3) {
      clearTimeout(this.timer3)
      this.timer3 = null
    } 
    uni.setScreenBrightness({// 恢复之前屏幕亮度
      value: this.Brightness
    })
  },
  methods: {
    unsubscribeUpDownFun(){//头部订单详情开关
		  if(this.unsubscribeType==false){
		    this.unsubscribeType=true
		  }else{
		    this.unsubscribeType=false
		  }
    },
    toMyCoupon(){//跳转我的优惠券
      uni.navigateTo({
			  url:'/pages/my/couponCenter/myCouponList/myCouponList'
      })
    },
    immediateClaim(){//立即领取
      let data={
			  openid:this.openId,
        createSource:this.findCouponPhoto.isMerchant,
        couponId:this.findCouponPhoto.couponId,
        comeFrom:'相册领券',
        couponType:this.findCouponPhoto.couponType,
        deductPrice:this.findCouponPhoto.couponPrice,
        useStartDate:this.findCouponPhoto.useStartDate,
        useEndDate:this.findCouponPhoto.useEndDate,
        couponRule:this.findCouponPhoto.couponRule,
        couponRuleRemind:this.findCouponPhoto.couponRuleRemind,
        couponName:this.findCouponPhoto.couponName,
        createSource:this.findCouponPhoto.isMerchant,
        slaveList:this.findCouponPhoto.slaveList
      }
      this.$request('wechatUser/myPage/saveCoupon',data).then((res)=>{
			  if(res.code=='00'){
          uni.showToast({
					  title: '领取成功',
					  icon: 'none'
          })
			    this.claimStatus=1
			  }else{
			    uni.showToast({
			      title: res.message,
			      icon: 'none'
			    })
			  }
      })
    },
    findCouponListFun(){//券查询
      let data={
			  openid:this.openId,
        useRange:11,
      }
      this.$request('scenic/user/product/findCouponList',data).then((res)=>{
			  if(res.code=='00'){
          res.data.forEach((item,index)=>{
            if(item.useRange==11){
              this.findCouponPhoto = item
              this.claimStatus = 0
              if(item.alreadyReceive==undefined||item.alreadyReceive==0){
                this.claimStatus=0
              }else{
                this.claimStatus = 1
              }
              this.photoType = true
            }
          })
			  }else{
			    uni.showToast({
			      title: res.message,
			      icon: 'none'
			    })
			  }
      })
    },
    orderTypeNumFun(){
      if(this.orderTypeNum==0){
        this.orderTypeNum=1
      }else{
        this.orderTypeNum=0
      }
    },
    getDetail(){//*-----------------加载订单
      var postHttpUrl = ''
      let data = {}
      if(this.orderDataType == true){//为小程序
        data={
          orderId:this.id,//订单ID
          userId:this.openId,//用户Id
        }
        postHttpUrl = 'order/userOrder/findOrderDetail'
      }else{//为短信
        data={
          thirdOrderId:this.id,//订单ID
        }
        postHttpUrl = 'order/userOrder/findOrderDetailByThirdOrderId'
      }
				
      this.$request(postHttpUrl,data).then((res)=>{
        if(res.code=='00'){
          this.orderInfo = res.data
          this.orderRefundRuleListShowMessage = this.orderInfo.orderRefundRuleList
          this.orderExtendList = res.data.orderExtendList
          if(this.orderInfo.orderType==1){
            this.orderTypeNum =1
          }
          if(this.orderInfo.orderTicketDetailList&&this.orderInfo.orderTicketDetailList.length>0){
            this.verifyCode = this.orderInfo.orderTicketDetailList[0].verifyCode
            this.ticketStatus = this.orderInfo.orderTicketDetailList[0].ticketStatus
            this.ticketCode = this.orderInfo.orderTicketDetailList[0].ticketCode
          }
          this.touristInfo = res.data.orderTouristList
          if(this.ifyukuaiCode==''||typeof this.ifyukuaiCode=='undefined'){
            if(this.orderInfo.orderType==1||this.orderInfo.orderType==3){
              if(this.orderInfo.subOrderType!=4&&this.orderInfo.subOrderType!=5){
                this.$nextTick(() => {
                  if(this.orderInfo.playDate.substr(0,10)==this.$commonjs.today()&&this.orderInfo.exchangeMode==4||this.orderInfo.playDate.substr(0,10)==this.$commonjs.today()&&this.orderInfo.exchangeMode==5){
                    if(this.orderInfo.orderStatus==2||this.orderInfo.orderStatus==4||this.orderInfo.orderStatus==5||this.orderInfo.orderStatus==7){ //订单状态==2 4 5 7才调用动态二维码
                      this.dynamicCode()
                      this.qrCodeType=true
                    }
										
                  }else if(this.orderInfo.exchangeMode==1){
                    this.qecode()
                    this.qrCodeType=false
                  }
                })
              }
            }
          }
          if(this.orderInfo.isFetch==1){//isFetch==1需要排队 
            if(this.orderInfo.orderStatus==2||this.orderInfo.orderStatus==4||this.orderInfo.orderStatus==5||this.orderInfo.orderStatus==7){ //订单状态==2 4 5 7才可以调用排号接口
              console.log(this.orderInfo.orderStatus)
              this.getSortInfo()
              var sortRefresh = new Date().getTime()
              this.sortRefreshNew = JSON.parse(JSON.stringify(sortRefresh))
              this.timer2=setInterval(()=>{
                var sortRefresh2 = new Date().getTime()
                var sorNum = sortRefresh2-this.sortRefreshNew
                if(sorNum>=120000){
                  this.sortRefreshNew = JSON.parse(JSON.stringify(sortRefresh2))
                  this.getSortInfo()
                }
              },1000)
            }
            
            // this.$once('hook:beforeDestroy',()=>{
            // 	clearInterval(timer)
            // })
          }
          if(this.orderInfo.orderRefundList!=undefined&&this.orderInfo.orderRefundList.length>0){
            this.timelineList = this.orderInfo.orderRefundList
            this.timelineList.forEach((item,index)=>{
              if(item.refundStatus==0){
                item['refundStatusName'] = '退款中'
              }else if(item.refundStatus==1){
                item['refundStatusName'] = '退款成功'
              }else if(item.refundStatus==2){
                item['refundStatusName'] = '退款失败'
              }else if(item.refundStatus==3){
                item['refundStatusName'] = '退票中'
              }else if(item.refundStatus==4){
                item['refundStatusName'] = '退票确认'
              }else if(item.refundStatus==5){
                item['refundStatusName'] = '退货完成'
              }else if(item.refundStatus==6){
                item['refundStatusName'] = '退票审核中'
              }else if(item.refundStatus==7){
                item['refundStatusName'] = '退票失败'
              }
            })
            if(this.orderInfo.orderStatus==3||this.orderInfo.orderStatus==6||this.orderInfo.orderStatus==7||this.orderInfo.orderStatus==8){
						  this.unsubscribeType = true
            }
          }
          //判断是否在退票时间内
          var orderRefundRuleListShowType = false
          this.orderRefundRuleListShowMessage.forEach((item,index)=>{
            if(item.refundVisitorApply==1){
              orderRefundRuleListShowType = true
              var todayTimer = this.$commonjs.today()+' '+this.$commonjs.todayTime() //获取今天时间
              var playdateTimer = '' //获取游玩时间开始
              if(item.refundDay!=undefined&&item.refundDay!=0){
                var itemDay = -item.refundDay//将天数改为负数
                var orderEndPlayDate = this.getNextDate(this.orderInfo.playDate,itemDay)//最迟退票天数 
                playdateTimer = orderEndPlayDate+' '+item.refundTime
              }else{
                playdateTimer = this.orderInfo.playDate+' '+item.refundTime
              }
              var todayTimerNum = this.$commonjs.changeTime(todayTimer) //今天时间转化数字
              var playdateTimerNum = this.$commonjs.changeTime(playdateTimer) //游玩时间转化数字
              var playdateEndTimer = ''//退票截止时间
              var playdateEndTimerNum = '' //截止时间转化数字
              if(item.refundDateType!=undefined&&item.refundDateType==2){//refundDateType  退款时间展示文字（0之前1之后2至（用于区间））
                if(item.refundDay!=undefined&&item.refundDay!=0){
                  var itemDay = -item.refundDay//将天数改为负数
                  var orderEndPlayDate = this.getNextDate(this.orderInfo.playDate,itemDay)//最迟退票天数 
                  playdateEndTimer = orderEndPlayDate+' '+item.refundEndTime
                }else{
                  playdateEndTimer = this.orderInfo.playDate+' '+item.refundEndTime //获取游玩时间开始
                }
                playdateEndTimerNum = this.$commonjs.changeTime(playdateEndTimer)
              }
              if(item.refundDateType!=undefined&&item.refundDateType==1){//至
                if(todayTimerNum>playdateTimerNum&&todayTimerNum<playdateEndTimerNum){
                  this.orderRefundRuleListShowBtn = true
                }else{
                  this.orderRefundRuleListShowBtn = false
                }
              }else if(item.refundDateType!=undefined&&item.refundDateType==2){//之后
                if(todayTimerNum>playdateTimerNum){
								  this.orderRefundRuleListShowBtn = true
                }else{
								  this.orderRefundRuleListShowBtn = false
                }
              }else{//之前
                if(todayTimerNum<playdateTimerNum){
                  this.orderRefundRuleListShowBtn = true
                }else{
                  this.orderRefundRuleListShowBtn = false
                }
              }
            }
          })
          if(orderRefundRuleListShowType == false&&this.orderInfo.isRefund!=0&&this.orderInfo.orderStatus==2||orderRefundRuleListShowType == false&&this.orderInfo.isRefund!=0&&this.orderInfo.orderStatus==7){
            this.orderRefundRuleListShowBtn = true
          }else if(orderRefundRuleListShowType == false&&this.orderInfo.isRefund==0){
            this.orderRefundRuleListShowBtn = false
          }
          this.findCouponListFun()
        }else{
          uni.showToast({
            title: res.message,
            icon: 'none'
          })
        }
      })
        .catch((err) => {
          this.timer3 = setTimeout(() => {
            this.getDetail()
          }, 2000)
        })
    },
    getNextDate:function(date,day) {//
		  var dd = new Date(date)
		  dd.setDate(dd.getDate() + day)
		  var y = dd.getFullYear()
		  var m = dd.getMonth() + 1 < 10 ? '0' + (dd.getMonth() + 1) : dd.getMonth() + 1
		  var d = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate()
		  return y + '-' + m + '-' + d
    },
    getSortInfo(){//-------------------------排号信息加载
      var areaCode = this.orderInfo.areaCode
      var orderNum = this.orderInfo.orderNum
      var userId = this.openId
      var orderId = this.orderInfo.id
      // var verifyCode = this.ticketCode
      var thirdId = this.orderInfo.thirdOrderId
      let data={areaCode,orderNum,userId,orderId,thirdId,'againNumber':0}
      this.$request('distribution/distribution/getNewFetchInfo',data).then((res)=>{
        if(res.code=='00'){
          if(res.data.length>0){
            this.sortsInfo = res.data[0]
            this.companyId = this.sortsInfo.pays[0].companyId
            var sortArr = []
            sortArr.push(this.sortsInfo.sorts[0])
            this.sortsAll = this.sortsInfo.sorts
            var northArr = null
            var southArr = null
            sortArr.forEach((item)=>{
              if(item.projectId=='cjsd_project_0002'){//北站
                if(northArr){
                  if(item.sortNo>northArr.sortNo){
                    northArr = item
                  }
                }else{
                  northArr = item
                }
              }else{//南站
                if(southArr){
                  if(item.sortNo>southArr.sortNo){
                    southArr = item
                  }
                }else{
                  southArr = item
                }
              }
            })
            var arr = []
            if(northArr){
              arr.push(northArr)
            }
            if(southArr){
              arr.push(southArr)
            }
            this.sortData = arr
            //时间判断，当前时间是否大于可领号时间
            var presentTimer = this.dateFormat()
            var takeNumberTimer = this.getAfterDate(this.sortsInfo.sorts[0].createDate,this.sortsInfo.sorts[0].config.paReturnTripTime) 
            if(this.sortsInfo.sorts[0].sortFair==4||this.sortsInfo.sorts[0].sortFair==5){
              clearTimeout(this.timerType)
              if(presentTimer<takeNumberTimer){
                this.countTime(takeNumberTimer) 
              }else{
                this.returnTripType =true
              }
            }
          }
        }else{
          uni.showToast({
            title: res.message,
            icon: 'none'
          })
        }
      }).catch((err)=>{
        this.timer1=setTimeout(()=>{
          this.getSortInfo()
        },1000)
        // this.$once('hook:beforeDestroy',()=>{
        //   clearTimeout(timer)
        // })
      })
    },
    sortAgain(item){//--------------------------------------重新排队
      let data={
        againNumber:1,
        thirdId:this.sortsInfo.order.orderId,
        areaCode:item.projectId,
        userId:this.openId,
        merchantCode:this.companyId,
      }
      this.$request('distribution/distribution/newFetchNumber',data).then((res)=>{
        if(res.code=='00'){
          this.getSortInfo()
          this.maskType = false
        }else{
          uni.showToast({
            title: res.message,
            icon: 'none'
          })
        }
      })
    },
    qecode(){//生成二维码
      if(this.verifyCode){
        // let qrcode = new QRCode('qrcode',{
        // 	width: 180,
        // 	height: 180,
        // 	text:this.verifyCode
        // })
        let verifyCode=''
        if(this.visitorIndex!=''&&typeof this.visitorIndex!=undefined){
          verifyCode=this.verifyCode+':'+this.visitorIndex
        }else{
          verifyCode=this.verifyCode
        }
        // uQRCode.make({
        //   canvasId: 'qrcode',
        //   componentInstance: this,
        //   text: verifyCode,
        //   size: 180,
        //   margin: 10,
        //   backgroundColor: '#ffffff',
        //   foregroundColor: '#000000',
        //   fileType: 'jpg',
        //   errorCorrectLevel: uQRCode.errorCorrectLevel.H
        // })
        // this.uqrcodeVal=verifyCode
        //后端生成
        // var verifyCodeURL = encodeURI(verifyCode)
        // this.imgUrlList = 'http://pay.tuyoyoo.com/distribution/c/'+verifyCodeURL+'?width=180&height=180&frontColor=0&backColor=16777215'
        // this.imgUrlListType = true
        this.createCode(verifyCode)
      }
    },
    createCode(showCode) {//创建二维码
      var imgData = QRCode.drawImg(showCode, {
        typeNumber: 3,//码点大小 1-40，数字越大，码点越小，二维码会显得越密集
        errorCorrectLevel: 'H',//纠错等级 H等级最高(30%) 简单来说，就是二维码被覆盖了多少仍然能被识别出来 详见qrcode.js
        size: 180
      })
      this.imagePath = imgData
    },
    signOverFun(item){//过号遮罩显示
      this.overSignedData = {}
      this.overSignedData = item
      if(item.config.paPassedNumTakeType==1){
        this.maskType = true
      }else{
        this.sortAgain(item)
      }
    },
    dynamicCodeRefresh(){
      // 获取当前显示第几个二维码
      let codes=this.codes
      let now = new Date().getTime()
      let nowTime = (now - this.codeStart)/1000
      let code = null
      // 寻找到当前时间的二维码
      for(let i = 0 ; i < codes.length ; i++ ){
        let item = codes[i]
        nowTime -= item.timeout
        if(nowTime <= 0 ){
          code = item
          break
        }
      }
      // 全部遍历完成后，需要重新获取新的二维码
      if(code == null){
        this.dynamicCode()
      } else if( code.code!=this.codeNo ){
        this.codeNo = code.code
        // if(document.querySelector('#qrcode img')){//移除子元素
        // 	document.querySelector('#qrcode img').remove()
        // 	document.querySelector('#qrcode canvas').remove()
        // }
        // let qrcode = new QRCode('qrcode',{//进入先获取二维码
        // 	width: 180,
        // 	height: 180,
        // 	text:this.codeNo
        // })
        // uQRCode.make({
        //   canvasId: 'qrcode',
        //   componentInstance: this,
        //   text: this.codeNo,
        //   size: 180,
        //   margin: 10,
        //   backgroundColor: '#ffffff',
        //   foregroundColor: '#000000',
        //   fileType: 'jpg',
        //   errorCorrectLevel: uQRCode.errorCorrectLevel.H
        // })
        // this.uqrcodeVal=this.codeNo
        //后端生成
        // this.imgUrlListType = false
        // var verifyCodeURL = 'http://pay.tuyoyoo.com/distribution/c/'+this.codeNo+'?width=180&height=180&frontColor=0&backColor=16777215'
        // this.imgUrlList = encodeURI(verifyCodeURL)
        // this.imgUrlListType = true
        this.createCode(this.codeNo)
      }
      this.percentage+=1
      if(this.percentage>=100){
        this.percentage=0
      }
    },
    dynamicCode(){//动态码
      let data={
        codeNo:this.ticketCode,//二维码编号
        orderId:this.id,//订单号
        userId:this.openId//openid
      }
      let verifyCode=''
      if(this.visitorIndex!=''&&this.visitorIndex!=undefined){
        data.codeNo=this.ticketCode+':'+this.visitorIndex
      }else{
        data.codeNo=this.ticketCode
      }
      clearInterval(this.codeFlag)
      this.$request('distribution/distribution/getAutoCode',data).then((res)=>{
        if(res.code == '00'){
          this.codes = res.data.codes
          if(this.codes.length==0){
            uni.showToast({
						  title: '网络异常，请退出重试',
						  icon: 'none'
            })
          }
          this.codeStart = new Date().getTime()
          this.codeFlag = setInterval(()=>{
            this.dynamicCodeRefresh()
          },300)
          this.$once('hook:beforeDestroy', () => {
            clearInterval(this.codeFlag)
          })
        }else{
          uni.showToast({
            title: res.message,
            icon: 'none'
          })
        }
      }).catch((err)=>{
        let timer=setTimeout(()=>{
          this.dynamicCode()
        },2000)
        this.$once('hook:beforeDestroy', () => {
          clearTimeout(timer)
        })
      })
    },
    copyText(value){//-------------------------复制内容
      uni.setClipboardData({
        data:value,
        success:function(){
          uni.showToast({
            title: '复制成功',
            icon: 'none'
          })
        }
      })
    },
    dateFormat() {//时间格式化函数，此处仅针对yyyy-MM-dd hh:mm:ss 的格式进行格式化
      var date=new Date()
      var year=date.getFullYear()
      /* 在日期格式中，月份是从0开始的，因此要加0
				 * 使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
				 * */
      var month= date.getMonth()+1<10 ? '0'+(date.getMonth()+1) : date.getMonth()+1
      var day=date.getDate()<10 ? '0'+date.getDate() : date.getDate()
      var hours=date.getHours()<10 ? '0'+date.getHours() : date.getHours()
      var minutes=date.getMinutes()<10 ? '0'+date.getMinutes() : date.getMinutes()
      var seconds=date.getSeconds()<10 ? '0'+date.getSeconds() : date.getSeconds()
      // 拼接
      return year+'-'+month+'-'+day+' '+hours+':'+minutes+':'+seconds
    },
    getAfterDate(timer,n) {//当前时间后几分钟
      var curTime = new Date(timer)
      var d = new Date(curTime.setMinutes(curTime.getMinutes() + n)) //n是分钟，根据自己需求定义
      var year = d.getFullYear()
      var mon = d.getMonth() + 1
      var day = d.getDate()
      var hour = d.getHours()
      var minute = d.getMinutes()
      var second = d.getSeconds()
      var s = year + '-' + (mon < 10 ? ('0' + mon) : mon) + '-' + (day < 10 ? ('0' + day) : day) + ' ' + (hour < 10 ? ('0' + hour) : hour) + ':' + (minute < 10 ? ('0' + minute) : minute) + ':' + (second < 10 ? ('0' + second) : second)
      return s
    },
    countTime (timer) {//倒计时
      // 获取当前时间
      var date = new Date()
      var now = date.getTime()
      //设置截止时间
      var endDate = new Date(timer)
      var end = endDate.getTime()
      //时间差
      var leftTime = end - now
      //定义变量 d,h,m,s保存倒计时的时间
      if (leftTime >= 0) {
        this.d = Math.floor(leftTime / 1000 / 60 / 60 / 24)
        this.h = Math.floor(leftTime / 1000 / 60 / 60 % 24)
        this.m = Math.floor(leftTime / 1000 / 60 % 60)
        this.s = Math.floor(leftTime / 1000 % 60)
        this.sum_h = this.d * 24 + this.h
      }
      if(this.d==0&&this.h==0&&this.m==0&&this.s==0){
        this.returnTripType = true
      }
      //递归每秒调用countTime方法，显示动态时间效果
      this.timerType = setTimeout(()=>{
				  this.countTime(timer)
      },1000)
    },
    refundJump(id){//-------------------景区跳转
      uni.navigateTo({
        url: '/pages/my/order/afterSale/applyAfterSale/applyAfterSale?orderId='+id+'&ifyukuaiCode='+this.ifyukuaiCode
      })
    },
    returnMini(){
      //#ifdef MP-WEIXIN
      wx.navigateBackMiniProgram({
					  extraData: {
						  cqQRCode:1
					  },
					  fail(res){
						  uni.showToast({
            title:'获取失败，请退出后重新进入渝快码小程序获取验证码',
            icon:'none',
            duration:3000
						  })
					  }
      })
      //#endif
				
      //#ifdef MP-ALIPAY
      my.navigateBackMiniProgram({
        extraData:{
          cqQRCode:1
        },
					    fail: (res) => {
					     uni.showToast({
            title:'获取失败，请退出后重新进入渝快码小程序获取验证码',
            icon:'none',
            duration:3000
					     })
					    }
      })
      //#endif
    },
  }
}
</script>

<style scoped="scoped" lang="scss">
	.page-box{
		background-color: #ECF3FE;
		min-height: 100vh;
		padding-bottom: 80rpx;
	}
	.order-status {
		width: 750rpx;
		max-height: 464rpx;
		background: linear-gradient(180deg, #3688FF 0%, #3688FF 37%, #ECF3FE 100%);
		padding: 48rpx 32rpx 32rpx 40rpx;
		box-sizing: border-box;
		position: relative;
	}
	
	.order-status .status-box {
		display: flex;
		flex-wrap: wrap;
		color: #fff;
		overflow: hidden;
	}
	
	.order-status .status-type {
		width: 100%;
		font-size: 48rpx;
		line-height: 66rpx;
		font-weight: bold;
		margin-bottom: 8rpx;
		flex-shrink:0
	}
	
	.order-status .status-product,
	.order-status .status-prompt {
		font-size: 28rpx;
		line-height: 65rpx;
		overflow:hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		-o-text-overflow:ellipsis;
	}
	
	.order-status .status-icon {
		width: 106rpx;
		height: 104rpx;
		position: absolute;
		right: 64rpx;
		top: 58rpx;
	}

	/*排队信息*/
	.order-allType {
		width: 710rpx;
		background-color: #fff;
		box-shadow: 0rpx 0rpx 6rpx 0rpx rgba(0, 0, 0, 0.04);
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		margin: 0 auto 16rpx auto;
		overflow: hidden;
		position: relative;
		z-index: 10;
	}

	.order-allType .alltype-title {
		display: flex;
		justify-content: space-between;
		align-items: center;
		height: 92rpx;
		padding: 24rpx 24rpx 24rpx 24rpx;
		box-shadow: 0rpx 2rpx 0rpx 2rpx rgba(0, 0, 0, 0.04);
		position: relative;
	}

	.order-allType .alltype-title .title-line {
		width: 20rpx;
		height: 44rpx;
		overflow: hidden;
		position: relative;
	}

	.order-allType .alltype-title .title-line view {
		width: 4rpx;
		height: 24rpx;
		background-color: var(--main-color);
		margin: auto;
		position: absolute;
		left: 0;
		top: 0;
		bottom: 0;
	}

	.order-allType .alltype-title .title-label {
		font-size: 32rpx;
		color: var(--title-color);
		font-weight: bold;
		line-height: 44rpx;
	}

	.order-allType .alltype-title .uicon-reload {
		line-height: 44rpx !important;
		color: var(--title-color) !important;
		margin-left: 22rpx !important;
	}

	.order-allType .alltype-title .uicon-arrow-down,
	.order-allType .alltype-title .uicon-arrow-up{
		line-height: 44rpx !important;
		color: #999999 !important;
		position: absolute !important;
		right: 24rpx !important;
		top: 24rpx !important;
	}
	.order-positionTop:nth-child(2){
		margin-top: 0;//-322rpx;
		position: relative;
		z-index: 2;
	}
	.order-positionTopAct{
		margin-top: 0;//-262rpx;
	}
	/*排队详情*/
	.order-queueUp {
		
	}

	.order-queueUp .queueUp-rowNumber {
		padding: 24rpx 24rpx 24rpx 24rpx;
	}
	
	.order-queueUp .queueUp-rowNumber .rowNumber-list {
		display: flex;
		font-size: 28rpx;
		line-height: 56rpx;
		margin-bottom: 24rpx;
		position: relative;
	}
	.order-queueUp .queueUp-rowNumber .rowNumber-list2{
		justify-content:center;
	}

	.order-queueUp .queueUp-rowNumber .rowNumber-list .list-name {
		width: 220rpx;
		color: var(--title-color);
		flex-shrink: 0;
	}

	.order-queueUp .queueUp-rowNumber .rowNumber-list .list-value {
		flex: 1;
		display: flex;
		color: #FC771D;
		font-size: 40rpx;
		font-weight: bold;
	}
	.order-queueUp .queueUp-rowNumber .rowNumber-list .list-value2 {
		color: #333333;
		font-size: 24rpx;
		line-height: 35rpx;
		padding-top: 8rpx;
	}
	.order-queueUp .queueUp-rowNumber .rowNumber-list .list-value3 {
		display: flex;
		color: #FC771D;
		font-size: 40rpx;
		font-weight: bold;
	}
	.order-queueUp .queueUp-rowNumber .rowNumber-list2 .list-value{
		flex: 0;
	}
	.order-queueUp .queueUp-rowNumber2{
		color: #fff;
		background-color: #1EA838;
	}
	.order-queueUp .queueUp-rowNumber2 .rowNumber-list .list-value,
	.order-queueUp .queueUp-rowNumber2 .rowNumber-list .list-value2{
		color:#fff;
	}
	.order-queueUp .queueUp-rowNumber .rowNumber-list .list-right48 {
		margin-right: 48rpx;
	}

	.order-queueUp .queueUp-rowNumber .rowNumber-list .list-right24 {
		margin-right: 24rpx;
	}
	.order-queueUp .queueUp-rowNumber .rowNumber-list .list-btnNew{
		width: 140rpx;
		height: 40rpx;
		border-radius: 26rpx 26rpx 26rpx 26rpx;
		text-align: center;
		line-height: 40rpx;
		color: var(--main-color);
		border: 1rpx solid var(--main-color);
		position: absolute;
		top: 0;
		right: 0;
	}

	.order-queueUp .queueUp-rowNumber .rowNumber-list:nth-last-child(1) {
		margin-bottom: 0;
	}
	.order-queueUp .queueUp-rowNumber .rowNumber-takeNum{
		width: 136rpx;
		height: 56rpx;
		background: #3688FF;
		border-radius: 32rpx 32rpx 32rpx 32rpx;
		font-size: 28rpx;
		color: #FFFFFF;
		line-height: 56rpx;
		text-align: center;
		margin: 0 auto;
	}
	.order-queueUp .queueUp-rowNumber .rowNumber-takeNum2{
		width: 136rpx;
		height: 56rpx;
		background: #3688FF;
		border-radius: 32rpx 32rpx 32rpx 32rpx;
		font-size: 28rpx;
		color: #FFFFFF;
		line-height: 56rpx;
		text-align: center;
	}
	.order-queueUp .queueUp-rowNumber .rowNumber-takeTimer{
		font-size: 28rpx;
		color: #FC771D;
		line-height: 40rpx;
		font-weight: bold;
		margin-top: 16rpx;
		text-align: center;
	}
	.order-queueUp .queueUp-historyNum{
		font-size: 24rpx;
		color: #333333;
		line-height: 34rpx;
		border-top: 2rpx solid #ECECEC;
		padding: 24rpx 24rpx 24rpx 24rpx;
	}
	.order-queueUp .queueUp-rowNumber3{
		color: #fff;
		background-color: #DA3844;
	}
	.order-queueUp .queueUp-rowNumber .rowNumber-signOver{
		font-size: 32rpx;
		color: #fff;
		line-height: 56rpx;
		font-weight: bold;
		margin-right: 40rpx;
	}
	.order-queueUp .queueUp-rowNumber3 .rowNumber-list .list-value,
	.order-queueUp .queueUp-rowNumber3 .rowNumber-list .list-value2,
	.order-queueUp .queueUp-rowNumber3 .rowNumber-takeTimer,
	.order-queueUp .queueUp-rowNumber3 .rowNumber-list .list-value3{
		color:#fff;
	}
	.order-queueUp .queueUp-rowNumber3 .rowNumber-takeNum,
	.order-queueUp .queueUp-rowNumber3 .rowNumber-takeNum2{
		background-color: #fff;
		color: #3688FF;
	}
	/*入园凭证*/
	.order-certificate .certificate-box {
		padding: 16rpx 0 24rpx 0;
		overflow: hidden;
	}

	.order-certificate .certificate-box .box-verificationCode {
		margin: 8rpx 0 8rpx 0;
		font-size: 24rpx;
		color: #333333;
		line-height: 40rpx;
		text-align: center;
	}

	.order-certificate .certificate-box .box-QRcode {
		display: block;
		width: 200px;
		height: 200px;
		margin: 0 auto;
	}
	.order-certificate .certificate-box .box-QRcode2{
		position: fixed;
		top: -500rpx;
	}

	.order-certificate .certificate-box .progress-box {
		width: 180px;
		margin: 6rpx auto 0 auto;
	}

	.order-certificate .certificate-box .box-prompt {
		font-size: 28rpx;
		color: var(--main-color);
		line-height: 40rpx;
		text-align: center;
		margin: 16rpx 0 8rpx 0;
	}

	.order-certificate .certificate-box .box-prompt2 {
		font-size: 28rpx;
		font-weight: bold;
		color: #FC771D;
		line-height: 40rpx;
		text-align: center;
		margin: 24rpx 0 0 0;
		padding: 0 24rpx	
	}
	.order-certificate .certificate-box .box-promptBtn{
		width: 152rpx;
		height: 64rpx;
		border: solid 1px #ccc;
		border-radius: 8rpx;
		line-height: 64rpx;
		color: #333333;
		text-align: center;
		box-sizing: content-box;
		margin: 24rpx auto 0 auto;
	}

	/*订单信息*/
	.order-mes .mes-box {
		padding: 44rpx 24rpx 24rpx 24rpx;
		overflow: hidden;
	}

	.order-mes .mes-box .box-case {
		width: 638rpx;
		border-bottom: 2rpx solid #ECECEC;
		margin-bottom: 40rpx;
	}

	.order-mes .mes-box .box-case:nth-last-child(1) {
		border-bottom: none;
		margin-bottom: 0rpx;
	}

	.order-mes .mes-box .box-case .case-list {
		display: flex;
		width: 638rpx;
		font-size: 28rpx;
		line-height: 40rpx;
		margin-bottom: 28rpx;
		position: relative;
	}

	.order-mes .mes-box .box-case .case-list .list-name {
		flex-shrink: 0;
		width: 144rpx;
		color: #AAAAAA;
	}

	.order-mes .mes-box .box-case .case-list .list-text {
		flex: 1;
		word-wrap: break-word;
		color: #333333;
	}

	.order-mes .mes-box .box-case .case-list .list-text2 {
		flex: 0;
		width: 430rpx;
		/* height: 40rpx;
		white-space: nowrap;
		text-overflow: ellipsis;
		-o-text-overflow: ellipsis; */
	}
	.order-mes .mes-box .box-case .case-list .list-text3{
		padding-right: 170rpx;
	}
	.order-mes .mes-box .box-case .case-list .list-btnRefund{
	  width: 152rpx;
	  height: 64rpx;
	  border: solid 1px #ccc;
	  border-radius: 8rpx;
	  line-height: 64rpx;
	  color: #333333;
	  text-align: center;
	  display: inline-block;
	  box-sizing: content-box;
	  position: absolute;
	  top: -12rpx;
	  right: 0;
	}

	.order-mes .mes-box .box-case .case-list .list-btn {
		/* flex-shrink: 0;
		width: 104rpx;
		height: 40rpx;
		border-radius: 26rpx 26rpx 26rpx 26rpx;
		text-align: center;
		line-height: 38rpx;
		color: #333333;
		border: 1rpx solid #999999; */
		width: 32rpx;
		height: 32rpx;
		margin: auto;
		position: absolute;
		top:0;
		right:0;
		bottom: 0;
	}
	/*遮罩*/
	.order-mask{
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 998;
		background-color: rgba(0,0,0,.3);
	}
	.order-mask .mask-case{
		width: 654rpx;
		height: 418rpx;
		background-color: #fff;
		box-sizing: border-box;
		padding: 64rpx 24rpx 0 24rpx;
		margin: auto;
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
	}
	.order-mask .mask-case .case-title{
		font-size: 40rpx;
		line-height: 56rpx;
		color: #191919;
		font-weight: bold;
		text-align: center;
		margin-bottom: 24rpx;
	}
	.order-mask .mask-case .case-body{
		font-size: 32rpx;
		line-height: 48rpx;
		color: #191919;
		text-align: center;
		margin-bottom: 48rpx;
	}
	.order-mask .mask-case .case-btn{
		display: flex;
		justify-content: space-between;
		font-size: 32rpx;
		line-height: 80rpx;
	}
	.order-mask .mask-case .case-btn .btn-typeAll{
		width: 212rpx;
		height: 80rpx;
		border-radius: 44rpx 44rpx 44rpx 44rpx;
		text-align: center;
	}
	.order-mask .mask-case .case-btn .btn-type1{
		background-color: #3688FF;
		color: #fff;
		margin-left: 56rpx;
	}
	.order-mask .mask-case .case-btn .btn-type2{
		background-color: #ECF3FE;
		color: #999999;
		margin-right: 56rpx;
	}
	.order-vouchers{
		width: 710rpx;
		height: 184rpx;
		margin: 0 auto 16rpx auto;
		box-shadow: 0rpx 0rpx 16rpx 2rpx rgba(0,0,0,0.08);
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		padding: 24rpx 32rpx 0 32rpx;
		background-image: url("../../static/orderList/iconBackground.png");
		position: relative;
		overflow: hidden;
		.vouchers-img{
			width: 200rpx;
			height: 160rpx;
			position: absolute;
			bottom: -15rpx;
			right: 28rpx;
		}
		.vouchers-title{
			font-size: 32rpx;
			color: #EE0E0E;
			font-weight: bold;
			line-height: 44rpx;
			margin-bottom: 8rpx;
		}
		.vouchers-address{
			font-size: 24rpx;
			color: #25434D;
			line-height: 34rpx;
			margin-bottom: 16rpx;
		}
		.vouchers-btn{
			display: flex;
			.btn-click{
				width: 144rpx;
				height: 42rpx;
				background: #EE0E0E;
				border-radius: 22rpx 22rpx 22rpx 22rpx;
				font-size: 24rpx;
				color: #FFFFFF;
				text-align: center;
				line-height: 42rpx;
				margin-right: 24rpx;
			}
			.btn-to{
				display: flex;
				color: #333333;
				font-size: 20rpx;
				line-height: 42rpx;
			}
		}
	}
	.code_view{
		display: block;
		width: 180px;
		height: 180px;
		margin: 0 auto;
	}
	/*头部提示*/
	.order-titleTips{
		padding: 16rpx 32rpx 16rpx 32rpx;
		color: #FC771D;
		font-size: 24rpx;
		line-height: 34rpx;
		background: #FFF1E8;
	}
	/*退订详情*/
	.order-unsubscribe{
		width: 710rpx;
		background-color: #fff;
		box-shadow: 0rpx 0rpx 6rpx 0rpx rgba(0, 0, 0, 0.04);
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		padding: 0 24rpx 0 24rpx;
		margin: 0 auto 16rpx auto;
		overflow: hidden;
		.unsubscribe-title{
			display: flex;
			justify-content: space-between;
			border-bottom: 2rpx solid #ECECEC;
			.title-name{
				font-size: 24rpx;
				font-weight: bold;
				color: #FC771D;
				line-height: 82rpx;
			}
			.title-right{
				display: flex;
				font-size: 24rpx;
				color: #3688FF;
				line-height: 82rpx;
				.right-name{
					margin-right: 5rpx;
				}
				/deep/ .u-icon__icon{
					top: 5rpx !important;
				}
			}
		}
		.unsubscribe-title2{
			margin-bottom: 24rpx;
		}
		.unsubscribe-timeline{
			.timeline-list{
				position: relative;
				padding-bottom: 40rpx;
				padding-left: 48rpx;
				.list-box{
					width: 32rpx;
					margin: auto;
					position: absolute;
					left: 0rpx;
					top: 0;
					bottom: 0;
				}
				.list-line{
					width: 2rpx;
					background-color: #ECECEC;
					margin: auto;
					position: absolute;
					top: 0;
					bottom: 0;
					left: 0;
					right: 0;
					z-index: 10;
				}
				.list-markers{
					width: 16rpx;
					height: 16rpx;
					background-color: #999999;
					border-radius: 25rpx;
					margin: auto;
					position: absolute;
					left: 0;
					right: 0;
					top: 12rpx;
					z-index: 11;
					/deep/ u-icon{
						position: absolute;
						top: 0;
						left: 0;
					}
				}
				.list-case{
					.case-name{
						font-size: 28rpx;
						color: #333333;
						line-height: 40rpx;
						margin-bottom: 16rpx;
					}
					.case-text{
						font-size: 24rpx;
						font-weight: bold;
						color: #333333;
						line-height: 34rpx;
						margin-bottom: 8rpx;
					}
					.case-timer{
						font-size: 20rpx;
						color: #999999;
						line-height: 28rpx;
					}
				}
			}
			.timeline-list:nth-child(1){
				.list-line{
					top: 14rpx
				}
			}
			.timeline-list:nth-last-child(1){
				padding-bottom: 24rpx;
				.list-line{
					display: none;
				}
				.list-line2{
					width: 2rpx;
					height: 14rpx;
					background-color: #ECECEC;
					margin: auto;
					position: absolute;
					top: 0;
					left: 0;
					right: 0;
					z-index: 10;
				}
				.list-markers{
					display: none;
				}
				.list-markersBig{
					width: 32rpx;
					height: 32rpx;
					background-color: #ADCDFC;
					border-radius: 25rpx;
					margin: auto;
					position: absolute;
					left: 0;
					right: 0;
					top: 6rpx;
					z-index: 11;
					.markersBig-In{
						width: 16rpx;
						height: 16rpx;
						background-color: #3688FF;
						border-radius: 25rpx;
						margin: auto;
						position: absolute;
						left: 0;
						right: 0;
						top: 0;
						bottom: 0;
						z-index: 12;
					}
				}
				.list-case{
					.case-text{
						color: #3688FF;
					}
				}
			}
		}
	}
</style>
