Skip to content

jijin / dance-pc

Go to a project
Toggle navigation
Toggle navigation pinning
1ceae698 by 杨炀
Options

no message

1 parent 6332eb7e
Inline Side-by-side
Showing 7 changed files with 1212 additions and 17 deletions
src/routerPc/en.js
...@@ -398,6 +398,18 @@ export const constantRoutes = [ ...@@ -398,6 +398,18 @@ export const constantRoutes = [
398 meta: {title: 'Hotel Reservation'} 398 meta: {title: 'Hotel Reservation'}
399 }, 399 },
400 { 400 {
401 path: 'travel/:cptId',
402 component: () => import('@/viewsPc/booking/travel'),
403 name: 'travel',
404 meta: {title: 'Hotel Reservation'}
405 },
406 {
407 path: 'travel/:cptId/:hotelId',
408 component: () => import('@/viewsPc/booking/travelDetail'),
409 name: 'travelDetail',
410 meta: {title: 'Hotel Reservation'}
411 },
412 {
401 path: 'car/:cptId/:id', 413 path: 'car/:cptId/:id',
402 component: () => import('@/viewsPc/booking/carOrder'), 414 component: () => import('@/viewsPc/booking/carOrder'),
403 name: 'carOrder', 415 name: 'carOrder',
...@@ -410,6 +422,12 @@ export const constantRoutes = [ ...@@ -410,6 +422,12 @@ export const constantRoutes = [
410 meta: {title: 'Hotel Reservation'} 422 meta: {title: 'Hotel Reservation'}
411 }, 423 },
412 { 424 {
425 path: 'travel/:cptId/:hotelId/:roomId',
426 component: () => import('@/viewsPc/booking/travelOrder'),
427 name: 'travelOrder',
428 meta: {title: 'Travel Reservation'}
429 },
430 {
413 path: 'car/:cptId', 431 path: 'car/:cptId',
414 component: () => import('@/viewsPc/booking/car'), 432 component: () => import('@/viewsPc/booking/car'),
415 name: 'car', 433 name: 'car',
......
src/viewsPc/booking/travel.vue 0 → 100644
1 <template>
2 <div>
3 <div class="banner">
4 <h2>{{ language==0?'旅游服务':'Travel Service' }}</h2>
5 </div>
6 <div class="box">
7 <div class="searchBar">
8 <el-input :placeholder="language==0?'请输入关键字搜索':'Search'" v-model="query.name" class="no-border">
9 </el-input>
10 <el-button size="large" type="primary" class="btn-lineG" icon="search" @click="getList">
11 {{ language==0?'搜索':'Search' }}</el-button>
12 </div>
13 </div>
14
15 <div class="box" v-loading="loading">
16 <el-row :gutter="20">
17 <el-col :lg="24" :md="24" :sm="24" :xs="24" :xl="24" v-for="(h,index) in list" class="mb20">
18 <el-card @click="goDetail(h)">
19 <!-- 酒店列表-->
20 <el-row class="hotel" align="middle" :gutter="20">
21 <el-col :span="6">
22 <div class="imgbox">
23 <img class="w100" :src="fillImgUrl(h.photos?.split(',')[0])"/>
24 </div>
25 </el-col>
26 <el-col :span="12">
27 <h3 class="esp">{{h.name}}</h3>
28 <div class="starBox">
29 <img v-for="i in Number(h.starLevel||0)" src="@/assets/booking/star.png">
30 </div>
31 <div class="tagbox esp">
32 <span v-for="(t,index) in h.label?.split('，')" v-show="index<4">{{t}}</span>
33 <a v-show="h.label?.split('，').length>4">{{ language==0?'更多':'MORE' }} ></a>
34 </div>
35 <p class="esp addr mt20">
36 <el-icon size="16" style="position: relative;top: 2px" color="#929AA0"><LocationFilled /></el-icon>
37 {{h.address}}
38 </p>
39 </el-col>
40 <el-col :span="4" class="text-right">
41 <div class="price">{{ language==0?'¥':'€' }}<span>{{ h.price }}</span>
42 <i v-if="language==0">起</i>
43 </div>
44 <el-button class="btn-lineG w200px" round type="primary" >{{ language==0?'立即预订':'Select' }} ⇀</el-button>
45 </el-col>
46 </el-row>
47 </el-card>
48 </el-col>
49 </el-row>
50 <el-empty v-show="!loading&&list.length==0" :image="`/img/order_no.png`" :image-size="228" description="" />
51 <div style="height: 50px"></div>
52 </div>
53 </div>
54 </template>
55
56 <script setup>
57 import {onMounted} from "@vue/runtime-core"
58 import * as booking from "@/apiPc/booking"
59 import {useRouter,useRoute} from "vue-router";
60 import {useStorage} from "@vueuse/core/index";
61 import useUserStore from "@/store/modules/user";
62 const router = useRouter()
63 const route = useRoute()
64 const user = useUserStore().user
65 const useStore = useUserStore
66 const language= useStorage('language',0)
67 const query = ref({
68 name:''
69 })
70 const cptId = ref('')
71 const list = ref([])
72 const loading = ref(false)
73 onMounted(()=>{
74 query.value.activityId = route.params.cptId
75 getList()
76 })
77
78 function getList() {
79 loading.value = true
80 booking.getHotelList(query.value).then(res=>{
81 list.value = res.rows
82 loading.value = false
83 console.log(list.value)
84
85 }).catch(e=>{
86 loading.value = false
87 })
88 }
89 function goDetail(item) {
90 if(!user){
91 useStore().setVisitor()
92 return
93 }
94 router.push({
95 name:'travelDetail',
96 params:{
97 hotelId:item.hotelId,
98 },
99 query:{
100 id:item.id
101 }
102
103 })
104 }
105 </script>
106
107 <style scoped lang="scss">
108 .hotel{
109 h3{margin: 0 0 10px;}
110 img.w100{object-fit: cover;aspect-ratio: 16/9}
111 .addr{font-size: 14px;color: #929AA0;font-weight: 400;margin: 0 0 10px;}
112 .price{margin: 0 0 8px;
113 color: #FF8124;font-size: 18px;
114 span{font-size: 36px;margin: 0 8px;font-family: 'DINAlternate-Bold';font-weight: 600;}
115 i{font-style: normal;color: #929AA0;}
116 }
117 }
118 .banner{height: 140px;background-size: cover;text-align: center;
119 background: url("@/assets/booking/jd_bg.png") center;display: flex;align-items: center;
120 justify-content: center;
121 img{display: block;margin:-30px auto 0;width: auto;}
122 color: #fff;font-style: italic;font-size: 24px;text-transform: uppercase;
123 h2{margin:-30px auto 0;font-weight: bold;letter-spacing: 4px;}
124 }
125 .searchBar{position: relative;top: -30px;
126 background: #FFFFFF;display: flex;padding: 20px;
127 border-radius: 10px;}
128 .no-border{border: none;background: #F5F7F9;
129 :deep(.el-input__wrapper){border: none;box-shadow: none;background: #F5F7F9;}
130 }
131 .imgbox {width: 100%;height: 100%;position: relative;
132 img{width: 100%;height: 100%;}
133 .starBox{position: absolute;bottom: 0;right: 0;background: rgba(0,0,0,0.4);padding: 10px 15px 3px;}
134 }
135 .po-r-b{}
136 .starBox{
137 border-radius: 14px 0 0 0;
138 img{display: inline-block;margin-right: 4px;width: 24px;}
139 }
140 .tagbox{margin: 10px 0;
141 a{color: #AFB5B9;font-size: 12px;}
142 span{border-radius: 13px;font-size: 12px;padding: 3px 10px;margin-right:10px;font-weight: 400;}
143 span:nth-child(4n){background: rgba(50, 177, 108, 0.2);color: rgba(50, 177, 108, 1);}
144 span:nth-child(4n+1){background:rgba(243, 152, 0, 0.2);color: rgba(243, 152, 0, 1);}
145 span:nth-child(4n+2){background: rgba(0, 160, 233, 0.2);color: rgba(0, 160, 233, 1);}
146 span:nth-child(4n+3){background: rgba(247, 64, 166, 0.2);color:rgba(247, 64, 166, 1);}
147 }
148 </style>
src/viewsPc/booking/travelDetail.vue 0 → 100644
1 <template>
2 <div>
3 <div class="box">
4 <el-card class="mt30" v-loading="loading">
5 <el-row v-if="form" class="hotel" align="middle" :gutter="20">
6 <!-- <el-col :span="6">-->
7 <!-- <img class="w100" :src="fillImgUrl(form.photos?.split(',')[0])"/>-->
8 <!-- </el-col>-->
9 <el-col :span="language == 0?16:24">
10 <h3 class="esp flex">{{ form?.name }}
11
12 <el-tag class="ml10">5A</el-tag>
13 </h3>
14
15 <div class="tagbox">
16 <span v-for="(t,index) in form?.label?.split('，')" v-show="index<4">{{ t }}</span>
17 <a v-show="form?.label?.split('，').length>4">{{ language == 0 ? '更多' : 'MORE' }} ></a>
18 </div>
19 <div class="info">
20 <el-icon>
21 <Clock/>
22 </el-icon>
23 <span class="mr10">{{ language == 0 ? '开园时间' : 'Opening Time' }}：{{ form?.checkInTime }} ～ {{ form?.checkOutTime }}</span>
24 </div>
25 <div class="info">
26 <el-icon>
27 <Phone/>
28 </el-icon>
29 <span class="mr10">{{ language == 0 ? '联系方式' : 'Contact' }}：0510-12345678</span>
30 </div>
31 <div class="info esp">
32 <el-icon>
33 <MapLocation/>
34 </el-icon>
35 <span>{{ form?.addName }}</span>
36 </div>
37 <div v-if="form?.introduction" class="info pointer">
38 <div :class="showAll?'':'esp_2'" @click="showAll=!showAll" v-html="form.introduction.toString()"></div>
39 </div>
40 </el-col>
41 <el-col :span="8" class="text-right" v-if="language == 0">
42 <div class="mapBox" @click="goMap">
43 <div id="map"></div>
44 </div>
45 </el-col>
46 </el-row>
47 <el-empty v-else :image="`/img/order_no.png`" :image-size="228" description=""/>
48 </el-card>
49
50 <div class="mt30">
51 <el-row :gutter="20">
52 <el-col :span="10">
53 <div class="imgbox hotelImg">
54 <el-image :src="fillImgUrl(form?.photos?.split(',')[0])" fit="cover"
55 :preview-src-list="form?.photos?.split(',')"/>
56 </div>
57 </el-col>
58 <el-col :span="14">
59 <el-row class="h100" :gutter="20">
60 <el-col :span="8" class="oddmb" v-for="(p,index) in form?.photos?.split(',').slice(1,7)">
61 <div class="imgbox hotelImg">
62 <el-image :src="fillImgUrl(p)" fit="cover"/>
63 </div>
64 </el-col>
65 </el-row>
66 </el-col>
67 </el-row>
68 </div>
69
70 <el-card class="mt30 mb60">
71 <div class="lineHead">
72 <ul>
73 <li>
74 {{ language == 0 ? '选择日期' : 'tickets type' }}
75 </li>
76 </ul>
77 </div>
78 <div>
79 <!-- 日期-->
80 <el-calendar class="mt20" v-model="currentDate" :range="calendarRange">
81 <template #header="{date}">
82 <el-row style="width: 100%">
83 <el-col :lg="7" class="forPc">
84 </el-col>
85 <el-col :lg="10" class="forPc">
86 <el-row justify="center" align='middle'>
87 <!-- <div class="canBtn"><el-icon><ArrowLeftBold /></el-icon></div>-->
88 <div class="cTitle">
89 <!-- <el-date-picker-->
90 <!-- v-model="value2"-->
91 <!-- type="daterange"-->
92 <!-- range-separator="-"-->
93 <!-- start-placeholder="Start date"-->
94 <!-- end-placeholder="End date"-->
95 <!-- format="YYYY-MM-DD"-->
96 <!-- value-format="YYYY-MM-DD"-->
97 <!-- size="small"-->
98 <!-- @change="changee"-->
99 <!-- />-->
100 <!-- <el-input readonly :value="date" type="text" size="small" style="width: 280px"></el-input>-->
101 {{date}}
102 </div>
103 <!-- <div class="canBtn"><el-icon><ArrowRightBold /></el-icon></div>-->
104 </el-row>
105 </el-col>
106 <el-col :lg="7" :xs="24">
107 <div style="text-align: right;padding-right: 10px">
108 <el-date-picker
109 v-model="currentDate1"
110 type="date"
111 placeholder="YYYY-MM-DD"
112 format="YYYY-MM-DD"
113 @change="dateChange"
114 :disabled-date="disabledDateRZ"
115 :clearable='false'
116 />
117 </div>
118 </el-col>
119 </el-row>
120 </template>
121 <template #date-cell="data">
122 <div :class="data.data.day==query.currentDate?'primaryDate date':'date'" @click="selectDate(data.data.day)">
123 {{ data.data.day.slice(8, 10) }}
124 </div>
125 </template>
126 </el-calendar>
127 </div>
128
129 <div class="text-center mt30">
130 <el-button style="color: #fff" :disabled="!hotTime" size="large"
131 class="w200px btn-lineG" :class="{'forbid':!(!hotTime[0])}" round @click="goOrder">
132 {{ language==0?'立即预订':'BOOK NOW' }}
133 </el-button>
134 </div>
135 </el-card>
136 </div>
137 </div>
138 </template>
139
140 <script setup>
141 import {useRouter} from "vue-router";
142 import {ref, reactive, onMounted, getCurrentInstance} from "vue";
143 import {useRoute} from "vue-router";
144 import {dayjs} from 'element-plus'
145 import {getHotelById, getHotelRooms, checkRoomPayByUserId} from "@/apiPc/booking"
146 import {getBaseInfoByActiveId} from "@/apiPc/booking";
147
148 const {proxy} = getCurrentInstance()
149
150 import {useStorage} from "@vueuse/core/index";
151 import useUserStore from "@/store/modules/user";
152 import {ElMessageBox} from "element-plus";
153 const currentDate = ref(new Date())
154 const currentDate1 = ref(new Date())
155 const calendarRange = ref([dayjs(currentDate.value).toDate(),(dayjs(currentDate.value).toDate())])
156
157 const user = useUserStore().user
158 const useStore = useUserStore
159 const language = useStorage('language', 0)
160 const router = useRouter()
161 const route = useRoute()
162 const form = ref({})
163 const query = ref({
164 hotelId: route.query.id
165 })
166 const hotTime = ref([])
167 const showAll = ref(false)
168 const loading = ref(false)
169 const roomList = ref([])
170 const map = ref(null)
171 const formTime = ref({})
172
173 let baseHotTime;
174
175 onMounted(() => {
176 console.log(route.params)
177 getBaseInfoByActiveId(route.params.cptId).then(res => {
178 formTime.value = res.data || null
179 }).catch(err => {
180 console.log(err)
181 formTime.value = null
182 }).finally(() => {
183 console.log(formTime.value)
184 getDateTime()
185
186 getData()
187 })
188
189 })
190
191 function initTime() {
192 if (!hotTime.value[0]) {
193 hotTime.value = baseHotTime
194 getRoomList()
195 }
196 }
197
198 function getDateTime() {
199 if (formTime.value) {
200 if (dayjs().isBefore(dayjs(formTime.value.hqStart))) {
201 // hotTime.value[0]=dayjs(formTime.value.hqStart).format('YYYY-MM-DD')
202 // hotTime.value[1]=dayjs(formTime.value.hqStart).add(1,'day').format('YYYY-MM-DD')
203 baseHotTime = [dayjs(formTime.value.hqStart).format('YYYY-MM-DD'), dayjs(formTime.value.hqStart).add(1, 'day').format('YYYY-MM-DD')]
204 } else {
205 // hotTime.value[0]=dayjs().format('YYYY-MM-DD')
206 // hotTime.value[1]=dayjs().add(1,'day').format('YYYY-MM-DD')
207 baseHotTime = [dayjs().format('YYYY-MM-DD'), dayjs().add(1, 'day').format('YYYY-MM-DD')]
208 }
209 }
210 }
211
212 function getData() {
213 loading.value = true
214 getHotelById(route.params.hotelId).then(res => {
215 loading.value = false
216 form.value = res.data
217 initMap()
218 }).catch(err => {
219 console.log(err)
220 })
221 }
222 function dateChange(){
223 currentDate.value=currentDate1.value
224 calendarRange.value=[dayjs(currentDate.value).toDate(),(dayjs(currentDate.value).toDate())]
225 }
226
227 function selectDate(date) {
228 currentDate1.value= currentDate.value=dayjs(date).toDate()
229 console.log(date)
230 }
231 function initMap() {
232 // const TMap = (window as any).TMap
233 var center = new TMap.LatLng(form.value.latitude, form.value.longitude);//设置中心点坐标'
234 var map = new TMap.Map("map", {
235 center: center,//设置地图中心点坐标
236 zoom: 17, //设置地图缩放级别
237 });
238 var infoWindowLocation = new TMap.LatLng(form.value.latitude, form.value.longitude);//创建一个坐标
239 //创建InfoWindow实例，并进行初始化
240 var infowindow = new TMap.InfoWindow({
241 content: form.value.address, //信息窗口内容
242 position: infoWindowLocation,//显示信息窗口的坐标
243 map: map,
244 offset: {x: 0, y: -32}
245 });
246 infowindow.close();
247 var marker = new TMap.MultiMarker({
248 map: map,
249 //样式定义
250 styles: {
251 "myStyle": new TMap.MarkerStyle({
252 "anchor": {x: 16, y: 32}
253 })
254 },
255 //点标记数据数组
256 geometries: [{
257 "id": "1", //点标记唯一标识，后续如果有删除、修改位置等操作，都需要此id
258 // "styleId": 'myStyle', //指定样式id
259 "position": new TMap.LatLng(form.value.latitude, form.value.longitude), //点标记坐标位置
260 "properties": {//自定义属性
261 "title": form.value.name
262 }
263 }
264 ]
265 })
266 marker.on("click", function (evt) {
267 //设置infoWindow
268 infowindow.open(); //打开信息窗
269 infowindow.setPosition(evt.geometry.position);//设置信息窗位置
270 })
271 }
272
273 function goOrder(room) {
274 if(!hotTime.value){
275 proxy.$modal.msgError(language.value == 0 ?'请先选择出发日期':'Please choose the date of check-in first')
276 return
277 }
278 if(room.useCount<=0){
279 ElMessageBox.confirm(language.value == 0 ? `您当前选择的日期是${hotTime.value[0]}至 ${hotTime.value[1]}，该时间段暂无可预订房间，请选择其他日期` :
280 `You currently select the check-in date of ${hotTime.value[0]} to ${hotTime.value[1]}, there is no room available for booking at this time period, please choose another date`, {type: 'warning'}).then({
281
282 })
283 return
284 }
285 ElMessageBox.confirm(language.value == 0 ? `你当前选择的出行日期为${dayjs(currentDate.value).format('YYYY-MM-DD')}是否确定？` : `Your current check-in time is ${dayjs(currentDate.value).format('YYYY-MM-DD')} Are you sure?`, {type: 'warning'}).then({}).then(() => {
286 checkRoomPayByUserId(room.hotelId).then(res => {
287 if (res.data == -100) {
288 ElMessageBox.confirm(
289 language.value == 0 ? '你有未支付的旅游预订，是否前往个人中心查看' : 'You already have an unpaid travel order, do you want to go to the personal center to check it?',
290 language.value == 0 ? '提示' : 'Warning',
291 {
292 confirmButtonText: language.value == 1 ? 'Go My Reservation ' : '前往我的预订',
293 // cancelButtonText: language.value==1?'Continue to book':'继续预订',
294 type: 'warning',
295 }
296 ).then((res) => {
297 console.log(res)
298 router.push({
299 name: 'myReservation',
300 })
301 })
302 return
303 }
304 goNext()
305 })
306 })
307
308
309 }
310
311 function goNext() {
312 router.push({
313 name: 'travelOrder',
314 params: {
315 roomId: 0
316 },
317 query: {
318 hotelName: form.value.name,
319 start:currentDate.value
320 }
321 })
322 }
323
324 function getDaysBetween() {
325 if (hotTime.value && hotTime.value.length == 2) {
326 const d1 = dayjs(hotTime.value[0]).format('YYYY-MM-DD')
327 const d2 = dayjs(hotTime.value[1]).format('YYYY-MM-DD')
328 if (d1 == d2) {
329 getDateTime()
330 return proxy.$modal.msgError(language.value == 0 ? '入住时间跨度需要大于一天' : 'The duration of the stay must be more than one day.')
331 } else {
332 getRoomList()
333 }
334 }
335 }
336
337 function disabledDateRZ(date) {
338 //判读今天大与form.value.hqStart
339 if (formTime.value.hqStart) {
340 const today = dayjs().format('YYYY-MM-DD')
341 if (formTime.value.hqStart < today) {
342 return !((date.getTime() >= dayjs(today).valueOf()) && (date.getTime() <= dayjs(formTime.value.hqEnd).valueOf()))
343 } else {
344 return !((date.getTime() >= dayjs(formTime.value.hqStart).valueOf()) && (date.getTime() <= dayjs(formTime.value.hqEnd).valueOf()))
345 }
346 }
347 // return true
348 }
349
350 function goMap() {
351 return
352 // var tencentMapUrl = "https://map.qq.com/";
353 // window.location.href = tencentMapUrl;
354 var url = `https://map.qq.com/?type=gcj02&lat=${form.value.latitude}&lng=${form.value.longitude}`
355 var mapUrl_tx = "http://apis.map.qq.com/uri/v1/marker?marker=coord:" + form.value.latitude + "," + form.value.longitude + "&referer=yellowpage";
356 window.open(url, "_blank")
357 }
358
359 </script>
360
361 <style scoped lang="scss">
362 .room {
363 background: #FAFBFD;
364 margin: 20px 0 0;
365 padding: 20px;
366 border: 1px solid #E5E5E5;
367
368 .name {
369 font-size: 20px;
370 margin: 0 0 10px;
371 }
372
373 .roomImg {
374 aspect-ratio: 16/9;
375 border-radius: 10px;
376 overflow: hidden;
377
378 img {
379 width: 100%;
380 object-fit: cover;
381 object-position: center;
382 height: 100%;
383 }
384 }
385
386 .price {
387 color: #FF8124;
388 font-size: 24px;
389
390 span {
391 font-size: 36px;
392 font-family: "DIN Alternate"
393 }
394 }
395
396 .bg-lineg {
397 margin: auto;
398 border-radius: 10px;
399 text-align: center;
400 padding: 7px 2px 2px;
401 font-size: 24px;
402 width: 66px;
403 cursor: pointer;
404
405 div {
406 background: #fff;
407 font-size: 13px;
408 border-radius: 20px;
409 padding: 0 10px;
410 color: #453DEA;
411 font-weight: 500;
412 }
413 }
414 }
415
416 .hotel {
417 h3 {
418 margin: 0 0 20px;
419 }
420
421 img.w100 {
422 object-fit: cover;
423 aspect-ratio: 16/9
424 }
425
426 .addr {
427 font-size: 16px;
428 color: #929AA0;
429 font-weight: 400;
430 }
431
432 .price {
433 margin: 0 0 25px;
434 color: #FF8124;
435 font-size: 18px;
436
437 span {
438 font-size: 24px;
439 margin: 0 8px;
440 font-family: 'DINAlternate-Bold';
441 font-weight: 600;
442 }
443
444 i {
445 font-style: normal;
446 color: #929AA0;
447 }
448 }
449 }
450
451 :deep(.button) {
452 display: block;
453 height: 55px;
454 width: auto;
455 color: #fff;
456
457 span {
458 display: block !important;
459
460 div {
461 margin-top: 3px;
462 }
463 }
464
465 }
466
467 .starBox {
468 img {
469 display: inline-block;
470 margin-right: 4px
471 }
472 }
473
474 .tagbox {
475 margin: 15px 0;
476
477 a {
478 color: #AFB5B9;
479 font-size: 12px;
480 }
481
482 span {
483 border-radius: 13px;
484 font-size: 12px;
485 padding: 4px 10px;
486 margin-right: 10px;
487 font-weight: 400;
488 }
489
490 span:nth-child(4n) {
491 background: rgba(50, 177, 108, 0.2);
492 color: rgba(50, 177, 108, 1);
493 }
494
495 span:nth-child(4n+1) {
496 background: rgba(243, 152, 0, 0.2);
497 color: rgba(243, 152, 0, 1);
498 }
499
500 span:nth-child(4n+2) {
501 background: rgba(0, 160, 233, 0.2);
502 color: rgba(0, 160, 233, 1);
503 }
504
505 span:nth-child(4n+3) {
506 background: rgba(247, 64, 166, 0.2);
507 color: rgba(247, 64, 166, 1);
508 }
509 }
510
511 .mapBox {
512 position: relative;
513 overflow: hidden;
514 height: 200px;
515
516 #map {
517 position: relative;
518 left: -70px;
519 width: calc(100% + 160px);
520 }
521 }
522
523 .hotelImg {
524 border-radius: 10px;
525 overflow: hidden;
526 aspect-ratio: 16/9;
527
528 img {
529 object-fit: cover;
530 object-position: center;
531 width: 100%;
532 height: 100%;
533 }
534 }
535
536 .info {
537 font-weight: 400;
538 font-size: 14px;
539 color: #929AA0;
540
541 .el-icon {
542 margin-right: 5px;
543 }
544 }
545
546 .oddmb:nth-child(2) {
547 margin-bottom: 20px;
548 }
549
550 .forbid {
551 cursor: not-allowed !important;
552 filter:grayscale(0.4);opacity: 0.7;
553 }
554
555 .forbid:hover {
556 box-shadow: none;
557 }
558
559 .lineHead{display: flex;justify-content: space-between;}
560 .el-calendar {
561 --el-calendar-border: none;
562 --el-calendar-cell-width: 40px;
563 text-align: center;
564 --el-text-color-regular: #8E8D94;
565
566 :deep(.el-calendar__header) {
567 justify-content: center;
568 padding: 0 0 10px
569 }
570
571 :deep(.el-calendar__body) {
572 border: 1px solid #F0F0F0;
573 padding: 0
574 }
575
576 :deep(.el-calendar-table .el-calendar-day) {
577 padding: 1px;
578 }
579
580 :deep(.el-calendar-table td.is-selected) {
581 background: transparent;
582 }
583
584 :deep(.el-calendar__button-group) {
585 display: none;
586 }
587
588 :deep(.el-calendar-table thead th) {
589 padding: 5px 0 0
590 }
591
592 .primaryDate {
593 color: #fff;
594 background: linear-gradient(90deg, #8623FC, #453DEA);
595 }
596
597 .date {
598 margin: auto;
599 border-radius: 50%;
600 width: 30px;
601 height: 30px;
602 line-height: 30px;
603 font-weight: bold;
604 }
605 }
606
607 </style>
src/viewsPc/booking/travelOrder.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 <!-- {{room}}-->
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 </div>
17 </div>
18
19 <div class="leftboderTT">{{ language == 0 ? '预约信息' : 'Reservation information' }}</div>
20 <div class="border-rr mt20 pd20">
21 <el-form :model="form" :label-width="language == 0 ?'120':'160'" :rules="rules" ref="formRef">
22 <!-- :disabled-date="disabledDateRZ"-->
23 <el-form-item :label="language==0?'选择日期':'Date'" required>
24 <el-date-picker v-model="rzRange"
25 format="YYYY-MM-DD" :clearable="false"
26 value-format="YYYY-MM-DD"/>
27
28 <div class="tip" v-if="lform.travelStart">{{ language==0?'可订日期':'Available date' }}：{{ lform.travelStart.slice(0, 10) }} ~ {{ lform.travelEnd.slice(0, 10) }}</div>
29
30 <!-- :picker-options="pickerOptions"-->
31 </el-form-item>
32 <el-form-item :label="language==0? n.name:'Rooms'" required prop="roomNum" v-for="n in typeList">
33 <el-input-number v-model="n.num" :min="0" :max="canOrderNum" @change="changeRoomNum(n)"/>
34 <div class="red ml20">
35 <span v-if="language == 0">剩余票数:{{ canOrderNum }}</span>
36 <span v-else>{{ canOrderNum }} Remaining rooms</span>
37 </div>
38 <div class="tip" v-if="language==1">If you need to make a hotel reservation, please fill in the full names of all required persons when booking the hotel. (For two or more people, please use ',')</div>
39 </el-form-item>
40
41 <div class="fakeFormItem">
42 <label>需填写{{ needPersonNum }}位游客</label>
43 <div>
44 <div v-show="needPersonNum > form.personArr.length">还需填写{{needPersonNum-form.personArr.length}}位游客</div>
45 <div>
46 <el-button plain type="primary" @click="showAddPerson">新增出行人</el-button>
47 </div>
48 </div>
49 </div>
50 <div v-show="form.personArr.length>0">
51 <div class="fakeFormItem personIt" v-for="(n,index) in form.personArr">
52 <label>
53 <el-icon @click="delPerson(n,index)"><Remove /></el-icon>
54 游客{{index+1}}
55 </label>
56 <div class="mation">
57 <div>{{n.name}}</div>
58 身份证：{{n.idcCode}}
59 </div>
60 <el-icon @click="showAddPerson(n)"><Edit /></el-icon>
61 </div>
62 </div>
63
64 <el-form-item :label="language==0?'联系手机':'Contact phone'" required prop="phone">
65 <el-input v-model="form.phone"/>
66 </el-form-item>
67
68 </el-form>
69 </div>
70 </el-col>
71 <el-col :span="10">
72 <div class="leftboderTT">{{ language == 0 ? '订单明细' : 'Order details' }}</div>
73 <div class="border-rr mt20 pd20 ccitemBox">
74 <label> {{ language == 0 ? '基本费用' : 'Room fee' }}
75 <span class="fr" v-if="language==0">{{
76 language == 0 ? '¥' : '€'
77 }}{{ ( form.roomNum * choseRooms.length).toFixed(2) }}</span>
78 <span class="fr" v-else>{{
79 language == 0 ? '¥' : '€'
80 }}{{ ( form.roomNum * choseRooms.length).toFixed(2) }}</span>
81 </label>
82 <div class="ccitem" v-for="(c, index) in choseRooms" :key="index" v-show="form.roomNum>0">
83 {{ c }}
84 <span v-if="language==0">{{ form.roomNum }}*{{ language == 0 ? '¥' : '€' }}{{ room.roomPrice }}</span>
85 <span v-else>{{ form.roomNum }}*{{ language == 0 ? '¥' : '€' }}{{ room.roomPriceEn }}</span>
86 </div>
87
88
89 <label>{{ language == 0 ? '共计' : 'Total' }}<span
90 class="fr bigMoney">{{ language == 0 ? '¥' : '€' }}{{ money }}</span></label>
91
92 </div>
93 </el-col>
94 </el-row>
95 </el-card>
96
97 <el-card class="mt30">
98 <el-row justify="space-between" align="middle">
99 <el-col :span="12">
100 <label>{{ language == 0 ? '共计金额' : 'Total' }}：
101 <span class=" text-warning"> {{ language == 0 ? '¥' : '€' }}<span class="bigMoney">{{ money }}</span></span>
102 </label>
103 </el-col>
104 <el-col :span="12" class="text-right">
105 <el-button type="primary" class="btn-lineG w200px" size="large" round @click="submit">{{ language == 0 ?'确认付款':'Book Now' }}</el-button>
106 </el-col>
107 </el-row>
108 </el-card>
109 <div style="height: 60px;"></div>
110
111 </div>
112
113 <el-dialog v-model="show" title="出行人信息" width="500px" center>
114 <div>
115 <el-form label-width="100" ref="personRef">
116 <el-form-item label="姓名">
117 <el-input v-model="person.name" placeholder="请与证件姓名一致"/>
118 </el-form-item>
119 <el-form-item label="证件号">
120 <el-input v-model="person.idcCode" placeholder="请填写身份证号"/>
121 </el-form-item>
122 </el-form>
123 </div>
124 <template #footer>
125 <div class="dialog-footer">
126 <el-button @click="show = false">取 消</el-button>
127 <el-button type="primary" @click="addPerson">完成</el-button>
128 </div>
129 </template>
130 </el-dialog>
131 </div>
132 </template>
133
134 <script setup>
135 import {useRouter, useRoute} from "vue-router";
136 import {ref, reactive, onMounted} from "vue";
137 import {useStorage} from "@vueuse/core/index";
138 import {checkResidueRoom, getBaseInfoByActiveId, newsSubmitOrderHotel} from "@/apiPc/booking"
139 import dayjs from 'dayjs'
140 import {ElMessage,ElMessageBox} from "element-plus";
141 import useUserStore from "@/store/modules/user";
142 const user = useUserStore().user
143 const language = useStorage('language', 0)
144 const router = useRouter()
145 const route = useRoute()
146 const room = ref({})
147 const hotelName = ref('')
148 const canOrderNum = ref(0)
149 const needPersonNum = ref(0)
150 const person = ref({
151 name: '',
152 idcCode: ''
153 })
154 const show = ref(false)
155 const lform = ref({})
156 const form = ref({
157 roomNum: 0,
158 phone: user?.phonenumber||'',
159 personArr: []
160 })
161 const rzRange = ref('')
162 const typeList = ref([
163 {
164 name: '成人票',
165 value: '1'
166 },
167 {
168 name: '儿童票',
169 value: '2'
170 },
171 {
172 name: '老年票',
173 value: '2'
174 }
175 ])
176 const money = ref(0)
177 const choseRooms = ref([])
178 const rules = ref({
179 phone: { required: true, message: language.value==0? '请输入联系电话':"Please enter a contact number", trigger: 'blur' }
180 })
181
182 let usedays = 0
183 onMounted(() => {
184 console.log(route.query)
185 hotelName.value = route.query.hotelName
186 money.value = 0
187 rzRange.value = dayjs(route.query.start).format('YYYY-MM-DD')
188 initDays()
189 checkreRooms()
190 })
191 function initDays() {
192 // 可定日期范围
193 getBaseInfoByActiveId(route.params.cptId).then(res=>{
194 lform.value = res.data
195 }).catch(err=>{
196 console.log(err)
197 })
198 }
199 function disabledDateRZ(date) {
200 //判读今天大与form.value.travelStart
201 if (lform.value.travelStart) {
202 const today = dayjs().format('YYYY-MM-DD')
203 if (lform.value.travelStart < today) {
204 return !((date.getTime() >= dayjs(today).valueOf())&&(date.getTime() <= dayjs(lform.value.travelEnd).valueOf()))
205 } else {
206 return !((date.getTime() >= dayjs(lform.value.travelStart).valueOf())&&(date.getTime() <= dayjs(lform.value.travelEnd).valueOf()))
207 }
208 }
209 // return true
210 }
211 function changeRoomNum(e) {
212 console.log(e)
213 countMoney()
214 }
215 function checkreRooms() {
216 //获取票类型 typeList
217 }
218 const showAddPerson = (item) => {
219 if(item){
220 person.value = item
221 } else {
222 person.value = {
223 name: '',
224 idcCode: ''
225 }
226 }
227 show.value = true
228 }
229 const addPerson = () => {
230 if(!person.value.name){
231 ElMessage.warning(language.value == 0 ? '请填写姓名' : 'Please fill in the name')
232 return
233 }
234 if(!person.value.idcCode){
235 ElMessage.warning(language.value == 0 ? '请填写身份证号' : 'Please fill in the ID number')
236 return
237 }
238 form.value.personArr.push(person.value)
239 show.value = false
240 }
241 const delPerson = (item,index) => {
242 form.value.personArr.splice(index,1)
243 }
244
245 function countMoney() {
246 if (language.value == 0) {
247 money.value = ((form.value.roomNum * usedays) + ( form.value.addNum * usedays)).toFixed(2)
248 } else {
249 money.value = ((form.value.roomNum * usedays) + (form.value.addNum * usedays)).toFixed(2)
250
251 }
252 if (money.value == 'NaN') money.value = 0.00
253 }
254
255 function submit() {
256 if(!user){
257 useUserStore().setReLogin()
258 return
259 }
260 if(!rzRange.value)return ElMessage.warning(language.value == 0 ? '请选择预订日期' : 'Please select check-in time')
261 if(!form.value.phone){
262 ElMessage.warning(language.value == 0 ? '请填写手机号' : 'Please fill in the phone number')
263 return
264 }
265 if(form.value.personArr.length!=needPersonNum.value){
266 ElMessage.warning(language.value == 0 ? '出行人数与票数不匹配' : 'The number of people travelling does not match the number of rooms')
267 return
268 }
269
270 // 提交确认
271 ElMessageBox.confirm(language.value == 0 ? '确认提交订单吗？' : 'Confirm to submit the order?', {
272 confirmButtonText: language.value == 0 ? '确定' : 'Confirm',
273 cancelButtonText: language.value == 0 ? '取消' : 'Cancel',
274 type: 'warning'
275 }).then(() => {
276 newsSubmitOrderHotel(form.value).then(res => {
277 if (res.data) {
278 if (res.data.roomNum == -100) {
279 ElMessage.warning(language.value == 0 ? '剩余票数不足' : 'The remaining number of rooms is insufficient')
280 checkreRooms()
281 } else {
282 //去付钱
283 router.push({
284 name: 'bookingPay',
285 query: {
286 orderId:res.data.orderId,
287 money:res.data.total,
288 type:'hotel'
289 }
290 })
291 }
292 }
293 })
294 })
295 }
296
297 </script>
298
299 <style scoped lang="scss">
300 .bigMoney {
301 font-size: 36px !important;
302 font-family: 'DIN Alternate';
303 font-weight: bold;
304 }
305
306 .bg-lineg {
307 height: 40px;
308 line-height: 40px;
309 font-size: 18px;
310 text-align: center;
311 }
312
313 .leftboderTT {
314 font-weight: 600;
315 font-size: 16px;
316 color: #453DEA;
317 }
318
319 .border-rr {
320 border-radius: 5px;
321 border: 1px solid #DCDFE6;
322 }
323
324 .room {
325 font-weight: 400;
326 font-size: 14px;
327 color: #929AA0;
328 }
329
330 .ccitemBox {
331 overflow: auto;
332
333 label {
334 margin: 10px 0;
335 display: block;
336 min-height: 30px;
337
338 span {
339 color: #FF8124;
340 font-family: DIN Alternate;
341 font-size: 24px;
342 }
343 }
344 }
345
346 .ccitem {
347 display: flex;
348 justify-content: space-between;
349 font-size: 15px;
350 color: #666;
351 margin: 5px 0 10px;
352
353 label {
354 font-size: 16px;
355 color: #000;
356 }
357
358 span {
359 font-size: 13px;
360 }
361 }
362
363 .red {
364 color: #FF8124;
365 }
366 .fakeFormItem {
367 display: flex;
368 padding: 10px 0;
369 label{ height: 32px; font-size: var(--el-form-label-font-size); width: 120px;
370 color: var(--el-text-color-regular); padding: 0 12px 0 0;
371 line-height: 32px;flex: 0 0 auto;
372 display: inline-flex;
373 justify-content: flex-end;
374 align-items: center;gap: 10px;}
375 }
376 .tip{font-size: 14px;color: #666;padding: 0 10px;}
377 .personIt{display: flex;align-items: center;
378 .mation{width: 200px;font-size: 12px;
379 div{font-size: 14px;}
380 }
381 }
382 </style>
src/viewsPc/match/components/addWdsf.vue
...@@ -245,6 +245,14 @@ const ocrSuccess = (res) => { ...@@ -245,6 +245,14 @@ const ocrSuccess = (res) => {
245 } 245 }
246 246
247 function submitForm() { 247 function submitForm() {
248 if(!form.value.wdsfMin&&!card.value){
249 ElMessage.warning(language.value == 0 ? '请输入你的WDSF会员号' : 'Please fill in your WDSF MIN')
250 return
251 }
252 if(card.value&&!isCodeTrue.value){
253 ElMessage.warning(language.value == 0 ? '请验证你的WDSF会员号' : 'Please verify your WDSF MIN')
254 return
255 }
248 if (!form.value.passportNumber) { 256 if (!form.value.passportNumber) {
249 ElMessage.warning(language.value == 0 ? '请输入你的证件号' : 'Please fill in your passport number') 257 ElMessage.warning(language.value == 0 ? '请输入你的证件号' : 'Please fill in your passport number')
250 return 258 return
......
src/viewsPc/match/components/quick-row.vue
1 <template> 1 <template>
2 <div style="filter: opacity(1)"> 2 <div style="filter: opacity(1)">
3 <el-row v-if="language==0" class="btnbox" justify='space-between'> 3 <el-row v-if="language==0" class="btnbox" justify='space-between' :gutter="15">
4 <el-col :lg="3" :md="7" :sm="11" :xs="11"> 4 <el-col :lg="3" :md="6" :sm="12" :xs="12">
5 <div class="funcBtn" @click="popRemark(0)"> 5 <div class="funcBtn" @click="popRemark(0)">
6 <img src="@/assets/dance/btn04.png"/> 6 <img src="@/assets/dance/btn04.png"/>
7 <h4>票务预订</h4> 7 <h4>票务预订</h4>
8 </div> 8 </div>
9 </el-col> 9 </el-col>
10 <el-col :lg="3" :md="7" :sm="11" :xs="11"> 10 <el-col :lg="3" :md="6" :sm="12" :xs="12">
11 <div class="funcBtn" @click="popRemark(1)"> 11 <div class="funcBtn" @click="popRemark(1)">
12 <img src="@/assets/dance/btn01.png"/> 12 <img src="@/assets/dance/btn01.png"/>
13 <h4>酒店预订</h4> 13 <h4>酒店预订</h4>
14 </div> 14 </div>
15 </el-col> 15 </el-col>
16 <el-col :lg="3" :md="7" :sm="11" :xs="11"> 16 <el-col :lg="3" :md="6" :sm="12" :xs="11">
17 <div class="funcBtn" @click="popRemark(8)">
18 <img src="@/assets/dance/btn08.png"/>
19 <h4>旅游服务</h4>
20 </div>
21 </el-col>
22 <el-col :lg="3" :md="6" :sm="12" :xs="11">
17 <div class="funcBtn" @click="popRemark(2)"> 23 <div class="funcBtn" @click="popRemark(2)">
18 <img src="@/assets/dance/btn02.png"/> 24 <img src="@/assets/dance/btn02.png"/>
19 <h4>车辆预订</h4> 25 <h4>车辆预订</h4>
20 </div> 26 </div>
21 </el-col> 27 </el-col>
22 <el-col :lg="3" :md="7" :sm="11" :xs="11"> 28 <el-col :lg="3" :md="6" :sm="12" :xs="11">
23 <div class="funcBtn" @click="popRemark(6)"> 29 <div class="funcBtn" @click="popRemark(6)">
24 <img src="@/assets/dance/btn07.png"/> 30 <img src="@/assets/dance/btn07.png"/>
25 <h4>预订查询</h4> 31 <h4>预订查询</h4>
26 </div> 32 </div>
27 </el-col> 33 </el-col>
28 <el-col :lg="3" :md="7" :sm="11" :xs="11"> 34 <el-col :lg="3" :md="6" :sm="12" :xs="11">
29 <div class="funcBtn" @click="popRemark(3)"> 35 <div class="funcBtn" @click="popRemark(3)">
30 <img src="@/assets/dance/btn03.png"/> 36 <img src="@/assets/dance/btn03.png"/>
31 <h4>餐饮预订</h4> 37 <h4>餐饮预订</h4>
32 </div> 38 </div>
33 </el-col> 39 </el-col>
34 <el-col :lg="3" :md="7" :sm="11" :xs="11"> 40 <el-col :lg="3" :md="6" :sm="12" :xs="11">
35 <div class="funcBtn" @click="popRemark(4)"> 41 <div class="funcBtn" @click="popRemark(4)">
36 <img src="@/assets/dance/btn05.png"/> 42 <img src="@/assets/dance/btn05.png"/>
37 <h4>化妆预约</h4> 43 <h4>化妆预约</h4>
38 </div> 44 </div>
39 </el-col> 45 </el-col>
40 <el-col :lg="3" :md="7" :sm="11" :xs="11"> 46 <el-col :lg="3" :md="6" :sm="12" :xs="11">
41 <div class="funcBtn" @click="popRemark(5)"> 47 <div class="funcBtn" @click="popRemark(5)">
42 <img src="@/assets/dance/btn06.png"/> 48 <img src="@/assets/dance/btn06.png"/>
43 <h4>拍照预约</h4> 49 <h4>拍照预约</h4>
44 </div> 50 </div>
45 </el-col> 51 </el-col>
46 </el-row> 52 </el-row>
47 <el-row v-else class="btnbox" justify='space-between'> 53
48 <el-col :lg="3" :md="7" :sm="11" :xs="11"> 54
55 <el-row v-else class="btnbox enBtnbox" justify='space-between' :gutter="15">
56 <el-col :lg="3" :md="8" :sm="12" :xs="12">
49 <div class="funcBtn" @click="popRemark(0)"> 57 <div class="funcBtn" @click="popRemark(0)">
50 <img src="@/assets/dance/btn04.png"/> 58 <img src="@/assets/dance/btn04.png"/>
51 <h4>TICKET BOOKING</h4> 59 <h4>TICKET BOOKING</h4>
52 </div> 60 </div>
53 </el-col> 61 </el-col>
54 <el-col :lg="3" :md="7" :sm="11" :xs="11"> 62 <el-col :lg="3" :md="8" :sm="12" :xs="12">
55 <div class="funcBtn" @click="popRemark(1)"> 63 <div class="funcBtn" @click="popRemark(1)">
56 <img src="@/assets/dance/btn01.png"/> 64 <img src="@/assets/dance/btn01.png"/>
57 <h4>HOTEL RESERVATION</h4> 65 <h4>HOTEL RESERVATION</h4>
58 </div> 66 </div>
59 </el-col> 67 </el-col>
60 <el-col :lg="3" :md="7" :sm="11" :xs="11"> 68 <el-col :lg="3" :md="8" :sm="12" :xs="12">
69 <div class="funcBtn" @click="popRemark(8)">
70 <img src="@/assets/dance/btn08.png"/>
71 <h4>TRAVEL SERVICE</h4>
72 </div>
73 </el-col>
74 <el-col :lg="3" :md="8" :sm="12" :xs="12">
61 <div class="funcBtn" @click="popRemark(2)"> 75 <div class="funcBtn" @click="popRemark(2)">
62 <img src="@/assets/dance/btn02.png"/> 76 <img src="@/assets/dance/btn02.png"/>
63 <h4>TRANSPORTATION RESERVATION</h4> 77 <h4>TRANSPORTATION RESERVATION</h4>
64 </div> 78 </div>
65 </el-col> 79 </el-col>
66 <el-col :lg="3" :md="7" :sm="11" :xs="11"> 80 <el-col :lg="3" :md="8" :sm="12" :xs="12">
67 <div class="funcBtn" @click="popRemark(6)"> 81 <div class="funcBtn" @click="popRemark(6)">
68 <img src="@/assets/dance/btn07.png"/> 82 <img src="@/assets/dance/btn07.png"/>
69 <h4>RESERVATION SEARCH</h4> 83 <h4>RESERVATION SEARCH</h4>
70 </div> 84 </div>
71 </el-col> 85 </el-col>
72 <el-col :lg="3" :md="7" :sm="11" :xs="11"> 86 <el-col :lg="3" :md="8" :sm="12" :xs="12">
73 <div class="funcBtn" @click="popRemark(3)"> 87 <div class="funcBtn" @click="popRemark(3)">
74 <img src="@/assets/dance/btn03.png"/> 88 <img src="@/assets/dance/btn03.png"/>
75 <h4>DINING RESERVATION</h4> 89 <h4>DINING RESERVATION</h4>
76 </div> 90 </div>
77 </el-col> 91 </el-col>
78 <el-col :lg="3" :md="7" :sm="11" :xs="11"> 92 <el-col :lg="3" :md="8" :sm="12" :xs="12">
79 <div class="funcBtn" @click="popRemark(4)"> 93 <div class="funcBtn" @click="popRemark(4)">
80 <img src="@/assets/dance/btn05.png"/> 94 <img src="@/assets/dance/btn05.png"/>
81 <h4>MAKEUP APPOINTMENT</h4> 95 <h4>MAKEUP APPOINTMENT</h4>
82 </div> 96 </div>
83 </el-col> 97 </el-col>
84 <el-col :lg="3" :md="7" :sm="11" :xs="11"> 98 <el-col :lg="3" :md="8" :sm="12" :xs="12">
85 <div class="funcBtn" @click="popRemark(5)"> 99 <div class="funcBtn" @click="popRemark(5)">
86 <img src="@/assets/dance/btn06.png"/> 100 <img src="@/assets/dance/btn06.png"/>
87 <h4>PHOTOGRAPHY APPOINTMENT</h4> 101 <h4>PHOTOGRAPHY APPOINTMENT</h4>
...@@ -146,7 +160,9 @@ function popRemark(type) { ...@@ -146,7 +160,9 @@ function popRemark(type) {
146 } 160 }
147 }) 161 })
148 } 162 }
149 163 if (type == 8) {
164 //todo 旅游
165 }
150 if (!form.value) { 166 if (!form.value) {
151 building() 167 building()
152 return 168 return
...@@ -248,4 +264,20 @@ h4 { ...@@ -248,4 +264,20 @@ h4 {
248 font-size: 13px; 264 font-size: 13px;
249 box-shadow: 0 0 10px rgba(0, 0, 0, 0.6); 265 box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
250 } 266 }
267
268 .enBtnbox{
269 .funcBtn{
270 h4{font-size:16px;display: flex;align-items: center;width: 100%;justify-content: center;height: 36px;}
271 }
272 }
273 @media screen and (max-width: 1400px) {
274 .enBtnbox .funcBtn{
275 h4{font-size:14px;}
276 }
277 }
278 @media screen and (max-width: 1250px) {
279 .enBtnbox .funcBtn{
280 h4{font-size:12px;}
281 }
282 }
251 </style> 283 </style>
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!