联票电子门票开发

pages/my/order/jointElectronicTicket/jointElectronicTicket.vue

@@ -31,7 +31,7 @@
 				<!-- 等于1为需要排号的景区 -->
 				<view class="product-number" v-if="item.isFetch=='1'" v-for="(item2,a) in item.sorts" :key='a'>
 					<!-- 1可进入等候区 -->
-					<template v-if="item2.sortFair==1">
+					<view v-if="item2.sortFair==1" style="background: #31AA6B;color: #ffffff;">
 						<view class="my-number" >
 							<view>
 								<view>我的排队号</view>
@@ -45,82 +45,83 @@
 						<view class="current-number">
 							当前排队区间<text>{{item2.showStart}}-{{item2.showEnd}}</text>号
 						</view>
-						<view class="number-notice">
+						<view class="number-notice" style="color: #ffffff;">
 							<view>
 								温馨提示：{{item2.config.paRowNumHint}}
 							</view>
 							<!-- 可以进入排队区提示 -->
-							<view style="color: #FE6600;">
+							<view>
 								{{item2.config.paArrivalNumHint}}
 							</view>
 						</view>
-					</template>
+					</view>
 					<!-- 2已过号不可重排，3已过号可重排 -->
-					<template v-else-if="item2.sortFair==2||item2.sortFair==3">
-						<view class="my-number" >
-							<!-- 等于1为过号允许排号 -->
-							<view v-if="item2.config.paPassedNumEnable==1">
-								<text>我的排队号</text>
-								<text>{{item2.sortNo}}</text>
+					<view v-else-if="item2.sortFair==2||item2.sortFair==3" style="background: #F53F3F;color: #ffffff;">
+						<!-- 等于1为过号允许再次排号 -->
+						<view class="my-number" v-if="item2.config.paPassedNumEnable==1">
+							<view >
+								<view>我的排队号</view>
+								<view>{{item2.sortNo}}</view>
 							</view>
-							<view  v-if="item2.config.paPassedNumEnable==1">
-								<text>您排队号已过</text>
-								<text v-if="item2.sortFair==3" @click="signOverFun(item2)">取号</text>
+							<view>
+								<view>您排队号已过</view>
+								<view v-show="item2.sortFair==3">
+									<!-- 1为过号提示确定后重新排号 -->
+									<text class="number-btn" v-if="item2.config.paPassedNumTakeType==1" @click="clickSortAgain(item)">重新取号</text>
+									<!-- 0为过号直接重新排号 -->
+									<text class="number-btn" v-else @click="sortAgain(item)">重新取号</text>
 								</view>
-							<!-- 等于0过号不允许排号，只进行提示 -->
-							<view v-if="item2.config.paPassedNumEnable==0">>
-								<text>{{item2.config.paPassedNumHint}}</text>
 							</view>
 						</view>
+						<!-- 等于0过号不允许再次排号，只进行提示 -->
+						<view v-if="item2.config.paPassedNumEnable==0">
+							<view>{{item2.config.paPassedNumHint}}</view>
+						</view>
 						<view class="current-number">
 							当前排队区间<text>{{item2.showStart}}-{{item2.showEnd}}</text>号
 						</view>
-						<view class="number-notice">
-							温馨提示：{{item2.config.paRowNumHint}}
 					</view>
-					</template>
 					<!-- 4-可返程取号(仅胖丁显示),5-第一次取号(仅胖丁显示)-->
-					<template v-else-if="item2.sortFair==4||item2.sortFair==5">
-						<view class="my-number" >
-							<view>
-								<view>我的排队号</view>
-								<view>{{item2.sortNo}}</view>
-							</view>
-							<view>
-								<view>预计进入时间</view>
-								<view>{{item2.sortNoTime}}</view>
+					<view v-else-if="item2.sortFair==4||item2.sortFair==5">
+						<view class="current-number">
+							当前排队区间<text style="color: #FE6600;">{{item2.showStart}}-{{item2.showEnd}}</text>号
 						</view>
+						<!-- 1购票返程允许取号 -->
+						<view v-if="item2.config.paReturnTripNumEnable==1" style="margin-top: 20rpx;" >
+							<text v-if="canTakeNumber" @click="sortAgain(item)" class="number-btn2">取号</text>
+							<text v-else>
+								<text style="color: #FE6600;font-weight: bold;">{{minute}}</text>分
+								<text style="color: #FE6600;font-weight: bold;">{{second}}</text>秒后可取号
+							</text>
 						</view>
-						<view class="current-number">
-							当前排队区间<text>{{item2.showStart}}-{{item2.showEnd}}</text>号
+						<!-- 1购票返程不允许取号,仅提示 -->
+						<view v-if="item2.config.paReturnTripNumEnable==0" style="margin-top: 20rpx;">
+							{{item.config.paReturnTripHint}}
 						</view>
-						<view class="number-notice">
-							温馨提示：{{item2.config.paRowNumHint}}
 					</view>
-					</template>
 					<!-- 6已过闸 -->
-					<view v-else-if="item2.sortFair==6">
+					<view v-else-if="item2.sortFair==6" style="color: #FE6600;">
 						温馨提示：您已过闸
 					</view>
 					<!-- 7提前通知-->
-					<template v-else-if="item2.sortFair==7">
+					<view v-else-if="item2.sortFair==7">
 						<view class="my-number" >
-							<!-- 0隐藏排队号，1显示排队号 -->
-							<view v-if="item2.config.paHideNum==1">
+							<!-- 0显示排队号，1隐藏排队号 -->
+							<view v-if="item2.config.paHideNum!=1">
 								<view>我的排队号</view>
-								<view>{{item2.sortNo}}</view>
+								<view style="color: #FE6600;">{{item2.sortNo}}</view>
 							</view>
-							<!-- 0隐藏预计时间，1显示预计时间 -->
-							<view v-if="item2.config.paHideEstimatedTime==1">
+							<!-- 0显示预计时间，1隐藏预计时间 -->
+							<view v-if="item2.config.paHideEstimatedTime!=1">
 								<view >预计进入时间</view>
-								<view>{{item2.sortNoTime}}</view>
+								<view style="color: #FE6600;">{{item2.sortNoTime}}</view>
 							</view>
 						</view>
 						<view class="current-number">
-							当前排队区间<text>{{item2.showStart}}-{{item2.showEnd}}</text>号
+							当前排队区间<text style="color: #FE6600;">{{item2.showStart}}-{{item2.showEnd}}</text>号
 						</view>
 						<view class="number-notice">
-							<view>
+							<view style="color: #666666;">
 								温馨提示：{{item2.config.paRowNumHint}}
 							</view>
 							<view style="color: #FE6600;">
@@ -132,26 +133,26 @@
 								</text>
 							</view>
 						</view>
-					</template>
+					</view>
 					<!-- 未到号 -->
-					<template v-else>
+					<view v-else>
 						<view class="my-number" >
 							<view>
 								<view>我的排队号</view>
-								<view>{{item2.sortNo}}</view>
+								<view style="color: #FE6600;">{{item2.sortNo}}</view>
 							</view>
 							<view>
 								<view>预计进入时间</view>
-								<view>{{item2.sortNoTime}}</view>
+								<view style="color: #FE6600;">{{item2.sortNoTime}}</view>
 							</view>
 						</view>
 						<view class="current-number">
-							当前排队区间<text>{{item2.showStart}}-{{item2.showEnd}}</text>号
+							当前排队区间<text style="color: #FE6600;">{{item2.showStart}}-{{item2.showEnd}}</text>号
 						</view>
-						<view class="number-notice">
+						<view class="number-notice" style="color: #666666;">
 							温馨提示：{{item2.config.paRowNumHint}}
 						</view>
-					</template>
+					</view>
 				</view>
 				<!-- 后端返回了二维码才显示下面内容 -->
 				<view class="product-code" v-if="item.orderTicketDetailList.length>0&&item.orderTicketDetailList[0].verifyCode">
@@ -250,6 +251,14 @@
 			<text>申请退票</text>
 			<text>再次预订</text>
 		</view>
+		<!-- 是否重新排号 -->
+		<u-modal 
+		:show="showModal" 
+		@confirm="sortAgain(sortAgainData)" 
+		@cancel="showModal=false" 
+		showCancelButton 
+		:title="sortAgainData.config.paPassedNumTakeTypeHint||'是否重新排号'" >
+		</u-modal>
 	</view>
 </template>
 
@@ -290,19 +299,26 @@ export default {
   },
   data() {
     return {
+      detailTimer:null,//详情时间函数
+      codeTimer:null,//动态二维码时间函数
+      numberTimer:null,//获取排号信息时间函数
+      codeFlag:null,//动态二维码函数
+      countFlag:null,//倒计时时间函数
       Brightness:'',//屏幕亮度
       openid:uni.getStorageSync('openid')||'',//openid
       companyId:'',//公司Id
       orderId:'',//订单Id
-      detailTimer:null,//详情时间函数
       orderInfo:'',//订单信息
-      codeFlag:'',//动态二维码函数
-      codeTimer:'',//动态二维码时间函数
       nowCodeNo:'',//当前动态二维码编号
+      showModal:false,//重排号弹窗显示隐藏
+      sortAgainData:'',//重排号数据
+      canTakeNumber:false,//返程或者第一次取号时，是否可以显示取号按钮
+      minute:'',//倒计时分钟
+      second:'',//倒计时秒
     }
   },
   onLoad(option) {
-    this.orderId = 'z0017195376076258fc68582d6fc78be'// option.orderId
+    this.orderId = 'z00171979954017393759272c9f00409'// option.orderId
   },
   onShow() {
     this.getDetail()
@@ -333,6 +349,21 @@ export default {
     if(this.codeTimer) {
 		  clearTimeout(this.codeTimer)
 		  this.codeTimer = null
+    } 
+    //清除排号信息函数
+    if(this.numberTimer) {
+		  clearTimeout(this.numberTimer)
+		  this.numberTimer = null
+    } 
+    //清除倒计时函数
+    if(this.countFlag) {
+		  clearTimeout(this.countFlag)
+		  this.countFlag = null
+    }
+    //清除倒计时函数
+    if(this.codeFlag) {
+		  clearTimeout(this.codeFlag)
+		  this.codeFlag = null
     }
 	  uni.setScreenBrightness({// 恢复之前屏幕亮度
 	    value: this.Brightness
@@ -481,20 +512,40 @@ export default {
 		  this.$request('distribution/distribution/getNewFetchInfo',data).then((res)=>{
 		    if(res.code=='00'){
 		      if(res.data.length>0){
-            item.sorts=res.data[0].sorts
-            this.$forceUpdate()
-            return
-		        //时间判断，用于返程多久可以取号
-		        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) 
+            let dataObj=res.data[0]
+            //子产品获取公司Id,用于重排号传参
+            if(dataObj.pays.length>0){
+              item.companyIdCopy = dataObj.pays[0].companyId
+            }
+            item.sorts=dataObj.sorts||[]
+            item.sorts.forEach((item2)=>{
+              item2.sortFair=4
+            })
+		        if(item.sorts[0].sortFair==4||item.sorts[0].sortFair==5){
+              //时间判断，用于返程或第一次取号时，是否可以显示取号按钮
+              let presentTime = new Date().getTime()
+              let time1=new Date((item.sorts[0].createDate).replace(/-/g, '/')).getTime()
+              let time2=parseInt((item.sorts[0].config.paReturnTripTime)*60*1000) 
+              let takeNumberTime=time1+time2
+		          if(presentTime>takeNumberTime){
+		            this.canTakeNumber =true
 		          }else{
-		            this.returnTripType =true
+                //倒计时
+                //1.先计算时间差多少秒
+                let number=parseInt((takeNumberTime-presentTime)/1000)
+                this.countFlag=setInterval(()=>{
+                  number-=1
+                  if(number<0){
+									  this.canTakeNumber =true
+									  clearInterval(this.countFlag)
+                    return
+                  }
+                  this.minute=parseInt(number/60) 
+                  this.second=parseInt(number-this.minute*60)
+                },1000)
 		          }
 		        }
+            this.$forceUpdate() 
 		      }
 		    }else{
 		      uni.showToast({
@@ -503,23 +554,29 @@ export default {
 		      })
 		    }
 		  }).catch((err)=>{
-		    this.timer1=setTimeout(()=>{
-		      this.getSortInfo()
+		    this.numberTimer=setTimeout(()=>{
+		      this.getSortInfo(item)
 		    },1000)
 		  })
     },
+    //---点击重新取号，显示弹窗
+    clickSortAgain(item){
+      this.showModal=true
+      this.sortAgainData=item
+    },
     //---重新排队
     sortAgain(item){
 		  let data={
 		    againNumber:1,
-		    thirdId:this.sortsInfo.order.orderId,
-		    areaCode:item.projectId,
+		    thirdId:item.thirdOrderId,//三方订单id
+		    areaCode:item.areaCode,//站点
 		    userId:this.openid,
-		    merchantCode:this.companyId,
+		    merchantCode:item.companyIdCopy,
 		  }
 		  this.$request('distribution/distribution/newFetchNumber',data).then((res)=>{
 		    if(res.code=='00'){
-		      this.getSortInfo()
+          this.showModal=false
+		      this.getSortInfo(item)
 		    }else{
 		      uni.showToast({
 		        title: res.message,
@@ -601,39 +658,66 @@ export default {
 	}
 }
 .product-number{
-	background: #FFFFFF;
 	border-radius: 16rpx;
+	background: #FFFFFF;
 	border: 1px solid #dcdcdc;
-	padding: 32rpx;
 	margin-top: 20rpx;
+	>view{
+		padding: 32rpx;
+		border-radius: 16rpx;
+	}
 }
 .my-number{
 	display: flex;
 	>view{
-		width: 50%;
 		view:last-child{
 			margin-top: 10rpx;
-			color: $red;
 			font-size: 52rpx;
 			font-weight: 600;
 		}
 	}
+	>view:first-child{
+		width: 52%;
+	}
+	>view:last-child{
+		width: 48%;
+	}
 }
 .current-number{
 	margin-top: 10rpx;
 	text{
 		font-size: 40rpx;
-		color: $red;
 		font-weight: 600;
 		margin: 0 4rpx;
 	}
 }
 .number-notice{
-	color: #666666;
 	font-size: 24rpx;
 	margin-top: 20rpx;
 	line-height: 34rpx;
 }
+.number-btn{
+	display: inline-block;
+	width: 140rpx;
+	height: 64rpx;
+	background: #ffffff;
+	border-radius: 32rpx;
+	text-align: center;
+	line-height: 60rpx;
+	color: #4561A1;
+	font-size: 24rpx;
+}
+.number-btn2{
+	display: inline-block;
+	width: 140rpx;
+	height: 64rpx;
+	border-radius: 32rpx;
+	text-align: center;
+	line-height: 60rpx;
+	background: #31AA6B;
+	color: #ffffff;
+	font-size: 28rpx;
+}
 .product-code{
 	text-align: center;
 	border-top: 1px solid #f5f5f5;