<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> <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"> </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"> </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 = 'oh2UV1lyYABHMZ1rMlgjhVHyyYDQ'//'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){ 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() 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==2){ if(todayTimerNum>playdateTimerNum&&todayTimerNum<playdateEndTimerNum){ 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>