Skip to content

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

填写订单页面开发

parent 267bf1ae
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 892 additions and 881 deletions
App.vue
View file @ 34f47abe
......@@ -101,14 +101,36 @@ export default {
textarea {
box-sizing: border-box;
}
.btn {
background: linear-gradient(132deg, #ED400C 0%, #FB862C 100%);
//小按钮
.btn{
background:linear-gradient(132deg, #ED400C 0%, #FB862C 100%);
display: inline-block;
color: #FFFFFF;
font-size: 28rpx;
border-radius: 8rpx;
font-size:28rpx;
border-radius:8rpx;
text-align: center;
padding: 16rpx 32rpx;
}
//中等按钮
.middle-btn{
background:linear-gradient(132deg, #ED400C 0%, #FB862C 100%);
display: inline-block;
color: #FFFFFF;
font-size:32rpx;
border-radius:12rpx;
text-align: center;
padding: 18rpx 40rpx;
}
//大按钮
.big-btn{
background:linear-gradient(132deg, #ED400C 0%, #FB862C 100%);
display: inline-block;
color: #FFFFFF;
font-size:36rpx;
border-radius:28rpx;
text-align: center;
padding: 10rpx 20rpx;
padding: 20rpx 80rpx;
font-weight: bold;
}
/*单行溢出*/
......
common/common.js
View file @ 34f47abe
......@@ -101,6 +101,9 @@ export default{
idReg:function(){//身份证正则
return /^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X|x)$/
},
nameReg:function(){//中文名字正则
return /^[\u4E00-\u9FA5]{2,40}$/
},
getUrlKey:function(name,url){//通过连接地址获取参数值
return(new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(decodeURIComponent(url)) || [, ''])[1].replace(/\+/g, '%20') || ''
},
......
components/buyKnow.vue
View file @ 34f47abe
<template>
<u-popup :show="showPop" :round="20" @close="showPop=false">
<u-popup :show="showPop" :round="20" @close="showPop=false" closeable>
<view class="son-wrap">
<view class="head">
<view class="head1">
<view style="flex: 1;text-align: center;">
购买须知
</view>
<u-icon name="close" @click="showPop=false"></u-icon>
</view>
<view class="head2">
{{buyKnowData.name}}
......@@ -20,7 +17,7 @@
<view style="flex: 1;overflow-y: scroll;">
<view class="middle">
<view class="middle-list" v-for="(item,a) of buyKnowData.productTitleResVos" :key="a">
<view class="middle-list" v-for="(item,a) of buyKnowData.productTitleData" :key="a">
<view class="middle-title">
{{item.title}}
</view>
......@@ -72,7 +69,7 @@ export default {
<style scoped="scoped">
.son-wrap{
position: relative;
height:85vh;
height:80vh;
display: flex;
flex-direction:column;
}
......@@ -80,7 +77,7 @@ export default {
padding: 0 24rpx;
}
.head1{
display: flex;
text-align: center;
font-size: 32rpx;
font-weight: bold;
padding: 30rpx 0;
......@@ -113,8 +110,9 @@ export default {
}
.middle-content {
display: flex;
margin-top: 30rpx;
margin-top: 20rpx;
position: relative;
line-height: 52rpx;
}
.middle-content>text {
color: #666666;
......
components/customer.vue
View file @ 34f47abe
<template>
<!-- 客服 -->
<u-popup :show="showPop" :round="20" @close="showPop = false">
<u-popup :show="showPop" :round="20" @close="showPop = false" closeable>
<view class="son-wrap">
<view class="title">
<view style="flex: 1; text-align: center"> 客服电话 </view>
<u-icon name="close" @click="showPop = false"></u-icon>
客服电话
</view>
<view class="middle">
<view class="list" v-for="(item, index) in scenicList" :key="index" @click="makePhone(item.phone)">
......@@ -45,7 +44,7 @@ export default {
flex-direction: column;
}
.title {
display: flex;
text-align: center;
font-size: 32rpx;
font-weight: bold;
padding: 30rpx;
......
components/merchantDetail.vue
View file @ 34f47abe
<template>
<!-- 商家详情弹窗 -->
<u-popup :show="showPop" :round="20" @close="showPop=false">
<u-popup :show="showPop" :round="20" @close="showPop=false" closeable>
<view class="son-wrap">
<view class="head">
<view class="head-name">
{{detailData.name}}
</view>
<u-icon name="close" @click="showPop=false"></u-icon>
{{detailData.name}}
</view>
<view style="flex: 1;overflow-y: scroll;">
<view v-if="detailData.imgList&&detailData.imgList.length>0">
......@@ -166,7 +163,7 @@ export default {
flex-direction:column;
}
.head{
display: flex;
text-align: center;
font-size: 32rpx;
font-weight: bold;
padding: 30rpx;
......
pages/scenic/scenicComponents/calendar.vue
View file @ 34f47abe
<template>
<div>
<u-calendar
:show="show"
@confirm="onConfirm"
......@@ -8,51 +7,37 @@
:defaultDate="defaultDate"
:formatter='formatter'
ref="calendar2"
rowHeight='112'
round='20'
closeOnClickOverlay='true'
></u-calendar>
</div>
</template>
<script>
export default {
props: ['dateList'],
watch: {
dateList:{
handler(newValue, oldValue){
if(newValue&&newValue.length>0){
this.maxDate=newValue[newValue.length-1].startTime.substr(0,10)
}
},
deep:true,
immediate:true
}
dateList:{
handler(newValue, oldValue){
if(newValue&&newValue.length>0){
this.maxDate=newValue[newValue.length-1].startTime.substr(0,10)
}
},
deep:true,
immediate:true
}
},
data() {
return {
date: '', //选择的日期
show: false, //控制日历显示隐藏
defaultDate:'', //默认日期
maxDate:'',//最大日期
}
},
mounted() { //默认为第一天
mounted() {
this.$refs.calendar2.setFormatter(this.formatter)
},
methods: {
//---年月日转化
formatDate(date) {
let year = date.getFullYear()
let month = date.getMonth() + 1
if (month < 10) {
month = '0' + month
}
let days = date.getDate()
if (days < 10) {
days = '0' + days
}
let dates = year + '-' + month + '-' + days
return dates
},
//---日期确认事件
onConfirm(date) {
this.show = false
......@@ -73,23 +58,16 @@ export default {
//真机调试手极端报错，暂时注释
// this.dateList.forEach((item, index) => {
// if (item.startTime.substr(0, 10) == dates) {
// day.bottomInfo = "¥" + item.sellingPrice
// day.bottomInfo = '¥' + item.sellingPrice
// day.dot = true
// }
// })
// if (!day.bottomInfo) {
// day.type = "disabled"
// day.type = 'disabled'
// }
return day
},
//---设置默认日期方法
setDefaultDate(val) {
let dates = val.split('-')
let year = parseInt(dates[0])
let month = parseInt(dates[1]) - 1
let day = parseInt(dates[2])
this.defaultDate = new Date(year, month, day)
},
}
}
}
</script>
......
pages/scenic/scenicComponents/contactList.vue
View file @ 34f47abe
<template>
<view class="contact-box">
<u-popup :show="contactsShow" @close="contactsShow=false">
<u-popup :show="showPop" :round="20" @close="showPop=false" closeable>
<view class="son-wrap">
<view class="top">
<u-icon name="close" @click="contactsShow=false"></u-icon>
<text>
<view class="top-num">
需填写{{buyNum}}位联系人
<text v-if="buyNum-chooseContact.length>0">
,还需
<text class="top-number">{{buyNum-chooseContact.length}}</text>
位出行人
</text>
</text>
<text @click="config()" class="top-sure">
确定
</text>
</view>
<view class="bottom">
<view @click="showEdit()" class="bottom-add">
</view>
<view @click="showEdit()" class="top-add">
<text>
+添加旅客信息
</text>
</view>
</view>
<view class="bottom">
<checkbox-group @change="chooseContactChange">
<view class="bottom-list" v-for="(item,index) of contactData" :key="item.id">
<label>
......@@ -32,7 +21,7 @@
<view>
{{item.name}}
</view>
<view>
<text>
身份证
......@@ -41,156 +30,156 @@
</view>
</view>
</label>
<view @click="goEdit(item)" style="margin-right:20rpx;">
<u-icon name="edit-pen" color="#3688ff" size="28"></u-icon>
<u-icon name="edit-pen" color="#3688ff" size="56"></u-icon>
</view>
<view @click="clickDele(item.id)">
<u-icon name="trash-fill" color="#3688ff" size="28"></u-icon>
<u-icon name="trash-fill" color="#3688ff" size="56"></u-icon>
</view>
<u-modal :show="showModal" @confirm="confirmDele" @cancel="showModal=false" showCancelButton title="确认删除该联系人" ></u-modal>
</view>
<view style="margin: 40rpx 0;text-align: center;" v-if='contactData&&contactData.length>0'>
已展示所有联系人
</view>
</checkbox-group>
<view class="bottom-sure">
确定
</view>
</view>
</u-popup>
</view>
</view>
<u-modal :show="showModal" @confirm="confirmDele" @cancel="showModal=false" showCancelButton title="确认删除该联系人" ></u-modal>
</u-popup>
</template>
<script>
export default {
props: ["contactData", "orderTouristList", "buyNum"],
watch: {
orderTouristList: {
handler(newValue, oldValue) {
if (newValue) {
this.chooseContact = this.orderTouristList
}
},
deep: true,
immediate: true
}
},
data() {
return {
contactsShow: false, //控制联系人弹窗显示隐藏
chooseContact: [], //选中的联系人
showModal: false, //确认弹窗显示隐藏
contactId:'',//删除联系人的Id
export default {
props: ['contactData', 'orderTouristList', 'buyNum'],
watch: {
orderTouristList: {
handler(newValue, oldValue) {
if (newValue) {
this.chooseContact = this.orderTouristList
}
},
deep: true,
immediate: true
}
},
data() {
return {
showPop: false, //控制联系人弹窗显示隐藏
chooseContact: [], //选中的联系人
showModal: false, //确认弹窗显示隐藏
contactId:'',//删除联系人的Id
}
},
methods: {
//---点击新增，展示编辑联系人弹窗,并传空值给编辑弹窗
showEdit() {
this.contactsShow=false
this.$parent.showEdit()
this.$emit("getEditContact", "")
},
//---展示编辑弹窗，并传值给编辑弹窗
goEdit(obj) {
this.contactsShow=false
this.$parent.showEdit()
this.$emit("getEditContact", obj)
},
//---确定选中的联系人
config() {
this.contactsShow = false
this.$emit("contactListConfig", this.chooseContact)
}
},
methods: {
//---点击新增，展示编辑联系人弹窗,并传空值给编辑弹窗
showEdit() {
this.showPop=false
this.$parent.showEdit()
this.$emit('getEditContact', '')
},
//---展示编辑弹窗，并传值给编辑弹窗
goEdit(obj) {
this.showPop=false
this.$parent.showEdit()
this.$emit('getEditContact', obj)
},
//---确定选中的联系人
config() {
this.showPop = false
this.$emit('contactListConfig', this.chooseContact)
},
//---联系人姓名变化
chooseContactChange(e){
let value=e.detail.value
let arr=[]
value.forEach(item=>{
arr.push(JSON.parse(item))
})
this.chooseContact=arr
if (arr.length == this.buyNum) { //当选择的人数等于需要填的人数时关闭弹窗
this.config()
}
if (arr.length > this.buyNum) {
arr.shift()
this.config()
}
},
//---点击删除
clickDele(id) {
this.showModal = true
this.contactId=id
},
//---确认删除
confirmDele(){
let data={
id:this.contactId
}
this.$request('wechatUser/contact/deleteContact', data).then((res) => {
if (res.code == '00') {
uni.showToast({
title:'删除成功',
icon:'none'
})
this.showModal = false
this.contactsShow=false
this.$parent.getContactList()
} else {
uni.showToast({
title:res.message,
icon:'none'
})
}
}).catch(() => {
this.showModal = false
})
}
}
}
},
//---联系人姓名变化
chooseContactChange(e){
let value=e.detail.value
let arr=[]
value.forEach(item=>{
arr.push(JSON.parse(item))
})
this.chooseContact=arr
if (arr.length > this.buyNum) {
arr.shift()
}
},
//---点击删除
clickDele(id) {
this.showModal = true
this.contactId=id
},
//---确认删除
confirmDele(){
let data={
id:this.contactId
}
this.$request('wechatUser/contact/deleteContact', data).then((res) => {
if (res.code == '00') {
uni.showToast({
title:'删除成功',
icon:'none'
})
this.showModal = false
this.showPop=false
this.$parent.getContactList()
} else {
uni.showToast({
title:res.message,
icon:'none'
})
}
}).catch(() => {
this.showModal = false
})
}
}
}
</script>
<style scoped="scoped" lang="scss">
.top {
height:100rpx;
.son-wrap{
height: 100vh;
display: flex;
justify-content: space-between;
background: #f0f0f0;
align-items: center;
padding: 0 24rpx;
flex-direction:column;
}
.top-sure {
color: var(--main-color);
font-size: 28rpx;
}
.top-number{
color: #f9690e;
.top-num{
height: 100rpx;
display: flex;
align-items: center;
background: #FFF1E8;
color: #FC771D;
justify-content: center;
font-weight: bold;
font-size: 32rpx;
font-weight:bold;
}
.bottom {
padding:0 24rpx 80rpx 24rpx;
}
.bottom-add {
height:130rpx;
.top-add {
height:150rpx;
display: flex;
align-items: center;
border-bottom: 1px solid #e6e6e6;
width: 100%;
justify-content: center;
border-bottom: 1px solid #e6e6e6;
padding: 0 24rpx;
background: #ECF3FE;
}
.bottom-add text{
width:280rpx;
height: 65rpx;
text-align: center;
line-height:65rpx;
border: 1px solid var(--main-color);
color:var(--main-color);
.top-add text{
display: inline-block;
width:100%;
height: 76rpx;
text-align: center;
line-height:76rpx;
border: 1px solid $theme;
color:$theme;
border-radius:5rpx;
box-shadow:0px 0px 12px 2px rgba(0,0,0,0.08);
}
.bottom {
padding:0 24rpx 80rpx 24rpx;
flex: 1;
overflow-y: scroll;
}
.bottom-list{
display: flex;
justify-content: space-between;
......@@ -198,29 +187,38 @@
border-bottom: 1px solid #E6E6E6;
padding:25rpx 0;
}
.bottom-list label {
display: flex;
flex: 1;
align-items: center;
}
.bottom-content {
flex: 1;
margin-left: 40rpx;
}
.bottom-content view {
font-size:28rpx;
color: #666666;
}
.bottom-content view:not(:first-child) {
margin-top: 10rpx;
}
.bottom-content view text {
display: inline-block;
width: 100rpx;
}
.bottom-sure{
position: fixed;
bottom: 0;
left: 0;
width: 100%;
height: 100rpx;
display: flex;
align-items: center;
justify-content: center;
background: #3688ff;
font-size:32rpx;
font-weight: bold;
color: #ffffff;
}
</style>
pages/scenic/scenicComponents/detail.vue
View file @ 34f47abe
<template>
<view>
<u-popup :show="show" :round="10" closeable @close="show=false">
<view class="detail">
<view class="detail-title">
费用明细
</view>
<view class="detail-content">
<view class="content-box">
<text>
{{merchantName}}({{name}})
</text>
<u-popup :show="show" :round="20" @close="show = false" closeable>
<view class="son-wrap">
<view class="detail-title">
订单明细
</view>
<view class="content-right">
<view>¥{{sellingPrice}}x{{buyNum}}份</view>
<view v-if="productDepositTotal">押金：{{productDepositTotal}}</view>
</view>
</view>
<!-- ---------------------------------------额外服务------------------------------------------- -->
<view class="content-box" v-for="(item,index) of choooseServiceData" :key="index">
<text>
{{item.name}}
</text>
<view style="flex: 1; overflow-y: scroll">
<view class="content-box">
<text> {{ merchantName }}({{ name }}) </text>
<view class="content-right">
<view>¥{{item.sellingPrice}}x{{buyNum}}份</view>
<view v-if="item.depositTotal">押金：{{item.depositTotal}}</view>
</view>
<view class="content-right">
<view>¥{{ sellingPrice }}x{{ buyNum }}份</view>
<view v-if="productDepositTotal">押金：{{ productDepositTotal }}</view>
</view>
<view class="content-box" v-if="chooseCouponObj&&chooseCouponObj.savedMoney>0">
<text>
券
</text>
</view>
<!-- ---------------------------------------额外服务------------------------------------------- -->
<view class="content-box" v-for="(item, index) of choooseServiceData" :key="index">
<text>
{{ item.name }}
</text>
<text class="content-right">
-¥{{parseFloat(chooseCouponObj.savedMoney.toFixed(2))}}
</text>
<view class="content-right">
<view>¥{{ item.sellingPrice }}x{{ buyNum }}份</view>
<view v-if="item.depositTotal">押金：{{ item.depositTotal }}</view>
</view>
</view>
<view class="content-box" v-if="chooseCouponObj && chooseCouponObj.savedMoney > 0">
<text> 券 </text>
<view class="content-box content-total">
<text>
合计
</text>
<text class="content-right"> -¥{{ parseFloat(chooseCouponObj.savedMoney.toFixed(2)) }} </text>
</view>
<text class="content-right">
¥<text style="font-size:36rpx;">{{sellTotal}}</text>
</text>
</view>
<view class="content-box content-total">
<text> 合计 </text>
<text class="content-right">
¥<text style="font-size: 36rpx">{{ sellTotal }}</text>
</text>
</view>
</view>
</u-popup>
</view>
</view>
</u-popup>
</template>
<script>
export default {
props: ["merchantName", "name", "buyNum", "sellingPrice", "productDepositTotal", "chooseCouponObj", "choooseService"],
watch: {
choooseService: {
handler(newValue, oldValue) {
if (newValue) {
this.choooseServiceData = this.choooseService
}
},
deep: false,
immediate: false
}
},
data() {
return {
show: false, //控制弹窗显示隐藏
extraPrice: 0, //额外服务价格
depositTotal: 0, //额外服务总押金
choooseServiceData: [], //选中的服务
}
},
computed: {
sellTotal() { //卖价总价
let savedMoney=0
if(this.chooseCouponObj){
savedMoney = this.chooseCouponObj.savedMoney
}
if (this.choooseServiceData.length > 0) { //额外服务价格
let singleMoney = 0 //单个产品总押金，用于算出总押金
this.extraPrice = 0
this.depositTotal = 0 //总押金
for (let i = 0; i < this.choooseServiceData.length; i++) {
this.extraPrice += parseFloat((this.choooseServiceData[i].sellingPrice * this.buyNum).toFixed(2))
if (this.choooseServiceData[i].depositType == 1) { //---------------------------------------------------------------------------等于1，押金金额跟数量没关系
singleMoney = this.choooseServiceData[i].deposit
this.choooseServiceData[i].depositTotal = this.choooseServiceData[i].deposit //单个产品总押金
} else if (this.choooseServiceData[i].depositType == 2) { //----------------------------------------------------------------------等于2，押金单价乘购买数量
singleMoney = parseFloat((this.choooseServiceData[i].deposit * this.buyNum).toFixed(2))
this.choooseServiceData[i].depositTotal = parseFloat((this.choooseServiceData[i].deposit * this.buyNum).toFixed(2)) //单个产品总押金
}
this.depositTotal += singleMoney
}
} else {
this.extraPrice = 0
this.depositTotal = 0
}
return parseFloat((this.sellingPrice * this.buyNum + this.extraPrice + this.depositTotal + this.productDepositTotal - savedMoney).toFixed(2))
}
},
export default {
props: ['merchantName', 'name', 'buyNum', 'sellingPrice', 'productDepositTotal', 'chooseCouponObj', 'choooseService'],
watch: {
choooseService: {
handler(newValue, oldValue) {
if (newValue) {
this.choooseServiceData = this.choooseService
}
},
deep: false,
immediate: false
}
},
data() {
return {
show: false, //控制弹窗显示隐藏
extraPrice: 0, //额外服务价格
depositTotal: 0, //额外服务总押金
choooseServiceData: [] //选中的服务
}
},
computed: {
sellTotal() {
//卖价总价
let savedMoney = 0
if (this.chooseCouponObj) {
savedMoney = this.chooseCouponObj.savedMoney
}
if (this.choooseServiceData.length > 0) {
//额外服务价格
let singleMoney = 0 //单个产品总押金，用于算出总押金
this.extraPrice = 0
this.depositTotal = 0 //总押金
for (let i = 0; i < this.choooseServiceData.length; i++) {
this.extraPrice += parseFloat((this.choooseServiceData[i].sellingPrice * this.buyNum).toFixed(2))
if (this.choooseServiceData[i].depositType == 1) {
//等于1，押金金额跟数量没关系
singleMoney = this.choooseServiceData[i].deposit
this.choooseServiceData[i].depositTotal = this.choooseServiceData[i].deposit //单个产品总押金
} else if (this.choooseServiceData[i].depositType == 2) {
//等于2，押金单价乘购买数量
singleMoney = parseFloat((this.choooseServiceData[i].deposit * this.buyNum).toFixed(2))
this.choooseServiceData[i].depositTotal = parseFloat((this.choooseServiceData[i].deposit * this.buyNum).toFixed(2)) //单个产品总押金
}
this.depositTotal += singleMoney
}
} else {
this.extraPrice = 0
this.depositTotal = 0
}
return parseFloat((this.sellingPrice * this.buyNum + this.extraPrice + this.depositTotal + this.productDepositTotal - savedMoney).toFixed(2))
}
},
methods: {
}
}
methods: {}
}
</script>
<style scoped="scoped">
.detail-title {
height:120rpx;
display: flex;
align-items: center;
justify-content: center;
font-size: 32rpx;
border-bottom:var(--border-bottom);
}
.content-box {
padding: 0 30rpx;
border-bottom: 1px solid #f0f0f0;
height: 120rpx;
display: flex;
justify-content: space-between;
align-items: center;
font-size:28rpx;
}
.content-right{
text-align: right;
flex-shrink: 0;
margin-left: 20rpx;
}
.content-total {
color: #f45803;
font-weight: bolder;
font-size:32rpx;
}
.son-wrap {
position: relative;
height: 65vh;
display: flex;
flex-direction: column;
}
.detail-title {
text-align: center;
font-size: 32rpx;
font-weight: bold;
padding: 30rpx 24rpx;
border-radius: 20rpx 20rpx 0 0;
}
.content-box {
padding: 0 30rpx;
border-bottom: 1px solid #f0f0f0;
height: 120rpx;
display: flex;
justify-content: space-between;
align-items: center;
font-size: 28rpx;
}
.content-right {
text-align: right;
flex-shrink: 0;
margin-left: 20rpx;
}
.content-total {
color: #f45803;
font-weight: bolder;
font-size: 32rpx;
}
</style>
pages/scenic/scenicComponents/times.vue
View file @ 34f47abe
<template>
<u-popup :show="show" :round="10" closeable @close="show=false">
<view class="time">
<u-popup :show="showPop" :round="20" @close="showPop=false" closeable>
<view class="son-wrap">
<view class="time-title">
时间选择
</view>
<view class="time-content" v-if="chooseTimeList&&chooseTimeList.length>0">
<!--库存大于零并且当前时间小于班次的开始时间才显示-->
<view
class='time-list'
v-for="(item,index) of chooseTimeList"
:class="{on:active==index}"
@click="chooseTime(index)"
:key="index" v-if="item.last>0"
>
<view>
{{item.startPlanTime?item.startPlanTime.substr(0,5):""}}
<text v-if="item.endPlanTime">-</text>
{{item.endPlanTime?item.endPlanTime.substr(0,5):""}}
</view>
<view>
剩余：{{item.last}}
<view style="flex: 1;overflow-y: scroll;padding: 0 30rpx;">
<view class="time-content" v-if="chooseTimeList&&chooseTimeList.length>0">
<!--库存大于零并且当前时间小于班次的开始时间才显示-->
<view class='time-list'
v-for="(item,index) of chooseTimeList"
:class="{on:active==index}"
@click="chooseTime(index)"
:key="index" v-if="item.last>0">
<view>
{{item.startPlanTime?item.startPlanTime.substr(0,5):""}}
<text v-if="item.endPlanTime">-</text>
{{item.endPlanTime?item.endPlanTime.substr(0,5):""}}
</view>
<view>
剩余：{{item.last}}
</view>
</view>
</view>
<view style="padding: 0.5rem 0rem;color: #FF0000;" v-else>
空空如也...
</view>
<view class="time-sure">
<text class="big-btn" @click="confirm()">确定</text>
</view>
</view>
<view style="padding: 0.5rem 0rem;color: #FF0000;" v-else>
空空如也...
</view>
<view class="time-sure">
<text class="big-btn" @click="confirm()">确定</text>
</view>
</view>
</u-popup>
</template>
<script>
export default {
props: ["chooseTimeList", "chooseTimeData", "timeActive"],
watch: {
timeActive: { //父组件选中的下标
handler(newValue, oldValue) {
if (newValue >= 0) {
this.active = newValue
}
},
deep: false,
immediate: false
},
},
data() {
return {
show: false, //控制该组件显示隐藏
active: 10000, //默认不选中
times: "", //时间
timeNumber: "", //当前时间转化为数字
}
},
methods: {
//---时间选择
chooseTime(i) {
this.active = i
this.times = this.chooseTimeList[i].startPlanTime
},
//---时间确认事件
confirm(date) {
this.show = false;
this.$emit("timeConfig", this.times)
},
},
mounted() {
let times = new Date().Format("yyyy-MM-dd hh:mm:ss")
this.timeNumber = parseInt(this.$commonjs.changeTime(times))
}
}
export default {
props: ['chooseTimeList', 'chooseTimeData', 'timeActive'],
watch: {
timeActive: { //父组件选中的下标
handler(newValue, oldValue) {
if (newValue >= 0) {
this.active = newValue
}
},
deep: false,
immediate: false
},
},
data() {
return {
showPop: false, //控制该组件显示隐藏
active: 10000, //默认不选中
times: '', //时间
timeNumber: '', //当前时间转化为数字
}
},
methods: {
//---时间选择
chooseTime(i) {
this.active = i
this.times = this.chooseTimeList[i].startPlanTime
},
//---时间确认事件
confirm(date) {
this.showPop = false
this.$emit('timeConfig', this.times)
},
},
mounted() {
let times = new Date().Format('yyyy-MM-dd hh:mm:ss')
this.timeNumber = parseInt(this.$commonjs.changeTime(times))
}
}
</script>
<style scoped="scoped">
.time {
padding:30rpx 20rpx 60rpx 20rpx;
text-align: center;
<style scoped="scoped" lang="scss">
.son-wrap {
position: relative;
height:65vh;
display: flex;
flex-direction:column;
}
.time-title{
font-size:32rpx;
font-weight: bolder;
text-align: center;
font-size: 32rpx;
font-weight: bold;
padding: 30rpx 24rpx;
border-radius: 20rpx 20rpx 0 0;
}
.time-content {
......@@ -120,12 +124,13 @@
.time-list.on {
background: none;
color: #3dbcff;
border: 1px solid #3dbcff;
color: $theme;
border: 1px solid $theme;
box-sizing: border-box;
}
.time-sure{
margin-top: 30rpx;
margin-top:60rpx;
text-align: center;
}
</style>
pages/scenic/scenicOrder/scenicOrder.vue
View file @ 34f47abe
......@@ -84,7 +84,7 @@
<view class="middle1Time" v-if="productIfo.productType == 3">
<text> 游玩时间 </text>
<scroll-view class="time-content" scroll-x="true" :scroll-left="timeScroll" v-if="timeList > 0">
<scroll-view class="time-content" scroll-x="true" :scroll-left="timeScroll" v-if="timeList.length> 0">
<view class="time-list" v-for="(item, index) of timeList" @click="chooseTime(index)" :class="{ on: timeActive == index }" :key="index">
<view>
{{ item.startPlanTime ? item.startPlanTime.substr(0, 5) : '' }}
......@@ -171,7 +171,7 @@
<view class="visitorEdit" v-show="orderTouristList.length > 0">
<view class="edit-list" v-for="(item, index) of orderTouristList" :key="item.id">
<view @click="delChooseContact(item, index)">
<u-icon name="close-circle" color="#3688ff" size="20"></u-icon>
<u-icon name="close-circle" color="#3688ff" size="40"></u-icon>
</view>
<view>
......@@ -183,7 +183,7 @@
</view>
<view @click="showEdit(item)">
<u-icon name="edit-pen-fill" color="#3688ff" size="24"></u-icon>
<u-icon name="edit-pen-fill" color="#3688ff" size="48"></u-icon>
</view>
</view>
</view>
......@@ -600,7 +600,7 @@ export default {
},
//---展示更多时间
showTime() {
this.$refs.times.show = true
this.$refs.times.showPop = true
},
//---时间选择
chooseTime(i) {
......@@ -620,12 +620,9 @@ export default {
if (index > -1) {
//子组件点击确认之后有选择的时间
this.chooseTime(index) //选中确认的日期
this.docQuery
.selectAll('.time-list')
.boundingClientRect(data => {
this.timeScroll = (data[index].width + 4) * index
})
.exec()
this.docQuery.selectAll('.time-list').boundingClientRect(data => {
this.timeScroll = (data[index].width + 4) * index
}).exec()
}
},
//---获取点击的编辑联系人信息，传给编辑联系人组件
......@@ -675,7 +672,7 @@ export default {
},
//---展示新增联系人，并获取联系人列表
showContacts() {
this.$refs.contactList.contactsShow = true
this.$refs.contactList.showPop = true
},
//---游客选择
visitorChoose(i) {
......@@ -719,7 +716,7 @@ export default {
},
//---展示购票须知
showBuyKnow() {
this.$refs.buyKnow.buyKnowShow = true
this.$refs.buyKnow.showPop = true
},
//---页面初始化数据，获取产品基本信息
initData() {
......@@ -748,6 +745,9 @@ export default {
this.merchantId = res.data.merchantId //重新赋值商户id
this.beforeBookDays = res.data.beforeBookDays || 0 //提前预定天数
this.buyKnowData = res.data //购买须知，传给子组件
setTimeout(()=>{
console.log(this.buyKnowData)
},5000)
this.loadProductResVoList = res.data.loadProductResVoList //额外服务
this.afterBuyUrl = res.data.afterBuyUrl || '' //支付成功后页面跳转
//this.choooseService=res.data.data.loadProductResVoList//默认全部选中
......@@ -887,6 +887,7 @@ export default {
this.$request('distribution/distribution/getTimeStock', data).then(res => {
if (res.code == '00') {
this.timeList = res.data
console.log(this.timeList)
this.timeList.forEach((item, index) => {
//增加一个时间Number字段，用于判断当前时间大于班次结束时间时，不显示该班次
item.timeNumber = parseInt(this.$commonjs.changeTime(item.planDate.substr(0, 10) + item.endPlanTime))
......@@ -1384,7 +1385,7 @@ export default {
flex-shrink: 0;
width: 100rpx;
height: 90rpx;
border: 1px solid var(--main-color);
border: 1px solid $theme;
border-radius: 10rpx;
display: flex;
justify-content: center;
......@@ -1436,8 +1437,8 @@ export default {
.time-list.on {
background: none;
color: var(--main-color);
border: 1px solid var(--main-color);
color: $theme;
border: 1px solid $theme;
box-sizing: border-box;
}
......@@ -1445,7 +1446,7 @@ export default {
flex-shrink: 0;
width: 100rpx;
height: 90rpx;
border: 1px solid var(--main-color);
border: 1px solid $theme;
border-radius: 10rpx;
display: flex;
justify-content: center;
......@@ -1454,7 +1455,7 @@ export default {
.time-more-content {
margin: 0 4rpx;
color: var(--main-color);
color: $theme;
}
.no-time {
......@@ -1533,15 +1534,15 @@ export default {
}
.plus-list-last {
color: var(--main-color);
color: $theme;
background: #efefef;
width: 160rpx;
border: none;
}
.plus-list.on {
border: 1px solid var(--main-color);
color: var(--main-color);
border: 1px solid $theme;
color: $theme;
}
.visitorEdit {
......
uview-ui/components/u-popup/u-popup.vue
View file @ 34f47abe
......@@ -34,7 +34,7 @@
<u-icon
name="close"
color="#909399"
size="18"
size="36"
bold
></u-icon>
</view>
......@@ -45,9 +45,9 @@
</template>
<script>
import props from './props.js';
import props from './props.js'
/**
/**
* popup 弹窗
* @description 弹出层容器，用于展示弹窗、信息提示等内容，支持上、下、左、右和中部弹出。组件只提供容器，内部内容由用户自定义
* @tutorial https://www.uviewui.com/components/popup.html
......@@ -71,158 +71,158 @@
* @event {Function} close 弹出层收起
* @example <u-popup v-model="show"><text>出淤泥而不染，濯清涟而不妖</text></u-popup>
*/
export default {
name: 'u-popup',
mixins: [uni.$u.mpMixin, uni.$u.mixin, props],
data() {
return {
overlayDuration: this.duration + 50
}
},
watch: {
show(newValue, oldValue) {
if (newValue === true) {
// #ifdef MP-WEIXIN
const children = this.$children
this.retryComputedComponentRect(children)
// #endif
}
}
},
computed: {
transitionStyle() {
const style = {
zIndex: this.zIndex,
position: 'fixed',
display: 'flex',
}
style[this.mode] = 0
if (this.mode === 'left') {
return uni.$u.deepMerge(style, {
bottom: 0,
top: 0,
})
} else if (this.mode === 'right') {
return uni.$u.deepMerge(style, {
bottom: 0,
top: 0,
})
} else if (this.mode === 'top') {
return uni.$u.deepMerge(style, {
left: 0,
right: 0
})
} else if (this.mode === 'bottom') {
return uni.$u.deepMerge(style, {
left: 0,
right: 0,
})
} else if (this.mode === 'center') {
return uni.$u.deepMerge(style, {
alignItems: 'center',
'justify-content': 'center',
top: 0,
left: 0,
right: 0,
bottom: 0
})
}
},
contentStyle() {
const style = {}
// 通过设备信息的safeAreaInsets值来判断是否需要预留顶部状态栏和底部安全局的位置
// 不使用css方案，是因为nvue不支持css的iPhoneX安全区查询属性
const {
safeAreaInsets
} = uni.$u.sys()
if (this.mode !== 'center') {
style.flex = 1
}
// 背景色，一般用于设置为transparent，去除默认的白色背景
if (this.bgColor) {
style.backgroundColor = this.bgColor
}
if(this.round) {
const value = uni.$u.addUnit(this.round)
if(this.mode === 'top') {
style.borderBottomLeftRadius = value
style.borderBottomRightRadius = value
} else if(this.mode === 'bottom') {
style.borderTopLeftRadius = value
style.borderTopRightRadius = value
} else if(this.mode === 'center') {
style.borderRadius = value
}
}
return uni.$u.deepMerge(style, uni.$u.addStyle(this.customStyle))
},
position() {
if (this.mode === 'center') {
return this.zoom ? 'fade-zoom' : 'fade'
}
if (this.mode === 'left') {
return 'slide-left'
}
if (this.mode === 'right') {
return 'slide-right'
}
if (this.mode === 'bottom') {
return 'slide-up'
}
if (this.mode === 'top') {
return 'slide-down'
}
},
},
methods: {
// 点击遮罩
overlayClick() {
if (this.closeOnClickOverlay) {
this.$emit('close')
}
},
close(e) {
this.$emit('close')
},
afterEnter() {
this.$emit('open')
},
clickHandler() {
// 由于中部弹出时，其u-transition占据了整个页面相当于遮罩，此时需要发出遮罩点击事件，是否无法通过点击遮罩关闭弹窗
if(this.mode === 'center') {
this.overlayClick()
}
this.$emit('click')
},
// #ifdef MP-WEIXIN
retryComputedComponentRect(children) {
// 组件内部需要计算节点的组件
const names = ['u-calendar-month', 'u-album', 'u-collapse-item', 'u-dropdown', 'u-index-item', 'u-index-list',
'u-line-progress', 'u-list-item', 'u-rate', 'u-read-more', 'u-row', 'u-row-notice', 'u-scroll-list',
'u-skeleton', 'u-slider', 'u-steps-item', 'u-sticky', 'u-subsection', 'u-swipe-action-item', 'u-tabbar',
'u-tabs', 'u-tooltip'
]
// 历遍所有的子组件节点
for (let i = 0; i < children.length; i++) {
const child = children[i]
// 拿到子组件的子组件
const grandChild = child.$children
// 判断如果在需要重新初始化的组件数组中名中，并且存在init方法的话，则执行
if (names.includes(child.$options.name) && typeof child?.init === 'function') {
// 需要进行一定的延时，因为初始化页面需要时间
uni.$u.sleep(50).then(() => {
child.init()
})
}
// 如果子组件还有孙组件，进行递归历遍
if (grandChild.length) {
this.retryComputedComponentRect(grandChild)
}
}
}
// #endif
}
}
export default {
name: 'u-popup',
mixins: [uni.$u.mpMixin, uni.$u.mixin, props],
data() {
return {
overlayDuration: this.duration + 50
}
},
watch: {
show(newValue, oldValue) {
if (newValue === true) {
// #ifdef MP-WEIXIN
const children = this.$children
this.retryComputedComponentRect(children)
// #endif
}
}
},
computed: {
transitionStyle() {
const style = {
zIndex: this.zIndex,
position: 'fixed',
display: 'flex',
}
style[this.mode] = 0
if (this.mode === 'left') {
return uni.$u.deepMerge(style, {
bottom: 0,
top: 0,
})
} else if (this.mode === 'right') {
return uni.$u.deepMerge(style, {
bottom: 0,
top: 0,
})
} else if (this.mode === 'top') {
return uni.$u.deepMerge(style, {
left: 0,
right: 0
})
} else if (this.mode === 'bottom') {
return uni.$u.deepMerge(style, {
left: 0,
right: 0,
})
} else if (this.mode === 'center') {
return uni.$u.deepMerge(style, {
alignItems: 'center',
'justify-content': 'center',
top: 0,
left: 0,
right: 0,
bottom: 0
})
}
},
contentStyle() {
const style = {}
// 通过设备信息的safeAreaInsets值来判断是否需要预留顶部状态栏和底部安全局的位置
// 不使用css方案，是因为nvue不支持css的iPhoneX安全区查询属性
const {
safeAreaInsets
} = uni.$u.sys()
if (this.mode !== 'center') {
style.flex = 1
}
// 背景色，一般用于设置为transparent，去除默认的白色背景
if (this.bgColor) {
style.backgroundColor = this.bgColor
}
if(this.round) {
const value = uni.$u.addUnit(this.round)
if(this.mode === 'top') {
style.borderBottomLeftRadius = value
style.borderBottomRightRadius = value
} else if(this.mode === 'bottom') {
style.borderTopLeftRadius = value
style.borderTopRightRadius = value
} else if(this.mode === 'center') {
style.borderRadius = value
}
}
return uni.$u.deepMerge(style, uni.$u.addStyle(this.customStyle))
},
position() {
if (this.mode === 'center') {
return this.zoom ? 'fade-zoom' : 'fade'
}
if (this.mode === 'left') {
return 'slide-left'
}
if (this.mode === 'right') {
return 'slide-right'
}
if (this.mode === 'bottom') {
return 'slide-up'
}
if (this.mode === 'top') {
return 'slide-down'
}
},
},
methods: {
// 点击遮罩
overlayClick() {
if (this.closeOnClickOverlay) {
this.$emit('close')
}
},
close(e) {
this.$emit('close')
},
afterEnter() {
this.$emit('open')
},
clickHandler() {
// 由于中部弹出时，其u-transition占据了整个页面相当于遮罩，此时需要发出遮罩点击事件，是否无法通过点击遮罩关闭弹窗
if(this.mode === 'center') {
this.overlayClick()
}
this.$emit('click')
},
// #ifdef MP-WEIXIN
retryComputedComponentRect(children) {
// 组件内部需要计算节点的组件
const names = ['u-calendar-month', 'u-album', 'u-collapse-item', 'u-dropdown', 'u-index-item', 'u-index-list',
'u-line-progress', 'u-list-item', 'u-rate', 'u-read-more', 'u-row', 'u-row-notice', 'u-scroll-list',
'u-skeleton', 'u-slider', 'u-steps-item', 'u-sticky', 'u-subsection', 'u-swipe-action-item', 'u-tabbar',
'u-tabs', 'u-tooltip'
]
// 历遍所有的子组件节点
for (let i = 0; i < children.length; i++) {
const child = children[i]
// 拿到子组件的子组件
const grandChild = child.$children
// 判断如果在需要重新初始化的组件数组中名中，并且存在init方法的话，则执行
if (names.includes(child.$options.name) && typeof child?.init === 'function') {
// 需要进行一定的延时，因为初始化页面需要时间
uni.$u.sleep(50).then(() => {
child.init()
})
}
// 如果子组件还有孙组件，进行递归历遍
if (grandChild.length) {
this.retryComputedComponentRect(grandChild)
}
}
}
// #endif
}
}
</script>
<style lang="scss" scoped>
......
uview-ui/libs/util/dayjs.js
View file @ 34f47abe
This diff is collapsed.
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