Skip to content

M
million
Commit 47e632e8 authored by youjie's avatar youjie
Browse files
Options

no message

parent b2059d4c
Show whitespace changes
Inline Side-by-side
Showing with 785 additions and 301 deletions
src/components/hotal/RoomCard.vue
View file @ 47e632e8
<template> <template>
<div> <div v-if="prices">
<div class="text-subtitle2 text-weight-bold">選擇房間類型、選項</div> <div class="text-subtitle2 text-weight-bold">選擇房間類型、選項</div>
<div class="text-grey-6 f12 q-my-md">請選擇出房間類型</div> <div class="text-grey-6 f12 q-my-md">請選擇出房間類型</div>
<div class="rounded-borders"> <q-separator color="grey-2" class="q-my-md" />
<div class="non-selectable"> <div class="rounded-borders col" v-for="(item,index) in prices" :key="index"
<div class="row wrap"> :class="{'max-width':$q.platform.is.mobile?'100vw':'auto'}">
<div class="relative q-pa-xs cursor-pointer" <div class="non-selectable row">
:class="{'col-4':prices.length>2,'col-6':prices.length<3}" <div class="q-pr-md cursor-pointer" @click="showImageHandler(item.roomImageURL,item.images)"
v-for="(item,index) in prices" :key="index"> :class="{'col-2':$q.platform.is.desktop,'col-6':$q.platform.is.mobile}"
<div class="rounded-borders overflow-hidden column " style="border-right: 1px solid #F5F5F5;">
:style="{'border': chooseObj&&item.id==chooseObj.id?'':'1px solid #eee'}" <div class="relative rounded-borders overflow-hidden column bg-grey-1"
:class="{'bg-grey-1 ':chooseObj&&item.id!=chooseObj.id, style="border: 1px solid #eee">
'bg-primary shadow-24':chooseObj&&item.id==chooseObj.id}"
@click="chosenDateHandler(item)">
<q-img :src="item.roomImageURL" <q-img :src="item.roomImageURL"
:ratio="16/9" style="width: 100%;"/> :ratio="16/9" style="width: 100%;"/>
<div class="column q-pt-xs q-pb-sm q-px-sm"> <div class="column q-pt-xs q-pb-sm q-px-sm">
<span class="fz15 text-weight-bold" <span class="fz15 text-weight-bold">
:class="{'text-white':chooseObj&&item.id==chooseObj.id}">
<span v-if="item.roomType==1">{{getGradeType(item.gradeType)}}单人间</span> <span v-if="item.roomType==1">{{getGradeType(item.gradeType)}}单人间</span>
<span v-if="item.roomType==2">{{getGradeType(item.gradeType)}}双人间</span> <span v-if="item.roomType==2">{{getGradeType(item.gradeType)}}双人间</span>
<span v-if="item.roomType==3">{{getGradeType(item.gradeType)}}大床房</span> <span v-if="item.roomType==3">{{getGradeType(item.gradeType)}}大床房</span>
...@@ -29,28 +26,61 @@ ...@@ -29,28 +26,61 @@
<span v-if="(item.roomType==9||item.roomType=='')&&item.gradeType==''">未知房型</span> <span v-if="(item.roomType==9||item.roomType=='')&&item.gradeType==''">未知房型</span>
</span> </span>
<span class="fz13" <span class="fz13 text-grey-6">
:class="{'text-grey-6 ':chooseObj&&item.id!=chooseObj.id,
'text-grey-2':chooseObj&&item.id==chooseObj.id}">
<span v-if="item.smoking==0">禁烟, </span> <span v-if="item.smoking==0">禁烟, </span>
<span v-if="item.smoking==1">可吸烟, </span> <span v-if="item.smoking==1">可吸烟, </span>
<span v-if="item.withBath==0">无浴室</span> <span v-if="item.withBath==0">无浴室</span>
<span v-if="item.withBath==1">有浴室</span> <span v-if="item.withBath==1">有浴室</span>
</span> </span>
</div> </div>
</div>
<div class="absolute" style="right: 10px;bottom: 65px;"> <div class="absolute" style="right: 10px;bottom: 65px;">
<span class="text-white f12 q-px-sm row items-center" <span class="text-white f12 q-px-sm row items-center"
style="background: rgba(23,23,23,.5);border-radius: 30px;" style="background: rgba(23,23,23,.5);border-radius: 30px;">
@click.stop="showImageHandler(item.roomImageURL,item.images)">
<q-icon class="q-pl-xs" name="images"></q-icon> <q-icon class="q-pl-xs" name="images"></q-icon>
<span>{{item.images.length}}</span> <span>{{item.images.length}}</span>
</span> </span>
</div> </div>
</div> </div>
</div>
<div class="col" :class="{'column':$q.platform.is.desktop,'row no-wrap scroll':$q.platform.is.mobile}">
<div class="relative q-pt-lg q-pb-sm q-pl-md" v-for="(subItem,indexs) in item.roomOptions"
:style="{'border-bottom': indexs+1!=item.roomOptions.length?'1px solid #F5F5F5':'',
'min-width':$q.platform.is.mobile?'150px':'auto'}">
<div class="q-pt-sm"
:class="{'row no-wrap justify-between':$q.platform.is.desktop,'column':$q.platform.is.mobile}">
<template v-if="$q.platform.is.desktop">
<div class="col-2 text-grey-6 q-pr-sm">
{{subItem.bookingDeadline}}
</div>
<div class="col">{{subItem.childRates}}</div>
<div class="col-2 text-red">
<div>入住时间 {{subItem['check-inStartTime']}}</div>
<div>最迟入住时间 {{subItem['finalCheck-inTime']}}</div>
<div>最迟退房时间 {{subItem['finalCheck-outTime']}}</div>
</div>
</template>
<div class="col" v-if="getPrice2(subItem.chargeableRateInfoPerPersonForANightBySetCurrency)">
<span class="fz13">CNY</span>
<span class="text-red text-weight-bold q-px-sm"
:class="{'fz28':$q.platform.is.desktop}">{{getPrice2(subItem.chargeableRateInfoPerPersonForANightBySetCurrency)}}
<span style="font-size:12px;color:#888888">/人均</span>
</span>
<!-- <span>{{getPrice(subItem.chargeableRateInfoPerPersonForANightBySetCurrency)}}</span> -->
</div>
<div>
<q-btn color="primary" label="立即預訂" unelevated :class="{'q-px-lg':$q.platform.is.desktop}"
@click="goOrderHandler(subItem.roomOptionCd)"/>
</div>
</div>
<span class="absolute q-px-sm text-white" :class="getMealType(subItem.meals)=='无餐'?'bg-dark':'bg-green'"
style="left: 0;top:0;border-top-right-radius: 5px;border-bottom-right-radius: 5px;">{{getMealType(subItem.meals)}}</span>
<span class="text-red-6" v-if="$q.platform.is.desktop">{{subItem.minNights}}</span>
</div> </div>
</div> </div>
</div> </div>
<q-separator color="grey-2" class="q-my-md"/>
</div>
<q-dialog class="no-padding" v-model="showImagePriview" <q-dialog class="no-padding" v-model="showImagePriview"
v-if="images && images.length > 0"> v-if="images && images.length > 0">
<image-preview :current="currentImage" :images="images"></image-preview> <image-preview :current="currentImage" :images="images"></image-preview>
...@@ -63,7 +93,7 @@ ...@@ -63,7 +93,7 @@
import ImagePreview from 'src/components/common/ImagePreview.vue' import ImagePreview from 'src/components/common/ImagePreview.vue'
export default { export default {
components: {ImagePreview}, components: {ImagePreview},
props: ["priceList"], props: ["priceList",'SimilarObj','msg'],
data() { data() {
return { return {
images: [], images: [],
...@@ -80,11 +110,39 @@ ...@@ -80,11 +110,39 @@
}, },
deep: true, // 深度监听 deep: true, // 深度监听
}, },
SimilarObj: {
handler(newVal, oldValue) {
this.SimilarObj = newVal;
},
deep: true,
},
msg: {
handler(newVal, oldValue) {
this.msg = newVal;
},
deep: true,
},
}, },
created() { created() {
this.prices = this.priceList; this.prices = this.priceList;
}, },
methods: { methods: {
goOrderHandler(item){
let order = {
msg: this.msg,
liveNvm: this.SimilarObj.liveNvm,
roomOptionCd: item,
}
let key = this.$md5(JSON.stringify(order))
let pickuporderHotal = localStorage.getItem('pickuporderHotal')
pickuporderHotal = pickuporderHotal?JSON.parse(pickuporderHotal):[]
pickuporderHotal.push({
key,
order
})
localStorage.setItem("pickuporderHotal",JSON.stringify(pickuporderHotal))
this.CommonJump('/HotalForm/'+key, {});
},
init() { init() {
this.chooseObj = null this.chooseObj = null
}, },
...@@ -97,6 +155,36 @@ ...@@ -97,6 +155,36 @@
this.currentImage = url this.currentImage = url
this.showImagePriview = true this.showImagePriview = true
}, },
//获取价格
getPrice(price) {
//(chargeableRateInfoPerPersonForANightBySetCurrency/0.9975)*入住天数*入住人数
//天数
this.init();
return Math.ceil(price / this.SimilarObj.JapanIncrease)*(this.SimilarObj.numberOfAdults+this.SimilarObj.numberOfChildren)*this.DateDiff(this.SimilarObj.arrivalDate,this.SimilarObj.departureDate);
},
getPrice2(price){
if(this.SimilarObj.JapanIncrease)
return Math.ceil(price / this.SimilarObj.JapanIncrease)
},
//获取餐
getMealType(meals) {
if (meals != "") {
let mealType = meals.split(",");
if (mealType[0] == 0 && mealType[2] == 0) {
return "无餐";
}
if (mealType[0] == 1 && mealType[2] == 1) {
return "含早晚餐";
}
if (mealType[0] == 1 && mealType[2] == 0) {
return "含早餐";
}
if (mealType[0] == 0 && mealType[2] == 1) {
return "含晚餐";
}
}
},
//获取房型 //获取房型
getGradeType(type) { getGradeType(type) {
let gradeType = ""; let gradeType = "";
......
src/components/hotal/orderPreview.vue
View file @ 47e632e8
...@@ -20,7 +20,78 @@ ...@@ -20,7 +20,78 @@
</div> </div>
</div> </div>
</template> </template>
<div class="text-grey-6 f12 q-my-md">選擇數量</div> <div class="text-grey-6 f12 q-my-md">住宿日期</div>
<div v-for="(x,index) in roomGroup" :key="index">
<div v-for="(y,i) in x.rateGroup" :key="i">
<div class="row items-end">
<div class="col" :class="{'column':$q.platform.is.mobile}">
<div>
<span class="text-subtitle2 text-weight-bold">{{ selectedObj?getMealType(selectedObj.meals):''}}</span>
<span class="text-grey-6 f12 q-ml-sm">{{y.stayDate}}</span></span>
</div>
<div v-if="$q.platform.is.mobile">
<span class="text-grey-7 product-price" style="font-size: 13px">
<template v-if="y.perAdultRateBySetCurrency">
CNY{{y.perAdultRateBySetCurrency}}/人
</template>
<template v-else="y.totalPerRoomRateBySetCurrency">
CNY{{y.totalPerRoomRateBySetCurrency}}/晚
</template>
<!-- CNY {{ selectedObj?getPrice2(selectedObj.chargeableRateInfoPerPersonForANightBySetCurrency):0 }} /人均 -->
</span>
</div>
</div>
<div class="row items-end">
<span v-if="$q.platform.is.desktop" class="text-grey-7 product-price" style="font-size: 13px">
<template v-if="y.perAdultRateBySetCurrency">
CNY{{y.perAdultRateBySetCurrency}}/人
</template>
<template v-else="y.totalPerRoomRateBySetCurrency">
CNY{{y.totalPerRoomRateBySetCurrency}}/晚
</template>
<!-- CNY {{selectedObj? getPrice2(selectedObj.chargeableRateInfoPerPersonForANightBySetCurrency):0 }} /人均 -->
</span>
<!-- <q-input
style="width: 150px"
@input="changePeople"
v-model="chosenObj.Count"
class="col"
:class="{
'q-ml-sm q-px-none q-pl-none': $q.platform.is.desktop,
}"
mask="#"
reverse-fill-mask
dense
standout
readonly
>
<template v-slot:prepend>
<q-btn
color="primary"
size="sm"
class="q-px-none"
flat
icon="remove"
@click="addPeople('Count', -1)"
/>
</template>
<template v-slot:append>
<q-btn
color="primary"
size="sm"
class="q-px-none"
flat
icon="add"
@click="addPeople('Count', 1)"
/>
</template>
</q-input> -->
</div>
</div>
</div>
</div>
<!-- <div class="text-grey-6 f12 q-my-md">選擇數量</div>
<div class="row items-end"> <div class="row items-end">
<div class="col" :class="{'column':$q.platform.is.mobile}"> <div class="col" :class="{'column':$q.platform.is.mobile}">
<div> <div>
...@@ -73,7 +144,7 @@ ...@@ -73,7 +144,7 @@
</template> </template>
</q-input> </q-input>
</div> </div>
</div> </div> -->
</div> </div>
<div class="q-mt-md q-pt-md" style="border-top: 1px dashed #eee"> <div class="q-mt-md q-pt-md" style="border-top: 1px dashed #eee">
<div class="row items-center"> <div class="row items-center">
...@@ -135,6 +206,7 @@ export default { ...@@ -135,6 +206,7 @@ export default {
chosenObj: null, chosenObj: null,
sumPrice:0, sumPrice:0,
selectedObj: null, selectedObj: null,
roomGroup: null
}; };
}, },
created() { created() {
...@@ -143,7 +215,7 @@ export default { ...@@ -143,7 +215,7 @@ export default {
methods: { methods: {
goOrderHandler(){ goOrderHandler(){
let order = { let order = {
msg: JSON.stringify(this.msg), msg: this.msg,
// hotelId: this.msg.hotelId, // hotelId: this.msg.hotelId,
// arrivalDate: this.msg.arrivalDate, // arrivalDate: this.msg.arrivalDate,
// departureDate: this.msg.departureDate, // departureDate: this.msg.departureDate,
...@@ -152,7 +224,7 @@ export default { ...@@ -152,7 +224,7 @@ export default {
id: this.p.id, id: this.p.id,
selectedObjId: this.selectedObj.id, selectedObjId: this.selectedObj.id,
roomOptionCd: this.selectedObj.roomOptionCd, roomOptionCd: this.selectedObj.roomOptionCd,
chosenObj: this.chosenObj, Count: this.chosenObj.Count,
sumPrice: this.sumPrice sumPrice: this.sumPrice
} }
let key = this.$md5(JSON.stringify(order)) let key = this.$md5(JSON.stringify(order))
...@@ -167,11 +239,110 @@ export default { ...@@ -167,11 +239,110 @@ export default {
}, },
handleSelect(item){ handleSelect(item){
this.selectedObj = item this.selectedObj = item
console.log(this.selectedObj,'-----') this.sumPrice = 0
setTimeout(()=>{ setTimeout(()=>{
this.calcMoney() this.getData()
// this.calcMoney()
},100) },100)
}, },
getData() {
let msg = JSON.parse(JSON.stringify(this.msg))
msg.roomOptionCd = this.selectedObj.roomOptionCd
this.$q.loading.show();
this.apipost(
"dmc_post_Get_GetJAPAN_RoomsList",
msg,
(r) => {
this.$q.loading.hide();
if (r.data.resultCode == 1) {
let rateGrouoLen = 0;
if(Object.prototype.toString.call(r.data.data.roomGroup) == '[object Object]'){
let arr = [];
arr.push(r.data.data.roomGroup);
this.roomGroup=arr;
}
this.roomGroup.forEach(x=>{
if(Object.prototype.toString.call(x.rateGroup) == '[object Object]'){
let arr = [];
arr.push(x.rateGroup);
x.rateGroup= arr;
}
let tt = 0;
let tt2 = 0;
let AdultTotalPrice = 0;
let childToTalPrice = 0;
let AdultCount = 0;
let childCount = 0;
let AdultJapanPrice = 0;
let ChildJapanPrice = 0;
let AdultJapanCount = 0;
let childJapanCount = 0;
//原始成人
let oldAount=0;
let childAount=0;
let oldAuditPrice=0;
let oldChildPrice=0;
// this.TotalChildCount+=x.roomChildCount*x.rateGroup.length;
rateGrouoLen+= x.rateGroup.length;
// this.chekedChildCount = this.numberOfChildren*rateGrouoLen;
//无价格 只有房间价格
this.sumPrice = 0
let onlyRoomPrice=0;
let onlyJanpnase=0;
x.rateGroup.forEach(z=>{
if(z.perAdultRateBySetCurrency){
z.oldAuditPrice = z.perAdultRateBySetCurrency;
z.oldchildPrice = z.perChildRateBySetCurrency;
z.perAdultRateBySetCurrency = Math.ceil(z.perAdultRateBySetCurrency/r.data.data.JapanIncrease);
z.perChildRateBySetCurrency = Math.ceil(z.perChildRateBySetCurrency/r.data.data.JapanIncrease);
if(x.roomAdultCount>0){
AdultTotalPrice+=parseFloat(z.perAdultRateBySetCurrency);
oldAuditPrice+=parseFloat(z.oldAuditPrice);
AdultJapanPrice+=parseFloat(z.perAdultRate);
}
if(x.roomChildCount>0){
childToTalPrice+=parseFloat(z.perChildRateBySetCurrency);
oldChildPrice+=parseFloat(z.oldchildPrice);
ChildJapanPrice+=parseFloat(z.perChildRate);
}
}
if(z.totalPerRoomRateBySetCurrency){
z.totalPerRoomRateBySetCurrency = Math.ceil(z.totalPerRoomRateBySetCurrency/r.data.data.JapanIncrease);
onlyRoomPrice+=parseFloat(z.totalPerRoomRateBySetCurrency);
onlyJanpnase+=parseFloat(z.totalPerRoomRate);
}
})
AdultCount+=AdultTotalPrice*x.roomAdultCount;
childCount+=childToTalPrice*x.roomChildCount;
// AdultCount+=AdultTotalPrice;
// childCount+=childToTalPrice;
oldAount+=oldAuditPrice;
childAount+=childAount;
// this.parameters.totalChargeableRateInfo += parseFloat(AdultCount+childCount+onlyRoomPrice);
// this.parameters.OldTotalPrice+=parseFloat(oldAount+childAount+onlyRoomPrice);
AdultJapanCount+=AdultJapanPrice*x.roomAdultCount;
childJapanCount+=ChildJapanPrice*x.roomChildCount;
// this.SettlementPrice=this.parameters.totalChargeableRateInfo;
// this.SettlementPrice=this.parameters.totalChargeableRateInfo;
// let price=this.parameters.totalChargeableRateInfo;
this.sumPrice += parseFloat(AdultJapanCount+childJapanCount+onlyJanpnase);
console.log(this.sumPrice,'----')
})
}
})
},
initModel() { initModel() {
this.sumPrice=0 this.sumPrice=0
this.chosenObj = { this.chosenObj = {
......
src/pages/detailsHotal.vue
View file @ 47e632e8
...@@ -35,8 +35,11 @@ ...@@ -35,8 +35,11 @@
/> />
</div> </div>
<q-separator v-if="isShowNav" color="grey-2" class="q-my-sm" /> <q-separator v-if="isShowNav" color="grey-2" class="q-my-sm" />
<div class="row no-wrap items-center justify-between" :class="{'q-pt-md q-mb-xs':!isShowNav,' q-pb-xs':isShowNav}"> <div class="row no-wrap items-center justify-between"
<div class="row no-wrap"> :class="{'q-pt-md q-mb-xs':!isShowNav,' q-pb-xs':isShowNav,}">
<div
:class="{'row no-wrap': $q.platform.is.desktop,'col row justify-between': $q.platform.is.mobile,}">
<q-field stack-label label="入住 / 退房日期" standout <q-field stack-label label="入住 / 退房日期" standout
style="min-width: 190px" dense> style="min-width: 190px" dense>
<div class="self-center full-width no-outline row no-wrap items-center" tabindex="0"> <div class="self-center full-width no-outline row no-wrap items-center" tabindex="0">
...@@ -52,21 +55,21 @@ ...@@ -52,21 +55,21 @@
</q-field> </q-field>
<q-field stack-label label="人数及客房" standout <q-field stack-label label="人数及客房" standout
class="q-ml-lg" class="q-ml-lg"
style="min-width: 190px" dense> :style="{'min-width': $q.platform.is.desktop?'190px':'130px',}" dense>
<div class="self-center full-width no-outline" tabindex="0"> <div class="self-center full-width no-outline" tabindex="0">
{{numberOfAdults}}成人 {{numberOfAdults}}成人
<template v-if="numberOfChildren>0"> {{numberOfChildren}}儿童</template> <template v-if="numberOfChildren>0"> {{numberOfChildren}}儿童</template>
{{roomGroup}}房 {{roomGroup}}房
</div> </div>
<q-popup-proxy :offset="[0, 10]" ref="qDateProxy2"> <q-popup-proxy :offset="[0, 10]" ref="qDateProxy2">
<div class="q-pa-lg q-py-lg"> <div class="q-pa-lg q-py-lg bg-white">
<div class="row items-center"> <div class="items-center"
:clss="{'row':$q.platform.is.desktop,'column':$q.platform.is.mobile}">
<span class="text-grey-7 product-price fz14 q-mr-lg">客房</span> <span class="text-grey-7 product-price fz14 q-mr-lg">客房</span>
<div> <div>
<q-input <q-input
style="width: 150px" :style="{'width': $q.platform.is.desktop?'150px':'auto'}"
v-model="roomGroup" v-model="roomGroup"
class="col"
mask="#" mask="#"
reverse-fill-mask reverse-fill-mask
dense dense
...@@ -98,11 +101,11 @@ ...@@ -98,11 +101,11 @@
</div> </div>
<q-separator color="grey-2" class="q-my-md" /> <q-separator color="grey-2" class="q-my-md" />
<div class="column" v-for="(x,index) in msg.searchroomGroup" :key="index"> <div class="column" v-for="(x,index) in msg.searchroomGroup" :key="index">
<div class="row"> <div class="row no-wrap">
<div class="row items-center"> <div class="items-center" :clss="{'row':$q.platform.is.desktop,'column':$q.platform.is.mobile}">
<span class="text-grey-7 product-price fz14 q-mr-lg">成人</span> <span class="text-grey-7 product-price fz14 q-mr-lg">成人</span>
<q-input <q-input
style="width: 150px" :style="{'width': $q.platform.is.desktop?'150px':'auto'}"
v-model="x.numberOfAdults" v-model="x.numberOfAdults"
class="col" class="col"
mask="#" mask="#"
...@@ -133,10 +136,11 @@ ...@@ -133,10 +136,11 @@
</template> </template>
</q-input> </q-input>
</div> </div>
<div class="row items-center q-ml-lg"> <div class="items-center q-ml-lg"
:clss="{'row':$q.platform.is.desktop,'column':$q.platform.is.mobile}">
<span class="text-grey-7 product-price fz14 q-mr-lg">儿童</span> <span class="text-grey-7 product-price fz14 q-mr-lg">儿童</span>
<q-input <q-input
style="width: 150px" :style="{'width': $q.platform.is.desktop?'150px':'auto'}"
v-model="x.numberOfChildren" v-model="x.numberOfChildren"
class="col" class="col"
mask="#" mask="#"
...@@ -170,11 +174,20 @@ ...@@ -170,11 +174,20 @@
</div> </div>
<q-separator v-if="index!=(msg.searchroomGroup.length-1)" color="grey-2" class="q-my-md" /> <q-separator v-if="index!=(msg.searchroomGroup.length-1)" color="grey-2" class="q-my-md" />
</div> </div>
<div class="row q-pt-md">
<q-btn
color="primary"
unelevated
class="q-px-xl col"
label="确定"
@click="getData(),$refs.qDateProxy2.hide()"
/>
</div>
</div> </div>
</q-popup-proxy> </q-popup-proxy>
</q-field> </q-field>
</div> </div>
<div> <div v-if="$q.platform.is.desktop">
<q-btn <q-btn
color="primary" color="primary"
unelevated unelevated
...@@ -183,6 +196,162 @@ ...@@ -183,6 +196,162 @@
@click="getRoom" @click="getRoom"
/> />
</div> </div>
<!-- <template v-if="$q.platform.is.mobile">
<div class="col"></div>
<div style="height: 30px;">
<q-btn style="height: 33px;width: 33px;" unelevated round
color="primary" class="q-pt-xs iconfont iconchazhao">
<q-popup-proxy class="no-shadow" style="box-shadow: 0 0 50px #ddd !important" :offset="[0, 20]"
ref="qDateProxyMore">
<q-card class="q-pa-md rounded-borders" style="width: 300px">
<div class="q-mb-md text-subtitle2">更多</div>
<div class="q-my-md">
<div
:class="{'row no-wrap': $q.platform.is.desktop,'column': $q.platform.is.mobile,}">
<q-field stack-label label="入住 / 退房日期" standout dense>
<div class="self-center full-width no-outline row no-wrap items-center" tabindex="0">
<span>{{dateRangeFormat}} </span>
<q-chip size="9px" clickable
text-color="white"
color="dark" square>{{liveNvm}} 晚</q-chip>
</div>
<q-popup-proxy :offset="[0, 10]" ref="qDateProxy">
<q-date v-model="dateRange" :options="optionsFn" range mask="YYYY/MM/DD" landscape
@range-end="dateRangeHandler"></q-date>
</q-popup-proxy>
</q-field>
<q-field stack-label label="人数及客房" standout dense>
<div class="self-center full-width no-outline" tabindex="0">
{{numberOfAdults}}成人
<template v-if="numberOfChildren>0"> {{numberOfChildren}}儿童</template>
{{roomGroup}}房
</div>
<q-popup-proxy :offset="[0, 10]" ref="qDateProxy2">
<div class="q-pa-lg q-py-lg bg-white">
<div class="row items-center">
<span class="text-grey-7 product-price fz14 q-mr-lg">客房</span>
<div>
<q-input
v-model="roomGroup"
class="col"
mask="#"
reverse-fill-mask
dense
standout
readonly
>
<template v-slot:prepend>
<q-btn
color="primary"
size="sm"
class="q-px-none"
flat
icon="remove"
@click="addPeople('room', -1)"
/>
</template>
<template v-slot:append>
<q-btn
color="primary"
size="sm"
class="q-px-none"
flat
icon="add"
@click="addPeople('room', 1)"
/>
</template>
</q-input>
</div>
</div>
<q-separator color="grey-2" class="q-my-md" />
<div class="column" v-for="(x,index) in msg.searchroomGroup" :key="index">
<div class="row no-wrap">
<div class="row items-center">
<span class="text-grey-7 product-price fz14 q-mr-lg">成人</span>
<q-input
v-model="x.numberOfAdults"
mask="#"
reverse-fill-mask
dense
standout
readonly
>
<template v-slot:prepend>
<q-btn
color="primary"
size="sm"
class="q-px-none"
flat
icon="remove"
@click="addPeople('numberOfAdults', -1,x)"
/>
</template>
<template v-slot:append>
<q-btn
color="primary"
size="sm"
class="q-px-none"
flat
icon="add"
@click="addPeople('numberOfAdults', 1,x)"
/>
</template>
</q-input>
</div>
<div class="row items-center q-ml-lg">
<span class="text-grey-7 product-price fz14 q-mr-lg">儿童</span>
<q-input
v-model="x.numberOfChildren"
mask="#"
reverse-fill-mask
dense
standout
readonly
>
<template v-slot:prepend>
<q-btn
color="primary"
size="sm"
class="q-px-none"
flat
icon="remove"
@click="addPeople('numberOfChildren', -1,x)"
/>
</template>
<template v-slot:append>
<q-btn
color="primary"
size="sm"
class="q-px-none"
flat
icon="add"
@click="addPeople('numberOfChildren', 1,x)"
/>
</template>
</q-input>
</div>
</div>
<q-separator v-if="index!=(msg.searchroomGroup.length-1)" color="grey-2" class="q-my-md" />
</div>
</div>
</q-popup-proxy>
</q-field>
</div>
</div>
<div class="q-my-md row">
<q-btn
color="primary"
unelevated
class="q-px-xl col"
label="搜索"
@click="getRoom(),$refs.qDateProxyMore.hide()"
/>
</div>
</q-card>
</q-popup-proxy>
</q-btn>
</div>
</template> -->
</div> </div>
</div> </div>
</div> </div>
...@@ -355,6 +524,7 @@ ...@@ -355,6 +524,7 @@
style="max-width: 1200px; margin-left: auto; margin-right: auto" style="max-width: 1200px; margin-left: auto; margin-right: auto"
> >
<div class="text-h6">選擇方案</div> <div class="text-h6">選擇方案</div>
<div <div
style=" style="
background: #fff; background: #fff;
...@@ -363,17 +533,50 @@ ...@@ -363,17 +533,50 @@
margin-top: 20px; margin-top: 20px;
" "
> >
<div class="text-h6 q-pt-lg" v-if="$q.platform.is.mobile"> <div v-if="$q.platform.is.mobile">
所選方案詳情 <div class="row items-center justify-end">
<span class="product-price text-h6 q-mr-md"
>CNY
{{
moneyFormat(MinPrice, 0)
}}</span
>
<q-btn
color="primary"
outline
:label="showOrderPreview ? '取消選擇' : '選擇'"
@click="changeShowOrderPreviewHandler"
class="q-px-lg"
/>
</div>
<div class="text-info q-mt-md text-right">
最早可預訂日期：{{ StartDate }}
</div>
</div>
<div
class="rounded-borders bg-white q-pa-md q-mt-md"
v-if="$q.platform.is.mobile&&showOrderPreview"
>
<RoomCard
:priceList="SimilarList"
:SimilarObj="SimilarObj"
:msg="msg"
@change="changeChosenDateHandler"
ref="RoomCard"
></RoomCard>
</div> </div>
<!-- <div class="text-h6 q-pt-lg" v-if="$q.platform.is.mobile">
所選方案詳情
</div> -->
<div <div
class="bg-white rounded-borders q-mt-md" class="bg-white rounded-borders q-mt-md" v-if="$q.platform.is.desktop"
> >
<div class="q-pa-md row"> <div class="q-pa-md row">
<div class="col"> <div class="col">
<div <div
class="text-subtitle1 text-weight-bold row items-center" class="text-subtitle1 text-weight-bold row items-center"
v-if="$q.platform.is.desktop"
> >
<span class="q-mr-md">行程標準出行方案</span> <span class="q-mr-md">行程標準出行方案</span>
<!-- <q-chip <!-- <q-chip
...@@ -405,7 +608,7 @@ ...@@ -405,7 +608,7 @@
color="primary" color="primary"
outline outline
:label="showOrderPreview ? '取消選擇' : '選擇'" :label="showOrderPreview ? '取消選擇' : '選擇'"
@click="showOrderPreview = !showOrderPreview" @click="changeShowOrderPreviewHandler"
class="q-px-lg" class="q-px-lg"
/> />
</div> </div>
...@@ -419,25 +622,15 @@ ...@@ -419,25 +622,15 @@
style="border-top: 1px solid #eee" style="border-top: 1px solid #eee"
v-if="showOrderPreview" v-if="showOrderPreview"
> >
<div class="q-mt-lg row" v-if="$q.platform.is.desktop"> <div class="q-mt-lg" v-if="$q.platform.is.desktop">
<div class="col">
<RoomCard <RoomCard
:priceList="SimilarList" :priceList="SimilarList"
:SimilarObj="SimilarObj"
:msg="msg"
@change="changeChosenDateHandler" @change="changeChosenDateHandler"
ref="RoomCard" ref="RoomCard"
></RoomCard> ></RoomCard>
</div> </div>
<div class="col q-ml-xl">
<order-preview
:JapanIncrease="JapanIncrease"
:price="currentPrice"
:SimilarList="SimilarList"
:msg="msg"
:liveNvm="liveNvm"
@reset="resetHandler"
></order-preview>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -460,6 +653,9 @@ ...@@ -460,6 +653,9 @@
<div <div
class="q-mt-md" class="q-mt-md"
ref="diyContext" ref="diyContext"
:class="{
'q-px-md': $q.screen.width < 1220 && $q.platform.is.mobile,
}"
> >
<div class="q-pb-md">{{hotelDetails.hotelDescription}}</div> <div class="q-pb-md">{{hotelDetails.hotelDescription}}</div>
<div class="q-pb-md">{{hotelDetails.bathUsage}}</div> <div class="q-pb-md">{{hotelDetails.bathUsage}}</div>
...@@ -470,7 +666,9 @@ ...@@ -470,7 +666,9 @@
:class="{ :class="{
'q-px-md': $q.screen.width < 1220 && $q.platform.is.mobile, 'q-px-md': $q.screen.width < 1220 && $q.platform.is.mobile,
}">服务设施</div> }">服务设施</div>
<div class="q-mt-sm column"> <div class="q-mt-sm column":class="{
'q-px-md': $q.screen.width < 1220 && $q.platform.is.mobile,
}">
<div class="q-pb-md"><span class="text-weight-bold">接送服务</span> {{hotelDetails.pickupService}}</div> <div class="q-pb-md"><span class="text-weight-bold">接送服务</span> {{hotelDetails.pickupService}}</div>
<div class="q-pb-md row no-wrap"> <div class="q-pb-md row no-wrap">
<span class="text-weight-bold">客房网络连接</span> <span class="text-weight-bold">客房网络连接</span>
...@@ -480,9 +678,10 @@ ...@@ -480,9 +678,10 @@
color="dark" square v-for="(x,i) in InterArr" :key="i">{{x}}</q-chip> color="dark" square v-for="(x,i) in InterArr" :key="i">{{x}}</q-chip>
</span> </span>
</div> </div>
<div class="row no-wrap"> <div class="row no-wrap overflow-hidden">
<span class="text-weight-bold">水疗</span> <span class="text-weight-bold">水疗</span>
<div class="column col q-pl-md"> <div class="column col q-pl-md">
<div class="scroll" :style="{'max-width': $q.platform.is.mobile?'85vw':'auto'}">
<table class="hotel-details-table q-pb-md"> <table class="hotel-details-table q-pb-md">
<tr> <tr>
<td colspan="3" class="td01">室外</td> <td colspan="3" class="td01">室外</td>
...@@ -512,6 +711,8 @@ ...@@ -512,6 +711,8 @@
<td>{{bathRoom[8]}}</td> <td>{{bathRoom[8]}}</td>
</tr> </tr>
</table> </table>
</div>
<div class="q-pt-sm row wrap"> <div class="q-pt-sm row wrap">
<q-chip size="9px" clickable <q-chip size="9px" clickable
text-color="white" text-color="white"
...@@ -727,6 +928,7 @@ export default { ...@@ -727,6 +928,7 @@ export default {
}, },
JapanIncrease: '', JapanIncrease: '',
SimilarList: [], SimilarList: [],
SimilarObj: null,
isDirect: 1, isDirect: 1,
TripConfig: {}, TripConfig: {},
isShowNav: false, isShowNav: false,
...@@ -843,6 +1045,17 @@ export default { ...@@ -843,6 +1045,17 @@ export default {
document.getElementsByTagName("body")[0].style = ""; document.getElementsByTagName("body")[0].style = "";
}, },
methods: { methods: {
changeShowOrderPreviewHandler(){
this.SimilarObj = {
JapanIncrease: this.JapanIncrease,
numberOfAdults: this.numberOfAdults,
numberOfChildren: this.numberOfChildren,
arrivalDate: this.msg.arrivalDate,
departureDate: this.msg.departureDate,
liveNvm: this.liveNvm
}
this.showOrderPreview = !this.showOrderPreview
},
showImageHandler(url) { showImageHandler(url) {
this.currentImage = url this.currentImage = url
this.showImagePriview = true this.showImagePriview = true
...@@ -887,6 +1100,9 @@ export default { ...@@ -887,6 +1100,9 @@ export default {
this.dateRangeFormat = `${this.msg.arrivalDate} - ${this.msg.departureDate} ` this.dateRangeFormat = `${this.msg.arrivalDate} - ${this.msg.departureDate} `
if (this.$refs.qDateProxy) this.$refs.qDateProxy.hide() if (this.$refs.qDateProxy) this.$refs.qDateProxy.hide()
this.liveNvm = this.dateDiffer(this.msg.arrivalDate,this.msg.departureDate) this.liveNvm = this.dateDiffer(this.msg.arrivalDate,this.msg.departureDate)
if(this.$q.platform.is.mobile){
this.getData()
}
}, },
dateDiffer(DateStart,DateEnd) { dateDiffer(DateStart,DateEnd) {
//date1结束时间 //date1结束时间
...@@ -1349,11 +1565,14 @@ export default { ...@@ -1349,11 +1565,14 @@ export default {
arrList(this.SimilarList) arrList(this.SimilarList)
this.SimilarList.forEach((x,index) => { this.SimilarList.forEach((x,index) => {
x.id = (index+1) x.id = (index+1)
x.images = []
x.images.push(x.roomImageURL) x.images.push(x.roomImageURL)
if(x.roomOptions.length>0){
for (let f = 0; f < x.roomOptions.length; f++) {
for (let i = 0; i < 4; i++) { for (let i = 0; i < 4; i++) {
if(x.roomOptions[`planPictureURL${(i+1)}`] && x.roomOptions[`planPictureURL${(i+1)}`].length>0){ if(x.roomOptions[f][`planPictureURL${(i+1)}`]){
x.images.push(x.roomOptions[`planPictureURL${(i+1)}`]) x.images.push(x.roomOptions[f][`planPictureURL${(i+1)}`])
}
}
} }
} }
if ( if (
......
src/pages/hotel/orderForm.vue
View file @ 47e632e8
...@@ -72,12 +72,12 @@ ...@@ -72,12 +72,12 @@
<q-card flat class="q-pa-md q-mt-lg" v-if="details"> <q-card flat class="q-pa-md q-mt-lg" v-if="details">
<div class="text-subtitle1 text-weight-bolder q-mb-md">旅客資料</div> <div class="text-subtitle1 text-weight-bolder q-mb-md">旅客資料</div>
<div class="row"> <div class="row">
<!-- <q-img <q-img
:src="roomRateDetails?roomRateDetails[0].roomImageURL:'https://image.kkday.com/v2/image/get/s1.kkday.com/product_138437/20230217083232_t5rcO/jpg'" :src="details.roomRateDetails?details.roomRateDetails.roomImageURL:'https://image.kkday.com/v2/image/get/s1.kkday.com/product_138437/20230217083232_t5rcO/jpg'"
class="rounded-borders" class="rounded-borders"
spinner-color="grey-3" spinner-color="grey-3"
style="width: 80px" style="width: 80px"
/> --> />
<div class="q-ml-md col"> <div class="q-ml-md col">
<div class="text-subtitle1 ellipsis"> <div class="text-subtitle1 ellipsis">
{{details.hotelName}} {{details.hotelName}}
...@@ -92,71 +92,65 @@ ...@@ -92,71 +92,65 @@
<q-icon name="iconfont iconrili" size="20px" class="q-mr-sm" /> <q-icon name="iconfont iconrili" size="20px" class="q-mr-sm" />
<span>{{msg.arrivalDate}}至{{msg.departureDate}}</span> <span>{{msg.arrivalDate}}至{{msg.departureDate}}</span>
</div> </div>
<template v-for="x in roomRateDetails">
<template v-if="x.checked"> <div class="text-grey-9 q-ml-sm">
<template v-for="y in x.roomOptions"> <q-icon name="iconfont icontime" size="20px" class="q-mr-xs q-ml-sm" />
<div class="text-grey-9 q-ml-md" v-if="y.checked"> <span class="q-mr-sm">
<q-icon name="iconfont iconcanpinhui-xican" size="17px" class="q-mr-sm" /> 住宿時間 {{OrderDate.liveNvm}} 晚
<span class="q-mr-sm">{{getMealType(y.meals)}} x {{ y.Count }}间 </span </span>
> <span v-if="details.roomRateDetails">(
</div>
</template>
<div class="row items-center">(
<span class="fz15 text-weight-bold"> <span class="fz15 text-weight-bold">
<span v-if="x.roomType==1">{{getGradeType(x.gradeType)}}单人间</span> <span v-if="details.roomRateDetails.roomType==1">{{getGradeType(details.roomRateDetails.gradeType)}}單人間</span>
<span v-if="x.roomType==2">{{getGradeType(x.gradeType)}}双人间</span> <span v-if="details.roomRateDetails.roomType==2">{{getGradeType(details.roomRateDetails.gradeType)}}雙人間</span>
<span v-if="x.roomType==3">{{getGradeType(x.gradeType)}}大床房</span> <span v-if="details.roomRateDetails.roomType==3">{{getGradeType(details.roomRateDetails.gradeType)}}大床房</span>
<span v-if="x.roomType==4">{{getGradeType(x.gradeType)}}三人间</span> <span v-if="details.roomRateDetails.roomType==4">{{getGradeType(details.roomRateDetails.gradeType)}}三人間</span>
<span v-if="x.roomType==5">{{getGradeType(x.gradeType)}}四人间</span> <span v-if="details.roomRateDetails.roomType==5">{{getGradeType(details.roomRateDetails.gradeType)}}四人間</span>
<span v-if="x.roomType==6">{{getGradeType(x.gradeType)}}日式房</span> <span v-if="details.roomRateDetails.roomType==6">{{getGradeType(details.roomRateDetails.gradeType)}}日式房</span>
<span v-if="x.roomType==7">{{getGradeType(x.gradeType)}}日式+西式混合房</span> <span v-if="details.roomRateDetails.roomType==7">{{getGradeType(details.roomRateDetails.gradeType)}}日式+西式混合房</span>
<span v-if="x.roomType==8">{{getGradeType(x.gradeType)}}大床房（小型）</span> <span v-if="details.roomRateDetails.roomType==8">{{getGradeType(details.roomRateDetails.gradeType)}}大床房（小型）</span>
<span v-if="(x.roomType==9||x.roomType=='')&&x.gradeType==''">未知房型</span> <span v-if="(details.roomRateDetails.roomType==9||details.roomRateDetails.roomType=='')&&details.roomRateDetails.gradeType==''">未知房型</span>
</span> </span>
<span class="fz13 text-grey-6 q-ml-sm"> <span class="fz13 text-grey-6 q-ml-sm">
<span v-if="x.smoking==0">禁烟, </span> <span v-if="details.roomRateDetails.smoking==0">禁煙, </span>
<span v-if="x.smoking==1">可吸烟, </span> <span v-if="details.roomRateDetails.smoking==1">可吸煙, </span>
<span v-if="x.withBath==0">无浴室</span> <span v-if="details.roomRateDetails.withBath==0">無浴室</span>
<span v-if="x.withBath==1">有浴室</span> <span v-if="details.roomRateDetails.withBath==1">有浴室</span>
</span> </span>
) )
</div>
</template>
</template>
<div class="text-grey-9 q-ml-sm">
<q-icon name="iconfont icontime" size="20px" class="q-mr-xs q-ml-sm" />
<span class="q-mr-sm">
住宿時間 {{OrderDate.liveNvm}} 晚
</span> </span>
<q-icon name="iconfont jinggao1" size="20px"/><span>僅剩{{details.currentAllotment}}間</span>
<span class="q-mr-sm"></span> <span class="q-mr-sm"></span>
<q-icon name="iconfont iconpeople" size="20px" class="q-mr-xs q-ml-sm" /> <q-icon name="iconfont iconpeople" size="20px" class="q-mr-xs q-ml-sm" />
<span class="q-mr-sm"> <span class="q-mr-sm">
成人 {{numberOfAdults}}<span class="q-pl-sm">儿童 {{numberOfChildren}}</span> 成人 {{numberOfAdults}}<span class="q-pl-sm">兒童 {{numberOfChildren}}</span>
</span> </span>
</div> </div>
</div> </div>
<div class="rounded-borders bg-blue-1 q-px-md q-py-sm q-mt-sm column"> <div class="rounded-borders bg-blue-1 q-px-md q-py-sm q-mt-sm column">
<!-- <span class="text-orange-6 q-pb-xs">超过13岁视为成人处理</span> --> <!-- <span class="text-orange-6 q-pb-xs">超过13岁视为成人处理</span> -->
<!-- <span class="text-green-6">预定成功后房间将为您整晚保留</span> --> <!-- <span class="text-green-6">预定成功后房间将为您整晚保留</span> -->
<span class="text-red-6 q-pb-xs">所填姓名需和入住時所持證件一致</span>
<span class="text-orange-6 q-pb-xs" v-if="(details.cancellationPeriod1==-1||details.cancellationPeriod1==0)&&(details.cancellationType1==1||details.cancellationType1==2)"> <span class="text-orange-6 q-pb-xs" v-if="(details.cancellationPeriod1==-1||details.cancellationPeriod1==0)&&(details.cancellationType1==1||details.cancellationType1==2)">
<template v-if="details.cancellationPeriod1==-1">没有通知取消，</template> <template v-if="details.cancellationPeriod1==-1">沒有通知取消，</template>
<template v-if="details.cancellationPeriod1==0">入住当日取消，</template> <template v-if="details.cancellationPeriod1==0">入住當日取消，</template>
<template v-if="details.cancellationType1==1">手续费：{{details.cancellation1}}%</template> <template v-if="details.cancellationType1==1">手續費：{{details.cancellation1}}%</template>
<template v-if="details.cancellationType1==2">手续费：{{details.cancellation1}}</template> <template v-if="details.cancellationType1==2">手續費：{{details.cancellation1}}</template>
</span> </span>
<span class="text-green-6" v-if="(details.cancellationPeriod2==-1||details.cancellationPeriod2==0)&&(details.cancellationType2==1||details.cancellationType2==2)"> <span class="text-green-6 q-pb-xs" v-if="(details.cancellationPeriod2==-1||details.cancellationPeriod2==0)&&(details.cancellationType2==1||details.cancellationType2==2)">
<template v-if="details.cancellationPeriod2==-1">没有通知取消，</template> <template v-if="details.cancellationPeriod2==-1">沒有通知取消，</template>
<template v-if="details.cancellationPeriod2==0">入住当日取消，</template> <template v-if="details.cancellationPeriod2==0">入住當日取消，</template>
<template v-if="details.cancellationType2==1">手续费：{{details.cancellation2}}%</template> <template v-if="details.cancellationType2==1">手續費：{{details.cancellation2}}%</template>
<template v-if="details.cancellationType2==2">手续费：{{details.cancellation2}}</template> <template v-if="details.cancellationType2==2">手續費：{{details.cancellation2}}</template>
</span> </span>
<span class="text-green-6" v-if="(details.cancellationPeriod3==-1||details.cancellationPeriod3==0)&&(details.cancellationType3==1||details.cancellationType3==2)"> <span class="text-green-6" v-if="(details.cancellationPeriod3==-1||details.cancellationPeriod3==0)&&(details.cancellationType3==1||details.cancellationType3==2)">
<template v-if="details.cancellationPeriod3==-1">没有通知取消，</template> <template v-if="details.cancellationPeriod3==-1">沒有通知取消，</template>
<template v-if="details.cancellationPeriod3==0">入住当日取消，</template> <template v-if="details.cancellationPeriod3==0">入住當日取消，</template>
<template v-if="details.cancellationType3==1">手续费：{{details.cancellation3}}%</template> <template v-if="details.cancellationType3==1">手續費：{{details.cancellation3}}%</template>
<template v-if="details.cancellationType3==2">手续费：{{details.cancellation3}}</template> <template v-if="details.cancellationType3==2">手續費：{{details.cancellation3}}</template>
</span> </span>
</div> </div>
<q-separator color="grey-2" class="q-mt-md" /> <q-separator color="grey-2" class="q-mt-md" />
...@@ -204,8 +198,8 @@ ...@@ -204,8 +198,8 @@
<q-input <q-input
standout standout
v-model="parameters.guestAddress" v-model="parameters.guestAddress"
label="当前地址" label="當前地址"
:rules="[(val) => !!val || '請輸当前地址']" :rules="[(val) => !!val || '請輸當前地址']"
ref="guestAddress" ref="guestAddress"
></q-input> ></q-input>
</div> </div>
...@@ -233,14 +227,13 @@ ...@@ -233,14 +227,13 @@
</div> </div>
</div> </div>
<q-separator color="grey-2" class="q-mt-md" /> <q-separator color="grey-2" class="q-mt-md" />
<template>
<div <div
class="bg-grey-1 rounded-borders q-pa-md q-mt-md guest-item" class="bg-grey-1 rounded-borders q-pa-md q-mt-md guest-item"
v-for="(x,index) in parameters.roomGroup" v-for="(x,i) in parameters.roomGroup"
:key="index" :key="i"
> >
<div class="text-subtitle1 q-pb-md text-weight-bold"> <div class="text-subtitle1 q-pb-md text-weight-bold">
房間{{ index+1 }} 房間{{ x.roomCount }}
</div> </div>
<div class="row q-col-gutter-md"> <div class="row q-col-gutter-md">
<div :class="filedGuestWidth"> <div :class="filedGuestWidth">
...@@ -251,6 +244,7 @@ ...@@ -251,6 +244,7 @@
placeholder="" placeholder=""
mask="#" mask="#"
reverse-fill-mask reverse-fill-mask
:ref="`guest${i}Male`"
/> />
<!-- :ref="`guest${i}Male`" :rules="[(val) => !!val || '請輸成人數']"--> <!-- :ref="`guest${i}Male`" :rules="[(val) => !!val || '請輸成人數']"-->
</div> </div>
...@@ -260,9 +254,9 @@ ...@@ -260,9 +254,9 @@
v-model="x.roomFemaleCount" v-model="x.roomFemaleCount"
label="成人女" label="成人女"
placeholder="" placeholder=""
mask="#" mask="#"
reverse-fill-mask reverse-fill-mask
:ref="`guest${i}Female`"
/> />
<!-- :ref="`guest${i}Female`" :rules="[(val) => !!val || '請輸成人女數']"--> <!-- :ref="`guest${i}Female`" :rules="[(val) => !!val || '請輸成人女數']"-->
...@@ -271,22 +265,22 @@ ...@@ -271,22 +265,22 @@
<q-input <q-input
standout standout
v-model="x.roomChildCount" v-model="x.roomChildCount"
label="儿童" label="兒童"
placeholder="" placeholder=""
mask="#" mask="#"
reverse-fill-mask reverse-fill-mask
:rules="[(val) => !!val || '請輸儿童數']"
/> />
<!-- :rules="[(val) => !!val || '請輸儿童數']" -->
</div> </div>
</div> </div>
</div> </div>
</template>
<div class="text-subtitle1 q-my-md text-weight-bold">特殊需求備註：</div> <div class="text-subtitle1 q-my-md text-weight-bold">特殊需求備註：</div>
<q-input standout v-model="parameters.guestRequest" input-style="height:170px;" type="textarea" placeholder="此欄位僅限資料備註。不在商品規範內的個人需求，不保證提供" maxlength="200" counter /> <q-input standout v-model="parameters.guestRequest" input-style="height:170px;" type="textarea" placeholder="此欄位僅限資料備註。不在商品規範內的個人需求，不保證提供" maxlength="200" counter />
</q-card> </q-card>
</q-form> </q-form>
<coupon <coupon
v-if="!sumPrice" v-if="sumPrice>0"
:product-type="productType" :product-type="productType"
:current-price="sumPrice" :current-price="sumPrice"
@change="changeDiscountHandler" @change="changeDiscountHandler"
...@@ -313,12 +307,12 @@ ...@@ -313,12 +307,12 @@
> >
<div class="text-subtitle1 text-weight-bolder">付款明細</div> <div class="text-subtitle1 text-weight-bolder">付款明細</div>
<div class="row q-mt-md"> <div class="row q-mt-md">
<!-- <q-img <q-img
:src="roomRateDetails?roomRateDetails[0].roomImageURL:'https://image.kkday.com/v2/image/get/s1.kkday.com/product_138437/20230217083232_t5rcO/jpg'" :src="details.roomRateDetails?details.roomRateDetails.roomImageURL:'https://image.kkday.com/v2/image/get/s1.kkday.com/product_138437/20230217083232_t5rcO/jpg'"
class="rounded-borders" class="rounded-borders"
spinner-color="grey-3" spinner-color="grey-3"
style="width: 80px" style="width: 80px"
/> --> />
<div class="q-ml-md col"> <div class="q-ml-md col">
<div class="text-subtitle1 ellipsis"> <div class="text-subtitle1 ellipsis">
{{details.hotelName}} {{details.hotelName}}
...@@ -328,40 +322,29 @@ ...@@ -328,40 +322,29 @@
</div> </div>
</div> </div>
</div> </div>
<div class="q-mt-md text-grey-6"> <div class="q-mt-md text-grey-6" v-if="details.roomRateDetails">
<div class="row"> <div class="row">
<div style="width: 80px"> <div style="width: 80px">
入住时间：</div> 入住時間：</div>
<div class="q-ml-md"> <div class="q-ml-md">
{{parameters.arrivalDate}} {{checkInTimeH}}
<template v-for="(x,i) in roomRateDetails"> {{details.roomRateDetails.roomOptions['check-inStartTime']}} 之後
<template v-if="x.checked">
<template v-for="y in x.roomOptions">
<template v-if="y.checked">{{y['check-inStartTime']}} 之后</template>
</template>
</template>
</template>
</br> </br>
<template v-for="(x,i) in roomRateDetails"> {{checkInTimeQ+' '+details.roomRateDetails.roomOptions['finalCheck-outTime']}} 之前
<template v-if="x.checked">
<template v-for="y in x.roomOptions">
<template v-if="y.checked">{{y.checkInTime+' '+y['finalCheck-outTime']}} 之前</template>
</template>
</template>
</template>
</div> </div>
</div> </div>
</div> </div>
<q-separator color="grey-2" class="q-my-md"/> <q-separator color="grey-2" class="q-my-md"/>
<div class="text-grey-9"> <div class="text-grey-9">
<template v-for="(x,i) in roomRateDetails"> <template v-for="(x,i) in details.roomGroup">
<template v-if="x.checked"> <template v-for="y in x.rateGroup">
<template v-for="y in x.roomOptions"> <div class="row q-mb-sm">
<div class="row q-mb-sm" v-if="y.checked"> <div class="col">{{y.stayDate}}</div>
<div class="col">{{getMealType(y.meals)}} x {{ y.Count }}间</div> <div>
<div>CNY {{ getPrice2(y.totalChargeableRateInfo) }}</div> <span v-if="y.perAdultRateBySetCurrency">CNY {{y.perAdultRateBySetCurrency}}/人</span>
<span v-else="y.totalPerRoomRateBySetCurrency">CNY {{y.totalPerRoomRateBySetCurrency}}/晚</span>
</div>
</div> </div>
</template>
</template> </template>
</template> </template>
<hr <hr
...@@ -375,13 +358,13 @@ ...@@ -375,13 +358,13 @@
</div> </div>
</div> </div>
<hr style="border:none;border-top:1px dashed #EEE !important;" class="bg-transparent q-mb-sm" /> <hr style="border:none;border-top:1px dashed #EEE !important;" class="bg-transparent q-mb-sm" />
<div class="row q-mb-sm items-center" v-if="parameters.DiscountsMoney > 0"> <div class="row q-mb-sm items-center" v-if="parameters.DiscountMoney > 0">
<div class="col">優惠金額</div> <div class="col">優惠金額</div>
<div <div
class="text-subtitle2 text-weight-bolder text-teal" class="text-subtitle2 text-weight-bolder text-teal"
v-if="parameters.DiscountsMoney > 0" v-if="parameters.DiscountMoney > 0"
> >
CNY - {{ moneyFormat(parameters.DiscountsMoney, 2) }} CNY - {{ moneyFormat(parameters.DiscountMoney, 2) }}
</div> </div>
<div class="text-grey-5" v-else>暫無優惠</div> <div class="text-grey-5" v-else>暫無優惠</div>
</div> </div>
...@@ -431,7 +414,7 @@ export default { ...@@ -431,7 +414,7 @@ export default {
data() { data() {
return { return {
CouponIds: [], CouponIds: [],
productType: 4, productType: 8,
sumPrice: 0,//总金额 sumPrice: 0,//总金额
order: null,//订单信息 order: null,//订单信息
orderKey: "", orderKey: "",
...@@ -465,6 +448,9 @@ export default { ...@@ -465,6 +448,9 @@ export default {
numberOfAdults: 0, numberOfAdults: 0,
numberOfChildren: 0, numberOfChildren: 0,
roomRateDetails: [], roomRateDetails: [],
checkInTimeH: '',
checkInTimeQ: '',
price: 0,
guest: { guest: {
roomCount: 0,//房间编号 roomCount: 0,//房间编号
roomMaleCount:0, roomMaleCount:0,
...@@ -509,7 +495,7 @@ export default { ...@@ -509,7 +495,7 @@ export default {
DiscountMoney:0,//优惠 DiscountMoney:0,//优惠
OrderSource: 3,//类型 1 来源内部 2 来源B2B 3 来源B2C OrderSource: 3,//类型 1 来源内部 2 来源B2B 3 来源B2C
OrderForm:1, OrderForm:1,
DiscountsMoney: 0//优惠 CouponAllotIds: '',
}, },
TotalPeople: 0,//总人数 TotalPeople: 0,//总人数
}; };
...@@ -540,15 +526,15 @@ export default { ...@@ -540,15 +526,15 @@ export default {
methods: { methods: {
changeDiscountHandler(coupon) { changeDiscountHandler(coupon) {
if (coupon) { if (coupon) {
this.parameters.DiscountsMoney = coupon.discountMoney; this.parameters.DiscountMoney = coupon.discountMoney;
this.CouponIds = [coupon.couponId]; this.CouponIds = [coupon.couponId];
this.parameters.DiscountsIds = this.CouponIds.join(",") this.parameters.CouponAllotIds = this.CouponIds.join(",")
} else { } else {
this.parameters.DiscountsMoney = 0; this.parameters.DiscountMoney = 0;
this.CouponIds = []; this.CouponIds = [];
this.parameters.DiscountsIds = '' this.parameters.CouponAllotIds = ''
} }
this.parameters.totalChargeableRateInfo = this.sumPrice - this.parameters.DiscountsMoney this.parameters.totalChargeableRateInfo = this.sumPrice - this.parameters.DiscountMoney
this.$forceUpdate(); this.$forceUpdate();
}, },
// 获取商品详情 // 获取商品详情
...@@ -562,21 +548,22 @@ export default { ...@@ -562,21 +548,22 @@ export default {
if (r.data.resultCode == 1) { if (r.data.resultCode == 1) {
this.details = r.data.data; this.details = r.data.data;
this.parameters.HotelName = this.details.hotelName
this.parameters.HotelPic = this.details.roomRateDetails.roomImageURL
this.JapanIncrease = r.data.data.JapanIncrease
if(Object.prototype.toString.call(this.details.roomGroup) == '[object Object]'){ if(Object.prototype.toString.call(this.details.roomGroup) == '[object Object]'){
let arr = []; let arr = [];
arr.push(this.details.roomGroup); arr.push(this.details.roomGroup);
this.details.roomGroup=arr; this.details.roomGroup=arr;
} }
console.log(r.data.data,'===')
return
this.parameters.HotelName = this.details.hotelName
this.parameters.HotelPic = this.roomRateDetails[0].roomImageURL
this.JapanIncrease = r.data.data.JapanIncrease
this.TotalChildCount = 0; this.TotalChildCount = 0;
let rateGrouoLen = 0; let rateGrouoLen = 0;
this.details.roomGroup.forEach(x=>{ //无价格 只有房间价格
this.sumPrice = 0
this.parameters.totalChargeableRateInfo = 0
this.parameters.totalPriceJapanese = 0
this.details.roomGroup.forEach((x,index)=>{
if(Object.prototype.toString.call(x.rateGroup) == '[object Object]'){ if(Object.prototype.toString.call(x.rateGroup) == '[object Object]'){
let arr = []; let arr = [];
arr.push(x.rateGroup); arr.push(x.rateGroup);
...@@ -602,11 +589,11 @@ export default { ...@@ -602,11 +589,11 @@ export default {
this.TotalChildCount+=x.roomChildCount*x.rateGroup.length; this.TotalChildCount+=x.roomChildCount*x.rateGroup.length;
rateGrouoLen+= x.rateGroup.length; rateGrouoLen+= x.rateGroup.length;
this.chekedChildCount = this.childNum*rateGrouoLen; this.chekedChildCount = this.numberOfChildren*rateGrouoLen;
if(this.TotalChildCount<this.chekedChildCount){ if(this.TotalChildCount<this.chekedChildCount){
this.isBaoChild=true; this.isBaoChild=true;
} }
//无价格 只有房间价格
let onlyRoomPrice=0; let onlyRoomPrice=0;
let onlyJanpnase=0; let onlyJanpnase=0;
x.rateGroup.forEach(z=>{ x.rateGroup.forEach(z=>{
...@@ -636,6 +623,12 @@ export default { ...@@ -636,6 +623,12 @@ export default {
onlyRoomPrice+=parseFloat(z.totalPerRoomRateBySetCurrency); onlyRoomPrice+=parseFloat(z.totalPerRoomRateBySetCurrency);
onlyJanpnase+=parseFloat(z.totalPerRoomRate); onlyJanpnase+=parseFloat(z.totalPerRoomRate);
} }
if(z.perAdultRateBySetCurrency){
this.sumPrice+=Number(z.perAdultRateBySetCurrency)
}else if(z.totalPerRoomRateBySetCurrency){
this.sumPrice+=Number(z.totalPerRoomRateBySetCurrency)
}
}) })
AdultCount+=AdultTotalPrice*x.roomAdultCount; AdultCount+=AdultTotalPrice*x.roomAdultCount;
childCount+=childToTalPrice*x.roomChildCount; childCount+=childToTalPrice*x.roomChildCount;
...@@ -653,10 +646,14 @@ export default { ...@@ -653,10 +646,14 @@ export default {
this.price=this.parameters.totalChargeableRateInfo; this.price=this.parameters.totalChargeableRateInfo;
// AdultJapanCount+=AdultJapanPrice; // AdultJapanCount+=AdultJapanPrice;
// childJapanCount+=ChildJapanPrice; // childJapanCount+=ChildJapanPrice;
this.parameters.roomGroup[index].rateGroup = x.rateGroup
this.parameters.totalPriceJapanese += parseFloat(AdultJapanCount+childJapanCount+onlyJanpnase); this.parameters.totalPriceJapanese += parseFloat(AdultJapanCount+childJapanCount+onlyJanpnase);
})
})
let hTIme = date.formatDate(date.addToDate(new Date(this.parameters.arrivalDate), { days: 1 }), 'YYYY-MM-DD')
let qTime = date.formatDate(date.addToDate(new Date(hTIme), { days: -1 }), 'YYYY-MM-DD')
this.checkInTimeH = qTime
this.checkInTimeQ = hTIme
} else { } else {
this.$message.error(r.data.message) this.$message.error(r.data.message)
} }
...@@ -676,22 +673,31 @@ export default { ...@@ -676,22 +673,31 @@ export default {
if (this.order) { if (this.order) {
this.orderKey = key; this.orderKey = key;
this.OrderDate = this.order.order this.OrderDate = this.order.order
this.msg = JSON.parse(this.OrderDate.msg) this.msg = this.OrderDate.msg
this.sumPrice = this.OrderDate.sumPrice
this.parameters.arrivalDate = this.msg.arrivalDate this.parameters.arrivalDate = this.msg.arrivalDate
this.parameters.departureDate = this.msg.departureDate this.parameters.departureDate = this.msg.departureDate
this.parameters.totalRoomCount = this.msg.searchroomGroup.length this.parameters.totalRoomCount = this.msg.searchroomGroup.length
this.parameters.roomGroup=[];
for(let i=0;i<this.parameters.totalRoomCount;i++){ for(let i=0;i<this.parameters.totalRoomCount;i++){
this.parameters.roomGroup.push(JSON.parse(JSON.stringify(this.guest))) var obj = {
roomCount:i+1,
roomMaleCount:0,
roomFemaleCount:0,
roomChildCount:0,
roomInfantCount:0,
rateGroup:[]
}
this.parameters.roomGroup.push(JSON.parse(JSON.stringify(obj)))
} }
this.sumPrice = this.OrderDate.sumPrice
this.parameters.totalChargeableRateInfo = this.OrderDate.sumPrice
this.numberOfAdults = 0 this.numberOfAdults = 0
this.numberOfChildren = 0, this.numberOfChildren = 0,
this.msg.roomOptionCd = this.OrderDate.roomOptionCd this.msg.roomOptionCd = this.OrderDate.roomOptionCd
this.parameters.roomOptionCd = this.OrderDate.roomOptionCd
this.parameters.hotelId = this.msg.hotelId
this.msg.searchroomGroup.forEach(x=>{ this.msg.searchroomGroup.forEach(x=>{
this.numberOfAdults+=x.numberOfAdults this.numberOfAdults+=Number(x.numberOfAdults)
this.numberOfChildren+=x.numberOfChildren this.numberOfChildren+=Number(x.numberOfChildren)
}) })
} }
} }
...@@ -707,10 +713,22 @@ export default { ...@@ -707,10 +713,22 @@ export default {
return this.orderKey != ""; return this.orderKey != "";
}, },
async submit() { async submit() {
let roomGroupLen = this.msg.searchroomGroup.length;
//判断选择的人数与入住人数
let Count1=0
let roomGroup = JSON.parse(JSON.stringify(this.parameters.roomGroup))
roomGroup.forEach(x=>{
Count1+= Number(x.roomMaleCount)+Number(x.roomFemaleCount)+Number(x.roomChildCount)
})
let Count2=this.numberOfChildrenNumber?this.numberOfChildrenNumber:0;
Count2= Number(this.numberOfAdults);
if(Count1!=Count2){
this.$message.error('入住人數與總入住數不匹配');
return;
}
this.parameters.CustomerId = this.userInfo.Id; this.parameters.CustomerId = this.userInfo.Id;
this.parameters.EmployeeIdStr = this.userInfo.Surname+this.userInfo.Name this.parameters.EmployeeIdStr = this.userInfo.Surname+this.userInfo.Name
console.log(this.parameters,'-----')
return
this.$refs.mail.validate() this.$refs.mail.validate()
this.$refs.SurName.validate() this.$refs.SurName.validate()
this.$refs.Name.validate() this.$refs.Name.validate()
...@@ -718,26 +736,14 @@ export default { ...@@ -718,26 +736,14 @@ export default {
this.$refs.guestAddress.validate() this.$refs.guestAddress.validate()
this.$refs.checkInTime.validate() this.$refs.checkInTime.validate()
this.parameters.guestEmail = this.userInfo.Mailbox this.parameters.guestEmail = this.userInfo.Mailbox
// for (let i = 0; i < this.parameters.roomGroup.length; i++) { for (let i = 0; i < this.parameters.roomGroup.length; i++) {
// this.$refs[`guest${i}Male`][0].validate() if(!this.parameters.roomGroup[i].roomMaleCount&&!this.parameters.roomGroup[i].roomMaleCount){
// this.$refs[`guest${i}Female`][0].validate() this.$message.error('一個房間至少入住一人');
// } return;
let roomMaleCount = 0 }
let roomFemaleCount = 0
let roomChildCount = 0
let roomTotal = 0
let CountTotal = Number(this.numberOfAdults)+Number(this.numberOfChildren)
this.parameters.roomGroup.forEach(x=>{
roomMaleCount += x.roomMaleCount
roomFemaleCount += x.roomFemaleCount
roomChildCount += x.roomChildCount
roomTotal = Number(roomMaleCount) + Number(roomFemaleCount) + Number(roomChildCount)
})
if(Number(roomTotal)!=Number(CountTotal)){
this.$message.warn(`房間入住總人數不能大於且小於${CountTotal}`)
return
} }
let flag = true let flag = true
flag = await this.formValidateHandler('baseUserInfo') flag = await this.formValidateHandler('baseUserInfo')
if(!flag){ if(!flag){
...@@ -754,10 +760,10 @@ export default { ...@@ -754,10 +760,10 @@ export default {
}, },
SetCarOrder(){ SetCarOrder(){
console.log(this.parameters,'====') console.log(this.parameters,'====')
return // return
this.loading = true this.loading = true
this.apipost( this.apipost(
"dmc_post_Get_GetJAPAN_HotelBooking", "dmc_post_GetJAPAN_HotelBookingB2C",
this.parameters, this.parameters,
(r) => { (r) => {
if (r.data.resultCode == 1) { if (r.data.resultCode == 1) {
...@@ -778,13 +784,13 @@ export default { ...@@ -778,13 +784,13 @@ export default {
Name: '', Name: '',
ContactNumber: this.userInfo.Mobile,// 联系电话 ContactNumber: this.userInfo.Mobile,// 联系电话
Mailbox: this.userInfo.Mailbox,//邮箱 Mailbox: this.userInfo.Mailbox,//邮箱
GoodsId: this.parameters.CouponsId,//商品id GoodsId: this.parameters.hotelId,//商品id
GoodsName: this.details.Name,//商品名称 GoodsName: this.parameters.HotelName,//商品名称
GoodsPic: this.roomRateDetails[0].roomImageURL,//商品图片 GoodsPic: this.parameters.HotelPic,//商品图片
GoodsType: this.productType, GoodsType: this.productType,
OrderMake: this.parameters.UseDate,//订单摘要（例如出行时间） OrderMake: this.parameters.arrivalDate,//订单摘要（例如出行时间）
TotalPrice: this.parameters.totalChargeableRateInfo,//总价格 TotalPrice: this.parameters.totalChargeableRateInfo,//总价格
PreferentialPrice: this.parameters.DiscountsMoney,// 优惠总金额 PreferentialPrice: this.parameters.DiscountMoney,// 优惠总金额
ErpOrderId: ErpOrderId,//erp订单id ErpOrderId: ErpOrderId,//erp订单id
Country: this.userInfo.Country,//国家id Country: this.userInfo.Country,//国家id
PlatformTax: 0,//平台税金默认0 PlatformTax: 0,//平台税金默认0
...@@ -845,7 +851,7 @@ export default { ...@@ -845,7 +851,7 @@ export default {
getPrice(price) { getPrice(price) {
//(chargeableRateInfoPerPersonForANightBySetCurrency/0.9975)*入住天数*入住人数 //(chargeableRateInfoPerPersonForANightBySetCurrency/0.9975)*入住天数*入住人数
//天数 //天数
return Math.ceil(price / this.JapanIncrease)*(this.auditNum+this.childNum)*this.DateDiff(this.SimilarMsg.arrivalDate,this.SimilarMsg.departureDate); return Math.ceil(price / this.JapanIncrease)*(this.numberOfAdults+this.numberOfChildren)*this.DateDiff(this.SimilarMsg.arrivalDate,this.SimilarMsg.departureDate);
}, },
getPrice2(price){ getPrice2(price){
return Math.ceil(price / this.JapanIncrease) return Math.ceil(price / this.JapanIncrease)
......
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