Skip to content

U
uni-pdtravel
Commit b2cfec57 authored by 潘永坪's avatar 潘永坪
Browse files
Options

组合票首页面开发

parent 06d50525
Hide whitespace changes
Inline Side-by-side
Showing with 133 additions and 86 deletions
pages.json
View file @ b2cfec57
...@@ -57,6 +57,13 @@ ...@@ -57,6 +57,13 @@
"enablePullDownRefresh": false "enablePullDownRefresh": false
} }
}, },
{
"path": "pages/combination/distributionCombiChoose/distributionCombiChooseNew",
"style": {
"navigationBarTitleText": "产品选择",
"enablePullDownRefresh": false
}
},
{ {
"path": "pages/combination/combiOrder/combiOrder", "path": "pages/combination/combiOrder/combiOrder",
"style": { "style": {
......
pages/combination/distributionCombiChoose/distributionCombiChoose-new.vue → pages/combination/distributionCombiChoose/distributionCombiChooseNew.vue
View file @ b2cfec57
...@@ -24,13 +24,13 @@ ...@@ -24,13 +24,13 @@
重庆市渝中区新华路 重庆市渝中区新华路
</view> </view>
<view class="merchant-nav"> <view class="merchant-nav">
<view> <view class="merchant-bg">
<image src="@/static/img/combination/nav.png" style="width: 28rpx;height: 28rpx;"></image> <image src="@/static/img/combination/nav.png" style="width: 28rpx;height: 28rpx;"></image>
</view> </view>
<view>导航</view> <view>导航</view>
</view> </view>
<view class="merchant-phone"> <view class="merchant-phone">
<view> <view class="merchant-bg">
<image src="@/static/img/combination/phone.png" style="width: 28rpx;height: 28rpx;"></image> <image src="@/static/img/combination/phone.png" style="width: 28rpx;height: 28rpx;"></image>
</view> </view>
<view>电话</view> <view>电话</view>
...@@ -38,75 +38,82 @@ ...@@ -38,75 +38,82 @@
</view> </view>
</view> </view>
</view> </view>
<checkbox-group @change="checkboxChange" class="checkbox-box"> <view class="middle-bottom">
<view class="merchant" v-for="(item, index) in scenicList" :key="index"> <view class="middle-bottom-left">
<view class="merchant-title" @click="clikDetail(item.id)"> 长江索道
<view class="title-left"> </view>
<text>{{ item.name }}</text> <view class="middle-bottom-right">
<template v-if="item.couponVoList && item.couponVoList.length > 0"> <checkbox-group @change="checkboxChange" class="checkbox-box">
<image src="@/static/img/scenic/coupon.png"></image> <view class="merchantlist" v-for="(item, index) in scenicList" :key="index">
<text class="title-coupon"> 劵惠 </text> <view class="merchantlist-title" @click="clikDetail(item.id)">
</template> <view class="merchantlist-name">
</view> <text>{{ item.name }}</text>
<template v-if="item.couponVoList && item.couponVoList.length > 0">
<view v-if="showDistance" class="title-right"> <image src="@/static/img/scenic/coupon.png"></image>
距您{{ item.distance ? parseFloat((item.distance / 1000).toFixed(2)) : 0 }}km <text class="merchantlist-coupon"> 劵惠 </text>
<u-icon name="arrow-right" style="margin-left: 4rpx;" size='26' color='#B4B4B4'></u-icon> </template>
</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>
<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>
<text v-if="items.productRefundRuleVo.refundType == 0">不可退</text> </view>
<text v-if="items.productRefundRuleVo.refundType == 1">有条件退</text> </view>
<text v-if="items.productRefundRuleVo.refundType == 2">随时可退</text>
</text> <label v-for="(items, a) in item.productListCopy" :key="a" :class="{ off: items.status == 2 }">
<text class="product-rule"> 无需取票 </text> <view class="product" :class="{ on: items.ifChangeBg }">
<text @click.stop="showBuyKnow(items)">购买须知</text> <view class="product-left">
<u-icon name="arrow-right" size='26' color='#B4B4B4'></u-icon> <checkbox
style="transform: scale(0.8)"
class="blue"
:disabled="items.status == 2"
:value="JSON.stringify(items)"
:checked="items.ifChecked"
/>
</view> </view>
<view>
<text class="product-orange"> ¥{{ items.originalPrice }} </text> <view class="product-right">
<text class="product-sell"> <text style="font-size: 28rpx">¥</text>{{ items.sellingPrice }} </text> <view class="product-name">
<text>{{ items.name }}</text>
<text class="product-status" v-if="items.status == 2">{{ items.statusName }}</text>
</view>
<view class="product-price">
<view style="font-size: 20rpx;display: flex;">
<text class="product-rule" 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>
</text>
<text class="product-rule"> 无需取票 </text>
<text @click.stop="showBuyKnow(items)">购买须知</text>
<u-icon name="arrow-right" size='26' color='#B4B4B4'></u-icon>
</view>
<view>
<text class="product-sell"> <text style="font-size: 28rpx">¥</text>{{ items.sellingPrice }} </text>
</view>
</view>
</view> </view>
</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)">
更多
<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>
</view> </view>
</label> </checkbox-group>
<u-empty text="暂无数据..." mode="list" v-if="scenicList.length == 0" iconSize="160" textSize='24' textColor='#3688FF'></u-empty>
<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> </view>
</checkbox-group> </view>
<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">
<view class="bottom-left" @click="showCustomer()"> <view class="bottom-left" @click="showCustomer()">
...@@ -633,12 +640,14 @@ export default { ...@@ -633,12 +640,14 @@ export default {
flex-direction: column; flex-direction: column;
background: #f7f7f7; background: #f7f7f7;
} }
.middle { .middle {
padding: 0 24rpx 100rpx 24rpx; padding-bottom: 100rpx;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
position: relative;
top: -40rpx;
} }
// 中间上部分
.merchant-info{ .merchant-info{
background: #ffffff; background: #ffffff;
border-radius: 24rpx 24rpx 0 0; border-radius: 24rpx 24rpx 0 0;
...@@ -673,34 +682,70 @@ export default { ...@@ -673,34 +682,70 @@ export default {
display: flex; display: flex;
padding: 0 20rpx; padding: 0 20rpx;
align-items: center; 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;
}
.middle-bottom-left{
width: 128rpx;
margin-right: 24rpx;
}
.middle-bottom-right{
flex: 1;
} }
.merchant { .merchantlist {
border-radius: 16rpx; border-radius: 16rpx;
background: #ffffff; background: #ffffff;
margin-top: 24rpx; margin-top: 24rpx;
padding: 24rpx; padding: 24rpx;
} }
.merchant label{ .merchantlist label{
width: 100%; width: 100%;
} }
.merchant label.off .product { .merchantlist label.off .product {
background: #f3f3f3; background: #f3f3f3;
color: #999999; color: #999999;
} }
.merchant label.off .product-name { .merchantlist label.off .product-name {
color: #999999; color: #999999;
} }
.merchant label.off .product-rule { .merchantlist label.off .product-rule {
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-bottom: 16rpx;
} }
.title-left { .merchantlist-name {
font-size: 32rpx; font-size: 36rpx;
margin-right: 10rpx; margin-right: 10rpx;
font-weight: bold; font-weight: bold;
image { image {
...@@ -711,11 +756,11 @@ export default { ...@@ -711,11 +756,11 @@ 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;
...@@ -738,7 +783,7 @@ export default { ...@@ -738,7 +783,7 @@ export default {
flex: 1; flex: 1;
} }
.product-name { .product-name {
font-size: 28rpx; font-size: 30rpx;
font-weight: bold; font-weight: bold;
color: #191919; color: #191919;
display: flex; display: flex;
...@@ -771,11 +816,6 @@ export default { ...@@ -771,11 +816,6 @@ export default {
background: #ccc; background: #ccc;
width: 1px; width: 1px;
} }
.product-orange {
font-size: 20rpx;
color: $grey;
text-decoration: line-through;
}
.product-sell { .product-sell {
font-size: 40rpx; font-size: 40rpx;
color: $red; color: $red;
......
pages/my/order/jointElectronicTicket/jointElectronicTicket.vue
View file @ b2cfec57
...@@ -197,7 +197,7 @@ ...@@ -197,7 +197,7 @@
</view> </view>
</view> </view>
<!-- 后端返回了二维码才显示下面内容 --> <!-- 后端返回了二维码才显示下面内容 -->
<view class="product-code" v-if="item.orderTicketDetailList.length>0&&item.orderTicketDetailList[0].verifyCode"> <view class="product-code" v-if="item.orderTicketDetailList.length>0&&item.orderTicketDetailList[0].ticketCode">
<view class="code-title"> <view class="code-title">
凭「入园码」直接入园 凭「入园码」直接入园
</view> </view>
...@@ -206,9 +206,9 @@ ...@@ -206,9 +206,9 @@
</view> </view>
<view class="code-number"> <view class="code-number">
<text> <text>
{{item.orderTicketDetailList[0].verifyCode}} {{item.orderTicketDetailList[0].ticketCode}}
</text> </text>
<text @click="copyText(item.orderTicketDetailList[0].verifyCode)"> <text @click="copyText(item.orderTicketDetailList[0].ticketCode)">
复制 复制
</text> </text>
</view> </view>
...@@ -854,6 +854,7 @@ export default { ...@@ -854,6 +854,7 @@ export default {
}, },
//---生成二维码 //---生成二维码
getCode(item){ getCode(item){
//生成二维码码取值verifyCode，页面显示取值ticketCode--生成二维码比页面显示多一个TBD
let verifyCode='' let verifyCode=''
if(item.orderTicketDetailList.length>0){ if(item.orderTicketDetailList.length>0){
verifyCode=item.orderTicketDetailList[0].verifyCode||'' verifyCode=item.orderTicketDetailList[0].verifyCode||''
...@@ -1036,7 +1037,6 @@ export default { ...@@ -1036,7 +1037,6 @@ export default {
}) })
} }
} }
} }
</script> </script>
......
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