Skip to content

B
bigwood
Commit 969c488d authored by youjie's avatar youjie
Browse files
Options

no message

parent 793a9231
Hide whitespace changes
Inline Side-by-side
Showing with 159 additions and 66 deletions
src/i18n/zh-TW/index.ts
View file @ 969c488d
......@@ -702,7 +702,51 @@ export default {
renmingbi: '人民币',
youhui: '优惠',
shifu: '实付',
yudinxinx: '预定信息'
yudinxinx: '预定信息',
fangxingxinxi: '房型信息',
ruzhurenshu: '入住人数',
chengren: '成人',
ertong: '儿童',
noertong: '不能报儿童',
ren: '人',
ruzhuriqi: '入住日期',
ruzhushijian: '入住时间',
week1: '周一',
week2: '周二',
week3: '周三',
week4: '周四',
week5: '周五',
week6: '周六',
week7: '星期天',
zhiqian: '之前',
zhihou: '之后',
fangjianshuliang: '房间数量',
jinsheng: '仅剩',
jian: '间',
fangfeiqingkuang: '房间情况',
wan: '晚',
ruzhuxinxi: '入住信息',
ruzhuxinxi1: '所填姓名需和入住时所持证件一致',
ruzhushijian1: '入住时间',
yudinren: '预定人',
xin: '姓',
ming: '名',
dangqiandizhi: '当前地址',
Email: 'Email',
dianhua: '电话',
kehuxuqiu: '客户需求',
fangjian: '房间',
chengrennan: '成人男',
chengrennv: '成人女',
ertongshu: '儿童数',
quxiao1: '没有通知取消',
quxiao2: '入住当日取消',
shouxufei: '手续费',
youhuixingxi: '优惠信息',
duihuan: '兑换',
youhuiquanshiyong: '优惠券使用',
nokeyongyouhuiquan: '暂无可用优惠券',
xiadan: '下单',
}
}
......
src/pages/scattered/HotelSure.vue
View file @ 969c488d
......@@ -77,84 +77,96 @@
</div>
<div class="q-pa-lg column">
<div class="row items-center q-mb-md">
<span class="text-grey-6">房型信息</span>
<span class="text-grey-6">{{$t('v101.scatteredOrder.fangxingxinxi')}}</span>
<div class="q-pl-lg">
<span class="q-pr-lg"></span>
<span class="q-pr-lg">
{{roomRateDetails?getGradeType(roomRateDetails.gradeType):''}}{{roomRateDetails?getRoomType(roomRateDetails.roomType):''}}
</span>
</div>
</div>
<div class="row items-center q-mb-md">
<span class="text-grey-6">入住人数</span>
<div class="q-pl-lg"></div>
<span class="text-grey-6">{{$t('v101.scatteredOrder.ruzhurenshu')}}</span>
<div class="q-pl-lg">
<span>{{$t('v101.scatteredOrder.chengren')}} {{auditNum}} {{$t('v101.scatteredOrder.ren')}}</span>
<span class="q-pl-lg">{{$t('v101.scatteredOrder.ertong')}} {{childNum}} {{$t('v101.scatteredOrder.ren')}}</span>
<span class="q-pl-lg" v-if="isBaoChild">{{$t('v101.scatteredOrder.noertong')}}</span>
</div>
</div>
<div class="row items-center q-mb-md">
<span class="text-grey-6">入住日期</span>
<span class="text-grey-6">{{$t('v101.scatteredOrder.ruzhuriqi')}}</span>
<div class="q-pl-lg row">
<div class="row items-center">
<q-field v-if="$q.platform.is.desktop" stack-label label="入住时间" standout class="col-2" style="min-width: 200px" dense>
<q-field v-if="$q.platform.is.desktop" stack-label :label="$t('v101.scatteredOrder.ruzhushijian')" standout class="col-2" style="min-width: 200px" dense>
<div class="self-center full-width no-outline" tabindex="0">
{{dateRange}}
{{params.arrivalDate}}
</div>
<q-popup-proxy :offset="[0, 10]" ref="qDateProxy">
<q-date v-model="dateRange" mask="YYYY/MM/DD" :options="optionsFn" @range-end="dateRangeHandler"></q-date>
<q-date v-model="params.arrivalDate" mask="YYYY/MM/DD" :options="optionsFn" @range-end="dateRangeHandler"></q-date>
</q-popup-proxy>
</q-field>
<span class="q-ml-md">周六</span>
<div class="q-ml-sm text-grey-6">
<span>16:00</span>
<span class="q-ml-sm">之后</span>
<span v-if="roomRateDetails.roomOptions&&roomRateDetails.roomOptions.checkIinStartTime">{{roomRateDetails.roomOptions.checkIinStartTime}}</span>
<span class="q-ml-sm">{{$t('v101.scatteredOrder.zhihou')}}</span>
</div>
</div>
<div class="row items-center q-px-md"><q-separator class=" q-px-sm bg-dark"/></div>
<div class="row items-center">
<q-field v-if="$q.platform.is.desktop" stack-label label="入住时间" standout class="col-2" style="min-width: 200px" dense>
<q-field v-if="$q.platform.is.desktop" stack-label :label="$t('v101.scatteredOrder.ruzhushijian')" standout class="col-2" style="min-width: 200px" dense>
<div class="self-center full-width no-outline" tabindex="0">
{{dateRange}}
{{params.departureDate}}
</div>
<q-popup-proxy :offset="[0, 10]" ref="qDateProxy">
<q-date v-model="dateRange" mask="YYYY/MM/DD" :options="optionsFn" @range-end="dateRangeHandler"></q-date>
<q-popup-proxy :offset="[0, 10]" ref="qDateProxy2">
<q-date v-model="params.departureDate" mask="YYYY/MM/DD" :options="optionsFn" @range-end="dateRangeHandler2"></q-date>
</q-popup-proxy>
</q-field>
<span class="q-ml-md">周六</span>
<div class="q-ml-sm text-grey-6">
<span>18:00</span>
<span class="q-ml-sm">之前</span>
<span v-if="roomRateDetails.roomOptions&&roomRateDetails.roomOptions.finalCheckInTime">{{roomRateDetails.roomOptions.finalCheckInTime}}</span>
<span class="q-ml-sm">{{$t('v101.scatteredOrder.zhiqian')}}</span>
</div>
</div>
</div>
</div>
<div class="row items-center q-mb-md">
<span class="text-grey-6">房间数量</span>
<span class="text-grey-6">{{$t('v101.scatteredOrder.fangjianshuliang')}}</span>
<div class="q-pl-lg row items-center">
<span>1</span>
<span v-if="dataList.roomGroup">{{dataList.roomGroup.length}}</span>
<div class="relative-position q-ml-md">
<q-icon class="absolute text-orange-6" style="left: 0;top: 1px;width: inherit;" name="information" size="18px"></q-icon>
<span class="q-pl-lg">仅剩3间</span>
<span class="q-pl-lg">
{{$t('v101.scatteredOrder.jinsheng')}}
<span class="text-orange">{{dataList.currentAllotment}}</span>
{{$t('v101.scatteredOrder.jian')}}
</span>
</div>
</div>
</div>
<div class="row items-center">
<span class="text-grey-6">房间情况</span>
<span class="text-grey-6">{{$t('v101.scatteredOrder.fangfeiqingkuang')}}</span>
<div class="q-pl-lg row">
<q-card flatv class="row items-end q-px-md q-pb-sm q-mr-md">
<div class="text-grey-9">12/24/2022</div>
<div class="q-ml-lg row items-end">
<span>円</span>
<span class="text-red text-weight-bold fz18 q-px-xs">
<span class="relative-position" style="top:3px">2345</span>
</span>
<span class="text-grey-6">/晚</span>
</div>
</q-card>
<template v-for="(item,index) in dataList.roomGroup">
<q-card flatv class="row items-end q-px-md q-pb-sm q-mr-md" v-for="subItem in item.rateGroup">
<div class="text-grey-9">{{subItem.stayDate}}</div>
<div class="q-ml-lg row items-end">
<span>円</span>
<span class="text-red text-weight-bold fz18 q-px-xs">
<span class="relative-position" style="top:3px">{{subItem.perAdultRateBySetCurrency?subItem.perAdultRateBySetCurrency:subItem.totalPerRoomRateBySetCurrency}}</span>
</span>
<span class="text-grey-6">/{{subItem.totalPerRoomRateBySetCurrency?$t('v101.scatteredOrder.wan'):$t('v101.scatteredOrder.ren')}}</span>
</div>
</q-card>
</template>
</div>
</div>
</div>
</div>
<div class="col column bg-white rounded-border q-mb-md">
<div class="bg-light-blue-1 q-py-md q-px-lg fz14 rounded-borders row items-center justify-between">
<span class="text-weight-bold">入住信息</span>
<span class="text-weight-bold">{{$t('v101.scatteredOrder.ruzhuxinxi')}}</span>
<span class="relative-position text-orange-6">
<q-icon class="absolute text-orange-6" style="left: 0;top: 1px;width: inherit;" name="information" size="18px"></q-icon>
<span class="q-pl-lg">所填姓名需和入住时所持证件一致</span>
<span class="q-pl-lg">{{$t('v101.scatteredOrder.ruzhuxinxi1')}}</span>
</span>
</div>
<div class="q-px-lg q-py-lg">
......@@ -165,13 +177,13 @@
class="row wrap"
>
<div class="col-6 row">
<span class="q-px-lg HotelSure-text"><span class="text-red">*</span> 入住时间</span>
<span class="q-px-lg HotelSure-text"><span class="text-red">*</span> {{$t('v101.scatteredOrder.ruzhushijian1')}}</span>
<q-input
class="col"
dense
size="xs"
filled
v-model="name"
v-model="sureMsg.checkInTime"
label="Your name"
hint=""
lazy-rules
......@@ -179,15 +191,15 @@
/>
</div>
<div class="col-6 row">
<span class="q-px-lg HotelSure-text"><span class="text-red">*</span> 预定人</span>
<span class="q-px-lg HotelSure-text"><span class="text-red">*</span> {{$t('v101.scatteredOrder.yudinren')}}</span>
<div class="col row justify-between">
<div class="col-6">
<q-input
dense
size="xs"
filled
v-model="name"
label="姓"
v-model="sureMsg.guestLastName"
:label="$t('v101.scatteredOrder.xin')"
hint=""
lazy-rules
:rules="[ val => val && val.length > 0 || 'Please type something']"
......@@ -199,8 +211,8 @@
dense
size="xs"
filled
v-model="name"
label="名"
v-model="sureMsg.guestFirstName"
:label="$t('v101.scatteredOrder.ming')"
hint=""
lazy-rules
:rules="[ val => val && val.length > 0 || 'Please type something']"
......@@ -211,13 +223,13 @@
</div>
<div class="col-6 row">
<span class="q-px-lg HotelSure-text"><span class="text-red">*</span> 当前地址</span>
<span class="q-px-lg HotelSure-text"><span class="text-red">*</span> {{$t('v101.scatteredOrder.dangqiandizhi')}}</span>
<q-input
class="col"
dense
size="xs"
filled
v-model="name"
v-model="sureMsg.guestAddress"
label="Your name"
hint=""
lazy-rules
......@@ -225,13 +237,13 @@
/>
</div>
<div class="col-6 row">
<span class="q-px-lg HotelSure-text"><span class="text-red">*</span> Email</span>
<span class="q-px-lg HotelSure-text"><span class="text-red">*</span> {{$t('v101.scatteredOrder.Email')}}</span>
<q-input
class="col"
dense
size="xs"
filled
v-model="name"
v-model="sureMsg.guestEmail"
label="Your name"
hint=""
lazy-rules
......@@ -239,13 +251,13 @@
/>
</div>
<div class="col-6 row">
<span class="q-px-lg HotelSure-text"><span class="text-red">*</span> 电话</span>
<span class="q-px-lg HotelSure-text"><span class="text-red">*</span> {{$t('v101.scatteredOrder.dianhua')}}</span>
<q-input
class="col"
dense
size="xs"
filled
v-model="name"
v-model="sureMsg.guestPhoneNumber"
label="Your name"
hint=""
lazy-rules
......@@ -254,7 +266,7 @@
</div>
<div class="col-12 row">
<div class="col-6 row">
<span class="q-px-lg HotelSure-text"><span class="text-red"></span> 客户需求</span>
<span class="q-px-lg HotelSure-text"><span class="text-red"></span> {{$t('v101.scatteredOrder.kehuxuqiu')}}</span>
<q-input
class="col"
dense
......@@ -262,7 +274,7 @@
filled
autogrow
type="textarea"
v-model="name"
v-model="sureMsg.guestRequest"
label="Your name"
hint=""
lazy-rules
......@@ -270,27 +282,46 @@
</div>
</div>
<div class="col-12 row">
<div class="col-6 row q-mb-md" v-for="item in 1">
<span class="q-px-lg HotelSure-text"><span class="text-red"></span> 房间1</span>
<div class="col-6 row q-mb-md" v-for="item in sureMsg.roomGroup">
<span class="q-px-lg HotelSure-text"><span class="text-red"></span>
{{$t('v101.scatteredOrder.fangjian')}}
{{item.roomCount}}
</span>
<div class="col row">
<div class="col-4 row">
<span class="q-mx-md">成人男</span>
<q-select class="col" v-model="numberOfAdults" dense :options="adultList" emit-value map-options :label="$t('v101.scattered.chengren')" standout @update:model-value="setPeopleNum"/>
<span class="q-mx-md">{{$t('v101.scatteredOrder.chengrennan')}}</span>
<q-select class="col" v-model="item.roomMaleCount" dense :options="adultList" emit-value map-options :label="$t('v101.scattered.chengren')" standout @update:model-value="setPeopleNum"/>
</div>
<div class="col-4 row">
<span class="q-mx-md">成人女</span>
<q-select class="col" v-model="numberOfAdults" dense :options="adultList" emit-value map-options :label="$t('v101.scattered.chengren')" standout @update:model-value="setPeopleNum"/>
<span class="q-mx-md">{{$t('v101.scatteredOrder.chengrennv')}}</span>
<q-select class="col" v-model="item.roomFemaleCount" dense :options="adultList" emit-value map-options :label="$t('v101.scattered.chengren')" standout @update:model-value="setPeopleNum"/>
</div>
<div class="col-4 row">
<span class="q-mx-md">儿童数</span>
<q-select class="col" v-model="numberOfChildren" dense :options="childrenList" emit-value map-options :label="$t('v101.scattered.ertong')" standout @update:model-value="setPeopleNum"/>
<span class="q-mx-md">{{$t('v101.scatteredOrder.ertongshu')}}</span>
<q-select class="col" v-model="item.roomChildCount" dense :options="childrenList" emit-value map-options :label="$t('v101.scattered.ertong')" standout @update:model-value="setPeopleNum"/>
</div>
</div>
</div>
</div>
<div class="column text-red q-pl-lg">
<span>没有通知取消，手续费：100%</span>
<span>入住当日取消，手续费：100%</span>
<template v-if="(dataList.cancellationPeriod1==-1||dataList.cancellationPeriod1==0)&&(dataList.cancellationType1==1||dataList.cancellationType1==2)">
<template v-if="dataList.cancellationPeriod1==-1">{{$t('v101.scatteredOrder.quxiao1')}},</template>
<template v-if="dataList.cancellationPeriod1==0">{{$t('v101.scatteredOrder.quxiao2')}},</template>
<template v-if="dataList.cancellationType1==1">{{$t('v101.scatteredOrder.shouxufei')}}: {{dataList.cancellation1}}%</template>
<template v-if="dataList.cancellationType1==2">{{$t('v101.scatteredOrder.shouxufei')}}: {{dataList.cancellation1}}</template>
</template>
<template v-if="(dataList.cancellationPeriod2==-1||dataList.cancellationPeriod2==0)&&(dataList.cancellationType2==1||dataList.cancellationType2==2)">
<template v-if="dataList.cancellationPeriod2==-1">{{$t('v101.scatteredOrder.quxiao1')}},</template>
<template v-if="dataList.cancellationPeriod2==0">{{$t('v101.scatteredOrder.quxiao2')}},</template>
<template v-if="dataList.cancellationType2==1">{{$t('v101.scatteredOrder.shouxufei')}}: {{dataList.cancellation2}}%</template>
<template v-if="dataList.cancellationType2==2">{{$t('v101.scatteredOrder.shouxufei')}}: {{dataList.cancellation2}}</template>
</template>
<template v-if="(dataList.cancellationPeriod3==-1||dataList.cancellationPeriod3==0)&&(dataList.cancellationType3==1||dataList.cancellationType3==2)">
<template v-if="dataList.cancellationPeriod3==-1">{{$t('v101.scatteredOrder.quxiao1')}},</template>
<template v-if="dataList.cancellationPeriod3==0">{{$t('v101.scatteredOrder.quxiao2')}},</template>
<template v-if="dataList.cancellationType3==1">{{$t('v101.scatteredOrder.shouxufei')}}: {{dataList.cancellation3}}%</template>
<template v-if="dataList.cancellationType3==2">{{$t('v101.scatteredOrder.shouxufei')}}: {{dataList.cancellation3}}</template>
</template>
</div>
</q-form>
......@@ -298,7 +329,7 @@
</div>
<div class="col column bg-white rounded-border q-mb-md">
<div class="bg-light-blue-1 q-py-md q-px-lg fz14 rounded-borders row items-center justify-between">
<span class="text-weight-bold">优惠信息 </span>
<span class="text-weight-bold">{{$t('v101.scatteredOrder.youhuixingxi')}} </span>
</div>
<div class="q-px-lg q-py-lg">
<div class="row">
......@@ -313,16 +344,16 @@
lazy-rules
/>
</div>
<div class="q-ml-lg"><q-btn class="q-px-lg q-py-sm" color="primary" dense unelevated label="兑换"/></div>
<div class="q-ml-lg"><q-btn class="q-px-lg q-py-sm" color="primary" dense unelevated :label="$t('v101.scatteredOrder.duihuan')"/></div>
</div>
<div class="column">
<span class="fz16 text-weight-bold q-pb-md">优惠券使用</span>
<span>暂无可用优惠券</span>
<span class="fz16 text-weight-bold q-pb-md">{{$t('v101.scatteredOrder.youhuiquanshiyong')}}</span>
<span>{{$t('v101.scatteredOrder.nokeyongyouhuiquan')}}</span>
</div>
</div>
</div>
<div class="col row q-mb-md">
<q-btn class="col-12 bg-blue rounded-border text-white q-py-sm" label="下单" :loading="submLoading" @click="submitForm"/>
<q-btn class="col-12 bg-blue rounded-border text-white q-py-sm" :label="$t('v101.scatteredOrder.xiadan')" :loading="submLoading" @click="submitForm"/>
</div>
......@@ -358,6 +389,7 @@
setup(props, context) {
const { t } = useI18n()
const qDateProxy = ref(null) as any
const qDateProxy2 = ref(null) as any
// const HotelLength = inject(DirtionmaryHelper.HOTEL_CAR_ORDER_LENGTH) as any
const data = reactive({
params:{
......@@ -378,6 +410,7 @@
submLoading: false,
loading: false,
dateRange: '' as any,//当前日期
dateRange2: '' as any,//当前日期
dateRangeFormat: '',//可选日期
roomRateDetails: {} as any,
dataList: {} as any,
......@@ -438,7 +471,8 @@
data.params.searchroomGroup = data.getParamsMsg.searchroomGroup
data.params.imgUrl = data.getParamsMsg.imgUrl
data.urlParamsMsg = currentRouter.currentRoute.value.params
data.dateRange = date.formatDate(date.addToDate(new Date(), { days: 9 }), 'YYYY/MM/DD')
// data.dateRange = date.formatDate(date.addToDate(new Date(), { days: 9 }), 'YYYY/MM/DD')
// data.dateRange = date.formatDate(date.addToDate(new Date(), { days: 9 }), 'YYYY/MM/DD')
data.RoomTypeList = useHotel.getHotelRoomType()
data.scatteredRoomTypeList = useHotel.getHotelScatRoom()
// data.dateRange.from = date.formatDate(date.addToDate(new Date(), { days: 8 }), 'YYYY/MM/DD')
......@@ -478,6 +512,11 @@
},
dateRangeHandler(e: any) {
if (qDateProxy.value) qDateProxy.value.hide()
methods.initHotel()
},
dateRangeHandler2(e: any) {
if (qDateProxy2.value) qDateProxy2.value.hide()
methods.initHotel()
},
//获取房间等级
getRoomType(type) {
......@@ -546,7 +585,9 @@
if (r.data.resultCode == ApiResult.SUCCESS) {
data.dataList = r.data.data;
data.roomRateDetails = r.data.data.roomRateDetails
console.log(data.roomRateDetails,'---1111')
data.roomRateDetails.roomOptions.checkIinStartTime = data.roomRateDetails.roomOptions['check-inStartTime']
data.roomRateDetails.roomOptions.finalCheckInTime = data.roomRateDetails.roomOptions['finalCheck-inTime']
console.log(data.roomRateDetails.roomOptions.finalCheckInTime,'---1111')
if(Object.prototype.toString.call(data.dataList.roomGroup) == '[object Object]'){
let arr = [];
arr.push(data.dataList.roomGroup);
......@@ -665,7 +706,7 @@
methods.initHotel()
})
return { ...toRefs(data), ...methods,qDateProxy }
return { ...toRefs(data), ...methods,qDateProxy,qDateProxy2 }
}
})
</script>
......
src/utils/hotelRate.ts
View file @ 969c488d
......@@ -143,6 +143,14 @@ const useHotel={
}
return rates
},
// 散客下单周一至周天
getHotelWeek():HotelArea[]{
let rates=[] as HotelArea[]
for(let i=1;i<8;i++){
rates.push({name:t(`v101.scatteredOrder.week${i}`)})
}
return rates
},
}
export {useHotel,
type HotelRate,
......
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