Skip to content

U
uni-pdtravel
Commit 3d07bdd8 authored by qipeng's avatar qipeng
Browse files
Options

详情页面

parent 480c39de
Hide whitespace changes
Inline Side-by-side
Showing with 276 additions and 102 deletions
pages/my/order/electronicTicketNew/electronicTicketNew.vue
View file @ 3d07bdd8
......@@ -19,7 +19,7 @@
<view class="status-product">{{orderInfo.merchantName}}（{{orderInfo.productName}}）</view>
</view>
</view>
<template v-if="orderInfo.orderType==1||orderInfo.orderType==3">
<template v-if="orderInfo.orderType==1&&ticketCode!=nul||orderInfo.orderType==3&&ticketCode!=null">
<view class="order-certificate order-allType order-positionTop">
<!-- <view class="alltype-title">
<view class="title-line">
......@@ -46,72 +46,80 @@
<view class="title-label">排队详情</view>
<!-- <u-icon name="reload"></u-icon> -->
</view>
<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>
<!-- <text class="list-btnNew" @click="sortAgain(item)" v-if="item.resetSort">重新排号</text> -->
</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">请及时关注排号信息，系统30s自动刷新。空号较多时，预计进入时间可能提前或推后，感谢您的理解。</text>
</view>
</view>
<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">取号</view>
<view class="rowNumber-takeTimer">9分53秒后可取号</view>
</view>
<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>
<!-- <text class="list-btnNew" @click="sortAgain(item)" v-if="item.resetSort">重新排号</text> -->
</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">请及时关注排号信息，系统30s自动刷新。空号较多时，预计进入时间可能提前或推后，感谢您的理解。</text>
</view>
</view>
<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">
<view class="rowNumber-signOver">您排队号已过</view>
<view class="rowNumber-takeNum2">取号</view>
</view>
<view class="rowNumber-takeTimer">9分53秒后可取号</view>
</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">请及时关注排号信息，系统30s自动刷新。空号较多时，预计进入时间可能提前或推后，感谢您的理解。</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" @click="sortAgain(item)">取号</view>
<view class="rowNumber-takeTimer" v-if="returnTripType==false">{{m}}分{{s}}秒后可取号</view>
</view>
</template>
<!-- 可进入 -->
<template v-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">请及时关注排号信息，系统30s自动刷新。空号较多时，预计进入时间可能提前或推后，感谢您的理解。</text>
</view>
</view>
</template>
<!-- 过号 -->
<template v-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">
<view class="rowNumber-signOver">您排队号已过</view>
<view class="rowNumber-takeNum2" v-if="item.sortFair===3" @click="signOverFun(item)">取号</view>
</view>
</view>
</template>
<!-- 历史排号 -->
<view class="queueUp-historyNum">
历史排号：240（北站）/ 587（北站）
历史排号：
<template v-for="(item,index) in sortsAll">
<text v-if="index!==0" :key="index">{{item.sortNo}}({{item.projectName}})</text>
</template>
</view>
</view>
<view class="order-mes order-allType order-positionTop">
......@@ -152,8 +160,12 @@
<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):""}} {{orderInfo.startPlayTime?orderInfo.startPlayTime.substr(0,8):""}}</view>
<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>
......@@ -162,14 +174,21 @@
</view>
<view class="box-case" v-if="touristInfo.length>0">
<view class="case-list">
<view class="list-name">游客信息</view>
<view class="list-name">联系信息</view>
<view class="list-text">
<view v-for="(list,index) in touristInfo" :key="index">
<view>{{list.name}} {{orderInfo.ticketPhone}}</view>
{{list.credentialNumber.substr(0,4)+"****"+list.credentialNumber.substr(14,list.credentialNumber.length-1)}}
<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">
......@@ -190,6 +209,21 @@
</view>
</view>
</view>
<!--遮罩-->
<view class="order-mask" v-if="maskType==true">
<view class="mask-case">
<view class="case-title">
温馨提示
</view>
<view class="case-body">
如您已通过查验进入排队区，则无需取号，取号将重排号
</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>
......@@ -356,9 +390,12 @@
return {
openId:'',//用户信息
id:'',//订单ID
companyId:'',//公司ID
orderInfo:{},//订单信息
sortsInfo:'',//取号数据
sortData:[],//排队号信息
sortsAll:[],//所有排号信息
overSignedData:{},//过号数据
ticketCode:null,//订单编码
verifyCode:null,//二维码
ticketStatus:null,//票状态 0未使用，1已核销，2退票，3过期
......@@ -370,11 +407,19 @@
orderTypeNum:1,//订单是否展开
timer1:null,
timer2:null,
maskType :false,
d:'',//倒计时 天
h: '',//倒计时 时
m: '',//倒计时 分
s: '',//倒计时 秒
sum_h: '',//倒计时
timerType:null,//清除标记
returnTripType:false,//返程取号设置
}
},
onLoad(option) {
//this.id = option.orderId
this.id = "z0016790198036828fdab58f248e3835"
this.id = "z00167956572219584dc15634b62cf75"
//this.openId = uni.getStorageSync("openid") //openid
this.openId = "oh2UV1lyYABHMZ1rMlgjhVHyyYDQ"
this.getDetail();
......@@ -444,38 +489,52 @@
this.$request('distribution/distribution/getNewFetchInfo',data).then((res)=>{
if(res.code=="00"){
if(res.data.length>0){
this.sortsInfo = res.data[0]
var sortArr = 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){
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{
northArr = item
}
}else{//南站
if(southArr){
if(item.sortNo>southArr.sortNo){
}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{
southArr = item
this.returnTripType =true;
}
}
})
var arr = []
if(northArr){
arr.push(northArr)
}
if(southArr){
arr.push(southArr)
}
this.sortData = arr
}
}else{
uni.showToast({
title: res.message,
......@@ -485,7 +544,7 @@
}).catch((err)=>{
this.timer1=setTimeout(()=>{
this.getSortInfo()
},2000)
},10000)
// this.$once('hook:beforeDestroy',()=>{
// clearTimeout(timer)
// })
......@@ -496,11 +555,13 @@
againNumber:1,
thirdId:this.sortsInfo.order.orderId,
areaCode:item.projectId,
userId:this.openId
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,
......@@ -529,6 +590,11 @@
})
}
},
signOverFun(item){//过号遮罩显示
this.overSignedData = {};
this.overSignedData = item
this.maskType = true
},
dynamicCodeRefresh(){
// 获取当前显示第几个二维码
let codes=this.codes
......@@ -618,7 +684,57 @@
}
})
},
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)
},
}
}
</script>
......@@ -741,8 +857,6 @@
padding: 24rpx 24rpx 24rpx 24rpx;
}
.order-queueUp .queueUp-rowNumber .rowNumber-list {
display: flex;
font-size: 28rpx;
......@@ -978,4 +1092,64 @@
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;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment