0491bdfe by zhangmeng

Merge branch 'hotel' into bug-order

2 parents ad624431 c4e194be
......@@ -59,7 +59,19 @@
<el-card class="mt30 mb60">
<div class="lineHead">
<ul>
<li>{{ language == 0 ? '房型选择' : 'Available Rooms' }}</li>
<li>
{{ language == 0 ? '房型选择' : 'Available Rooms' }}
<span style="margin-left: 100px">
<el-date-picker
@change="getDaysBetween"
v-model="hotTime"
type="daterange"
:disabled-date="disabledDateRZ"
:placeholder="language==0?'选择日期':'Select date'"
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"/>
</span>
</li>
</ul>
</div>
<div>
......@@ -89,11 +101,14 @@
<div class="price">{{ language==0?'¥':'€' }}<span>{{language==0?r.roomPrice:r.roomPriceEn}}</span></div>
</el-col>
<el-col :span="3">
<div class="bg-lineg" v-if="language==0" @click="goOrder(r)">
<el-link v-if="language==0" @click="goOrder(r)" :disabled="!r.useCount">
<div class="bg-lineg " :class="{'forbid':!r.useCount}" >
<div>{{ language==0?'在线付':'Online' }}</div>
</div>
<el-button v-else class="btn-lineG w100" round type="primary" @click="goOrder(r)">Select</el-button>
</el-link>
<el-button v-else class="btn-lineG w100" round type="pri mary" @click="goOrder(r)">Select</el-button>
<!-- <div class="text-center text-primary mt10 fontsize14 pointer" v-if="language == 0">-->
<!-- 剩余 {{(r.roomCount - (r.useCount||0)).toFixed()}} 间-->
<!-- </div>-->
......@@ -111,11 +126,14 @@
</div>
</template>
<script setup lang="ts">
<script setup >
import {useRouter} from "vue-router";
import {ref, reactive, onMounted} from "vue";
import {useRoute} from "vue-router";
import {dayjs} from 'element-plus'
import {getHotelById, getHotelRooms,checkRoomPayByUserId} from "@/apiPc/booking"
import {getBaseInfoByActiveId} from "@/apiPc/booking";
import {useStorage} from "@vueuse/core/index";
import useUserStore from "@/store/modules/user";
......@@ -129,12 +147,34 @@ const form = ref({})
const query = ref({
hotelId: route.query.id
})
const hotTime=ref([])
const showAll = ref(false)
const loading = ref(false)
const roomList = ref([])
const map = ref(null)
const formTime=ref({})
onMounted(() => {
getData()
console.log(route.params)
getBaseInfoByActiveId(route.params.cptId).then(res=>{
formTime.value = res.data || null
}).catch(err=>{
console.log(err)
formTime.value = null
}).finally(()=>{
console.log(formTime.value)
if (formTime.value){
if (dayjs().isBefore(dayjs(formTime.value.hqStart))){
hotTime.value[0]=dayjs(formTime.value.hqStart).format('YYYY-MM-DD')
hotTime.value[1]=dayjs(formTime.value.hqEnd).add(1,'day').format('YYYY-MM-DD')
} else{
hotTime.value[0]=dayjs().format('YYYY-MM-DD')
hotTime.value[1]=dayjs().add(1,'day').format('YYYY-MM-DD')
}
}
getData()
})
})
function getData() {
......@@ -147,13 +187,15 @@ function getData() {
console.log(err)
})
query.value.hotelId = route.query.id
query.value.rzStart=hotTime.value?hotTime.value[0]:null
query.value.rzEnd=hotTime.value?hotTime.value[1]:null
getHotelRooms(query.value).then(res => {
roomList.value = res.rows
})
}
function initMap() {
const TMap = (window as any).TMap
// const TMap = (window as any).TMap
var center = new TMap.LatLng(form.value.latitude, form.value.longitude);//设置中心点坐标'
var map = new TMap.Map("map", {
center: center,//设置地图中心点坐标
......@@ -208,7 +250,7 @@ function goOrder(room) {
).then((res) => {
console.log(res)
router.push({
name:'myReservation'
name:'myReservation',
})
})
// .catch((res) => {
......@@ -230,10 +272,35 @@ function goNext(room) {
query:{
room:encodeURIComponent(JSON.stringify(room)),
hotelName:form.value.name,
checkInTime:form.value.checkInTime
checkInTime:form.value.checkInTime,
start:hotTime.value[0],
end:hotTime.value[1],
}
})
}
function getDaysBetween(e){
console.log(hotTime.value)
getData()
console.log(e)
}
function disabledDateRZ(date) {
//判读今天大与form.value.hqStart
console.log(formTime.value.hqStart)
// const start=dayjs(formTime.value.hqStart).format('YYYY-MM-DD')
// const end=dayjs(formTime.value.hqStart).format('YYYY-MM-DD')
if (formTime.value.hqStart) {
const today = dayjs().format('YYYY-MM-DD')
if (formTime.value.hqStart < today) {
return !((date.getTime() >= dayjs(today).valueOf())&&(date.getTime() <= dayjs(formTime.value.hqEnd).valueOf()))
} else {
return !((date.getTime() >= dayjs(formTime.value.hqStart).valueOf())&&(date.getTime() <= dayjs(formTime.value.hqEnd).valueOf()))
}
}
return true
}
function goMap() {
return
// var tencentMapUrl = "https://map.qq.com/";
......@@ -242,6 +309,7 @@ function goMap() {
var mapUrl_tx = "http://apis.map.qq.com/uri/v1/marker?marker=coord:"+form.value.latitude+","+form.value.longitude+"&referer=yellowpage";
window.open(url, "_blank")
}
</script>
<style scoped lang="scss">
......@@ -363,4 +431,13 @@ function goMap() {
.el-icon{margin-right: 5px;}
}
.oddmb:nth-child(2){margin-bottom: 20px;}
.forbid{
cursor:not-allowed !important;
background-color: rgba(0,0,0,.5) !important;
background: linear-gradient(90deg, #b38ce3, #3d3a79) !important;
color: #aca7a7 !important;
div{
color: #aca7a7 !important;
}
}
</style>
......
......@@ -29,19 +29,21 @@
<div class="border-rr mt20 pd20">
<el-form :model="form" :label-width="language == 0 ?'100':'160'" :rules="rules" ref="formRef">
<el-form-item :label="language==0?'入住日期':'Check-in&Check-out'" required>
<el-date-picker @change="getDaysBetween"
v-model="rzRange"
type="daterange" :disabled-date="disabledDateRZ"
:placeholder="language==0?'选择日期':'Select date'" format="YYYY-MM-DD"
value-format="YYYY-MM-DD"/>
<el-date-picker
@change="getDaysBetween"
v-model="rzRange"
type="daterange"
:disabled-date="disabledDateRZ"
:placeholder="language==0?'选择日期':'Select date'"
format="YYYY-MM-DD"
value-format="YYYY-MM-DD"/>
<div class="tip" v-if="lform.hqStart">{{ language==0?'可订日期':'Available date' }}{{ lform.hqStart.slice(0, 10) }} ~ {{ lform.hqEnd.slice(0, 10) }}</div>
<!-- :picker-options="pickerOptions"-->
</el-form-item>
<el-form-item :label="language==0?'房间数':'Rooms'" required prop="roomNum">
<el-input-number v-model="form.roomNum" :min="0" :max="canOrderNum" @change="changeRoomNum"/>
<div class="red ml20" v-if="rzRange[1]">
<div class="red ml20" v-if="rzRange?.[1]">
<span v-if="language == 0">剩余房间数:{{ canOrderNum }}</span>
<span v-else>{{ canOrderNum }} Remaining rooms</span>
</div>
......@@ -249,7 +251,9 @@ const ddDateArr = ref([
label: '02:00'
}
])
const rules = ref({})
const rules = ref({
phone: { required: true, message: language.value==0? '请输入联系电话':"Please enter a contact number", trigger: 'blur' }
})
let usedays = 0
onMounted(() => {
......@@ -258,7 +262,11 @@ onMounted(() => {
console.log(room.value)
hotelName.value = route.query.hotelName
money.value = 0
rzRange.value=[]
rzRange.value=[route.query.start,route.query.end]
initDays()
getDaysBetween()
// checkreRooms()
})
function initDays() {
getBaseInfoByActiveId(route.params.cptId).then(res=>{
......@@ -318,9 +326,11 @@ function checkreRooms() {
}
function getDaysBetween(e) {
console.log('入住时间arr', e, rzRange.value)
var d1 = Date.parse(e[0])
var d2 = Date.parse(e[1])
// console.log('入住时间arr', e, rzRange.value)
// console.log(e)
// console.log(Date.parse(rzRange.value[0]))
var d1 = Date.parse(rzRange.value?rzRange.value[0]:null)
var d2 = Date.parse(rzRange.value?rzRange.value[1]:null)
if (d1 == d2) {
usedays = 0
ElMessage.error(language == 0 ? '入住时间跨度需大于一天' :'The duration of the stay must be more than one day.')
......@@ -332,9 +342,10 @@ function getDaysBetween(e) {
usedays = days
}
countMoney()
var startTime = getDate(rzRange.value[0]);
var endTime = getDate(rzRange.value[1]);
var startTime = getDate(rzRange.value?rzRange.value[0]:null);
var endTime = getDate(rzRange.value?rzRange.value[1]:null);
var dateArr = [];
if (!startTime||!endTime)return;
while ((endTime.getTime() - startTime.getTime()) > 0) {
var year = startTime.getFullYear();
var month = (startTime.getMonth() + 1).toString().length === 1 ? "0" + (parseInt(startTime.getMonth()
......@@ -348,6 +359,7 @@ function getDaysBetween(e) {
}
function getDate(datestr) {
if (!datestr) return
var temp = datestr.split("-");
if (temp[1] === '01') {
temp[0] = parseInt(temp[0], 10) - 1;
......@@ -364,12 +376,12 @@ function countMoney() {
if (language.value == 0) {
money.value = ((room.value.roomPrice * form.value.roomNum * usedays) + (room.value.bedPrice * form.value
.addNum * usedays)).toFixed(2)
} else {
money.value = ((room.value.roomPriceEn * form.value.roomNum * usedays) + (room.value.bedPriceEn * form.value
.addNum * usedays)).toFixed(2)
}
// console.log(usedays,money.value)
if (money.value == 'NaN') money.value=0.00
}
function submit() {
......@@ -377,7 +389,7 @@ function submit() {
useUserStore().setReLogin()
return
}
if(!rzRange.value)return ElMessage.warning(language.value == 0 ? '请选择入住时间' : 'Please select check-in time')
if (usedays == 0) {
ElMessage.warning(language.value == 0 ? '入住时间跨度需大于一天' : 'Check-in time must be greater than one day')
return
......@@ -390,6 +402,7 @@ function submit() {
ElMessage.warning(language.value == 0 ? '请填写手机号' : 'Please fill in the phone number')
return
}
form.value.rzStart = rzRange.value[0]
form.value.rzEnd = rzRange.value[1]
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!