a0288c1b by zhangmeng

Merge branch '线上版本修复' into devmatch

2 parents 42f91580 fd3f4520
...@@ -469,11 +469,11 @@ ...@@ -469,11 +469,11 @@
469 <div v-if="payType == '2'&&wePayCodeUrl"> 469 <div v-if="payType == '2'&&wePayCodeUrl">
470 <div class="payImgbox flexCenter"> 470 <div class="payImgbox flexCenter">
471 <div> 471 <div>
472 <img :src="wePayCodeUrl" class="border" width="260"> 472 <img :src="wePayCodeUrl" class="border payImg1" width="260">
473 <img class="mt20" src="@/assets/img/sm.png"> 473 <img class="mt20 payImg2" src="@/assets/img/sm.png">
474 </div> 474 </div>
475 <div class="ml20"> 475 <div class="ml20">
476 <img height="360" src="@/assets/img/rr.jpg"> 476 <img class="payImg3" height="360" src="@/assets/img/rr.jpg">
477 </div> 477 </div>
478 </div> 478 </div>
479 <div v-if="language==0" class="tip text-center text-danger"> 479 <div v-if="language==0" class="tip text-center text-danger">
...@@ -1186,4 +1186,24 @@ const showSJ = () => { ...@@ -1186,4 +1186,24 @@ const showSJ = () => {
1186 .price { 1186 .price {
1187 color: orange; 1187 color: orange;
1188 } 1188 }
1189
1190
1191 @media screen and (max-width: 768px) {
1192 .payImgbox {
1193 width: 100%;
1194
1195 .payImg1 {
1196 width: 40vw;
1197 }
1198
1199 .payImg2 {
1200 width: 40vw;
1201 }
1202
1203 .payImg3 {
1204 width: 40vw;
1205 height: auto;
1206 }
1207 }
1208 }
1189 </style> 1209 </style>
......
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
22 <div> 22 <div>
23 <p>票档:{{ ticketForm.extJson?.atName }}</p> 23 <p>票档:{{ ticketForm.extJson?.atName }}</p>
24 <p>场馆:{{ ticketForm.extJson?.atsName }}</p> 24 <p>场馆:{{ ticketForm.extJson?.atsName }}</p>
25 <p>场次:{{ ticketForm.extJson?.sessionType =='1000'? '日间场' : '夜间场' }}</p> 25 <p>场次:{{ ticketForm.extJson?.sessionType == '1000' ? '日间场' : '夜间场' }}</p>
26 <p>票型:{{ ticketForm.extJson?.atstName }}</p> 26 <p>票型:{{ ticketForm.extJson?.atstName }}</p>
27 </div> 27 </div>
28 <div> 28 <div>
...@@ -34,14 +34,14 @@ ...@@ -34,14 +34,14 @@
34 <el-col :lg="8" :md="12" :sm="12" :xs="24">联系方式:{{ ticketForm.phone }} 34 <el-col :lg="8" :md="12" :sm="12" :xs="24">联系方式:{{ ticketForm.phone }}
35 </el-col> 35 </el-col>
36 <el-col :lg="8" :md="12" :sm="12" :xs="24"> 36 <el-col :lg="8" :md="12" :sm="12" :xs="24">
37 共计:{{ (totalMoney*1).toFixed(2) }}{{ 37 共计:{{ (totalMoney * 1).toFixed(2) }}{{
38 paymentType == 1 ? '¥' : '€' 38 paymentType == 1 ? '¥' : '€'
39 }} 39 }}
40 </el-col> 40 </el-col>
41 </el-row> 41 </el-row>
42 </div> 42 </div>
43 </div> 43 </div>
44 44
45 <div class="leftboderTT"> 45 <div class="leftboderTT">
46 {{ paymentType != 3 ? '开票信息' : 'Invoice information' }} 46 {{ paymentType != 3 ? '开票信息' : 'Invoice information' }}
47 </div> 47 </div>
...@@ -51,15 +51,17 @@ ...@@ -51,15 +51,17 @@
51 class="mw500" 51 class="mw500"
52 > 52 >
53 <el-form-item :label="language==0 ?'开票金额':'Amount'"> 53 <el-form-item :label="language==0 ?'开票金额':'Amount'">
54 <span class="bigprice">{{ paymentType != 3 ? '¥' : '€' }}{{ paymentType != 3?ticketForm.total:ticketForm.totalEn }}</span> 54 <span class="bigprice">{{
55 paymentType != 3 ? '¥' : '€'
56 }}{{ paymentType != 3 ? ticketForm.total : ticketForm.totalEn }}</span>
55 </el-form-item> 57 </el-form-item>
56 58
57 <el-form-item :label="language==0 ?`发票形式`:'Invoice Form'" prop="invoiceForm" required> 59 <el-form-item :label="language==0 ?`发票形式`:'Invoice Form'" prop="invoiceForm" required>
58 <el-radio-group v-model="form.invoiceForm"> 60 <el-radio-group v-model="form.invoiceForm">
59 <el-radio value="1">{{ language == 0 ? '电子发票' : 'E-invoice' }}</el-radio> 61 <el-radio value="1">{{ language == 0 ? '电子发票' : 'E-invoice' }}</el-radio>
60 </el-radio-group> 62 </el-radio-group>
61 </el-form-item> 63 </el-form-item>
62 64
63 <el-form-item :label="language==0 ?`发票类型`:'Invoice Type'" prop="invoiceType" required> 65 <el-form-item :label="language==0 ?`发票类型`:'Invoice Type'" prop="invoiceType" required>
64 <el-radio-group v-model="form.invoiceType"> 66 <el-radio-group v-model="form.invoiceType">
65 <el-radio value="0">{{ language == 0 ? '企业' : 'Company' }}</el-radio> 67 <el-radio value="0">{{ language == 0 ? '企业' : 'Company' }}</el-radio>
...@@ -101,7 +103,7 @@ ...@@ -101,7 +103,7 @@
101 </el-form-item> 103 </el-form-item>
102 </div> 104 </div>
103 </el-form> 105 </el-form>
104 106
105 <div v-if="remark" class="tip"> 107 <div v-if="remark" class="tip">
106 <label>{{ paymentType != 3 ? '开票须知' : 'Invoice Notice' }}:</label> 108 <label>{{ paymentType != 3 ? '开票须知' : 'Invoice Notice' }}:</label>
107 <div v-html="remark" /> 109 <div v-html="remark" />
...@@ -109,7 +111,7 @@ ...@@ -109,7 +111,7 @@
109 </div> 111 </div>
110 </el-col> 112 </el-col>
111 </el-row> 113 </el-row>
112 114
113 <el-row align="middle" class="pd20" justify="center"> 115 <el-row align="middle" class="pd20" justify="center">
114 <el-col :span="12" class="text-center"> 116 <el-col :span="12" class="text-center">
115 <el-button class="btn-lineG w200px" round size="large" type="primary" @click="submit"> 117 <el-button class="btn-lineG w200px" round size="large" type="primary" @click="submit">
...@@ -119,7 +121,7 @@ ...@@ -119,7 +121,7 @@
119 </el-row> 121 </el-row>
120 </el-card> 122 </el-card>
121 <div style="height: 60px;" /> 123 <div style="height: 60px;" />
122 124
123 </div> 125 </div>
124 </div> 126 </div>
125 <address-list-dialog ref="dialogAddressListRef" @submit="getAddress" /> 127 <address-list-dialog ref="dialogAddressListRef" @submit="getAddress" />
...@@ -224,13 +226,13 @@ async function getTickInfo() { ...@@ -224,13 +226,13 @@ async function getTickInfo() {
224 // message.value = JSON.parse(ticketForm.value.extJson.message) 226 // message.value = JSON.parse(ticketForm.value.extJson.message)
225 // console.log(message.value) 227 // console.log(message.value)
226 paymentType.value = ticketForm.value.paymentType 228 paymentType.value = ticketForm.value.paymentType
227 229
228 await getDetail(ticketForm.value.activeId) 230 await getDetail(ticketForm.value.activeId)
229 // console.log(ticketForm.value) 231 // console.log(ticketForm.value)
230 } catch (e) { 232 } catch (e) {
231 console.log(e) 233 console.log(e)
232 } finally { 234 } finally {
233 235
234 } 236 }
235 } 237 }
236 238
...@@ -339,7 +341,7 @@ function goBack() { ...@@ -339,7 +341,7 @@ function goBack() {
339 341
340 .border-info { 342 .border-info {
341 position: relative; 343 position: relative;
342 344
343 & > label { 345 & > label {
344 position: absolute; 346 position: absolute;
345 right: 0; 347 right: 0;
...@@ -349,7 +351,7 @@ function goBack() { ...@@ -349,7 +351,7 @@ function goBack() {
349 padding: 5px 15px; 351 padding: 5px 15px;
350 font-size: 14px; 352 font-size: 14px;
351 } 353 }
352 354
353 .poPrice { 355 .poPrice {
354 position: absolute; 356 position: absolute;
355 bottom: 0px; 357 bottom: 0px;
...@@ -404,12 +406,12 @@ function goBack() { ...@@ -404,12 +406,12 @@ function goBack() {
404 406
405 .ccitemBox { 407 .ccitemBox {
406 overflow: auto; 408 overflow: auto;
407 409
408 label { 410 label {
409 margin: 10px 0; 411 margin: 10px 0;
410 display: block; 412 display: block;
411 min-height: 30px; 413 min-height: 30px;
412 414
413 span { 415 span {
414 color: #FF8124; 416 color: #FF8124;
415 font-family: DIN Alternate; 417 font-family: DIN Alternate;
...@@ -424,12 +426,12 @@ function goBack() { ...@@ -424,12 +426,12 @@ function goBack() {
424 font-size: 15px; 426 font-size: 15px;
425 color: #666; 427 color: #666;
426 margin: 5px 0 10px; 428 margin: 5px 0 10px;
427 429
428 label { 430 label {
429 font-size: 16px; 431 font-size: 16px;
430 color: #000; 432 color: #000;
431 } 433 }
432 434
433 span { 435 span {
434 font-size: 13px; 436 font-size: 13px;
435 } 437 }
...@@ -475,4 +477,5 @@ function goBack() { ...@@ -475,4 +477,5 @@ function goBack() {
475 line-height: 1; 477 line-height: 1;
476 font-family: "DIN Alternate"; 478 font-family: "DIN Alternate";
477 } 479 }
480
478 </style> 481 </style>
......
...@@ -12,8 +12,8 @@ ...@@ -12,8 +12,8 @@
12 <div class="name">{{ TickForm.name }}</div> 12 <div class="name">{{ TickForm.name }}</div>
13 <div class="address">{{ TickForm.address }}</div> 13 <div class="address">{{ TickForm.address }}</div>
14 </div> 14 </div>
15 15
16 16
17 <div class="ticket_info mb20"> 17 <div class="ticket_info mb20">
18 <div class="tit_box"> 18 <div class="tit_box">
19 <div class="line" /> 19 <div class="line" />
...@@ -21,12 +21,12 @@ ...@@ -21,12 +21,12 @@
21 {{ languageFormat(language, "订票信息", "Ticket Info") }} 21 {{ languageFormat(language, "订票信息", "Ticket Info") }}
22 </div> 22 </div>
23 </div> 23 </div>
24 24
25 <div class="form"> 25 <div class="form">
26 <el-form ref="formRef" :model="orderForm" :rules="rules" label-width="140px"> 26 <el-form ref="formRef" :model="orderForm" :rules="rules" label-position="top" label-width="130px">
27 <div v-if="TickForm2.ticketType == '1'"> 27 <div v-if="TickForm2.ticketType == '1'">
28 <el-form-item :label="language == 0 ? '桌号' : 'Table'"> 28 <el-form-item :label="language == 0 ? '桌号' : 'Table'">
29 29
30 <!-- <el-popover :width="400" placement="right" trigger="hover">--> 30 <!-- <el-popover :width="400" placement="right" trigger="hover">-->
31 <!-- <template #reference>--> 31 <!-- <template #reference>-->
32 <!-- <div class="text-primary underline pointer" @click="showImg">--> 32 <!-- <div class="text-primary underline pointer" @click="showImg">-->
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
39 <!-- />--> 39 <!-- />-->
40 <!-- </el-popover>--> 40 <!-- </el-popover>-->
41 <!-- --> 41 <!-- -->
42 42
43 <el-radio-group v-model="currDesk"> 43 <el-radio-group v-model="currDesk">
44 <el-radio-button 44 <el-radio-button
45 v-for="(it, index) in deskList" :key="index" :disabled="it.status!=0" :label="it.deskNo" 45 v-for="(it, index) in deskList" :key="index" :disabled="it.status!=0" :label="it.deskNo"
...@@ -105,7 +105,7 @@ ...@@ -105,7 +105,7 @@
105 </div> 105 </div>
106 </div> 106 </div>
107 </el-col> 107 </el-col>
108 108
109 <el-col :lg="8" class="right"> 109 <el-col :lg="8" class="right">
110 <div class="tit_box"> 110 <div class="tit_box">
111 <div class="line" /> 111 <div class="line" />
...@@ -113,7 +113,7 @@ ...@@ -113,7 +113,7 @@
113 {{ languageFormat(language, "订单明细", "Order summary") }} 113 {{ languageFormat(language, "订单明细", "Order summary") }}
114 </div> 114 </div>
115 </div> 115 </div>
116 116
117 <div class="detail"> 117 <div class="detail">
118 <div class="detail_top"> 118 <div class="detail_top">
119 <div class="time"> 119 <div class="time">
...@@ -148,14 +148,14 @@ ...@@ -148,14 +148,14 @@
148 <span v-else>{{ language == 0 ? '夜间场' : 'Night' }}</span> 148 <span v-else>{{ language == 0 ? '夜间场' : 'Night' }}</span>
149 | {{ TickForm2.ticketName }} 149 | {{ TickForm2.ticketName }}
150 </div> 150 </div>
151 151
152 <div v-if="TickForm2.ticketType=='0'" class="address">{{ 152 <div v-if="TickForm2.ticketType=='0'" class="address">{{
153 language == 0 ? '剩余数量' : 'Remaining Quantity' 153 language == 0 ? '剩余数量' : 'Remaining Quantity'
154 }}: {{ leftCount }} 154 }}: {{ leftCount }}
155 </div> 155 </div>
156 </div> 156 </div>
157 </div> 157 </div>
158 158
159 <!-- 场馆布局图--> 159 <!-- 场馆布局图-->
160 <div style="margin-top: 30px"> 160 <div style="margin-top: 30px">
161 <el-image 161 <el-image
...@@ -256,7 +256,7 @@ onMounted(() => { ...@@ -256,7 +256,7 @@ onMounted(() => {
256 tickImg.value = route.query.tickImg 256 tickImg.value = route.query.tickImg
257 customerList() 257 customerList()
258 getDetail() 258 getDetail()
259 259
260 getActivityTypeVoById({ 260 getActivityTypeVoById({
261 id: route.params.latstId 261 id: route.params.latstId
262 }).then((res) => { 262 }).then((res) => {
...@@ -292,12 +292,12 @@ function changeGroup(e) { ...@@ -292,12 +292,12 @@ function changeGroup(e) {
292 }).then(res => { 292 }).then(res => {
293 if (res.data.length > 0) { 293 if (res.data.length > 0) {
294 const names = _.map(res.data, (d) => d.name).join(',') 294 const names = _.map(res.data, (d) => d.name).join(',')
295 295
296 ElMessage({ 296 ElMessage({
297 message: language.value == 0 ? `${names} 已购买该票` : 'The user has purchased the ticket', 297 message: language.value == 0 ? `${names} 已购买该票` : 'The user has purchased the ticket',
298 type: 'error' 298 type: 'error'
299 }) 299 })
300 300
301 _.each(res.data, (d) => { 301 _.each(res.data, (d) => {
302 _.remove(orderForm.value.customerIds, (c) => c == d.id) 302 _.remove(orderForm.value.customerIds, (c) => c == d.id)
303 _.find(personnelList.value, (p) => p.id == d.id).disabled = true 303 _.find(personnelList.value, (p) => p.id == d.id).disabled = true
...@@ -319,7 +319,7 @@ async function paymentHandle() { ...@@ -319,7 +319,7 @@ async function paymentHandle() {
319 useStore.setVisitor() 319 useStore.setVisitor()
320 return 320 return
321 } 321 }
322 322
323 if (TickForm2.value.ticketType == '1') { 323 if (TickForm2.value.ticketType == '1') {
324 if (currSeat.value.length == 0) { 324 if (currSeat.value.length == 0) {
325 ElMessage({ 325 ElMessage({
...@@ -336,9 +336,9 @@ async function paymentHandle() { ...@@ -336,9 +336,9 @@ async function paymentHandle() {
336 return 336 return
337 } 337 }
338 } 338 }
339 339
340 await formRef.value.validate() 340 await formRef.value.validate()
341 341
342 await ElMessageBox.confirm(language.value == 0 ? '确认提交订单吗?' : 'Confirm to submit the order?', { 342 await ElMessageBox.confirm(language.value == 0 ? '确认提交订单吗?' : 'Confirm to submit the order?', {
343 confirmButtonText: language.value == 0 ? '确定' : 'Confirm', 343 confirmButtonText: language.value == 0 ? '确定' : 'Confirm',
344 cancelButtonText: language.value == 0 ? '取消' : 'Cancel', 344 cancelButtonText: language.value == 0 ? '取消' : 'Cancel',
...@@ -359,7 +359,7 @@ async function paymentHandle() { ...@@ -359,7 +359,7 @@ async function paymentHandle() {
359 seatNo: tempSeat.seatNo 359 seatNo: tempSeat.seatNo
360 }) 360 })
361 }) 361 })
362 362
363 const res = await submitOrderTicket({ 363 const res = await submitOrderTicket({
364 activeId: orderForm.value.activeId, 364 activeId: orderForm.value.activeId,
365 orderName: TickForm2.value.ticketTypeName, 365 orderName: TickForm2.value.ticketTypeName,
...@@ -406,7 +406,7 @@ async function paymentHandle() { ...@@ -406,7 +406,7 @@ async function paymentHandle() {
406 } catch (e) { 406 } catch (e) {
407 ElMessage.error(language.value == 0 ? '下单失败,' : 'Order failure') 407 ElMessage.error(language.value == 0 ? '下单失败,' : 'Order failure')
408 } finally { 408 } finally {
409 409
410 } 410 }
411 }) 411 })
412 } 412 }
...@@ -450,7 +450,7 @@ div { ...@@ -450,7 +450,7 @@ div {
450 //padding: 20px 0; 450 //padding: 20px 0;
451 width: 1200px; 451 width: 1200px;
452 margin: 20px auto; 452 margin: 20px auto;
453 453
454 .tag_t { 454 .tag_t {
455 padding: 1px 10px; 455 padding: 1px 10px;
456 font-weight: 400; 456 font-weight: 400;
...@@ -460,7 +460,7 @@ div { ...@@ -460,7 +460,7 @@ div {
460 border: 1px solid #453dea; 460 border: 1px solid #453dea;
461 margin-left: 5px; 461 margin-left: 5px;
462 } 462 }
463 463
464 .title { 464 .title {
465 padding: 11px; 465 padding: 11px;
466 text-align: center; 466 text-align: center;
...@@ -468,18 +468,18 @@ div { ...@@ -468,18 +468,18 @@ div {
468 font-size: 18px; 468 font-size: 18px;
469 color: #ffffff; 469 color: #ffffff;
470 } 470 }
471 471
472 .content { 472 .content {
473 background-color: #fff; 473 background-color: #fff;
474 } 474 }
475 475
476 .line { 476 .line {
477 width: 4px; 477 width: 4px;
478 height: 18px; 478 height: 18px;
479 background: linear-gradient(180deg, #493ceb 0%, #8623fc 100%); 479 background: linear-gradient(180deg, #493ceb 0%, #8623fc 100%);
480 border-radius: 4px; 480 border-radius: 4px;
481 } 481 }
482 482
483 .left { 483 .left {
484 .info { 484 .info {
485 background: rgba(69, 61, 234, 0.04); 485 background: rgba(69, 61, 234, 0.04);
...@@ -487,54 +487,54 @@ div { ...@@ -487,54 +487,54 @@ div {
487 border: 1px solid #d3d1f6; 487 border: 1px solid #d3d1f6;
488 padding: 20px 0 28px 33px; 488 padding: 20px 0 28px 33px;
489 margin-bottom: 20px; 489 margin-bottom: 20px;
490 490
491 .name { 491 .name {
492 font-weight: 500; 492 font-weight: 500;
493 font-size: 18px; 493 font-size: 18px;
494 color: #000000; 494 color: #000000;
495 margin-bottom: 20px; 495 margin-bottom: 20px;
496 } 496 }
497 497
498 .address { 498 .address {
499 font-weight: 400; 499 font-weight: 400;
500 font-size: 14px; 500 font-size: 14px;
501 color: #929aa0; 501 color: #929aa0;
502 } 502 }
503 } 503 }
504 504
505 .ticket_info { 505 .ticket_info {
506 .tit_box { 506 .tit_box {
507 display: flex; 507 display: flex;
508 align-items: center; 508 align-items: center;
509 gap: 10px; 509 gap: 10px;
510 margin-bottom: 14px; 510 margin-bottom: 14px;
511 511
512 .txt { 512 .txt {
513 font-weight: bold; 513 font-weight: bold;
514 font-size: 16px; 514 font-size: 16px;
515 color: #493ceb; 515 color: #493ceb;
516 } 516 }
517 } 517 }
518 518
519 .form { 519 .form {
520 min-height: 464px; 520 min-height: 464px;
521 padding: 20px 60px; 521 padding: 20px 60px;
522 border-radius: 5px; 522 border-radius: 5px;
523 border: 1px solid #dcdfe6; 523 border: 1px solid #dcdfe6;
524 524
525 .p_box { 525 .p_box {
526 display: flex; 526 display: flex;
527 width: 100%; 527 width: 100%;
528 gap: 10px; 528 gap: 10px;
529 max-width: 400px; 529 max-width: 400px;
530 530
531 .people { 531 .people {
532 width: 100%; 532 width: 100%;
533 background: #fbfcfd; 533 background: #fbfcfd;
534 border-radius: 2px; 534 border-radius: 2px;
535 border: 1px solid #dcdfe6; 535 border: 1px solid #dcdfe6;
536 padding: 0 14px; 536 padding: 0 14px;
537 537
538 .prople_item { 538 .prople_item {
539 display: flex; 539 display: flex;
540 justify-content: space-between; 540 justify-content: space-between;
...@@ -543,30 +543,30 @@ div { ...@@ -543,30 +543,30 @@ div {
543 border-bottom: 1px solid #dcdfe6; 543 border-bottom: 1px solid #dcdfe6;
544 width: 100%; 544 width: 100%;
545 position: relative; 545 position: relative;
546 546
547 &:last-child { 547 &:last-child {
548 border: none; 548 border: none;
549 } 549 }
550 550
551 .name { 551 .name {
552 font-size: 16px; 552 font-size: 16px;
553 //color: #929aa0; 553 //color: #929aa0;
554 margin-bottom: 20px; 554 margin-bottom: 20px;
555 555
556 .tag_t { 556 .tag_t {
557 position: absolute; 557 position: absolute;
558 right: 30px; 558 right: 30px;
559 padding: 8px; 559 padding: 8px;
560 } 560 }
561 } 561 }
562 562
563 .idcard { 563 .idcard {
564 font-size: 10px; 564 font-size: 10px;
565 color: #929aa0; 565 color: #929aa0;
566 } 566 }
567 } 567 }
568 } 568 }
569 569
570 .btn { 570 .btn {
571 width: 90px; 571 width: 90px;
572 height: 40px; 572 height: 40px;
...@@ -585,30 +585,30 @@ div { ...@@ -585,30 +585,30 @@ div {
585 } 585 }
586 } 586 }
587 } 587 }
588 588
589 .right { 589 .right {
590 .tit_box { 590 .tit_box {
591 display: flex; 591 display: flex;
592 align-items: center; 592 align-items: center;
593 gap: 10px; 593 gap: 10px;
594 margin-bottom: 20px; 594 margin-bottom: 20px;
595 595
596 .txt { 596 .txt {
597 font-weight: bold; 597 font-weight: bold;
598 font-size: 16px; 598 font-size: 16px;
599 color: #493ceb; 599 color: #493ceb;
600 } 600 }
601 } 601 }
602 602
603 .detail { 603 .detail {
604 padding: 15px 26px; 604 padding: 15px 26px;
605 border-radius: 5px; 605 border-radius: 5px;
606 border: 1px solid #dcdfe6; 606 border: 1px solid #dcdfe6;
607 607
608 .detail_top { 608 .detail_top {
609 padding-bottom: 13px; 609 padding-bottom: 13px;
610 border-bottom: 1px solid #dcdfe6; 610 border-bottom: 1px solid #dcdfe6;
611 611
612 .time { 612 .time {
613 font-weight: 500; 613 font-weight: 500;
614 font-size: 20px; 614 font-size: 20px;
...@@ -616,13 +616,13 @@ div { ...@@ -616,13 +616,13 @@ div {
616 line-height: 25px; 616 line-height: 25px;
617 margin-bottom: 8px; 617 margin-bottom: 8px;
618 } 618 }
619 619
620 .ticket { 620 .ticket {
621 font-size: 16px; 621 font-size: 16px;
622 color: #2d373f; 622 color: #2d373f;
623 } 623 }
624 } 624 }
625 625
626 .detail_center { 626 .detail_center {
627 margin-top: 14px; 627 margin-top: 14px;
628 display: flex; 628 display: flex;
...@@ -630,26 +630,26 @@ div { ...@@ -630,26 +630,26 @@ div {
630 padding-bottom: 13px; 630 padding-bottom: 13px;
631 border-bottom: 1px solid #dcdfe6; 631 border-bottom: 1px solid #dcdfe6;
632 gap: 8px; 632 gap: 8px;
633 633
634 .ticket { 634 .ticket {
635 font-size: 16px; 635 font-size: 16px;
636 color: #2d373f; 636 color: #2d373f;
637 } 637 }
638 } 638 }
639 639
640 .detail_b { 640 .detail_b {
641 display: flex; 641 display: flex;
642 justify-content: space-between; 642 justify-content: space-between;
643 align-items: center; 643 align-items: center;
644 margin-top: 16px; 644 margin-top: 16px;
645 645
646 .sum_txt { 646 .sum_txt {
647 font-weight: 600; 647 font-weight: 600;
648 font-size: 18px; 648 font-size: 18px;
649 color: #2d373f; 649 color: #2d373f;
650 line-height: 25px; 650 line-height: 25px;
651 } 651 }
652 652
653 .price_num { 653 .price_num {
654 font-weight: 600; 654 font-weight: 600;
655 font-size: 36px; 655 font-size: 36px;
...@@ -659,7 +659,7 @@ div { ...@@ -659,7 +659,7 @@ div {
659 } 659 }
660 } 660 }
661 } 661 }
662 662
663 .footer { 663 .footer {
664 display: flex; 664 display: flex;
665 justify-content: space-between; 665 justify-content: space-between;
...@@ -669,20 +669,20 @@ div { ...@@ -669,20 +669,20 @@ div {
669 box-shadow: 0px 0px 46px 0px rgba(1, 16, 64, 0.08); 669 box-shadow: 0px 0px 46px 0px rgba(1, 16, 64, 0.08);
670 margin-top: 9px; 670 margin-top: 9px;
671 padding: 0 30px; 671 padding: 0 30px;
672 672
673 .label { 673 .label {
674 font-size: 16px; 674 font-size: 16px;
675 color: #7b7f83; 675 color: #7b7f83;
676 line-height: 22px; 676 line-height: 22px;
677 } 677 }
678 678
679 .value { 679 .value {
680 font-size: 22px; 680 font-size: 22px;
681 color: #ff8124; 681 color: #ff8124;
682 line-height: 30px; 682 line-height: 30px;
683 font-weight: 600; 683 font-weight: 600;
684 } 684 }
685 685
686 .pay { 686 .pay {
687 width: 200px; 687 width: 200px;
688 height: 40px; 688 height: 40px;
...@@ -696,7 +696,7 @@ div { ...@@ -696,7 +696,7 @@ div {
696 cursor: pointer; 696 cursor: pointer;
697 user-select: none; 697 user-select: none;
698 } 698 }
699 699
700 .goBack { 700 .goBack {
701 width: 200px; 701 width: 200px;
702 height: 40px; 702 height: 40px;
...@@ -725,12 +725,6 @@ div { ...@@ -725,12 +725,6 @@ div {
725 cursor: pointer 725 cursor: pointer
726 } 726 }
727 727
728 @media screen and (max-width: 768px) {
729 .container {
730 width: 100%;
731 }
732 }
733
734 .rightBox { 728 .rightBox {
735 .info { 729 .info {
736 background: rgba(69, 61, 234, 0.04); 730 background: rgba(69, 61, 234, 0.04);
...@@ -741,4 +735,49 @@ div { ...@@ -741,4 +735,49 @@ div {
741 margin-top: 30px; 735 margin-top: 30px;
742 } 736 }
743 } 737 }
738
739 @media screen and (max-width: 768px) {
740 .container {
741 width: 100%;
742
743 :deep(.form) {
744 padding: 30px 0 !important;
745
746 form {
747 padding: 10px;
748 }
749 }
750
751 .footer {
752 display: block;
753 width: 100%;
754 height: auto;
755 padding: 20px;
756
757 div {
758 width: 100%;
759 }
760
761 .goBack {
762 width: 140px;
763 position: relative;
764 height: 40px;
765 top: 0;
766 left: 0%;
767 margin: 10px 0;
768 }
769
770 .pay {
771 width: 140px;
772 position: relative;
773 height: 40px;
774 top: -50px;
775 left: 55%;
776 }
777 }
778
779 }
780
781
782 }
744 </style> 783 </style>
......
...@@ -2,237 +2,245 @@ ...@@ -2,237 +2,245 @@
2 <div> 2 <div>
3 <!-- top --> 3 <!-- top -->
4 <div class="container top "> 4 <div class="container top ">
5 <img :src="fillImgUrl(matchForm.ticketImg)" alt="" class="cover_img"> 5 <el-row :gutter="20" style="width: 100%">
6 <div class="info"> 6 <el-col :lg="12" :md="12" :sm="24" :xs="24">
7 <div class="title">{{ matchForm.name }}</div> 7 <img :src="fillImgUrl(matchForm.ticketImg)" alt="" class="cover_img">
8 <div class="time"> 8 </el-col>
9 {{ triggerLanguage(language, "时间", "Event Date & Time") }}{{ 9 <el-col :lg="12" :md="12" :sm="24" :xs="24">
10 matchForm.beginTime 10 <div class="info">
11 ? dayjs(matchForm.beginTime).format("YYYY.MM.DD") 11 <div class="title">{{ matchForm.name }}</div>
12 : "" 12 <div class="time">
13 }} 13 {{ triggerLanguage(language, "时间", "Event Date & Time") }}{{
14 {{ 14 matchForm.beginTime
15 matchForm.beginTime 15 ? dayjs(matchForm.beginTime).format("YYYY.MM.DD")
16 ? getDayName( 16 : ""
17 new Date(matchForm.beginTime), 17 }}
18 language == 1 ? "en-US" : "zh-CN" 18 {{
19 ) 19 matchForm.beginTime
20 : "" 20 ? getDayName(
21 }} 21 new Date(matchForm.beginTime),
22 22 language == 1 ? "en-US" : "zh-CN"
23 {{ 23 )
24 matchForm.endTime 24 : ""
25 ? dayjs(matchForm.endTime).format("YYYY.MM.DD") 25 }}
26 : "" 26
27 }} 27 {{
28 {{ 28 matchForm.endTime
29 matchForm.endTime 29 ? dayjs(matchForm.endTime).format("YYYY.MM.DD")
30 ? getDayName( 30 : ""
31 new Date(matchForm.endTime), 31 }}
32 language == 1 ? "en-US" : "zh-CN" 32 {{
33 ) 33 matchForm.endTime
34 : "" 34 ? getDayName(
35 }} 35 new Date(matchForm.endTime),
36 </div> 36 language == 1 ? "en-US" : "zh-CN"
37 <div class="address"> 37 )
38 {{ triggerLanguage(language, "地址", "Location") }}{{ matchForm.address }} 38 : ""
39 </div> 39 }}
40
41
42 <div v-if="timeData>0">
43 <!-- 倒计时-->
44
45 <p class="countDownTitle">
46 <span v-if="language==0">售票倒计时</span>
47 <span v-else>TICKET COUNTDOWN</span>
48 </p>
49 <van-count-down :time="timeData" format="DD 天 HH 时 mm 分 ss 秒">
50 <template #default="timeData">
51 <span class="block">{{ timeData.days }}</span>
52 <span class="colon">{{ language == 0 ? '天' : 'Days' }}</span>
53 <span class="block">{{ timeData.hours }}</span>
54 <span class="colon">{{ language == 0 ? '时' : 'Hrs' }}</span>
55 <span class="block">{{ timeData.minutes }}</span>
56 <span class="colon">{{ language == 0 ? '分' : 'Min' }}</span>
57 <span class="block">{{ timeData.seconds }}</span>
58 <span class="colon">{{ language == 0 ? '秒' : 'Sec' }}</span>
59 </template>
60 </van-count-down>
61 </div>
62 <div v-else>
63
64 <!-- 票档 -->
65 <div class="select_item_box">
66 <div class="label">
67 {{ triggerLanguage(language, "票档", "Tickets") }} :
68 </div>
69 </div>
70 <div class="select_item_box">
71 <div class="select_item">
72 <div
73 v-for="(it, index) in tickClass"
74 :key="index"
75 :class="[
76 it.id == selectForm.latId ? 'tagActive' : 'tag',
77 it.overdueView=='0' ? 'forbid' : '',
78 (it.ticketPackage==1 && overdueView=='0') ?'forbid':''
79 ]"
80 @click="select(it)"
81 >
82 {{ it.ticketTypeName }}<span v-if="it.ticketPackage==1" class="tao">{{
83 language == 0 ? '套票' : 'Package ticket'
84 }}</span>
85 </div>
86 </div> 40 </div>
87 </div> 41 <div class="address">
88 42 {{ triggerLanguage(language, "地址", "Location") }}{{ matchForm.address }}
89 <!-- 场馆 -->
90 <div class="select_item_box">
91 <div class="label">
92 {{ triggerLanguage(language, "场馆", "Venues") }} :
93 </div> 43 </div>
94 <div> 44
95 <span 45
96 v-if="currVenue?.images" 46 <div v-if="timeData>0">
97 style="color: #493ceb;cursor:pointer;font-weight:600;font-size: 14px" 47 <!-- 倒计时-->
98 @click="handleImage" 48
99 > <span style="color: red;font-size: 18px">*</span> 49 <p class="countDownTitle">
100 {{ 50 <span v-if="language==0">售票倒计时</span>
101 language == 0 ? '点击查看场馆布局' : 'View Venue Layout' 51 <span v-else>TICKET COUNTDOWN</span>
102 }} 52 </p>
103 </span> 53 <van-count-down :time="timeData" format="DD 天 HH 时 mm 分 ss 秒">
54 <template #default="timeData">
55 <span class="block">{{ timeData.days }}</span>
56 <span class="colon">{{ language == 0 ? '天' : 'Days' }}</span>
57 <span class="block">{{ timeData.hours }}</span>
58 <span class="colon">{{ language == 0 ? '时' : 'Hrs' }}</span>
59 <span class="block">{{ timeData.minutes }}</span>
60 <span class="colon">{{ language == 0 ? '分' : 'Min' }}</span>
61 <span class="block">{{ timeData.seconds }}</span>
62 <span class="colon">{{ language == 0 ? '秒' : 'Sec' }}</span>
63 </template>
64 </van-count-down>
104 </div> 65 </div>
105 </div> 66 <div v-else>
106 <div class="select_item_box"> 67
107 <div class="select_item"> 68 <!-- 票档 -->
108 <div 69 <div class="select_item_box">
109 v-for="(it, index) in venueList" 70 <div class="label">
110 :key="index" 71 {{ triggerLanguage(language, "票档", "Tickets") }} :
111 :class="[ 72 </div>
112 it.id == selectForm.latsId ? 'tagActive' : 'tag',
113 it.isView==0?'forbid':''
114 ]"
115 @click="selectVenue(it)"
116 >
117 {{ it.name }}
118 </div> 73 </div>
119 <div v-if="remarks" class="remarks">{{ remarks }}</div> 74 <div class="select_item_box">
120 </div> 75 <div class="select_item">
121 </div> 76 <div
122 77 v-for="(it, index) in tickClass"
123 <!-- 场次 --> 78 :key="index"
124 <div class="select_item_box"> 79 :class="[
125 <div class="label"> 80 it.id == selectForm.latId ? 'tagActive' : 'tag',
126 {{ triggerLanguage(language, "场次", "Session") }} : 81 it.overdueView=='0' ? 'forbid' : '',
127 </div> 82 (it.ticketPackage==1 && overdueView=='0') ?'forbid':''
128 </div> 83 ]"
129 <div class="select_item_box"> 84 @click="select(it)"
130 <div class="select_item"> 85 >
131 <div 86 {{ it.ticketTypeName }}<span v-if="it.ticketPackage==1" class="tao">{{
132 v-for="(it, key) in tickList" 87 language == 0 ? '套票' : 'Package ticket'
133 :key="key" 88 }}</span>
134 :class="[ 89 </div>
135 key == selectForm.sessionType ? 'tagActive' : 'tag', 90 </div>
136 it.isView==0?'forbid':''
137 ]"
138 @click="selectSessionType(key)"
139 >
140 <span v-if="key=='1000'">{{
141 language == 0 ? '日间场' : 'Day'
142 }}</span>
143 <span v-else>{{
144 language == 0 ? '夜间场' : 'Night'
145 }}</span>
146 <!-- {{ key=='1000'?'日间场':'夜间场' }}-->
147 </div> 91 </div>
148 </div> 92
149 </div> 93 <!-- 场馆 -->
150 94 <div class="select_item_box">
151 <!-- 票型 --> 95 <div class="label">
152 <div class="select_item_box"> 96 {{ triggerLanguage(language, "场馆", "Venues") }} :
153 <div class="label"> 97 </div>
154 {{ triggerLanguage(language, "票型", "Ticket Type") }} : 98 <div>
155 </div> 99 <span
156 </div> 100 v-if="currVenue?.images"
157 <div class="select_item_box"> 101 style="color: #493ceb;cursor:pointer;font-weight:600;font-size: 14px"
158 <div class="select_item"> 102 @click="handleImage"
159 <div 103 > <span style="color: red;font-size: 18px">*</span>
160 v-for="it in tickList[selectForm.sessionType]" 104 {{
161 :key="it.id" 105 language == 0 ? '点击查看场馆布局' : 'View Venue Layout'
162 :class="[ 106 }}
163 it.id == selectForm.latstId ? 'tagActive' : 'tag', 107 </span>
164 it.isView==0?'forbid':'' 108 </div>
165 ]"
166 @click="selectTick(it)"
167 >
168 {{ it.name }}
169 </div> 109 </div>
170 <div class="father"> 110 <div class="select_item_box">
171 <el-image 111 <div class="select_item">
172 v-if="currTick?.images" 112 <div
173 :src="fillImgUrl(currTick?.images) " 113 v-for="(it, index) in venueList"
174 class="son" 114 :key="index"
175 fit="cover" 115 :class="[
176 preview-teleported 116 it.id == selectForm.latsId ? 'tagActive' : 'tag',
177 style="width:190px;height: 135px" 117 it.isView==0?'forbid':''
178 /> 118 ]"
119 @click="selectVenue(it)"
120 >
121 {{ it.name }}
122 </div>
123 <div v-if="remarks" class="remarks">{{ remarks }}</div>
124 </div>
179 </div> 125 </div>
180 </div> 126
181 127 <!-- 场次 -->
182 </div> 128 <div class="select_item_box">
183 129 <div class="label">
184 130 {{ triggerLanguage(language, "场次", "Session") }} :
185 <!-- 价格 --> 131 </div>
186 <div class="select_item_box">
187 <div class="label">
188 {{ triggerLanguage(language, '价格', "Price") }} :
189 </div>
190 </div>
191 <div class="select_item_box">
192 <div class="select_item">
193 <div class="tagActive" style="min-width: 80px">
194 {{ language == 0 ? '¥' : '€' }} {{ language == 0 ? selectForm.price : selectForm.priceEn }}
195 </div> 132 </div>
133 <div class="select_item_box">
134 <div class="select_item">
135 <div
136 v-for="(it, key) in tickList"
137 :key="key"
138 :class="[
139 key == selectForm.sessionType ? 'tagActive' : 'tag',
140 it.isView==0?'forbid':''
141 ]"
142 @click="selectSessionType(key)"
143 >
144 <span v-if="key=='1000'">{{
145 language == 0 ? '日间场' : 'Day'
146 }}</span>
147 <span v-else>{{
148 language == 0 ? '夜间场' : 'Night'
149 }}</span>
150 <!-- {{ key=='1000'?'日间场':'夜间场' }}-->
151 </div>
152 </div>
153 </div>
154
155 <!-- 票型 -->
156 <div class="select_item_box">
157 <div class="label">
158 {{ triggerLanguage(language, "票型", "Ticket Type") }} :
159 </div>
160 </div>
161 <div class="select_item_box">
162 <div class="select_item">
163 <div
164 v-for="it in tickList[selectForm.sessionType]"
165 :key="it.id"
166 :class="[
167 it.id == selectForm.latstId ? 'tagActive' : 'tag',
168 it.isView==0?'forbid':''
169 ]"
170 @click="selectTick(it)"
171 >
172 {{ it.name }}
173 </div>
174 <div class="father">
175 <el-image
176 v-if="currTick?.images"
177 :src="fillImgUrl(currTick?.images) "
178 class="son"
179 fit="cover"
180 preview-teleported
181 style="width:190px;height: 135px"
182 />
183 </div>
184 </div>
185
186 </div>
187
188
189 <!-- 价格 -->
190 <div class="select_item_box">
191 <div class="label">
192 {{ triggerLanguage(language, '价格', "Price") }} :
193 </div>
194 </div>
195 <div class="select_item_box">
196 <div class="select_item">
197 <div class="tagActive" style="min-width: 80px">
198 {{ language == 0 ? '¥' : '€' }} {{ language == 0 ? selectForm.price : selectForm.priceEn }}
199 </div>
200 </div>
201 </div>
202 <!-- 购票备注-->
203 <div v-if="matchForm.ticketRemark" class="select_item_box">
204 <div class="label">
205 {{
206 triggerLanguage(language, '购票备注', "Ticket Purchase Note")
207 }} :
208 </div>
209 </div>
210 <div v-if="matchForm.ticketRemark" class="select_item_box">
211 <div class="select_item">
212 {{ matchForm.ticketRemark }}
213 </div>
214 </div>
215
216 <div
217 v-if="isOver" class="btn"
218 style="margin-left: 40px;opacity: 0.5;cursor: not-allowed;margin-top: 10px"
219 >
220 {{
221 triggerLanguage(language, "售票结束", "Sale closed")
222 }}
223 </div>
224 <template v-else>
225 <div v-if="leftCount<=0 && leftCount!=-999" class="btn" style="margin-left: 40px;margin-top: 10px">
226 {{
227 triggerLanguage(language, "票已售罄", "Sale out")
228 }}
229 </div>
230 <div v-else class="btn" style="margin-left: 40px;margin-top: 10px" @click="toSelectSeat()">
231 {{
232 triggerLanguage(language, "立即购票", "Buy tickets now")
233 }}
234 </div>
235 </template>
196 </div> 236 </div>
197 </div> 237 </div>
198 <!-- 购票备注--> 238 </el-col>
199 <div v-if="matchForm.ticketRemark" class="select_item_box"> 239 </el-row>
200 <div class="label"> 240
201 {{ 241
202 triggerLanguage(language, '购票备注', "Ticket Purchase Note")
203 }} :
204 </div>
205 </div>
206 <div v-if="matchForm.ticketRemark" class="select_item_box">
207 <div class="select_item">
208 {{ matchForm.ticketRemark }}
209 </div>
210 </div>
211
212 <div
213 v-if="isOver" class="btn"
214 style="margin-left: 40px;opacity: 0.5;cursor: not-allowed;margin-top: 10px"
215 >
216 {{
217 triggerLanguage(language, "售票结束", "Sale closed")
218 }}
219 </div>
220 <template v-else>
221 <div v-if="leftCount<=0 && leftCount!=-999" class="btn" style="margin-left: 40px;margin-top: 10px">
222 {{
223 triggerLanguage(language, "票已售罄", "Sale out")
224 }}
225 </div>
226 <div v-else class="btn" style="margin-left: 40px;margin-top: 10px" @click="toSelectSeat()">
227 {{
228 triggerLanguage(language, "立即购票", "Buy tickets now")
229 }}
230 </div>
231 </template>
232 </div>
233 </div>
234 </div> 242 </div>
235 243
236 <div class="container bottom"> 244 <div class="container bottom">
237 <div style="display: flex"> 245 <div style="display: flex">
238 <div :class="{'bg':active==1}" class="buBg" @click="active=1">{{ language == 0 ? '购票说明' : 'Notice' }}</div> 246 <div :class="{'bg':active==1}" class="buBg" @click="active=1">{{ language == 0 ? '购票说明' : 'Notice' }}</div>
...@@ -243,7 +251,7 @@ ...@@ -243,7 +251,7 @@
243 </div> 251 </div>
244 <div v-show="active==1" class="rich_content" v-html="matchForm.ticketDes" /> 252 <div v-show="active==1" class="rich_content" v-html="matchForm.ticketDes" />
245 <div v-show="active==2" class="rich_content" v-html="matchForm.ticketNotice" /> 253 <div v-show="active==2" class="rich_content" v-html="matchForm.ticketNotice" />
246 254
247 <el-dialog v-model="show" align-center title="" width="1000px"> 255 <el-dialog v-model="show" align-center title="" width="1000px">
248 <div style="padding: 20px"> 256 <div style="padding: 20px">
249 <img :src="fillImgUrl(showUrl)" alt="" style="width: 100%"> 257 <img :src="fillImgUrl(showUrl)" alt="" style="width: 100%">
...@@ -339,12 +347,12 @@ async function getTicketList() { ...@@ -339,12 +347,12 @@ async function getTicketList() {
339 activityId: activeId.value, status: 1 347 activityId: activeId.value, status: 1
340 }) 348 })
341 tickClass.value = res.rows 349 tickClass.value = res.rows
342 350
343 if (_.some(tickClass.value, (item) => item.overdueView == '0') 351 if (_.some(tickClass.value, (item) => item.overdueView == '0')
344 ) { 352 ) {
345 overdueView.value = '0' 353 overdueView.value = '0'
346 } 354 }
347 355
348 const item = _.find(tickClass.value, (item) => item.overdueView == '1') 356 const item = _.find(tickClass.value, (item) => item.overdueView == '1')
349 if (item) { 357 if (item) {
350 selectForm.value.latId = item.id 358 selectForm.value.latId = item.id
...@@ -375,7 +383,7 @@ function select(v) { ...@@ -375,7 +383,7 @@ function select(v) {
375 if (v.id == selectForm.value.latId) { 383 if (v.id == selectForm.value.latId) {
376 return 384 return
377 } 385 }
378 386
379 selectForm.value.latId = v.id 387 selectForm.value.latId = v.id
380 selectForm.value.latsId = null 388 selectForm.value.latsId = null
381 selectForm.value.sessionType = null 389 selectForm.value.sessionType = null
...@@ -384,7 +392,7 @@ function select(v) { ...@@ -384,7 +392,7 @@ function select(v) {
384 selectForm.value.price = '--' 392 selectForm.value.price = '--'
385 selectForm.value.priceEn = '--' 393 selectForm.value.priceEn = '--'
386 currTick.value = null 394 currTick.value = null
387 395
388 getVenueList() 396 getVenueList()
389 } 397 }
390 398
...@@ -392,7 +400,7 @@ function selectVenue(v) { ...@@ -392,7 +400,7 @@ function selectVenue(v) {
392 if (v.id == selectForm.value.latsId) { 400 if (v.id == selectForm.value.latsId) {
393 return 401 return
394 } 402 }
395 403
396 currVenue.value = v 404 currVenue.value = v
397 selectForm.value.latsId = v.id 405 selectForm.value.latsId = v.id
398 selectForm.value.sessionType = null 406 selectForm.value.sessionType = null
...@@ -402,7 +410,7 @@ function selectVenue(v) { ...@@ -402,7 +410,7 @@ function selectVenue(v) {
402 selectForm.value.priceEn = '--' 410 selectForm.value.priceEn = '--'
403 remarks.value = v.remarks 411 remarks.value = v.remarks
404 currTick.value = null 412 currTick.value = null
405 413
406 getTicketListType() 414 getTicketListType()
407 } 415 }
408 416
...@@ -410,9 +418,9 @@ function selectSessionType(key) { ...@@ -410,9 +418,9 @@ function selectSessionType(key) {
410 if (key == selectForm.value.sessionType) { 418 if (key == selectForm.value.sessionType) {
411 return 419 return
412 } 420 }
413 421
414 selectForm.value.sessionType = key 422 selectForm.value.sessionType = key
415 423
416 // currTick.value = tickList.value[selectForm.value.sessionType][0] 424 // currTick.value = tickList.value[selectForm.value.sessionType][0]
417 selectForm.value.latstId = currTick.value?.id 425 selectForm.value.latstId = currTick.value?.id
418 selectForm.value.price = currTick.value?.price 426 selectForm.value.price = currTick.value?.price
...@@ -425,12 +433,11 @@ function selectTick(v) { ...@@ -425,12 +433,11 @@ function selectTick(v) {
425 if (v.id == selectForm.value.latstId) { 433 if (v.id == selectForm.value.latstId) {
426 return 434 return
427 } 435 }
428 436
429 currTick.value = v 437 currTick.value = v
430 selectForm.value.latstId = v.id 438 selectForm.value.latstId = v.id
431 selectForm.value.price = v.price 439 selectForm.value.price = v.price
432 selectForm.value.priceEn = v.priceEn 440 selectForm.value.priceEn = v.priceEn
433
434 // vip票 441 // vip票
435 if (currTick.value.ticketType == '1') { 442 if (currTick.value.ticketType == '1') {
436 showUrl.value = v.images 443 showUrl.value = v.images
...@@ -438,10 +445,12 @@ function selectTick(v) { ...@@ -438,10 +445,12 @@ function selectTick(v) {
438 leftCount.value = -999 445 leftCount.value = -999
439 } else { 446 } else {
440 checkNonPayment().then(res => { 447 checkNonPayment().then(res => {
448 // debugger
441 if (res.data) { 449 if (res.data) {
442 getListByAtstId({ 450 getListByAtstId({
443 atstId: selectForm.value.latstId 451 atstId: selectForm.value.latstId
444 }).then(res => { 452 }).then(res => {
453 console.log(res.data)
445 leftCount.value = res.data 454 leftCount.value = res.data
446 if (leftCount.value > 0) { 455 if (leftCount.value > 0) {
447 showUrl.value = v.images 456 showUrl.value = v.images
...@@ -539,18 +548,18 @@ getmatchData() ...@@ -539,18 +548,18 @@ getmatchData()
539 display: flex; 548 display: flex;
540 padding: 19px; 549 padding: 19px;
541 margin-top: 26px; 550 margin-top: 26px;
542 551
543 .cover_img { 552 .cover_img {
544 width: 500px; 553 width: 500px;
545 height: 667px; 554 height: 667px;
546 object-fit: fill; 555 object-fit: fill;
547 margin-right: 36px; 556 //margin-right: 36px;
548 } 557 }
549 558
550 .info { 559 .info {
551 padding-top: 12px; 560 padding-top: 12px;
552 width: 100%; 561 width: 100%;
553 562
554 .title { 563 .title {
555 font-weight: bold; 564 font-weight: bold;
556 font-size: 28px; 565 font-size: 28px;
...@@ -558,7 +567,7 @@ getmatchData() ...@@ -558,7 +567,7 @@ getmatchData()
558 line-height: 1.6; 567 line-height: 1.6;
559 margin-bottom: 15px; 568 margin-bottom: 15px;
560 } 569 }
561 570
562 .time { 571 .time {
563 font-weight: 600; 572 font-weight: 600;
564 font-size: 16px; 573 font-size: 16px;
...@@ -566,7 +575,7 @@ getmatchData() ...@@ -566,7 +575,7 @@ getmatchData()
566 line-height: 24px; 575 line-height: 24px;
567 margin-bottom: 16px; 576 margin-bottom: 16px;
568 } 577 }
569 578
570 .address { 579 .address {
571 font-weight: 600; 580 font-weight: 600;
572 font-size: 16px; 581 font-size: 16px;
...@@ -574,15 +583,15 @@ getmatchData() ...@@ -574,15 +583,15 @@ getmatchData()
574 line-height: 24px; 583 line-height: 24px;
575 margin-bottom: 15px; 584 margin-bottom: 15px;
576 } 585 }
577 586
578 .select_item_box { 587 .select_item_box {
579 display: flex; 588 display: flex;
580 margin-bottom: 10px; 589 margin-bottom: 10px;
581 590
582 &:last-child { 591 &:last-child {
583 margin-bottom: 0; 592 margin-bottom: 0;
584 } 593 }
585 594
586 .label { 595 .label {
587 font-weight: 600; 596 font-weight: 600;
588 font-size: 16px; 597 font-size: 16px;
...@@ -591,19 +600,19 @@ getmatchData() ...@@ -591,19 +600,19 @@ getmatchData()
591 margin-right: 12px; 600 margin-right: 12px;
592 flex-shrink: 0; 601 flex-shrink: 0;
593 } 602 }
594 603
595 .forbid { 604 .forbid {
596 pointer-events: none; 605 pointer-events: none;
597 opacity: 0.5 !important; 606 opacity: 0.5 !important;
598 cursor: not-allowed !important; 607 cursor: not-allowed !important;
599 } 608 }
600 609
601 .select_item { 610 .select_item {
602 display: flex; 611 display: flex;
603 flex-wrap: wrap; 612 flex-wrap: wrap;
604 gap: 10px; 613 gap: 10px;
605 user-select: none; 614 user-select: none;
606 615
607 .tag_t { 616 .tag_t {
608 padding: 1px 15px; 617 padding: 1px 15px;
609 font-weight: 400; 618 font-weight: 400;
...@@ -613,7 +622,7 @@ getmatchData() ...@@ -613,7 +622,7 @@ getmatchData()
613 border: 1px solid #453dea; 622 border: 1px solid #453dea;
614 margin-left: 5px; 623 margin-left: 5px;
615 } 624 }
616 625
617 .tag { 626 .tag {
618 display: flex; 627 display: flex;
619 padding: 12px 18px; 628 padding: 12px 18px;
...@@ -624,7 +633,7 @@ getmatchData() ...@@ -624,7 +633,7 @@ getmatchData()
624 color: #4a4a4a; 633 color: #4a4a4a;
625 cursor: pointer; 634 cursor: pointer;
626 } 635 }
627 636
628 .tagActive { 637 .tagActive {
629 display: flex; 638 display: flex;
630 padding: 12px 18px; 639 padding: 12px 18px;
...@@ -635,14 +644,14 @@ getmatchData() ...@@ -635,14 +644,14 @@ getmatchData()
635 color: #493ceb; 644 color: #493ceb;
636 cursor: pointer; 645 cursor: pointer;
637 } 646 }
638 647
639 .tao { 648 .tao {
640 border: 1px solid #493ceb; 649 border: 1px solid #493ceb;
641 font-size: 14px; 650 font-size: 14px;
642 color: #493ceb; 651 color: #493ceb;
643 margin-left: 10px; 652 margin-left: 10px;
644 } 653 }
645 654
646 .tagDisabled { 655 .tagDisabled {
647 padding: 12px 18px; 656 padding: 12px 18px;
648 background: #878787; 657 background: #878787;
...@@ -654,7 +663,7 @@ getmatchData() ...@@ -654,7 +663,7 @@ getmatchData()
654 } 663 }
655 } 664 }
656 } 665 }
657 666
658 .btn { 667 .btn {
659 width: 175px; 668 width: 175px;
660 height: 40px; 669 height: 40px;
...@@ -674,7 +683,7 @@ getmatchData() ...@@ -674,7 +683,7 @@ getmatchData()
674 padding: 50px; 683 padding: 50px;
675 margin-top: 30px; 684 margin-top: 30px;
676 margin-bottom: 30px; 685 margin-bottom: 30px;
677 686
678 .title { 687 .title {
679 padding: 20px 30px; 688 padding: 20px 30px;
680 background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%); 689 background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%);
...@@ -684,90 +693,18 @@ getmatchData() ...@@ -684,90 +693,18 @@ getmatchData()
684 line-height: 30px; 693 line-height: 30px;
685 margin-bottom: 30px; 694 margin-bottom: 30px;
686 } 695 }
687 696
688 .rich_content { 697 .rich_content {
689 margin-top: 30px; 698 margin-top: 30px;
690 699
691 :deep(img) { 700 :deep(img) {
692 width: 100% !important; 701 width: 100% !important;
693 height: auto !important; 702 height: auto !important;
694 } 703 }
695 704
696 } 705 }
697 } 706 }
698 707
699 @media screen and (max-width: 768px) {
700 .container {
701 width: 100%;
702 }
703 .forWei {
704 display: block
705 }
706 .top {
707 //transform: scale(0.5);transform-origin: left top;
708 .cover_img {
709 width: 120px;
710 height: 160px;
711 margin-right: 15px;
712 }
713
714 .info {
715 padding: 0;
716
717 .title {
718 font-size: 14px;
719 margin: 0;
720 }
721
722 .time, .address, .label, .tip {
723 font-size: 12px;
724 }
725
726 .title, .time, .address, .tip, .select_item_box {
727 margin-bottom: 3px;
728 }
729
730 .select_item_box {
731 .label {
732 font-size: 12px;
733 }
734
735 .select_item .tag {
736 padding: 2px 10px;
737 font-size: 12px;
738 }
739
740 .select_item .tagActive {
741 padding: 2px 10px;
742 font-size: 12px;
743 }
744
745 .select_item .tagDisabled {
746 padding: 2px 10px;
747 font-size: 12px;
748 }
749 }
750
751 .btn {
752 display: inline-block;
753 margin: 10px 0 0;
754 background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%);
755 border-radius: 20px;
756 line-height: 40px;
757 text-align: center;
758 font-weight: 500;
759 font-size: 16px;
760 color: #ffffff;
761 cursor: pointer;
762 }
763 }
764 }
765 .bottom {
766 padding: 0
767 }
768
769
770 }
771 708
772 .countDownTitle { 709 .countDownTitle {
773 text-align: center; 710 text-align: center;
...@@ -850,4 +787,85 @@ getmatchData() ...@@ -850,4 +787,85 @@ getmatchData()
850 color: #4a4a4a !important; 787 color: #4a4a4a !important;
851 cursor: no-drop !important; 788 cursor: no-drop !important;
852 } 789 }
790
791
792 @media screen and (max-width: 768px) {
793 .container {
794 width: 100%;
795 }
796 .forWei {
797 display: block
798 }
799 .top {
800 //transform: scale(0.5);transform-origin: left top;
801 .cover_img {
802 width: 120px;
803 height: 160px;
804 margin-right: 15px;
805 }
806
807 .info {
808 padding: 0;
809
810 .title {
811 font-size: 14px;
812 margin: 0;
813 }
814
815 .time, .address, .label, .tip {
816 font-size: 12px;
817 }
818
819 .title, .time, .address, .tip, .select_item_box {
820 margin-bottom: 3px;
821 }
822
823 .select_item_box {
824 .label {
825 font-size: 12px;
826 }
827
828 .select_item .tag {
829 padding: 2px 10px;
830 font-size: 12px;
831 }
832
833 .select_item .tagActive {
834 padding: 2px 10px;
835 font-size: 12px;
836 }
837
838 .select_item .tagDisabled {
839 padding: 2px 10px;
840 font-size: 12px;
841 }
842 }
843
844 .btn {
845 display: inline-block;
846 margin: 10px 0 0;
847 background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%);
848 border-radius: 20px;
849 line-height: 40px;
850 text-align: center;
851 font-weight: 500;
852 font-size: 16px;
853 color: #ffffff;
854 cursor: pointer;
855 }
856 }
857 }
858 .bottom {
859 padding: 0
860 }
861
862 .father {
863 .son {
864 width: 85px !important;
865 height: 67.5px !important;
866 left: 50px;
867 top: 10px;
868 }
869 }
870 }
853 </style> 871 </style>
......
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
7 <span> 7 <span>
8 {{ languageFormat(language, "观影人管理", "Viewers") }} 8 {{ languageFormat(language, "观影人管理", "Viewers") }}
9 </span> 9 </span>
10 10
11 <span class="fr" style="cursor: pointer" @click="$router.go(-1)"> 11 <span class="fr" style="cursor: pointer" @click="$router.go(-1)">
12 {{ language == 0 ? '返回' : 'Back' }} 12 {{ language == 0 ? '返回' : 'Back' }}
13 </span> 13 </span>
...@@ -25,12 +25,12 @@ ...@@ -25,12 +25,12 @@
25 </div> 25 </div>
26 </div> 26 </div>
27 </div> 27 </div>
28 28
29 <el-dialog 29 <el-dialog
30 v-model="show" 30 v-model="show"
31 :title="language==0?'新增观影人':'New moviegoers'" 31 :title="language==0?'新增观影人':'New moviegoers'"
32 center 32 center
33 width="700" 33 style="max-width: 700px;min-width: 350px;"
34 > 34 >
35 <el-form 35 <el-form
36 ref="formRef" :model="form" :rules="rules" label-width="100px" size="large" 36 ref="formRef" :model="form" :rules="rules" label-width="100px" size="large"
...@@ -50,13 +50,20 @@ ...@@ -50,13 +50,20 @@
50 <el-input v-model="form.idCard" :placeholder="language==0?'请输入证件号':'Please enter the ID after ah'" /> 50 <el-input v-model="form.idCard" :placeholder="language==0?'请输入证件号':'Please enter the ID after ah'" />
51 </el-form-item> 51 </el-form-item>
52 </el-form> 52 </el-form>
53 53
54 <span class="dialog-footer"> 54 <div class="dialog-footer">
55 <div style="text-align: center"> 55 <div style="text-align: center">
56 <el-button class="can_pay" @click="show = false">{{ language == 0 ? '取 消' : 'cancel' }}</el-button> 56 <el-button class="can_pay marginBtn" @click="show = false">{{
57 <el-button class="pay" type="primary" @click="submit">{{ language == 0 ? '确 定' : 'confirm' }}</el-button> 57 language == 0 ? '取 消' : 'cancel'
58 }}
59 </el-button>
60 <el-button class="pay marginBtn" type="primary" @click="submit">{{
61 language == 0 ? '确 定' : 'confirm'
62 }}
63 </el-button>
58 </div> 64 </div>
59 </span> 65 </div>
66 <br>
60 </el-dialog> 67 </el-dialog>
61 </el-card> 68 </el-card>
62 69
...@@ -114,7 +121,7 @@ function submit() { ...@@ -114,7 +121,7 @@ function submit() {
114 useStore().setVisitor() 121 useStore().setVisitor()
115 return 122 return
116 } 123 }
117 124
118 formRef.value.validate((valid) => { 125 formRef.value.validate((valid) => {
119 if (valid) { 126 if (valid) {
120 aadCustomer(form.value).then(res => { 127 aadCustomer(form.value).then(res => {
...@@ -173,12 +180,12 @@ div { ...@@ -173,12 +180,12 @@ div {
173 180
174 :deep(.el-dialog) { 181 :deep(.el-dialog) {
175 padding: 0; 182 padding: 0;
176 183
177 .el-dialog__header { 184 .el-dialog__header {
178 height: 50px; 185 height: 50px;
179 line-height: 50px; 186 line-height: 50px;
180 background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%); 187 background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%);
181 188
182 .el-dialog__title { 189 .el-dialog__title {
183 color: #fff; 190 color: #fff;
184 } 191 }
...@@ -219,7 +226,7 @@ div { ...@@ -219,7 +226,7 @@ div {
219 //} 226 //}
220 width: 1200px; 227 width: 1200px;
221 margin: 20px auto; 228 margin: 20px auto;
222 229
223 .title { 230 .title {
224 position: relative; 231 position: relative;
225 padding: 11px; 232 padding: 11px;
...@@ -227,7 +234,7 @@ div { ...@@ -227,7 +234,7 @@ div {
227 background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%); 234 background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%);
228 font-size: 18px; 235 font-size: 18px;
229 color: #ffffff; 236 color: #ffffff;
230 237
231 .add_btn { 238 .add_btn {
232 position: absolute; 239 position: absolute;
233 left: 20px; 240 left: 20px;
...@@ -247,32 +254,32 @@ div { ...@@ -247,32 +254,32 @@ div {
247 cursor: pointer; 254 cursor: pointer;
248 } 255 }
249 } 256 }
250 257
251 .content { 258 .content {
252 min-height: 590px; 259 min-height: 590px;
253 background-color: #fff; 260 background-color: #fff;
254 box-shadow: 0px 0px 46px 0px rgba(1, 16, 64, 0.08); 261 box-shadow: 0px 0px 46px 0px rgba(1, 16, 64, 0.08);
255 padding: 20px; 262 padding: 20px;
256 263
257 .people_box { 264 .people_box {
258 display: flex; 265 display: flex;
259 flex-wrap: wrap; 266 flex-wrap: wrap;
260 gap: 20px; 267 gap: 20px;
261 268
262 .people_item { 269 .people_item {
263 width: 275px; 270 width: 275px;
264 height: 137px; 271 height: 137px;
265 background: #ffffff; 272 background: #ffffff;
266 border: 1px solid #dcdfe6; 273 border: 1px solid #dcdfe6;
267 padding: 16px; 274 padding: 16px;
268 275
269 .name { 276 .name {
270 font-weight: 600; 277 font-weight: 600;
271 font-size: 16px; 278 font-size: 16px;
272 color: #2d373f; 279 color: #2d373f;
273 line-height: 22px; 280 line-height: 22px;
274 } 281 }
275 282
276 .idcard { 283 .idcard {
277 font-size: 16px; 284 font-size: 16px;
278 color: #95a1a6; 285 color: #95a1a6;
...@@ -280,7 +287,7 @@ div { ...@@ -280,7 +287,7 @@ div {
280 margin-top: 12px; 287 margin-top: 12px;
281 margin-bottom: 17px; 288 margin-bottom: 17px;
282 } 289 }
283 290
284 .btn { 291 .btn {
285 width: 69px; 292 width: 69px;
286 height: 32px; 293 height: 32px;
...@@ -302,5 +309,12 @@ div { ...@@ -302,5 +309,12 @@ div {
302 .container { 309 .container {
303 width: 100%; 310 width: 100%;
304 } 311 }
312 form {
313 margin: 20px 20px 0 0 !important;
314 }
315 }
316
317 .marginBtn {
318 margin: 5px
305 } 319 }
306 </style> 320 </style>
......
1 <template> 1 <template>
2 <el-dialog v-model="show" :title="title" destroy-on-close width="400px" @close="close"> 2 <el-dialog
3 v-model="show" :title="title" destroy-on-close style="min-width: 350px;max-width: 450px"
4 @close="close"
5 >
3 <div> 6 <div>
4 <h2 v-if="cptName" class="text-warning text-center">{{ cptName }}</h2> 7 <h2 v-if="cptName" class="text-warning text-center">{{ cptName }}</h2>
5 8
......
...@@ -25,7 +25,7 @@ ...@@ -25,7 +25,7 @@
25 </el-button> 25 </el-button>
26 </div> 26 </div>
27 27
28 <div v-if="list.length>0"> 28 <div v-if="list.length>0" class="rollY">
29 <div v-for="(form, index) in list" :key="index" class="nowteamItem"> 29 <div v-for="(form, index) in list" :key="index" class="nowteamItem">
30 <div class="info"> 30 <div class="info">
31 <div class="nowName text-center"> 31 <div class="nowName text-center">
...@@ -69,7 +69,7 @@ ...@@ -69,7 +69,7 @@
69 <div v-if="showGroupList" class="text-danger text-center"> 69 <div v-if="showGroupList" class="text-danger text-center">
70 {{ language == 0 ? '找到多个团体' : 'Found multiple teams' }} 70 {{ language == 0 ? '找到多个团体' : 'Found multiple teams' }}
71 </div> 71 </div>
72 <div v-if="showGroupList" class="groupList"> 72 <div v-if="showGroupList" class="groupList rollY">
73 <ul> 73 <ul>
74 <li v-for="(item, index) in groupList" :key="index" @click="showDetail(item)">{{ item }} 74 <li v-for="(item, index) in groupList" :key="index" @click="showDetail(item)">{{ item }}
75 <el-icon class="fr"> 75 <el-icon class="fr">
...@@ -83,6 +83,7 @@ ...@@ -83,6 +83,7 @@
83 <el-collapse-item 83 <el-collapse-item
84 v-for="(team,index) in teamlist" :key="index" :name="index" 84 v-for="(team,index) in teamlist" :key="index" :name="index"
85 :title="team[0][0].groupName" 85 :title="team[0][0].groupName"
86 class="rollY"
86 > 87 >
87 <div v-for="(p,jndex) in team" :key="jndex" class="nowteamItem"> 88 <div v-for="(p,jndex) in team" :key="jndex" class="nowteamItem">
88 <div class="fontSize14 text-bold">{{ p[0].zuInfo }}</div> 89 <div class="fontSize14 text-bold">{{ p[0].zuInfo }}</div>
...@@ -289,8 +290,13 @@ function showDetail(name) { ...@@ -289,8 +290,13 @@ function showDetail(name) {
289 } 290 }
290 291
291 .searchBox { 292 .searchBox {
292 height: 50vh; 293 //height: 50vh;
293 //overflow: hidden; 294 //overflow: hidden;
294 overflow-y: hidden; 295 overflow-y: hidden;
295 } 296 }
297
298 .rollY {
299 height: 45vh;
300 overflow-y: auto;
301 }
296 </style> 302 </style>
......
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
26 </el-button> 26 </el-button>
27 </div> 27 </div>
28 28
29 <div v-if="list.length>0" class="mt30"> 29 <div v-if="list.length>0" class="mt30 rollY">
30 <el-timeline> 30 <el-timeline>
31 <el-timeline-item 31 <el-timeline-item
32 v-for="(form, index) in list" 32 v-for="(form, index) in list"
...@@ -66,7 +66,7 @@ ...@@ -66,7 +66,7 @@
66 <div v-if="showGroupList" class="text-danger text-center"> 66 <div v-if="showGroupList" class="text-danger text-center">
67 {{ language == 0 ? '找到多个团体' : 'Found multiple teams' }} 67 {{ language == 0 ? '找到多个团体' : 'Found multiple teams' }}
68 </div> 68 </div>
69 <div v-if="showGroupList" class="groupList"> 69 <div v-if="showGroupList" class="groupList rollY">
70 <ul> 70 <ul>
71 <li v-for="(item, index) in groupList" :key="index" @click="showDetail(item)">{{ item }} 71 <li v-for="(item, index) in groupList" :key="index" @click="showDetail(item)">{{ item }}
72 <el-icon class="fr"> 72 <el-icon class="fr">
...@@ -75,7 +75,7 @@ ...@@ -75,7 +75,7 @@
75 </li> 75 </li>
76 </ul> 76 </ul>
77 </div> 77 </div>
78 <div v-if="teamlist.length>0" class="temell mt20"> 78 <div v-if="teamlist.length>0" class="temell mt20 rollY">
79 <el-collapse accordion> 79 <el-collapse accordion>
80 <el-collapse-item v-for="(team,index) in teamlist" :key="index" :name="index" :title="team[0].title"> 80 <el-collapse-item v-for="(team,index) in teamlist" :key="index" :name="index" :title="team[0].title">
81 <el-timeline> 81 <el-timeline>
...@@ -109,7 +109,7 @@ ...@@ -109,7 +109,7 @@
109 }} 109 }}
110 </el-button> 110 </el-button>
111 </div> 111 </div>
112 <div v-if="list.length>0" class="temell mt20"> 112 <div v-if="list.length>0" class="temell mt20 rollY">
113 <el-timeline> 113 <el-timeline>
114 <el-timeline-item v-for="(team,j) in list" :key="j" placement="top"> 114 <el-timeline-item v-for="(team,j) in list" :key="j" placement="top">
115 <div v-for="(form, index) in team" v-show="index==0" :key="index"> 115 <div v-for="(form, index) in team" v-show="index==0" :key="index">
...@@ -362,6 +362,11 @@ function showDetail(name) { ...@@ -362,6 +362,11 @@ function showDetail(name) {
362 362
363 .searchBox { 363 .searchBox {
364 height: 50vh; 364 height: 50vh;
365 //overflow-y: auto;
366 }
367
368 .rollY {
369 height: 45vh;
365 overflow-y: auto; 370 overflow-y: auto;
366 } 371 }
367 </style> 372 </style>
......
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
9 class="pcloginpop" 9 class="pcloginpop"
10 close-icon="CircleClose" 10 close-icon="CircleClose"
11 destroy-on-close 11 destroy-on-close
12 width="450px" 12 style="max-width: 450px;min-width: 350px"
13 @close="close" 13 @close="close"
14 > 14 >
15 <div class="pd10" /> 15 <div class="pd10" />
...@@ -589,7 +589,8 @@ const goPolicy = () => { ...@@ -589,7 +589,8 @@ const goPolicy = () => {
589 .rItem { 589 .rItem {
590 height: 130px; 590 height: 130px;
591 cursor: pointer; 591 cursor: pointer;
592 width: 350px; 592 max-width: 350px;
593 min-width: 300px;
593 padding: 1px; 594 padding: 1px;
594 margin: 20px auto; 595 margin: 20px auto;
595 596
......
1 <template> 1 <template>
2 <el-dialog v-model="show" :title="language==0?'快捷注册':'Quick Login'" close-icon="CircleClose" 2 <el-dialog
3 width="480" :append-to-body="true" destroy-on-close @close="close"> 3 v-model="show" :append-to-body="true" :title="language==0?'快捷注册':'Quick Login'"
4 close-icon="CircleClose" destroy-on-close style="max-width: 480px;min-width: 350px"
5 @close="close"
6 >
4 <div> 7 <div>
5 <el-form class="d-form" size="large" :label-width="language==0?80:150" :label-position="language==0?'right':'top'" style="max-width: 500px;margin: auto"> 8 <el-form
9 :label-position="language==0?'right':'top'" :label-width="language==0?80:150" class="d-form" size="large"
10 style="max-width: 500px;margin: auto"
11 >
6 <el-form-item :label="language==0?'邮箱':'E-mail'" required> 12 <el-form-item :label="language==0?'邮箱':'E-mail'" required>
7 <el-input type="text" v-model="form.account" @change="resetCode" @blur="verifyCode" 13 <el-input v-model="form.account" type="text" @blur="verifyCode" @change="resetCode" />
8 /> 14 <div v-if="language==0" class="tip">
9 <div class="tip" v-if="language==0">
10 (请填写正确的邮箱信息,邮箱信息在注册完成后无法修改。 15 (请填写正确的邮箱信息,邮箱信息在注册完成后无法修改。
11 该邮箱后续会作为您登录的账户, 16 该邮箱后续会作为您登录的账户,
12 并接收报名审核结果、支付账单、签证邀请函等相关信息。) 17 并接收报名审核结果、支付账单、签证邀请函等相关信息。)
13 </div> 18 </div>
14 <div v-else class="tip"> 19 <div v-else class="tip">
15 Please fill in the correct email, which cannot be changed after the registration is completed. The email will be used as your login account and to receive relevant information including results of registration review, payment bills, visa invitation letters, etc. 20 Please fill in the correct email, which cannot be changed after the registration is completed. The email
21 will be used as your login account and to receive relevant information including results of registration
22 review, payment bills, visa invitation letters, etc.
16 </div> 23 </div>
17 </el-form-item> 24 </el-form-item>
18 <el-form-item :label="language==0?'验证码':'Code'" required> 25 <el-form-item :label="language==0?'验证码':'Code'" required>
19 <el-input v-model="form.code"> 26 <el-input v-model="form.code">
20 <template #append> 27 <template #append>
21 <el-button type="primary" plain style="width: 110px" @click="sendsmsMsg"> 28 <el-button plain style="width: 110px" type="primary" @click="sendsmsMsg">
22 <count-down v-if="counting" v-slot="{ totalSeconds }" :time="60000" @end="counting=false"> 29 <count-down v-if="counting" v-slot="{ totalSeconds }" :time="60000" @end="counting=false">
23 {{ totalSeconds }} {{ language == 0 ? '秒' : 's' }} 30 {{ totalSeconds }} {{ language == 0 ? '秒' : 's' }}
24 </count-down> 31 </count-down>
...@@ -28,43 +35,53 @@ ...@@ -28,43 +35,53 @@
28 </el-button> 35 </el-button>
29 </template> 36 </template>
30 </el-input> 37 </el-input>
31 <div class="vcodeBox" :style="isShow?'height:240px':'height:0'"> 38 <div :style="isShow?'height:240px':'height:0'" class="vcodeBox">
32 <Vcode :show="isShow" :successText="successVcode" :failText="failVcode" :slider-text="sliderText" 39 <Vcode
33 type="inside" @success="codeSuccess"></Vcode> 40 :fail-text="failVcode" :show="isShow" :slider-text="sliderText" :success-text="successVcode"
41 type="inside" @success="codeSuccess"
42 />
34 </div> 43 </div>
35 </el-form-item> 44 </el-form-item>
36 <el-form-item :label="language==0?'密码':'Password'" required> 45 <el-form-item :label="language==0?'密码':'Password'" required>
37 <el-input type="password" show-password v-model="form.password" 46 <el-input
38 :placeholder="language==0?'6-16位密码。区分大小写':''"/> 47 v-model="form.password" :placeholder="language==0?'6-16位密码。区分大小写':''" show-password
48 type="password"
49 />
39 </el-form-item> 50 </el-form-item>
40 <el-form-item :label="language==0?'确认密码':'Confirm Password'" required> 51 <el-form-item :label="language==0?'确认密码':'Confirm Password'" required>
41 <el-input type="password" show-password v-model="form.password2" @blur="vconfirmPassword" 52 <el-input
42 :placeholder="language==0?'再次输入密码':''"/> 53 v-model="form.password2" :placeholder="language==0?'再次输入密码':''" show-password type="password"
54 @blur="vconfirmPassword"
55 />
43 </el-form-item> 56 </el-form-item>
44 </el-form> 57 </el-form>
45 58
46 </div> 59 </div>
47 <template #footer> 60 <template #footer>
48 <div class="dialog-footer text-center"> 61 <div class="dialog-footer text-center">
49 <el-button type="primary" class="btn-lineG w200px" round @click="register">{{language==0?'登录':'Confirm'}}</el-button> 62 <el-button class="btn-lineG w200px" round type="primary" @click="register">
50 <div class="text-primary underline mt20 pointer" @click="goLogin">{{language==0?'已有账号去登录':'Already have an account? Login'}}</div> 63 {{ language == 0 ? '登录' : 'Confirm' }}
51 64 </el-button>
65 <div class="text-primary underline mt20 pointer" @click="goLogin">
66 {{ language == 0 ? '已有账号去登录' : 'Already have an account? Login' }}
67 </div>
68
52 </div> 69 </div>
53 </template> 70 </template>
54 </el-dialog> 71 </el-dialog>
55 </template> 72 </template>
56 73
57 <script setup> 74 <script setup>
58 import {reactive, toRefs} from 'vue' 75 import { reactive, toRefs } from 'vue'
59 import Vcode from "vue3-puzzle-vcode" 76 import Vcode from 'vue3-puzzle-vcode'
60 import {ElMessage} from 'element-plus' 77 import { ElMessage } from 'element-plus'
61 import CountDown from '@chenfengyuan/vue-countdown' 78 import CountDown from '@chenfengyuan/vue-countdown'
62 import {getCaptchaSms} from "@/apiPc/match"; 79 import { getCaptchaSms } from '@/apiPc/match'
63 import {onMounted} from "@vue/runtime-core"; 80 import { onMounted } from '@vue/runtime-core'
64 import {useStorage} from "@vueuse/core/index"; 81 import { useStorage } from '@vueuse/core/index'
65 import {vistorRegister} from "@/apiPc/common"; 82 import { vistorRegister } from '@/apiPc/common'
66 import {setToken} from "@/utils/auth"; 83 import { setToken } from '@/utils/auth'
67 import useUserStore from "@/store/modules/user"; 84 import useUserStore from '@/store/modules/user'
68 85
69 const language = useStorage('language', 0) 86 const language = useStorage('language', 0)
70 87
...@@ -77,9 +94,9 @@ const data = reactive({ ...@@ -77,9 +94,9 @@ const data = reactive({
77 failVcode: '验证失败,请重试', 94 failVcode: '验证失败,请重试',
78 successVcode: '验证通过!', 95 successVcode: '验证通过!',
79 sliderText: '拖动滑块完成拼图', 96 sliderText: '拖动滑块完成拼图',
80 show:false 97 show: false
81 }) 98 })
82 const {isShow, isCodeTrue, counting, form, activeStep, failVcode, successVcode, sliderText,show} = toRefs(data) 99 const { isShow, isCodeTrue, counting, form, activeStep, failVcode, successVcode, sliderText, show } = toRefs(data)
83 const emit = defineEmits(['submit']) 100 const emit = defineEmits(['submit'])
84 onMounted(() => { 101 onMounted(() => {
85 if (language.value == 1) { 102 if (language.value == 1) {
...@@ -113,7 +130,7 @@ function sendsmsMsg() { ...@@ -113,7 +130,7 @@ function sendsmsMsg() {
113 return 130 return
114 } 131 }
115 if (counting.value) { 132 if (counting.value) {
116 return 133
117 } else { 134 } else {
118 isShow.value = true 135 isShow.value = true
119 } 136 }
...@@ -124,29 +141,31 @@ function verifyCode() { ...@@ -124,29 +141,31 @@ function verifyCode() {
124 return 141 return
125 } 142 }
126 if (form.value.account.indexOf('@') > -1) { 143 if (form.value.account.indexOf('@') > -1) {
127 //邮箱 144 // 邮箱
128 } 145 }
129 } 146 }
130 147
131 function codeSuccess(msg) { 148 function codeSuccess(msg) {
132 console.log('验证通过' + msg); 149 console.log('验证通过' + msg)
133 isShow.value = false 150 isShow.value = false
134 getCaptchaSms({account: form.value.account}).then(res => { 151 getCaptchaSms({ account: form.value.account }).then(res => {
135 counting.value = true 152 counting.value = true
136 isCodeTrue.value = true 153 isCodeTrue.value = true
137 ElMessage.success(language.value == 0 ? '发送成功,请关注邮箱邮件' :'Send success, please check your email') 154 ElMessage.success(language.value == 0 ? '发送成功,请关注邮箱邮件' : 'Send success, please check your email')
138 }) 155 })
139 } 156 }
140 157
141 function resetCode() { 158 function resetCode() {
142 isCodeTrue.value = false 159 isCodeTrue.value = false
143 } 160 }
161
144 function goLogin() { 162 function goLogin() {
145 show.value = false 163 show.value = false
146 useUserStore().setReLogin() 164 useUserStore().setReLogin()
147 } 165 }
166
148 function register() { 167 function register() {
149 //游客注册 168 // 游客注册
150 if (!form.value.account) { 169 if (!form.value.account) {
151 if (language.value == 0) { 170 if (language.value == 0) {
152 ElMessage.warning('请填写邮箱') 171 ElMessage.warning('请填写邮箱')
...@@ -164,29 +183,33 @@ function register() { ...@@ -164,29 +183,33 @@ function register() {
164 return 183 return
165 } 184 }
166 if (!form.value.password) { 185 if (!form.value.password) {
167 ElMessage.warning(language.value == 0?'请输入密码':'Please enter password') 186 ElMessage.warning(language.value == 0 ? '请输入密码' : 'Please enter password')
168 return 187 return
169 } 188 }
170 if (!form.value.password2) { 189 if (!form.value.password2) {
171 ElMessage.warning(language.value == 0?'请再次输入密码':'Please enter password') 190 ElMessage.warning(language.value == 0 ? '请再次输入密码' : 'Please enter password')
172 return 191 return
173 } 192 }
174 delete form.value.password2 193 delete form.value.password2
175 vistorRegister(form.value).then(res=>{ 194 vistorRegister(form.value).then(res => {
176 setToken(res.data.token) 195 setToken(res.data.token)
177 emit('submitForm') 196 emit('submitForm')
178 }) 197 })
179 } 198 }
199
180 const vconfirmPassword = () => { 200 const vconfirmPassword = () => {
181 if (form.value.password !== form.value.password2) { 201 if (form.value.password !== form.value.password2) {
182 ElMessage.warning(language.value == 0 ? '两次输入的密码不一致' :'The two passwords entered are inconsistent') 202 ElMessage.warning(language.value == 0 ? '两次输入的密码不一致' : 'The two passwords entered are inconsistent')
183 } 203 }
184 } 204 }
205
185 function close() { 206 function close() {
186 show.value = false 207 show.value = false
187 } 208 }
188 </script> 209 </script>
189 210
190 <style scoped lang="scss"> 211 <style lang="scss" scoped>
191 .tip{line-height: 1.6} 212 .tip {
213 line-height: 1.6
214 }
192 </style> 215 </style>
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!