Commit 06d50525 authored by 潘永坪's avatar 潘永坪

新页面开发

parent fac82174
...@@ -10,30 +10,13 @@ ...@@ -10,30 +10,13 @@
</u-swiper> </u-swiper>
</view> </view>
<view class="middle"> <view class="middle">
<view class="merchant-info"> <!-- <view class="tabbar" :style="tabbarObj">
<view class="merchant-name"> <text v-for="(item, index) in tabbar" :key="index" @click="tabbarChange(index)" :class="{ on: active == index }">
长江索道 {{ item }}
</view> </text>
<view> </view> -->
<view class="merchant-time"> <swiper :current="active" @animationfinish="animationfinish" class="swiper-box" :style="{ height: swiperHeight + 'px' }">
<view>营业中</view> <swiper-item class="swiper-item">
<view>08:00-22:00</view>
</view>
<view class="merchant-address">
<view>
重庆市渝中区新华路
</view>
<view>
<view></view>
<view>导航</view>
</view>
<view>
<view></view>
<view>电话</view>
</view>
</view>
</view>
</view>
<checkbox-group @change="checkboxChange" class="checkbox-box"> <checkbox-group @change="checkboxChange" class="checkbox-box">
<view class="merchant" v-for="(item, index) in scenicList" :key="index"> <view class="merchant" v-for="(item, index) in scenicList" :key="index">
<view class="merchant-title" @click="clikDetail(item.id)"> <view class="merchant-title" @click="clikDetail(item.id)">
...@@ -72,6 +55,15 @@ ...@@ -72,6 +55,15 @@
<view class="product-price"> <view class="product-price">
<view style="font-size: 24rpx;display: flex;"> <view style="font-size: 24rpx;display: flex;">
<text class="product-rule" v-if="items.productRefundRuleVo"> <text class="product-rule" v-if="items.productRefundRuleVo">
<!-- 索道写死 -->
<!-- <text v-if="item.id=='z0015605022691a5945bbe463141668c'">
有条件退
</text>
<template v-else>
<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 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>
...@@ -102,6 +94,59 @@ ...@@ -102,6 +94,59 @@
</view> </view>
</view> </view>
</checkbox-group> </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>
</template>
<template v-slot:right="{rightList}">
<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>
</template>
</u-waterfall>
</swiper-item>
<swiper-item class="swiper-item">
<u-empty text="空空如也..." mode="list" width="320" height="320"></u-empty>
</swiper-item>
<swiper-item class="swiper-item">
<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> <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">
...@@ -178,6 +223,9 @@ export default { ...@@ -178,6 +223,9 @@ 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:[], //景区数据
...@@ -187,6 +235,7 @@ export default { ...@@ -187,6 +235,7 @@ export default {
showModal: false, //是否显示模态框 showModal: false, //是否显示模态框
chooseMerchantProduct: '', //不支持多产品购买时,选中的景区产品 chooseMerchantProduct: '', //不支持多产品购买时,选中的景区产品
swiperHeight: 0 ,//swiper高度 swiperHeight: 0 ,//swiper高度
tabbarObj:'',
albumList: [{ albumList: [{
title: '精彩瞬间', title: '精彩瞬间',
count: '10W+', count: '10W+',
...@@ -405,6 +454,9 @@ export default { ...@@ -405,6 +454,9 @@ export default {
} }
}) })
}) })
this.$nextTick(() => {
this.countSwiper()
})
} else { } else {
uni.showToast({ uni.showToast({
title: res.message, title: res.message,
...@@ -474,6 +526,21 @@ export default { ...@@ -474,6 +526,21 @@ export default {
this.tabbarObj='top:-40rpx;position:relative;border-radius:16rpx;' this.tabbarObj='top:-40rpx;position:relative;border-radius:16rpx;'
} }
}, },
//---导航栏切换
tabbarChange(index) {
this.active = index
if(index==0){
this.countSwiper()
}
if(index==1){
this.countSwiper('waterfall')
}
},
//---swiper滑动结束,分别设置tabs和swiper的状态
animationfinish(e) {
let current = e.detail.current
this.active = current
},
//---展示客服组件 //---展示客服组件
showCustomer() { showCustomer() {
this.$refs.customer.showPop = true this.$refs.customer.showPop = true
...@@ -489,15 +556,29 @@ export default { ...@@ -489,15 +556,29 @@ export default {
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) {
...@@ -617,7 +698,36 @@ export default { ...@@ -617,7 +698,36 @@ export default {
}) })
} }
} }
},
//---跳转影集页面
goAlbum(index){
if(index==0){
let data={
openid: uni.getStorageSync('openid')||''
} }
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>
...@@ -633,6 +743,39 @@ export default { ...@@ -633,6 +743,39 @@ export default {
padding: 0 24rpx 100rpx 24rpx; padding: 0 24rpx 100rpx 24rpx;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
// flex: 1;
}
.swiper-box {
// flex: 1;
position: relative;
top: -40rpx;
}
.tabbar {
transition:1s;
width: 100%;
left: 0;
z-index: 1;
position: relative;
top: -40rpx;
background: #fff;
box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.08);
border-radius: 16rpx;
display: flex;
justify-content: space-between;
font-size: 32rpx;
text {
padding: 24rpx 32rpx 24rpx 20rpx;
border-radius: 16rpx;
width: 33.3%;
text-align: center;
}
}
.tabbar .on {
// background: url('../../../static/img/scenic/tabbar.png') no-repeat;
background: $theme;
background-size: 100% 100%;
color: #fff;
font-weight: bold;
} }
.merchant { .merchant {
border-radius: 16rpx; border-radius: 16rpx;
...@@ -813,10 +956,57 @@ export default { ...@@ -813,10 +956,57 @@ export default {
font-size: 32rpx; font-size: 32rpx;
width: 200rpx; width: 200rpx;
} }
//摄影、旅拍
.album-left{
margin:8rpx 6rpx 0 0;
}
.album-right{
margin: 8rpx 0 0 6rpx;
}
.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%;
} }
.swiper-item /deep/ .u-waterfall{
padding-top:8rpx;
}
.swiper-item /deep/ .u-empty{
height: 300px;
}
</style> </style>
...@@ -719,7 +719,7 @@ export default { ...@@ -719,7 +719,7 @@ export default {
refundTime = orderInfo.playDate+' '+item.refundTime refundTime = orderInfo.playDate+' '+item.refundTime
} }
let refundTimeNumber=new Date(refundTime.replace(/-/g, '/')).getTime() let refundTimeNumber=new Date(refundTime.replace(/-/g, '/')).getTime()
//refundDateType退款时间0之前1之后2至(用于区间) // refundDateType退款时间0之前,1至(用于区间),2之后
if(item.refundDateType==0){ if(item.refundDateType==0){
if(nowTimeNumber<refundTimeNumber){ if(nowTimeNumber<refundTimeNumber){
this.mainRefundBtn=true this.mainRefundBtn=true
......
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