Commit 53a09adb authored by 吴春's avatar 吴春

解决冲突

parents f2934f2f ab21585c
......@@ -183,7 +183,8 @@ module.exports = function( /* ctx */ ) {
plugins: [
"Meta",
"Notify",
'Loading'
'Loading',
'Dialog'
]
},
......
......@@ -10,7 +10,7 @@ export default {
};
</script>
<style>
@import url("//at.alicdn.com/t/c/font_1890699_gbysegbhucu.css");
@import url("//at.alicdn.com/t/c/font_1890699_5zxmcxmwvtf.css");
@font-face {
font-family: "oswald";
src: url("https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/smallapp/Oswald-Regular.ttf");
......
......@@ -26,9 +26,7 @@ Vue.prototype.domainManager = function() {
domainUrl = "http://testapi.oytour.com";
} else if (domainNameUrl.indexOf('oytour') !== -1) {
// domainUrl = "http://reborn.oytour.com";
// domainUrl = 'http://192.168.10.11:8083'
domainUrl = 'http://192.168.10.206'
//''http://192.168.10.11:8083' '
domainUrl = 'http://192.168.10.206:8015' //'http://192.168.10.206:8015' ''http://192.168.10.11:8083' '
}
var obj = {
//主地址
......
<template>
<div>
<div v-if="prices">
<div class="text-subtitle2 text-weight-bold">選擇房間類型、選項</div>
<div class="text-grey-6 f12 q-my-md">請選擇出房間類型</div>
<div class="rounded-borders">
<div class="non-selectable">
<div class="row wrap">
<div class="relative q-pa-xs cursor-pointer"
:class="{'col-4':prices.length>2,'col-6':prices.length<3}"
v-for="(item,index) in prices" :key="index">
<div class="rounded-borders overflow-hidden column "
:style="{'border': chooseObj&&item.id==chooseObj.id?'':'1px solid #eee'}"
:class="{'bg-grey-1 ':chooseObj&&item.id!=chooseObj.id,
'bg-primary shadow-24':chooseObj&&item.id==chooseObj.id}"
@click="chosenDateHandler(item)">
<q-img :src="item.roomImageURL"
:ratio="16/9" style="width: 100%;"/>
<div class="column q-pt-xs q-pb-sm q-px-sm">
<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==2">{{getGradeType(item.gradeType)}}双人间</span>
<span v-if="item.roomType==3">{{getGradeType(item.gradeType)}}大床房</span>
<span v-if="item.roomType==4">{{getGradeType(item.gradeType)}}三人间</span>
<span v-if="item.roomType==5">{{getGradeType(item.gradeType)}}四人间</span>
<span v-if="item.roomType==6">{{getGradeType(item.gradeType)}}日式房</span>
<span v-if="item.roomType==7">{{getGradeType(item.gradeType)}}日式+西式混合房</span>
<span v-if="item.roomType==8">{{getGradeType(item.gradeType)}}大床房(小型)</span>
<span v-if="(item.roomType==9||item.roomType=='')&&item.gradeType==''">未知房型</span>
</span>
<q-separator color="grey-2" class="q-my-md" />
<div class="rounded-borders col" v-for="(item,index) in prices" :key="index"
:class="{'max-width':$q.platform.is.mobile?'100vw':'auto'}">
<div class="non-selectable row">
<div class="q-pr-md cursor-pointer" @click="showImageHandler(item.roomImageURL,item.images)"
:class="{'col-2':$q.platform.is.desktop,'col-6':$q.platform.is.mobile}"
style="border-right: 1px solid #F5F5F5;">
<div class="relative rounded-borders overflow-hidden column bg-grey-1"
style="border: 1px solid #eee">
<q-img :src="item.roomImageURL"
:ratio="16/9" style="width: 100%;"/>
<div class="column q-pt-xs q-pb-sm q-px-sm">
<span class="fz15 text-weight-bold">
<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==3">{{getGradeType(item.gradeType)}}大床房</span>
<span v-if="item.roomType==4">{{getGradeType(item.gradeType)}}三人间</span>
<span v-if="item.roomType==5">{{getGradeType(item.gradeType)}}四人间</span>
<span v-if="item.roomType==6">{{getGradeType(item.gradeType)}}日式房</span>
<span v-if="item.roomType==7">{{getGradeType(item.gradeType)}}日式+西式混合房</span>
<span v-if="item.roomType==8">{{getGradeType(item.gradeType)}}大床房(小型)</span>
<span v-if="(item.roomType==9||item.roomType=='')&&item.gradeType==''">未知房型</span>
</span>
<span class="fz13"
: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==1">可吸烟, </span>
<span v-if="item.withBath==0">无浴室</span>
<span v-if="item.withBath==1">有浴室</span>
</span>
<span class="fz13 text-grey-6">
<span v-if="item.smoking==0">禁烟, </span>
<span v-if="item.smoking==1">可吸烟, </span>
<span v-if="item.withBath==0">无浴室</span>
<span v-if="item.withBath==1">有浴室</span>
</span>
</div>
<div class="absolute" style="right: 10px;bottom: 65px;">
<span class="text-white f12 q-px-sm row items-center"
style="background: rgba(23,23,23,.5);border-radius: 30px;">
<q-icon class="q-pl-xs" name="images"></q-icon>
<span>{{item.images.length}}</span>
</span>
</div>
</div>
</div>
<div class="absolute" style="right: 10px;bottom: 65px;">
<span class="text-white f12 q-px-sm row items-center"
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>
<span>{{item.images.length}}</span>
</span>
</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>
<q-separator color="grey-2" class="q-my-md"/>
</div>
<q-dialog class="no-padding" v-model="showImagePriview"
v-if="images && images.length > 0">
......@@ -63,7 +93,7 @@
import ImagePreview from 'src/components/common/ImagePreview.vue'
export default {
components: {ImagePreview},
props: ["priceList"],
props: ["priceList",'SimilarObj','msg'],
data() {
return {
images: [],
......@@ -80,11 +110,39 @@
},
deep: true, // 深度监听
},
SimilarObj: {
handler(newVal, oldValue) {
this.SimilarObj = newVal;
},
deep: true,
},
msg: {
handler(newVal, oldValue) {
this.msg = newVal;
},
deep: true,
},
},
created() {
this.prices = this.priceList;
},
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() {
this.chooseObj = null
},
......@@ -97,6 +155,36 @@
this.currentImage = url
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) {
let gradeType = "";
......
......@@ -20,7 +20,78 @@
</div>
</div>
</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="col" :class="{'column':$q.platform.is.mobile}">
<div>
......@@ -73,7 +144,7 @@
</template>
</q-input>
</div>
</div>
</div> -->
</div>
<div class="q-mt-md q-pt-md" style="border-top: 1px dashed #eee">
<div class="row items-center">
......@@ -135,6 +206,7 @@ export default {
chosenObj: null,
sumPrice:0,
selectedObj: null,
roomGroup: null
};
},
created() {
......@@ -143,7 +215,7 @@ export default {
methods: {
goOrderHandler(){
let order = {
msg: JSON.stringify(this.msg),
msg: this.msg,
// hotelId: this.msg.hotelId,
// arrivalDate: this.msg.arrivalDate,
// departureDate: this.msg.departureDate,
......@@ -152,7 +224,7 @@ export default {
id: this.p.id,
selectedObjId: this.selectedObj.id,
roomOptionCd: this.selectedObj.roomOptionCd,
chosenObj: this.chosenObj,
Count: this.chosenObj.Count,
sumPrice: this.sumPrice
}
let key = this.$md5(JSON.stringify(order))
......@@ -167,11 +239,110 @@ export default {
},
handleSelect(item){
this.selectedObj = item
console.log(this.selectedObj,'-----')
this.sumPrice = 0
setTimeout(()=>{
this.calcMoney()
this.getData()
// this.calcMoney()
},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() {
this.sumPrice=0
this.chosenObj = {
......
<<<<<<< HEAD
<style>
.q-ml-lg .block {
margin-right: 12px;
}
</style>
=======
>>>>>>> f1c336638dd7e228f10cc6497760343026d24a12
<style scoped>
.header-box {
max-width: 1200px;
......
<style>
.q-ml-lg .block {
margin-right: 12px;
}
</style>
<style scoped>
.header-box {
max-width: 1200px;
......
......@@ -597,17 +597,28 @@
</template>
<script>
import auth from "src/components/common/auth.vue";
// import auth from "src/components/common/auth.vue";
import { slider, slideritem } from "vue-concise-slider";
import calendar from "../components/trip/calendar.vue";
import OrderPreview from "src/components/car/orderPreview.vue";
import smaple from "src/components/trip/smaple.vue";
import Trip from "src/components/trip/trip.vue";
import block from "src/components/trip/block/index";
// import smaple from "src/components/trip/smaple.vue";
// import Trip from "src/components/trip/trip.vue";
// import block from "src/components/trip/block/index";
import { date } from "quasar";
import componentsMap from "../components/car/Map.vue";
import * as dayjs from "dayjs";
// import * as dayjs from "dayjs";
export default {
components: {
slider,
slideritem,
calendar,
OrderPreview,
// smaple,
// Trip,
// block,
componentsMap,
// auth,
},
props: [],
data() {
return {
......@@ -718,17 +729,6 @@ export default {
zoomDiyContext: 1,
};
},
components: {
slider,
slideritem,
calendar,
OrderPreview,
smaple,
Trip,
block,
componentsMap,
auth,
},
watch: {
days: {
handler: function (val, oldval) {
......
......@@ -35,8 +35,11 @@
/>
</div>
<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">
<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': $q.platform.is.desktop,'col row justify-between': $q.platform.is.mobile,}">
<q-field stack-label label="入住 / 退房日期" standout
style="min-width: 190px" dense>
<div class="self-center full-width no-outline row no-wrap items-center" tabindex="0">
......@@ -50,23 +53,23 @@
@range-end="dateRangeHandler"></q-date>
</q-popup-proxy>
</q-field>
<q-field stack-label label="人数及客房" standout
<q-field stack-label label="人数及客房" standout
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">
{{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">
<div class="row items-center">
<div class="q-pa-lg q-py-lg bg-white">
<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>
<div>
<q-input
style="width: 150px"
:style="{'width': $q.platform.is.desktop?'150px':'auto'}"
v-model="roomGroup"
class="col"
mask="#"
reverse-fill-mask
dense
......@@ -98,11 +101,11 @@
</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">
<div class="row items-center">
<div class="row no-wrap">
<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>
<q-input
style="width: 150px"
:style="{'width': $q.platform.is.desktop?'150px':'auto'}"
v-model="x.numberOfAdults"
class="col"
mask="#"
......@@ -133,10 +136,11 @@
</template>
</q-input>
</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>
<q-input
style="width: 150px"
:style="{'width': $q.platform.is.desktop?'150px':'auto'}"
v-model="x.numberOfChildren"
class="col"
mask="#"
......@@ -170,11 +174,20 @@
</div>
<q-separator v-if="index!=(msg.searchroomGroup.length-1)" color="grey-2" class="q-my-md" />
</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>
</q-popup-proxy>
</q-field>
</div>
<div>
<div v-if="$q.platform.is.desktop">
<q-btn
color="primary"
unelevated
......@@ -183,6 +196,162 @@
@click="getRoom"
/>
</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>
......@@ -320,7 +489,7 @@
box-shadow: 0 2px 8px rgb(0 0 0 / 20%);
z-index: 999;
"
v-if="currentHeight > priceListHeight + 800 && $q.platform.is.mobile"
v-if="currentHeight > priceListHeight + 100 && $q.platform.is.mobile"
:style="{ transform: stickyHeight }"
>
<q-tabs
......@@ -355,6 +524,7 @@
style="max-width: 1200px; margin-left: auto; margin-right: auto"
>
<div class="text-h6">選擇方案</div>
<div
style="
background: #fff;
......@@ -363,17 +533,50 @@
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 class="text-h6 q-pt-lg" v-if="$q.platform.is.mobile">
所選方案詳情
</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="col">
<div
class="text-subtitle1 text-weight-bold row items-center"
v-if="$q.platform.is.desktop"
>
<span class="q-mr-md">行程標準出行方案</span>
<!-- <q-chip
......@@ -405,7 +608,7 @@
color="primary"
outline
:label="showOrderPreview ? '取消選擇' : '選擇'"
@click="showOrderPreview = !showOrderPreview"
@click="changeShowOrderPreviewHandler"
class="q-px-lg"
/>
</div>
......@@ -419,24 +622,14 @@
style="border-top: 1px solid #eee"
v-if="showOrderPreview"
>
<div class="q-mt-lg row" v-if="$q.platform.is.desktop">
<div class="col">
<RoomCard
<div class="q-mt-lg" v-if="$q.platform.is.desktop">
<RoomCard
:priceList="SimilarList"
:SimilarObj="SimilarObj"
:msg="msg"
@change="changeChosenDateHandler"
ref="RoomCard"
></RoomCard>
</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>
......@@ -460,6 +653,9 @@
<div
class="q-mt-md"
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.bathUsage}}</div>
......@@ -470,7 +666,9 @@
:class="{
'q-px-md': $q.screen.width < 1220 && $q.platform.is.mobile,
}">服务设施</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 row no-wrap">
<span class="text-weight-bold">客房网络连接</span>
......@@ -480,38 +678,41 @@
color="dark" square v-for="(x,i) in InterArr" :key="i">{{x}}</q-chip>
</span>
</div>
<div class="row no-wrap">
<div class="row no-wrap overflow-hidden">
<span class="text-weight-bold">水疗</span>
<div class="column col q-pl-md">
<table class="hotel-details-table q-pb-md">
<tr>
<td colspan="3" class="td01">室外</td>
<td colspan="3" class="td01">屋内</td>
<td colspan="3" class="td01">蒸气浴</td>
</tr>
<tr>
<td class="td02"></td>
<td class="td02"></td>
<td class="td02">混浴</td>
<td class="td02"></td>
<td class="td02"></td>
<td class="td02">混浴</td>
<td class="td02"></td>
<td class="td02"></td>
<td class="td02">混浴</td>
</tr>
<tr>
<td>{{bathRoom[0]}}</td>
<td>{{bathRoom[1]}}</td>
<td>{{bathRoom[2]}}</td>
<td>{{bathRoom[3]}}</td>
<td>{{bathRoom[4]}}</td>
<td>{{bathRoom[5]}}</td>
<td>{{bathRoom[6]}}</td>
<td>{{bathRoom[7]}}</td>
<td>{{bathRoom[8]}}</td>
</tr>
</table>
<div class="scroll" :style="{'max-width': $q.platform.is.mobile?'85vw':'auto'}">
<table class="hotel-details-table q-pb-md">
<tr>
<td colspan="3" class="td01">室外</td>
<td colspan="3" class="td01">屋内</td>
<td colspan="3" class="td01">蒸气浴</td>
</tr>
<tr>
<td class="td02"></td>
<td class="td02"></td>
<td class="td02">混浴</td>
<td class="td02"></td>
<td class="td02"></td>
<td class="td02">混浴</td>
<td class="td02"></td>
<td class="td02"></td>
<td class="td02">混浴</td>
</tr>
<tr>
<td>{{bathRoom[0]}}</td>
<td>{{bathRoom[1]}}</td>
<td>{{bathRoom[2]}}</td>
<td>{{bathRoom[3]}}</td>
<td>{{bathRoom[4]}}</td>
<td>{{bathRoom[5]}}</td>
<td>{{bathRoom[6]}}</td>
<td>{{bathRoom[7]}}</td>
<td>{{bathRoom[8]}}</td>
</tr>
</table>
</div>
<div class="q-pt-sm row wrap">
<q-chip size="9px" clickable
text-color="white"
......@@ -727,6 +928,7 @@ export default {
},
JapanIncrease: '',
SimilarList: [],
SimilarObj: null,
isDirect: 1,
TripConfig: {},
isShowNav: false,
......@@ -843,6 +1045,17 @@ export default {
document.getElementsByTagName("body")[0].style = "";
},
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) {
this.currentImage = url
this.showImagePriview = true
......@@ -887,6 +1100,9 @@ export default {
this.dateRangeFormat = `${this.msg.arrivalDate} - ${this.msg.departureDate} `
if (this.$refs.qDateProxy) this.$refs.qDateProxy.hide()
this.liveNvm = this.dateDiffer(this.msg.arrivalDate,this.msg.departureDate)
if(this.$q.platform.is.mobile){
this.getData()
}
},
dateDiffer(DateStart,DateEnd) {
//date1结束时间
......@@ -1016,7 +1232,7 @@ export default {
this.travelLngLat.push({
Lat: this.hotelSummary.latitudeW,
Lng: this.hotelSummary.longitudeW,
name: this.hotelSummary.hotelName
Address: this.hotelSummary.hotelName
});
//拆分酒店服务与设施
if (this.hotelDetails.roomEquipments != "") {
......@@ -1310,7 +1526,9 @@ export default {
60;
}, 1000);
});
} else {
this.$q.notify({
type: "negative",
......@@ -1349,12 +1567,15 @@ export default {
arrList(this.SimilarList)
this.SimilarList.forEach((x,index) => {
x.id = (index+1)
x.images = []
x.images.push(x.roomImageURL)
for (let i = 0; i < 4; i++) {
if(x.roomOptions[`planPictureURL${(i+1)}`] && x.roomOptions[`planPictureURL${(i+1)}`].length>0){
x.images.push(x.roomOptions[`planPictureURL${(i+1)}`])
if(x.roomOptions.length>0){
for (let f = 0; f < x.roomOptions.length; f++) {
for (let i = 0; i < 4; i++) {
if(x.roomOptions[f][`planPictureURL${(i+1)}`]){
x.images.push(x.roomOptions[f][`planPictureURL${(i+1)}`])
}
}
}
}
if (
Object.prototype.toString.call(x.roomOptions) ==
......
......@@ -72,12 +72,12 @@
<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="row">
<!-- <q-img
:src="roomRateDetails?roomRateDetails[0].roomImageURL:'https://image.kkday.com/v2/image/get/s1.kkday.com/product_138437/20230217083232_t5rcO/jpg'"
<q-img
:src="details.roomRateDetails?details.roomRateDetails.roomImageURL:'https://image.kkday.com/v2/image/get/s1.kkday.com/product_138437/20230217083232_t5rcO/jpg'"
class="rounded-borders"
spinner-color="grey-3"
style="width: 80px"
/> -->
/>
<div class="q-ml-md col">
<div class="text-subtitle1 ellipsis">
{{details.hotelName}}
......@@ -92,71 +92,65 @@
<q-icon name="iconfont iconrili" size="20px" class="q-mr-sm" />
<span>{{msg.arrivalDate}}{{msg.departureDate}}</span>
</div>
<template v-for="x in roomRateDetails">
<template v-if="x.checked">
<template v-for="y in x.roomOptions">
<div class="text-grey-9 q-ml-md" v-if="y.checked">
<q-icon name="iconfont iconcanpinhui-xican" size="17px" class="q-mr-sm" />
<span class="q-mr-sm">{{getMealType(y.meals)}} x {{ y.Count }}</span
>
</div>
</template>
<div class="row items-center">(
<span class="fz15 text-weight-bold">
<span v-if="x.roomType==1">{{getGradeType(x.gradeType)}}单人间</span>
<span v-if="x.roomType==2">{{getGradeType(x.gradeType)}}双人间</span>
<span v-if="x.roomType==3">{{getGradeType(x.gradeType)}}大床房</span>
<span v-if="x.roomType==4">{{getGradeType(x.gradeType)}}三人间</span>
<span v-if="x.roomType==5">{{getGradeType(x.gradeType)}}四人间</span>
<span v-if="x.roomType==6">{{getGradeType(x.gradeType)}}日式房</span>
<span v-if="x.roomType==7">{{getGradeType(x.gradeType)}}日式+西式混合房</span>
<span v-if="x.roomType==8">{{getGradeType(x.gradeType)}}大床房(小型)</span>
<span v-if="(x.roomType==9||x.roomType=='')&&x.gradeType==''">未知房型</span>
</span>
<span class="fz13 text-grey-6 q-ml-sm">
<span v-if="x.smoking==0">禁烟, </span>
<span v-if="x.smoking==1">可吸烟, </span>
<span v-if="x.withBath==0">无浴室</span>
<span v-if="x.withBath==1">有浴室</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 v-if="details.roomRateDetails">(
<span class="fz15 text-weight-bold">
<span v-if="details.roomRateDetails.roomType==1">{{getGradeType(details.roomRateDetails.gradeType)}}單人間</span>
<span v-if="details.roomRateDetails.roomType==2">{{getGradeType(details.roomRateDetails.gradeType)}}雙人間</span>
<span v-if="details.roomRateDetails.roomType==3">{{getGradeType(details.roomRateDetails.gradeType)}}大床房</span>
<span v-if="details.roomRateDetails.roomType==4">{{getGradeType(details.roomRateDetails.gradeType)}}三人間</span>
<span v-if="details.roomRateDetails.roomType==5">{{getGradeType(details.roomRateDetails.gradeType)}}四人間</span>
<span v-if="details.roomRateDetails.roomType==6">{{getGradeType(details.roomRateDetails.gradeType)}}日式房</span>
<span v-if="details.roomRateDetails.roomType==7">{{getGradeType(details.roomRateDetails.gradeType)}}日式+西式混合房</span>
<span v-if="details.roomRateDetails.roomType==8">{{getGradeType(details.roomRateDetails.gradeType)}}大床房(小型)</span>
<span v-if="(details.roomRateDetails.roomType==9||details.roomRateDetails.roomType=='')&&details.roomRateDetails.gradeType==''">未知房型</span>
</span>
<span class="fz13 text-grey-6 q-ml-sm">
<span v-if="details.roomRateDetails.smoking==0">禁煙, </span>
<span v-if="details.roomRateDetails.smoking==1">可吸煙, </span>
<span v-if="details.roomRateDetails.withBath==0">無浴室</span>
<span v-if="details.roomRateDetails.withBath==1">有浴室</span>
</span>
)
</span>
<q-icon name="iconfont jinggao1" size="20px"/><span>僅剩{{details.currentAllotment}}</span>
<span class="q-mr-sm"></span>
<q-icon name="iconfont iconpeople" size="20px" class="q-mr-xs q-ml-sm" />
<span class="q-mr-sm">
成人 {{numberOfAdults}}<span class="q-pl-sm">童 {{numberOfChildren}}</span>
成人 {{numberOfAdults}}<span class="q-pl-sm">{{numberOfChildren}}</span>
</span>
</div>
</div>
<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-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)">
<template v-if="details.cancellationPeriod1==-1">有通知取消,</template>
<template v-if="details.cancellationPeriod1==0">入住日取消,</template>
<template v-if="details.cancellationType1==1">续费{{details.cancellation1}}%</template>
<template v-if="details.cancellationType1==2">续费{{details.cancellation1}}</template>
<template v-if="details.cancellationPeriod1==-1">有通知取消,</template>
<template v-if="details.cancellationPeriod1==0">入住日取消,</template>
<template v-if="details.cancellationType1==1">續費{{details.cancellation1}}%</template>
<template v-if="details.cancellationType1==2">續費{{details.cancellation1}}</template>
</span>
<span class="text-green-6" 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==0">入住日取消,</template>
<template v-if="details.cancellationType2==1">续费{{details.cancellation2}}%</template>
<template v-if="details.cancellationType2==2">续费{{details.cancellation2}}</template>
<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==0">入住日取消,</template>
<template v-if="details.cancellationType2==1">續費{{details.cancellation2}}%</template>
<template v-if="details.cancellationType2==2">續費{{details.cancellation2}}</template>
</span>
<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==0">入住日取消,</template>
<template v-if="details.cancellationType3==1">续费{{details.cancellation3}}%</template>
<template v-if="details.cancellationType3==2">续费{{details.cancellation3}}</template>
<template v-if="details.cancellationPeriod3==-1">有通知取消,</template>
<template v-if="details.cancellationPeriod3==0">入住日取消,</template>
<template v-if="details.cancellationType3==1">續費{{details.cancellation3}}%</template>
<template v-if="details.cancellationType3==2">續費{{details.cancellation3}}</template>
</span>
</div>
<q-separator color="grey-2" class="q-mt-md" />
......@@ -204,8 +198,8 @@
<q-input
standout
v-model="parameters.guestAddress"
label="前地址"
:rules="[(val) => !!val || '請輸前地址']"
label="前地址"
:rules="[(val) => !!val || '請輸前地址']"
ref="guestAddress"
></q-input>
</div>
......@@ -233,60 +227,60 @@
</div>
</div>
<q-separator color="grey-2" class="q-mt-md" />
<template>
<div
class="bg-grey-1 rounded-borders q-pa-md q-mt-md guest-item"
v-for="(x,index) in parameters.roomGroup"
:key="index"
>
<div class="text-subtitle1 q-pb-md text-weight-bold">
房間{{ index+1 }}
<div
class="bg-grey-1 rounded-borders q-pa-md q-mt-md guest-item"
v-for="(x,i) in parameters.roomGroup"
:key="i"
>
<div class="text-subtitle1 q-pb-md text-weight-bold">
房間{{ x.roomCount }}
</div>
<div class="row q-col-gutter-md">
<div :class="filedGuestWidth">
<q-input
standout
v-model="x.roomMaleCount"
label="成人男"
placeholder=""
mask="#"
reverse-fill-mask
:ref="`guest${i}Male`"
/>
<!-- :ref="`guest${i}Male`" :rules="[(val) => !!val || '請輸成人數']"-->
</div>
<div class="row q-col-gutter-md">
<div :class="filedGuestWidth">
<q-input
standout
v-model="x.roomMaleCount"
label="成人男"
placeholder=""
mask="#"
reverse-fill-mask
/>
<!-- :ref="`guest${i}Male`" :rules="[(val) => !!val || '請輸成人數']"-->
</div>
<div :class="filedGuestWidth">
<q-input
standout
v-model="x.roomFemaleCount"
label="成人女"
placeholder=""
mask="#"
reverse-fill-mask
/>
<!-- :ref="`guest${i}Female`" :rules="[(val) => !!val || '請輸成人女數']"-->
</div>
<div :class="filedGuestWidth">
<q-input
standout
v-model="x.roomChildCount"
label="儿童"
placeholder=""
mask="#"
reverse-fill-mask
:rules="[(val) => !!val || '請輸儿童數']"
/>
</div>
<div :class="filedGuestWidth">
<q-input
standout
v-model="x.roomFemaleCount"
label="成人女"
placeholder=""
mask="#"
reverse-fill-mask
:ref="`guest${i}Female`"
/>
<!-- :ref="`guest${i}Female`" :rules="[(val) => !!val || '請輸成人女數']"-->
</div>
<div :class="filedGuestWidth">
<q-input
standout
v-model="x.roomChildCount"
label="兒童"
placeholder=""
mask="#"
reverse-fill-mask
/>
<!-- :rules="[(val) => !!val || '請輸儿童數']" -->
</div>
</div>
</template>
</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-card>
</q-form>
<coupon
v-if="!sumPrice"
v-if="sumPrice>0"
:product-type="productType"
:current-price="sumPrice"
@change="changeDiscountHandler"
......@@ -313,12 +307,12 @@
>
<div class="text-subtitle1 text-weight-bolder">付款明細</div>
<div class="row q-mt-md">
<!-- <q-img
:src="roomRateDetails?roomRateDetails[0].roomImageURL:'https://image.kkday.com/v2/image/get/s1.kkday.com/product_138437/20230217083232_t5rcO/jpg'"
<q-img
:src="details.roomRateDetails?details.roomRateDetails.roomImageURL:'https://image.kkday.com/v2/image/get/s1.kkday.com/product_138437/20230217083232_t5rcO/jpg'"
class="rounded-borders"
spinner-color="grey-3"
style="width: 80px"
/> -->
/>
<div class="q-ml-md col">
<div class="text-subtitle1 ellipsis">
{{details.hotelName}}
......@@ -328,41 +322,30 @@
</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 style="width: 80px">
入住时间</div>
入住時間</div>
<div class="q-ml-md">
{{parameters.arrivalDate}}
<template v-for="(x,i) in roomRateDetails">
<template v-if="x.checked">
<template v-for="y in x.roomOptions">
<template v-if="y.checked">{{y['check-inStartTime']}} 之后</template>
</template>
</template>
</template>
{{checkInTimeH}}
{{details.roomRateDetails.roomOptions['check-inStartTime']}} 之後
</br>
<template v-for="(x,i) in roomRateDetails">
<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>
{{checkInTimeQ+' '+details.roomRateDetails.roomOptions['finalCheck-outTime']}} 之前
</div>
</div>
</div>
<q-separator color="grey-2" class="q-my-md"/>
<div class="text-grey-9">
<template v-for="(x,i) in roomRateDetails">
<template v-if="x.checked">
<template v-for="y in x.roomOptions">
<div class="row q-mb-sm" v-if="y.checked">
<div class="col">{{getMealType(y.meals)}} x {{ y.Count }}</div>
<div>CNY {{ getPrice2(y.totalChargeableRateInfo) }}</div>
<template v-for="(x,i) in details.roomGroup">
<template v-for="y in x.rateGroup">
<div class="row q-mb-sm">
<div class="col">{{y.stayDate}}</div>
<div>
<span v-if="y.perAdultRateBySetCurrency">CNY {{y.perAdultRateBySetCurrency}}/人</span>
<span v-else="y.totalPerRoomRateBySetCurrency">CNY {{y.totalPerRoomRateBySetCurrency}}/晚</span>
</div>
</div>
</template>
</template>
</template>
<hr
style="border: none; border-top: 1px dashed #eee !important"
......@@ -375,13 +358,13 @@
</div>
</div>
<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="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 class="text-grey-5" v-else>暫無優惠</div>
</div>
......@@ -431,7 +414,7 @@ export default {
data() {
return {
CouponIds: [],
productType: 4,
productType: 8,
sumPrice: 0,//总金额
order: null,//订单信息
orderKey: "",
......@@ -465,6 +448,9 @@ export default {
numberOfAdults: 0,
numberOfChildren: 0,
roomRateDetails: [],
checkInTimeH: '',
checkInTimeQ: '',
price: 0,
guest: {
roomCount: 0,//房间编号
roomMaleCount:0,
......@@ -509,7 +495,7 @@ export default {
DiscountMoney:0,//优惠
OrderSource: 3,//类型 1 来源内部 2 来源B2B 3 来源B2C
OrderForm:1,
DiscountsMoney: 0//优惠
CouponAllotIds: '',
},
TotalPeople: 0,//总人数
};
......@@ -540,15 +526,15 @@ export default {
methods: {
changeDiscountHandler(coupon) {
if (coupon) {
this.parameters.DiscountsMoney = coupon.discountMoney;
this.parameters.DiscountMoney = coupon.discountMoney;
this.CouponIds = [coupon.couponId];
this.parameters.DiscountsIds = this.CouponIds.join(",")
this.parameters.CouponAllotIds = this.CouponIds.join(",")
} else {
this.parameters.DiscountsMoney = 0;
this.parameters.DiscountMoney = 0;
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();
},
// 获取商品详情
......@@ -562,21 +548,22 @@ export default {
if (r.data.resultCode == 1) {
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]'){
let arr = [];
arr.push(this.details.roomGroup);
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;
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]'){
let arr = [];
arr.push(x.rateGroup);
......@@ -602,11 +589,11 @@ export default {
this.TotalChildCount+=x.roomChildCount*x.rateGroup.length;
rateGrouoLen+= x.rateGroup.length;
this.chekedChildCount = this.childNum*rateGrouoLen;
this.chekedChildCount = this.numberOfChildren*rateGrouoLen;
if(this.TotalChildCount<this.chekedChildCount){
this.isBaoChild=true;
}
//无价格 只有房间价格
let onlyRoomPrice=0;
let onlyJanpnase=0;
x.rateGroup.forEach(z=>{
......@@ -636,6 +623,12 @@ export default {
onlyRoomPrice+=parseFloat(z.totalPerRoomRateBySetCurrency);
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;
childCount+=childToTalPrice*x.roomChildCount;
......@@ -653,10 +646,14 @@ export default {
this.price=this.parameters.totalChargeableRateInfo;
// AdultJapanCount+=AdultJapanPrice;
// childJapanCount+=ChildJapanPrice;
this.parameters.roomGroup[index].rateGroup = x.rateGroup
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 {
this.$message.error(r.data.message)
}
......@@ -676,22 +673,31 @@ export default {
if (this.order) {
this.orderKey = key;
this.OrderDate = this.order.order
this.msg = JSON.parse(this.OrderDate.msg)
this.sumPrice = this.OrderDate.sumPrice
this.msg = this.OrderDate.msg
this.parameters.arrivalDate = this.msg.arrivalDate
this.parameters.departureDate = this.msg.departureDate
this.parameters.totalRoomCount = this.msg.searchroomGroup.length
this.parameters.roomGroup=[];
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.numberOfChildren = 0,
this.msg.roomOptionCd = this.OrderDate.roomOptionCd
this.parameters.roomOptionCd = this.OrderDate.roomOptionCd
this.parameters.hotelId = this.msg.hotelId
this.msg.searchroomGroup.forEach(x=>{
this.numberOfAdults+=x.numberOfAdults
this.numberOfChildren+=x.numberOfChildren
this.numberOfAdults+=Number(x.numberOfAdults)
this.numberOfChildren+=Number(x.numberOfChildren)
})
}
}
......@@ -707,10 +713,22 @@ export default {
return this.orderKey != "";
},
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.EmployeeIdStr = this.userInfo.Surname+this.userInfo.Name
console.log(this.parameters,'-----')
return
this.$refs.mail.validate()
this.$refs.SurName.validate()
this.$refs.Name.validate()
......@@ -718,25 +736,13 @@ export default {
this.$refs.guestAddress.validate()
this.$refs.checkInTime.validate()
this.parameters.guestEmail = this.userInfo.Mailbox
// for (let i = 0; i < this.parameters.roomGroup.length; i++) {
// this.$refs[`guest${i}Male`][0].validate()
// this.$refs[`guest${i}Female`][0].validate()
// }
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
for (let i = 0; i < this.parameters.roomGroup.length; i++) {
if(!this.parameters.roomGroup[i].roomMaleCount&&!this.parameters.roomGroup[i].roomMaleCount){
this.$message.error('一個房間至少入住一人');
return;
}
}
let flag = true
flag = await this.formValidateHandler('baseUserInfo')
......@@ -754,10 +760,10 @@ export default {
},
SetCarOrder(){
console.log(this.parameters,'====')
return
// return
this.loading = true
this.apipost(
"dmc_post_Get_GetJAPAN_HotelBooking",
"dmc_post_GetJAPAN_HotelBookingB2C",
this.parameters,
(r) => {
if (r.data.resultCode == 1) {
......@@ -778,13 +784,13 @@ export default {
Name: '',
ContactNumber: this.userInfo.Mobile,// 联系电话
Mailbox: this.userInfo.Mailbox,//邮箱
GoodsId: this.parameters.CouponsId,//商品id
GoodsName: this.details.Name,//商品名称
GoodsPic: this.roomRateDetails[0].roomImageURL,//商品图片
GoodsId: this.parameters.hotelId,//商品id
GoodsName: this.parameters.HotelName,//商品名称
GoodsPic: this.parameters.HotelPic,//商品图片
GoodsType: this.productType,
OrderMake: this.parameters.UseDate,//订单摘要(例如出行时间)
OrderMake: this.parameters.arrivalDate,//订单摘要(例如出行时间)
TotalPrice: this.parameters.totalChargeableRateInfo,//总价格
PreferentialPrice: this.parameters.DiscountsMoney,// 优惠总金额
PreferentialPrice: this.parameters.DiscountMoney,// 优惠总金额
ErpOrderId: ErpOrderId,//erp订单id
Country: this.userInfo.Country,//国家id
PlatformTax: 0,//平台税金默认0
......@@ -845,7 +851,7 @@ export default {
getPrice(price) {
//(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){
return Math.ceil(price / this.JapanIncrease)
......
<style lang="scss" scoped>
.form-item {
max-width: 320px;
}
.content {
width: 900px;
}
.title {
margin-top: 20px;
margin-bottom: 10px;
}
.card {
margin: 10px;
background: #ffffff;
border: 1px solid #eeeeee;
border-radius: 8px;
}
.card-title {
height: 37px;
height: 37px;
padding: 0 20px;
line-height: 37px;
background: #f5f5f5;
border-radius: 8px 8px 0px 0px;
}
.tips {
height: 42px;
background: #f5f5f5;
border-radius: 8px;
padding: 0 35px;
line-height: 42px;
}
::v-deep .q-field__control {
height: 40px;
}
::v-deep .q-field--auto-height .q-field__control {
min-height: 40px;
}
::v-deep .q-field__marginal {
height: 40px;
}
.title {
margin-top: 20px;
margin-bottom: 10px;
}
.phone {
margin-left: 100px;
}
.name {
padding: 10px;
max-width: 400px;
}
.user-name {
padding-top: 10px;
border-left: 1px solid #eee;
width: 120px;
}
.pay-info {
padding-top: 10px;
border-left: 1px solid #eee;
width: 120px;
}
.order-info {
padding-top: 10px;
border-left: 1px solid #eee;
width: 120px;
}
.order-action {
padding-top: 10px;
border-left: 1px solid #eee;
width: 120px;
}
.nav-item {
width: 25%;
max-width: 100px;
text-align: center;
}
.border-bottom {
width: 20px;
height: 4px;
border-radius: 2px;
background-color: $primary;
margin: -8px auto 0 auto;
}
.product-img {
width: 64px;
height: 64px;
}
</style>
<template>
<div class="bg-white" :class="$q.platform.is.desktop ? 'q-ma-lg content': 'full-width'">
<div class="flex justify-between margin">
<div :class="$q.platform.is.desktop ? 'form-item': 'full-width'">
<q-input
placeholder="輸入商品名稱/訂單號"
v-model="GoodsName"
clearable
outlined
></q-input>
<div :class="$q.platform.is.desktop ? 'q-ma-lg content': 'full-width'" style="min-height:80vh">
<div class="" :class="{'row items-center':$q.platform.is.desktop,'column':$q.platform.is.mobile}">
<div :class="{'row items-center':$q.platform.is.mobile}">
<q-btn-dropdown color="dark" flat dense :label="`訂單狀態:${orderStatusFiled}`" class="q-px-md" :class="{'col':$q.platform.is.mobile}">
<q-list>
<q-item clickable v-close-popup v-for="item in orderEnums" :key="item.ID" @click="changeOrderType(item)">
<q-item-section>
<q-item-label>{{ item.Name }}</q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-btn-dropdown>
<q-btn-dropdown color="dark" flat dense :label="`商品類型:${productTypeFiled}`" class="q-px-md" :class="{'col':$q.platform.is.mobile}">
<q-list>
<q-item clickable v-close-popup v-for="(x,i) in productTypes" :key="i" @click="changeProductTypeHandler(x)">
<q-item-section>
<q-item-label>{{ x.desc }}</q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-btn-dropdown>
</div>
</div>
<div class="tips flex">
<div
@click="changeOrderType(item)"
class="nav-item cursor-pointer"
v-for="item in orderEnums"
:key="item.ID"
>
{{ item.Name }}
<div :class="orderStatus === item.ID ? 'border-bottom' : ''"></div>
<q-space class="desktop-only" />
<div>
<q-input standout dense v-model="msg.GoodsName" :borderless="$q.platform.is.mobile" :class="{'q-mx-md':$q.platform.is.mobile}" label="商品名稱/訂單編號" @keypress.enter.native="initListHandler" >
<template v-slot:prepend>
<q-icon name="search" />
</template>
</q-input>
</div>
</div>
<!-- pc -->
<div v-if="$q.platform.is.desktop">
<div class="card" v-for="item in orderList" :key="item.id">
<div class="flex card-title justify-between">
<div class="flex">
<span><span class="text-grey-6">订单号:</span>{{ item.orderNo }}</span>
<span class="phone text-grey-6">
<i class="iconfont iconmessage"></i>
联系客服
</span>
</div>
<span class="text-grey-6">{{ item.createTimeStr }}</span>
<q-card class="rounded-borders q-pa-md q-mt-md" flat v-for="item in orderList" :key="item.id">
<div class="row justify-between items-center">
<div>
<q-chip size="12px" :class="[item.goodTypeEnum.bgColor,item.goodTypeEnum.color]" square>{{ item.goodTypeEnum?item.goodTypeEnum.desc:'' }}</q-chip>
<span class="f12 q-ml-md text-grey-5 desktop-only">訂單編號:#{{ item.orderNo }}</span>
</div>
<div class="flex justify-between">
<div class="name flex no-wrap">
<img class="product-img mr" :src="item.goodsPic" />
<div style="max-width: 300px">
<div class="ellipsis-2">{{ item.goodsName }}</div>
<div>x1</div>
</div>
</div>
<div class="flex">
<div class="user-name text-center">
<i class="iconfont iconpeople1"></i>{{ item.surName
}} {{ item.name }}
</div>
<div class="pay-info text-center">
<div class=" text-grey-6">CNY{{ item.totalPrice }}</div>
<div>{{ item.payTypeStr }}</div>
</div>
<div class="order-info text-center">
<div class="primary">{{item.orderStatusStr}}</div>
<div class="q-mt-sm cursor-pointer">订单详情</div>
</div>
<div class="order-action text-center">
<q-btn
color="primary"
@click="cancalOrder(item)"
unelevated
outline
size="sm"
label="取消订单">
</q-btn>
<div>查看發票</div>
</div>
</div>
<div class="text-grey-5 desktop-only">下單日期:{{ item.createTimeStr }}</div>
<div class="row items-center">
<q-btn color="dark" icon="iconfont iconmessage1" label="联系客服" flat @click="goCustomerServiceHandler" class="q-mr-md" />
<q-icon :name="item.orderStatusInfo.icon" :class="[item.orderStatusInfo.color]" size="14px" />
<span class="q-ml-sm" :class="[item.orderStatusInfo.color]">{{ item.orderStatusInfo.desc }}</span>
</div>
</div>
</div>
<!-- mobile -->
<div v-else>
<div class="card" v-for="item in orderList" :key="item.id">
<div class="flex card-title justify-between">
<div class="flex">
<span><span class="text-grey-6">订单号:</span>{{ item.orderNo }}</span>
</div>
<span class="text-grey-6">{{ item.orderStatusStr }}</span>
</div>
<div class="q-pa-md">
<div class="flex no-wrap full-width">
<img class="product-img mr flex-noShark" :src="item.goodsPic" />
<div>
<div class="ellipsis-2">{{ item.goodsName }}</div>
<div>x1</div>
<div class="q-pa-md bg-grey-2 rounded-borders mobile-only q-mt-sm">
<div class="f12 text-grey-6">訂單編號:#{{ item.orderNo }}</div>
<div class="text-grey-6 q-mt-sm">下單日期:{{ item.createTimeStr }}</div>
</div>
<div class="q-mt-sm" :class="{'row':$q.platform.is.desktop,'column':$q.platform.is.mobile}">
<div class="row col">
<q-img
:src="item.goodsPic"
class="rounded-borders q-mr-md"
spinner-color="grey-2"
:style="{width: $q.platform.is.desktop?'150px':'80px',height:$q.platform.is.desktop?'80px':'40px'}"
/>
<div class="col">
<div class="text-body1 ellipsis cursor-pointer" @click="CommonJump('/orderinfo/'+item.orderNo,{},'blank')">{{ item.goodsName }}</div>
<div class="text-grey-5" :class="{'q-mt-sm':$q.platform.is.desktop}">{{ item.orderMake }} </div>
<div class="q-mt-sm text-grey-8 f12 row items-center desktop-only">
<q-icon name="iconfont iconpeople1" size="14px" class="q-mr-sm" />
<span class="q-mr-md">{{ item.surName }}/{{ item.name }}</span>
<q-icon name="iconfont icontelephone" size="14px" class="q-mr-sm" />
<span class="q-mr-md">{{ item.contactNumber }}</span>
<q-icon name="iconfont iconemail" size="14px" class="q-mr-sm" />
<span class="q-mr-md">{{ item.mailbox }}</span>
</div>
</div>
</div>
<div>
<!-- <div>
<i class="iconfont iconpeople1"></i>{{ item.surName
}} {{ item.name }}
</div> -->
<div class="q-mt-sm text-grey-8 f12 row items-center mobile-only">
<q-icon name="iconfont iconpeople1" size="14px" class="q-mr-sm" />
<span class="q-mr-md">{{ item.surName }}/{{ item.name }}</span>
<q-icon name="iconfont icontelephone" size="14px" class="q-mr-sm" />
<span class="q-mr-md">{{ item.contactNumber }}</span>
</div>
<div class="" :class="{'q-mt-md row items-end':$q.platform.is.mobile,'q-ml-lg':$q.platform.is.desktop}">
<div class="col mobile-only text-left">
<q-btn color="dark" icon="iconfont iconmessage1" label="联系客服" flat @click="goCustomerServiceHandler" />
</div>
<div>
<div class="f18 text-right">CNY{{ item.totalPrice }}</div>
<!-- <div>{{ item.payTypeStr }}</div> -->
<div class="text-right">
<span>CNY:</span>
<span class="text-h6 q-ml-sm">{{ moneyFormat(item.totalPrice,2) }}</span>
</div>
<div class="q-mt-md text-right" v-if="item.orderStatus==1">
<!-- <q-btn color="dark" dense flat class="q-px-sm" label="查看訂單" /> -->
<q-btn color="primary" dense flat class="q-px-sm" label="取消訂單" @click="cancalOrder(item.orderNo)" />
<q-btn color="primary" dense unelevated class="q-px-sm q-ml-sm" label="立即支付" @click="CommonJump('/pay/'+item.orderNo,{},'blank')" />
</div>
<!-- <div>
<div class="primary">{{item.orderStatusStr}}</div>
<div class="q-mt-sm cursor-pointer">订单详情</div>
</div> -->
<div class="flex justify-end q-mt-sm">
<q-btn
color="primary"
@click="cancalOrder(item)"
unelevated
outline
size="sm"
label="取消订单">
</q-btn>
<div class="q-mt-md text-right" v-else>
<q-btn color="dark" dense flat class="q-px-sm" @click="CommonJump('/orderinfo/'+item.orderNo,{},'blank')" label="查看訂單" />
</div>
</div>
</div>
</div>
</div>
</q-card>
<div class="row justify-end q-mt-lg">
<q-pagination
v-if="pageCount > 1"
v-model="msg.pageIndex"
:max="pageCount"
@input="getOrderList"
:direction-links="true"
color="white"
text-color="dark"
active-color="primary"
active-text-color="white"
active-design="unelevated"
unelevated
glossy
ellipses
:max-pages="6"
boundary-numbers
size="13px"
padding="sm md"
></q-pagination>
</div>
<!-- <noneData v-show="!orderList.length"></noneData> -->
<div class="text-center" v-if="!orderList || orderList.length==0">
<none-data
iconType="order"
title="沒有找到您的訂單信息哦"
subtitle="趕緊去挑選心儀的旅遊產品吧"
></none-data>
</div>
<noneData v-show="!orderList.length"></noneData>
</div>
</template>
<script>
import noneData from "../../components/noneData.vue";
import NoneData from "src/components/common/noneData.vue";
import {mappingListType,transProductEnum} from "src/utils/producttypeenum";
import EnumHelper from 'src/utils/enumhelper';
import OrderStatusEnum from 'src/utils/orderStautsEnum';
import ListProductTypeEnum from 'src/utils/listProductType';
export default {
components: {
noneData,
NoneData,
},
data() {
return {
orderEnums: [],
GoodsName: '',
orderList: [],
current: 1,
pageCount: 0,
orderStatus: 0,
orderStatusFiled:'',
productTypeFiled:'',
msg:{
pageSize:10,
pageIndex:1,
OrderStatus: 0,
GoodsName: '',
OrderTypeStr:''
},
productTypes:[]
};
},
mounted() {
this.productTypes = Object.values(ListProductTypeEnum).filter(x=>x.value!=3)
this.productTypes.splice(0,0,{
value:'',
desc:'全部類型'
})
this.productTypeFiled=this.productTypes[0].desc
this.type = this.$route.query.type
if(this.type) {
this.orderStatus = Number(this.type)
this.msg.OrderStatus = Number(this.type)
}
this.getOrderEnums();
this.getOrderList();
},
methods: {
cancalOrder() {},
cancalOrder(OrderNo) {
console.log(this.$q.dialog)
this.$q.dialog({
title: '取消確認',
message: '訂單取消後,系統將立即釋放位置,請問是否執行?',
cancel: true,
persistent: true
}).onOk(() => {
this.apipost('GetCancelOrder_post',{OrderNo},r=>{
if(r.data.resultCode==1){
this.$message.success('訂單取消成功')
this.getOrderList()
}else{
this.$message.error('訂單取消失敗,請重新嘗試')
}
})
}).onCancel(() => {
// console.log('>>>> Cancel')
})
},
pageChange(value) {
this.current = value;
this.getOrderList();
},
changeOrderType(item) {
if (this.orderStatus === item.ID) {
this.orderStatus = 0;
} else {
this.orderStatus = item.ID;
if (this.msg.OrderStatus != item.ID) {
this.msg.OrderStatus = item.ID
this.orderStatusFiled = item.Name
this.initListHandler()
}
},
changeProductTypeHandler(x){
if(x.desc!=this.productTypeFiled){
this.msg.OrderTypeStr = x.value==''?'':transProductEnum(x.value).join(',')
this.productTypeFiled = x.desc
this.initListHandler()
}
this.current = 1;
},
initListHandler(){
this.msg.pageIndex = 1;
this.pageCount = 0;
this.orderList = [];
this.getOrderList();
......@@ -254,43 +226,37 @@ export default {
{},
(res) => {
if (res.data.resultCode == 1) {
this.orderEnums = res.data.data;
this.orderEnums.splice(0,0,{ID:0,Name:'全部訂單'})
console.log(this.orderEnums)
this.orderStatusFiled = this.orderEnums[0].Name
} else {
// this.$notify(res.data.message);
this.$q.notify({
type: "negative",
message: res.data.message,
position: "top",
timeout: 2000, // 以毫秒为单位; 0意味着没有超时
});
this.$message.error(res.data.message);
}
},
null
);
},
goCustomerServiceHandler(){
window.open('https://work.weixin.qq.com/kfid/kfcaec7130ac124872a', '_blank');
},
getOrderList() {
this.apipost(
"GetMyDirectOrderPageList_post",
{
pageIndex: this.current,
pageSize: 10,
orderStatus: this.orderStatus,
GoodsName: this.GoodsName,
},
this.msg,
(res) => {
if (res.data.resultCode == 1) {
const { count, pageData, pageCount } = res.data.data;
this.count = count;
this.pageCount = pageCount;
this.orderList = pageData;
this.orderList.forEach(x=>{
x.goodTypeEnum = mappingListType(x.goodsType)
x.orderStatusInfo = EnumHelper.ParseToEnum(OrderStatusEnum,x.orderStatus,'value')
})
} else {
// this.$notify(res.data.message);
this.$q.notify({
type: "negative",
message: res.data.message,
position: "top",
timeout: 2000, // 以毫秒为单位; 0意味着没有超时
});
this.$message.error(res.data.message)
}
},
null
......
<style lang="scss" scoped>
</style>
<template>
<div>价格详情
<div
class="rounded-borders bg-white q-pa-md"
style="width: 300px"
:style="{
width:
$q.screen.width < 1200 || $q.platform.is.mobile
? 'unset'
: '300px',
position:$q.platform.is.mobile?'unset':'sticky',
top:$q.platform.is.mobile?'unset':'50px',
}"
>
<div class="text-subtitle1 text-weight-bolder">付款明細</div>
<!-- <div class="q-mt-md text-grey-6">
<div class="row q-pb-xs no-wrap" v-if="AirportObj&&AirportObj.Name">
<div style="width: 80px">{{details.CarType==1?'接':'送'}}機機場:</div>
<div class="q-ml-md ellipsis-2-lines">{{AirportObj.Name}}</div>
</div>
<div class="row q-pb-xs no-wrap" v-if="AirportObj&&AirportObj.Name">
<div style="width: 80px">{{details.CarType==1?'抵達':'起飛'}}時間:</div>
<div class="q-ml-md ellipsis-2-lines">{{parameters.FlightTime}}</div>
</div>
<div class="row q-pb-xs no-wrap" v-if="parameters.GetonAddress">
<div style="width: 80px">上車點:</div>
<div class="q-ml-md ellipsis-2-lines">{{parameters.GetonAddress}}</div>
</div>
<div class="row q-pb-xs no-wrap" v-if="parameters.GetoffAddress">
<div style="width: 80px">下車點:</div>
<div class="q-ml-md ellipsis-2-lines">{{parameters.GetoffAddress}}</div>
</div>
<div class="row">
<div style="width: 80px">
接駁日期:</div>
<div class="q-ml-md">
{{parameters.OrderDate}}
</div>
</div>
</div>
<q-separator color="grey-2" class="q-my-md"/> -->
<div class="text-grey-9">
<!-- <div class="row q-mb-sm" v-if="chosenObj.Count>0&&CarObj">
<div class="col">{{CarObj.CarName}} x {{ chosenObj.Count }}</div>
<div>{{details.CurrencyCode}} {{ moneyFormat(OrderDate.originalB2CPrice,2) }}</div>
</div> -->
<hr
style="border: none; border-top: 1px dashed #eee !important"
class="bg-transparent q-mb-sm"
/>
<div class="row q-mb-sm items-center">
<div class="col">總金額</div>
<div class="text-subtitle2 text-weight-bolder text-primary">
CNY {{ moneyFormat(sumPrice, 2) }}
</div>
</div>
<hr style="border:none;border-top:1px dashed #EEE !important;" class="bg-transparent q-mb-sm" />
<div class="row q-mb-sm items-center">
<div class="col">優惠金額</div>
<div
class="text-subtitle2 text-weight-bolder text-teal"
v-if="DiscountsMoney > 0"
>
CNY - {{ moneyFormat(DiscountsMoney, 2) }}
</div>
<div class="text-grey-5" v-else>暫無優惠</div>
</div>
<hr style="border:none;border-top:1px dashed #EEE !important;" class="bg-transparent q-mb-sm" />
<div class="row q-mb-sm items-center">
<div class="col">支付金額</div>
<div class="text-h6 text-weight-bolder text-primary product-price">{{details.CurrencyCode}} {{ moneyFormat(Money,2) }}</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
props: {
orderInfo: {
type: Object,
default: () => ({})
}
},
data() {
return {
details: null,
sumPrice: 0,//总金额
DiscountsMoney: 0,//优惠金额
Money: 0, // 支付金額
}
},
mounted() {
this.getCarData()
this.getCarOrder()
},
methods: {
// 获取团的详情
getGroupData() {
// this.$q.loading.show();
this.apipost(
"b2c_get_GetCarSingleProductDetail",
{ ProductId: this.orderInfo.GoodsId },
(r) => {
if (r.data.resultCode == 1) {
this.dataList = r.data.data;
this.emitAddress()
} else {
this.$q.notify({
type: "negative",
message: r.data.message,
position: "top",
timeout: 2000, // 以毫秒为单位; 0意味着没有超时
});
}
// this.$q.loading.hide();
},
null
);
},
// 获取车的详情
getCarData() {
// this.$q.loading.show();
this.apipost(
"b2c_get_GetCarSingleProductDetail",
{ ProductId: this.orderInfo.GoodsId },
(r) => {
if (r.data.resultCode == 1) {
this.dataList = r.data.data;
this.details = r.data.data;
} else {
this.$q.notify({
type: "negative",
message: r.data.message,
position: "top",
timeout: 2000, // 以毫秒为单位; 0意味着没有超时
});
}
// this.$q.loading.hide();
},
null
);
},
getCarOrder() {
this.$q.loading.show();
this.apipost(
"CarSingle_post_GetTYMyCarOrderInfo",
{ OrderId: this.orderInfo.ErpOrderId },
(r) => {
if (r.data.resultCode == 1) {
this.dataList = r.data.data;
this.Money = r.data.data.Money;
} else {
this.$q.notify({
type: "negative",
message: r.data.message,
position: "top",
timeout: 2000, // 以毫秒为单位; 0意味着没有超时
});
}
this.$q.loading.hide();
},
null
);
},
emitAddress() {
const {PlaceList} = this.dataList
PlaceList.findItem(item => item.id === this.id)
this.$emit('address', this.dataList)
}
}
}
</script>
\ No newline at end of file
......@@ -5,14 +5,14 @@
<div class="q-mt-lg row">
<div class="col">
<div class="row items-center">
<q-icon name="iconfont icontishi" size="32px" color="warning" />
<div class="q-ml-md text-h6 text-orange text-weight-bold">待支付</div>
<q-icon name="iconfont iconsuccess" :class="`${orderIcon}`" size="32px" :color="`${iconColor}`" />
<div class="q-ml-md text-h6 text-weight-bold" :class="`text-${iconColor}`">{{["","待付款","已付款", "已完成", "已取消"][detail.OrderStatus]}}</div>
</div>
<div class="q-mt-md f12 text-grey-6">請在您下單成功後30分鐘內完成支付,否則訂單會被系統自動取消</div>
</div>
<div class="">
<div class="f12 text-grey-6">訂單編號:#D2022325159852</div>
<div class="f12 text-grey-6 q-mt-md">下單日期:2023年3月14日 19:02</div>
<div class="f12 text-grey-6">訂單編號:#{{detail.OrderNo}}</div>
<div class="f12 text-grey-6 q-mt-md">下單日期:{{detail.CreateTime}}</div>
</div>
</div>
<q-separator color="grey-2" class="q-my-md" />
......@@ -20,9 +20,13 @@
<div class="text-subtitle1 col">
<span>應付金額:</span>
<span class="text-subtitle2">CNY</span>
<span class="q-ml-sm text-weight-bolder">{{ moneyFormat('3580.00',2) }}</span>
<span class="q-ml-sm text-weight-bolder">{{ moneyFormat(detail.TotalPrice,2) }}</span>
</div>
<div class="">
<q-btn color="primary" outline dense class="q-mr-md q-px-md">
<i class="iconfont iconmessage1"></i>联系客服</q-btn>
<q-btn color="primary" outline dense class="q-mr-md q-px-md">
<i class="iconfont iconiconfontscan"></i>扫码咨询</q-btn>
<q-btn color="primary" outline dense label="取消訂單" class="q-mr-md q-px-md"/>
<q-btn color="primary" unelevated dense label="前往付款" class="q-px-md"/>
</div>
......@@ -33,19 +37,19 @@
<div class="text-subtitle1 text-weight-bolder">商品訊息</div>
<div class="row q-mt-md">
<q-img
src="http://imgfile.oytour.com/Upload/DMC/202302280651141800000000003.jpg"
:src="detail.GoodsPic"
class="rounded-borders q-mr-md"
spinner-color="grey-2"
style="width: 150px"
/>
<div class="col">
<div class="text-body1 ellipsis">忠清北道私人包車一日遊|玉笋峰悬索桥 & 单轨列车登飞凤山(滑翔伞) & 朴达岭 & 国弓体验</div>
<div class="text-body1 ellipsis">{{detail.GoodsName}}</div>
<div class="q-mt-sm text-grey-6">2023-03-15從成都出發 成人x2; </div>
<div class="q-mt-sm text-dark">
出行日期:2023年3月30日(本地时间)
出行日期:{{detail.SelectStartTime}}(本地时间)
</div>
<div class="q-mt-sm text-grey-6">
商品類型:包車
商品類型:{{detail.GoodsType}}
</div>
</div>
</div>
......@@ -57,19 +61,19 @@
<div class="row q-col-gutter-md q-mt-md">
<div class="col-6">
<div class="f12 text-grey-6">姓氏</div>
<div class="q-mt-sm text-body1"></div>
<div class="q-mt-sm text-body1">{{detail.SurName}}</div>
</div>
<div class="col-6">
<div class="f12 text-grey-6">名字</div>
<div class="q-mt-sm text-body1"></div>
<div class="q-mt-sm text-body1">{{detail.Name}}</div>
</div>
<div class="col-6">
<div class="f12 text-grey-6">手機號碼</div>
<div class="q-mt-sm text-body1">86-17308037817</div>
<div class="q-mt-sm text-body1">{{detail.ContactNumber}}</div>
</div>
<div class="col-6">
<div class="f12 text-grey-6">邮箱 (用于接收订单确认邮件)</div>
<div class="q-mt-sm text-body1">alex9012@vip.qq.com</div>
<div class="q-mt-sm text-body1">{{detail.Mailbox}}</div>
</div>
</div>
<div>
......@@ -81,13 +85,85 @@
</div>
</q-card>
<q-card class="rounded-borders q-pa-md q-mt-md" flat>
<div class="text-subtitle1 text-weight-bolder">使用地点</div>
<div class="q-pa-md" :class="{
'q-mx-md': $q.screen.width < 1220 && $q.platform.is.mobile,
}">
<componentsMap :AddressObj="detail"/>
</div>
<carPriceDetail v-if="detail.OrderNo" :orderInfo="detail"></carPriceDetail>
</q-card>
<div v-if="(!orderNo || orderNo == '') && !loading" class="text-center q-my-xl">
<none-data
iconType="order"
title="沒有找到您的訂單信息哦"
subtitle="趕緊去挑選心儀的旅遊產品吧,三秒後自動跳轉到首頁"
></none-data>
</div>
</div>
</template>
<script>
import componentsMap from "../../../components/car/Map.vue";
import carPriceDetail from './carPriceDetail.vue'
export default {
components: {componentsMap, carPriceDetail},
data() {
return {
detail: {},
orderIcon: '',
iconColor: '',
orderNo: '',
loading: true,
}
},
created() {},
mounted() {
const {orderNo} = this.$route.params
if(orderNo) {
this.getOrderDetail(orderNo)
} else {
this.goHomeHandler()
}
},
methods: {
goHomeHandler(){
this.loading=false
setTimeout(() => {
location.href = location.origin;
}, 3000);
},
getOrderDetail(orderNo) {
this.apipost(
"GetDetailsByOrderNo_post",
{OrderNo: orderNo
},
(res) => {
if (res.data.resultCode == 1) {
this.detail = res.data.data
this.orderIcon = ["","icontime1","iconsuccess", "iconsuccess", "icontishi"][this.detail.OrderStatus]
this.iconColor = ["","blue","blue", "green", "grey"][this.detail.OrderStatus]
console.log('get detail', this.orderIcon, this.iconColor)
this.orderNo=OrderNo
this.orderInfo=r.data.data
this.loading=false
} else {
// this.$notify(res.data.message);
this.$q.notify({
type: "negative",
message: res.data.message,
position: "top",
timeout: 2000, // 以毫秒为单位; 0意味着没有超时
});
}
},
null
);
},
}
}
</script>
......
......@@ -108,7 +108,7 @@
><img class="q-mr-sm" style="width: 28px;" src="../../assets/img/address-add.png" />添加郵寄地址</q-btn>
</div>
</div>
<q-dialog content-style="width: 900px" v-model="isShowDialog">
<q-dialog v-model="isShowDialog">
<div class="bg-white dialog-box" style="width: 800px; padding: 20px">
<div class="f22 bold">{{form.Id ? '编辑': '添加'}}邮寄地址</div>
<form @submit.prevent.stop="submit" class="q-gutter-md">
......
......@@ -138,8 +138,8 @@
/>
</div>
<q-dialog content-style="width: 900px" v-model="isShowDialog">
<div class="bg-white dialog-box" style="width: 800px; padding: 20px">
<q-dialog v-model="isShowDialog">
<div class="bg-white dialog-box" style="padding: 20px">
<div class="f22 bold">{{ form.Id ? "编辑" : "新增" }}出行人信息</div>
<form @submit.prevent.stop="submit" class="q-gutter-md">
<div>
......
......@@ -195,7 +195,7 @@ const routes = [{
import ('pages/pay/paysuccess.vue')
},
{
path: '/orderinfo/:orderno', //訂單詳情
path: '/orderinfo/:orderNo', //訂單詳情
meta: { title: '訂單詳情', isUserCenter: false, needLogin: true, },
component: () =>
import ('pages/usercenter/order/orderDetail.vue')
......
......@@ -2,7 +2,6 @@ const EnumHelper = {
ParseToEnum(TEnum, value, comparison = '') {
if (Object.isFrozen) {
let t = Object.values(TEnum)
console.log(t, Symbol(1) == 1)
let r = t.find(x => (comparison != '' && x[comparison] == value) || (comparison == '' && x == value))
return r
} else {
......
......@@ -2,23 +2,33 @@ const ListProductTypeEnum = Object.freeze({
TRIP: {
value: 1,
desc: '線路旅遊'
desc: '線路旅遊',
bgColor: 'bg-pink-2',
color: 'text-pink'
},
SCENIC: {
value: 2,
desc: '景點門票'
desc: '景點門票',
bgColor: 'bg-purple-2',
color: 'text-purple'
},
HOTEL: {
value: 3,
desc: '酒店住宿'
desc: '酒店住宿',
bgColor: 'bg-indigo-2',
color: 'text-indigo'
},
CAR: {
value: 4,
desc: '目的地用車'
desc: '目的地用車',
bgColor: 'bg-teal-2',
color: 'text-teal'
},
JALAN: {
value: 5,
desc: '酒店住宿'
desc: '酒店住宿',
bgColor: 'bg-indigo-2',
color: 'text-indigo'
},
})
......
const OrderStatusEnum = Object.freeze({
UN_PAY: {
value: 1,
desc: '待付款',
icon: 'iconfont icontime1',
color: 'text-orange'
},
PAYED: {
value: 2,
desc: '待出行',
icon: 'iconfont iconflag',
color: 'text-green'
},
FINISH: {
value: 3,
desc: '已完成',
icon: 'iconfont iconsuccess',
color: 'text-dark'
},
CANCEL: {
value: 4,
desc: '已取消',
icon: 'iconfont iconminus',
color: 'text-grey-6'
}
})
export default OrderStatusEnum
\ No newline at end of file
import EnumHelper from "./enumhelper"
import ListProductTypeEnum from "./listProductType"
const ProductTypeEnum = Object.freeze({
/**
* 一日游
......@@ -112,4 +115,29 @@ const ProductTypeEnum = Object.freeze({
})
export default ProductTypeEnum
\ No newline at end of file
const mappingRules = [
[-1],
[1, 2, 3],
[4, 5, 6, 7],
[-1],
[12, 13, 14],
[8, 9, 10, 11]
]
const mappingListType = (value) => {
let val = mappingRules.findIndex(x => {
return x.indexOf(value) != -1
})
if (val && val > 0) {
return EnumHelper.ParseToEnum(ListProductTypeEnum, val, 'value')
}
return {}
}
const transProductEnum = (value) => {
return mappingRules[value]
}
export default ProductTypeEnum
export { mappingListType, transProductEnum }
\ No newline at end of file
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