Skip to content

J
jz_Travel
Commit 81450a70 authored by 罗超's avatar 罗超
Browse files
Options

完成机票

parent 8a468cf3
Hide whitespace changes
Inline Side-by-side
Showing with 1335 additions and 233 deletions
asset/css/flex.css
View file @ 81450a70
......@@ -132,6 +132,9 @@
.flexS{
flex-shrink: 0;
}
.text-right{
text-align: right;
}
.column{
display: flex;
flex-direction: column;
......
asset/font/tffont.css
View file @ 81450a70
@font-face {
font-family: "tffont"; /* Project id 4816119 */
src: url('//at.alicdn.com/t/c/font_4816119_61ojoauzfi8.woff2?t=1739876734691') format('woff2'),
url('//at.alicdn.com/t/c/font_4816119_61ojoauzfi8.woff?t=1739876734691') format('woff'),
url('//at.alicdn.com/t/c/font_4816119_61ojoauzfi8.ttf?t=1739876734691') format('truetype');
src: url('//at.alicdn.com/t/c/font_4816119_3fhqn0zoshb.woff2?t=1739957291854') format('woff2'),
url('//at.alicdn.com/t/c/font_4816119_3fhqn0zoshb.woff?t=1739957291854') format('woff'),
url('//at.alicdn.com/t/c/font_4816119_3fhqn0zoshb.ttf?t=1739957291854') format('truetype');
}
.tffont {
......@@ -13,6 +13,22 @@
-moz-osx-font-smoothing: grayscale;
}
.tffont-baby:before {
content: "\e650";
}
.tffont-chengren:before {
content: "\e75f";
}
.tffont-ertong:before {
content: "\e760";
}
.tffont-pen_:before {
content: "\e8a5";
}
.tffont-qianwangx:before {
content: "\e608";
}
......
components/coupon/index.vue
View file @ 81450a70
......@@ -37,13 +37,13 @@
</scroll-view>
<view class="btton-box">
<u-button size="80" :ripple="true" shape="circle" :custom-style="{
backgroundColor: mc,
height: '80rpx',
color: '#FFF',
fontSize: '14px',
margin: '0 3vw',
width: '90vw',
}"
backgroundColor: mc,
height: '80rpx',
color: '#FFF',
fontSize: '14px',
margin: '0 3vw',
width: '90vw',
}"
@click="popupClose">确定</u-button>
</view>
</view>
......@@ -52,7 +52,7 @@
<script>
export default {
props: ["list", "current","currentPrice","order"],
props: ["list", "current","price","currentPrice","order"],
data() {
return {
mc: "",
......@@ -75,7 +75,7 @@
},
methods: {
checkOrderCoupon(){
if (this.currentPrice.teamType==1) {
if (this.currentPrice && this.currentPrice.teamType==1) {
//totalSeat:总机位 isSubstitution:1 （可候补） leaderNum:领队
const shengyu = this.currentPrice.totalSeat-this.currentPrice.leaderNum
......@@ -90,9 +90,18 @@
this.ts.forEach(x => {
if(x.couponsUseScope==10) x.err = errorMsg
})
console.log(this.ts)
this.ts.sort((a,b) => {
const aerr = (a.err?a.err:'').length
const berr = (b.err?b.err:'').length
return aerr-berr
})
}
this.ts.forEach((x)=>{
if(!x.err && x.useCondition>this.price){
x.err = '订单金额不满足'
}
})
console.log('useCondition')
},
popupClose() {
if (this.currentChosen != this.current) {
......
node_modules/uview-ui/components/u-modal/u-modal.vue
View file @ 81450a70
<template>
<view>
<u-popup :zoom="zoom" mode="center" :z-index="uZIndex" v-model="value" :length="width" :mask-close-able="false" :border-radius="borderRadius">
<view class="u-model">
<view class="u-model" :style="{'border-radius': `${borderRadius}rpx`}">
<view v-if="showTitle" class="u-model-title u-line-1" :style="[titleStyle]">{{ title }}</view>
<view class="u-model-content">
<slot v-if="contentSlot">
......
pages/airTicket/components/guest/index.vue
View file @ 81450a70
<template>
<view>
<view class="row items-center">
<u-radio-group v-model="ia">
<u-radio shape="circle">月明人倚楼</u-radio>
</u-radio-group>
<view class="flight-guest">
<view class="row items-center" style="margin-top: 24rpx;">
<view class="num row items-center">
<text style="padding: 6rpx;">剩余</text>
<text class="col text-center" style="padding:6rpx;background-color: #B99846;">{{maxNum}}张</text>
</view>
<view v-if="(crCount+etCount+babyCount)>0" class="col text-right" style="font-size: 26rpx;color: #1D1D20;">
<text>已选：</text>
<text class="q-ml-sm">{{crCount}}成人</text>
<text class="q-ml-sm">{{etCount}}儿童</text>
<text class="q-ml-sm">{{babyCount}}婴儿</text>
</view>
</view>
<view class="row items-center" v-for="(x,i) in showGuests" style="padding: 30rpx 0;">
<u-checkbox-group>
<u-checkbox :disabled="!x.Checked && !canChecked && x.year>1" shape="circle" v-model="x.Checked" active-color="#B99846"></u-checkbox>
</u-checkbox-group>
<view class="col q-ml-md q-mr-md">
<view class="row items-center">
<view class="guest-name">{{x.SurName}}/{{x.GivenName}} {{x.Name!=''?`(${x.Name})`:''}}</view>
<view class="guest-tag" :class="{'cr':x.year>11,'et':x.year>1&&x.year<12,'baby':x.year<2}">
{{x.year>11?'成人':(x.year>2?'儿童':'婴儿')}}
</view>
</view>
<view class="guest-card">
护照号 {{x.Passport}}
<text class="q-ml-sm">{{x.Sex=='M'?'男':'女'}}</text>
</view>
</view>
<view @click="updateGuestHandle(x)" style="width: 50px;height: 50rpx;align-items: flex-end;" class="column justify-center">
<u-icon name="pen_" custom-prefix="tffont" color="#B99846" size="30"></u-icon>
</view>
</view>
<view class="add" @click="listVisible=true">
{{showGuests.length==0?'添加乘机人':'更多乘机人'}}
</view>
<u-popup mode="bottom" border-radius="20" :popup="false" v-model="listVisible" :maskCloseAble="true" length="auto" :safeAreaInsetBottom="true" @close="()=>listVisible=false" :z-index="9999">
<guest-list :list="guests" ref="guestManagerRef" :max-num="maxNum" @selected="selectedHandle" @change="guestChangeHandle"></guest-list>
</u-popup>
</view>
</template>
<script>
import GuestList from './list.vue'
export default{
data(){
return {
ia:false
checked:false,
guestObj:{
Id:'',
Name:'',
SurName:'',
GivenName:'',
Sex:'M',
BrithDay:'',
Country:'',
IdCard:'',
IdCardExpired:'',
Passport:'',
PassportExpired:'',
Mobile:''
},
guests:[],
listVisible:false
}
},
props:{
maxNum:{
type:Number
}
},
components:{GuestList},
computed: {
showGuests() {
this.guests.forEach(x=>{
if(x.Checked) x.Display=true
})
const r = this.guests.filter(x=>x.Display)
return r
},
crCount(){
const r = this.guests.filter(x=>x.year>=12 && x.Checked)
return r.length
},
etCount(){
const r = this.guests.filter(x=>x.year>=2 && x.year<12 && x.Checked)
return r.length
},
babyCount(){
const r = this.guests.filter(x=>x.year<2 && x.Checked)
return r.length
},
canChecked(){
const r = this.guests.filter(x=>x.year>=2 && x.Checked)
return r.length<this.maxNum
}
},
watch: {
guests: {
deep: true,
immediate: true,
handler: function(newVal, oldVal) {
this.checkedChange()
},
},
},
created() {
if(uni.getStorageSync('guest')){
this.guests = uni.getStorageSync('guest').filter(x=>x.Id!='')
this.guests.forEach((x,i)=>{
x.Checked=false
x.Display=i==0
})
this.calcYearHandle()
this.chosenGuest = this.guests.slice(0, 1)
}
},
methods:{
guestChangeHandle(val){
this.guests = val
},
checkedChange(){
const r = this.guests.filter(x=>x.Checked)
this.$emit('selected',r)
},
selectedHandle(val){
this.guests=val
this.listVisible=false
},
calcYearHandle(date){
this.guests.forEach(x=>{
x.year=this.calculateAge(x.BirthDay)
})
},
updateGuestHandle(g){
this.$refs.guestManagerRef.createNewGuest(g)
this.listVisible = true
},
calculateAge(birthDate) {
const birth = new Date(birthDate);
const now = new Date();
let birthYear = birth.getFullYear();
let birthMonth = birth.getMonth();
let birthDay = birth.getDate();
let currentYear = now.getFullYear();
let currentMonth = now.getMonth();
let currentDay = now.getDate();
let age = currentYear - birthYear;
if (currentMonth < birthMonth || (currentMonth === birthMonth && currentDay < birthDay)) {
age--;
}
return age;
}
}
}
</script>
<style>
.flight-guest {
margin: 10px;
}
.flight-guest *{
line-height: 1;
}
.flight-guest .guest-name{
font-weight: bold;
font-size: 30rpx;
color: #1D1D20;
line-height: 1;
}
.flight-guest .guest-card{
font-size: 26rpx;
color: #9999A5;
font-weight: 300;
margin-top: 10rpx;
}
.flight-guest .add{
padding: 22rpx;
background-color: #00000009;
font-size: 26rpx;
font-weight: bold;
text-align: center;
color: #000;
border-radius: 12rpx;
margin-top: 30rpx;
}
.flight-guest .num{
margin-top: 24rpx;
border-radius: 7rpx;
background-color: #080A09;
font-size: 22rpx;
font-weight: 400;
color: #FFF;
overflow: hidden;
padding: 0;
line-height: 1;
}
.flight-guest .num{
border-radius: 7rpx;
background-color: #080A09;
font-size: 22rpx;
font-weight: 400;
color: #FFF;
overflow: hidden;
padding: 0;
line-height: 1;
width: 120rpx;
}
.guest-tag{
font-size: 22rpx;
padding: 6rpx 14rpx;
line-height: 1;
border-radius: 8rpx;
margin-left: 20rpx;
}
.guest-tag.cr{
background-color: #FFFFFF;
color: #2979ff;
border: 1px solid #2979ff;
}
.guest-tag.et{
background-color: #FFFFFF;
color: #f90;
border: 1px solid #f90;
}
.guest-tag.baby{
background-color: #FFFFFF;
color: #fa3534;
border: 1px solid #fa3534;
}
</style>
\ No newline at end of file
pages/airTicket/components/guest/list.vue 0 → 100644
View file @ 81450a70
<template>
<view style="height: 90vh;position: relative;" >
<view class="column items-center justify-center q-mt-md" v-if="loading">
<u-loading mode="circle" size="40"></u-loading>
<view class="normal-label text-center q-mt-sm">正在加载信息</view>
</view>
<template v-else>
<view :style="{transform: `translateX(${showFormVisible?-100:0}vw)`,transition: 'transform 0.5s ease'}" class=" guest-list column">
<view class="row items-center justify-center" v-if="crCount+etCount+babyCount>0">
<text class="q-mr-md">已选</text>
<template v-if="crCount>0">
<text class="bold">{{crCount}}</text>
<u-icon name="chengren" class="q-mr-md" custom-prefix="tffont" color="#966b00" size="30"></u-icon>
</template>
<template v-if="etCount>0">
<text class="bold">{{etCount}}</text>
<u-icon name="ertong" class="q-mr-md" custom-prefix="tffont" color="#966b00" size="30"></u-icon>
</template>
<template v-if="babyCount>0">
<text class="bold">{{babyCount}}</text>
<u-icon name="baby" class="q-mr-md" custom-prefix="tffont" color="#966b00" size="30"></u-icon>
</template>
</view>
<view class="text-center" v-else>
<text class="bold">乘机人列表</text>
</view>
<scroll-view scroll-y="true" class="col q-mt-md" style="background: #f1f2f4;height: 1px;">
<view class="row items-center card" v-for="(x,i) in guests" style="margin:30rpx;">
<u-checkbox-group>
<u-checkbox @change="guestChangeHandle" :disabled="!x.Checked && !canChecked && x.year>1" shape="circle" v-model="x.Checked" active-color="#B99846"></u-checkbox>
</u-checkbox-group>
<view class="col q-ml-md q-mr-md">
<view class="row items-center">
<view class="guest-name">{{x.SurName}}/{{x.GivenName}} {{x.Name!=''?`(${x.Name})`:''}}</view>
<view class="guest-tag" :class="{'cr':x.year>11,'et':x.year>1&&x.year<12,'baby':x.year<2}">
{{x.year>11?'成人':(x.year>2?'儿童':'婴儿')}}
</view>
</view>
<view class="q-mt-sm">
护照号 {{x.Passport}}
<text class="q-ml-sm">{{x.Sex==1?'男':'女'}}</text>
</view>
</view>
<view @click="createNewGuest(x)" style="width: 50px;height: 50rpx;align-items: flex-end;" class="column justify-center">
<u-icon name="pen_" custom-prefix="tffont" color="#B99846" size="30"></u-icon>
</view>
</view>
</scroll-view>
<view class="row items-center" style="padding:0 32rpx 20rpx 32rpx">
<view class="outline-btn col" @click="createNewGuest(null)">新增乘机人</view>
<view class="full-btn col q-ml-sm" @click="selectedHandle">确认选择</view>
</view>
</view>
<view class="guest-from column" :style="{transform: `translateX(${showFormVisible?0:100}vw)`,transition: 'transform 0.5s ease'}">
<view class="bold text-center" style="font-size: 30rpx;">
{{current.Id==''?'新增':'修改'}}乘机人
</view>
<scroll-view scroll-y="true" class="col" style="height: 1px;margin-top: 40rpx;">
<view class="form-item">
<u-field :labelWidth="180"
v-model="current.Name"
label="中文姓名"
placeholder="请输入中文姓名">
</u-field>
</view>
<view class="form-item">
<u-field :labelWidth="180"
v-model="current.SurName"
label="姓(拼音)"
placeholder="如:ZHOU"
@input="(e)=>handleInput(e,0)"
required>
</u-field>
</view>
<view class="form-item">
<u-field :labelWidth="180"
v-model="current.GivenName"
label="名(拼音)"
@input="(e)=>handleInput(e,1)"
placeholder="如:XINGXING"
required>
</u-field>
</view>
<view class="form-item row items-center" style="padding: 20px 28px;">
<text style="width:180rpx">性别</text>
<u-radio-group v-model="current.Sex">
<u-radio shape="circle" active-color="#DEBF7B" name="M">男</u-radio>
<u-radio shape="circle" active-color="#DEBF7B" name="F" class="q-ml-md">女</u-radio>
</u-radio-group>
</view>
<view class="form-item">
<u-field :labelWidth="180"
v-model="current.BirthDay"
label="出生日期"
right-icon="arrow-down"
:disabled="true"
@click="showPicker=true"
required />
</view>
<view class="form-item">
<u-field :labelWidth="180"
v-model="current.Country"
label="国籍"
right-icon="arrow-down"
:disabled="true"
@click="countryVisible=true"
required />
</view>
<view class="form-item">
<u-field :labelWidth="180"
v-model="current.Passport"
label="护照号"
placeholder="请输入护照号码"
required>
</u-field>
</view>
<view class="form-item">
<u-field :labelWidth="180"
v-model="current.PassportExpired"
label="护照有效期"
right-icon="arrow-down"
:disabled="true"
@click="showPeVisible=true"
required />
</view>
<view class="form-item">
<u-field :labelWidth="180"
v-model="current.Mobile"
label="电话号码"
placeholder="请输入电话号码"
required>
</u-field>
</view>
</scroll-view>
<view class=" row items-center" style="padding:0 32rpx 20rpx 32rpx">
<view class="outline-btn col" @click="showFormVisible=false">返回</view>
<view class="full-btn col q-ml-sm" @click="saveGuestHandle()">保存乘机人</view>
</view>
</view>
<u-picker v-model="showPicker" mode="time" :params="params" @confirm='setBirthdayHandle' :default-time='current.BirthDay'></u-picker>
<u-picker v-model="showPeVisible" mode="time" :params="params" @confirm='setExpireHandle' :default-time='current.PassportExpired'></u-picker>
<u-picker mode="selector" v-model="countryVisible" @confirm="setCountryHandle" :default-selector="[0]" :range="countries" range-key="Name"></u-picker>
</template>
</view>
</template>
<script>
export default{
data(){
return {
guests:[],
listVisible:false,
showFormVisible:false,
current:{},
countries:[],
showPicker:false,
showPeVisible:false,
countryVisible:false,
params: {
year: true,
month: true,
day: true
},
defaultCountry:[],
loading:false,
}
},
props:{
list:{
type:Array,
default:[]
},
maxNum:{
type:Number,
default:0
}
},
watch: {
list: {
deep: true,
immediate: true,
handler: function(newVal, oldVal) {
this.guests = newVal;
},
},
},
components:{},
computed: {
crCount(){
const r = this.guests.filter(x=>x.year>=12 && x.Checked)
return r.length
},
etCount(){
const r = this.guests.filter(x=>x.year>=2 && x.year<12 && x.Checked)
return r.length
},
babyCount(){
const r = this.guests.filter(x=>x.year<2 && x.Checked)
return r.length
},
canChecked(){
const r = this.guests.filter(x=>x.year>=2 && x.Checked)
return r.length<this.maxNum
}
},
created() {
this.guests=this.list
this.calcYearHandle()
this.getCountryList()
},
methods:{
calcYearHandle(date){
this.guests.forEach(x=>{
x.year=this.calculateAge(x.BirthDay)
})
},
calculateAge(birthDate) {
const birth = new Date(birthDate);
const now = new Date();
let birthYear = birth.getFullYear();
let birthMonth = birth.getMonth();
let birthDay = birth.getDate();
let currentYear = now.getFullYear();
let currentMonth = now.getMonth();
let currentDay = now.getDate();
let age = currentYear - birthYear;
if (currentMonth < birthMonth || (currentMonth === birthMonth && currentDay < birthDay)) {
age--;
}
return age;
},
setBirthdayHandle(val){
this.current.BirthDay=`${val.year}/${val.month}/${val.day}`
},
setExpireHandle(val){
this.current.PassportExpired=`${val.year}/${val.month}/${val.day}`
},
createNewGuest(obj){
if(obj) this.current=obj
else{
this.current = {
Id:'',
Name:'',
SurName:'',
GivenName:'',
Sex:'M',
BrithDay:'',
Country:this.countries[0].Name,
CountryId:this.countries[0].ID,
IdCard:'',
IdCardExpired:'',
Passport:'',
PassportExpired:'',
Mobile:''
}
this.defaultCountry = [0]
}
this.showFormVisible = true
},
getCountryList() {
this.loading=true
this.apipost('dict_post_Destination_GetCountry', {}, res => {
this.countries = res.data
this.loading=false
}, err => {
this.loading=false
})
},
setCountryHandle(val){
this.current.Country=this.countries[val[0]].Name
this.current.CountryId = this.countries[val[0]].ID
this.defaultCountry = val
},
handleInput(event,t) {
setTimeout(()=>{
const value = t==0?this.current.SurName:this.current.GivenName;
const filteredValue = value.replaceAll(/[^a-zA-Z]/g, '')
console.log(value,filteredValue)
if(t==0) this.current.SurName = filteredValue.toUpperCase();
else if(t==1) this.current.GivenName = filteredValue.toUpperCase();
},500)
},
guestChangeHandle(){
setTimeout(()=>{
this.$emit('change',this.guests)
},500)
},
selectedHandle(){
this.$emit('selected',this.guests)
},
saveGuestHandle(){
const msg = this.validate()
if(msg!=''){
uni.showToast({
title:msg,
icon:'none'
})
return
}
const c = JSON.parse(JSON.stringify(this.current))
if(c.Id==''){
c.Id = new Date().getTime().toString()
this.guests.push(c)
}else {
const i = this.guests.findIndex(x=>x.Id==c.Id)
if(i!=-1) this.guests[i] = c
else this.guests.push(c)
}
this.calcYearHandle()
uni.setStorageSync('guest',this.guests)
this.guestChangeHandle()
this.showFormVisible = false
},
validate(){
let msg = ''
const c = this.current
if(c.SurName=='')
msg = '请输入姓'
else if(c.GivenName=='')
msg = '请输入名'
else if(c.BirthDay=='')
msg='请选择生日'
else if(c.Passport==''||c.Passport.length<5||c.Passport.length>15)
msg = '请输入5-15位护照号码'
else if(c.PassportExpired=='')
msg='请选择护照有效期'
else if(c.Mobile=='' || c.Mobile.length!=11)
msg = '请输入11位数电话号码'
return msg
}
}
}
</script>
<style>
.guest-list,
.guest-from {
font-size: 26rpx;
line-height: 1;
color: #080A09;
width: 100vw;
top: 32rpx;
bottom: 0px;
left: 0;
right: 0;
position: absolute;
z-index: 1;
}
.guest-list .bold{
font-weight: bold;
}
.guest-list .card{
background-color: #FFF;
border-radius: 12rpx;
font-size: 26rpx;
color: #9999A5;
font-weight: 300;
margin-top: 10rpx;
padding:30rpx;
}
.guest-list .guest-name{
font-weight: bold;
font-size: 30rpx;
color: #1D1D20;
line-height: 1;
}
.guest-list .full-btn,
.guest-from .full-btn{
padding: 22rpx;
background-color: #B99846;
font-size: 26rpx;
font-weight: bold;
text-align: center;
color: #000;
border-radius: 12rpx;
margin-top: 30rpx;
border:1rpx solid #B99846;
}
.guest-list .outline-btn,
.guest-from .outline-btn{
padding: 22rpx;
background-color: #;
border:1rpx solid #B99846;
font-size: 26rpx;
font-weight: bold;
text-align: center;
color: #B99846;
border-radius: 12rpx;
margin-top: 30rpx;
}
.guest-from {
z-index: 2;
}
.guest-from .bold{
font-weight: bold;
}
.guest-from .form-item{
border-bottom: 1px solid #ECF1F4;
}
.guest-tag{
font-size: 22rpx;
padding: 6rpx 14rpx;
line-height: 1;
border-radius: 8rpx;
margin-left: 20rpx;
}
.guest-tag.cr{
background-color: #FFFFFF;
color: #2979ff;
border: 1px solid #2979ff;
}
.guest-tag.et{
background-color: #FFFFFF;
color: #f90;
border: 1px solid #f90;
}
.guest-tag.baby{
background-color: #FFFFFF;
color: #fa3534;
border: 1px solid #fa3534;
}
</style>
\ No newline at end of file
pages/airTicket/flightDetail.vue
View file @ 81450a70
<template>
<view class="f-detail">
<view class="column items-center justify-center q-mt-md" v-if="loading">
<u-loading mode="circle" size="40"></u-loading>
<view class="normal-label text-center q-mt-sm">正在加载信息</view>
<template>
<view class="f-detail column">
<view class="column items-center justify-center q-mt-md" v-if="loading">
<u-loading mode="circle" size="40"></u-loading>
<view class="normal-label text-center q-mt-sm">正在加载信息</view>
</view>
<template v-if="flight && !loading">
<scroll-view v-if="flight && !loading" scroll-y="true" class="col" style="height: 1px;">
<view class="flight-card">
<view class="row items-center">
<view class="flight-status">去程</view>
......@@ -13,7 +13,8 @@
<view class="city bold">{{goList[goList.length-1].ArrivalCityName}}</view>
<view class="col row" style="font-size: 14px;justify-content: flex-end;">
<text>{{goList[0].FlightDate.split('-').splice(1,2).join('-')}} {{getWeeks(goList[0].FlightDate)}} {{goList[0].Departure_time}}</text>
<u-icon class="q-ml-sm" name='arrow_down' custom-prefix="tffont" color="#00000066" size="32"></u-icon>
<u-icon class="q-ml-sm" name='arrow_down' custom-prefix="tffont" color="#00000066"
size="32"></u-icon>
</view>
</view>
</view>
......@@ -25,225 +26,649 @@
<view class="city bold">{{backList[goList.length-1].ArrivalCityName}}</view>
<view class="col row" style="font-size: 14px;justify-content: flex-end;">
<text>{{backList[0].FlightDate.split('-').splice(1,2).join('-')}} {{getWeeks(backList[0].FlightDate)}} {{backList[0].Departure_time}}</text>
<u-icon class="q-ml-sm" name='arrow_down' custom-prefix="tffont" color="#00000066" size="32"></u-icon>
<u-icon class="q-ml-sm" name='arrow_down' custom-prefix="tffont" color="#00000066"
size="32"></u-icon>
</view>
</view>
</view>
<view class="flight-card q-mt-md">
<view class="title">选择乘机人</view>
<guest></guest>
<guest :max-num="flight.B2BSellNum" @selected="guestChangeHandle"></guest>
<u-field
v-model="contactName"
label="联系人"
placeholder="联系人名称"
padding="20rpx 28rpx"
:borderBottom="true"
required>
</u-field>
<u-field
v-model="contactPhone"
label="联系电话"
placeholder="请填写电话"
padding="20rpx 28rpx"
:borderBottom="true"
required>
</u-field>
</view>
<view class="flight-card q-mt-md" v-if="sales.length>1">
<view class="title">服务专员</view>
<u-field
v-model="createBy.EmName"
label="服务专员"
placeholder="请选择服务专员"
padding="20rpx 28rpx"
right-icon="arrow-down"
:disabled="true"
@click="saleVisable=true"
required>
</u-field>
</view>
<view class="flight-card q-mt-md">
<view class="title">
<text>优惠券</text>
</view>
<view class="q-mt-md row items-center">
<view style="font-size: 12px;width:1px;flex:1">请选择优惠券</view>
<view style="display: flex;align-items: center;">
<text style="color:#F20707;font-size: 12px;" @click="showCouponHandler">
<text style="flex: 1;"
v-if="useCouponId == 0 &&couponList.length>0">{{couponList.length}}张可用优惠券</text>
<text class="content" style="color:grey" v-else-if="couponList.length==0">暂无优惠券</text>
<text class="content" v-else :style="{ color: mainColor }">已优惠 {{currentCoupon.discountMoney}} 元</text>
</text>
<u-icon name="arrow" :size="32" color="#111" v-if="couponList.length>0"></u-icon>
</view>
</view>
</view>
</template>
</view>
</template>
<script>
import guest from './components/guest/index.vue'
export default {
data() {
return {
id:0,
loading:false,
flight:null,
goList:[],
backList:[],
dateRangeValue: {
type: 0,
startDate: '',
fuzzy: {
fuzzyType: 0,
fuzzyTypeName: '',
weeks: [],
dayRangStatus: false,
dayRange: [4, 10]
},
formatStartDate: '任意时间出发'
},
chosenResult: [{
type: 0,
ID: 0,
Name: '全部城市'
},
{
type: 1,
ID: 0,
Name: '全部城市'
}
],
parementers: {
StartDate: '',
EndDate: '',
DepartCityId: 0,
ArriveCityId: 0,
AirLineID: 0,
groupId: 2,
TicketType: 2,
StartPlayDay: 0,
EndPlayDay: 0,
WeekDay: ''
},
}
},
components:{guest},
onLoad(options) {
if(options.id && uni.getStorageSync('scf')){
this.id = options.id
uni.setNavigationBarColor({
backgroundColor:'#DEBF7B',
frontColor:'#000000'
})
const s = uni.getStorageSync('scf')
this.dateRangeValue = s.dateRange
this.chosenResult = s.cities
this.getTopLowTicketHandle()
return
}
this.navigatorToHomeHandle()
},
created() {
},
<view class="flight-card q-mt-md">
<view class="title">
<text>订单金额</text>
</view>
<view class="form-items q-mt-md">
<view class="label"> 在线支付 </view>
<view class="val f14 regular" style="text-align: right">
<text style="margin-right: 30rpx">{{ guest.length }}人</text>
<text class="red">￥{{ price }}</text>
</view>
</view>
<view class="form-items" style="border-bottom: none">
<view class="label"> 明细 </view>
</view>
<view v-if="crCount>0" class="row items-center price-list-details">
<view class="col">
<text style="margin-right: 30rpx">成人</text>
</view>
<view>{{ crCount }}人 × ¥{{flight.B2BPrice}}</view>
</view>
<view v-if="etCount>0" class="row items-center price-list-details">
<view class="col">
<text style="margin-right: 30rpx">儿童</text>
</view>
<view>{{ etCount }}人 × ¥{{flight.B2BPrice}}</view>
</view>
<view v-if="babyCount>0" class="row items-center price-list-details">
<view class="col">
<text style="margin-right: 30rpx">婴儿</text>
</view>
<view>{{ babyCount }}人 × ¥{{babyPrice}}</view>
</view>
<view v-if="useCouponId>0" class="row items-center price-list-details" :style="{color:mainColor}">
<view class="col">
<text style="margin-right: 30rpx">优惠券</text>
</view>
<view>-¥{{currentCoupon.discountMoney}}</view>
</view>
<view class="row items-center price-list-details">
<view class="col">
<text style="margin-right: 30rpx">合计</text>
</view>
<view>¥{{(price-currentCoupon.discountMoney>0?price-currentCoupon.discountMoney:0)}}</view>
</view>
</view>
</scroll-view>
<view class="order-box" v-if="flight && !loading">
<view class="flight-card order-preview row items-center">
<view class="col" style="color: #ff3166; font-weight: bold">
<text style="font-size: 22rpx">¥</text>
<text v-if="crCount+etCount+babyCount>0" style="font-size: 40rpx; margin: 0 20rpx 0 5rpx;font-family: nav-font;">
{{(price-currentCoupon.discountMoney).toFixed(2)}}
</text>
<text style="font-size: 40rpx; margin: 0 20rpx 0 5rpx;font-family: nav-font;" v-else>--</text>
<text style="color: #6e6e6e; font-size: 24rpx;font-family: microsoft yahei ui light;">共计{{ guest.length }}人</text>
</view>
<button class="jz_OrderReNow" @click="orderHandler" :disabled="submit" :loading="submit">
立即预定
</button>
</view>
</view>
<coupon v-if="couponList.length > 0 && showCoupon" :price="1" :list="couponList" :current="useCouponId"
@close="closeCouponHandler"></coupon>
<u-picker mode="selector" v-model="saleVisable" @confirm="setSaleHandle" :default-selector="[0]" :range="sales" range-key="EmName"></u-picker>
<u-modal :border-radius="16" @confirm="nativageToOrderHandle" title="订单提醒" content="订单创建成功,请您在6小时内完成付款,否则将会被取消." @cancel="navigatorToHomeHandle" v-model="successVisible" confirm-text='查看订单' cancel-text='返回首页' confirm-color='#DEBF7B' cancel-color='#080A09' :show-cancel-button="true"></u-modal>
</view>
</template>
<script>
import guest from './components/guest/index.vue'
import coupon from '@/components/coupon/index';
export default {
data() {
return {
id: 0,
loading: false,
flight: null,
goList: [],
backList: [],
dateRangeValue: {
type: 0,
startDate: '',
fuzzy: {
fuzzyType: 0,
fuzzyTypeName: '',
weeks: [],
dayRangStatus: false,
dayRange: [4, 10]
},
formatStartDate: '任意时间出发'
},
chosenResult: [{
type: 0,
ID: 0,
Name: '全部城市'
},
{
type: 1,
ID: 0,
Name: '全部城市'
}
],
parementers: {
StartDate: '',
EndDate: '',
DepartCityId: 0,
ArriveCityId: 0,
AirLineID: 0,
groupId: 2,
TicketType: 2,
StartPlayDay: 0,
EndPlayDay: 0,
WeekDay: ''
},
showCoupon: false,
couponList: [],
useCouponId: 0,
currentCoupon: {
discountMoney: 0
},
customer: {},
guest: [],
mainColor: '',
submit:false,
contactName:'',
contactPhone:'',
successVisible:false,
createBy:{
EmName:'',
CreateBy:0
},
sales:[],
saleVisable:false
}
},
components: {
guest,
coupon
},
computed: {
price() {
if (!this.flight) return 0
const p = this.flight.B2BPrice
if (this.guest.length == 1) return p
const f = this.guest.filter(x => x.year > 1).length
const b = this.guest.filter(x => x.year < 2).length
return (f * p) + (b * this.babyPrice)
},
babyPrice() {
if (!this.flight) return 0
const p = this.flight.B2BPrice
let bp = this.flight.BabyPrecent
bp = bp && bp != '' ? (parseFloat(bp) / 100.00) : 0
return Math.ceil(bp * p)
},
crCount() {
const r = this.guest.filter(x => x.year >= 12 && x.Checked)
return r.length
},
etCount() {
const r = this.guest.filter(x => x.year >= 2 && x.year < 12 && x.Checked)
return r.length
},
babyCount() {
const r = this.guest.filter(x => x.year < 2 && x.Checked)
return r.length
},
},
onLoad(options) {
if (options.id && uni.getStorageSync('scf')) {
this.id = options.id
uni.setNavigationBarColor({
backgroundColor: '#DEBF7B',
frontColor: '#000000'
})
const s = uni.getStorageSync('scf')
this.dateRangeValue = s.dateRange
this.chosenResult = s.cities
this.getTopLowTicketHandle()
return
}
this.navigatorToHomeHandle()
},
created() {
this.mainColor = this.$uiConfig.mainColor
this.customer = uni.getStorageSync("b2b_user");
this.getUserCouponList()
this.getSalesHandle()
},
methods: {
navigatorToHomeHandle(){
uni.redirectTo({
url:'/pages/index/index'
})
},
getTopLowTicketHandle() {
this.resolveParameterHanle()
this.lowData = []
this.loading = true
this.apipost('AirTicket_get_GetTopTicketProduct', this.parementers, (r) => {
if (r.resultCode == 1) {
this.resolveTicketHandle(r.data)
}else{
this.navigatorToHomeHandle()
getSalesHandle(){
const p = { CustomerId: this.customer.customerId }
this.apipost( "b2b_get_GetCustomerCreateByList", p,(res) => {
if (res.resultCode == 1) {
this.sales = res.data
if(this.sales.length==1) this.createBy=this.sales[0]
}
},(err) => {
this.loading = false
}, (e) => {
this.loading = false
this.navigatorToHomeHandle()
})
});
},
resolveTicketHandle(data){
const t = data[0].TicketProductList.find(x=>x.TCID==this.id)
if(!t) {
this.navigatorToHomeHandle()
return
}
this.goList = t.FlightList.filter(x=>x.FlightType==1)
this.backList = t.FlightList.filter(x=>x.FlightType==3)
this.flight = t
setSaleHandle(val){
this.createBy=this.sales[val[0]]
},
getWeeks(d){
const date = new Date(d)
const weeks = ['日', '一', '二', '三', '四', '五', '六']
return `周${weeks[date.getDay()]}`
nativageToOrderHandle(){
uni.redirectTo({
url:'/pages/airTicket/TicketOrderList'
})
},
resolveParameterHanle() {
this.resetParameterHandle()
this.parementers.DepartCityId = this.chosenResult[0].ID
this.parementers.ArriveCityId = this.chosenResult[1].ID
if (this.dateRangeValue.type == 1) {
this.currentDate = this.formatDateHandle(start)
this.filterDate.start = this.dateRangeValue.startDate
this.filterDate.end = this.dateRangeValue.startDate
} else {
const d = this.resolveDateByFuzzyHandle(this.dateRangeValue.fuzzy.fuzzyType)
this.parementers.StartDate = d[0]
this.parementers.EndDate = d[1]
orderHandler(){
if(this.submit) return
const error = this.validate()
if(error!=''){
uni.showToast({
icon:'none',
title:error
})
return
}
this.submit=true
const p = this.createParameter()
this.apipost('sellorder_post_SetOrderInfoForAirTicket',p,r=>{
if(r.resultCode==1){
this.successVisible=true
}else{
uni.showToast({
icon:'error',
title: r.message
})
}
this.submit=false
},e=>{
this.submit=false
})
},
resetParameterHandle() {
this.currentDate = ''
this.parementers = {
StartDate: '',
EndDate: '',
DepartCityId: 0,
ArriveCityId: 0,
AirLineID: 0,
groupId: 2,
TicketType: 2,
StartPlayDay: 0,
EndPlayDay: 0,
WeekDay: ''
validate(){
let msg = ''
if(this.crCount+this.etCount+this.babyCount==0){
msg = '请选择乘机人'
} else if(this.crCount+this.etCount>this.flight.B2BSellNum){
msg = '机位数不足'
} else if(this.crCount==0){
msg = '不支持儿童或婴儿单独出游'
} else if(this.price-this.currentCoupon.discountMoney<=0){
msg = '机票价格异常，无法生成订单'
} else if(this.contactName==''){
msg = '请输入联系人名称'
} else if(this.contactPhone=='' || this.contactPhone.length!=11){
msg = '请输入11位联系电话'
} else if(this.createBy.CreateBy==0){
msg = '请选择与你对接的服务人员'
}
return msg
},
formatDateHandle(date) {
return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2,'0')}-${String(date.getDate()).padStart(2,'0')}`
},
resolveDateByFuzzyHandle(t) {
if (t == 0) return ['', '']
let start = new Date();
let end = new Date()
if (t == -1) {
start.setTime(start.getTime() + 3600 * 1000 * 24 * 1);
end.setMonth(end.getMonth() + 1);
} else if (t == -2) {
start.setTime(start.getTime() + 3600 * 1000 * 24 * 1);
end.setMonth(end.getMonth() + 3)
} else {
const currentDate = new Date()
currentDate.setMonth(currentDate.getMonth() + t);
const year = currentDate.getFullYear();
const month = currentDate.getMonth();
start = new Date(year, month, 1);
end = new Date(year, month + 1, 0);
createParameter(){
const mallUser = uni.getStorageSync('mall_UserInfo')
const list = this.guest.map(x=>{
const n = {
SurName:x.SurName,
Name:x.GivenName,
Sex:x.Sex=='M'?1:2,
PassportNo:x.Passport,
PassportExpiry:x.PassportExpired,
Birthday:x.BrithDay,
MobilePhone:x.Mobile,
Nationality:x.CountryId
}
return n
})
const p = {
OrderId:0,
TCID:this.id,
CustomerType:2,
GroupType:5,
ContactName:this.contactName,
ContactMobile:this.contactPhone,
CustomerId:this.customer.customerId,
OrderSource:5,
Unit_Price:this.flight.B2BPrice,
TC_Price:this.flight.B2BPrice,
CouponAllotIds:this.useCouponId.toString(),
ManNum:this.crCount,
ChirdNum:this.etCount,
ChirdNeedBedNum:this.etCount,
BabyNum:this.babyCount,
PreferPrice:this.price,
YSeatNum:this.crCount+this.etCount,
GuestNum:this.crCount+this.etCount+this.babyCount,
PlaceOrderFrom:2,
MiniAppUserId:mallUser.UserId,
DirectCustomerId:0,
EnterID:0,
GuestList:list,
CreateBy:this.createBy.CreateBy
}
return [this.formatDateHandle(start), this.formatDateHandle(end)]
},
}
return p
},
showCouponHandler() {
this.showCoupon = this.couponList.length > 0;
},
guestChangeHandle(val) {
this.guest = val ? val : []
},
closeCouponHandler(e) {
if (e != -1) {
this.useCouponId = e;
if (this.useCouponId) {
this.currentCoupon = this.couponList.find(x => x.id == this.useCouponId)
if (this.currentCoupon.couponsType == 1) {
this.currentCoupon.discountMoney = this.currentCoupon.denomination
} else {
this.currentCoupon.discountMoney = (parseFloat(this.price) * (1 - parseFloat(this.currentCoupon
.denomination / 10)))
.toFixed(2)
}
} else {
this.currentCoupon.discountMoney = 0
}
}
this.showCoupon = false;
},
getUserCouponList() {
let couponParams = {
"lineId": 0,
"lineteamId": 0,
"userId": this.customer.accountId,
"CouponsUseScope": 4,
"isExpansion": 0,
"CustomerType": 0,
"TCID": 0,
}
this.apipost(
"coupon_post_GetUserCanUseCouponList", couponParams,
(res) => {
console.log("coupon_post_GetUserCanUseCouponList", res);
if (res.resultCode == 1) {
this.couponList = res.data
this.calcPzCouponHandler()
}
},
(err) => {}
);
},
usePzCouponHandler() {
this.showPz = false
this.closeCouponHandler(this.pzCoupon.id)
this.pzCoupon = null
},
calcPzCouponHandler() {
this.couponList.forEach((x) => {
if (x.expansionModel.denomination > 0) {
if (this.pzCoupon && this.pzCoupon.expansionModel.denomination < x.expansionModel
.denomination)
this.pzCoupon = x
else
this.pzCoupon = x
x.realDenomination = x.denomination
x.denomination = x.expansionModel.denomination
}
})
this.showPz = this.pzCoupon ? true : false
},
navigatorToHomeHandle() {
uni.redirectTo({
url: '/pages/index/index'
})
},
getTopLowTicketHandle() {
this.resolveParameterHanle()
this.lowData = []
this.loading = true
this.apipost('AirTicket_get_GetTopTicketProduct', this.parementers, (r) => {
if (r.resultCode == 1) {
this.resolveTicketHandle(r.data)
} else {
this.navigatorToHomeHandle()
}
this.loading = false
}, (e) => {
this.loading = false
this.navigatorToHomeHandle()
})
},
resolveTicketHandle(data) {
const t = data[0].TicketProductList.find(x => x.TCID == this.id)
if (!t) {
this.navigatorToHomeHandle()
return
}
this.goList = t.FlightList.filter(x => x.FlightType == 1)
this.backList = t.FlightList.filter(x => x.FlightType == 3)
this.flight = t
const demo = {
g: this.goList,
b: this.backList,
f: this.flight
}
uni.setStorageSync('demo_flight', demo)
},
getWeeks(d) {
const date = new Date(d)
const weeks = ['日', '一', '二', '三', '四', '五', '六']
return `周${weeks[date.getDay()]}`
},
resolveParameterHanle() {
this.resetParameterHandle()
this.parementers.DepartCityId = this.chosenResult[0].ID
this.parementers.ArriveCityId = this.chosenResult[1].ID
if (this.dateRangeValue.type == 1) {
this.currentDate = this.formatDateHandle(start)
this.filterDate.start = this.dateRangeValue.startDate
this.filterDate.end = this.dateRangeValue.startDate
} else {
const d = this.resolveDateByFuzzyHandle(this.dateRangeValue.fuzzy.fuzzyType)
this.parementers.StartDate = d[0]
this.parementers.EndDate = d[1]
}
},
resetParameterHandle() {
this.currentDate = ''
this.parementers = {
StartDate: '',
EndDate: '',
DepartCityId: 0,
ArriveCityId: 0,
AirLineID: 0,
groupId: 2,
TicketType: 2,
StartPlayDay: 0,
EndPlayDay: 0,
WeekDay: ''
}
},
formatDateHandle(date) {
return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2,'0')}-${String(date.getDate()).padStart(2,'0')}`
},
resolveDateByFuzzyHandle(t) {
if (t == 0) return ['', '']
let start = new Date();
let end = new Date()
if (t == -1) {
start.setTime(start.getTime() + 3600 * 1000 * 24 * 1);
end.setMonth(end.getMonth() + 1);
} else if (t == -2) {
start.setTime(start.getTime() + 3600 * 1000 * 24 * 1);
end.setMonth(end.getMonth() + 3)
} else {
const currentDate = new Date()
currentDate.setMonth(currentDate.getMonth() + t);
const year = currentDate.getFullYear();
const month = currentDate.getMonth();
start = new Date(year, month, 1);
end = new Date(year, month + 1, 0);
}
return [this.formatDateHandle(start), this.formatDateHandle(end)]
},
}
}
</script>
<style>
@import url('../../asset/css/flex.css');
.f-detail {
background-color: #F5F5F5;
background-image: linear-gradient(180deg, #DEBF7B, #F5F5F5);
background-size: 100% 900rpx;
background-repeat: no-repeat;
height: 100vh;
width: 100vw;
padding-top: 30rpx;
}
.f-detail .safeBottom{
/* background-color: #f5f5f5; */
padding-bottom: calc(156rpx + constant(safe-area-inset-bottom));
padding-bottom: calc(156rpx + env(safe-area-inset-bottom));
}
.f-detail .flight-card {
background-color: #fff;
border-radius: 16rpx;
padding: 20rpx;
margin: 30rpx;
}
.f-detail .flight-card .title {
font-size: 32rpx;
font-weight: bold;
color: #080A09;
}
.f-detail .flight-card .flight-status {
background: #E1C278;
border-radius: 8rpx;
font-size: 24rpx;
color: #111111;
font-weight: 400;
padding: 7rpx 14rpx;
}
.f-detail .flight-card .city {
width: 98rpx;
margin: 0 12rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: #080A09;
}
.f-detail .flight-card .bold {
font-size: 28rpx;
font-weight: bold;
line-height: 1;
}
.f-detail .f14 {
font-size: 28rpx;
}
.f-detail .form-items {
margin-bottom: 20rpx;
display: flex;
align-items: center;
padding-bottom: 20rpx;
border-bottom: 1px solid #f5f5f5;
font-size: 28px;
font-weight: 500;
}
.f-detail .form-items:last-child {
border-bottom: none;
}
.f-detail .form-items .label {
font-size: 28rpx;
font-weight: 600;
margin-right: 60rpx;
flex-shrink: 0;
width: 115rpx;
}
.f-detail .form-items .val {
flex: 1;
}
.f-detail .price-list-details {
margin-bottom: 40rpx;
color: #999;
font-size: 24rpx;
}
.f-detail .order-box {
padding-top: 24rpx;
padding-bottom: calc(constant(safe-area-inset-bottom));
padding-bottom: calc(env(safe-area-inset-bottom));
z-index: 2;
min-height: 156rpx;
background: #F5F5F5;
}
.f-detail .order-box .order-preview{
margin: 0 16px;
padding: 10rpx;
box-shadow: 0 0 40rpx #00000033;
}
.f-detail .jz_OrderReNow {
height: 80rpx;
background-color: #111111;
text-align: center;
line-height: 80rpx;
color: #fff;
font-weight: 600;
font-size: 28rpx;
border-radius: 16rpx;
}
</script>
<style>
@import url('../../asset/css/flex.css');
.f-detail{
background-color: #F5F5F5;
background-image: linear-gradient(180deg, #DEBF7B, #F5F5F5);
background-size: 100% 900rpx;
background-repeat: no-repeat;
height: 100vh;
width: 100vw;
padding-top: 30rpx;
}
.f-detail .flight-card{
background-color: #fff;
border-radius: 16rpx;
padding: 20rpx;
margin: 30rpx;
}
.f-detail .flight-card .title{
font-size: 32rpx;
font-weight: bold;
color: #080A09;
}
.f-detail .flight-card .flight-status{
background: #E1C278;
border-radius: 8rpx;
font-size: 24rpx;
color: #111111;
font-weight: 400;
padding: 7rpx 14rpx;
}
.f-detail .flight-card .city{
width: 98rpx;
margin: 0 12rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
color: #080A09;
}
.f-detail .flight-card .bold{
font-size: 28rpx;
font-weight: bold;
line-height: 1;
}
</style>
</style>
\ No newline at end of file
pages/airTicket/ticketList/ticketList.vue
View file @ 81450a70
......@@ -49,7 +49,7 @@
</view>
<scroll-view scroll-y="true" class="col" style="width: 100%;height: 1px;">
<view style="padding:30rpx">
<view class="flight-card" v-for="(x,i) in flights">
<view class="flight-card" @click="nativageToOrderHandle(x.TCID)" v-for="(x,i) in flights">
<view class="q-mt-md row items-start">
<view class="col">
......@@ -240,6 +240,11 @@
});
},
methods: {
nativageToOrderHandle(id){
uni.navigateTo({
url:'/pages/airTicket/flightDetail?id='+id
})
},
applySorting(flights) {
switch (this.sortBy) {
case 0:
......
pages/jiuzhai/jz_Reserve.vue
View file @ 81450a70
......@@ -422,7 +422,7 @@
</view>
</view>
<view class="empty-block"></view>
<coupon v-if="couponList.length > 0 && showCoupon" :list="couponList" :current="useCouponId" @close="closeCouponHandler" :current-price="realCurrentPriceInfo" :order="orderMsg"></coupon>
<coupon v-if="couponList.length > 0 && showCoupon" :price="price" :list="couponList" :current="useCouponId" @close="closeCouponHandler" :current-price="realCurrentPriceInfo" :order="orderMsg"></coupon>
<view style="padding: 50rpx 40rpx" v-if="tips != ''">
<view class="big-title">
<text>重要提示</text>
......
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