Skip to content
Toggle navigation
Toggle navigation
This project
Loading...
Sign in
杨炀
/
dance-pc
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Pipelines
Graphs
Issues
0
Merge Requests
0
Wiki
Network
Create a new issue
Builds
Commits
Issue Boards
Files
Commits
Network
Compare
Branches
Tags
0491bdfe
authored
2024-05-22 17:01:05 +0800
by
zhangmeng
Browse Files
Options
Browse Files
Tag
Download
Plain Diff
Merge branch 'hotel' into bug-order
2 parents
ad624431
c4e194be
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
114 additions
and
24 deletions
src/viewsPc/booking/hotelDetail.vue
src/viewsPc/booking/hotelOrder.vue
src/viewsPc/booking/hotelDetail.vue
View file @
0491bdf
...
...
@@ -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
>
...
...
src/viewsPc/booking/hotelOrder.vue
View file @
0491bdf
...
...
@@ -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
]
...
...
Write
Preview
Styling with
Markdown
is supported
Attach a file
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to post a comment