Skip to content
Toggle navigation
Toggle navigation
This project
Loading...
Sign in
jijin
/
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
1ee42f4b
authored
2024-05-23 12:02:44 +0800
by
杨炀
Browse Files
Options
Browse Files
Tag
Download
Plain Diff
Merge commit '
d69b2fe1
' into dev
2 parents
5b1e4620
d69b2fe1
Hide whitespace changes
Inline
Side-by-side
Showing
5 changed files
with
189 additions
and
35 deletions
src/viewsPc/booking/hotel.vue
src/viewsPc/booking/hotelDetail.vue
src/viewsPc/booking/hotelOrder.vue
src/viewsPc/booking/pay.vue
src/viewsPc/center/myReservation.vue
src/viewsPc/booking/hotel.vue
View file @
1ee42f4
...
...
@@ -82,6 +82,8 @@
booking
.
getHotelList
(
query
.
value
).
then
(
res
=>
{
list
.
value
=
res
.
rows
loading
.
value
=
false
console
.
log
(
list
.
value
)
}).
catch
(
e
=>
{
loading
.
value
=
false
})
...
...
src/viewsPc/booking/hotelDetail.vue
View file @
1ee42f4
...
...
@@ -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,13 @@
<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)"
>
订
<div>
{{
language
==
0
?
'在线付'
:
'Online'
}}
</div>
</div>
<el-button
v-else
class=
"btn-lineG w100"
round
type=
"primary"
@
click=
"goOrder(r)"
>
Select
</el-button>
<el-button
v-if=
"language==0"
:disabled=
"!r.useCount"
:class=
"
{'forbid':!r.useCount}" @click="goOrder(r)" class="bg-lineg button">
订
<div>
{{
language
==
0
?
'在线付'
:
'Online'
}}
</div>
</el-button>
<el-button
v-else
:disabled=
"!r.useCount"
class=
"btn-lineG w100"
:class=
"
{'forbid':!r.useCount}" 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 +125,14 @@
</div>
</
template
>
<
script
setup
lang=
"ts"
>
<
script
setup
>
import
{
useRouter
}
from
"vue-router"
;
import
{
ref
,
reactive
,
onMounted
}
from
"vue"
;
import
{
ref
,
reactive
,
onMounted
,
getCurrentInstance
}
from
"vue"
;
import
{
useRoute
}
from
"vue-router"
;
import
{
dayjs
}
from
'element-plus'
import
{
getHotelById
,
getHotelRooms
,
checkRoomPayByUserId
}
from
"@/apiPc/booking"
import
{
getBaseInfoByActiveId
}
from
"@/apiPc/booking"
;
const
{
proxy
}
=
getCurrentInstance
()
import
{
useStorage
}
from
"@vueuse/core/index"
;
import
useUserStore
from
"@/store/modules/user"
;
...
...
@@ -129,12 +146,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 +186,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 +249,7 @@ function goOrder(room) {
).
then
((
res
)
=>
{
console
.
log
(
res
)
router
.
push
({
name
:
'myReservation'
name
:
'myReservation'
,
})
})
// .catch((res) => {
...
...
@@ -230,10 +271,41 @@ 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
)
if
(
hotTime
.
value
&&
hotTime
.
value
.
length
==
2
){
const
d1
=
dayjs
(
hotTime
.
value
[
0
]).
format
(
'YYYY-MM-DD'
)
const
d2
=
dayjs
(
hotTime
.
value
[
1
]).
format
(
'YYYY-MM-DD'
)
if
(
d1
==
d2
){
hotTime
.
value
=
[]
return
proxy
.
$modal
.
msgError
(
language
.
value
==
0
?
'入住时间跨度需要大于一天'
:
'The duration of the stay must be more than one day.'
)
}
else
{
getData
()
}
}
}
// function disabledDateRZ(date) {
// //判读今天大与form.value.hqStart
// console.log(date)
// 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 +314,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"
>
...
...
@@ -296,6 +369,19 @@ function goMap() {
}
}
}
:deep
(
.button
)
{
display
:
block
;
height
:
55px
;
width
:
auto
;
color
:
#fff
;
span{
display
:
block
!important
;
div{
margin-top
:
3px
;
}
}
}
.starBox
{
img
{
...
...
@@ -363,4 +449,9 @@ function goMap() {
.el-icon{
margin-right
:
5px
;}
}
.oddmb
:nth-child
(
2
)
{
margin-bottom
:
20px
;}
.forbid
{
cursor
:
not-allowed
!important
;
color
:
#a8abb2
;
filter
:
grayscale
(
1
);
}
</
style
>
...
...
src/viewsPc/booking/hotelOrder.vue
View file @
1ee42f4
...
...
@@ -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
]
...
...
src/viewsPc/booking/pay.vue
View file @
1ee42f4
...
...
@@ -603,7 +603,7 @@ const unsubscribe = () => {
return
cancelOrder
(
orderId
.
value
).
then
(
res
=>
{
getData
()
ElMessage
({
message
:
language
.
value
==
0
?
'
操作成功'
:
'Successful operation
!'
,
message
:
language
.
value
==
0
?
'
已提交退款,请等待审核!'
:
'Refund has been submitted, please wait for review
!'
,
type
:
'success'
})
})
...
...
src/viewsPc/center/myReservation.vue
View file @
1ee42f4
...
...
@@ -32,7 +32,7 @@
</div>
<el-row
class=
"pd20 mt10"
justify=
"space-between"
align=
"middle"
>
<el-col
:lg=
"
10
"
>
<el-col
:lg=
"
9
"
>
<div
v-if=
"b.orderType == 0"
>
<h3
class=
"name"
>
{{
b
.
name
}}
</h3>
<p
v-if=
"language==0"
>
{{
b
.
messageObj
?.
roomStayDate
}}
</p>
...
...
@@ -78,23 +78,29 @@
<p>
{{
b
.
extJsonObj
.
packageName
}}
</p>
</div>
</el-col>
<el-col
:lg=
"
4
"
class=
"text-center"
>
<el-col
:lg=
"
3
"
class=
"text-center"
>
<span
class=
"text-warning"
>
{{
language
==
0
?
'¥'
:
'€'
}}
<span
class=
"bigMoney"
>
{{
language
==
0
?
b
.
total
:
b
.
totalEn
}}
</span>
</span>
</el-col>
<el-col
:lg=
"
4
"
>
<el-col
:lg=
"
6
"
>
<div
class=
"text-right mb20 text-danger"
>
<el-countdown
value-style=
"color:#E60012;font-size:16px;"
v-if=
"b.status == '0'&&(b.surplus!='0,0'&&b.surplus!='0')"
format=
"mm:ss"
:value=
"b.countdown"
@
finish=
"finish(b)"
/>
</div>
<div
class=
"text-right"
>
<el-button
v-if=
"b.orderType == 0"
class=
"mb10"
plain
round
type=
"success"
@
click=
"Rebook(b)"
>
{{
language
==
0
?
'再次预订'
:
'Rebook'
}}
</el-button>
<el-button
class=
"mb10"
plain
round
type=
"primary"
@
click=
"goDetail(b)"
>
{{
language
==
0
?
'详情'
:
'Detail'
}}
</el-button>
<el-button
v-if=
"b.status == '0'&&(b.surplus!='0,0'&&b.surplus!='0')"
@
click=
"goDetail(b)"
class=
"mb10"
plain
round
type=
"primary"
>
{{
language
==
0
?
'支付'
:
'Pay'
}}
</el-button>
<el-button
v-if=
"b.viewStatus==0"
@
click=
"cancel(b)"
class=
"mb10"
plain
round
type=
"warning"
>
{{
language
==
0
?
'取消订单'
:
'Cancel Order'
}}
</el-button>
<el-button
v-if=
"b.viewStatus==5"
@
click=
"unsubscribe(b)"
class=
"mb10"
plain
round
type=
""
>
{{
language
==
0
?
'退订'
:
'Unsubscribe'
}}
</el-button>
</div>
</el-col>
</el-row>
...
...
@@ -107,15 +113,18 @@
</
template
>
<
script
setup
>
import
{
onMounted
}
from
"@vue/runtime-core"
;
import
{
onMounted
,
getCurrentInstance
}
from
"@vue/runtime-core"
;
import
{
useStorage
}
from
"@vueuse/core/index"
;
import
{
newbilllist
}
from
"@/apiPc/common"
;
import
useUserStore
from
"@/store/modules/user"
;
import
dayjs
from
'dayjs'
import
{
cancelOrder2
,
cancelOrder
}
from
"/@/apiPc/booking"
;
const
router
=
useRouter
()
const
language
=
useStorage
(
'language'
,
0
)
const
list
=
ref
([])
const
user
=
useUserStore
().
user
const
{
proxy
}
=
getCurrentInstance
()
onMounted
(()
=>
{
getList
()
...
...
@@ -132,10 +141,8 @@ function getList() {
b
.
extJsonObj
=
JSON
.
parse
(
b
.
extJson
)
||
{}
if
(
b
.
surplus
&&
b
.
status
==
'0'
&&
(
b
.
surplus
!=
'0,0'
&&
b
.
surplus
!=
'0'
)){
b
.
countdown
=
Date
.
now
()
+
Number
((
b
.
surplus
.
split
(
','
)[
0
]
*
60
+
b
.
surplus
.
split
(
','
)[
1
])
*
10
)
console
.
log
(
b
.
countdown
)
}
}
console
.
log
(
list
.
value
)
})
}
function
goDetail
(
b
)
{
...
...
@@ -147,6 +154,47 @@ function goDetail(b) {
}
})
}
function
Rebook
(
row
){
console
.
log
(
row
)
router
.
push
({
name
:
'hotelDetail'
,
params
:{
cptId
:
row
.
activeId
,
hotelId
:
row
.
hotelId
},
query
:{
id
:
row
.
extId
}
})
}
const
cancel
=
(
row
)
=>
{
//取消订单
proxy
.
$modal
.
confirm
(
language
.
value
==
0
?
'确定取消订单吗 ?'
:
`Are you sure to cancel the order?`
).
then
(()
=>
{
return
cancelOrder2
(
row
.
id
).
then
(
res
=>
{
getList
()
ElMessage
({
message
:
language
.
value
==
0
?
'操作成功'
:
'Successful operation!'
,
type
:
'success'
})
})
})
}
const
unsubscribe
=
(
row
)
=>
{
proxy
.
$modal
.
confirm
(
language
.
value
==
0
?
`确定退款吗 ?`
:
'Are you sure to refund?'
).
then
(()
=>
{
return
cancelOrder
(
row
.
id
).
then
(
res
=>
{
getList
()
ElMessage
({
message
:
language
.
value
==
0
?
'已提交退款,请等待审核!'
:
'Refund has been submitted, please wait for review!'
,
type
:
'success'
})
})
})
}
function
toInvoice
(){
router
.
push
({
name
:
'invoice'
...
...
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