Commit 8f10bc98 authored by 潘永坪's avatar 潘永坪

弹窗修改

parent c86d9003
<template> <template>
<u-popup v-model="showPop" mode="bottom" border-radius="14" closeable height="85%"> <u-popup :show="showPop" :round="20" @close="showPop=false">
<view class="son-wrap"> <view class="son-wrap">
<view class="head"> <view class="head">
<view class="head1"> <view class="head1">
购买须知 <view style="flex: 1;text-align: center;">
购买须知
</view>
<u-icon name="close" @click="showPop=false"></u-icon>
</view> </view>
<view class="head2"> <view class="head2">
{{buyKnowData.name}} {{buyKnowData.name}}
...@@ -12,39 +15,43 @@ ...@@ -12,39 +15,43 @@
<view class="head3"> <view class="head3">
挂牌价:¥{{buyKnowData.originalPrice}} 挂牌价:¥{{buyKnowData.originalPrice}}
</view> </view>
</view> </view>
<view class="middle"> <view style="flex: 1;overflow-y: scroll;">
<view class="middle-list" v-for="(item,a) of buyKnowData.productTitleResVos" :key="a"> <view class="middle">
<view class="middle-title"> <view class="middle-list" v-for="(item,a) of buyKnowData.productTitleResVos" :key="a">
{{item.title}} <view class="middle-title">
</view> {{item.title}}
<view class="middle-content" v-for="(items,b) of item.productChildTitleData" :key="b"> </view>
<text> <view class="middle-content" v-for="(items,b) of item.productChildTitleData" :key="b">
{{items.title}} <text>
</text> {{items.title}}
<view>
<!--<text>随买随用</text>-->
<text v-for="(itemss,c) of items.contentList" :key="c" class="content-child">
{{itemss.content}}
</text> </text>
<view>
<!--<text>随买随用</text>-->
<text v-for="(itemss,c) of items.contentList" :key="c" class="content-child">
{{itemss.content}}
</text>
</view>
</view> </view>
</view> </view>
</view> </view>
</view>
<view class="bottom">
<view class="bottom"> <text class="bottom-left">
<text class="bottom-left"> ¥ <text>{{buyKnowData.sellingPrice}}</text>
¥ <text>{{buyKnowData.sellingPrice}}</text>
</text>
<view class="bottom-right">
<text class="btn" @click="showPop=false">
去预订
</text> </text>
<view class="bottom-right">
<text class="btn" @click="showPop=false">
去预订
</text>
</view>
</view> </view>
</view> </view>
</view> </view>
</u-popup> </u-popup>
</template> </template>
...@@ -63,102 +70,99 @@ export default { ...@@ -63,102 +70,99 @@ export default {
</script> </script>
<style scoped="scoped"> <style scoped="scoped">
.son-wrap{ .son-wrap{
font-size: 24rpx; position: relative;
position: relative; height:85vh;
} display: flex;
.head { flex-direction:column;
padding: 100rpx 24rpx 0 24rpx; }
} .head{
.head1{ padding: 0 24rpx;
text-align: center; }
font-size: 32rpx; .head1{
font-weight: bold; display: flex;
text-align: center; font-size: 32rpx;
padding: 30rpx 0; font-weight: bold;
position:fixed; padding: 30rpx 0;
top: 0; border-radius: 20rpx 20rpx 0 0;
width: 100%; }
background: #fff; .head2{
z-index: 1; font-weight: bolder;
} font-size: 32rpx;
.head2{ line-height: 40rpx;
font-weight: bolder; }
font-size: 32rpx; .head3{
line-height: 40rpx; font-size: 28rpx;
} margin-top: 20rpx;
.head3{ color: #666666;
font-size: 28rpx; border-bottom: 1px solid #e6e6e6;
margin-top: 20rpx; padding-bottom: 30rpx;
color: #666666; }
border-bottom: 1px solid #e6e6e6; .middle {
padding-bottom: 30rpx; padding-bottom: 100rpx;
} font-size: 28rpx;
.middle { }
padding-bottom: 100rpx; .middle-list {
font-size: 28rpx; margin: 30rpx 24rpx;
} padding-bottom: 24rpx;
.middle-list { border-bottom: 1px solid #E6E6E6;
margin: 30rpx 24rpx; }
padding-bottom: 24rpx; .middle-title{
border-bottom: 1px solid #E6E6E6; font-size: 32rpx;
} font-weight: bold;
.middle-title{ }
font-size: 32rpx; .middle-content {
font-weight: bold; display: flex;
} margin-top: 30rpx;
.middle-content { position: relative;
display: flex; }
margin-top: 30rpx; .middle-content>text {
position: relative; color: #666666;
} margin-right: 30rpx;
.middle-content>text { width: 120rpx;
color: #666666; display: inline-block;
margin-right: 30rpx; white-space: nowrap;
width: 120rpx; text-overflow: ellipsis;
display: inline-block; overflow: hidden;
white-space: nowrap; flex-shrink: 0;
text-overflow: ellipsis; font-size: 26rpx;
overflow: hidden; position: relative;
flex-shrink: 0; }
font-size: 26rpx; .middle-content view {
position: relative; display: flex;
} flex-direction: column;
.middle-content view { justify-content: center;
display: flex; }
flex-direction: column; .bottom {
justify-content: center; display: flex;
} justify-content: space-between;
.bottom { padding: 0 24rpx;
display: flex; height: 100rpx;
justify-content: space-between; align-items: center;
padding: 0 24rpx; position: fixed;
height: 100rpx; bottom: 0;
align-items: center; width: 100%;
position: fixed; z-index: 9;
bottom: 0; background: #FFFFFF;
width: 100%; box-sizing: border-box;
z-index: 9; }
background: #FFFFFF;
box-sizing: border-box;
}
.bottom-left{ .bottom-left{
color: #f9690e; color: #f9690e;
} }
.bottom-left text { .bottom-left text {
font-size: 36rpx; font-size: 36rpx;
font-weight: bolder; font-weight: bolder;
} }
.bottom view { .bottom view {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.btn{ .btn{
padding: 16rpx 48rpx; padding: 16rpx 48rpx;
border-radius: 20rpx; border-radius: 20rpx;
font-size: 32rpx; font-size: 32rpx;
} }
</style> </style>
<template> <template>
<!-- 客服 --> <!-- 客服 -->
<u-popup v-model="showPop" mode="bottom" border-radius="14" closeable height="75%"> <u-popup :show="showPop" :round="20" @close="showPop = false">
<view class="son-wrap"> <view class="son-wrap">
<view class="title"> <view class="title">
客服电话 <view style="flex: 1; text-align: center"> 客服电话 </view>
<u-icon name="close" @click="showPop = false"></u-icon>
</view> </view>
<view class="middle"> <view class="middle">
<view class="list" v-for="(item,index) in scenicList" :key='index' @click="makePhone(item.phone)"> <view class="list" v-for="(item, index) in scenicList" :key="index" @click="makePhone(item.phone)">
<text> {{ item.name }}: </text>
<text> <text>
{{item.name}}: {{ item.phone }}
</text>
<text>
{{item.phone}}
</text> </text>
</view> </view>
</view> </view>
...@@ -20,50 +19,49 @@ ...@@ -20,50 +19,49 @@
</template> </template>
<script> <script>
export default{ export default {
props:['scenicList'], props: ['scenicList'],
data(){ data() {
return{ return {
showPop:false,//控制弹窗显示隐藏 showPop: false //控制弹窗显示隐藏
} }
}, },
methods:{ methods: {
//---拨打电话 //---拨打电话
makePhone(phoneNumber){ makePhone(phoneNumber) {
uni.makePhoneCall({ uni.makePhoneCall({
phoneNumber phoneNumber
}) })
} }
} }
} }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.son-wrap{ .son-wrap {
position: relative; position: relative;
} height: 65vh;
.title{ display: flex;
text-align: center; flex-direction: column;
font-size: 32rpx; }
font-weight: bold; .title {
padding: 30rpx 0; display: flex;
position:fixed; font-size: 32rpx;
top: 0; font-weight: bold;
width: 100%; padding: 30rpx;
background: #fff; background: #fff;
z-index: 1; border-radius: 20rpx 20rpx 0 0;
} }
.middle{ .middle {
padding-top: 100rpx; flex: 1;
} overflow-y: scroll;
.list{ }
height:100rpx; .list {
border-bottom: 1px solid #E6E6E6; height: 100rpx;
padding: 0 24rpx; border-bottom: 1px solid #e6e6e6;
display: flex; padding: 0 24rpx;
align-items: center; display: flex;
justify-content: space-between; align-items: center;
} justify-content: space-between;
}
</style> </style>
\ No newline at end of file
<template> <template>
<!-- 商家详情弹窗 --> <!-- 商家详情弹窗 -->
<u-popup v-model="showPop" mode="bottom" border-radius="14" closeable height="85%"> <u-popup :show="showPop" :round="20" @close="showPop=false">
<view class="son-wrap"> <view class="son-wrap">
<view class="head"> <view class="head">
{{detailData.name}} <view class="head-name">
</view> {{detailData.name}}
<view style="padding-top: 100rpx;">
<u-swiper :list="detailData.imgList" mode="number" height="350" name="url"></u-swiper>
</view>
<view class="middle">
<!-- 景区介绍 -->
<view class="introduce">
<view class="middle-title">
介绍
</view>
<view v-html="detailData.introduce">
</view>
<view class="middle-title" style="margin-top: 20rpx;">
用时参考
</view>
<view>
建议游玩时长:{{detailData.timeSpent}}
</view>
</view> </view>
<!-- 开放时间 --> <u-icon name="close" @click="showPop=false"></u-icon>
<view class="opentime"> </view>
<view class="middle-title">开放时间</view> <view style="flex: 1;overflow-y: scroll;">
<table border-color="#04a7f4" > <view>
<tr v-if="!times"> <u-swiper :list="detailData.imgList" mode="number" height="350" name="url"></u-swiper>
<td>每天</td>
</tr>
<tr v-if="!times">
<td>
{{detailData.businessStart?detailData.businessStart.substr(0,5):""}}
~{{detailData.businessEnd?detailData.businessEnd.substr(0,5):""}}
</td>
</tr>
<tr v-if="times">
<td colspan="2">开放时间</td>
</tr>
<tr v-for="(item,index) of times" :key="index" v-if="times">
<td v-for="(items,b) of item" :key="b" v-if="items!=''">
{{items}}
</td>
</tr>
</table>
</view> </view>
<!-- 优待政策 --> <view class="middle">
<view class="policy" v-if="policy"> <!-- 景区介绍 -->
<view class="middle-title" style="padding-bottom: 4rpx;"> <view class="introduce">
{{policy.childTitle}} <view class="middle-title">
介绍
</view>
<view v-html="detailData.introduce">
</view>
<view class="middle-title" style="margin-top: 20rpx;">
用时参考
</view>
<view>
建议游玩时长:{{detailData.timeSpent}}
</view>
</view> </view>
<view v-for="(item,index) of policy.contentList" :key="index" style="margin-top: 20rpx;"> <!-- 开放时间 -->
{{item.content}} <view class="opentime">
<view class="middle-title">开放时间</view>
<table border-color="#04a7f4" >
<tr v-if="!times">
<td>每天</td>
</tr>
<tr v-if="!times">
<td>
{{detailData.businessStart?detailData.businessStart.substr(0,5):""}}
~{{detailData.businessEnd?detailData.businessEnd.substr(0,5):""}}
</td>
</tr>
<tr v-if="times">
<td colspan="2">开放时间</td>
</tr>
<tr v-for="(item,index) of times" :key="index" v-if="times">
<td v-for="(items,b) of item" :key="b" v-if="items!=''">
{{items}}
</td>
</tr>
</table>
</view> </view>
</view> <!-- 优待政策 -->
<!--景区设施 --> <view class="policy" v-if="policy">
<view class="facilities" v-if="facilities"> <view class="middle-title" style="padding-bottom: 4rpx;">
<view class="middle-title" style="padding-bottom: 4rpx;"> {{policy.childTitle}}
{{facilities.title}} </view>
<view v-for="(item,index) of policy.contentList" :key="index" style="margin-top: 20rpx;">
{{item.content}}
</view>
</view> </view>
<view class="fac-content" v-for="(item,a) of facilities.merchantChildTitleData" :key="a"> <!--景区设施 -->
<text class="fac-left"> <view class="facilities" v-if="facilities">
{{item.childTitle}} <view class="middle-title" style="padding-bottom: 4rpx;">
</text> {{facilities.title}}
</view>
<view class="fac-right"> <view class="fac-content" v-for="(item,a) of facilities.merchantChildTitleData" :key="a">
<text v-for="(items,b) of item.contentList" :key="b"> <text class="fac-left">
{{items.content}} {{item.childTitle}}
</text> </text>
<view class="fac-right">
<text v-for="(items,b) of item.contentList" :key="b">
{{items.content}}
</text>
</view>
</view> </view>
</view> </view>
</view> <!-- 出行贴士 -->
<!-- 出行贴士 --> <view class="travelTips" v-if="travelTips">
<view class="travelTips" v-if="travelTips"> <view class="middle-title" style="padding-bottom: 4rpx;">
<view class="middle-title" style="padding-bottom: 4rpx;"> {{travelTips.title}}
{{travelTips.title}} </view>
</view> <view class="travel-content" v-for="(item,a) of travelTips.merchantChildTitleData" :key="a">
<view class="travel-content" v-for="(item,a) of travelTips.merchantChildTitleData" :key="a"> <text class="travel-left">
<text class="travel-left"> {{item.childTitle}}
{{item.childTitle}}
</text>
<view class="travel-right">
<text v-for="(items,b) of item.contentList" :key="b">
{{items.content}}
</text> </text>
<view class="travel-right">
<text v-for="(items,b) of item.contentList" :key="b">
{{items.content}}
</text>
</view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</u-popup> </u-popup>
</template> </template>
...@@ -158,17 +164,22 @@ export default { ...@@ -158,17 +164,22 @@ export default {
<style scoped="scoped" lang="scss"> <style scoped="scoped" lang="scss">
.son-wrap{ .son-wrap{
position: relative; position: relative;
height:80vh;
display: flex;
flex-direction:column;
} }
.head{ .head{
text-align: center; display: flex;
font-size: 32rpx; font-size: 32rpx;
font-weight: bold; font-weight: bold;
padding: 30rpx 0; padding: 30rpx;
position:fixed;
top: 0;
width: 100%;
background: #fff; background: #fff;
z-index: 1; border-radius: 20rpx 20rpx 0 0;
border-bottom: 1px solid #f5f5f5;
}
.head-name{
flex: 1;
text-align: center;
} }
.middle{ .middle{
padding: 24rpx 24rpx 80rpx 24rpx; padding: 24rpx 24rpx 80rpx 24rpx;
......
<template> <template>
<!----------------适用于订单选择券的时候展示券列表--------------------------> <!----------------适用于订单选择券的时候展示券列表-------------------------->
<u-popup v-model="show" mode="bottom"> <u-popup :show="show" :round="20" closeable @close="show=false">
<view class="title"> <view class="title">
<view class="titleContent" v-for="(item,index) of navTitle" :key="index" :class="{on:active==index}" @click="navClick(index)"> <view class="titleContent" v-for="(item,index) of navTitle" :key="index" :class="{on:active==index}" @click="navClick(index)">
<view style="position: relative;top:15rpx;">{{item}}</view> <view style="position: relative;top:15rpx;">{{item}}</view>
......
...@@ -53,7 +53,7 @@ ...@@ -53,7 +53,7 @@
</view> </view>
<view class="product-price"> <view class="product-price">
<view style="font-size: 24rpx"> <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="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>
...@@ -74,12 +74,12 @@ ...@@ -74,12 +74,12 @@
</label> </label>
<view class="product-more" v-if="index > 0 && item.productList.length > 2"> <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 style="display: flex;justify-content: center;" v-if="item.productListCopy.length != item.productList.length" @click="showMoreProduct(item)">
更多 更多
<u-icon name="arrow-down"></u-icon> <u-icon name="arrow-down"></u-icon>
</view> </view>
<view v-else @click="retractProduct(item)"> <view style="display: flex;justify-content: center;" v-else @click="retractProduct(item)">
收起 收起
<u-icon name="arrow-up"></u-icon> <u-icon name="arrow-up"></u-icon>
</view> </view>
...@@ -707,6 +707,7 @@ export default { ...@@ -707,6 +707,7 @@ export default {
.title-right { .title-right {
color: $grey; color: $grey;
font-size: 24rpx; font-size: 24rpx;
display: flex;
} }
.product { .product {
padding: 10rpx 16rpx; padding: 10rpx 16rpx;
...@@ -816,6 +817,7 @@ export default { ...@@ -816,6 +817,7 @@ export default {
.bottom-detail { .bottom-detail {
position: relative; position: relative;
text-align: center; text-align: center;
display: flex;
} }
.bottom-number { .bottom-number {
display: inline-block; display: inline-block;
...@@ -862,15 +864,16 @@ export default { ...@@ -862,15 +864,16 @@ export default {
} }
} }
.album-btn{ .album-btn{
display: inline-block; display: flex;
width: 160rpx; width: 160rpx;
height: 44rpx; height: 44rpx;
background: #E1E1D9; background: #E1E1D9;
border-radius: 20rpx 20rpx 20rpx 20rpx; border-radius: 20rpx 20rpx 20rpx 20rpx;
font-size: 22rpx; font-size: 22rpx;
color: #333333; color: #333333;
text-align: center; align-items: center;
line-height: 44rpx; justify-content: center;
padding-left: 8rpx;
} }
.swiper-item /deep/ .u-waterfall{ .swiper-item /deep/ .u-waterfall{
padding-top:8rpx; padding-top:8rpx;
......
<template> <template>
<!-- 详情 --> <!-- 详情 -->
<u-popup v-model="showPop" mode="bottom" border-radius="14" closeable height="75%"> <u-popup :show="showPop" :round="20" @close="showPop = false">
<view class="son-wrap"> <view class="son-wrap">
<view class="title"> <view class="title">
明细 <view style="flex: 1; text-align: center">
明细
</view>
<u-icon name="close" @click="showPop = false"></u-icon>
</view> </view>
<view style="flex: 1;overflow-y: scroll;">
<view class="middle"> <view class="middle">
<view class="merchantlist" v-for="(item,index) in merchantList" :key="index"> <view class="merchantlist" v-for="(item,index) in merchantList" :key="index">
<view class="merchant-title"> <view class="merchant-title">
{{item.merchantName}} {{item.merchantName}}
</view>
<view class="productlist" v-for="(items,a) in item.productlist" :key='a'>
<text>
{{items.name}}
</text>
<text style="font-weight: bold;">
¥{{items.sellingPrice}}
</text>
</view>
</view> </view>
<view class="productlist" v-for="(items,a) in item.productlist" :key='a'> </view>
<text>
{{items.name}} <view class="bottom">
</text> <view class="bottom-left">
<text style="font-weight: bold;"> 合计:¥
¥{{items.sellingPrice}} <text style="font-weight: bold;font-size: 40rpx;">{{priceTotal}}</text>
</view>
<view class="bottom-right">
<text class="btn" @click="goFillorder()">
去预订
</text> </text>
</view> </view>
</view> </view>
</view> </view>
<view class="bottom">
<view class="bottom-left">
合计:¥
<text style="font-weight: bold;font-size: 40rpx;">{{priceTotal}}</text>
</view>
<view class="bottom-right">
<text class="btn" @click="goFillorder()">
去预订
</text>
</view>
</view>
</view> </view>
</u-popup> </u-popup>
</template> </template>
...@@ -91,21 +96,20 @@ export default { ...@@ -91,21 +96,20 @@ export default {
<style scoped="scoped" lang="scss"> <style scoped="scoped" lang="scss">
.son-wrap{ .son-wrap{
position: relative; position: relative;
} height:80vh;
display: flex;
flex-direction:column;
}
.title{ .title{
text-align: center; display: flex;
font-size: 32rpx; font-size: 32rpx;
font-weight: bold; font-weight: bold;
text-align: center; padding: 30rpx;
padding: 30rpx 0;
position:fixed;
top: 0;
width: 100%;
background: #fff; background: #fff;
z-index: 1; border-radius: 20rpx 20rpx 0 0;
} }
.middle { .middle {
padding: 100rpx 24rpx; padding:0 24rpx 100rpx 24rpx;
} }
.merchantlist{ .merchantlist{
border-bottom:2rpx solid #ececec; border-bottom:2rpx solid #ececec;
......
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