<template>
	<view class="page-box">
		<view class="order-status">
		    <view class="status-box">
		        <view class="status-type" v-if="orderInfo.orderStatus==2">
							<!-- <template v-if="orderInfo.orderType==1">
								出票成功
							</template>
							<template v-else-if="orderInfo.orderType==2">
								预订成功
							</template>
							<template v-else-if="orderInfo.orderType==3">
								预订成功
							</template>
							<template v-else-if="orderInfo.orderType==4">
								购买成功
							</template> -->
							{{orderInfo.orderStatus|orderStatus1}}
						</view>
						<!-- {{orderInfo.merchantName}}（{{orderInfo.productName}}） -->
		        <view class="status-product" v-if="orderInfo.orderStatus==6">款项预计1-7个工作日退回原支付账户</view>
		    </view>
		</view>
		<template v-if="orderInfo.orderType==1&&ticketCode!=null&&orderInfo.orderStatus==2||orderInfo.orderType==1&&ticketCode!=null&&orderInfo.orderStatus==4||orderInfo.orderType==3&&ticketCode!=null&&orderInfo.orderStatus==4||orderInfo.orderType==3&&ticketCode!=null&&orderInfo.orderStatus==2">
			<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>
							<canvas class="box-QRcode" canvas-id="qrcode"/>
							<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>
		<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">
		    <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;">({{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-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/img/my/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>
											</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&&ticketStatus==0" @click="refundJump(orderInfo.id)">退款/售后</view>
											</template>
											<template v-else>
												<view class="list-btnRefund" v-if="orderInfo.orderStatus==2&&orderInfo.isRefund!=0" @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>
		<!--抵消券 对应的遮罩-->
		<image class="coupon" src="../../../../static/img/my/coupon.png"  @click="showUseRule = true" v-if="couponType"></image>
		<u-mask :show="showtip || showUseRule">
			<view class="mask">
				<view class="img-box">
					<!-- <image src="../../../../static/img/my/postcardTip.png" v-if="showtip"></image>
					<image src="../../../../static/img/my/useRule.png"  v-if="showUseRule"></image> -->
					<div v-if="showtip" class="tips-vouchers">
						<view class="vouchers-title">恭喜您！</view>
						<view class="vouchers-title2">获得摄影抵用<text>20</text>券</view>
						<image class="vouchers-img" src="../../../../static/img/my/bookmark.png"></image>
						<view class="vouchers-to" @click="showtipFun()">
							使用规则
							<u-icon class="to-url" name="arrow-right"></u-icon>
						</view>
						<view class="vouchers-text">
							（使用地址：长江索道南站观景台旁）
						</view>
					</div>
					<div v-if="showUseRule" class="tips-useRule">
						<view class="useRule-title">使用规则</view>
						<view class="useRule-list">
							<view class="list-title">规则说明</view>
							<view class="list-text">· 任意金额皆可抵扣，最高抵扣20</view>
							<view class="list-text">· 指定地点可用，提交订单时自动抵扣</view>
							<view class="list-text">· 优惠券只可使用一次，不找零不折现</view>
							<view class="list-text">· 仅支持下载电子照片至手机</view>
							<view class="list-text">· 如需打印，需额外支付打印费用</view>
						</view>
						<view class="useRule-list">
							<view class="list-title">补充说明</view>
							<view class="list-text">· 使用地址：重庆市渝中区新华路151号长江索道 南站观景台旁</view>
							<view class="list-text">· 咨询电话：023-68567748</view>
						</view>
					</div>
					<image class="coupon-backgruondImg" src="../../../../static/img/my/backgroundIcon01.png" ></image>
					<u-icon class="close" name="close-circle" @click="closeMask"></u-icon>
				</view>
				<u-button type="primary" shape="circle" @click="showtipCloseFun()">知道了</u-button>
			</view>
		</u-mask>
	</view>
</template>

<script>
import uQRCode from '@/common/js/uqrcode.js'
import UMask from '@/uview-ui/components/u-mask/u-mask.vue'
export default {
  components: {
	  UMask
  },
  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 {
      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:'',//短信特殊字段
      showtip: false,//领取提示
      showUseRule: false,//使用规则提示
      couponType:false,//是否拥有相册优惠券
      findPageMarketList:[],//券信息
    }
  },
  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) {
    console.log(option.orderId)
    console.log('-----------------------')
    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 = 'oh2UV1lyYABHMZ1rMlgjhVHyyYDQ'
    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: {
    showtipFun(){//点击使用规则
      this.showtip= false//领取提示
      this.showUseRule=true//使用规则提示
    },
    showtipCloseFun(){//点击使用规则
		  this.showtip= false//领取提示
		  this.showUseRule=false//使用规则提示
    },
    closeMask(){//遮罩关闭
      this.showtip= false//领取提示
      this.showUseRule= false//使用规则提示
    },
    findPageMarketFun(){//优惠券
      var userId = uni.getStorageSync('userId')
      var data = {
        pageCode:'orderInfo',
        marketingStatus:1,
        openid:this.openId,//用户Id
        userId:userId,
      }
      this.$request('scenic/market/findPageMarket',data).then((res)=>{
			  if(res.code=='00'){
			    this.findPageMarketList = res.data
          // showtip: false,//领取提示
          // showUseRule: false,//使用规则提示
          if(this.findPageMarketList.length>0){
            this.showtip = true
          }
          this.getUserCouponListFun()
        }else{
			    uni.showToast({
			      title: res.message,
			      icon: 'none'
			    })
			  }
      })
    },
    getUserCouponListFun(){//判定券是否使用
      var data = {
			  openid:this.openId,//用户Id
      }
      this.$request('wechatUser/myPage/getUserCouponList',data).then((res)=>{
			  if(res.code=='00'){
			    res.data.forEach((item,index)=>{
            if(item.useRange==11&&item.couponStatus==1){
              this.couponType=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.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){
                    this.dynamicCode()
                    this.qrCodeType=true
                  }else if(this.orderInfo.exchangeMode==1){
                    this.qecode()
                    this.qrCodeType=false
                  }
                })
              }
            }
          }
          if(this.orderInfo.isFetch==1){//isFetch==1需要排队
            this.getSortInfo()
            this.timer2=setInterval(()=>{
              this.getSortInfo()
            },1000*120)
            // this.$once('hook:beforeDestroy',()=>{
            // 	clearInterval(timer)
            // })
          }
          this.findPageMarketFun()
        }else{
          uni.showToast({
            title: res.message,
            icon: 'none'
          })
        }
      })
        .catch((err) => {
          this.timer3 = setTimeout(() => {
            this.getDetail()
          }, 2000)
        })
    },
    getSortInfo(){//-------------------------排号信息加载
      var areaCode = this.orderInfo.areaCode
      var orderNum = this.orderInfo.orderNum
      var userId = this.openId
      var orderId = this.orderInfo.id
      var verifyCode = this.ticketCode
      let data={areaCode,orderNum,userId,orderId,verifyCode,'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()
        },10000)
        // 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
        })
      }
    },
    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.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
          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.reLaunch({
        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;
		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: -322rpx;
		position: relative;
		z-index: 2;
	}
	.order-positionTopAct{
		margin-top: -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: 180px;
		height: 180px;
		margin: 0 auto;
	}

	.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;
	}
	/deep/.u-mask {
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.mask {
		position: relative;
		.img-box {
			position: relative;
			margin-bottom: 32rpx;
			.close {
				position: absolute;
				top: -54rpx;
				right: 24rpx;
				color: #fff;
				&::after {
					position: absolute;
					content: '';
					top: 24rpx;
					left: 50%;
					transform: translateX(-50%);
					width: 0;
					height: 32rpx;
					border-left: 1px dashed #fff;
				}
			}
		}
		.coupon-backgruondImg {
			width: 504rpx;
			height: 720rpx;
		}
		/deep/.u-btn {
			width: 304rpx;
		}
		.tips-vouchers{
			width: 100%;
			position: absolute;
			top: 0;
			left: 0;
			.vouchers-title{
				text-align: center;
				font-size: 36rpx;
				color: #191919;
				font-weight: bold;
				margin-top: 66rpx;
			}
			.vouchers-title2{
				text-align: center;
				font-size: 36rpx;
				color: #191919;
				text{
					color: #EE520E;
					font-size: 64rpx;
					font-weight: bold;
					margin: 0 10rpx 0 10rpx;
				}
			}
			.vouchers-img{
				display: block;
				width: 420rpx;
				height: 335rpx;
				margin: 42rpx auto 42rpx auto;
			}
			.vouchers-to{
				display: flex;
				justify-content:center;
				font-size: 24rpx;
				color: 333333;
				line-height: 34rpx;
				.to-url{
					margin-left: 16rpx;
				}
			}
			.vouchers-text{
				text-align: center;
				font-size: 24rpx;
				color: #333333;
				line-height: 34rpx;
				font-weight: bold;
				margin-top: 16rpx;
			}
		}
		.tips-useRule{
			width: 100%;
			padding: 50rpx 40rpx 0 32rpx;
			position: absolute;
			top: 0;
			left: 0;
			.useRule-title{
				font-size: 36rpx;
				color: #191919;
				font-weight: bold;
				text-align: center;
				margin-bottom: 48rpx;
			}
			.useRule-list{
				margin-bottom: 32rpx;
				.list-title{
					width: 128rpx;
					height: 42rpx;
					background: #000000;
					border-radius: 4rpx 4rpx 4rpx 4rpx;
					font-size: 24rpx;
					color: #fff;
					text-align: center;
					line-height: 42rpx;
					margin-bottom: 24rpx
				}
				.list-text{
					font-size: 20rpx;
					line-height: 28rpx;
					color: #333333;
					margin-bottom: 16rpx;
				}
				.list-text:nth-last-child(1){
					margin-bottom: 0;
				}
			}
		}
	}
	.coupon {
		position: fixed;
		right: -30rpx;
		bottom: 200rpx;
		width: 140rpx;
		height: 140rpx;
		z-index: 20;
	}
</style>
