Commit ebb83e54 authored by 潘永坪's avatar 潘永坪

Merge branch 'develop' into album

# Conflicts:
#	pages.json
#	pages/indexs/center/center.vue
parents b04c5587 8aacc785
...@@ -54,7 +54,8 @@ ...@@ -54,7 +54,8 @@
"path": "pages/combination/distributionCombiChoose/distributionCombiChoose", "path": "pages/combination/distributionCombiChoose/distributionCombiChoose",
"style": { "style": {
"navigationBarTitleText": "产品选择", "navigationBarTitleText": "产品选择",
"enablePullDownRefresh": false "enablePullDownRefresh": false,
"navigationStyle": "custom"
} }
}, },
{ {
...@@ -161,7 +162,7 @@ ...@@ -161,7 +162,7 @@
{ {
"path": "order/intelTicket/intelTicket", "path": "order/intelTicket/intelTicket",
"style": { "style": {
"navigationBarTitleText": "", "navigationBarTitleText": "电子门票",
"enablePullDownRefresh": false "enablePullDownRefresh": false
} }
}, },
...@@ -264,10 +265,20 @@ ...@@ -264,10 +265,20 @@
}, },
{ {
<<<<<<< HEAD
"path" : "addressManage/addressManage", "path" : "addressManage/addressManage",
"style" : "style" :
{ {
"navigationBarTitleText" : "地址管理" "navigationBarTitleText" : "地址管理"
=======
"path" : "order/jointElectronicTicket/jointElectronicTicket",
"style" :
{
"navigationBarTitleText" : "电子门票",
"enablePullDownRefresh": false,
"navigationBarTextStyle": "black",
"navigationBarBackgroundColor": "#F7F8FA"
>>>>>>> develop
} }
} }
] ]
......
<template> <template>
<view class="big-box" :style="{'padding-top': statusBarHeight + 'px'}" v-if="statusBarHeight"> <view class="big-box" :style="{'padding-top': statusBarHeight + 'px'}" v-if="showBody">
<view class="nav-bar" :style="{'height': navHeight + 'px'}"></view> <view class="nav-bar" :style="{'height': navHeight + 'px'}"></view>
<text class="title">扫脸获取您的照片</text> <text class="title">扫脸获取您的照片</text>
<view class="scan"> <view class="scan">
...@@ -32,16 +32,21 @@ ...@@ -32,16 +32,21 @@
<view>未找到您的照片</view> <view>未找到您的照片</view>
<view class="small">请在拍摄点拍摄后重试</view> <view class="small">请在拍摄点拍摄后重试</view>
</view> </view>
<u-button type="info" size="mini" shape="circle" @click="returnClick">返回</u-button> <u-button type="info" size="mini" shape="circle" @click="returnClick" v-if="maskCount<=0">返回</u-button>
<view class="overlay-button" v-else>返回</view>
</view> </view>
</u-overlay> </u-overlay>
</view> </view>
<view v-else style="padding: 100rpx;text-align: center;font-size: 36rpx;">
升级中...
</view>
</template> </template>
<script> <script>
export default { export default {
data() { data() {
return { return {
showBody:false,
statusBarHeight: 0, statusBarHeight: 0,
capsule: 0, capsule: 0,
navHeight: 0, navHeight: 0,
...@@ -58,6 +63,27 @@ export default { ...@@ -58,6 +63,27 @@ export default {
} }
}, },
methods: { methods: {
//---加载图标
loadIcon(){
let data={
merchantType:0,//商户类型,其他
}
this.$request('scenic/merchantExtendProject/loadList',data).then((res)=>{
if(res.code=='00'){
let iconList=res.data||[]
let list=[]
iconList.forEach(item=>{
if(item.projectStatus==0){
list.push(item)
}
})
if(list.length>6){
this.showBody=true
this.openCamera()
}
}
})
},
returnClick() { returnClick() {
if(this.maskCount > 0) return if(this.maskCount > 0) return
this.maskShow = false this.maskShow = false
...@@ -145,7 +171,7 @@ export default { ...@@ -145,7 +171,7 @@ export default {
this.queryData = res.data this.queryData = res.data
this.takePhoto() this.takePhoto()
}else{ }else{
this.handleNotFound() this.handleNotFound()
uni.showToast({ uni.showToast({
title: '查询参数获取失败', title: '查询参数获取失败',
icon: 'none' icon: 'none'
...@@ -243,7 +269,8 @@ export default { ...@@ -243,7 +269,8 @@ export default {
uni.setScreenBrightness({ uni.setScreenBrightness({
value: 0.8, //屏幕亮度值,范围 0~1,0 最暗,1 最亮 value: 0.8, //屏幕亮度值,范围 0~1,0 最暗,1 最亮
}) })
this.openCamera() this.loadIcon()
} }
} }
</script> </script>
...@@ -373,5 +400,24 @@ export default { ...@@ -373,5 +400,24 @@ export default {
color: #333; color: #333;
} }
} }
.overlay-button{
border-radius: 100px;
color: #323233;
background-color: #ebedf0;
border-color: #ebedf0;
border-width: 1px;
border-style: solid;
height: 22px;
width: 100%;
font-size: 10px;
min-width: 50px;
padding: 0px 8px;
position: relative;
align-items: center;
justify-content: center;
display: flex;
box-sizing: border-box;
flex-direction: row;
}
} }
</style> </style>
\ No newline at end of file
<!-- 修改这个页面时,需要同步更新combiChoose页面的代码 -->
<template>
<view class="wrap">
<scroll-view @scroll="scrollFull" style="height: 100%;" :scroll-into-view="toViewFull" scroll-y>
<view class="banner">
<u-swiper :list="imgList" @change="e => currentNum = e.current" indicatorStyle="right: 20px;bottom:25px" height="400" circular>
<view slot="indicator" class="indicator-num">
<text class="indicator-num__text">{{ currentNum + 1 }}/{{ imgList.length }}</text>
</view>
</u-swiper>
</view>
<view class="middle" id="middle">
<!-- 中间上面部分 -->
<view class="middle-top" :style="middleTopStyle">
<view class="merchant-name">
{{merchantTitle||''}}
</view>
<u-transition :show="showTransition" :duration='600'>
<view class="merchant-info-bottom" >
<view class="merchant-bottom-left">
<view>
<text style="color: #00B42B;">营业时间</text>
</view>
<view>
{{currentMerchant.businessStart?currentMerchant.businessStart.substr(0,5):''}}-
{{currentMerchant.businessEnd?currentMerchant.businessEnd.substr(0,5):''}}
</view>
</view>
<view class="merchant-bottom-right">
<view class="merchant-address">
{{currentMerchant.address||''}}
</view>
<view class="merchant-nav" @click="navigation(currentMerchant)">
<view class="merchant-bg">
<image src="@/static/img/combination/nav.png" style="width: 28rpx;height: 28rpx;"></image>
</view>
<view>导航</view>
</view>
<view class="merchant-phone" @click="makePhone(currentMerchant.phone)">
<view class="merchant-bg">
<image src="@/static/img/combination/phone.png" style="width: 28rpx;height: 28rpx;"></image>
</view>
<view>电话</view>
</view>
</view>
</view>
</u-transition>
</view>
<!-- 列表部分 -->
<view class="middle-bottom" :style="middleBottomStyle">
<!-- 左边滚动条 -->
<scroll-view class="scroll-left" :style="{height:scrollHeight+'px'}" :scroll-into-view="toViewLeft" scroll-y>
<view class="middle-left">
<view :id="'merchant-tab'+index" class="merchant-tab" v-for="(item,index) in scenicList" :key="index" @click="merchantTabChange(index)" :class='{on:merchantIndex==index}'>
{{item.name}}
</view>
</view>
</scroll-view>
<!-- 右边滚动条 -->
<scroll-view @scroll="scrollRight" :style="{height:middleHeight+'px'}" :scroll-into-view="toViewRight" scroll-y>
<view class="middle-right">
<checkbox-group @change="checkboxChange" class="checkbox-box">
<view class="merchantlist-wrap" :id="'merchant'+index" v-for="(item, index) in scenicList" :key="index">
<view class="merchantlist">
<view class="merchantlist-title" @click="clikDetail(item.id)">
<view class="merchantlist-name">
<text>{{ item.name }}</text>
<template v-if="item.couponVoList && item.couponVoList.length > 0">
<image src="@/static/img/scenic/coupon.png"></image>
<text class="merchantlist-coupon"> 劵惠 </text>
</template>
</view>
<view v-if="showDistance" class="merchantlist-detail">
距您{{ item.distance ? parseFloat((item.distance / 1000).toFixed(2)) : 0 }}km
<u-icon name="arrow-right" style="margin-left: 4rpx;" size='26' color='#B4B4B4'></u-icon>
</view>
</view>
<label v-for="(items, a) in item.productListCopy" :key="a" :class="{ off: items.status == 2 }">
<view class="product" :class="{ on: items.ifChangeBg }">
<view class="product-left">
<checkbox
style="transform: scale(0.8)"
class="blue"
:disabled="items.status == 2"
:value="JSON.stringify(items)"
:checked="items.ifChecked"
/>
</view>
<view class="product-right">
<view class="product-name">
<text>{{ items.name }}</text>
<text class="product-status" v-if="items.status == 2">{{ items.statusName }}</text>
</view>
<view class="product-rule">
<text>随买随用</text>
<template v-if="items.productRefundRuleVo">
<text v-if="items.productRefundRuleVo.refundType == 0">不可退</text>
<text v-if="items.productRefundRuleVo.refundType == 1">有条件退</text>
<text v-if="items.productRefundRuleVo.refundType == 2">随时可退</text>
</template>
<text> 无需取票 </text>
</view>
<view class="product-price">
<view style="display: flex;">
<text @click.stop="showBuyKnow(items)">购买须知</text>
<u-icon name="arrow-right" size='26' color='#B4B4B4'></u-icon>
</view>
<view class="product-sell">
<text style="font-size: 28rpx">¥</text>{{ items.sellingPrice }}
</view>
</view>
</view>
</view>
</label>
</view>
<!-- <view class="product-more" v-if="index > 0 && item.productList.length > 2">
<view v-if="item.productListCopy.length != item.productList.length" @click="showMoreProduct(item)">
更多
<u-icon name="arrow-down" size='24' color='#B4B4B4'></u-icon>
</view>
<view v-else @click="retractProduct(item)">
收起
<u-icon name="arrow-up" size='24' color='#B4B4B4'></u-icon>
</view>
</view> -->
</view>
</checkbox-group>
<view class="no-more">
已经到底啦
</view>
<!-- <u-empty text="暂无数据..." mode="list" v-if="scenicList.length == 0" iconSize="160" textSize='24' textColor='#3688FF'></u-empty> -->
</view>
</scroll-view>
</view>
</view>
<view class="bottom">
<view class="bottom-left" @click="showCustomer()">
<u-icon name="chat" size="42"></u-icon>
客服
</view>
<view class="bottom-right">
<view class="bottom-choose">
<view class="bottom-more" v-show="chooseProduct.length > 0">
组合购更优惠
<text class="bottom-triangle"></text>
</view>
<view class="bottom-detail" @click="showDetail()" :style="{ top: chooseProduct.length > 0 ? '-28rpx' : '0' }">
<text style="margin-right: 10rpx;">已选产品 </text>
<text class="bottom-number">
{{ chooseProduct.length }}
</text>
<u-icon name="arrow-up" size="32"></u-icon>
</view>
</view>
<view class="bottom-btn" @click="goFillorder()">
去预定
</view>
</view>
</view>
</scroll-view>
<!-- 客服组件 -->
<customer :scenicList="scenicList" ref="customer"></customer>
<!-- 购买须知 -->
<buyKnow :buyKnowData="buyKnowData" ref="buyKnow"></buyKnow>
<!-- 产品明细 -->
<detail :chooseProduct="chooseProduct" ref="detail"></detail>
<!-- 商户详情 -->
<merchantDetail :detailData='detailData' ref='merchantDetail'></merchantDetail>
<!-- 模态框 -->
<u-modal :show="showModal" @confirm="chooseConfirm" @cancel="chooseCancel" title="提示" content="是否更改产品" show-cancel-button="true">
</u-modal>
<image class="suodaoImg" v-if="showSuodaoImg" src="https://lx.pangdly.com/img/cjsdFirst.50a2e63.jpg"></image>
<!-- 系统无法访问时弹窗 -->
<u-popup :show="showTip" :round="20">
<view style="padding: 300rpx 0;text-align: center;font-size: 32rpx;font-weight: bold;">
<view>
当前购票人数过多!
</view>
<view style="margin-top: 20rpx;">
请到现场窗口进行购买,或稍后重试
</view>
</view>
</u-popup>
</view>
</template>
<script>
import customer from '@/components/customer.vue' //客服
import buyKnow from '@/components/buyKnow.vue' //购买须知
import detail from './components/detail.vue' //明细
import UWaterfall from '@/uview-ui/components/u-waterfall/u-waterfall.vue'
import merchantDetail from '@/components/merchantDetail' //详情弹窗
export default {
components: {
customer,
buyKnow,
detail,
UWaterfall,
merchantDetail
},
data() {
return {
merchantTitle:'',//商家标题
currentMerchant:'',//当前入口商家信息
showTip:false,//系统调不通或者崩了跳出弹窗
detailData:'',//详情数据
showSuodaoImg:false,//索道耳麦图片是否显示隐藏
companyId:'',//公司Id
merchantId: '', //商户Id
groupId: '', //组合Id
groupChannelId: '', //组合渠道Id
channelId:'',//渠道Id
currentNum:0,//轮播图下标
imgList: [], //图片列表
scenicList:[], //景区数据
showDistance: false, //定位成功显示距离
buyKnowData: '', //购买须知数据
chooseProduct: [], //选中的产品
showModal: false, //是否显示模态框
chooseMerchantProduct: '', //不支持多产品购买时,选中的景区产品
merchantIndex:0,//选中的商家下标
middleHeight:0,//中间列表盒子高度
heightArr:[],//元素高度数组
scrollHeight:0,//中间盒子滚动时的高度
originHeight:0,//中间盒子原本高度
middleTopStyle:'',//中间盒子上部分样式
middleBottomStyle:'',//中间盒子下部分样式
toViewRight:'',//右边滚动到某个元素
toViewLeft:'',//左边滚动到某个元素
toViewFull:'',//全屏滚动到某个元素
showTransition:true,//控制动画显示隐藏
}
},
watch: {
//选中产品的数量变化
chooseProduct: {
handler(newValue, oldValue) {
//当选中产品时
if (newValue.length > oldValue.length) {
//找到当前选中的产品
let product = newValue[newValue.length - 1]
//商家一级
let merchant = ''
//通过产品一级找到商家一级
this.scenicList.forEach(item => {
if (item.id == product.merchantId) {
merchant = item
}
})
//当选中产品的景区有2个以上选中产品时
let number = 0
this.chooseProduct.forEach(item => {
if (merchant.id == item.merchantId) {
number += 1
}
})
if (product.isMoreBuy !== 0) {
if (number > 1) {
//显示确认弹窗
this.showModal = true
//当前选中的景区产品,用于确定以及取消方法取值
this.chooseMerchantProduct = product
}
} else {
//支持多产品购买时,删除该景区其他产品不支持多产品购买的产品
this.chooseProduct.forEach((item, index) => {
if (merchant.id == item.merchantId && item.isMoreBuy !== 0) {
//取消选中状态和选中背景颜色
this.scenicList.forEach(item2 => {
item2.productList.forEach(item3 => {
if (item.id == item3.id) {
item3.ifChecked = false
item3.ifChangeBg = false
}
})
})
delete this.chooseProduct[index]
}
})
this.chooseProduct = this.chooseProduct.filter(function (val) {
return val
})
}
}
},
deep: true,
immediate: false
}
},
onLoad(option) {
//获取公司Id,保存到本地,支付等逻辑需要入口companyId
this.companyId=this.$commonjs.getCompanyId(option)||''
this.merchantId = this.$commonjs.getKey(option,'merchantId')|| ''
this.channelId=this.$commonjs.getKey(option,'channelId')||''
this.groupId=this.$commonjs.getKey(option,'groupId')||''
this.groupChannelId=this.$commonjs.getKey(option,'groupChannelId')||''
},
onShow() {
//如果是索道
if(this.merchantId=='z0015605022691a5945bbe463141668c'){
this.showSuodaoImg=true
setTimeout(() => {
this.showSuodaoImg = false
}, 2500)
}
//清空之前选中的数据以及状态
this.detailData=''
this.chooseProduct=[]
if(this.$refs.merchantDetail){
//解决支付宝小程序报错问题
this.$refs.merchantDetail.showPop=false
}
if(this.$refs.detail){
//解决支付宝小程序报错问题
this.$refs.detail.showPop = false
}
let newTimestamp=uni.getStorageSync('newTimestamp')||''
let token = uni.getStorageSync('token')
if (token) {
uni.getLocation({
type: 'wgs84',
success: res => {
let latitude = res.latitude //纬度
let longitude = res.longitude //经度
this.showDistance = true
//判断时间戳,之前请求失败,必须大于缓存时间戳才进行请求
if(newTimestamp){
if(Date.now()>newTimestamp){
this.initList(latitude, longitude)
}else{
this.showTip=true
}
}else{
this.initList(latitude, longitude)
}
},
fail: res => {
let latitude = ''
let longitude = ''
//判断时间戳,之前请求失败,必须大于缓存时间戳才进行请求
if(newTimestamp){
if(Date.now()>newTimestamp){
this.initList(latitude, longitude)
}else{
this.showTip=true
}
}else{
this.initList(latitude, longitude)
}
}
})
}
},
methods: {
//---商品列表
initList(latitude, longitude) {
let data = {
channelId: this.channelId, //渠道Id
companyId: this.companyId, //公司Id
merchantId: this.merchantId, //商户id
groupId: this.groupId, //组合Id
openid: uni.getStorageSync('openid')||'',
latitude,
longitude
}
this.scenicList=[]
// 获取当前时间戳
let currentTime = Date.now()
// 设置需要添加的分钟数
let minutesToAdd =5 // 这里假设要添加5分钟
this.$request('/scenic/groupGood/findGroupGoodProductList', data).then(res => {
uni.removeStorageSync('newTimestamp')
if (res.code == '00') {
let merchantList=res.data.merchantList||[]
merchantList.forEach(item=>{
if(item.type==1&&item.productList.length>0){
//type=1为景区
this.scenicList.push(item)
}
})
this.scenicList.forEach((item, index) => {
//获取当前景区图片,把当前景区放在第一位
if (item.id == this.merchantId) {
this.imgList = item.imgList
this.scenicList.splice(index, 1)
this.scenicList.unshift(item)
item.productListCopy = item.productList
//获取当前商家信息
this.currentMerchant=item
this.merchantTitle=item.name
} else {
// item.productListCopy = item.productList.slice(0, 2)不要更多,暂时注释
item.productListCopy = item.productList
}
//预订时间为当天时,当前时间大于最早预订时间显示未开售,当前时间大于最晚预订时间显示已售罄
let times = new Date().Format('hh:mm:ss')
let timeNumber = parseInt(this.$commonjs.changeTime(times)) //将当前时间转化为数字
item.productList.forEach(item2 => {
item2.timeNumber1 = parseInt(this.$commonjs.changeTime(item2.earlyBookTime))
item2.timeNumber2 = parseInt(this.$commonjs.changeTime(item2.bookTime))
if (item2.aheadBookDays == 0) {
if (item2.status == 2) {
item2.statusName = '已售罄'
} else {
if (timeNumber < item2.timeNumber1) {
item2.status = 2
item2.statusName = '未开售'
}
if (timeNumber > item2.timeNumber2) {
item2.status = 2
item2.statusName = '已售罄'
}
}
}
})
})
this.$nextTick(() => {
//清空数组
this.heightArr=[]
uni.getSystemInfo({
complete:(info)=> {
let windowHeight=info.windowHeight||753
//获取中间盒子需要滚动时的高度
uni.createSelectorQuery().in(this).select('.middle-top').boundingClientRect(data => {
if(data){
this.scrollHeight=windowHeight-data.height
}
}).exec()
//获取中间盒子原本高度
uni.createSelectorQuery().in(this).select('.middle-right').boundingClientRect(data => {
//获取中间盒子原本高度,默认中间盒子等于原本高度,滚动之后等于滚动高度
if(data){
this.originHeight=data.height
this.middleHeight=this.originHeight
}
}).exec()
//不要这样 多个的时候就会循环 varquery = uni.createSelectorQuery()
for(let i=0;i<this.scenicList.length;i++){
uni.createSelectorQuery().in(this).select(`#merchant${i}`).boundingClientRect(data => {
//获取商家列表各个元素的高度,并且把他们前后相加添加到一个数组里面
if(data){
if(i==0){
//取整,由于高度多数为小数,防止点击左边,滚动右边时出现bug
this.heightArr.push(parseInt(data.height))
}else{
this.heightArr.push(parseInt(data.height)+this.heightArr[i-1])
}
}
}).exec()
}
}
})
})
} else {
uni.showToast({
title: res.message,
icon: 'none'
})
if(res.code=='100'){
//系统性能接近瓶颈,关闭请求
this.showTip=true
// 当前时间加上添加分钟数
let timestamp1 = currentTime + (minutesToAdd * 60 * 1000)
//后端返回的时间
let timestamp2=Date.parse(JSON.parse(res.message).stopTime)
let newTimestamp=''
if(currentTime>timestamp2){
//当前时间大于后端返回时间,以当前时间加上分钟数为准
newTimestamp = timestamp1
}
if(currentTime<=timestamp2){
//当前时间小于等于后端返回时间,取后端返回时间和当前时间加上的分钟数的最小值
newTimestamp = Math.min(timestamp1,timestamp2)
}
uni.setStorageSync('newTimestamp', newTimestamp)
}
}
}).catch(error => {
this.showTip=true
// 计算新的时间戳
let newTimestamp = currentTime + (minutesToAdd * 60 * 1000)
uni.setStorageSync('newTimestamp', newTimestamp)
})
},
//---初始化详情
initDetail(merchantId){
let data={
userId:uni.getStorageSync('userId')||'',
openid:uni.getStorageSync('openid')||'',
id:merchantId,//商户id
isDetail:1,//商户详情
}
this.detailData=''
this.$request('scenic/user/merchant/findDetailInfo',data).then((res)=>{
if(res.code=='00'){
this.detailData=res.data
//解决详情里面图片太宽超出屏幕宽度出现滚动条的问题
if(this.detailData.introduce){
this.detailData.introduce=this.detailData.introduce.replace(/\<img/gi, '<img style="max-width:100%;height:auto;"')
}
}else{
uni.showToast({
title: res.message,
icon: 'none'
})
}
})
},
//---商家下标切换
merchantTabChange(index){
//点击左边,全屏先置顶
this.toViewFull='middle'
//点击左边,右边可滚动
this.merchantIndex=index
this.middleHeight=this.scrollHeight
//加个延时,防止第一次点击时元素样式还未更新,导致不滑动到对应元素
this.$nextTick(()=>{
//this.$nextTick解决苹果手机
//settimeout解决安卓手机
setTimeout(()=>{
this.toViewRight='merchant'+index
},100)
})
},
//---展示明细弹窗
showDetail() {
this.$refs.detail.showPop = true
},
//---全屏滚动
scrollFull(e){
setTimeout(()=>{
let height=0
uni.createSelectorQuery().in(this).select('.banner').boundingClientRect(data => {
if(data){
//20=中间盒子top:-20的值
// height=data.height-70
height=data.height-20
if(e.detail.scrollTop>=height){
//中间上部分固定,中间下部分可滚动,全屏不滚动
this.middleTopStyle='top:0;position:fixed;'
this.middleBottomStyle='margin-top:50px;'
this.middleHeight=this.scrollHeight
this.showTransition=false
this.merchantTitle='组合购买更省钱'
}else{
//中间上部分不固定,中间下部分不可滚动,全屏滚动
this.middleTopStyle='position:relative;'
this.middleBottomStyle='margin-top:0;'
this.middleHeight=this.originHeight
this.showTransition=true
this.merchantTitle=this.scenicList[0].name
}
}
}).exec()
},5)
},
//---右边滚动事件
scrollRight(e) {
setTimeout(()=>{
let scrollTop=e.detail.scrollTop
//通过滚动值获取下标
this.heightArr.forEach((item,i)=>{
if(i==0){
if(0<=scrollTop&&scrollTop<item){
this.merchantIndex=i
this.toViewLeft='merchant-tab'+i
}
}else{
if(this.heightArr[i-1]<=scrollTop&&scrollTop<item){
this.merchantIndex=i
this.toViewLeft='merchant-tab'+i
}
}
})
},5)
},
//---导航
navigation(merchant){
uni.openLocation({
latitude:merchant.latitude,
longitude:merchant.longitude,
name:merchant.name,
address:merchant.address,
success: function () {
}
})
},
//---拨打电话
makePhone(phoneNumber) {
uni.makePhoneCall({
phoneNumber
})
},
//---展示客服组件
showCustomer() {
this.$refs.customer.showPop = true
},
//---展示购买须知
showBuyKnow(data) {
this.buyKnowData = data
this.$refs.buyKnow.showPop = true
},
//---点击详情
clikDetail(merchantId){
this.$refs.merchantDetail.showPop=true
this.initDetail(merchantId)
},
//---展示更多产品
showMoreProduct(item) {
item.productListCopy = item.productList
this.$forceUpdate()
},
//---收起产品
retractProduct(item) {
item.productListCopy = item.productList.slice(0, 2)
this.$forceUpdate()
},
//---多选框变化
checkboxChange(e) {
let value = e.detail.value
let arr = []
value.forEach(item => {
arr.push(JSON.parse(item))
})
this.chooseProduct = arr
//判断是否选中产品,选中产品的背景颜色需要变化
this.scenicList.forEach(item => {
item.productList.forEach(item2 => {
item2.ifChangeBg = false
this.chooseProduct.forEach(item3 => {
if (item2.id == item3.id) {
item2.ifChangeBg = true
//解决是否支持多产品购买弹窗2次之后,选中状态错误bug,需要在选中时修改状态
//#ifdef MP-WEIXIN
//由于支付宝小程序会出现bug,所以只在微信小程序里面执行该代码
item2.ifChecked = true
//#endif
}
})
})
})
},
//---不支持多选产品,选择确定事件
chooseConfirm() {
this.chooseProduct.forEach((item, index) => {
//删除选中产品以外的其他所有产品
if (this.chooseMerchantProduct.merchantId == item.merchantId && JSON.stringify(item) != JSON.stringify(this.chooseMerchantProduct)) {
//取消选中状态和选中背景颜色
this.scenicList.forEach(item2 => {
item2.productList.forEach(item3 => {
if (item.id == item3.id) {
item3.ifChecked = false
item3.ifChangeBg = false
}
})
})
delete this.chooseProduct[index]
}
})
this.chooseProduct = this.chooseProduct.filter(function (val) {
return val
})
this.showModal = false
},
//---不支持多选产品,选择取消事件
chooseCancel() {
//删除选中产品
this.chooseProduct.forEach((item, index) => {
if (item.id === this.chooseMerchantProduct.id) {
//取消选中状态和选中背景颜色
this.scenicList.forEach(item2 => {
item2.productList.forEach(item3 => {
if (item.id == item3.id) {
item3.ifChecked = false
item3.ifChangeBg = false
}
})
})
this.chooseProduct.splice(index, 1)
}
})
this.showModal = false
},
//---跳转填写订单页面
goFillorder() {
for (let i = 0; i < this.chooseProduct.length; i++) {
let item = this.chooseProduct[i]
if (item.status == 2) {
uni.showToast({
title: '售罄产品不能进行购买',
icon: 'none'
})
return
}
}
if (this.chooseProduct.length == 0) {
uni.showToast({
title: '请选择至少一个产品',
icon: 'none'
})
return
} else if (this.chooseProduct.length == 1) {
let query = '?merchantId=' + this.chooseProduct[0].merchantId + '&productId=' + this.chooseProduct[0].id + '&orderSource=3'
if (this.chooseProduct[0].ticketType == 2) {
//联票
uni.navigateTo({
url: '/pages/scenic/scenicJointOrder/scenicJointOrder' + query
})
} else {
//普通票
uni.navigateTo({
url: '/pages/scenic/scenicSingleOrder/scenicSingleOrder'+ query
})
}
} else {
let productIdList = this.chooseProduct.map(item => {
return item.id
})
let query ='?productIdList=' + JSON.stringify(productIdList) + '&groupId=' + this.groupId + '&groupChannelId=' + this.groupChannelId + '&orderSource=3'
// uni.navigateTo({
// url: '/pages/combination/combiOrder/combiOrder' + query
// })
// //如果有联票
if(this.chooseProduct.find(item=>item.ticketType==2)){
uni.navigateTo({
url: '/pages/combination/combiOrder/combiOrder' + query
})
}else{
uni.navigateTo({
url: '/pages/scenic/scenicCombiOrder/scenicCombiOrder' + query
})
}
}
},
onShareAppMessage(options) {
let url='pages/combination/distributionCombiChoose/distributionCombiChoose'
return {
title: '组合购买更优惠',
path: `${url}?channelId=${this.channelId}&merchantId=${this.merchantId}&groupId=${this.groupId}&groupChannelId=${this.groupChannelId}&companyId=${this.companyId}`
}
}
}
}
</script>
<style lang="scss" scoped>
.wrap {
height: 100%;
background: #f7f7f7;
}
.middle {
padding-bottom: 100rpx;
position: relative;
top: -20px;
}
// 中间上部分
.middle-top{
width: 100%;
background: #ffffff;
border-radius: 24rpx 24rpx 0 0;
padding:10px;
z-index: 1;
overflow: hidden;
}
.merchant-name{
font-size: 18px;
font-weight: 600;
}
.merchant-info-bottom{
margin-top: 12rpx;
display: flex;
overflow: hidden;
}
.merchant-bottom-left{
width: 220rpx;
height: 110rpx;
margin-right: 20rpx;
padding:18rpx 20rpx;
background: #F7F8FA;
border-radius: 12rpx;
font-weight: 600;
view:first-child{
font-size: 26rpx;
}
view:last-child{
font-size: 24rpx;
margin-top: 6rpx;
}
}
.merchant-bottom-right{
flex: 1;
display: flex;
padding: 0 20rpx;
align-items: center;
background: url('@/static/img/combination/mapbg.png') no-repeat;
background-size: 100% 100%;
}
.merchant-address{
flex: 1;
font-size: 26rpx;
font-weight: 600;
}
.merchant-nav{
margin: 0 36rpx;
font-size: 20rpx;
text-align: center;
}
.merchant-phone{
font-size: 20rpx;
text-align: center;
}
.merchant-bg{
width: 52rpx;
height: 52rpx;
background: #ffffff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
//中间下部分
.middle-bottom{
display: flex;
}
.scroll-left{
width: 130rpx;
flex-shrink: 0;
margin: 24rpx 24rpx 0 0;
}
.middle-left{
font-size: 24rpx;
background: #ffffff;
border-radius: 0 20rpx 20rpx 0;
text-align: center;
min-height: 100%;
}
.merchant-tab{
padding: 32rpx 16rpx;
}
.merchant-tab.on{
background: linear-gradient( 124deg, #FF9F00 0%, #FE6600 100%);
border-radius: 0px 20rpx 20rpx 0px;
color: #ffffff;
}
.middle-right{
flex: 1;
}
.merchantlist-wrap{
background: #f7f7f7;
padding-top: 24rpx;
}
.merchantlist {
border-radius: 20rpx;
background: #ffffff;
margin-top: 12px;
padding: 24rpx 0 0 24rpx;
}
.middle-right view.merchantlist:first-child{
margin-top: 0;
}
.merchantlist label{
width: 100%;
}
.merchantlist label.off .product {
color: #999999;
}
.merchantlist label.off .product-name {
color: #999999;
}
.merchantlist-title {
display: flex;
justify-content: space-between;
align-items: center;
padding:0 24rpx 16rpx 0;
}
.merchantlist-name {
flex: 1;
font-size: 36rpx;
margin-right: 10rpx;
font-weight: bold;
image {
width: 36rpx;
height: 36rpx;
position: relative;
top: 6rpx;
margin: 0 8rpx;
}
}
.merchantlist-coupon {
color: $red;
font-size: 24rpx;
}
.merchantlist-detail {
color: $grey;
font-size: 24rpx;
display: flex;
}
.product {
padding:24rpx 24rpx 24rpx 0;
background: #ffffff;
border-radius: 8rpx;
display: flex;
border-bottom: 1px solid #f5f5f5;
}
.product.on {
background: #e2eeff;
}
.product-left {
margin-right: 10rpx;
}
.product-right {
flex: 1;
}
.product-name {
font-size: 32rpx;
font-weight: bold;
color: #191919;
display: flex;
align-items: center;
justify-content: space-between;
}
.product-status {
flex-shrink: 0;
padding: 6rpx 12rpx;
border: 2px solid #f40000;
color: #f40000;
font-size: 24rpx;
border-radius: 4rpx;
transform: rotate(-25deg);
position: relative;
top: 30rpx;
right: 60rpx;
}
.product-rule{
font-size: 24rpx;
color: #999999;
margin-top: 12rpx;
}
.product-rule text:not(:last-child) ::after {
display: inline-block;
content: '';
height: 22rpx;
margin: 0 14rpx;
background: #ccc;
width: 1px;
position: relative;
top: 2rpx;
}
.product-price{
display: flex;
margin-top: 6rpx;
align-items: center;
justify-content: space-between;
font-size: 24rpx;
color: #999999;
}
.product-sell {
font-size: 40rpx;
color: $red;
font-weight: bold;
margin-left: 10rpx;
}
.product-more {
padding-top:24rpx;
font-size: 20rpx;
}
.product-more>view{
display: flex;
justify-content: center;
}
.no-more{
height: 600rpx;
margin-top:100rpx;
text-align: center;
font-size:24rpx;
color: #666;
}
.bottom {
position: fixed;
bottom: 0;
width: 100%;
height: 100rpx;
background: #fff;
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.16);
z-index: 10;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 32rpx;
}
.bottom-left{
display: flex;
flex-direction: column;
align-items: center;
font-size: 24rpx;
}
.bottom-right{
display: flex;
align-items: center;
}
.bottom-choose {
position: relative;
padding: 0 40rpx;
}
.bottom-more {
position: relative;
top: -40rpx;
background: #f40000;
border-radius: 28px;
opacity: 0.64;
padding: 10rpx 20rpx;
color: #ffffff;
}
.bottom-triangle{
width: 14rpx;
height: 14rpx;
display: inline-block;
background: #f40000;
opacity: 0.64;
position: absolute;
right: 52rpx;
bottom: -7rpx;
transform: rotate(45deg);
}
.bottom-detail {
position: relative;
text-align: center;
display: flex;
justify-content: center;
}
.bottom-number {
display: inline-block;
width: 36rpx;
height: 36rpx;
border-radius: 50%;
text-align: center;
background: #f40000;
color: #ffffff;
font-weight: bold;
margin:0 10rpx;
}
.bottom-btn {
display: inline-block;
width: 200rpx;
height: 80rpx;
background: linear-gradient( 119deg, #FFA000 0%, #FE6600 100%);
border-radius: 40rpx;
font-size: 32rpx;
font-weight: bold;
text-align: center;
line-height: 80rpx;
color: #ffffff;
}
.suodaoImg{
position: fixed;
z-index: 9999;
width: 100%;
height: 100%;
left: 0;
top: 0;
}
</style>
<!-- 修改这个页面时,需要同步更新combiChoose页面的代码 --> <!-- 修改这个页面时,需要同步更新combiChoose页面的代码 -->
<template> <template>
<view class="wrap"> <view class="wrap">
<scroll-view @scroll="scroll" style="height: 100%;" scroll-y> <scroll-view @scroll="scrollFull" style="height: 100%;" :scroll-into-view="toViewFull" scroll-y enhanced :bounces="false">
<view class="banner"> <view class="banner" id='banner'>
<u-swiper :list="imgList" @change="e => currentNum = e.current" indicatorStyle="right: 20px;bottom:25px" height="400" circular> <u-swiper :list="imgList" @change="e => currentNum = e.current" indicatorStyle="right: 20px;bottom:25px" height="400" circular>
<view slot="indicator" class="indicator-num"> <view slot="indicator" class="indicator-num">
<text class="indicator-num__text">{{ currentNum + 1 }}/{{ imgList.length }}</text> <text class="indicator-num__text">{{ currentNum + 1 }}/{{ imgList.length }}</text>
</view> </view>
</u-swiper> </u-swiper>
</view> </view>
<view class="middle"> <view class="middle" :style="middleStyle">
<!-- <view class="tabbar" :style="tabbarObj"> <!-- 中间上面部分 -->
<text v-for="(item, index) in tabbar" :key="index" @click="tabbarChange(index)" :class="{ on: active == index }"> <view class="middle-top">
{{ item }} <view class="merchant-name">
</text> {{currentMerchant.name||''}}
</view> --> </view>
<swiper :current="active" @animationfinish="animationfinish" class="swiper-box" :style="{ height: swiperHeight + 'px' }"> <u-transition :show="showTransition" :duration='600'>
<swiper-item class="swiper-item"> <view class="merchant-info-bottom">
<checkbox-group @change="checkboxChange" class="checkbox-box"> <view class="merchant-bottom-left">
<view class="merchant" v-for="(item, index) in scenicList" :key="index"> <view>
<view class="merchant-title" @click="clikDetail(item.id)"> <text style="color: #00B42B;">营业时间</text>
<view class="title-left"> </view>
<text>{{ item.name }}</text> <view>
<template v-if="item.couponVoList && item.couponVoList.length > 0"> {{currentMerchant.businessStart?currentMerchant.businessStart.substr(0,5):''}}-
<image src="@/static/img/scenic/coupon.png"></image> {{currentMerchant.businessEnd?currentMerchant.businessEnd.substr(0,5):''}}
<text class="title-coupon"> 劵惠 </text> </view>
</template> </view>
<view class="merchant-bottom-right">
<view class="merchant-address">
{{currentMerchant.address||''}}
</view>
<view class="merchant-nav" @click="navigation(currentMerchant)">
<view class="merchant-bg">
<image src="@/static/img/combination/nav.png" style="width: 28rpx;height: 28rpx;"></image>
</view> </view>
<view>导航</view>
<view v-if="showDistance" class="title-right"> </view>
距您{{ item.distance ? parseFloat((item.distance / 1000).toFixed(2)) : 0 }}km <view class="merchant-phone" @click="makePhone(currentMerchant.phone)">
<u-icon name="arrow-right" style="margin-left: 4rpx;" size='26' color='#B4B4B4'></u-icon> <view class="merchant-bg">
<image src="@/static/img/combination/phone.png" style="width: 28rpx;height: 28rpx;"></image>
</view> </view>
<view>电话</view>
</view> </view>
</view>
<label v-for="(items, a) in item.productListCopy" :key="a" :class="{ off: items.status == 2 }"> </view>
<view class="product" :class="{ on: items.ifChangeBg }"> </u-transition>
<view class="product-left"> </view>
<checkbox
style="transform: scale(0.8)" <!-- 列表部分 -->
class="blue" <view class="middle-bottom" id="middle-bottom">
:disabled="items.status == 2" <!-- 左边滚动条 -->
:value="JSON.stringify(items)" <scroll-view class="scroll-left" :style="{height:scrollHeight+'px'}" :scroll-into-view="toViewLeft" scroll-y>
:checked="items.ifChecked" <view class="middle-left">
/> <view :id="'merchant-tab'+index" class="merchant-tab" v-for="(item,index) in scenicList" :key="index" @click="merchantTabChange(index)" :class='{on:merchantIndex==index}'>
</view> {{item.name}}
</view>
<view class="product-right"> </view>
<view class="product-name"> </scroll-view>
<text>{{ items.name }}</text> <!-- 右边滚动条 -->
<text class="product-status" v-if="items.status == 2">{{ items.statusName }}</text> <!-- enhanced和bounces是处理ios系统橡皮筋回弹bug -->
<scroll-view class="scroll-right" @scroll="scrollRight" :style="{height:middleHeight+'px'}" :scroll-into-view="toViewRight" scroll-y enhanced :bounces="false">
<view class="middle-right">
<checkbox-group @change="checkboxChange" class="checkbox-box">
<view class="merchantlist-wrap" :id="'merchant'+index" v-for="(item, index) in scenicList" :key="index">
<view class="merchantlist">
<view class="merchantlist-title" @click="clikDetail(item.id)">
<view class="merchantlist-name">
<text>{{ item.name }}</text>
<template v-if="item.couponVoList && item.couponVoList.length > 0">
<image src="@/static/img/scenic/coupon.png"></image>
<text class="merchantlist-coupon"> 劵惠 </text>
</template>
</view> </view>
<view class="product-price"> <view v-if="showDistance" class="merchantlist-detail">
<view style="font-size: 24rpx;display: flex;"> 距您{{ item.distance ? parseFloat((item.distance / 1000).toFixed(2)) : 0 }}km
<text class="product-rule" v-if="items.productRefundRuleVo"> <u-icon name="arrow-right" style="margin-left: 4rpx;" size='26' color='#B4B4B4'></u-icon>
<!-- 索道写死 --> </view>
<!-- <text v-if="item.id=='z0015605022691a5945bbe463141668c'"> </view>
有条件退
</text> <label v-for="(items, a) in item.productListCopy" :key="a" :class="{ off: items.status == 2 }">
<template v-else> <view class="product" :class="{ on: items.ifChangeBg }">
<view class="product-left">
<checkbox
style="transform: scale(0.8)"
class="blue"
:disabled="items.status == 2"
:value="JSON.stringify(items)"
:checked="items.ifChecked"
/>
</view>
<view class="product-right">
<view class="product-name">
<text>{{ items.name }}</text>
<text class="product-status" v-if="items.status == 2">{{ items.statusName }}</text>
</view>
<view class="product-rule">
<!-- <text>随买随用</text> -->
<template v-if="items.productRefundRuleVo">
<text v-if="items.productRefundRuleVo.refundType == 0">不可退</text> <text v-if="items.productRefundRuleVo.refundType == 0">不可退</text>
<text v-if="items.productRefundRuleVo.refundType == 1">有条件退</text> <text v-if="items.productRefundRuleVo.refundType == 1">有条件退</text>
<text v-if="items.productRefundRuleVo.refundType == 2">随时可退</text> <text v-if="items.productRefundRuleVo.refundType == 2">随时可退</text>
</template> --> </template>
<text v-if="items.productRefundRuleVo.refundType == 0">不可退</text> <text> 无需取票 </text>
<text v-if="items.productRefundRuleVo.refundType == 1">有条件退</text> </view>
<text v-if="items.productRefundRuleVo.refundType == 2">随时可退</text> <view class="product-price">
</text> <view style="display: flex;">
<text class="product-rule"> 无需取票 </text> <text @click.stop="showBuyKnow(items)">购买须知</text>
<text @click.stop="showBuyKnow(items)">购买须知</text> <u-icon name="arrow-right" size='26' color='#B4B4B4'></u-icon>
<u-icon name="arrow-right" size='26' color='#B4B4B4'></u-icon> </view>
</view> <view class="product-sell">
<view> <text style="font-size: 28rpx">¥</text>{{ items.sellingPrice }}
<text class="product-orange"> ¥{{ items.originalPrice }} </text> </view>
<text class="product-sell"> <text style="font-size: 28rpx">¥</text>{{ items.sellingPrice }} </text> </view>
</view> </view>
</view> </view>
</view> </label>
</view> </view>
</label> <!-- <view class="product-more" v-if="index > 0 && item.productList.length > 2">
<view v-if="item.productListCopy.length != item.productList.length" @click="showMoreProduct(item)">
<view class="product-more" v-if="index > 0 && item.productList.length > 2"> 更多
<view v-if="item.productListCopy.length != item.productList.length" @click="showMoreProduct(item)"> <u-icon name="arrow-down" size='24' color='#B4B4B4'></u-icon>
更多
<u-icon name="arrow-down" size='24' color='#B4B4B4'></u-icon>
</view>
<view v-else @click="retractProduct(item)">
收起
<u-icon name="arrow-up" size='24' color='#B4B4B4'></u-icon>
</view>
</view>
</view>
</checkbox-group>
<!-- <u-empty text="空空如也..." mode="list" v-if="scenicList.length == 0" width="320" height="320"></u-empty> -->
</swiper-item>
<!-- <swiper-item class="swiper-item">
<u-waterfall v-model="albumList" class="waterfall" style="padding-top: 8rpx;">
<template v-slot:left="{leftList}">
<view v-for="(item, index) in leftList" :key="index" class="album-left" @click="goAlbum(index)">
<view class="album-list-top">
<image :src="item.image" mode="widthFix"></image>
</view>
<view class="album-list-bottom" :style="{'background': item.color}">
<view>{{item.title}}</view>
<view>快来定制吧</view>
<view>
<view class="album-btn">
点击定制
<u-icon name="arrow-right" style="margin-left: 4rpx;"></u-icon>
</view>
<text class="count">{{item.count}}</text>
</view> </view>
</view>
</view> <view v-else @click="retractProduct(item)">
</template> 收起
<template v-slot:right="{rightList}"> <u-icon name="arrow-up" size='24' color='#B4B4B4'></u-icon>
<view v-for="(item, index) in rightList" :key="index" class="album-right" @click="goAlbum(index)">
<view class="album-list-top">
<image :src="item.image" mode="widthFix"></image>
</view>
<view class="album-list-bottom" :style="{'background': item.color}">
<view>{{item.title}}</view>
<view>快来定制吧</view>
<view>
<view class="album-btn">
点击定制
<u-icon name="arrow-right" style="margin-left: 4rpx;"></u-icon>
</view>
<text class="count">{{item.count}}</text>
</view> </view>
</view> </view> -->
</view> </view>
</template> </checkbox-group>
</u-waterfall> <view class="no-more">
</swiper-item> 已经到底啦
</view>
<swiper-item class="swiper-item"> <!-- <u-empty text="暂无数据..." mode="list" v-if="scenicList.length == 0" iconSize="160" textSize='24' textColor='#3688FF'></u-empty> -->
<u-empty text="空空如也..." mode="list" width="320" height="320"></u-empty> </view>
</swiper-item> </scroll-view>
<swiper-item class="swiper-item"> </view>
<u-empty text="空空如也..." mode="list" width="320" height="320"></u-empty>
</swiper-item> -->
</swiper>
<u-empty text="暂无数据..." mode="list" v-if="scenicList.length == 0" iconSize="160" textSize='24' textColor='#3688FF'></u-empty>
</view> </view>
<view class="bottom"> <view class="bottom" :style="bottomStyle">
<view class="bottom-left" @click="showCustomer()"> <view class="bottom-left" @click="showCustomer()">
<u-icon name="chat" size="36"></u-icon> <u-icon name="chat" size="42"></u-icon>
客服 客服
</view> </view>
<view class="bottom-middle"> <view class="bottom-right">
<view class="bottom-more" v-show="chooseProduct.length > 0"> <view class="bottom-choose">
组合购更优惠 <view class="bottom-more" v-show="chooseProduct.length > 0">
<text class="bottom-three"></text> 组合购更便捷
<text class="bottom-triangle"></text>
</view>
<view class="bottom-detail" @click="showDetail()" :style="{ top: chooseProduct.length > 0 ? '-28rpx' : '0' }">
<text style="margin-right: 10rpx;">已选产品 </text>
<text class="bottom-number">
{{ chooseProduct.length }}
</text>
<u-icon name="arrow-up" size="32"></u-icon>
</view>
</view> </view>
<view class="bottom-btn" @click="goFillorder()">
<view class="bottom-detail" @click="showDetail()" :style="{ top: chooseProduct.length > 0 ? '-28rpx' : '0' }"> 去预定
<text style="margin-right: 10rpx;"> 明细 </text>
<u-icon name="arrow-up" size="32"></u-icon>
<text class="bottom-number">
{{ chooseProduct.length }}
</text>
</view> </view>
</view> </view>
<view class="bottom-right">
<text class="btn" @click="goFillorder()">去预定</text>
</view>
</view> </view>
<!-- 客服组件 -->
<customer :scenicList="scenicList" ref="customer"></customer>
<!-- 购买须知 -->
<buyKnow :buyKnowData="buyKnowData" ref="buyKnow"></buyKnow>
<!-- 产品明细 -->
<detail :chooseProduct="chooseProduct" ref="detail"></detail>
<!-- 商户详情 -->
<merchantDetail :detailData='detailData' ref='merchantDetail'></merchantDetail>
<!-- 模态框 -->
<u-modal :show="showModal" @confirm="chooseConfirm" @cancel="chooseCancel" title="提示" content="是否更改产品" show-cancel-button="true">
</u-modal>
</scroll-view> </scroll-view>
<!-- 客服组件 -->
<customer :scenicList="scenicList" ref="customer"></customer>
<!-- 购买须知 -->
<buyKnow :buyKnowData="buyKnowData" ref="buyKnow"></buyKnow>
<!-- 产品明细 -->
<detail :chooseProduct="chooseProduct" ref="detail"></detail>
<!-- 商户详情 -->
<merchantDetail :detailData='detailData' ref='merchantDetail'></merchantDetail>
<!-- 模态框 -->
<u-modal :show="showModal" @confirm="chooseConfirm" @cancel="chooseCancel" title="提示" content="是否更改产品" show-cancel-button="true">
</u-modal>
<image class="suodaoImg" v-if="showSuodaoImg" src="https://lx.pangdly.com/img/cjsdFirst.50a2e63.jpg"></image> <image class="suodaoImg" v-if="showSuodaoImg" src="https://lx.pangdly.com/img/cjsdFirst.50a2e63.jpg"></image>
<!-- 系统无法访问时弹窗 --> <!-- 系统无法访问时弹窗 -->
<u-popup :show="showTip" :round="20"> <u-popup :show="showTip" :round="20">
...@@ -196,6 +189,14 @@ ...@@ -196,6 +189,14 @@
</view> </view>
</view> </view>
</u-popup> </u-popup>
<!-- 自定义导航栏 -->
<view class="tabbar" :style="{height:topHeight+'px',opacity:tabbarOpacity}" >
<view class="tabbar-title">
<u-icon @click="goTop()" name="arrow-left" color="#333333" size="48"></u-icon>
<text>选择产品</text>
<text></text>
</view>
</view>
</view> </view>
</template> </template>
...@@ -215,6 +216,7 @@ export default { ...@@ -215,6 +216,7 @@ export default {
}, },
data() { data() {
return { return {
currentMerchant:'',//当前入口商家信息
showTip:false,//系统调不通或者崩了跳出弹窗 showTip:false,//系统调不通或者崩了跳出弹窗
detailData:'',//详情数据 detailData:'',//详情数据
showSuodaoImg:false,//索道耳麦图片是否显示隐藏 showSuodaoImg:false,//索道耳麦图片是否显示隐藏
...@@ -223,9 +225,6 @@ export default { ...@@ -223,9 +225,6 @@ export default {
groupId: '', //组合Id groupId: '', //组合Id
groupChannelId: '', //组合渠道Id groupChannelId: '', //组合渠道Id
channelId:'',//渠道Id channelId:'',//渠道Id
// tabbar:['热门景点','一日游','摄影/旅拍','文创DIY'],//tabbar标题列表
tabbar: ['热门景点', '摄影/旅拍', '一日游'], //tabbar标题列表
active: 0, //导航栏下标
currentNum:0,//轮播图下标 currentNum:0,//轮播图下标
imgList: [], //图片列表 imgList: [], //图片列表
scenicList:[], //景区数据 scenicList:[], //景区数据
...@@ -234,45 +233,20 @@ export default { ...@@ -234,45 +233,20 @@ export default {
chooseProduct: [], //选中的产品 chooseProduct: [], //选中的产品
showModal: false, //是否显示模态框 showModal: false, //是否显示模态框
chooseMerchantProduct: '', //不支持多产品购买时,选中的景区产品 chooseMerchantProduct: '', //不支持多产品购买时,选中的景区产品
swiperHeight: 0 ,//swiper高度 merchantIndex:0,//选中的商家下标
tabbarObj:'', middleHeight:0,//中间列表盒子高度
albumList: [{ heightArr:[],//元素高度数组
title: '精彩瞬间', toViewRight:'',//右边滚动到某个元素
count: '10W+', toViewLeft:'',//左边滚动到某个元素
image: '../static/scenic/wonderfulMoment.png', toViewFull:'',//全屏滚动到某个元素
color: '#037EFF' showTransition:true,//控制动画显示隐藏
}, scrollHeight:0,//中间盒子滚动时的高度
{ originHeight:0,//中间盒子原本高度
title: '网红旅拍', middleTopHeight:0,//中间盒子上部分高度
count: '8W+', topHeight:0,//上面状态栏+上面导航栏总高度
image: '../static/scenic/travalphoto.png', tabbarOpacity:0,//导航栏透明度
color: '#826847' bottomStyle:'',//处理苹果手机的横线,单独增加一个样式
}, middleStyle:'',//中间盒子样式,单独增加一个样式
{
title: '抱枕DIY',
count: '4W+',
image: '../static/scenic/pillow.png',
color: '#1175B4'
},
{
title: '明信片',
count: '4W+',
image: '../static/scenic/postcard.png',
color: '#3478DC'
},
{
title: '旅游台历定制',
count: '4W+',
image: '../static/scenic/deskCalender.png',
color: '#1A9B45'
},
{
title: '定制相册',
count: '4W+',
image: '../static/scenic/customPic.png',
color: '#D48D46'
}
],
} }
}, },
watch: { watch: {
...@@ -332,21 +306,30 @@ export default { ...@@ -332,21 +306,30 @@ export default {
} }
}, },
onLoad(option) { onLoad(option) {
//如果是索道
if(this.merchantId=='z0015605022691a5945bbe463141668c'){
this.showSuodaoImg=true
setTimeout(() => {
this.showSuodaoImg = false
}, 2500)
}
//获取公司Id,保存到本地,支付等逻辑需要入口companyId //获取公司Id,保存到本地,支付等逻辑需要入口companyId
this.companyId=this.$commonjs.getCompanyId(option)||'' this.companyId=this.$commonjs.getCompanyId(option)||''
this.merchantId = this.$commonjs.getKey(option,'merchantId')|| '' this.merchantId = this.$commonjs.getKey(option,'merchantId')|| ''
this.channelId=this.$commonjs.getKey(option,'channelId')||'' this.channelId=this.$commonjs.getKey(option,'channelId')||''
this.groupId=this.$commonjs.getKey(option,'groupId')||'' this.groupId=this.$commonjs.getKey(option,'groupId')||''
this.groupChannelId=this.$commonjs.getKey(option,'groupChannelId')||'' this.groupChannelId=this.$commonjs.getKey(option,'groupChannelId')||''
let statusBarHeight = uni.getSystemInfoSync().statusBarHeight // 状态栏高度
let capsule = uni.getMenuButtonBoundingClientRect() // 胶囊大小、位置数据
this.topHeight =statusBarHeight+(capsule.top - statusBarHeight) * 2 + capsule.height//整个上部分总高度
//处理苹果手机下面有根横线,影响选中产品明细的操作
let platform = uni.getSystemInfoSync().platform
if(platform=='ios'){
this.bottomStyle='height:140rpx;padding-bottom:10rpx;'
this.middleStyle='padding-bottom:140rpx;'
}
}, },
onShow() { onShow() {
//如果是索道
if(this.merchantId=='z0015605022691a5945bbe463141668c'){
this.showSuodaoImg=true
setTimeout(() => {
this.showSuodaoImg = false
}, 2500)
}
//清空之前选中的数据以及状态 //清空之前选中的数据以及状态
this.detailData='' this.detailData=''
this.chooseProduct=[] this.chooseProduct=[]
...@@ -362,7 +345,6 @@ export default { ...@@ -362,7 +345,6 @@ export default {
let token = uni.getStorageSync('token') let token = uni.getStorageSync('token')
if (token) { if (token) {
uni.getLocation({ uni.getLocation({
type: 'wgs84',
success: res => { success: res => {
let latitude = res.latitude //纬度 let latitude = res.latitude //纬度
let longitude = res.longitude //经度 let longitude = res.longitude //经度
...@@ -429,8 +411,11 @@ export default { ...@@ -429,8 +411,11 @@ export default {
this.scenicList.splice(index, 1) this.scenicList.splice(index, 1)
this.scenicList.unshift(item) this.scenicList.unshift(item)
item.productListCopy = item.productList item.productListCopy = item.productList
//获取当前商家信息
this.currentMerchant=item
} else { } else {
item.productListCopy = item.productList.slice(0, 2) // item.productListCopy = item.productList.slice(0, 2)不要更多,暂时注释
item.productListCopy = item.productList
} }
//预订时间为当天时,当前时间大于最早预订时间显示未开售,当前时间大于最晚预订时间显示已售罄 //预订时间为当天时,当前时间大于最早预订时间显示未开售,当前时间大于最晚预订时间显示已售罄
let times = new Date().Format('hh:mm:ss') let times = new Date().Format('hh:mm:ss')
...@@ -454,9 +439,97 @@ export default { ...@@ -454,9 +439,97 @@ export default {
} }
}) })
}) })
this.$nextTick(() => { this.$nextTick(() => {
this.countSwiper() //清空数组
}) this.heightArr=[]
//获取中间盒子需要滚动时的高度
// #ifdef MP-WEIXIN
uni.createSelectorQuery().in(this).select('.middle-top').boundingClientRect(data => {
if(data){
this.middleTopHeight=data.height
}
}).exec()
// #endif
// #ifdef MP-ALIPAY
uni.createSelectorQuery().select('.middle-top').boundingClientRect(data => {
if(data){
this.middleTopHeight=data.height
}
}).exec()
// #endif
//获取中间盒子原本高度
// #ifdef MP-WEIXIN
uni.createSelectorQuery().in(this).select('.middle-right').boundingClientRect(data => {
//获取中间盒子原本高度,默认中间盒子等于原本高度,滚动之后等于滚动高度
if(data){
this.originHeight=data.height
this.middleHeight=data.height
}
}).exec()
// #endif
// #ifdef MP-ALIPAY
uni.createSelectorQuery().select('.middle-right').boundingClientRect(data => {
//获取中间盒子原本高度,默认中间盒子等于原本高度,滚动之后等于滚动高度
if(data){
this.originHeight=data.height
this.middleHeight=data.height
}
}).exec()
// #endif
//不要这样 var query = uni.createSelectorQuery() query.in(this)放入循环里面会多次循环
for(let i=0;i<this.scenicList.length;i++){
// #ifdef MP-WEIXIN
uni.createSelectorQuery().in(this).select(`#merchant${i}`).boundingClientRect(data => {
//获取商家列表各个元素的高度,并且把他们前后相加添加到一个数组里面
if(data){
if(i==0){
//取整,由于高度多数为小数,防止点击左边,滚动右边时出现bug
this.heightArr.push(parseInt(data.height))
}else{
this.heightArr.push(parseInt(data.height)+this.heightArr[i-1])
}
}
}).exec()
// #endif
// #ifdef MP-ALIPAY
uni.createSelectorQuery().select(`#merchant${i}`).boundingClientRect(data => {
//获取商家列表各个元素的高度,并且把他们前后相加添加到一个数组里面
if(data){
if(i==0){
//取整,由于高度多数为小数,防止点击左边,滚动右边时出现bug
this.heightArr.push(parseInt(data.height))
}else{
this.heightArr.push(parseInt(data.height)+this.heightArr[i-1])
}
}
}).exec()
// #endif
}
uni.getSystemInfo({
complete:(info)=> {
let windowHeight=info.windowHeight||844
// #ifdef MP-WEIXIN
uni.createSelectorQuery().in(this).select('.bottom').boundingClientRect(data => {
if(data){
this.scrollHeight=windowHeight-data.height-this.topHeight
}
}).exec()
// #endif
// #ifdef MP-ALIPAY
uni.createSelectorQuery().select('.bottom').boundingClientRect(data => {
if(data){
this.scrollHeight=windowHeight-data.height-this.topHeight
}
}).exec()
// #endif
}
})
})
} else { } else {
uni.showToast({ uni.showToast({
title: res.message, title: res.message,
...@@ -513,33 +586,110 @@ export default { ...@@ -513,33 +586,110 @@ export default {
} }
}) })
}, },
//---商家下标切换
merchantTabChange(index){
//点击左边,全屏先置顶
//为了让scrollview能检测到滚动数据的变化
this.toViewFull='aaa'
// 数据更新后,视图的更新是异步的,防止点击无效
this.$nextTick(()=>{
this.toViewFull='middle-bottom'
})
//点击左边,右边可滚动
this.merchantIndex=index
this.middleHeight=this.scrollHeight
//为了让scrollview能检测到滚动数据的变化
this.toViewRight='aaa'
// 数据更新后,视图的更新是异步的,防止第一次点击无效
this.$nextTick(()=>{
this.toViewRight='merchant'+index
})
},
//---展示明细弹窗 //---展示明细弹窗
showDetail() { showDetail() {
this.$refs.detail.showPop = true this.$refs.detail.showPop = true
}, },
//---页面滚动事件 //---全屏滚动
scroll(e) { scrollFull(e){
if(e.detail.scrollTop>200){ setTimeout(()=>{
//固定导航栏 let height=0
this.tabbarObj='top:0;position:fixed;border-radius:0' let scrollTop=e.detail.scrollTop
}else{ let selectFun=(data)=>{
this.tabbarObj='top:-40rpx;position:relative;border-radius:16rpx;' if(data){
} //20为中间盒子的top-20
height=data.height+this.middleTopHeight-20-this.topHeight
let opacity=scrollTop/(data.height)
this.tabbarOpacity=parseFloat(opacity.toFixed(2))
if(scrollTop>=height){
//中间上部分固定,中间下部分可滚动,全屏不滚动
this.middleHeight=this.scrollHeight
}else{
//中间上部分不固定,中间下部分不可滚动,全屏滚动'
this.middleHeight=this.originHeight
}
}
}
// #ifdef MP-WEIXIN
uni.createSelectorQuery().in(this).select('.banner').boundingClientRect(data => {
selectFun(data)
}).exec()
// #endif
// #ifdef MP-ALIPAY
uni.createSelectorQuery().select('.banner').boundingClientRect(data => {
selectFun(data)
}).exec()
// #endif
},5)
}, },
//---导航栏切换 //---右边滚动事件
tabbarChange(index) { scrollRight(e) {
this.active = index setTimeout(()=>{
if(index==0){ let scrollTop=e.detail.scrollTop
this.countSwiper() //通过滚动值获取下标
} this.heightArr.forEach((item,i)=>{
if(index==1){ if(i==0){
this.countSwiper('waterfall') if(0<=scrollTop&&scrollTop<item){
} this.merchantIndex=i
this.toViewLeft='merchant-tab'+i
}
}else{
if(this.heightArr[i-1]<=scrollTop&&scrollTop<item){
this.merchantIndex=i
this.toViewLeft='merchant-tab'+i
}
}
})
},5)
},
//---回到顶部
goTop(){
this.middleHeight=this.originHeight
//为了让scrollview能检测到滚动数据的变化
this.toViewFull='aaa'
this.$nextTick(()=>{
this.toViewFull='banner'
})
},
//---导航
navigation(merchant){
uni.openLocation({
latitude:merchant.latitude,
longitude:merchant.longitude,
name:merchant.name,
address:merchant.address,
success: function () {
}
})
}, },
//---swiper滑动结束,分别设置tabs和swiper的状态 //---拨打电话
animationfinish(e) { makePhone(phoneNumber) {
let current = e.detail.current uni.makePhoneCall({
this.active = current phoneNumber
})
}, },
//---展示客服组件 //---展示客服组件
showCustomer() { showCustomer() {
...@@ -555,30 +705,16 @@ export default { ...@@ -555,30 +705,16 @@ export default {
this.$refs.merchantDetail.showPop=true this.$refs.merchantDetail.showPop=true
this.initDetail(merchantId) this.initDetail(merchantId)
}, },
//计算swiper高度
countSwiper(label){
let labels=label||'checkbox-box'
this.$nextTick(() => {
const query = uni.createSelectorQuery().in(this)
query.select(`.${labels}`).boundingClientRect(data => {
if(data){
this.swiperHeight=data.height+20
}
}).exec()
})
},
//---展示更多产品 //---展示更多产品
showMoreProduct(item) { showMoreProduct(item) {
item.productListCopy = item.productList item.productListCopy = item.productList
this.$forceUpdate() this.$forceUpdate()
this.countSwiper()
}, },
//---收起产品 //---收起产品
retractProduct(item) { retractProduct(item) {
item.productListCopy = item.productList.slice(0, 2) item.productListCopy = item.productList.slice(0, 2)
this.$forceUpdate() this.$forceUpdate()
this.countSwiper()
}, },
//---多选框变化 //---多选框变化
checkboxChange(e) { checkboxChange(e) {
...@@ -699,35 +835,13 @@ export default { ...@@ -699,35 +835,13 @@ export default {
} }
} }
}, },
//---跳转影集页面 onShareAppMessage(options) {
goAlbum(index){ let url='pages/combination/distributionCombiChoose/distributionCombiChoose'
if(index==0){ return {
let data={ title: '组合购更便捷',
openid: uni.getStorageSync('openid')||'' path: `${url}?channelId=${this.channelId}&merchantId=${this.merchantId}&groupId=${this.groupId}&groupChannelId=${this.groupChannelId}&companyId=${this.companyId}`
} }
this.$request('wechatUser/pdFace/checkScanFace',data).then(res => { }
if (res.code === '00') {
let merchantId = this.merchantId || 'z0015605022691a5945bbe463141668c' // 默认长江索道
if (res.data.isScanFace == 0) { //未扫脸
uni.navigateTo({
url:`/pages/album/getPortrait?merchantId=${merchantId}`
})
} else if (res.data.isScanFace == 1) { //已扫脸
let faceIds = JSON.stringify(res.data.faceIds)
let companyId = this.companyId
uni.navigateTo({
url: `/pages/album/myPhotoAlbum/myPhotoAlbum?faceIds=${faceIds}&companyId=${companyId}&merchantId${merchantId}`
})
}
} else {
uni.showToast({
title: res.message,
icon: 'none'
})
}
})
}
},
} }
} }
</script> </script>
...@@ -735,75 +849,139 @@ export default { ...@@ -735,75 +849,139 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.wrap { .wrap {
height: 100%; height: 100%;
display: flex;
flex-direction: column;
background: #f7f7f7; background: #f7f7f7;
} }
.middle { .middle {
padding: 0 24rpx 100rpx 24rpx; padding-bottom: 100rpx;
display: flex;
flex-direction: column;
// flex: 1;
}
.swiper-box {
// flex: 1;
position: relative; position: relative;
top: -40rpx; top: -20px;
} }
.tabbar { // 中间上部分
transition:1s; .middle-top{
width: 100%; width: 100%;
left: 0; background: #ffffff;
border-radius: 24rpx 24rpx 0 0;
padding:10px;
z-index: 1; z-index: 1;
position: relative; overflow: hidden;
top: -40rpx; }
background: #fff; .merchant-name{
box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.08); font-size: 18px;
border-radius: 16rpx; font-weight: 600;
}
.merchant-info-bottom{
margin-top: 12rpx;
display: flex; display: flex;
justify-content: space-between; overflow: hidden;
font-size: 32rpx; }
text { .merchant-bottom-left{
padding: 24rpx 32rpx 24rpx 20rpx; width: 220rpx;
border-radius: 16rpx; height: 110rpx;
width: 33.3%; margin-right: 20rpx;
text-align: center; padding:18rpx 20rpx;
background: #F7F8FA;
border-radius: 12rpx;
font-weight: 600;
view:first-child{
font-size: 26rpx;
}
view:last-child{
font-size: 24rpx;
margin-top: 6rpx;
} }
} }
.tabbar .on { .merchant-bottom-right{
// background: url('../../../static/img/scenic/tabbar.png') no-repeat; flex: 1;
background: $theme; display: flex;
padding: 0 20rpx;
align-items: center;
background: url('@/static/img/combination/mapbg.png') no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
color: #fff;
font-weight: bold;
} }
.merchant { .merchant-address{
border-radius: 16rpx; flex: 1;
font-size: 26rpx;
font-weight: 600;
}
.merchant-nav{
margin: 0 36rpx;
font-size: 20rpx;
text-align: center;
}
.merchant-phone{
font-size: 20rpx;
text-align: center;
}
.merchant-bg{
width: 52rpx;
height: 52rpx;
background: #ffffff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
//中间下部分
.middle-bottom{
display: flex;
background: #f7f7f7;
z-index: 1;
}
.scroll-left{
flex-shrink: 0;
padding: 12px 24rpx 0 0;
box-sizing: border-box;
width: 154rpx;
}
.middle-left{
font-size: 24rpx;
background: #ffffff; background: #ffffff;
margin-top: 24rpx; border-radius: 0 20rpx 20rpx 0;
padding: 24rpx; text-align: center;
min-height: 100%;
} }
.merchant label{ .merchant-tab{
width: 100%; padding: 32rpx 16rpx;
} }
.merchant label.off .product { .merchant-tab.on{
background: #f3f3f3; background: linear-gradient( 124deg, #FF9F00 0%, #FE6600 100%);
color: #999999; border-radius: 0px 20rpx 20rpx 0px;
color: #ffffff;
}
.middle-right{
flex: 1;
}
.merchantlist-wrap{
background: #f7f7f7;
padding-top:12px;
}
.merchantlist {
border-radius: 20rpx;
background: #ffffff;
margin-top: 12px;
padding: 24rpx 0 0 24rpx;
} }
.merchant label.off .product-name { .middle-right view.merchantlist:first-child{
margin-top: 0;
}
.merchantlist label{
width: 100%;
}
.merchantlist label.off .product {
color: #999999; color: #999999;
} }
.merchant label.off .product-rule { .merchantlist label.off .product-name {
color: #999999; color: #999999;
} }
.merchant-title { .merchantlist-title {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding-bottom: 16rpx; padding:0 24rpx 16rpx 0;
} }
.title-left { .merchantlist-name {
font-size: 32rpx; flex: 1;
font-size: 36rpx;
margin-right: 10rpx; margin-right: 10rpx;
font-weight: bold; font-weight: bold;
image { image {
...@@ -814,22 +992,21 @@ export default { ...@@ -814,22 +992,21 @@ export default {
margin: 0 8rpx; margin: 0 8rpx;
} }
} }
.title-coupon { .merchantlist-coupon {
color: $red; color: $red;
font-size: 24rpx; font-size: 24rpx;
} }
.title-right { .merchantlist-detail {
color: $grey; color: $grey;
font-size: 24rpx; font-size: 24rpx;
display: flex; display: flex;
} }
.product { .product {
padding:16rpx 16rpx 10rpx 16rpx; padding:24rpx 24rpx 24rpx 0;
background: #ffffff; background: #ffffff;
border-radius: 8rpx; border-radius: 8rpx;
display: flex; display: flex;
align-items: center; border-bottom: 1px solid #f5f5f5;
margin-top: 10rpx;
} }
.product.on { .product.on {
background: #e2eeff; background: #e2eeff;
...@@ -841,13 +1018,15 @@ export default { ...@@ -841,13 +1018,15 @@ export default {
flex: 1; flex: 1;
} }
.product-name { .product-name {
font-size: 28rpx; font-size: 32rpx;
font-weight: bold; font-weight: bold;
color: #191919; color: #191919;
display: flex; display: flex;
align-items: center;
justify-content: space-between; justify-content: space-between;
} }
.product-status { .product-status {
flex-shrink: 0;
padding: 6rpx 12rpx; padding: 6rpx 12rpx;
border: 2px solid #f40000; border: 2px solid #f40000;
color: #f40000; color: #f40000;
...@@ -856,28 +1035,30 @@ export default { ...@@ -856,28 +1035,30 @@ export default {
transform: rotate(-25deg); transform: rotate(-25deg);
position: relative; position: relative;
top: 30rpx; top: 30rpx;
right: 80rpx; right: 60rpx;
} }
.product-price { .product-rule{
display: flex; font-size: 24rpx;
justify-content: space-between; color: #999999;
align-items: center; margin-top: 12rpx;
}
.product-rule {
color: $theme;
} }
.product-rule::after { .product-rule text:not(:last-child) ::after {
display: inline-block; display: inline-block;
content: ''; content: '';
height: 22rpx; height: 22rpx;
margin: 0 10rpx; margin: 0 14rpx;
background: #ccc; background: #ccc;
width: 1px; width: 1px;
position: relative;
top: 2rpx;
} }
.product-orange { .product-price{
font-size: 20rpx; display: flex;
color: $grey; margin-top: 6rpx;
text-decoration: line-through; align-items: center;
justify-content: space-between;
font-size: 24rpx;
color: #999999;
} }
.product-sell { .product-sell {
font-size: 40rpx; font-size: 40rpx;
...@@ -893,6 +1074,13 @@ export default { ...@@ -893,6 +1074,13 @@ export default {
display: flex; display: flex;
justify-content: center; justify-content: center;
} }
.no-more{
height: 600rpx;
margin-top:100rpx;
text-align: center;
font-size:24rpx;
color: #666;
}
.bottom { .bottom {
position: fixed; position: fixed;
bottom: 0; bottom: 0;
...@@ -910,8 +1098,13 @@ export default { ...@@ -910,8 +1098,13 @@ export default {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
font-size: 24rpx;
} }
.bottom-middle { .bottom-right{
display: flex;
align-items: center;
}
.bottom-choose {
position: relative; position: relative;
padding: 0 40rpx; padding: 0 40rpx;
} }
...@@ -924,14 +1117,14 @@ export default { ...@@ -924,14 +1117,14 @@ export default {
padding: 10rpx 20rpx; padding: 10rpx 20rpx;
color: #ffffff; color: #ffffff;
} }
.bottom-three { .bottom-triangle{
width: 14rpx; width: 14rpx;
height: 14rpx; height: 14rpx;
display: inline-block; display: inline-block;
background: #f40000; background: #f40000;
opacity: 0.64; opacity: 0.64;
position: absolute; position: absolute;
right: 42rpx; right: 52rpx;
bottom: -7rpx; bottom: -7rpx;
transform: rotate(45deg); transform: rotate(45deg);
} }
...@@ -950,63 +1143,45 @@ export default { ...@@ -950,63 +1143,45 @@ export default {
background: #f40000; background: #f40000;
color: #ffffff; color: #ffffff;
font-weight: bold; font-weight: bold;
margin-left: 10rpx; margin:0 10rpx;
} }
.btn { .bottom-btn {
font-size: 32rpx; display: inline-block;
width: 200rpx; width: 200rpx;
} height: 80rpx;
//摄影、旅拍 background: linear-gradient( 119deg, #FFA000 0%, #FE6600 100%);
.album-left{ border-radius: 40rpx;
margin:8rpx 6rpx 0 0; font-size: 32rpx;
} font-weight: bold;
.album-right{ text-align: center;
margin: 8rpx 0 0 6rpx; line-height: 80rpx;
} color: #ffffff;
.album-list-top image {
width: 100%;
}
.album-list-bottom{
border-radius: 0 0 16rpx 16rpx;
position: relative;
top: -4px;
padding: 20rpx 16rpx;
color: #fff;
view:first-child{
font-weight: bold;
}
view:nth-child(2){
font-size: 24rpx;
margin-top: 16rpx;
}
view:nth-child(3){
display: flex;
justify-content: space-between;
margin-top: 20rpx;
}
}
.album-btn{
display: flex;
width: 160rpx;
height: 44rpx;
background: #E1E1D9;
border-radius: 20rpx 20rpx 20rpx 20rpx;
font-size: 22rpx;
color: #333333;
align-items: center;
justify-content: center;
padding-left: 8rpx;
} }
.suodaoImg{ .suodaoImg{
position: fixed; position: fixed;
z-index: 9999; z-index: 9999;
width: 100%; width: 100%;
height: 100%; height: 100%;
left: 0;
top: 0;
} }
.swiper-item /deep/ .u-waterfall{ .tabbar{
padding-top:8rpx; background: #fff;
position: fixed;
top: 0;
width: 100%;
opacity: 0;
} }
.swiper-item /deep/ .u-empty{ .tabbar-title{
height: 300px; position: absolute;
bottom: 10px;
text-align: center;
display: flex;
width: 100%;
font-size: 32rpx;
font-weight: 500;
color: #000000;
padding: 0 24rpx;
justify-content: space-between;
} }
</style> </style>
...@@ -142,7 +142,9 @@ ...@@ -142,7 +142,9 @@
<view> <view>
购物车 购物车
</view> </view>
</view> </view>
<!-- #ifdef MP-WEIXIN -->
<view class="middle3-list" @click="online()"> <view class="middle3-list" @click="online()">
<view> <view>
<image src="@/static/img/my/center/customer.png"></image> <image src="@/static/img/my/center/customer.png"></image>
...@@ -151,6 +153,7 @@ ...@@ -151,6 +153,7 @@
AI客服 AI客服
</view> </view>
</view> </view>
<!-- #endif -->
<view class="middle3-list" @click="goTravelNotes()"> <view class="middle3-list" @click="goTravelNotes()">
<view> <view>
<image src="@/static/img/my/center/mark.png"></image> <image src="@/static/img/my/center/mark.png"></image>
......
<template>
<view class="wrap">
<image src="../../../static/img/hghg/hghgBg.jpg" class="bgImage"></image>
<view class="btn-wrap">
<view>
<text class="button" @click="goKnow()">购票须知</text>
</view>
<view style="margin-top: 100rpx;">
<text class="button" @click="goBuy()">立即购票</text>
</view>
</view>
<!-- 购票须知 -->
<view class="buy-know" v-if="showKnow" @click="showKnow=false">
<view class="box">
<view class="title">
告游客书
</view>
<view>
尊敬的游客、广大市民:
</view>
<view>
<text>
开放时间:
</text>
{{openTime}}
</view>
<view>
<text>
博物馆开放日多功能设备运行时间:
</text>
09:30 - 12:30;14:30 - 17:30,(根据景区当天实际情况为准)
</view>
<view>
<text>
免费人群:
</text>
需出示身份证及有效证件原件前往检票处登记入园。
</view>
<view>
<text>
退票须知:
</text>
随时可退,过期未核销自动退。
</view>
<view style="margin-top: 48rpx;display: flex;justify-content: center;">
<text class="button" @click.stop="goBuy()">立即购票</text>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
urlQuery:'',
showKnow:false,
openTime:'',//开放时间
merchantId:'',//商户Id
}
},
onLoad(option) {
let channelId=option.channelId||''
let companyId=option.companyId||''
let groupId=option.groupId||''
let groupChannelId=option.groupChannelId||''
this.merchantId=option.merchantId||''
this.urlQuery=channelId+'&merchantId='+this.merchantId+'&groupId='+groupId+'&groupChannelId='+groupChannelId+'&companyId='+companyId
},
methods: {
//---购票
goBuy(){
uni.navigateTo({
url:'/pages/combination/distributionCombiChoose/distributionCombiChoose?channelId='+this.urlQuery
})
},
//---购票须知
goKnow(){
this.showKnow=true
this.initDetail()
},
//---初始化详情
initDetail(){
let data={
userId:uni.getStorageSync('userId')||'',
openid:uni.getStorageSync('openid')||'',
id:this.merchantId,
isDetail:1,//商户详情
}
this.$request('scenic/user/merchant/findDetailInfo',data).then((res)=>{
if(res.code=='00'){
let data=res.data.merchantTitleData||[]
console.log(data)
data.forEach(item => {
if (item.titleCode == 'scenic_base_info') {
//基本信息
item.merchantChildTitleData.forEach(item2=> {
if (item2.childTitleCode == '101001') {
//开放时间
this.openTime = item2.contentList[0].content
}
})
}
})
}else{
uni.showToast({
title: res.message,
icon: 'none'
})
}
})
},
}
}
</script>
<style scoped>
.wrap{
height: 100%;
font-size: 40rpx;
display: flex;
align-items: center;
justify-content:center;
}
.bgImage{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
}
.btn-wrap{
position: relative;
top: -160rpx;
}
.button{
width: 520rpx;
height: 112rpx;
display:flex;
align-items: center;
justify-content: center;
background: url('../../../static/img/hghg/bigBtn.png') no-repeat;
background-size: 100% 100%;
}
.buy-know{
padding: 0 48rpx;
display: flex;
align-items: center;
justify-content: center;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.3);
}
.box{
padding: 60rpx 40rpx;
background: url('../../../static/img/hghg/dialog.png') no-repeat;
background-size: 100% 100%;
color: #000000;
font-size: 28rpx;
}
.box>view{
margin-top: 10rpx;
}
.box view text{
font-weight: bold;
}
.title{
font-weight: bold;
font-size: 40rpx;
text-align: center;
}
.button{
display: flex;
width: 244rpx;
height: 96rpx;
background: url('../../../static/img/hghg/smallBtn.png') no-repeat;
background-size: 100% 100%;
align-items: center;
justify-content: center;
font-size: 32rpx;
}
</style>
...@@ -18,31 +18,33 @@ ...@@ -18,31 +18,33 @@
<view> <view>
尊敬的游客、广大市民: 尊敬的游客、广大市民:
</view> </view>
<view> <view>
<text> <text>
开放时间: 景区开放时间:
</text> </text>
{{openTime}} {{extendInfo.openingHours}}
</view> </view>
<view> <view>
<text> <text>
博物馆开放日多功能设备运行时间: 博物馆开放日多媒体设备运行时间:
</text> </text>
09:30 - 12:30;14:30 - 17:30,(根据景区当天实际情况为准) {{extendInfo.multifunctionalDevice}}
</view> </view>
<view> <view>
<text> <text>
免费人群: 免费人群:
</text> </text>
需出示身份证及有效证件原件前往检票处登记入园 {{extendInfo.freeCrowd}}
</view> </view>
<view> <view>
<text> <text>
退票须知: 退票须知:
</text> </text>
随时可退,过期未核销自动退 {{extendInfo.noticeOfrefund}}
</view> </view>
<view style="margin-top: 48rpx;display: flex;justify-content: center;">
<view style="margin-top: 60rpx;display: flex;justify-content: center;">
<text class="button" @click.stop="goBuy()">立即购票</text> <text class="button" @click.stop="goBuy()">立即购票</text>
</view> </view>
</view> </view>
...@@ -56,8 +58,8 @@ export default { ...@@ -56,8 +58,8 @@ export default {
return { return {
urlQuery:'', urlQuery:'',
showKnow:false, showKnow:false,
openTime:'09:00 - 18:00,闭馆前1小时(17:00)停止售票',//开放时间
merchantId:'',//商户Id merchantId:'',//商户Id
extendInfo:'',//扩展信息
} }
}, },
onLoad(option) { onLoad(option) {
...@@ -90,18 +92,7 @@ export default { ...@@ -90,18 +92,7 @@ export default {
} }
this.$request('scenic/user/merchant/findDetailInfo',data).then((res)=>{ this.$request('scenic/user/merchant/findDetailInfo',data).then((res)=>{
if(res.code=='00'){ if(res.code=='00'){
let data=res.data.merchantTitleData||[] this.extendInfo=res.data.extendInfo
data.forEach(item => {
if (item.titleCode == 'scenic_base_info') {
//基本信息
item.merchantChildTitleData.forEach(item2=> {
if (item2.childTitleCode == '101001') {
//开放时间
this.openTime = item2.contentList[0].content||'09:00 - 18:00,闭馆前1小时(17:00)停止售票'
}
})
}
})
}else{ }else{
uni.showToast({ uni.showToast({
title: res.message, title: res.message,
...@@ -161,9 +152,12 @@ export default { ...@@ -161,9 +152,12 @@ export default {
background-size: 100% 100%; background-size: 100% 100%;
color: #000000; color: #000000;
font-size: 28rpx; font-size: 28rpx;
width: 100%;
max-height: 90%;
overflow-y: auto;
} }
.box>view{ .box>view{
margin-top: 10rpx; margin-top: 16rpx;
} }
.box view text{ .box view text{
font-weight: bold; font-weight: bold;
......
...@@ -23,7 +23,6 @@ export default { ...@@ -23,7 +23,6 @@ export default {
{name:'云端之眼.高空观景台',phone:'023-60339688'}, {name:'云端之眼.高空观景台',phone:'023-60339688'},
{name:'两江夜游',phone:'13883372702'}, {name:'两江夜游',phone:'13883372702'},
{name:'礼嘉时光缆车(渝北区)',phone:'023-67687141'}, {name:'礼嘉时光缆车(渝北区)',phone:'023-67687141'},
{name:'清明上河图',phone:'17783002411'},
{name:'重庆湖广会馆',phone:'023-63914697'}, {name:'重庆湖广会馆',phone:'023-63914697'},
{name:'重庆抗战遗址博物馆',phone:'023-62462447'}, {name:'重庆抗战遗址博物馆',phone:'023-62462447'},
{name:'重庆杜莎夫人蜡像馆',phone:'023-63492828'}, {name:'重庆杜莎夫人蜡像馆',phone:'023-63492828'},
......
...@@ -230,7 +230,7 @@ export default { ...@@ -230,7 +230,7 @@ export default {
} }
this.$request('order/userOrder/refundTicket',data).then((res)=>{ this.$request('order/userOrder/refundTicket',data).then((res)=>{
if(res.code == '00'){ if(res.code == '00'){
this.toUploadType = true //this.toUploadType = true
uni.hideLoading() uni.hideLoading()
uni.showToast({ uni.showToast({
title: '申请成功', title: '申请成功',
...@@ -297,7 +297,7 @@ export default { ...@@ -297,7 +297,7 @@ export default {
var playdateTimerNum = this.$commonjs.changeTime(playdateTimer) //游玩时间转化数字 var playdateTimerNum = this.$commonjs.changeTime(playdateTimer) //游玩时间转化数字
var playdateEndTimer = ''//退票截止时间 var playdateEndTimer = ''//退票截止时间
var playdateEndTimerNum = '' //截止时间转化数字 var playdateEndTimerNum = '' //截止时间转化数字
if(item.refundDateType!=undefined&&item.refundDateType==2){//refundDateType 退款时间展示文字(0之前1之后2至(用于区间) if(item.refundDateType!=undefined&&item.refundDateType==1){//refundDateType 退款时间展示文字(0之前1至(用于区间)2之后
if(item.refundDay!=undefined&&item.refundDay!=0){ if(item.refundDay!=undefined&&item.refundDay!=0){
var itemDay = -item.refundDay//将天数改为负数 var itemDay = -item.refundDay//将天数改为负数
var orderEndPlayDate = this.getNextDate(this.orderInfo.playDate,itemDay)//最迟退票天数 var orderEndPlayDate = this.getNextDate(this.orderInfo.playDate,itemDay)//最迟退票天数
...@@ -307,7 +307,7 @@ export default { ...@@ -307,7 +307,7 @@ export default {
} }
playdateEndTimerNum = this.$commonjs.changeTime(playdateEndTimer) playdateEndTimerNum = this.$commonjs.changeTime(playdateEndTimer)
} }
if(item.refundDateType!=undefined&&item.refundDateType==2){ if(item.refundDateType!=undefined&&item.refundDateType==1){
if(todayTimerNum>playdateTimerNum&&todayTimerNum<playdateEndTimerNum){ if(todayTimerNum>playdateTimerNum&&todayTimerNum<playdateEndTimerNum){
this.orderRefundRuleListShowBtn = true this.orderRefundRuleListShowBtn = true
this.isRefund = true this.isRefund = true
......
...@@ -90,6 +90,7 @@ ...@@ -90,6 +90,7 @@
</view> </view>
</view> </view>
</template> </template>
<!--sceneSortStatus 是否上下架 1是上架-->
<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="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="alltype-title">
<!-- <view class="title-line"> <!-- <view class="title-line">
...@@ -660,7 +661,7 @@ export default { ...@@ -660,7 +661,7 @@ export default {
this.ifyukuaiCode = option.ifyukuaiCode||'' this.ifyukuaiCode = option.ifyukuaiCode||''
//this.id = "z00167956572219584dc15634b62cf75" //this.id = "z00167956572219584dc15634b62cf75"
this.openId = uni.getStorageSync('openid') //openid oroHZ5FaUQ_SOOC_uQQP92fJpBRE oh2UV1lyYABHMZ1rMlgjhVHyyYDQ this.openId = uni.getStorageSync('openid') //openid oroHZ5FaUQ_SOOC_uQQP92fJpBRE oh2UV1lyYABHMZ1rMlgjhVHyyYDQ
//this.openId = 'oh2UV1lyYABHMZ1rMlgjhVHyyYDQ'//'oh2UV1lyYABHMZ1rMlgjhVHyyYDQ' oroHZ5FaUQ_SOOC_uQQP92fJpBRE //this.openId = 'oroHZ5FaUQ_SOOC_uQQP92fJpBRE'//'oh2UV1lyYABHMZ1rMlgjhVHyyYDQ' oroHZ5FaUQ_SOOC_uQQP92fJpBRE
this.getDetail() this.getDetail()
}, },
onUnload() { onUnload() {
...@@ -793,8 +794,11 @@ export default { ...@@ -793,8 +794,11 @@ export default {
if(this.orderInfo.subOrderType!=4&&this.orderInfo.subOrderType!=5){ if(this.orderInfo.subOrderType!=4&&this.orderInfo.subOrderType!=5){
this.$nextTick(() => { 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){ 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() if(this.orderInfo.orderStatus==2||this.orderInfo.orderStatus==4||this.orderInfo.orderStatus==5||this.orderInfo.orderStatus==7){ //订单状态==2 4 5 7才调用动态二维码
this.qrCodeType=true this.dynamicCode()
this.qrCodeType=true
}
}else if(this.orderInfo.exchangeMode==1){ }else if(this.orderInfo.exchangeMode==1){
this.qecode() this.qecode()
this.qrCodeType=false this.qrCodeType=false
...@@ -803,18 +807,22 @@ export default { ...@@ -803,18 +807,22 @@ export default {
} }
} }
} }
if(this.orderInfo.isFetch==1){//isFetch==1需要排队 if(this.orderInfo.isFetch==1){//isFetch==1需要排队
this.getSortInfo() if(this.orderInfo.orderStatus==2||this.orderInfo.orderStatus==4||this.orderInfo.orderStatus==5||this.orderInfo.orderStatus==7){ //订单状态==2 4 5 7才可以调用排号接口
var sortRefresh = new Date().getTime() console.log(this.orderInfo.orderStatus)
this.sortRefreshNew = JSON.parse(JSON.stringify(sortRefresh)) this.getSortInfo()
this.timer2=setInterval(()=>{ var sortRefresh = new Date().getTime()
var sortRefresh2 = new Date().getTime() this.sortRefreshNew = JSON.parse(JSON.stringify(sortRefresh))
var sorNum = sortRefresh2-this.sortRefreshNew this.timer2=setInterval(()=>{
if(sorNum>=120000){ var sortRefresh2 = new Date().getTime()
this.sortRefreshNew = JSON.parse(JSON.stringify(sortRefresh2)) var sorNum = sortRefresh2-this.sortRefreshNew
this.getSortInfo() if(sorNum>=120000){
} this.sortRefreshNew = JSON.parse(JSON.stringify(sortRefresh2))
},1000) this.getSortInfo()
}
},1000)
}
// this.$once('hook:beforeDestroy',()=>{ // this.$once('hook:beforeDestroy',()=>{
// clearInterval(timer) // clearInterval(timer)
// }) // })
...@@ -872,13 +880,19 @@ export default { ...@@ -872,13 +880,19 @@ export default {
} }
playdateEndTimerNum = this.$commonjs.changeTime(playdateEndTimer) playdateEndTimerNum = this.$commonjs.changeTime(playdateEndTimer)
} }
if(item.refundDateType!=undefined&&item.refundDateType==2){ if(item.refundDateType!=undefined&&item.refundDateType==1){//至
if(todayTimerNum>playdateTimerNum&&todayTimerNum<playdateEndTimerNum){ if(todayTimerNum>playdateTimerNum&&todayTimerNum<playdateEndTimerNum){
this.orderRefundRuleListShowBtn = true this.orderRefundRuleListShowBtn = true
}else{ }else{
this.orderRefundRuleListShowBtn = false this.orderRefundRuleListShowBtn = false
} }
}else{ }else if(item.refundDateType!=undefined&&item.refundDateType==2){//之后
if(todayTimerNum>playdateTimerNum){
this.orderRefundRuleListShowBtn = true
}else{
this.orderRefundRuleListShowBtn = false
}
}else{//之前
if(todayTimerNum<playdateTimerNum){ if(todayTimerNum<playdateTimerNum){
this.orderRefundRuleListShowBtn = true this.orderRefundRuleListShowBtn = true
}else{ }else{
......
<template>
<view class="wrap">
<!-- 联票电子门票 -->
<view class="top">
<text>
{{orderInfo.productName}}X{{orderInfo.orderNum}}
</text>
<text>
¥{{orderInfo.totalMoney}}
</text>
</view>
<view class="middle">
<view class="productInfo" v-for="(item,index) in orderInfo.childs" :key="index">
<view class="product-top">
<view class="product-name">
<text>{{item.productName}}</text>
<text>{{item.orderStatus|orderStatus}}</text>
</view>
<view class="product-datetime">
<view>
<text>使用日期</text>
<text style="color: #FE6600;">{{item.playDate}}</text>
</view>
<view>
<text>入园时间</text>
<text>{{item.startPlayTime?item.startPlayTime.substr(0,5):''}}-{{item.endPlayTime?item.endPlayTime.substr(0,5):''}}</text>
</view>
</view>
</view>
<!-- 只有等于全部退货退款时才显示 -->
<view class="product-refund" v-if="item.orderStatus==8">
<view class="product-refund-detail" @click="refundDetailChange(item)">
<view style="color: #FE6600;">退订详情</view>
<view style="display: flex;">
查看详情
<u-icon name='arrow-up' v-if="item.showRefundDetail"></u-icon>
<u-icon name='arrow-down' v-else></u-icon>
</view>
</view>
<view class="product-refund-list" v-if="item.showRefundDetail" v-for="(item2,a) in item.orderRefundList" :key='a'>
<view>{{item2.refundStatusName}}</view>
<view>{{item2.refundReason}}</view>
<view style="color: #666666;">{{item2.refundDate}}</view>
</view>
</view>
<template v-else>
<!-- 等于1为需要排号的景区 -->
<view class="product-number" v-if="item.showSortInfo==true" v-for="(item2,a) in item.sorts" :key='a'>
<!-- 1可进入等候区 -->
<view v-if="item2.sortFair==1" style="background: #31AA6B;color: #ffffff;border: none;">
<view class="my-number" >
<view>
<view>我的排队号</view>
<view>
{{item2.sortNo}}
<text class="my-number-name">({{item2.projectName}})</text>
</view>
</view>
<view>
<view>预计进入时间</view>
<view>{{item2.sortNoTime}}</view>
</view>
</view>
<view class="current-number">
当前排队区间
<text>{{item2.showStart}}-{{item2.showEnd}}</text>
<text>({{item2.projectName}})</text>
</view>
<view class="number-notice" style="color: #9ed9ba;">
<view>
温馨提示:{{item2.config.paRowNumHint}}
</view>
<!-- 可以进入排队区提示 -->
<view>
{{item2.config.paArrivalNumHint}}
</view>
</view>
</view>
<!-- 2已过号不可重排,3已过号可重排 -->
<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}}
<text class="my-number-name">({{item2.projectName}})</text>
</view>
</view>
<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>
</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>
<text>({{item2.projectName}})</text>
</view>
</view>
<!-- 4-可返程取号(仅胖丁显示),5-第一次取号(仅胖丁显示)-->
<view v-else-if="item2.sortFair==4||item2.sortFair==5" style="padding-top: 16rpx;">
<view class="current-number">
当前排队区间
<text style="color: #FE6600;">{{item2.showStart}}-{{item2.showEnd}}</text>
<text style="color: #FE6600;">({{item2.projectName}})</text>
</view>
<!-- 1购票返程允许取号 -->
<view v-if="item2.config.paReturnTripNumEnable==1" style="margin-top: 30rpx;" >
<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>
<!-- 1购票返程不允许取号,仅提示 -->
<view v-if="item2.config.paReturnTripNumEnable==0" style="margin-top: 30rpx;">
{{item.config.paReturnTripHint}}
</view>
</view>
<!-- 6已过闸 -->
<view v-else-if="item2.sortFair==6" style="color: #FE6600;">
温馨提示:您已过闸
</view>
<!-- 7提前通知-->
<view v-else-if="item2.sortFair==7">
<view class="my-number" >
<!-- 0显示排队号,1隐藏排队号 -->
<view v-if="item2.config.paHideNum!=1">
<view>我的排队号</view>
<view style="color: #FE6600;">
{{item2.sortNo}}
<text class="my-number-name">({{item2.projectName}})</text>
</view>
</view>
<!-- 0显示预计时间,1隐藏预计时间 -->
<view v-if="item2.config.paHideEstimatedTime!=1">
<view >预计进入时间</view>
<view style="color: #FE6600;">{{item2.sortNoTime}}</view>
</view>
</view>
<view class="current-number">
当前排队区间
<text style="color: #FE6600;">{{item2.showStart}}-{{item2.showEnd}}</text>
<text style="color: #FE6600;">({{item2.projectName}})</text>
</view>
<view class="number-notice">
<view style="color: #666666;">
温馨提示:{{item2.config.paRowNumHint}}
</view>
<view style="color: #FE6600;">
<text v-if="item2.config.paAdvanceNoticeDisplay">
{{item2.config.paAdvanceNoticeDisplay}}
</text>
<text v-else>
请尽快赶到现场等候,避免错过游玩时间。
</text>
</view>
</view>
</view>
<!-- 未到号 -->
<view v-else>
<view class="my-number" >
<view>
<view>我的排队号</view>
<view style="color: #FE6600;">
{{item2.sortNo}}
<text class="my-number-name">({{item2.projectName}})</text>
</view>
</view>
<view>
<view>预计进入时间</view>
<view style="color: #FE6600;">{{item2.sortNoTime}}</view>
</view>
</view>
<view class="current-number">
当前排队区间
<text style="color: #FE6600;">{{item2.showStart}}-{{item2.showEnd}}</text>
<text style="color: #FE6600;">({{item2.projectName}})</text>
</view>
<view class="number-notice" style="color: #666666;">
温馨提示:{{item2.config.paRowNumHint}}
</view>
</view>
</view>
<!-- 后端返回了二维码才显示下面内容 -->
<view class="product-code" v-if="item.orderTicketDetailList.length>0&&item.orderTicketDetailList[0].ticketCode">
<view class="code-title">
凭「入园码」直接入园
</view>
<view class="code-image">
<image :src="item.codeImage"></image>
</view>
<view class="code-number">
<text>
{{item.orderTicketDetailList[0].ticketCode}}
</text>
<text @click="copyText(item.orderTicketDetailList[0].ticketCode)">
复制
</text>
</view>
<view class="code-tip" v-if="item.exchangeMode==4||item.exchangeMode==5">
二维码自动更新,截屏无效
</view>
</view>
<view class="product-useknow">
<view class="useknow-list" v-if="item.showUseknow" v-for="(item2,a) in item.orderExtendList" :key="a">
<text>{{item2.title}}</text>
<text>{{item2.content}}</text>
</view>
<view class="useknow-bottom" v-if="item.orderExtendList.length>0" @click="useknowChange(item)">
使用须知
<u-icon name='arrow-down' v-if="item.showUseknow==false"></u-icon>
<u-icon name='arrow-up' v-else></u-icon>
</view>
</view>
</template>
</view>
<view class="rufundRule">
<!-- 等于3退票规则以子订单为准 -->
<view style="padding: 32rpx 32rpx 0 32rpx;" v-if="orderInfo.isRefund==3">
<view v-for="(item,index) in orderInfo.childs" :key="index" >
<view class="rule-title">
{{item.productName}}退改规则
</view>
<view class="rule-type">
<text v-if="item.isRefund==0">不可退</text>
<text v-if="item.isRefund==1">有条件退</text>
<text v-if="item.isRefund==2">随时可退</text>
</view>
<view class="rule-list">
<view v-for="(item2,a) in item.orderRefundRuleList" :key="a" v-if="item.isRefund==1" style="margin-top: 20rpx;">
<!--已配置文字内容 -->
<text v-if="item2.refundShowMessage">
{{item2.refundShowMessage}}
</text>
<!-- 未配置文字内容 -->
<template v-else>
<!-- 使用日期前 -->
<text v-if="item2.refundTimeRule==1">
<text v-if="item2.refundDay==0">
使用日期当天{{item2.refundTime}}之前可退
</text>
<text v-else>
使用日期前{{item2.refundDay}}{{item2.refundTime}}之前可退
</text>
</text>
<!-- 过期 -->
<text v-if="item2.refundTimeRule==2">
<text v-if="item2.refundDay==0">
过期当天{{item2.refundTime}}之前可退
</text>
<text v-else>
过期后{{item2.refundDay}}{{item2.refundTime}}之前可退
</text>
</text>
</template>
</view>
</view>
</view>
</view>
<!-- 不等于3退票规则以主订单为准 -->
<view style="padding: 32rpx;" v-else>
<view class="rule-title">
退改规则
</view>
<view class="rule-type">
<text v-if="orderInfo.isRefund==0">不可退</text>
<text v-if="orderInfo.isRefund==1">有条件退</text>
<text v-if="orderInfo.isRefund==2">随时可退</text>
</view>
<view class="rule-list">
<view v-for="(item,index) in orderInfo.orderRefundRuleList" :key="index" v-if="orderInfo.isRefund==1" style="margin-top: 20rpx;">
<!--已配置文字内容 -->
<text v-if="item.refundShowMessage">
{{item.refundShowMessage}}
</text>
<!-- 未配置文字内容 -->
<template v-else>
<!-- 使用日期前 -->
<text v-if="item.refundTimeRule==1">
<text v-if="item.refundDay==0">
使用日期当天{{item.refundTime}}之前可退
</text>
<text v-else>
使用日期前{{item.refundDay}}{{item.refundTime}}之前可退
</text>
</text>
<!-- 过期 -->
<text v-if="item.refundTimeRule==2">
<text v-if="item.refundDay==0">
过期当天{{item.refundTime}}之前可退
</text>
<text v-else>
过期后{{item.refundDay}}{{item.refundTime}}之前可退
</text>
</text>
</template>
</view>
</view>
</view>
<view class="rule-service" @click="makePhone('4000720368')">
<u-icon name='kefu-ermai'></u-icon>
<text style="margin-left: 12rpx;">联系客服</text>
</view>
</view>
<view class="orderInfo">
<view class="order-title">
订单信息
</view>
<view class="order-middle">
<view>
<text style="flex-shrink: 0;">订单编号</text>
<view class="order-id">
<text class="one-txt-cut" style="flex: 1;text-align: right;">
{{orderInfo.id?orderInfo.id.substr(0,8)+"****"+orderInfo.id.substr(orderInfo.id.length-8,8):''}}
</text>
<text class="order-btn">复制</text>
</view>
</view>
<view>
<text>支付时间</text>
<text>{{orderInfo.paymentTime}}</text>
</view>
<view>
<text>联系信息</text>
<text>
<text>{{orderInfo.ticketPhone}}</text>
</text>
</view>
</view>
<!-- <view class="order-bottom">
收起
<u-icon name='arrow-up'></u-icon>
</view> -->
</view>
</view>
<view class="bottom">
<!-- 以主订单为准 -->
<text v-if="mainRefundBtn" @click="mainRefund(orderInfo.id)">申请退票</text>
<!-- 以子订单为准 -->
<text v-if="subRefundBtn" @click="showSubRefund()">申请退票</text>
<text @click="orderAgain()">再次预订</text>
</view>
<!-- 是否重新排号 -->
<u-modal
:show="showModal"
@confirm="sortAgain(sortAgainData)"
@cancel="showModal=false"
showCancelButton
:title="sortAgainData.config.paPassedNumTakeTypeHint||'是否重新排号'" >
</u-modal>
<!-- 子产品退票列表弹窗 -->
<u-popup :show="refundPop" :round="20" @close="refundPop=false" closeable>
<view class="subtitle">
申请退票
</view>
<radio-group @change="radioChange">
<label class="subradio" v-if="item.ifRefund" v-for="(item,index) in orderInfo.childs" :key="index">
<text>{{item.productName}}</text>
<radio :value="item.id" :checked="refundOrderId==item.id"/>
</label>
</radio-group>
<view class="subBottom" @click="subRefund()">
<text>确定</text>
</view>
</u-popup>
</view>
</template>
<script>
import QRCode from '@/common/weapp-qrcode.js'
export default {
filters:{
orderStatus(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
}
}
},
data() {
return {
detailTimer:null,//详情时间函数
codeTimer:null,//动态二维码时间函数
numberTimer:null,//获取排号信息时间函数
codeFlag:null,//动态二维码函数
countFlag:null,//倒计时时间函数
numberFlag:null,////获取排号信息时间函数2
Brightness:'',//屏幕亮度
openid:uni.getStorageSync('openid')||'',//openid
companyId:'',//公司Id
orderId:'',//订单Id
orderInfo:'',//订单信息
nowCodeNo:'',//当前动态二维码编号
showModal:false,//重排号弹窗显示隐藏
sortAgainData:'',//重排号数据
canTakeNumber:false,//返程或者第一次取号时,是否可以显示取号按钮
minute:'',//倒计时分钟
second:'',//倒计时秒
mainRefundBtn:false,//以主订单为准
subRefundBtn:false,//以子订单为准
refundPop:false,//子订单产品退票列表弹窗
refundOrderId:'',//退款订单Id
}
},
onLoad(option) {
this.orderId= option.orderId
},
onShow() {
this.getDetail()
uni.getScreenBrightness({
success:(res)=>{
// 这里是把获取到的手机屏幕亮度,存储到data里面,方便给到页面生命周期隐藏和卸载方法里面用
this.Brightness = res.value
if(res.value != 1){
uni.setScreenBrightness({
value: 1
})
}
}
})
},
onHide() {
//切换后台周期函数
//由于该页面用户需要频繁的查看排号和电子门票信息,为性能考虑,在onHide生命周期函数里面也进行计时器清理
//timer结尾是用的setTimeout,Flag结尾是用的setInterval
//清除详情函数
if(this.detailTimer) {
clearTimeout(this.detailTimer)
this.detailTimer = null
}
//清除动态二维码函数
if(this.codeTimer) {
clearTimeout(this.codeTimer)
this.codeTimer = null
}
//清除排号信息函数
if(this.numberTimer) {
clearTimeout(this.numberTimer)
this.numberTimer = null
}
//清除排号信息函数2
if(this.numberFlag) {
clearInterval(this.numberFlag)
this.numberFlag = null
}
//清除倒计时函数
if(this.countFlag) {
clearInterval(this.countFlag)
this.countFlag = null
}
//清除动态二维码函数
if(this.codeFlag) {
clearInterval(this.codeFlag)
this.codeFlag = null
}
uni.setScreenBrightness({// 恢复之前屏幕亮度
value: this.Brightness
})
},
onUnload() {
//页面切换周期函数
//timer结尾是用的setTimeout,Flag结尾是用的setInterval
//清除详情函数
if(this.detailTimer) {
clearTimeout(this.detailTimer)
this.detailTimer = null
}
//清除动态二维码函数
if(this.codeTimer) {
clearTimeout(this.codeTimer)
this.codeTimer = null
}
//清除排号信息函数
if(this.numberTimer) {
clearTimeout(this.numberTimer)
this.numberTimer = null
}
//清除排号信息函数2
if(this.numberFlag) {
clearInterval(this.numberFlag)
this.numberFlag = null
}
//清除倒计时函数
if(this.countFlag) {
clearInterval(this.countFlag)
this.countFlag = null
}
//清除动态二维码函数
if(this.codeFlag) {
clearInterval(this.codeFlag)
this.codeFlag = null
}
uni.setScreenBrightness({// 恢复之前屏幕亮度
value: this.Brightness
})
},
methods: {
//---加载订单详情
getDetail(){
let data={
orderId:this.orderId,//订单ID
userId:this.openid,//用户Id
}
this.$request('order/userOrder/findOrderDetail',data).then((res)=>{
if(res.code=='00'){
//防止代码bug进入catch里面,一直请求接口影响性能
try{
this.orderInfo=res.data
let orderInfo=res.data
this.orderInfo.childs.forEach(item=>{
//默认不显示使用须知
item.showUseknow=false
//默认不显示退票详情
item.showRefundDetail=false
if(item.orderStatus==2||item.orderStatus==4||item.orderStatus==5||item.orderStatus==7){
//订单状态为2、4、5、7时才获取排号信息
if(item.isFetch=='1'){
//为了提高性能,游玩时间等于今天才获取排号信息
if(item.playDate.substr(0,10)==this.$commonjs.today()){
//获取排号信息
this.getSortInfo(item)
//每两分钟刷新一次
this.numberFlag=setInterval(()=>{
this.getSortInfo(item)
},120*1000)
}
}
}
//subOrderType 子订单类型(0-胖丁分销,1-扫码购,2-自助机,3-组合,4-扫码牌,5-预订,6-反扫,7-收银机,8-码同步,9-押金,94-公众号,96-胖丁分销,99-酒店自营)
//exchangeMode 验证方式:1胖丁二维码,2第三方二维码,3短信,4身份证
if(item.subOrderType!=4&&item.subOrderType!=5){
//为了提高性能,游玩时间等于今天才获取排号信息
if(item.playDate.substr(0,10)==this.$commonjs.today()){
if(item.exchangeMode==4||item.exchangeMode==5){
//多个二维码
if(item.orderStatus==2||item.orderStatus==4||item.orderStatus==5||item.orderStatus==7){
//订单状态为2、4、5、7时才获取动态二维码
this.getCodeList(item)
}
}
}
if(item.exchangeMode==1){
//一个二维码
this.getCode(item)
}
}
//根据退款状态修改退款列表的退款名称
item.orderRefundList.forEach((item2,index)=>{
if(item2.refundStatus==0){
item2['refundStatusName'] = '退款中'
}else if(item2.refundStatus==1){
item2['refundStatusName'] = '退款成功'
}else if(item2.refundStatus==2){
item2['refundStatusName'] = '退款失败'
}else if(item2.refundStatus==3){
item2['refundStatusName'] = '退票中'
}else if(item2.refundStatus==4){
item2['refundStatusName'] = '退票确认'
}else if(item2.refundStatus==5){
item2['refundStatusName'] = '退货完成'
}else if(item2.refundStatus==6){
item2['refundStatusName'] = '退票审核中'
}else if(item2.refundStatus==7){
item2['refundStatusName'] = '退票失败'
}
})
})
if(orderInfo.isRefund==3){
// 退票规则以子订单为准
this.orderInfo.childs.forEach(item=>{
if(item.orderStatus==2||item.orderStatus==7){
//等于2出票成功,7部分退货退款
if(item.isRefund==2){
//随时可退
this.subRefundBtn=true
//增加字段用于弹窗展示该产品是否可退
item.ifRefund=true
}
if(item.isRefund==1){
//1为条件退
item.orderRefundRuleList.forEach(item2=>{
//refundVisitorApply游客是否能自己申请退(0不能1可以)
if(item2.refundVisitorApply==1){
//当前时间戳
let nowTimeNumber=new Date().getTime()
//退票时间戳
let refundTime=''
if(item2.refundDay){
//1使用日期前
if(item2.refundTimeRule==1){
let playDate = this.getNewDate(orderInfo.playDate,-item2.refundDay)
refundTime = playDate+' '+item2.refundTime
}
//2过期后
if(item2.refundTimeRule==2){
let playDate = this.getNewDate(orderInfo.playDate,item2.refundDay)
refundTime = playDate+' '+item2.refundTime
}
}else{
refundTime = orderInfo.playDate+' '+item2.refundTime
}
let refundTimeNumber=new Date(refundTime.replace(/-/g, '/')).getTime()
// refundDateType退款时间0之前,1至(用于区间),2之后
if(item2.refundDateType==0){
if(nowTimeNumber<refundTimeNumber){
this.subRefundBtn=true
//增加字段用于弹窗展示该产品是否可退
item.ifRefund=true
}else{
this.subRefundBtn=false
}
}
if(item2.refundDateType==1){
let refundEndTime=''
if(item2.refundDay){
let playDate = this.getNewDate(orderInfo.playDate,-item2.refundDay)
refundEndTime = playDate+' '+item2.refundEndTime
}else{
refundEndTime = orderInfo.playDate+' '+item2.refundEndTime
}
if(refundTime<nowTime<refundEndTime){
this.subRefundBtn=true
//增加字段用于弹窗展示该产品是否可退
item.ifRefund=true
}else{
this.subRefundBtn=false
}
}
if(item2.refundDateType==2){
if(nowTimeNumber>refundTimeNumber){
this.subRefundBtn=true
//增加字段用于弹窗展示该产品是否可退
item.ifRefund=true
}else{
this.subRefundBtn=false
}
}
}
})
}
}
})
}else{
// 退票规则以主订单为准
if(orderInfo.orderStatus==2||orderInfo.orderStatus==7){
//等于2出票成功,7部分退货退款
if(orderInfo.isRefund==2){
//随时可退
this.mainRefundBtn=true
}
if(orderInfo.isRefund==1){
//1为条件退
orderInfo.orderRefundRuleList.forEach(item=>{
//refundVisitorApply游客是否能自己申请退(0不能1可以)
if(item.refundVisitorApply==1){
//当前时间戳
let nowTimeNumber=new Date().getTime()
//退票时间戳
let refundTime=''
if(item.refundDay){
//1使用日期前
if(item.refundTimeRule==1){
let playDate = this.getNewDate(orderInfo.playDate,-item.refundDay)
refundTime = playDate+' '+item.refundTime
}
//2过期后
if(item.refundTimeRule==2){
let playDate = this.getNewDate(orderInfo.playDate,item.refundDay)
refundTime = playDate+' '+item.refundTime
}
}else{
refundTime = orderInfo.playDate+' '+item.refundTime
}
let refundTimeNumber=new Date(refundTime.replace(/-/g, '/')).getTime()
// refundDateType退款时间0之前,1至(用于区间),2之后
if(item.refundDateType==0){
if(nowTimeNumber<refundTimeNumber){
this.mainRefundBtn=true
}else{
this.mainRefundBtn=false
}
}
if(item.refundDateType==1){
let refundEndTime=''
if(item.refundDay){
let playDate = this.getNewDate(orderInfo.playDate,-item.refundDay)
refundEndTime = playDate+' '+item.refundEndTime
}else{
refundEndTime = orderInfo.playDate+' '+item.refundEndTime
}
if(refundTime<nowTime<refundEndTime){
this.mainRefundBtn=true
}else{
this.mainRefundBtn=false
}
}
if(item.refundDateType==2){
if(nowTimeNumber>refundTimeNumber){
this.mainRefundBtn=true
}else{
this.mainRefundBtn=false
}
}
}
})
}
}
}
}catch(e){
uni.showToast({
title: e,
icon: 'none'
})
}
}else{
uni.showToast({
title: res.message,
icon: 'none'
})
}
}).catch((err) => {
this.detailTimer = setTimeout(() => {
this.getDetail()
}, 2000)
})
},
//---当前时间加上天数获取新的日期
getNewDate: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
},
//---二维码刷新
dynamicCodeRefresh(item){
let codeList=item.codeList
let codeStart=item.codeStart
// 获取当前显示第几个二维码
let nowTime = (new Date().getTime() - codeStart)/1000
let code = null
// 寻找到当前时间的二维码
for(let i = 0 ; i < codeList.length ; i++ ){
let item2 = codeList[i]
nowTime -= item2.timeout
if(nowTime <= 0 ){
code = item2
break
}
}
// 全部遍历完成后,需要重新获取新的二维码
if(code == null){
this.getCodeList(item)
} else {
if(code.code != this.nowCodeNo){
this.nowCodeNo=code.code||''
if(this.nowCodeNo){
item.codeImage= QRCode.drawImg(this.nowCodeNo, {
typeNumber: 3,//码点大小 1-40,数字越大,码点越小,二维码会显得越密集
errorCorrectLevel: 'H',//纠错等级 H等级最高(30%) 简单来说,就是二维码被覆盖了多少仍然能被识别出来 详见qrcode.js
size: 180
})
}
this.$forceUpdate()
}
}
},
//---获取动态二维码列表
getCodeList(item){
let codeNo=''
if(item.orderTicketDetailList.length>0){
codeNo=item.orderTicketDetailList[0].ticketCode
}
let data={
codeNo,//二维码编号
orderId:item.id,//订单号
userId:this.openid//openid
}
clearInterval(this.codeFlag)
this.$request('distribution/distribution/getAutoCode',data).then((res)=>{
if(res.code == '00'){
item.codeList = res.data.codes
if(item.codeList.length==0){
uni.showToast({
title: '网络异常,请退出重试',
icon: 'none'
})
return
}
item.codeStart = new Date().getTime()
this.codeFlag = setInterval(()=>{
this.dynamicCodeRefresh(item)
},300)
}else{
uni.showToast({
title: res.message,
icon: 'none'
})
}
}).catch((err)=>{
this.codeTimer=setTimeout(()=>{
this.getCodeList(item)
},2000)
})
},
//---生成二维码
getCode(item){
//生成二维码码取值verifyCode,页面显示取值ticketCode--生成二维码比页面显示多一个TBD
let verifyCode=''
if(item.orderTicketDetailList.length>0){
verifyCode=item.orderTicketDetailList[0].verifyCode||''
}
if(verifyCode){
item.codeImage= QRCode.drawImg(verifyCode, {
typeNumber: 3,//码点大小 1-40,数字越大,码点越小,二维码会显得越密集
errorCorrectLevel: 'H',//纠错等级 H等级最高(30%) 简单来说,就是二维码被覆盖了多少仍然能被识别出来 详见qrcode.js
size: 180
})
}
},
//---获取排号信息
getSortInfo(item){
let data={
areaCode:item.areaCode,//站点编号
orderNum:item.orderNum,//订单数量
userId:this.openid,//openid
orderId:item.id,//订单id
thirdId:item.thirdOrderId,//三方订单id
againNumber:0//首次排号
}
this.$request('distribution/distribution/getNewFetchInfo',data).then((res)=>{
if(res.code=='00'){
if(res.data.length>0){
//防止代码bug进入catch里面,一直请求接口影响性能
try{
let dataObj=res.data[0]
//由于页面不显示历史排号,所以只取第一个最新的排号信息
item.sorts=dataObj.sorts.slice(0,1)||[]
item.sorts.forEach(item2=>{
//sceneSortStatus,1上架
if(item2.config.sceneSortStatus==1){
//显示排号信息
item.showSortInfo=true
}
if(item2.sortFair==4||item2.sortFair==5){
//时间判断,用于返程或第一次取号时,是否可以显示取号按钮
let presentTime = new Date().getTime()
let time1=new Date((item2.createDate).replace(/-/g, '/')).getTime()
let time2=parseInt((item2.config.paReturnTripTime)*60*1000)
let takeNumberTime=time1+time2
if(presentTime>takeNumberTime){
this.canTakeNumber =true
}else{
//倒计时
//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)
}
}
})
//子产品获取公司Id,用于重排号传参
if(dataObj.pays.length>0){
item.merchantCodeCopy = dataObj.pays[0].companyId
}
//子产品获取三方Id,用于重排号传参
item.thirdIdCopy=dataObj.order.orderId
//子产品获取站点编码,用于重排号传参
if(item.sorts.length>0){
item.areaCodeCopy=item.sorts[0].projectId
}
this.$forceUpdate()
}catch(e){
uni.showToast({
title: e,
icon: 'none'
})
}
}
}else{
uni.showToast({
title: res.message,
icon: 'none'
})
}
}).catch((err)=>{
this.numberTimer=setTimeout(()=>{
this.getSortInfo(item)
},2000)
})
},
//---点击重新取号,显示弹窗
clickSortAgain(item){
this.showModal=true
this.sortAgainData=item
},
//---重新排队
sortAgain(item){
let data={
againNumber:1,
thirdId:item.thirdIdCopy,//三方订单id
areaCode:item.areaCodeCopy,//站点
userId:this.openid,
merchantCode:item.merchantCodeCopy,
}
this.$request('distribution/distribution/newFetchNumber',data).then((res)=>{
if(res.code=='00'){
this.showModal=false
this.getSortInfo(item)
}else{
uni.showToast({
title: res.message,
icon: 'none'
})
}
})
},
//---使用须知切换
useknowChange(item){
item.showUseknow=!item.showUseknow
this.$forceUpdate()
},
//---退票详情切换
refundDetailChange(item){
item.showRefundDetail=!item.showRefundDetail
this.$forceUpdate()
},
//---复制内容
copyText(value){
uni.setClipboardData({
data:value,
success:function(){
uni.showToast({
title: '复制成功',
icon: 'none'
})
}
})
},
//---拨打电话
makePhone(phoneNumber) {
uni.makePhoneCall({
phoneNumber
})
},
//---主订单点击申请退票
mainRefund(orderId){
uni.navigateTo({
url: '/pages/my/order/afterSale/applyAfterSale/applyAfterSale?orderId='+orderId
})
},
//---子订单弹窗显示
showSubRefund(){
this.refundPop=true
this.refundOrderId=''
},
//---子订单单选框变化
radioChange(e){
this.refundOrderId=e.detail.value
},
//---子订单为准点击退票
subRefund(){
if(!this.refundOrderId){
uni.showToast({
title: '请选择退票产品',
icon: 'none'
})
return
}
this.refundPop=false
uni.navigateTo({
url: '/pages/my/order/afterSale/applyAfterSale/applyAfterSale?orderId='+this.refundOrderId
})
},
//---再次预订
orderAgain(){
let query = '?merchantId='+this.orderInfo.merchantId+'&productId=' +this.orderInfo.productId +'&orderSource=3'
uni.navigateTo({
url: '/pages/scenic/scenicJointOrder/scenicJointOrder' + query
})
}
}
}
</script>
<style scoped lang="scss">
.wrap{
padding: 0 20rpx;
}
.top{
display: flex;
justify-content: space-between;
padding: 48rpx 20rpx 0 20rpx;
font-size: 36rpx;
font-weight: 600;
text:first-child{
flex: 1;
margin-right: 40rpx;
}
}
.middle{
margin-top: 32rpx;
padding-bottom: 120rpx;
}
// 产品部分
.productInfo{
margin-top: 20rpx;
background: #ffffff;
border-radius: 16rpx;
padding: 40rpx 0 32rpx 0;
}
.product-refund-detail{
display: flex;
justify-content: space-between;
padding: 20rpx 32rpx;
border-bottom: 1px solid #EBEEF5;
}
.product-refund-list view{
margin-top: 10rpx;
}
.product-top{
padding: 0 32rpx;
}
.product-name{
display: flex;
justify-content: space-between;
align-items: center;
font-size: 36rpx;
font-weight: 600;
text:first-child{
flex: 1;
margin-right: 40rpx;
}
text:last-child{
color: #00B42B;
font-size: 28rpx;
}
}
.product-datetime{
display: flex;
justify-content: space-between;
margin-top: 20rpx;
view text:last-child{
font-weight: bold;
margin-left: 20rpx;
}
}
.product-number{
padding: 0 20rpx;
border-radius: 16rpx;
background: #FFFFFF;
margin-top: 20rpx;
>view{
padding: 32rpx;
border-radius: 16rpx;
border: 1px solid #dcdcdc;
}
}
.my-number{
display: flex;
>view{
view:last-child{
margin-top: 10rpx;
font-size: 52rpx;
font-weight: 600;
display: flex;
align-items: center;
}
}
>view:first-child{
width: 52%;
}
>view:last-child{
width: 48%;
}
}
.my-number-name{
font-size: 40rpx;
margin-left: 10rpx;
}
.current-number{
margin-top: 10rpx;
display: flex;
align-items: center;
text{
font-size: 40rpx;
font-weight: 600;
margin-left: 10rpx;
}
}
.number-notice{
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;
margin-top: 40rpx;
}
.code-title{
margin-top: 40rpx;
font-size: 36rpx;
font-weight: 600;
}
.code-number{
margin-top: 20rpx;
font-weight: 600;
text:last-child{
font-weight: bold;
margin-left: 20rpx;
color: #435FA0;
}
}
.code-image{
margin-top: 20rpx;
image{
width: 180px;
height: 180px;
}
}
.code-tip{
margin-top: 20rpx;
color: $red;
}
.product-useknow{
padding: 0 32rpx;
}
.useknow-list{
display: flex;
margin-top: 28rpx;
text:first-child{
color: #777777;
margin-right: 20rpx;
flex-shrink: 0;
}
}
.useknow-bottom{
display: flex;
justify-content: center;
padding-top: 32rpx;
}
// 退票规则
.rufundRule{
background: #ffffff;
border-radius: 16rpx;
margin-top: 20rpx;
}
.rule-title{
font-size: 36rpx;
font-weight: 600;
}
.rule-type{
margin-top: 20rpx;
text{
font-size: 24rpx;
color: $theme;
border: 1px solid $theme;
border-radius: 6rpx;
padding: 4rpx 12rpx;
}
}
.rule-list{
margin:30rpx 0;
}
.rule-service{
display: flex;
align-items: center;
padding: 36rpx 0;
justify-content: center;
border-top: 1px solid #EBEEF5;
}
// 订单信息
.orderInfo{
margin-top: 20rpx;
border-radius: 16rpx;
background: #ffffff;
}
.order-title{
font-size: 36rpx;
font-weight: 600;
padding: 32rpx;
}
.order-middle{
color: #666666;
>view{
padding:32rpx;
display: flex;
justify-content: space-between;
border-bottom: 1px solid #EBEEF5;
}
}
.order-id{
flex: 1;
margin-left: 40rpx;
display: flex;
}
.order-btn{
display: inline-block;
text-align: center;
line-height: 36rpx;
width: 82rpx;
height: 40rpx;
background: #F7F8FA;
border-radius: 20rpx;
font-size: 24rpx;
margin-left: 20rpx;
color: #333333;
}
.bottom{
position: fixed;
bottom: 0;
left: 0;
width: 100%;
z-index: 1;
background: #ffffff;
height: 120rpx;
display: flex;
align-items: center;
padding: 0 40rpx;
justify-content:flex-end;
border-top: 1px solid #EBEEF5;
text{
display: inline-block;
width: 170rpx;
height: 64rpx;
border-radius: 32rpx;
border: 1px solid #EDEDED;
text-align: center;
line-height: 60rpx;
color: #666666;
margin-left: 20rpx;
}
}
.subtitle{
font-size: 32rpx;
font-weight: bold;
text-align: center;
padding: 20rpx;
}
.subradio{
display: flex;
justify-content: space-between;
padding: 20rpx;
border-bottom: 1px solid #EBEEF5;
}
.subBottom{
padding: 40rpx 32rpx 20rpx 32rpx;
text{
display: inline-block;
width: 100%;
height: 88rpx;
text-align: center;
line-height: 85rpx;
background: $red;
color: #ffffff;
font-size: 32rpx;
border-radius: 44rpx;
}
}
</style>
...@@ -188,7 +188,8 @@ export default { ...@@ -188,7 +188,8 @@ export default {
this.errorMessage1 = res.data.errorMessage this.errorMessage1 = res.data.errorMessage
this.totalMoney = res.data.totalMoney this.totalMoney = res.data.totalMoney
this.orderList = res.data.orderList||[] this.orderList = res.data.orderList||[]
if (this.orderList.length==0) { if (this.orderList.length==0||res.data.orderPageShowFlag==0) {
this.orderList=[]
this.orderList.push({ this.orderList.push({
merchantName:res.data.merchantName, merchantName:res.data.merchantName,
productName:res.data.productName, productName:res.data.productName,
......
...@@ -84,7 +84,7 @@ ...@@ -84,7 +84,7 @@
</view> </view>
</scroll-view> </scroll-view>
<text v-else class="no-date"> 不可购买 </text> <text v-else class="no-date"> 不可购买 </text>
<view class="dateMore" @click="showCalendar(index)"> <view class="dateMore" @click="showCalendar(index)" v-if="item.priceStockList&&item.priceStockList.length > 0">
<view class="date-more-content"> <view class="date-more-content">
<view>更多</view> <view>更多</view>
<view>日期</view> <view>日期</view>
...@@ -416,7 +416,7 @@ export default { ...@@ -416,7 +416,7 @@ export default {
} }
}, },
onLoad(option) { onLoad(option) {
this.companyId = option.companyId || '' this.companyId=this.$commonjs.getCompanyId(option)|| ''
this.groupId=option.groupId||'' this.groupId=option.groupId||''
this.groupChannelId=option.groupChannelId||'' this.groupChannelId=option.groupChannelId||''
this.orderSource=option.orderSource||'' this.orderSource=option.orderSource||''
......
...@@ -71,15 +71,6 @@ ...@@ -71,15 +71,6 @@
</text> </text>
</view> </view>
</template> </template>
<!-- <view>
<text>
退票规则:
</text>
<text>
不可退
</text>
</view> -->
<view> <view>
返程时,根据现场情况需重新取号 返程时,根据现场情况需重新取号
</view> </view>
...@@ -132,15 +123,6 @@ ...@@ -132,15 +123,6 @@
</text> </text>
</view> </view>
<!-- <view>
<text>
退票规则:
</text>
<text>
不可退
</text>
</view> -->
<view> <view>
<image src="../static/scenic/chooseArea.jpg" mode="widthFix"></image> <image src="../static/scenic/chooseArea.jpg" mode="widthFix"></image>
</view> </view>
...@@ -149,6 +131,9 @@ ...@@ -149,6 +131,9 @@
<a class="btn" @click="closeSon()">确定</a> <a class="btn" @click="closeSon()">确定</a>
</view> </view>
</view> </view>
<view class="number-detail">
长江索道排号详情可在公众号查询
</view>
</view> </view>
</view> </view>
...@@ -338,4 +323,10 @@ export default { ...@@ -338,4 +323,10 @@ export default {
font-weight: bolder; font-weight: bolder;
color:$red; color:$red;
} }
.number-detail{
font-size:32rpx;
color:#FC6703;
text-align: center;
margin-top: 20rpx;
}
</style> </style>
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<view class="banner" v-if="detailData"> <view class="banner" v-if="detailData">
<u-swiper :list="detailData.imgList" @change="e => currentNum = e.current" indicatorStyle="right: 20px;bottom:25px" height="400" circular> <u-swiper :list="detailData.imgList" @change="e => currentNum = e.current" indicatorStyle="right: 20px;bottom:25px" height="400" circular>
<view slot="indicator" class="indicator-num"> <view slot="indicator" class="indicator-num">
<text class="indicator-num__text">{{ currentNum + 1 }}/{{detailData.imgList.length}}</text> <text class="indicator-num__text">{{ currentNum + 1 }}/{{detailData.imgList.length?detailData.imgList.length:0}}</text>
</view> </view>
</u-swiper> </u-swiper>
</view> </view>
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
<view class="middle-introduce" v-if="detailData"> <view class="middle-introduce" v-if="detailData">
<view class="introduce-one" @click="showDetail()"> <view class="introduce-one" @click="showDetail()">
<view class="merchantname"> <view class="merchantname">
{{detailData.name}} {{detailData.name||''}}
</view> </view>
<view class="businesstime"> <view class="businesstime">
<view style="font-size: 24rpx;"> <view style="font-size: 24rpx;">
...@@ -37,7 +37,7 @@ ...@@ -37,7 +37,7 @@
<view class="introduce-three"> <view class="introduce-three">
<view style="flex: 1;margin-right: 20rpx;"> <view style="flex: 1;margin-right: 20rpx;">
{{detailData.address}} {{detailData.address||''}}
</view> </view>
<view class="introduce-icon"> <view class="introduce-icon">
<u-icon name='map-fill' color='#3688ff' size='44' @click="navigation()"></u-icon> <u-icon name='map-fill' color='#3688ff' size='44' @click="navigation()"></u-icon>
......
...@@ -83,7 +83,7 @@ ...@@ -83,7 +83,7 @@
</view> </view>
</scroll-view> </scroll-view>
<text v-else class="no-date"> 不可购买 </text> <text v-else class="no-date"> 不可购买 </text>
<view class="dateMore" @click="showCalendar()"> <view class="dateMore" @click="showCalendar()" v-if="dateList.length > 0">
<view class="date-more-content"> <view class="date-more-content">
<view>更多</view> <view>更多</view>
<view>日期</view> <view>日期</view>
......
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