<template>
	<view class="wrap">
		<view class="top">
			<view class="productname">
				<text style="font-size: 40rpx;font-weight: bold;margin-right: 20rpx;">
					{{channelName}}
				</text>
				<text>
					{{productName}}
				</text>
			</view>
			<view class="numberinfo">
				<view class="bigsize">
					<text style="margin-right: 48rpx;">
						当前排队人数
					</text>
					<text>
						{{numberInfo.peopleNumber}}
					</text>
				</view>
				<view class="bigsize">
					<text style="margin-right: 48rpx;">
						正排队区间
					</text>
					<text>
						{{numberInfo.showStart}}~{{numberInfo.showEnd}}
					</text>
				</view>
				<view class="waitime">
					预计进入排队等候区：{{numberInfo.sortTotalTime}}
				</view>
				<view class="address">
					当前站点：{{numberInfo.projectName}}({{numberInfo.projectRemark}})
				</view>
			</view>
		</view>
		
		<view class="middle">
			<view class="takenumber" @click="rowNumber()">
				<view>
					立即
				</view>
				<view>
					取号
				</view>
			</view>
		</view>
		
		<!-- <view class="bottom">
			<view class="bottom-title">
				游客须知
			</view>
			<view class="bottom-tip">
				<view>
					1、排队区间号段包含排队号时，即可进入排队。
				</view>
				<view>
					2、门票游玩当日内有效，过号需重排。
				</view>
				<view>
					3、空号较多时，预计进入时间可能提前或延后。
				</view>
				<view>
					4、请及时关注排号信息，系统30s自动刷新。
				</view>
				<view>
					5、凡购往返票者，返程时重新取号。
				</view>
				<view>
					6、各务守序，勿忘礼让。
					详情请至游客中心或拨打官方电话023-68816888咨询。
				</view>
			</view>
		</view> -->
	</view>
</template>

<script>
export default {
  data() {
    return {
      chooseArea:'',//站点信息
      merchantCode:'',//商家编号
      channelName:'',//渠道名称
      productName:'',//产品名称
      thirdOrderId:'',//三方订单Id
      orderId:'',//订单Id
      numberInfo:'',//排号信息
    }
  },
  onLoad(option) {
    this.chooseArea=option.chooseArea?JSON.parse(option.chooseArea):''
    this.orderId=option.orderId||''
    this.merchantCode=option.merchantCode||''
    this.channelName=option.channelName||''
    this.productName=option.productName||''
    this.thirdOrderId=option.thirdOrderId||''
    this.getNumberInfo()
  },
  methods: {
    //---获取排号信息
    getNumberInfo(){
		  let data={
		    merchantCode:this.merchantCode, //商户code
		  }
		  this.$request('distribution/distribution/findNewFetchInfoFromSceinc',data).then((res)=>{
			  if(res.code=='00'){
          let main=res.data.main||null
          let list=res.data.data||[]
			    for(let item in main){
            //sceneSortStatus==1时排号上架
            if(item==this.chooseArea.projectIds&&main[item].sceneSortStatus=='1'){
              list.forEach(item2=>{
                if(this.chooseArea.projectIds==item2.projectId){
                  this.numberInfo=item2
                  this.numberInfo.peopleNumber = Math.max(this.numberInfo.sortTotalCapacity-this.numberInfo.showEnd,0)
                }
              })
            }
			    }
			  }else{
			    uni.showToast({
			      title: res.message,
			      icon: 'none'
			    })
			  }
		  })
    },
    //---立即取号
    rowNumber(){
      if(!this.merchantCode||!this.chooseArea.projectIds||!this.thirdOrderId||!this.orderId){
        uni.showToast({
				  title:'缺少取号参数',
				  icon: 'none'
        })
        return
      }
      let data={
        merchantCode:this.merchantCode,//商户编号
        areaCode:this.chooseArea.projectIds,//站点编号
        thirdId:this.thirdOrderId,//三方订单id
        userId:uni.getStorageSync('openid')||'',
        orderId:this.orderId,//订单Id
      }
      this.$request('distribution/distribution/newFetchNumber',data).then((res)=>{
        if(res.code=='00'){
          uni.navigateTo({
          	url:'/pages/my/order/electronicTicket/electronicTicket?orderId='+this.orderId
          })
        }else{
          uni.showToast({
            title: res.message,
            icon: 'none'
          })
        }
      })
    }
  }
}
</script>

<style scoped lang="scss">
.wrap{
	height: 100%;
	background: #ECF3FE;
}
.top{
	background: linear-gradient(180deg, #3688FF 0%, #3688FF 37%, #ECF3FE 100%);
	padding: 40rpx 24rpx 0 24rpx;
}
.productname{
	color: #ffffff;
}
.numberinfo{
	margin-top: 24rpx;
	background: #ffffff;
	border-radius: 16rpx;
	padding: 40rpx 24rpx;
	text-align: center;
}
.numberinfo>view:not(:first-child){
	margin-top: 30rpx;
}
.bigsize{
	font-size: 36rpx;
	font-weight: bold;
}
.waitime{
	padding-bottom: 24rpx;
	border-bottom: 1px solid #ececec;
}
.address{
	font-weight: bold;
	color: #3688FF;
}
.middle{
	display: flex;
	justify-content: center;
	margin: 56rpx 0;
}
.takenumber{
	text-align: center;
	width: 128rpx;
	height: 128rpx;
	background: #3688FF;
	box-shadow: 0 12rpx 24rpx 2rpx rgba(54,136,255,0.5);
	border-radius: 50%;
	color: #ffffff;
	font-size: 32rpx;
	padding-top: 20rpx;
}
.bottom{
	padding: 0 24rpx;
}
.bottom-title{
	font-size: 32rpx;
	font-weight: bold;
	color: #FC771D;
}
.bottom-tip{
	font-size: 24rpx;
	>view{
		margin-top: 20rpx;
	}
}
</style>