Mauve
1648 lines
55 KiB
Vue
1648 lines
55 KiB
Vue
<template>
|
||
<view>
|
||
<view class="hz-page">
|
||
<u-navbar :safeAreaInsetTop="true" :placeholder="true" :title="title" :fixed="true" :autoBack="true"
|
||
leftIconColor="#000000" titleStyle="font-weight:bold;">
|
||
<view style="margin-top:2px;margin-right:3px;" slot="right">
|
||
<view style="border:1rpx solid #ccc;border-radius: 14px;padding:4px 12px;"
|
||
class="hz-flex-row hz-flex-vertical-mid">
|
||
<image @click="navTo('/pages/findPlayer/findPlayer',1,false)"
|
||
src="../../static/images/ico_find_player.png" class="hz-nav-btn"></image>
|
||
<view style="height:20px;border-left:1px solid #ccc;margin-left:8px;margin-right:8px;"></view>
|
||
<image @click="navTo('/booking/bookingRecord/bookingRecord?from=booking',0,false)"
|
||
src="../../static/images/ico_list.png" class="hz-nav-btn"></image>
|
||
</view>
|
||
</view>
|
||
</u-navbar>
|
||
<view class="hz-spacing hz-bg-white" style="margin-top:8px;">
|
||
<view class="hz-card-profile hz-mr-b-30">
|
||
<view class="hz-flex-row">
|
||
<view style="width:60%">
|
||
<view class="hz-font-color-light hz-font-sm">{{$t("common.playerId")}}</view>
|
||
<view class="hz-font-bolder hz-font-lg">{{ playerData.playerId }}</view>
|
||
</view>
|
||
<view style="width:40%">
|
||
<view class="hz-font-color-light hz-font-sm">{{$t("common.tier")}}</view>
|
||
<view class="hz-font-bolder hz-font-lg">{{ playerData.tierName }}</view>
|
||
</view>
|
||
</view>
|
||
<view class="hz-flex-row hz-mr-t-30">
|
||
<view style="width:100%">
|
||
<view class="hz-font-color-light hz-font-sm">{{$t("common.name")}}</view>
|
||
<view class="hz-font-bolder hz-font-lg">{{playerData.salutation + " " + playerData.name }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view style="margin-top:20px;">
|
||
<view class="hz-spacing hz-font-lg hz-font-bold">{{$t("common.bookingType")}}<span class="mandatory">*</span></view>
|
||
<view class="hz-split"></view>
|
||
<view class="hz-spacing" style="margin-top:10px;margin-bottom:20px;">
|
||
<u-radio-group v-model="modelBooking.bookingTypeId" placement="row">
|
||
<u-radio activeColor="#C39A4B" labelColor="#333333" customStyle="width:53%;"
|
||
v-for="(item, index) in bookingTypeList" :key="index" :label="item.name" :name="item.id"
|
||
@change="changebookingType"></u-radio>
|
||
</u-radio-group>
|
||
</view>
|
||
<!--<view class="hz-spacing hz-font-lg hz-font-bold">Property</view>
|
||
<view class="hz-split"></view>
|
||
<view class="hz-spacing" style="margin-top:10px;margin-bottom:30px;">
|
||
<u-radio-group
|
||
v-model="modelBooking.propertyId"
|
||
placement="row">
|
||
<u-radio
|
||
activeColor="#C39A4B"
|
||
labelColor="#333333"
|
||
customStyle="width:33%;"
|
||
v-for="(item, index) in propertyList"
|
||
:key="index"
|
||
:label="item.name"
|
||
:name="item.id"
|
||
@change="changeProperty"
|
||
></u-radio>
|
||
</u-radio-group>
|
||
</view>-->
|
||
<view @click="popupMGMProperty" class="hz-btn-light hz-flex-row" style="margin-bottom:10px;">
|
||
<view class="hz-font-lg hz-font-bold" style="width:30%;margin-left:12px;">
|
||
{{$t("common.property")}}<span class="mandatory">*</span>
|
||
</view>
|
||
<view class="hz-flex-row"
|
||
style="width:70%;margin-right:12px;justify-content: flex-end;align-items: center;">
|
||
<view class="hz-font-lg hz-font-color-primary" style="margin-right:8px;">
|
||
{{mapPropertyName(modelBooking.propertyName,modelBooking.otherPropertyName)}}
|
||
</view>
|
||
<view class="hz-circle hz-flex-row hz-flex-vertical-mid">
|
||
<u-icon name="arrow-down" color="#ffffff" size="13"></u-icon>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view @click="popupOtherProperty" v-if="showOtherPropertySelect" class="hz-btn-light hz-flex-row"
|
||
style="margin-bottom:10px;">
|
||
<view class="hz-font-lg hz-font-bold" style="width:50%;margin-left:12px;">
|
||
{{$t("newBooking.otherProperty")}}
|
||
</view>
|
||
<view class="hz-flex-row"
|
||
style="width:50%;margin-right:12px;justify-content: flex-end;align-items: center;">
|
||
<view class="hz-font-lg hz-font-color-primary" style="margin-right:8px;">
|
||
{{modelBooking.otherPropertyName}}
|
||
</view>
|
||
<view class="hz-circle hz-flex-row hz-flex-vertical-mid">
|
||
<u-icon name="arrow-down" color="#ffffff" size="13"></u-icon>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view @click="popupRoom" class="hz-btn-light hz-flex-row" style="margin-bottom:30px;">
|
||
<view class="hz-font-lg hz-font-bold" style="width:40%;margin-left:12px;">
|
||
{{$t("newBooking.roomType")}}<span class="mandatory">*</span>
|
||
</view>
|
||
<view class="hz-flex-row"
|
||
style="width:60%;margin-right:12px;justify-content: flex-end;align-items: center;">
|
||
<view class="hz-font-lg hz-font-color-primary" style="margin-right:8px;">
|
||
{{modelBooking.room}}
|
||
</view>
|
||
<view class="hz-circle hz-flex-row hz-flex-vertical-mid">
|
||
<u-icon name="arrow-down" color="#ffffff" size="13"></u-icon>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!--<view @click="popupRoomType" class="hz-btn-light hz-flex-row" style="margin-bottom:30px;">
|
||
<view class="hz-font-lg hz-font-bold" style="width:50%;margin-left:12px;">{{$t("newBooking.roomType")}}</view>
|
||
<view class="hz-flex-row" style="width:50%;margin-right:12px;justify-content: flex-end;align-items: center;">
|
||
<view class="hz-font-lg hz-font-color-primary" style="margin-right:8px;">
|
||
{{modelBooking.roomTypeCode}}
|
||
</view>
|
||
<view class="hz-circle hz-flex-row hz-flex-vertical-mid">
|
||
<u-icon name="arrow-down" color="#ffffff" size="13"></u-icon>
|
||
</view>
|
||
</view>
|
||
</view>-->
|
||
<view class="hz-spacing hz-font-lg hz-font-bold">{{$t("newBooking.specialPreference")}}</view>
|
||
<view class="hz-split"></view>
|
||
<view class="hz-spacing" style="margin-top:10px;margin-bottom:30px;">
|
||
<u-radio-group v-model="modelBooking.bedTypeId" placement="row" @change="changeBedType"
|
||
style="flex-direction: unset;display: block;">
|
||
<view style="width:51%;display: inline-flex;"
|
||
v-for="(row, index) in sliceList(bedTypeList,2)" :key="index">
|
||
<u-radio activeColor="#C39A4B" labelColor="#333333" shape="circle"
|
||
customStyle="height:30px;width:100%;" v-for="(item,i) in row" :key="i"
|
||
:label="item.bedTypeName" :name="item.masterGroupId"></u-radio>
|
||
</view>
|
||
</u-radio-group>
|
||
<u-checkbox-group v-model="specialCodeList" placement="row" @change="changeSpecial"
|
||
style="flex-direction: unset;display: block;">
|
||
<view style="width:51%;display: inline-flex;"
|
||
v-for="(row, index) in sliceList(specialList,2)" :key="index">
|
||
<u-checkbox activeColor="#C39A4B" labelColor="#333333" shape="circle"
|
||
customStyle="height:30px;width:100%;" v-for="(item,i) in row" :key="item.id || item.code || i"
|
||
:label="item.description" :name="item.code"
|
||
v-show="item.showInBooking==1"></u-checkbox>
|
||
</view>
|
||
</u-checkbox-group>
|
||
<view v-if="specialCodeList.length>0||modelBooking.bedTypeId!=null" class="mandatory"
|
||
style="margin-top: 10px;">{{$t("newBooking.preference")}}</view>
|
||
</view>
|
||
<!-- IM request -->
|
||
<view v-show="showIMRequest">
|
||
<view class="hz-spacing hz-font-lg hz-font-bold">{{$t("newBooking.deposit")}}<span class="mandatory">*</span></view>
|
||
<view class="hz-split"></view>
|
||
<view class="hz-spacing" style="margin-top:10px;margin-bottom:30px;">
|
||
<u-radio-group v-model="modelBooking.depositType" placement="row" @change="changeDeposit"
|
||
style="flex-direction: unset;display: block;">
|
||
<view style="width:51%;display: inline-flex;"
|
||
v-for="(row, index) in sliceList(depositList,2)" :key="index">
|
||
<u-radio activeColor="#C39A4B" labelColor="#333333" shape="circle"
|
||
customStyle="height:30px;width:100%;" v-for="(item,i) in row" :key="i"
|
||
:label="item.name" :name="item.value"></u-radio>
|
||
</view>
|
||
</u-radio-group>
|
||
</view>
|
||
|
||
<view class="hz-spacing hz-font-lg hz-font-bold">{{$t("newBooking.postCharge")}}<span class="mandatory">*</span></view>
|
||
<view class="hz-split"></view>
|
||
<view class="hz-spacing" style="margin-top:10px;margin-bottom:30px;">
|
||
<u-radio-group v-model="modelBooking.isPost" placement="row" @change="changePost"
|
||
style="flex-direction: unset;display: block;">
|
||
<view style="width:51%;display: inline-flex;"
|
||
v-for="(row, index) in sliceList(postList,2)" :key="index">
|
||
<u-radio activeColor="#C39A4B" labelColor="#333333" shape="circle"
|
||
customStyle="height:30px;width:100%;" v-for="(item,i) in row" :key="i"
|
||
:label="item.name" :name="item.value"></u-radio>
|
||
</view>
|
||
</u-radio-group>
|
||
</view>
|
||
</view>
|
||
<!-- restore sharer -->
|
||
<view style="margin-bottom: 30px;">
|
||
<view class="hz-mr-t-30 hz-flex-row">
|
||
<view class="hz-font-lg hz-font-bold" style="width:50%;margin-left:20rpx;">
|
||
{{$t("bookingRecord.sharer")}}
|
||
</view>
|
||
<view class="hz-text-right hz-flex-row" style="width:50%;justify-content: right;">
|
||
<view @click="addSharer" style="border-radius: 14px;padding:2px 12px;"
|
||
:class="canAddSharer()==false? 'hz-disabled':''"
|
||
class="hz-flex-row hz-flex-vertical-mid hz-bg-primary">
|
||
<u-icon name="man-add" color="#ffffff" size="22"></u-icon>
|
||
<view class="hz-font-sm hz-font-color-white">{{$t("bookingConfirm.addSharer")}}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="hz-split"></view>
|
||
<view v-if="!canAddSharer()" class="hz-pd-30 hz-card-booking"
|
||
style="align-items: center;margin-top:8px;">
|
||
<span class="hz-font-color-danger hz-font-sm hz-font-bolder">{{sharerMsg}}</span>
|
||
</view>
|
||
<view v-for="(item,index) in modelBooking.sharerList" :key="'sharer'+index" class="hz-bg-white"
|
||
style="margin-top:6px;">
|
||
<view class="hz-pd-30 hz-card-booking hz-flex-row" style="align-items: center;">
|
||
<view class="hz-flex-row" style="align-items: center;width:95%;">
|
||
<view style="width:30%;">
|
||
<view class="hz-font-color-black hz-font-sm">{{$t("common.playerId")}}</view>
|
||
<u--input v-model="item.playerId" border="bottom" color="#000000" clearable
|
||
customStyle="padding:4px 0px 0px 0px;font-weight:bold;" :maxlength="8"
|
||
@change="getPlayer(index)"></u--input>
|
||
</view>
|
||
<view style="width:5%;"></view>
|
||
<view style="width:60%;">
|
||
<view class="hz-font-color-black hz-font-sm">{{$t("common.name")}}</view>
|
||
<u--input v-model="item.name" border="bottom" color="#000000" clearable
|
||
customStyle="padding:4px 0px 0px 0px;font-weight:bold;"
|
||
@change="getPlayerName(index)"></u--input>
|
||
</view>
|
||
<view style="width:5%;"></view>
|
||
</view>
|
||
<view @click="delSharer(index)" class="hz-flex-row"
|
||
style="width:5%;justify-content: flex-end;">
|
||
<u-icon name="trash" size="20" color="#c04b41"></u-icon>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- ETA && Mis Charge -->
|
||
<view class="hz-bg-white hz-flex-row" style="margin-bottom: 30px; justify-content: space-between; align-items: center;">
|
||
<view class="hz-spacing hz-font-lg hz-font-bold">{{$t("bookingDetail.ETA")}}</view>
|
||
<view class="hz-spacing" style="flex:1;display:flex;justify-content:flex-end;align-items:center;">
|
||
|
||
<u-code-input v-model="etaTimeInput" size="26" @input="formatTimeInput" @blur="validateEtaInput" :maxlength="4" space="12" :isColon="true" color="#333333" :fontSize="18"
|
||
:bold="true"></u-code-input>
|
||
</view>
|
||
</view>
|
||
|
||
<view v-show="showMisCharge" class="hz-bg-white hz-flex-row" style="margin-bottom: 30px; justify-content: space-between; align-items: center;">
|
||
<view class="hz-spacing hz-font-lg hz-font-bold" style="width: 40%;">{{$t("common.misCharge")}}</view>
|
||
<view class="hz-spacing" style="width: 35%;">
|
||
<u--input
|
||
border="surround"
|
||
v-model="mischarge"
|
||
type="number"
|
||
></u--input>
|
||
</view>
|
||
</view>
|
||
<view :style="'height:'+footFuncHei+'rpx;'">
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
<u-tabbar :fixed="true" :placeholder="true" :safeAreaInsetBottom="true"
|
||
customStyle="z-index:100;height:58px;">
|
||
<!--<view class="hz-btn-leftRight hz-flex-row hz-spacing">
|
||
<view @click="popupCalendar(1)" class="hz-btn-left hz-bg-light hz-font-lg hz-font-bold hz-font-color-primary" >{{$t("newBooking.multipleDate")}}</view>
|
||
<view @click="popupCalendar(0)" class="hz-btn-right hz-bg-primary hz-font-lg hz-font-bold hz-font-color-white" >{{$t("newBooking.selectDate")}}</view>
|
||
</view>-->
|
||
<view class="book hz-spacing">
|
||
<view @click="popupCalendar(0)"
|
||
class="hz-btn hz-font-color-white hz-font-lg hz-font-bold hz-text-center">
|
||
{{$t("newBooking.selectDate")}}
|
||
</view>
|
||
</view>
|
||
</u-tabbar>
|
||
</view>
|
||
<u-picker closeOnClickOverlay :show="showMGMProperty" :defaultIndex="currentMGMPropertyIndex"
|
||
@close="showMGMProperty=false" :cancelText="cancelText" :confirmText="okText" confirmColor="#C39A4B"
|
||
:columns="propertyList" @cancel="showMGMProperty=false" @confirm="confirmMGMProperty"
|
||
keyName="name"></u-picker>
|
||
<!--<u-picker closeOnClickOverlay :show="showOtherProperty" :defaultIndex="currentOtherPropertyIndex" @close="showOtherProperty=false" :cancelText="cancelText" :confirmText="okText" confirmColor="#C39A4B" :columns="otherPropertyList" @cancel="showOtherProperty=false" @confirm="confirmOtherProperty" keyName="name"></u-picker>-->
|
||
<u-picker closeOnClickOverlay :show="showRoom" :defaultIndex="currentRoomIndex" @close="showRoom=false"
|
||
:cancelText="cancelText" :confirmText="okText" confirmColor="#C39A4B" :columns="roomList"
|
||
@cancel="showRoom=false" @confirm="confirmRoom" keyName="name"></u-picker>
|
||
<u-picker closeOnClickOverlay :show="showRoomType" :defaultIndex="currentRoomTypeIndex"
|
||
@close="showRoomType=false" :cancelText="cancelText" :confirmText="okText" confirmColor="#C39A4B"
|
||
:columns="roomTypeList" @cancel="showRoomType=false" @confirm="confirmRoomType" keyName="name"></u-picker>
|
||
<u-modal :content="msgStr" :show="showMsg" :cancelText="cancelText" :confirmText="yesText" showCancelButton
|
||
closeOnClickOverlay @confirm="confirmMsg" confirmColor="#C39A4B" @cancel="cancelMsg"
|
||
@close="cancelMsg"></u-modal>
|
||
<u-calendar closeOnClickOverlay :confirmText="confirmText" :confirmDisabledText="confirmText" color="#C39A4B"
|
||
title="" :startText="inText" :endText="outText" :show="showCalendar" :formatter="formatter"
|
||
:maxDate="maxDate" mode="range" :monthNum="monthNum" :maxRange="maxRange" :footerInfo="footerInfo"
|
||
@close="cancelDate" @confirm="confirmDate" @rangeSelected="rangeSelected" :showMark="false"
|
||
:showRangePrompt="showRangePrompt">
|
||
</u-calendar>
|
||
<u-modal :content="msgStrPlayer" :show="showMsgPlayer" :confirmText="okText" :showCancelButton="false"
|
||
closeOnClickOverlay @confirm="confirmMsgPlayer" confirmColor="#C39A4B" @cancel="confirmMsgPlayer"
|
||
@close="confirmMsgPlayer"></u-modal>
|
||
<u-modal :content="msgReservedStr" :show="showReservedMsg" :cancelText="cancelText" :confirmText="yesText"
|
||
showCancelButton closeOnClickOverlay @confirm="confirmReservedMsg" confirmColor="#C39A4B"
|
||
@cancel="showReservedMsg=false" @close="showReservedMsg=false"></u-modal>
|
||
<u-modal :content="msgExtendStr" :show="showExtendMsg" :cancelText='$t("newBooking.extension")'
|
||
:confirmText='$t("newBooking.title")' showCancelButton closeOnClickOverlay @confirm="confirmExtendMsg"
|
||
confirmColor="#C39A4B" @cancel="cancelExtendMsg" @close="showExtendMsg=false"></u-modal>
|
||
<u-modal :content="msgStrNoExtend" :show="showMsgNoExtend" :confirmText="backText" :showCancelButton="false"
|
||
closeOnClickOverlay @confirm="showExtendMsg=true;showMsgNoExtend=false;" confirmColor="#C39A4B"
|
||
@close="showExtendMsg=true;showMsgNoExtend=false"></u-modal>
|
||
<!-- ETA Time Picker -->
|
||
<u-datetime-picker
|
||
:show="showETAPicker"
|
||
mode="time"
|
||
:cancelText="cancelText"
|
||
:confirmText="okText"
|
||
confirmColor="#C39A4B"
|
||
@close="showETAPicker = false"
|
||
@cancel="showETAPicker = false"
|
||
@confirm="confirmETA"
|
||
></u-datetime-picker>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
getProperties,
|
||
getBookingTypes,
|
||
getRooms,
|
||
getRoomTypes,
|
||
getSpecials,
|
||
getBedTypes,
|
||
getCriterias,
|
||
getAvailableRoom,
|
||
getSetting,
|
||
getExtendBooking
|
||
} from '../../api/configApi.js';
|
||
import {
|
||
playerLookup
|
||
} from '../../api/mgmApi.js';
|
||
import dayjs from '../../uni_modules/uview-ui/libs/util/dayjs.js';
|
||
export default {
|
||
data() {
|
||
return {
|
||
//数据变量
|
||
playerData: null,
|
||
userData: null,
|
||
modelBooking: {
|
||
id: null,
|
||
bookType: '0',
|
||
teamId: null,
|
||
bookingTypeId: null,
|
||
bookingType: null,
|
||
blockCode: null,
|
||
propertyId: null,
|
||
propertyName: null,
|
||
hotelCode: null,
|
||
otherPropertyId: null,
|
||
OtherPropertyName: null,
|
||
roomId: null,
|
||
room: null,
|
||
roomTypeId: null,
|
||
roomTypeCode: null,
|
||
checkInDate: null,
|
||
checkOutDate: null,
|
||
operaProfileId: null,
|
||
specialCode: null,
|
||
specialName: null,
|
||
marketCode: null,
|
||
sourceCode: null,
|
||
dateList: [],
|
||
tpdList: [],
|
||
extendDate: null,
|
||
criteriaList: [],
|
||
sharerList: [],
|
||
lastOperaStatus: null,
|
||
approveStatus: null,
|
||
createdOn: null,
|
||
createdAt: null,
|
||
createdBy: null,
|
||
createdByName: null,
|
||
groupId: null,
|
||
bedTypeId: null,
|
||
bedTypeName: null,
|
||
remark: null,
|
||
isPost: null,
|
||
depositType: null,
|
||
},
|
||
bookingTypeList: [],
|
||
propertyList: [],
|
||
specialList: [],
|
||
specialAllList: [],
|
||
bedTypeList: [],
|
||
otherPropertyList: [],
|
||
roomList: [],
|
||
roomTypeList: [],
|
||
specialCodeList: [],
|
||
criteriaList: [],
|
||
currentMGMPropertyIndex: [0],
|
||
currentOtherPropertyIndex: [0],
|
||
currentRoomIndex: [0],
|
||
currentRoomTypeIndex: [0],
|
||
maxDate: '',
|
||
// 界面变量
|
||
sharerMsg: '',
|
||
title: '',
|
||
msgStr: this.$t("newBooking.changebookingTypeAlert"),
|
||
cancelText: this.$t("common.cancel"),
|
||
confirmText: this.$t("common.confirm").toUpperCase(),
|
||
yesText: this.$t("common.yes"),
|
||
inText: this.$t("common.in"),
|
||
outText: this.$t("common.out"),
|
||
okText: this.$t("common.ok"),
|
||
backText: this.$t("common.back"),
|
||
multipleDateTag: false,
|
||
showMGMProperty: false,
|
||
showOtherProperty: false,
|
||
showOtherPropertySelect: false,
|
||
showRoom: false,
|
||
showRoomType: false,
|
||
showMsg: false,
|
||
showCalendar: false,
|
||
footFuncHei: 100,
|
||
footerInfo: "",
|
||
monthNum: 0,
|
||
maxRange: 0,
|
||
showMsgPlayer: false,
|
||
msgStrPlayer: '',
|
||
msgReservedStr: '',
|
||
showReservedMsg: false,
|
||
msgExtendStr: '',
|
||
showExtendMsg: false,
|
||
showETAPicker: false,
|
||
etaTime: '',
|
||
etaTimeInput: '',
|
||
mischarge: '',
|
||
extendBooking: null,
|
||
depositList: [{
|
||
name: this.$t("newBooking.waiveDeposit"),
|
||
value: '0'
|
||
},
|
||
{
|
||
name: this.$t("newBooking.collectDeposit"),
|
||
value: '1'
|
||
},
|
||
],
|
||
postList: [{
|
||
name: this.$t("newBooking.yesPost"),
|
||
value: '1'
|
||
},
|
||
{
|
||
name: this.$t("newBooking.noPost"),
|
||
value: '0'
|
||
},
|
||
],
|
||
showIMRequest: false,
|
||
showRangePrompt: true,
|
||
isWaitlistRoom: false,
|
||
showMsgNoExtend: false,
|
||
msgStrNoExtend: 'Player does not check in the booking',
|
||
currentTask: null,
|
||
getPlayerTimer: null,
|
||
showMisCharge: false,
|
||
mischarge: '',
|
||
etaTimeInput:'',
|
||
showETAPicker: false,
|
||
etaTime: '',
|
||
isDaylight:false,
|
||
currentTask: null,
|
||
showMisCharge: false
|
||
}
|
||
},
|
||
onLoad() {
|
||
// 從userData中拿到當前登錄賬戶的blockCode,propertyCode
|
||
uni.setStorageSync("bookingData", null);
|
||
uni.removeStorageSync("checkTPDCount");
|
||
this.playerData = uni.getStorageSync("playerData");
|
||
this.userData = uni.getStorageSync("userData");
|
||
// this.modelBooking.bookingTypeId = this.userData.bookingTypeId;
|
||
this.modelBooking.propertyId = this.userData.propertyId;
|
||
|
||
this.modelBooking.teamId = this.userData.teamStructureId;
|
||
this.modelBooking.sectionId = this.userData.sectionId;
|
||
this.modelBooking.createdBy = this.userData.userId;
|
||
this.modelBooking.createdByName = this.userData.userName;
|
||
this.modelBooking.playerId = this.playerData.playerId;
|
||
this.modelBooking.member = this.playerData;
|
||
this.getBookingType();
|
||
// this.getProperty();
|
||
// this.getRoomByProperty(this.modelBooking.propertyId);
|
||
// this.getSpecial();
|
||
// this.getSetting();
|
||
// 初始化界面
|
||
this.initUI();
|
||
},
|
||
onShow() {
|
||
// 检查是否登录
|
||
// this.isLogin();
|
||
},
|
||
methods: {
|
||
// 确认 ETA 时间选择
|
||
confirmETA(e) {
|
||
this.etaTime = e.value;
|
||
this.showETAPicker = false;
|
||
},
|
||
// ETA 输入：仅允许4位数字，满4位时校验是否可组成 HH:mm
|
||
formatTimeInput(e) {
|
||
const digits = String(e || '').replace(/\D/g, '').slice(0, 4);
|
||
this.etaTimeInput = digits;
|
||
this.etaTime = digits;
|
||
if (digits.length === 4) {
|
||
const hh = parseInt(digits.slice(0, 2), 10);
|
||
const mm = parseInt(digits.slice(2, 4), 10);
|
||
const isValid = hh >= 0 && hh <= 23 && mm >= 0 && mm <= 59;
|
||
if (!isValid) {
|
||
uni.$u.toast(this.$t("newBooking.validEta"));
|
||
this.$nextTick(() => {
|
||
this.etaTimeInput = '';
|
||
this.etaTime = '';
|
||
});
|
||
}
|
||
}
|
||
},
|
||
validateEtaInput() {
|
||
if (!this.etaTimeInput) return;
|
||
if (this.etaTimeInput.length !== 4) {
|
||
uni.$u.toast(this.$t("newBooking.validEta"));
|
||
this.$nextTick(() => {
|
||
this.etaTimeInput = '';
|
||
this.etaTime = '';
|
||
});
|
||
return;
|
||
}
|
||
const hh = parseInt(this.etaTimeInput.slice(0, 2), 10);
|
||
const mm = parseInt(this.etaTimeInput.slice(2, 4), 10);
|
||
if (hh < 0 || hh > 23 || mm < 0 || mm > 59) {
|
||
uni.$u.toast(this.$t("newBooking.validEta"));
|
||
this.$nextTick(() => {
|
||
this.etaTimeInput = '';
|
||
this.etaTime = '';
|
||
});
|
||
}
|
||
},
|
||
// 數據方法
|
||
async getBookingType() {
|
||
try {
|
||
let params = {};
|
||
const res = await getBookingTypes(params);
|
||
if (res.success === true) {
|
||
this.bookingTypeList = [];
|
||
if (res.data !== undefined && res.data !== null) {
|
||
this.bookingTypeList = res.data;
|
||
if (this.propertyList.length == 0) this.getProperty();
|
||
// for(let i=0;i<this.bookingTypeList.length;i++){
|
||
// let bookingType = this.bookingTypeList[i];
|
||
// if(bookingType.id == this.userData.bookingTypeId){
|
||
// this.modelBooking.bookingTypeId = bookingType.id;
|
||
// this.modelBooking.bookingType = bookingType.name;
|
||
// }
|
||
// }
|
||
}
|
||
}
|
||
} catch (e) {
|
||
console.error(e);
|
||
uni.$u.toast(e.errMsg, 5000);
|
||
var request = e.config != undefined ? JSON.stringify(e.config) : "";
|
||
var response = e.data != undefined ? JSON.stringify(e.data) : "";
|
||
await this.writeLog(this.userData.userId, "new_booking", "",
|
||
"[APP][newBooking.vue][getBookingType][Catch Exception]" + e.errMsg, request, response, 1,
|
||
false);
|
||
}
|
||
},
|
||
async getProperty() {
|
||
try {
|
||
let params = {
|
||
// 'searchCategory': "OPERA"
|
||
};
|
||
const res = await getProperties(params);
|
||
if (res.success === true) {
|
||
this.propertyList = [];
|
||
//this.otherPropertyList = [];
|
||
if (res.data !== undefined && res.data !== null) {
|
||
let properties = res.data;
|
||
//let otherProperties = [];
|
||
let mgmProperty = [];
|
||
for (let i = 0; i < properties.length; i++) {
|
||
let property = properties[i];
|
||
if (property.id == this.userData.propertyId) {
|
||
this.modelBooking.hotelCode = property.hotelCode;
|
||
this.modelBooking.propertyName = property.name;
|
||
this.modelBooking.propertyCategory = property.category;
|
||
this.showMisCharge = property.category === "OPERA" || property.category === "DAYLIGHT";
|
||
this.isDaylight = property.category === "DAYLIGHT" ? true : false;
|
||
}
|
||
/*if(property.category=="OPERA"){
|
||
mgmProperty.push(property);
|
||
}else if(property.category=="OTHER"){
|
||
otherProperties.push(property);
|
||
}*/
|
||
mgmProperty.push(property);
|
||
}
|
||
/*mgmProperty.push(
|
||
{
|
||
"id":"0",
|
||
"name":"Other",
|
||
"code":"OTHER"
|
||
});*/
|
||
this.propertyList.push(mgmProperty);
|
||
//this.otherPropertyList.push(otherProperties);
|
||
if (this.roomList.length == 0) this.getRoomByProperty(this.modelBooking.propertyId);
|
||
|
||
}
|
||
} else {
|
||
|
||
}
|
||
} catch (e) {
|
||
console.error(e);
|
||
uni.$u.toast(e.errMsg, 5000);
|
||
var request = e.config != undefined ? JSON.stringify(e.config) : "";
|
||
var response = e.data != undefined ? JSON.stringify(e.data) : "";
|
||
await this.writeLog(this.userData.userId, "new_booking", "",
|
||
"[APP][newBooking.vue][getProperty][Catch Exception]" + e.errMsg, request, response, 1,
|
||
false);
|
||
}
|
||
},
|
||
async getRoomByProperty(propertyId) {
|
||
try {
|
||
let params = {
|
||
propertyId: propertyId
|
||
};
|
||
const res = await getRooms(params);
|
||
if (res.success === true) {
|
||
this.roomList = [];
|
||
if (res.data !== undefined && res.data !== null) {
|
||
let rooms = res.data;
|
||
this.roomList.push(rooms);
|
||
this.currentRoomIndex = [0];
|
||
}
|
||
if(this.specialList.length==0) this.getSpecial(propertyId);
|
||
} else {
|
||
|
||
}
|
||
} catch (e) {
|
||
console.error(e);
|
||
uni.$u.toast(e.errMsg, 5000);
|
||
var request = e.config != undefined ? JSON.stringify(e.config) : "";
|
||
var response = e.data != undefined ? JSON.stringify(e.data) : "";
|
||
await this.writeLog(this.userData.userId, "new_booking", "",
|
||
"[APP][newBooking.vue][getRoomByProperty][Catch Exception]" + e.errMsg, request, response,
|
||
1, false);
|
||
}
|
||
},
|
||
async getRoomTypeByRoom(roomId) {
|
||
try {
|
||
let params = {
|
||
roomId: roomId
|
||
};
|
||
const res = await getRoomTypes(params);
|
||
if (res.success === true) {
|
||
this.roomTypeList = [];
|
||
if (res.data !== undefined && res.data !== null) {
|
||
let roomTypes = res.data;
|
||
this.roomTypeList.push(roomTypes);
|
||
this.currentRoomTypeIndex = [0];
|
||
}
|
||
} else {
|
||
|
||
}
|
||
} catch (e) {
|
||
console.error(e);
|
||
uni.$u.toast(e.errMsg, 5000);
|
||
var request = e.config != undefined ? JSON.stringify(e.config) : "";
|
||
var response = e.data != undefined ? JSON.stringify(e.data) : "";
|
||
await this.writeLog(this.userData.userId, "new_booking", "",
|
||
"[APP][newBooking.vue][getRoomTypeByRoom][Catch Exception]" + e.errMsg, request, response,
|
||
1, false);
|
||
}
|
||
},
|
||
async getBedTypeByRoom(propertyId, roomId) {
|
||
try {
|
||
let params = {
|
||
propertyId: propertyId,
|
||
roomId: roomId,
|
||
};
|
||
const res = await getBedTypes(params);
|
||
if (res.success === true) {
|
||
this.bedTypeList = [];
|
||
if (res.data !== undefined && res.data !== null) {
|
||
let bedTypes = res.data;
|
||
this.bedTypeList = bedTypes;
|
||
}
|
||
} else {
|
||
|
||
}
|
||
} catch (e) {
|
||
console.error(e);
|
||
uni.$u.toast(e.errMsg, 5000);
|
||
var request = e.config != undefined ? JSON.stringify(e.config) : "";
|
||
var response = e.data != undefined ? JSON.stringify(e.data) : "";
|
||
await this.writeLog(this.userData.userId, "new_booking", "",
|
||
"[APP][newBooking.vue][getBedTypeByRoom][Catch Exception]" + e.errMsg, request, response,
|
||
1, false);
|
||
}
|
||
},
|
||
async getSpecial(propertyId) {
|
||
try {
|
||
let params = {
|
||
category: this.modelBooking.propertyCategory,
|
||
propertyId: propertyId
|
||
};
|
||
const res = await getSpecials(params);
|
||
if (res.success === true) {
|
||
this.specialList = [];
|
||
if (res.data !== undefined && res.data !== null) {
|
||
this.specialAllList = res.data;
|
||
if(res.data.length>0){
|
||
for (var i of res.data) {
|
||
if (i.showInBooking == 1) {
|
||
this.specialList.push(i);
|
||
}
|
||
}
|
||
}
|
||
|
||
if (this.maxRange == 0) this.getSetting();
|
||
}
|
||
} else {
|
||
|
||
}
|
||
} catch (e) {
|
||
console.error(e);
|
||
uni.$u.toast(e.errMsg, 5000);
|
||
var request = e.config != undefined ? JSON.stringify(e.config) : "";
|
||
var response = e.data != undefined ? JSON.stringify(e.data) : "";
|
||
await this.writeLog(this.userData.userId, "new_booking", "",
|
||
"[APP][newBooking.vue][getSpecial][Catch Exception]" + e.errMsg, request, response, 1,
|
||
false);
|
||
}
|
||
},
|
||
async getPlayer(index) {
|
||
if (this.getPlayerTimer) {
|
||
clearTimeout(this.getPlayerTimer);
|
||
}
|
||
|
||
// 立即取消上一次正在进行的请求
|
||
if (this.currentTask) {
|
||
try {
|
||
this.currentTask.abort();
|
||
} catch (err) {
|
||
}
|
||
}
|
||
|
||
this.getPlayerTimer = setTimeout(async () => {
|
||
this.getPlayerTimer = null;
|
||
|
||
const item = this.modelBooking.sharerList[index];
|
||
// 清空名字，标记错误状态
|
||
item.name = "";
|
||
item.tierName = "";
|
||
item.error = true;
|
||
|
||
if (!item || !item.playerId || item.playerId.length <= 4) {
|
||
return;
|
||
}
|
||
|
||
// 不能是当前player
|
||
if (item.playerId === this.playerData.playerId) {
|
||
uni.$u.toast(this.$t("common.alterSharerOneself"));
|
||
item.name = "";
|
||
item.tierName = "";
|
||
return;
|
||
}
|
||
|
||
// 查重：检查是否与其他sharer重复
|
||
const isDuplicate = this.modelBooking.sharerList.some(
|
||
(sharer, i) => sharer.playerId === item.playerId && i !== index
|
||
);
|
||
if (isDuplicate) {
|
||
uni.$u.toast(this.$t("common.alterSharerExist"));
|
||
item.name = "";
|
||
item.tierName = "";
|
||
return;
|
||
}
|
||
|
||
uni.showLoading({
|
||
title: this.$t("common.loading")
|
||
});
|
||
|
||
try {
|
||
const params = {
|
||
playerId: item.playerId,
|
||
userId: this.userData.userId
|
||
};
|
||
const res = await playerLookup(params, {
|
||
getTask: (task, options) => {
|
||
this.currentTask = task;
|
||
}
|
||
});
|
||
|
||
this.currentTask = null;
|
||
|
||
|
||
if (res.success) {
|
||
item.name = res.data.englishName;
|
||
item.tierName = res.data.tierName || "";
|
||
item.error = false;
|
||
uni.setStorageSync("bookingData", this.modelBooking);
|
||
} else {
|
||
this.msgStrPlayer = res.message;
|
||
this.showMsgPlayer = true;
|
||
}
|
||
} catch (e) {
|
||
if (e.errMsg.includes("abort")) {
|
||
return;
|
||
}
|
||
console.error(e);
|
||
uni.$u.toast(e.errMsg, 5000);
|
||
const request = e.config ? JSON.stringify(e.config) : "";
|
||
const response = e.data ? JSON.stringify(e.data) : "";
|
||
await this.writeLog(this.userData.userId, "new_booking", "",
|
||
"[APP][newBooking.vue][getPlayer][Catch Exception]" + e.errMsg, request, response, 1, false);
|
||
} finally {
|
||
uni.hideLoading();
|
||
}
|
||
}, 800);
|
||
},
|
||
async getPlayerName(index) {
|
||
let item = this.modelBooking.sharerList[index];
|
||
let book = uni.getStorageSync("bookingData")
|
||
let oldItem = book.sharerList[index];
|
||
//清空plaerId
|
||
// if (item.name != oldItem.name && item.playerId.length == 8) {
|
||
// item.playerId = "";
|
||
// }
|
||
},
|
||
async buildCalendar() {
|
||
uni.showLoading({
|
||
title: this.$t("common.loading")
|
||
});
|
||
try {
|
||
this.footerInfo = "";
|
||
let params = {
|
||
roomId: this.modelBooking.roomId,
|
||
propertyId: this.modelBooking.propertyId,
|
||
coded: this.playerData.codedFlag,
|
||
userId: this.userData.userId,
|
||
userName: this.userData.userName,
|
||
playerId: this.playerData.playerId,
|
||
sectionId:this.userData.sectionId,
|
||
bedTypeId: this.modelBooking.bedTypeId,
|
||
bookingTypeId: this.modelBooking.bookingTypeId,
|
||
};
|
||
const res = await getCriterias(params);
|
||
if (res.success === true) {
|
||
this.criteriaList = [];
|
||
if (res.data !== undefined && res.data !== null) {
|
||
this.criteriaList = res.data;
|
||
// this.maxDate = this.criteriaList[this.criteriaList.length-1].bookDate;
|
||
}
|
||
} else {
|
||
|
||
}
|
||
} catch (e) {
|
||
console.error(e);
|
||
uni.$u.toast(e.errMsg, 5000);
|
||
var request = e.config != undefined ? JSON.stringify(e.config) : "";
|
||
var response = e.data != undefined ? JSON.stringify(e.data) : "";
|
||
await this.writeLog(this.userData.userId, "new_booking", "",
|
||
"[APP][newBooking.vue][buildCalendar][Catch Exception]" + e.errMsg, request, response, 1,
|
||
false);
|
||
} finally {
|
||
uni.hideLoading();
|
||
}
|
||
},
|
||
// 界面方法
|
||
popupMGMProperty() {
|
||
if (this.modelBooking.propertyId != null) {
|
||
this.currentMGMPropertyIndex = [];
|
||
for (let i = 0; i < this.propertyList[0].length; i++) {
|
||
if (this.propertyList[0][i].id === this.modelBooking.propertyId) {
|
||
|
||
this.currentMGMPropertyIndex.push(i);
|
||
this.modelBooking.propertyCategory = this.propertyList[0][i].category;
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
|
||
this.showMGMProperty = true;
|
||
},
|
||
/*popupOtherProperty(){
|
||
for(let i=0;i<this.otherPropertyList.length;i++){
|
||
if(this.otherPropertyList[i].id === this.modelBooking.otherPropertyId){
|
||
this.currentOtherPropertyIndex = i;
|
||
break;
|
||
}
|
||
}
|
||
this.showOtherProperty = true;
|
||
},*/
|
||
popupRoom() {
|
||
if (this.modelBooking.roomId != null) {
|
||
this.currentRoomIndex = [];
|
||
for (let i = 0; i < this.roomList[0].length; i++) {
|
||
if (this.roomList[0][i].id === this.modelBooking.roomId) {
|
||
this.currentRoomIndex.push(i);
|
||
break;
|
||
}
|
||
}
|
||
|
||
}
|
||
this.showRoom = true;
|
||
},
|
||
popupRoomType() {
|
||
if (this.modelBooking.roomTypeId != null) {
|
||
this.currentRoomTypeIndex = [];
|
||
for (let i = 0; i < this.roomTypeList[0].length; i++) {
|
||
if (this.roomTypeList[0][i].id === this.modelBooking.roomTypeId) {
|
||
this.currentRoomTypeIndex.push(i);
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
|
||
this.showRoomType = true;
|
||
},
|
||
async popupCalendar(type) {
|
||
if (this.modelBooking.bookingTypeId === undefined || this.modelBooking.bookingTypeId === null) {
|
||
uni.$u.toast(this.$t("newBooking.alertBookingType"));
|
||
return;
|
||
}
|
||
if (this.modelBooking.roomId === undefined || this.modelBooking.roomId === null) {
|
||
uni.$u.toast(this.$t("newBooking.alertRoom"));
|
||
return;
|
||
}
|
||
if (this.showIMRequest) {
|
||
if (this.modelBooking.depositType === undefined || this.modelBooking.depositType === null || this.modelBooking.depositType === '') {
|
||
uni.$u.toast(this.$t("newBooking.alertDeposit"));
|
||
return;
|
||
}
|
||
if (this.modelBooking.isPost === undefined || this.modelBooking.isPost === null || this.modelBooking.isPost === '') {
|
||
uni.$u.toast(this.$t("newBooking.alertPostCharge"));
|
||
return;
|
||
}
|
||
}
|
||
/*if(this.modelBooking.roomTypeId===undefined || this.modelBooking.roomTypeId===null){
|
||
uni.$u.toast(this.$t("newBooking.alertRoomType"));
|
||
return;
|
||
}*/
|
||
await this.buildCalendar();
|
||
if (type === 1)
|
||
this.multipleDateTag = true;
|
||
else
|
||
this.multipleDateTag = false;
|
||
this.showCalendar = true;
|
||
},
|
||
confirmDate(e) {
|
||
this.checkSharer();
|
||
this.modelBooking.dateList = [];
|
||
this.modelBooking.criteriaList = [];
|
||
let objDate = {
|
||
date: e,
|
||
status: null,
|
||
checked: false,
|
||
remark: '',
|
||
numOfNight: dayjs(e[e.length - 1]).diff(dayjs(e[0]), 'day'),
|
||
numOfRoom: 1,
|
||
submit: false,
|
||
bookingStatus: ''
|
||
};
|
||
// 把對應的criteria也放到booking裡面後面用
|
||
for (let i = 0; i < e.length; i++) {
|
||
const date = e[i];
|
||
const criterias = this.criteriaList;
|
||
if (criterias[date] !== undefined && criterias[date] != null) {
|
||
this.modelBooking.criteriaList.push(criterias[date]);
|
||
}
|
||
if (criterias[e[e.length - 1]] == undefined && i == (e.length - 1)) {
|
||
this.modelBooking.criteriaList.push({
|
||
'bookDate': date,
|
||
'available': 0,
|
||
});
|
||
}
|
||
|
||
}
|
||
|
||
var isWaitlist = false;
|
||
var waitlistCount = 0;
|
||
var criteriaCount = e.length - 1;
|
||
for (var d = 0; d < criteriaCount; d++) {
|
||
var date = e[d];
|
||
if (this.criteriaList[date] != undefined) {
|
||
if (this.criteriaList[date].isWaitlist == 1) {
|
||
isWaitlist = true;
|
||
waitlistCount++;
|
||
}
|
||
}
|
||
}
|
||
if (waitlistCount == criteriaCount || (this.modelBooking.roomForBooking == 0 && this.modelBooking
|
||
.roomForWaitlist == 1)) {
|
||
this.isWaitlistRoom = true;
|
||
} else {
|
||
this.isWaitlistRoom = false;
|
||
}
|
||
if (this.isWaitlistRoom == false) {
|
||
const canAddShare = this.canAddSharer();
|
||
if (canAddShare == false) {
|
||
this.showCalendar = false;
|
||
return;
|
||
}
|
||
var consecutiveRes = this.checkConsecutiveNight(e[0], dayjs(e[e.length - 1]).diff(dayjs(e[0]), 'day'));
|
||
if (!consecutiveRes) return false;
|
||
|
||
}
|
||
|
||
let checkDate = JSON.parse(JSON.stringify(e));
|
||
checkDate.pop();
|
||
if (!this.checkDate(checkDate)) return false;
|
||
|
||
//rebuild special code
|
||
let specialCode = this.modelBooking.specialCode;
|
||
let specialName = this.modelBooking.specialName;
|
||
if (specialName != null && specialName != "") {
|
||
if (specialName.includes("Back To Back")) {
|
||
let codeArr = specialCode.split(",")
|
||
let specialArr = specialName.split(",");
|
||
specialArr = specialArr.filter(item => item != "Back To Back");
|
||
for (let s of this.specialAllList) {
|
||
if (s.description == "Back To Back") {
|
||
codeArr = codeArr.filter(a => a != s.code);
|
||
}
|
||
}
|
||
this.modelBooking.specialCode = codeArr.join(",")
|
||
this.modelBooking.specialName = specialArr.join(",")
|
||
}
|
||
}
|
||
//this.modelBooking.numOfNight = dayjs(e[e.length-1]).diff(dayjs(e[0]),'day');
|
||
this.modelBooking.checkInDate = e[0];
|
||
this.modelBooking.checkOutDate = e[e.length - 1];
|
||
this.modelBooking.dateList.push(objDate);
|
||
|
||
// 将添加的 mischarge 赋值给 modelBooking
|
||
if (this.mischarge !== '') {
|
||
this.modelBooking.miscCharge = this.mischarge;
|
||
}
|
||
|
||
// 将添加的 etaTime 赋值给 modelBooking
|
||
if (this.etaTimeInput !== '') {
|
||
if (this.etaTimeInput.length !== 4) {
|
||
uni.$u.toast("ETA 時間格式有誤，請重新輸入 eg: HH:mm");
|
||
this.etaTimeInput = '';
|
||
this.etaTime = '';
|
||
return false;
|
||
}
|
||
const hh = parseInt(this.etaTimeInput.slice(0, 2), 10);
|
||
const mm = parseInt(this.etaTimeInput.slice(2, 4), 10);
|
||
if (hh < 0 || hh > 23 || mm < 0 || mm > 59) {
|
||
uni.$u.toast("ETA 時間格式有誤，請重新輸入 eg: HH:mm");
|
||
this.etaTimeInput = '';
|
||
this.etaTime = '';
|
||
return false;
|
||
}
|
||
this.modelBooking.etaTime = `${this.etaTimeInput.slice(0, 2)}:${this.etaTimeInput.slice(2, 4)}`;
|
||
}
|
||
|
||
uni.setStorageSync("bookingData", this.modelBooking);
|
||
//检查是否已有可extend booking
|
||
let res = this.checkExtendBooking(e[0], e[e.length - 1]);
|
||
// 先臨時保存選擇的日期到booking對象的日期數組dateList中後跳轉
|
||
// if(this.multipleDateTag===true){
|
||
// this.navTo("/booking/multipleDate/multipleDate");
|
||
// }else{
|
||
// this.navTo("/booking/bookingConfirm/bookingConfirm");
|
||
// }
|
||
this.showCalendar = false;
|
||
},
|
||
async getSetting() {
|
||
uni.showLoading({
|
||
title: this.$t("common.loading")
|
||
});
|
||
var that = this;
|
||
try {
|
||
let params = {};
|
||
const res = await getSetting(params);
|
||
if (res != null && res.success == true) {
|
||
for (let i of res.data) {
|
||
if (i.keys == "MAX_BOOKING_STAY_DAYS") {
|
||
let stay = i.keyValues;
|
||
that.maxRange = stay;
|
||
} else if (i.keys == "MAX_ADVANCE_BOOKING_DAYS") {
|
||
var monthNum = i.keyValues / 30;
|
||
that.monthNum = Math.ceil(monthNum) + 1;
|
||
let mDate = dayjs().add(i.keyValues, 'day').format("YYYY-MM-DD");
|
||
that.maxDate = mDate
|
||
}
|
||
}
|
||
} else {
|
||
// write log
|
||
}
|
||
} catch (e) {
|
||
// write log
|
||
console.error(e);
|
||
uni.$u.toast(e.errMsg, 5000);
|
||
var request = e.config != undefined ? JSON.stringify(e.config) : "";
|
||
var response = e.data != undefined ? JSON.stringify(e.data) : "";
|
||
await this.writeLog(this.userData.userId, "new_booking", "",
|
||
"[APP][newBooking.vue][getSetting][Catch Exception]" + e.errMsg, request, response, 1,
|
||
false);
|
||
} finally {
|
||
uni.hideLoading();
|
||
}
|
||
},
|
||
async rangeSelected(e) {
|
||
var isWaitlist = false;
|
||
for (var d = 0; d < e.length - 1; d++) {
|
||
var date = e[d];
|
||
if (this.criteriaList[date] != undefined) {
|
||
if (this.criteriaList[date].isWaitlist == 1) {
|
||
isWaitlist = true;
|
||
}
|
||
}
|
||
}
|
||
// if(isWaitlist){
|
||
// try{
|
||
// let params = {
|
||
// roomId:this.modelBooking.roomId,
|
||
// propertyId:this.modelBooking.propertyId,
|
||
// bookingTypeId:this.modelBooking.bookingTypeId,
|
||
// selectDate: [e[0],e[e.length-2]],
|
||
// };
|
||
// const res = await getAvailableRoom(params);
|
||
// if(res.success === true){
|
||
// if(res.data.length>0) {
|
||
// this.footerInfo = "Available Room:"+res.data.join(',');
|
||
// }else{
|
||
// this.footerInfo = "";
|
||
// }
|
||
// }
|
||
// }catch(e){
|
||
|
||
// }
|
||
// }else{
|
||
// this.footerInfo = "";
|
||
// }
|
||
},
|
||
confirmMGMProperty(e) {
|
||
this.modelBooking.propertyId = e.value[0].id;
|
||
this.modelBooking.roomId = null;
|
||
this.modelBooking.room = null;
|
||
this.modelBooking.roomTypeId = null;
|
||
this.modelBooking.roomTypeCode = null;
|
||
this.modelBooking.bedTypeId = null;
|
||
this.modelBooking.propertyCategory = null;
|
||
this.bedTypeList = [];
|
||
this.getRoomByProperty(e.value[0].id);
|
||
for (let i = 0; i < this.propertyList[0].length; i++) {
|
||
let property = this.propertyList[0][i];
|
||
if (property.id == e.value[0].id) {
|
||
this.modelBooking.hotelCode = property.hotelCode;
|
||
this.modelBooking.propertyName = property.name;
|
||
this.modelBooking.propertyCategory = property.category;
|
||
break;
|
||
}
|
||
}
|
||
// console.log(this.modelBooking.propertyCategory);
|
||
//this.currentRoomIndex = [0];
|
||
/*if(e.value[0].id=='0'){
|
||
this.showOtherPropertySelect = true;
|
||
}else{
|
||
this.showOtherPropertySelect = false;
|
||
}*/
|
||
this.showMGMProperty = false;
|
||
|
||
if (e.value[0].category === "OPERA" || e.value[0].category === "DAYLIGHT") {
|
||
this.showMisCharge = true;
|
||
this.isDaylight = e.value[0].category === "DAYLIGHT" ? true : false;
|
||
} else {
|
||
this.showMisCharge = false;
|
||
this.mischarge = "";
|
||
this.isDaylight = false;
|
||
}
|
||
|
||
// 重新获取 Special List
|
||
this.getSpecial(this.modelBooking.propertyId);
|
||
},
|
||
/*confirmOtherProperty(e){
|
||
this.modelBooking.propertyId = e.value[0].id
|
||
this.modelBooking.propertyName = e.value[0].name
|
||
this.modelBooking.otherPropertyId = e.value[0].id;
|
||
this.modelBooking.otherPropertyName = e.value[0].name;
|
||
this.modelBooking.roomId = null;
|
||
this.modelBooking.room = null;
|
||
this.showOtherProperty = false;
|
||
this.getRoomByProperty(e.value[0].id);
|
||
},*/
|
||
confirmRoom(e) {
|
||
this.modelBooking.roomId = e.value[0].id;
|
||
this.modelBooking.room = e.value[0].name;
|
||
this.modelBooking.roomTypeId = null;
|
||
this.modelBooking.roomTypeCode = null;
|
||
this.modelBooking.sharerLimit = null;
|
||
this.modelBooking.bedTypeId = null;
|
||
for (var v of this.roomList[0]) {
|
||
if (v.id == e.value[0].id) {
|
||
this.modelBooking.sharerLimit = v.sharerLimit;
|
||
this.modelBooking.sharerList.length = 0;
|
||
this.modelBooking.roomCategory = v.roomCategory;
|
||
this.modelBooking.roomForBooking = v.forBooking;
|
||
this.modelBooking.roomForWaitlist = v.forWaitlist;
|
||
if (this.modelBooking.roomForBooking == 0 && this.modelBooking.roomForWaitlist == 1) {
|
||
this.showRangePrompt = false;
|
||
this.isWaitlistRoom = true;
|
||
} else {
|
||
this.showRangePrompt = true;
|
||
this.isWaitlistRoom = false;
|
||
}
|
||
}
|
||
}
|
||
// 根據選中的Room，拿到對應的RoomType
|
||
//this.getRoomTypeByRoom(e.value[0].id);
|
||
this.getBedTypeByRoom(this.modelBooking.propertyId, e.value[0].id);
|
||
this.showRoom = false;
|
||
},
|
||
confirmRoomType(e) {
|
||
this.modelBooking.roomTypeId = e.value[0].id;
|
||
this.modelBooking.roomTypeCode = e.value[0].name;
|
||
|
||
this.showRoomType = false;
|
||
},
|
||
confirmMsg() {
|
||
this.showMsg = false;
|
||
},
|
||
confirmMsgPlayer() {
|
||
this.msgStrPlayer = '';
|
||
this.showMsgPlayer = false;
|
||
},
|
||
confirmReservedMsg() {
|
||
this.showReservedMsg = false;
|
||
this.showCalendar = false;
|
||
this.navTo("/booking/bookingConfirm/bookingConfirm");
|
||
},
|
||
cancelDate() {
|
||
this.showCalendar = false;
|
||
},
|
||
cancelMsg() {
|
||
// 重置回當前user默認的bookingType
|
||
this.modelBooking.bookingTypeId = this.userData.bookingTypeId;
|
||
this.showMsg = false;
|
||
},
|
||
changebookingType(e) {
|
||
this.modelBooking.bookingTypeId = e;
|
||
// 如果e跟user默認的bookingType不同就彈出提示, 假設當前默認bookingType是MASS
|
||
for (let i = 0; i < this.bookingTypeList.length; i++) {
|
||
let bookingType = this.bookingTypeList[i];
|
||
if (bookingType.id == e) {
|
||
this.modelBooking.bookingTypeId = bookingType.id;
|
||
this.modelBooking.bookingTypeName = bookingType.name;
|
||
this.showIMRequest = bookingType.name == "IM" ? true : false
|
||
this.modelBooking.isPost = null;
|
||
this.modelBooking.depositType = null;
|
||
|
||
// 如果是IM booking，不展示misc charge
|
||
if (bookingType.name == 'IM') {
|
||
this.showMisCharge = false;
|
||
}
|
||
}
|
||
}
|
||
|
||
// if(e!=this.userData.bookingTypeId){
|
||
// this.showMsg = true;
|
||
// }
|
||
},
|
||
changeProperty(e) {
|
||
this.modelBooking.propertyId = e;
|
||
this.modelBooking.roomId = null;
|
||
this.modelBooking.room = null;
|
||
this.modelBooking.roomTypeId = null;
|
||
this.modelBooking.roomTypeCode = null;
|
||
|
||
this.getRoomByProperty(e);
|
||
for (let i = 0; i < this.propertyList.length; i++) {
|
||
let property = this.propertyList[i];
|
||
if (property.id == e) {
|
||
this.modelBooking.hotelCode = property.hotelCode;
|
||
this.modelBooking.propertyName = property.name;
|
||
break;
|
||
}
|
||
}
|
||
if (e == '0') {
|
||
this.showOtherPropertySelect = true;
|
||
} else {
|
||
this.showOtherPropertySelect = false;
|
||
}
|
||
},
|
||
changeBedType(e) {
|
||
if (e) {
|
||
for (let j = 0; j < this.bedTypeList.length; j++) {
|
||
if (e == this.bedTypeList[j].masterGroupId) {
|
||
this.modelBooking.bedTypeId = this.bedTypeList[j].masterGroupId;
|
||
this.modelBooking.bedTypeName = this.bedTypeList[j].bedTypeName;
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
},
|
||
changeSpecial(e) {
|
||
const selected = Array.isArray(e) ? e : [];
|
||
|
||
if (selected.length === 0) {
|
||
this.modelBooking.specialCode = null;
|
||
this.modelBooking.specialName = null;
|
||
return;
|
||
}
|
||
|
||
this.modelBooking.specialCode = selected.join(",");
|
||
|
||
// 根据选中的 code 反查 description 用于展示
|
||
const descList = [];
|
||
for (const val of selected) {
|
||
const selectedCodeStr = String(val);
|
||
const found = this.specialAllList.find(s => String(s.code) === selectedCodeStr) ||
|
||
this.specialList.find(s => String(s.code) === selectedCodeStr);
|
||
if (found && found.description) descList.push(found.description);
|
||
}
|
||
this.modelBooking.specialName = descList.join(",");
|
||
},
|
||
formatter(day) {
|
||
if (this.criteriaList != null) {
|
||
let date = dayjs(day.date).format("YYYY-MM-DD");
|
||
if (this.criteriaList[date] != undefined) {
|
||
let criteria = this.criteriaList[date];
|
||
if (criteria.isWaitlist == 1) {
|
||
day.bottomInfo = 'Waitlist'
|
||
day.dot = true
|
||
}
|
||
if (criteria.protection == 1) {
|
||
day.bottomInfo = 'Protect'
|
||
day.dot = true
|
||
}
|
||
if (criteria.reserved == 1) {
|
||
day.bottomInfo = 'Reserved'
|
||
day.dot = true
|
||
}
|
||
if (criteria.staying == 1) {
|
||
day.bottomInfo = 'Check-in'
|
||
day.dot = true
|
||
}
|
||
if (criteria.available <= 0 && criteria.isWaitlist != 1) {
|
||
if(!this.isDaylight){
|
||
day.bottomInfo = 'APP Full'
|
||
day.dot = true
|
||
}
|
||
}
|
||
} else {
|
||
if (dayjs(day.date).isBefore(dayjs(), 'day')) {
|
||
day.disabled = true;
|
||
} else {
|
||
if(!this.isDaylight){
|
||
day.bottomInfo = 'APP Full'
|
||
day.dot = true
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
return day
|
||
},
|
||
initUI() {
|
||
this.deviceData = uni.getStorageSync("deviceData");
|
||
this.title = this.$t("newBooking.title");
|
||
// 判斷iphone下方安全區域
|
||
const area = this.deviceData.saveArea;
|
||
if (area) {
|
||
this.footFuncHei = 160;
|
||
}
|
||
},
|
||
checkDate(date) {
|
||
var protectList = [];
|
||
var fullList = [];
|
||
var reservedList = [];
|
||
var stayingList = [];
|
||
var waitList = [];
|
||
for (let d of date) {
|
||
if (this.criteriaList[d] != undefined) {
|
||
if (this.criteriaList[d].available <= 0) {
|
||
if (this.criteriaList[d].isWaitlist != 1) fullList.push(d);
|
||
}
|
||
if (this.criteriaList[d].protection == 1) protectList.push(d);
|
||
if (this.criteriaList[d].staying == 1 || this.criteriaList[d].reserved == 1) stayingList.push(d);
|
||
|
||
if (this.criteriaList[d].reserved == 1) reservedList.push(d);
|
||
if (this.criteriaList[d].isWaitlist == 1) waitList.push(d);
|
||
} else {
|
||
fullList.push(d);
|
||
}
|
||
}
|
||
if (fullList.length > 0 && !this.isDaylight) {
|
||
let msg = this.$t("newBooking.appFull");
|
||
msg += " " + fullList.join(',')
|
||
uni.$u.toast(msg, 5000);
|
||
return false;
|
||
}
|
||
// if (stayingList.length > 0) {
|
||
// let msg = this.$t("newBooking.sameBooking");
|
||
// msg += " " + stayingList.join(',')
|
||
// uni.$u.toast(msg, 5000);
|
||
// return false;
|
||
// }
|
||
|
||
|
||
// Approval Issue List D021 修改
|
||
// if (this.isWaitlistRoom == false) {
|
||
if (protectList.length > 0) {
|
||
let msg = this.$t("newBooking.protectionPeriod");
|
||
msg += " " + protectList.join(',')
|
||
uni.$u.toast(msg, 5000);
|
||
return false;
|
||
}
|
||
// }
|
||
|
||
|
||
|
||
// if (waitList.length > 0) {
|
||
// let msg = this.$t("newBooking.waitlist");
|
||
// msg += " " + waitList.join(',')
|
||
// uni.$u.toast(msg, 5000);
|
||
// return false;
|
||
// }
|
||
|
||
// if(reservedList.length>0){
|
||
// let msg = this.$t("newBooking.reservedBooking");
|
||
// msg += " "+reservedList.join(',')
|
||
// this.msgReservedStr = msg;
|
||
// this.showReservedMsg = true;
|
||
// return false;
|
||
// }
|
||
return true;
|
||
|
||
},
|
||
checkSharer() {
|
||
var sharerList = this.modelBooking.sharerList;
|
||
for (var i = sharerList.length - 1; i > -1; i--) {
|
||
var sharer = sharerList[i];
|
||
if ((sharer.playerId == '' || sharer.playerId.length != 8 || sharer.error == true) && sharer.name ==
|
||
'') {
|
||
sharerList.splice(i, 1);
|
||
}
|
||
}
|
||
this.modelBooking.sharerList = sharerList;
|
||
},
|
||
canAddSharer() {
|
||
let str = '';
|
||
if (this.modelBooking.criteriaList != undefined && this.modelBooking.criteriaList != null && this
|
||
.modelBooking.sharerList != null && this.modelBooking.sharerList.length > 0) {
|
||
for (let i = 0; i < this.modelBooking.criteriaList.length - 1; i++) {
|
||
let criteria = this.modelBooking.criteriaList[i];
|
||
if (criteria.sharer == 0) {
|
||
if (str == '') {
|
||
str = criteria.bookDate;
|
||
} else {
|
||
str = str + "," + criteria.bookDate;
|
||
}
|
||
}
|
||
}
|
||
if (str != '') {
|
||
this.sharerMsg = str + " " + this.$t("bookingConfirm.canNotAddSharer");
|
||
return false;
|
||
}
|
||
}
|
||
return true;
|
||
},
|
||
addSharer() {
|
||
if (!this.canAddSharer()) return;
|
||
let sharer = {
|
||
playerId: '',
|
||
name: '',
|
||
tierName: ''
|
||
};
|
||
if (this.modelBooking.sharerList.length < this.modelBooking.sharerLimit) {
|
||
this.modelBooking.sharerList.push(sharer);
|
||
} else {
|
||
var limit = "：" + (this.modelBooking.sharerLimit ? this.modelBooking.sharerLimit : 0)
|
||
uni.$u.toast(this.$t("common.alterSharerLimit") + limit);
|
||
}
|
||
|
||
},
|
||
delSharer(index) {
|
||
this.modelBooking.sharerList.splice(index, 1);
|
||
uni.setStorageSync("bookingData", this.modelBooking)
|
||
},
|
||
async checkExtendBooking(checkoutDate, checkinDate) {
|
||
uni.showLoading({
|
||
title: this.$t("common.loading")
|
||
});
|
||
try {
|
||
let params = {
|
||
playerId: this.playerData.playerId,
|
||
userId: this.modelBooking.createdBy,
|
||
propertyId: this.modelBooking.propertyId,
|
||
roomId: this.modelBooking.roomId,
|
||
checkoutDate: checkoutDate,
|
||
checkinDate: checkinDate,
|
||
};
|
||
const res = await getExtendBooking(params);
|
||
if (res.success === true) {
|
||
this.showCalendar = false;
|
||
if (res.data.length > 0) {
|
||
let msg = this.$t("newBooking.extendBooking");
|
||
this.msgExtendStr = msg;
|
||
this.showExtendMsg = true;
|
||
this.extendBooking = res.data[0];
|
||
return false;
|
||
} else {
|
||
// 先臨時保存選擇的日期到booking對象的日期數組dateList中後跳轉
|
||
if (this.multipleDateTag === true) {
|
||
this.navTo("/booking/multipleDate/multipleDate");
|
||
} else {
|
||
this.navTo("/booking/bookingConfirm/bookingConfirm");
|
||
}
|
||
}
|
||
}
|
||
} catch (e) {
|
||
|
||
} finally {
|
||
uni.hideLoading();
|
||
}
|
||
},
|
||
confirmExtendMsg() {
|
||
var special = {};
|
||
for (var i of this.specialAllList) {
|
||
if (i.description == "Back To Back") {
|
||
special = i;
|
||
}
|
||
}
|
||
if (special.id != undefined) {
|
||
if (this.modelBooking.specialCode == null || this.modelBooking.specialCode == "") {
|
||
this.modelBooking.specialCode = special.code;
|
||
this.modelBooking.specialName = special.description;
|
||
}else{
|
||
if(!this.modelBooking.specialName.includes("Back To Back")){
|
||
this.modelBooking.specialCode += ","+special.code;
|
||
this.modelBooking.specialName += ","+special.description;
|
||
}
|
||
}
|
||
uni.setStorageSync("bookingData", this.modelBooking)
|
||
}
|
||
|
||
this.showExtendMsg = false;
|
||
this.navTo("/booking/bookingConfirm/bookingConfirm");
|
||
},
|
||
cancelExtendMsg() {
|
||
this.showExtendMsg = false;
|
||
if (this.extendBooking.lastOperaStatus == "CHECKED_IN" || this.extendBooking.lastOperaStatus ==
|
||
"DUE_OUT") {
|
||
this.navTo('/booking/bookingDetail/bookingDetail?id=' + this.extendBooking.id + "&conf=" + this
|
||
.extendBooking.confirmationNo + "&from=list", 0, false)
|
||
} else {
|
||
this.showMsgNoExtend = true;
|
||
}
|
||
|
||
|
||
},
|
||
checkConsecutiveNight(checkInDate, night) {
|
||
var dataList = [];
|
||
var range = parseInt(this.maxRange) + 1 - night;
|
||
for (var i = 1; i <= range; i++) {
|
||
var date = dayjs(checkInDate).subtract(i, 'day').format("YYYY-MM-DD");
|
||
var day = this.criteriaList[date];
|
||
if (day) {
|
||
if (day.reserved != undefined) {
|
||
if (day.reserved == 1) dataList.push(day);
|
||
}
|
||
if (day.staying != undefined) {
|
||
if (day.staying == 1) dataList.push(day);
|
||
}
|
||
}
|
||
}
|
||
|
||
if (dataList.length == range) {
|
||
uni.$u.toast(`${this.$t("newBooking.maxNight1")} ${this.maxRange} ${this.$t("newBooking.maxNight2")}`,
|
||
5000)
|
||
return false;
|
||
} else {
|
||
return true;
|
||
}
|
||
},
|
||
changeDeposit(e) {
|
||
this.modelBooking.depositType = e;
|
||
},
|
||
changePost(e) {
|
||
this.modelBooking.isPost = e;
|
||
},
|
||
},
|
||
computed: {
|
||
sliceList() {
|
||
return function(data, count) {
|
||
if (data != undefined) {
|
||
let index = 0;
|
||
let arrTemp = [];
|
||
for (let i = 0; i < data.length; i++) {
|
||
index = parseInt(i / count);
|
||
if (arrTemp.length <= index) {
|
||
arrTemp.push([]);
|
||
}
|
||
arrTemp[index].push(data[i])
|
||
}
|
||
return arrTemp
|
||
}
|
||
}
|
||
},
|
||
mapPropertyName() {
|
||
return function(property, other) {
|
||
if (property != undefined && other != null) {
|
||
return "Other";
|
||
} else {
|
||
return property;
|
||
}
|
||
}
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.cell {
|
||
height: 30px;
|
||
padding: 3px 0;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.cell .text {
|
||
width: 24px;
|
||
height: 24px;
|
||
display: block;
|
||
margin: 0 auto;
|
||
line-height: 24px;
|
||
position: absolute;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
border-radius: 50%;
|
||
}
|
||
|
||
.cell.current .text {
|
||
background: #626aef;
|
||
color: #fff;
|
||
}
|
||
|
||
.cell .holiday {
|
||
position: absolute;
|
||
width: 6px;
|
||
height: 6px;
|
||
background: var(--el-color-danger);
|
||
border-radius: 50%;
|
||
bottom: 0px;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
}
|
||
|
||
.u-border-bottom {
|
||
border-bottom-width: 1px !important;
|
||
border-color: #333333 !important;
|
||
border-bottom-style: solid;
|
||
}
|
||
|
||
.mandatory {
|
||
color: #ff0000;
|
||
margin-left: 3px;
|
||
}
|
||
</style>
|