Skip to content

jijin / dance-pc

Go to a project
Toggle navigation
Toggle navigation pinning
5806eea2 by 杨炀
Options

no message

1 parent f6493de3
Inline Side-by-side
Showing 7 changed files with 478 additions and 61 deletions
src/apiPc/booking.js
...@@ -21,3 +21,18 @@ export function getHotelRooms(id) { ...@@ -21,3 +21,18 @@ export function getHotelRooms(id) {
21 } 21 }
22 }) 22 })
23 } 23 }
24
25 export function checkResidueRoom(data) {
26 return request({
27 url: `/ota/orderRoom/checkResidueRoom`,
28 method: 'post',
29 data: data
30 })
31 }
32 export function newsSubmitOrderHotel(data) {
33 return request({
34 url: `/ota/norder/submitOrderRoom`,
35 method: 'post',
36 data: data
37 })
38 }
......
src/routerPc/en.js
...@@ -362,6 +362,12 @@ export const constantRoutes = [ ...@@ -362,6 +362,12 @@ export const constantRoutes = [
362 meta: { title: 'Hotel Reservation' } 362 meta: { title: 'Hotel Reservation' }
363 }, 363 },
364 { 364 {
365 path: 'hotel/:cptId/:hotelId/:roomId',
366 component: () => import('@/viewsPc/booking/hotelOrder'),
367 name: 'hotelOrder',
368 meta: { title: 'Hotel Reservation' }
369 },
370 {
365 path: 'car/:cptId', 371 path: 'car/:cptId',
366 component: () => import('@/viewsPc/booking/car'), 372 component: () => import('@/viewsPc/booking/car'),
367 name: 'car', 373 name: 'car',
......
src/viewsPc/booking/hotel.vue
...@@ -61,8 +61,8 @@ ...@@ -61,8 +61,8 @@
61 const list = ref([]) 61 const list = ref([])
62 const loading = ref(false) 62 const loading = ref(false)
63 onMounted(()=>{ 63 onMounted(()=>{
64 query.value.activityId = route.params.cptId
64 getList() 65 getList()
65 cptId.value = route.params.cptId
66 }) 66 })
67 67
68 function getList() { 68 function getList() {
...@@ -78,7 +78,8 @@ ...@@ -78,7 +78,8 @@
78 router.push({ 78 router.push({
79 name:'hotelDetail', 79 name:'hotelDetail',
80 params:{ 80 params:{
81 hotelId:item.hotelId 81 hotelId:item.hotelId,
82 id:item.id
82 } 83 }
83 }) 84 })
84 } 85 }
......
src/viewsPc/booking/hotelDetail.vue
1 <template> 1 <template>
2 <div> 2 <div>
3 <div class="box"> 3 <div class="box">
4 <el-card class="mt30"> 4 <el-card class="mt30" v-loading="loading">
5 <el-row class="hotel" align="middle" :gutter="20"> 5 <el-row v-if="form" class="hotel" align="middle" :gutter="20">
6 <!-- <el-col :span="6">--> 6 <!-- <el-col :span="6">-->
7 <!-- <img class="w100" :src="fillImgUrl(form.photos?.split(',')[0])"/>--> 7 <!-- <img class="w100" :src="fillImgUrl(form.photos?.split(',')[0])"/>-->
8 <!-- </el-col>--> 8 <!-- </el-col>-->
9 <el-col :span="16"> 9 <el-col :span="16">
10 <h3 class="esp">{{form.name}}</h3> 10 <h3 class="esp flex">{{ form?.name }}
11 <div class="starBox"> 11 <div class="starBox">
12 <img v-for="i in Number(form.starLevel||0)" src="@/assets/booking/star.png"> 12 <img v-for="i in Number(form?.starLevel||0)" src="@/assets/booking/star.png">
13 </div> 13 </div>
14 </h3>
15
14 <div class="tagbox"> 16 <div class="tagbox">
15 <span v-for="(t,index) in form.label?.split('，')" v-show="index<4">{{t}}</span> 17 <span v-for="(t,index) in form?.label?.split('，')" v-show="index<4">{{ t }}</span>
16 <a v-show="form.label?.split('，').length>4">{{ language==0?'更多':'MORE' }} ></a> 18 <a v-show="form?.label?.split('，').length>4">{{ language == 0 ? '更多' : 'MORE' }} ></a>
17 </div> 19 </div>
18 <div> 20 <div>
19 <el-icon></el-icon> 21 <el-icon></el-icon>
20 <span class="mr10">{{ language==0?'入住时间':'Check-in' }}：{{form.checkInTime}}</span> 22 <span class="mr10">{{ language == 0 ? '入住时间' : 'Check-in' }}：{{ form?.checkInTime }}</span>
21 <span>{{ language==0?'离店时间':'Check-out' }}：{{form.checkOutTime}}</span> 23 <span>{{ language == 0 ? '离店时间' : 'Check-out' }}：{{ form?.checkOutTime }}</span>
22 </div> 24 </div>
23 <div v-if="form.introduction" class="flex esp"> 25 <div v-if="form?.introduction" class="flex esp">
24 <el-icon></el-icon> 26 <el-icon></el-icon>
25 {{ language==0?'酒店简介':'Introduction' }}：<span v-html="form.introduction.toString()"></span> 27 {{ language == 0 ? '酒店简介' : 'Introduction' }}：<span v-html="form.introduction.toString()"></span>
26 </div> 28 </div>
27 <p class="esp addr"> 29 <!-- <p class="esp addr">-->
28 <el-icon size="16" style="position: relative;top: 2px" color="#929AA0"><LocationFilled /></el-icon> 30 <!-- <el-icon size="16" style="position: relative;top: 2px" color="#929AA0"><LocationFilled /></el-icon>-->
29 {{form.address}} 31 <!-- {{form?.address}}-->
30 </p> 32 <!-- </p>-->
31 </el-col> 33 </el-col>
32 <el-col :span="8" class="text-right"> 34 <el-col :span="8" class="text-right">
33 <div class="mapBox"> 35 <div class="mapBox">
...@@ -35,33 +37,62 @@ ...@@ -35,33 +37,62 @@
35 </div> 37 </div>
36 </el-col> 38 </el-col>
37 </el-row> 39 </el-row>
40 <el-empty v-else :image="`/img/order_no.png`" :image-size="228" description=""/>
38 </el-card> 41 </el-card>
39 42
40 <div class="mt30"> 43 <div class="mt30">
41 <div v-for="p in form.photos?.split(',')"> 44 <el-row :gutter="20">
42 <img :src="fillImgUrl(p)"> 45 <el-col v-for="(p,index) in form?.photos?.split(',')" :span="index==0?12:6">
43 </div> 46 <div class="imgbox hotelImg">
47 <img :src="fillImgUrl(p)">
48 </div>
49 </el-col>
50 </el-row>
44 </div> 51 </div>
45 52
46 <el-card class="mt30 mb60"> 53 <el-card class="mt30 mb60">
47 <div class="lineHead"> 54 <div class="lineHead">
48 <ul><li>{{language==0?'房型选择':'Room Type'}}</li></ul> 55 <ul>
56 <li>{{ language == 0 ? '房型选择' : 'Room Type' }}</li>
57 </ul>
49 </div> 58 </div>
50
51 <div> 59 <div>
52 <div v-for="(r,index) in roomList" :key="index" class="room"> 60 <div v-for="(r,index) in roomList" :key="index" class="room" @click="goOrder(r)">
53 <el-row> 61 <el-row :gutter="30" align="middle">
54 <el-col :span="6"> 62 <el-col :span="4">
55 <div class="roomImg"> 63 <div class="roomImg">
56 <img :src="fillImgUrl(r.photos?.split(',')[0])"> 64 <img :src="fillImgUrl(r.photo?.split(',')[0])">
57 </div> 65 </div>
58 </el-col> 66 </el-col>
59 <el-col :span="14"> 67 <el-col :span="14">
68 <h3 class="name">{{ r.roomType }}</h3>
69 <el-row :gutter="10">
70 <el-col :span="8">{{ r.area }}m²</el-col>
71 <el-col :span="8" v-show="r.windowFlag==1"> 有窗</el-col>
72 <el-col :span="8" v-show="r.windowFlag==0"> 无窗</el-col>
73 <el-col :span="8" v-show="r.bathroomFlag==1"> 热水洗浴</el-col>
74 <!-- <text v-show="r.bathroomFlag==0"> </text> -->
75 <el-col :span="8" v-show="r.addBedFlag==1"> 允许加床 </el-col>
76 <el-col :span="8" v-if="r.breakfastNum&&r.breakfastNum > '0'">{{ r.breakfastNum }}份早餐</el-col>
77 <el-col :span="8" v-else>无早餐</el-col>
78 </el-row>
60 </el-col> 79 </el-col>
61 <el-col :span="4"> 80 <el-col :span="3">
81 <div class="price">¥<span>{{r.roomPrice}}</span></div>
82 </el-col>
83 <el-col :span="3">
84
85 <div class="bg-lineg">
86 订
87 <div>在线付</div>
88 </div>
89 <div class="text-center text-primary mt10 fontsize14"> 剩余 {{(r.roomCount - (r.useCount||0)).toFixed()}} 间</div>
90
62 </el-col> 91 </el-col>
63 </el-row> 92 </el-row>
64 </div> 93 </div>
94
95 <el-empty v-if="roomList.length == 0" :image="`/img/order_no.png`" :image-size="228" description=""/>
65 </div> 96 </div>
66 </el-card> 97 </el-card>
67 </div> 98 </div>
...@@ -72,28 +103,34 @@ ...@@ -72,28 +103,34 @@
72 import {useRouter} from "vue-router"; 103 import {useRouter} from "vue-router";
73 import {ref, reactive, onMounted} from "vue"; 104 import {ref, reactive, onMounted} from "vue";
74 import {useRoute} from "vue-router"; 105 import {useRoute} from "vue-router";
75 import { getHotelById,getHotelRooms } from "@/apiPc/booking" 106 import {getHotelById, getHotelRooms} from "@/apiPc/booking"
76 import {useStorage} from "@vueuse/core/index"; 107 import {useStorage} from "@vueuse/core/index";
77 const language= useStorage('language',0) 108
109 const language = useStorage('language', 0)
78 const router = useRouter() 110 const router = useRouter()
79 const route = useRoute() 111 const route = useRoute()
80 const form = ref({}) 112 const form = ref({})
113 const loading = ref(false)
81 const roomList = ref([]) 114 const roomList = ref([])
82 const map = ref(null) 115 const map = ref(null)
83 onMounted(()=>{ 116 onMounted(() => {
84 getData() 117 getData()
85 }) 118 })
119
86 function getData() { 120 function getData() {
121 loading.value = true
87 getHotelById(route.params.hotelId).then(res => { 122 getHotelById(route.params.hotelId).then(res => {
123 loading.value = false
88 form.value = res.data 124 form.value = res.data
89 initMap() 125 initMap()
90 }).catch(err => { 126 }).catch(err => {
91 console.log(err) 127 console.log(err)
92 }) 128 })
93 getHotelRooms(route.params.hotelId).then(res => { 129 getHotelRooms(route.query.id).then(res => {
94 roomList.value = res.rows 130 roomList.value = res.rows
95 }) 131 })
96 } 132 }
133
97 function initMap() { 134 function initMap() {
98 const TMap = (window as any).TMap 135 const TMap = (window as any).TMap
99 var center = new TMap.LatLng(form.value.latitude, form.value.longitude);//设置中心点坐标' 136 var center = new TMap.LatLng(form.value.latitude, form.value.longitude);//设置中心点坐标'
...@@ -104,10 +141,10 @@ function initMap() { ...@@ -104,10 +141,10 @@ function initMap() {
104 var infoWindowLocation = new TMap.LatLng(form.value.latitude, form.value.longitude);//创建一个坐标 141 var infoWindowLocation = new TMap.LatLng(form.value.latitude, form.value.longitude);//创建一个坐标
105 //创建InfoWindow实例，并进行初始化 142 //创建InfoWindow实例，并进行初始化
106 var infowindow = new TMap.InfoWindow({ 143 var infowindow = new TMap.InfoWindow({
107 content: form.value.name, //信息窗口内容 144 content: form.value.address, //信息窗口内容
108 position:infoWindowLocation,//显示信息窗口的坐标 145 position: infoWindowLocation,//显示信息窗口的坐标
109 map:map, 146 map: map,
110 offset: { x: 0, y: -32 } 147 offset: {x: 0, y: -32}
111 }); 148 });
112 infowindow.close(); 149 infowindow.close();
113 var marker = new TMap.MultiMarker({ 150 var marker = new TMap.MultiMarker({
...@@ -115,7 +152,7 @@ function initMap() { ...@@ -115,7 +152,7 @@ function initMap() {
115 //样式定义 152 //样式定义
116 styles: { 153 styles: {
117 "myStyle": new TMap.MarkerStyle({ 154 "myStyle": new TMap.MarkerStyle({
118 "anchor": { x: 16, y: 32 } 155 "anchor": {x: 16, y: 32}
119 }) 156 })
120 }, 157 },
121 //点标记数据数组 158 //点标记数据数组
...@@ -135,35 +172,133 @@ function initMap() { ...@@ -135,35 +172,133 @@ function initMap() {
135 infowindow.setPosition(evt.geometry.position);//设置信息窗位置 172 infowindow.setPosition(evt.geometry.position);//设置信息窗位置
136 }) 173 })
137 } 174 }
175
176 function goOrder(room) {
177 router.push({
178 name:'hotelOrder',
179 params:{
180 roomId:room.id
181 },
182 query:{
183 room:encodeURIComponent(JSON.stringify(room)),
184 hotelName:form.value.name,
185 checkInTime:form.value.checkInTime
186 }
187 })
188 }
138 </script> 189 </script>
139 190
140 <style scoped lang="scss"> 191 <style scoped lang="scss">
141 .room{background: #FAFBFD; 192 .room {
142 border: 1px solid #E5E5E5;} 193 background: #FAFBFD;margin: 20px 0 0;padding: 20px;
143 .hotel{ 194 border: 1px solid #E5E5E5;
144 h3{margin: 0 0 20px;} 195 .name{font-size: 20px;margin: 0 0 10px;}
145 img.w100{object-fit: cover;aspect-ratio: 16/9} 196 .roomImg{aspect-ratio: 16/9;border-radius: 10px;overflow: hidden;
146 .addr{font-size: 16px;color: #929AA0;font-weight: 400;} 197 img{width: 100%;object-fit: cover;object-position: center;height: 100%;}
147 .price{margin: 0 0 25px; 198 }
148 color: #FF8124;font-size: 18px; 199 .price{color: #FF8124;font-size: 24px;
149 span{font-size: 24px;margin: 0 8px;font-family: 'DINAlternate-Bold';font-weight: 600;} 200 span{font-size: 36px;font-family: "DIN Alternate"}
150 i{font-style: normal;color: #929AA0;} 201 }
202 .bg-lineg{margin: auto;border-radius: 10px;text-align: center;padding: 7px 2px 2px;
203 font-size: 24px;width:66px;
204 div{background: #fff;font-size: 13px;border-radius: 20px;padding: 0 10px;
205 color: #453DEA;font-weight: 500;}
206 }
151 } 207 }
208
209 .hotel {
210 h3 {
211 margin: 0 0 20px;
212 }
213
214 img.w100 {
215 object-fit: cover;
216 aspect-ratio: 16/9
217 }
218
219 .addr {
220 font-size: 16px;
221 color: #929AA0;
222 font-weight: 400;
223 }
224
225 .price {
226 margin: 0 0 25px;
227 color: #FF8124;
228 font-size: 18px;
229
230 span {
231 font-size: 24px;
232 margin: 0 8px;
233 font-family: 'DINAlternate-Bold';
234 font-weight: 600;
235 }
236
237 i {
238 font-style: normal;
239 color: #929AA0;
240 }
241 }
152 } 242 }
153 .starBox{ 243
154 img{display: inline-block;margin-right: 4px} 244 .starBox {
245 img {
246 display: inline-block;
247 margin-right: 4px
248 }
155 } 249 }
156 .tagbox{margin: 15px 0; 250
157 a{color: #AFB5B9;font-size: 12px;} 251 .tagbox {
158 span{border-radius: 13px;font-size: 12px;padding: 4px 10px;margin-right:10px;font-weight: 400;} 252 margin: 15px 0;
159 span:nth-child(4n){background: rgba(50, 177, 108, 0.2);color: rgba(50, 177, 108, 1);} 253
160 span:nth-child(4n+1){background:rgba(243, 152, 0, 0.2);color: rgba(243, 152, 0, 1);} 254 a {
161 span:nth-child(4n+2){background: rgba(0, 160, 233, 0.2);color: rgba(0, 160, 233, 1);} 255 color: #AFB5B9;
162 span:nth-child(4n+3){background: rgba(247, 64, 166, 0.2);color:rgba(247, 64, 166, 1);} 256 font-size: 12px;
257 }
258
259 span {
260 border-radius: 13px;
261 font-size: 12px;
262 padding: 4px 10px;
263 margin-right: 10px;
264 font-weight: 400;
265 }
266
267 span:nth-child(4n) {
268 background: rgba(50, 177, 108, 0.2);
269 color: rgba(50, 177, 108, 1);
270 }
271
272 span:nth-child(4n+1) {
273 background: rgba(243, 152, 0, 0.2);
274 color: rgba(243, 152, 0, 1);
275 }
276
277 span:nth-child(4n+2) {
278 background: rgba(0, 160, 233, 0.2);
279 color: rgba(0, 160, 233, 1);
280 }
281
282 span:nth-child(4n+3) {
283 background: rgba(247, 64, 166, 0.2);
284 color: rgba(247, 64, 166, 1);
285 }
163 } 286 }
164 .mapBox{ position: relative;overflow: hidden;height: 200px; 287
165 #map{ position: relative;left: -70px; 288 .mapBox {
289 position: relative;
290 overflow: hidden;
291 height: 200px;
292
293 #map {
294 position: relative;
295 left: -70px;
166 width: calc(100% + 160px); 296 width: calc(100% + 160px);
167 } 297 }
168 } 298 }
299
300 .hotelImg{border-radius: 10px;overflow: hidden;aspect-ratio: 16/9;
301 img{object-fit: cover;object-position: center;width: 100%;height: 100%;
302 }
303 }
169 </style> 304 </style>
......
src/viewsPc/booking/hotelOrder.vue 0 → 100644
1 <template>
2 <div>
3 <div class="box">
4 <el-card :body-style="{ padding: '0px' }" class="mt20">
5 <div slot="header">
6 <div class="bg-lineg">{{ language == 0 ? '酒店预约下单' : 'Hotel booking order' }}</div>
7 </div>
8
9 <el-row class="pd20" :gutter="20">
10 <el-col :span="14" >
11 <div class="border-info">
12 <h3>{{hotelName}}</h3>
13 <!-- <div class="roomType">{{room.roomType}}</div>-->
14 <div class="room">
15 <span>{{room.bedType}}</span>
16 <span>{{ ' | ' + room.area}}m²</span>
17 <span>{{ ' | ' + room.occupantsNum}}人入住</span>
18 <span v-show="room.breakfastFlag=='1'">{{ ' | ' + room.breakfastNum}} 份早餐</span>
19 <span v-show="room.breakfastFlag=='0'"> | 无早餐</span>
20 <span v-show="room.bathroomFlag=='1'"> | 独立卫生间</span>
21 <span v-show="room.windowFlag=='1'"> | 有窗</span>
22 <span v-show="room.addBedFlag=='1'"> | 允许加床</span>
23 </div>
24 </div>
25
26 <div class="leftboderTT">{{ language == 0 ? '预约信息' : 'Reservation information' }}</div>
27 <div class="border-rr mt20 pd20">
28 <el-form :model="form" label-width="100px">
29 <el-form-item label="入住日期">
30 <el-date-picker
31 v-model="rzRange"
32 type="daterange"
33 placeholder="选择日期"
34 value-format="yyyy-MM-dd"
35 :picker-options="pickerOptions"
36 />
37 </el-form-item>
38 <el-form-item label="房间数">
39 <el-input-number v-model="form.roomNum" :min="0" :max="canOrderNum" @change="changeRoomNum" />
40 <div class="red" v-if="rzRange[1]" style="margin:0 8px;display: block;width: 8em;">
41 <span>剩余房间数:{{canOrderNum}}</span>
42 </div>
43 </el-form-item>
44 <el-form-item v-for="(n,index) in form.roomNum" :key="index" :label="`入住人${index+1}`">
45 <el-input v-model="rzUserArr[index]" placeholder="每间填一位住客姓名"/>
46 </el-form-item>
47 <el-form-item label="预计到店">
48
49 </el-form-item>
50 <el-form-item label="联系电话">
51 <el-input v-model="form.phone"/>
52 </el-form-item>
53
54 <div v-if="room.addBedFlag=='1'">
55 <el-form-item label="是否加床">
56 <el-radio-group>
57 <el-radio v-model="form.isAddbed" label="1">是</el-radio>
58 <el-radio v-model="form.isAddbed" label="0">否</el-radio>
59 </el-radio-group>
60 </el-form-item>
61 <el-form-item label="加床张数">
62 <el-input-number v-model="form.addNum" :min="0" :max="1" @change="changeBed" />
63 </el-form-item>
64 <div class="tip" v-if="form.isAddbed=='1'">* 一个房间最多加一张床</div>
65 </div>
66 </el-form>
67 </div>
68 </el-col>
69 <el-col :span="10">
70 <div class="leftboderTT">{{ language == 0 ? '订单明细' : 'Order details' }}</div>
71 <div class="border-rr mt20 pd20 ccitemBox">
72 <label> 房费
73 <span class="fr">¥{{(room.roomPrice*form.roomNum*choseRooms.length).toFixed(2)}}</span>
74 </label>
75 <div class="ccitem" v-for="(c, index) in choseRooms" :key="index">
76 {{ c }}
77 <text>{{form.roomNum}}*¥{{room.roomPrice}}</text>
78 </div>
79
80 <label v-if="form.isAddbed=='1'">加床费
81 <span class="fr">¥{{(room.bedPrice*form.addNum*choseRooms.length).toFixed(2)}}</span>
82 </label>
83
84 <div v-if="form.isAddbed=='1'" class="ccitem" v-for="(c, index) in choseRooms" :key="index">
85 {{ c }}
86 <text>{{form.addNum}}*¥{{room.bedPrice}}</text>
87 </div>
88
89 <label>共计<span class="fr bigMoney">¥{{money}}</span></label>
90
91 </div>
92 </el-col>
93 </el-row>
94 </el-card>
95 <div style="height: 60px;"></div>
96
97 </div>
98 </div>
99 </template>
100
101 <script setup>
102 import {useRouter,useRoute} from "vue-router";
103 import {ref, reactive, onMounted} from "vue";
104 import {useStorage} from "@vueuse/core/index";
105 import { checkResidueRoom,newsSubmitOrderHotel } from "@/apiPc/booking"
106 import dayjs from 'dayjs'
107 import {ElMessage} from "element-plus";
108 const language = useStorage('language', 0)
109 const router = useRouter()
110 const route = useRoute()
111 const room = ref({})
112 const hotelName = ref('')
113 const canOrderStart = ref('')
114 const canOrderNum = ref(0)
115 const form = ref({
116 roomNum: 0,
117 addNum: 0
118 })
119 const rzRange = ref([])
120 const rzUserArr = ref([])
121 const money = ref(0)
122 const choseRooms = ref([])
123 let usedays = 0
124 onMounted(()=>{
125 console.log(route.query)
126 room.value = JSON.parse(decodeURIComponent(route.query.room))
127 hotelName.value = route.query.hotelName
128 money.value = 0
129 const today = dayjs()
130 canOrderStart.value = today
131 if (room.value.hqNewStart < canOrderStart.value) {
132 room.value.hqNewStart = canOrderStart.value
133 }
134 })
135 function changeRoomNum(e) {
136 if (form.value.addNum > e) {
137 form.value.addNum = e
138 }
139 countMoney()
140 }
141 function changeBed() {
142 countMoney()
143 }
144 function checkreRooms() {
145 var obj = {
146 ahrId: room.value.id,
147 rzStart: rzRange.value[0],
148 rzEnd: rzRange.value[1]
149 }
150 checkResidueRoom(obj).then(res => {
151 canOrderNum.value = res.data.useCount
152 })
153 }
154 function countMoney() {
155 money.value = ((room.value.roomPrice * form.value.roomNum * usedays) + (room.value.bedPrice * form.value
156 .addNum * usedays)).toFixed(2)
157 // console.log(usedays,money.value)
158 }
159 function submit() {
160 if (usedays == 0) {
161 ElMessage.error(language.value == 0 ? '入住时间跨度需大于一天' :'Check-in time must be greater than one day')
162 return
163 }
164 form.value.rzStart = rzRange.value[0]
165 form.value.rzEnd = rzRange.value[1]
166
167 form.value.rzUsers = arr.toString()
168 form.value.activeId = room.value.activityId
169 form.value.ahId = room.value.hotelId
170 form.value.ahrId = room.value.id
171 form.value.orderName = hotelName.value
172 form.value.roomName =room.value.roomType
173 var str = ''
174 var str2 = ''
175 if (form.value.addNum && form.value.addNum > 0) {
176 str = `加床${form.value.addNum}张`
177 } else {
178 str = `未加床`
179 }
180 if (room.value.breakfastNum && room.value.breakfastNum > 0) {
181 str2 = `${room.value.breakfastNum}份早餐`
182 } else {
183 str2 = `无早餐`
184 }
185 form.value.room = `${form.value.roomNum} 间·${usedays}晚·${str}·${str2}`
186 console.log(form.value.room)
187
188 // 提交确认
189 ElMessage.confirm(language.value == 0 ? '确认提交订单吗？' :'Confirm to submit the order?', {
190 confirmButtonText: language.value == 0 ? '确定' :'Confirm',
191 cancelButtonText: language.value == 0 ? '取消' :'Cancel',
192 type: 'warning'
193 }).then(() => {
194 newsSubmitOrderHotel(form.value).then(res=>{
195 if (res.data) {
196 if (res.data.roomNum == -100) {
197 ElMessage.warning(language.value == 0 ? '剩余房间数不足' :'The remaining number of rooms is insufficient')
198 checkreRooms()
199 } else {
200 //去付钱
201 }
202 } else {
203 ElMessage.warning(language.value == 0 ? '无可预定的房间' :'No rooms available to book')
204 }
205 })
206 })
207 }
208 </script>
209
210 <style scoped lang="scss">
211 .bigMoney{font-size: 36px!important;
212 font-family: DIN Alternate;
213 font-weight: bold;}
214 .bg-lineg {
215 height: 40px;
216 line-height: 40px;
217 font-size: 18px;
218 text-align: center;
219 }
220 .leftboderTT {
221 font-weight: 600;
222 font-size: 16px;
223 color: #453DEA;
224 }
225 .border-rr{border-radius: 5px;
226 border: 1px solid #DCDFE6;}
227 .room{font-weight: 400;
228 font-size: 14px;
229 color: #929AA0;}
230 .ccitemBox {
231 overflow: auto;
232
233 label {
234 margin: 10px 0;
235 display: block;
236
237 span {
238 color: #FF8124;font-family: DIN Alternate;
239 font-size: 24px;
240 }
241 }
242 }
243
244 .ccitem {
245 display: flex;
246 justify-content: space-between;
247 font-size: 14px;
248 color: #666;
249 margin: 5px 0;
250
251 label {
252 font-size: 16px;
253 color: #000;
254 }
255
256 span {
257 font-size: 13px;
258 }
259 }
260 </style>
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!