Skip to content

jijin / dance-pc

Go to a project
Toggle navigation
Toggle navigation pinning
c3fb61cf by 杨炀
Options

no message

1 parent d793ca6b
Inline Side-by-side
Showing 6 changed files with 311 additions and 137 deletions
src/viewsPc/booking/pay.vue
...@@ -714,6 +714,10 @@ function getremark(){ ...@@ -714,6 +714,10 @@ function getremark(){
714 }) 714 })
715 } 715 }
716 function submitSJ() { 716 function submitSJ() {
717 if(!lpName.value){
718 ElMessage.warning(language.value == 0 ? '请填写开票人' : 'Please fill in the invoice recipient')
719 return
720 }
717 loading.value = true 721 loading.value = true
718 ElMessageBox.confirm(language.value == 0 ? '提交后无法修改开票人，确认提交吗？' : 'Confirm to submit ?', { 722 ElMessageBox.confirm(language.value == 0 ? '提交后无法修改开票人，确认提交吗？' : 'Confirm to submit ?', {
719 confirmButtonText: language.value == 0 ? '确定' : 'Confirm', 723 confirmButtonText: language.value == 0 ? '确定' : 'Confirm',
......
src/viewsPc/match/pay.vue
...@@ -663,6 +663,10 @@ function getremark() { ...@@ -663,6 +663,10 @@ function getremark() {
663 } 663 }
664 664
665 function submitSJ() { 665 function submitSJ() {
666 if(!lpName.value){
667 ElMessage.warning(language.value == 0 ? '请填写开票人' : 'Please fill in the invoice recipient')
668 return
669 }
666 loading.value = true 670 loading.value = true
667 ElMessageBox.confirm(language.value == 0 ? '提交后无法修改开票人，确认提交吗？' : 'Confirm to submit ?', { 671 ElMessageBox.confirm(language.value == 0 ? '提交后无法修改开票人，确认提交吗？' : 'Confirm to submit ?', {
668 confirmButtonText: language.value == 0 ? '确定' : 'Confirm', 672 confirmButtonText: language.value == 0 ? '确定' : 'Confirm',
......
src/viewsPc/seat/api/index.js
...@@ -54,4 +54,3 @@ export const payCallback = (data) => ...@@ -54,4 +54,3 @@ export const payCallback = (data) =>
54 request("POST", `/api/order/palPayTicket/callback/`, data); 54 request("POST", `/api/order/palPayTicket/callback/`, data);
55 export const getCanInvoiceTicket = (data) => 55 export const getCanInvoiceTicket = (data) =>
56 request("GET", `/api/order/getOrderInvoiceList`, data); 56 request("GET", `/api/order/getOrderInvoiceList`, data);
57
......
src/viewsPc/seat/order-detail.vue
1 <script setup> 1 <script setup>
2 import { onBeforeUnmount, reactive } from "vue"; 2 import {getCurrentInstance, onBeforeUnmount, reactive} from "vue";
3 import { 3 import {
4 cancelOrder, 4 cancelOrder,
5 getOrderDetail, 5 getOrderDetail,
...@@ -7,11 +7,14 @@ import { ...@@ -7,11 +7,14 @@ import {
7 cancelPay, 7 cancelPay,
8 checkPaySuccess, 8 checkPaySuccess,
9 } from "./api/index.js"; 9 } from "./api/index.js";
10 import {download} from './utils/request'
10 import qrCodeDialog from "./components/qrCodeDialog.vue"; 11 import qrCodeDialog from "./components/qrCodeDialog.vue";
11 import { ElMessageBox, ElMessage } from "element-plus"; 12 import {ElMessageBox, ElMessage} from "element-plus";
12 import qrcode from "qrcode"; 13 import qrcode from "qrcode";
13 import { languageFormat } from "./utils/language.js"; 14 import {languageFormat} from "./utils/language.js";
14 import { useStorage } from "@vueuse/core/index"; 15 import {useStorage} from "@vueuse/core/index";
16 import {getBaseInfoByActiveId} from "@/apiPc/booking";
17
15 const language = useStorage("language", 0); 18 const language = useStorage("language", 0);
16 19
17 const route = useRoute(); 20 const route = useRoute();
...@@ -63,23 +66,23 @@ const props = defineProps({ ...@@ -63,23 +66,23 @@ const props = defineProps({
63 let timer = null; 66 let timer = null;
64 const startCheckSuccessListener = (orderSn, actId) => { 67 const startCheckSuccessListener = (orderSn, actId) => {
65 timer = setInterval(() => { 68 timer = setInterval(() => {
66 checkPaySuccess({ orderSn }) 69 checkPaySuccess({orderSn})
67 .then((res) => { 70 .then((res) => {
68 if (res.data) { 71 if (res.data) {
72 clearInterval(timer);
73 timer = null;
74 // 支付成功
75 detail.showCodeDialog = false;
76 detail.fetchData();
77 ElMessage({type: "success", message: "支付成功"});
78 } else {
79 return false;
80 }
81 })
82 .catch((e) => {
69 clearInterval(timer); 83 clearInterval(timer);
70 timer = null; 84 timer = null;
71 // 支付成功 85 });
72 detail.showCodeDialog = false;
73 detail.fetchData();
74 ElMessage({ type: "success", message: "支付成功" });
75 } else {
76 return false;
77 }
78 })
79 .catch((e) => {
80 clearInterval(timer);
81 timer = null;
82 });
83 }, 1500); 86 }, 1500);
84 }; 87 };
85 88
...@@ -95,7 +98,7 @@ const detail = reactive({ ...@@ -95,7 +98,7 @@ const detail = reactive({
95 minutes: 0, 98 minutes: 0,
96 seconds: 0, 99 seconds: 0,
97 fetchData() { 100 fetchData() {
98 getOrderDetail({ orderSn: route.query.orderSn }).then((res) => { 101 getOrderDetail({orderSn: route.query.orderSn}).then((res) => {
99 detail.data = res.data; 102 detail.data = res.data;
100 detail.countDown(detail.data?.payEndTime); 103 detail.countDown(detail.data?.payEndTime);
101 }); 104 });
...@@ -113,14 +116,14 @@ const detail = reactive({ ...@@ -113,14 +116,14 @@ const detail = reactive({
113 if (totalTime >= 0) { 116 if (totalTime >= 0) {
114 //获取分钟数 117 //获取分钟数
115 let minutes = Math.floor( 118 let minutes = Math.floor(
116 (((totalTime % (3600 * 24 * 1000)) / 1000) % 3600) / 60 119 (((totalTime % (3600 * 24 * 1000)) / 1000) % 3600) / 60
117 ); 120 );
118 //获取秒数 121 //获取秒数
119 let seconds = Math.floor( 122 let seconds = Math.floor(
120 (((totalTime % (3600 * 24 * 1000)) / 1000) % 3600) % 60 123 (((totalTime % (3600 * 24 * 1000)) / 1000) % 3600) % 60
121 ) 124 )
122 .toString() 125 .toString()
123 .padStart(2, "0"); 126 .padStart(2, "0");
124 127
125 detail.minutes = minutes; 128 detail.minutes = minutes;
126 detail.seconds = seconds; 129 detail.seconds = seconds;
...@@ -138,23 +141,23 @@ const detail = reactive({ ...@@ -138,23 +141,23 @@ const detail = reactive({
138 if (detail.pay_loading) return; 141 if (detail.pay_loading) return;
139 detail.pay_loading = true; 142 detail.pay_loading = true;
140 // 中文支付 143 // 中文支付
141 immediatePay({ orderSn: detail.data.orderSn, payType:detail.data?.language=='zh-cn'? 1:2 }) 144 immediatePay({orderSn: detail.data.orderSn, payType: detail.data?.language == 'zh-cn' ? 1 : 2})
142 .then((res) => { 145 .then((res) => {
143 if (res.data.language == "zh-cn") { 146 if (res.data.language == "zh-cn") {
144 detail.qrInfo = res.data; 147 detail.qrInfo = res.data;
145 qrcode.toDataURL(res.data.scanCodeUrl, (err, url) => { 148 qrcode.toDataURL(res.data.scanCodeUrl, (err, url) => {
146 if (url) { 149 if (url) {
147 detail.qrCodeData = url; 150 detail.qrCodeData = url;
148 } 151 }
149 }); 152 });
150 detail.showCodeDialog = true; 153 detail.showCodeDialog = true;
151 startCheckSuccessListener(detail.data.orderSn); 154 startCheckSuccessListener(detail.data.orderSn);
152 } else { 155 } else {
153 // TODO：这里是英文环境支付 156 // TODO：这里是英文环境支付
154 location.href = res.data.scanCodeUrl 157 location.href = res.data.scanCodeUrl
155 } 158 }
156 }) 159 })
157 .finally(() => (detail.pay_loading = false)); 160 .finally(() => (detail.pay_loading = false));
158 }, 161 },
159 handleClose() { 162 handleClose() {
160 detail.showCodeDialog = false; 163 detail.showCodeDialog = false;
...@@ -165,64 +168,66 @@ const detail = reactive({ ...@@ -165,64 +168,66 @@ const detail = reactive({
165 // 取消支付 168 // 取消支付
166 cancelPay() { 169 cancelPay() {
167 ElMessageBox.confirm( 170 ElMessageBox.confirm(
168 languageFormat( 171 languageFormat(
169 language.value, 172 language.value,
170 "确认取消支付吗？", 173 "确认取消支付吗？",
171 "Are you sure to cancel?" 174 "Are you sure to cancel?"
172 ), 175 ),
173 languageFormat(language.value, "提示", "tip"), 176 languageFormat(language.value, "提示", "tip"),
174 { 177 {
175 confirmButtonText: languageFormat(language.value, "确认", "confirm"), 178 confirmButtonText: languageFormat(language.value, "确认", "confirm"),
176 cancelButtonText: languageFormat(language.value, "取消", "cancel"), 179 cancelButtonText: languageFormat(language.value, "取消", "cancel"),
177 type: "warning", 180 type: "warning",
178 draggable: true, 181 draggable: true,
179 } 182 }
180 ) 183 )
181 .then(() => { 184 .then(() => {
182 cancelPay({ orderSn: detail.data.orderSn }).then(() => { 185 cancelPay({orderSn: detail.data.orderSn}).then(() => {
183 detail.fetchData(); 186 detail.fetchData();
184 ElMessage({ 187 ElMessage({
185 type: "success", 188 type: "success",
186 message: languageFormat( 189 message: languageFormat(
187 language.value, 190 language.value,
188 "操作成功", 191 "操作成功",
189 "Operate successfully" 192 "Operate successfully"
190 ), 193 ),
194 });
191 }); 195 });
196 })
197 .catch(() => {
192 }); 198 });
193 })
194 .catch(() => {});
195 }, 199 },
196 // 取消购票 200 // 取消购票
197 cancelOrder() { 201 cancelOrder() {
198 ElMessageBox.confirm( 202 ElMessageBox.confirm(
199 languageFormat( 203 languageFormat(
200 language.value, 204 language.value,
201 "确认取消购票吗？", 205 "确认取消购票吗？",
202 "Are you sure to cancel?" 206 "Are you sure to cancel?"
203 ), 207 ),
204 languageFormat(language.value, "提示", "tip"), 208 languageFormat(language.value, "提示", "tip"),
205 { 209 {
206 confirmButtonText: languageFormat(language.value, "确认", "confirm"), 210 confirmButtonText: languageFormat(language.value, "确认", "confirm"),
207 cancelButtonText: languageFormat(language.value, "取消", "cancel"), 211 cancelButtonText: languageFormat(language.value, "取消", "cancel"),
208 type: "warning", 212 type: "warning",
209 draggable: true, 213 draggable: true,
210 } 214 }
211 ) 215 )
212 .then(() => { 216 .then(() => {
213 cancelOrder({ orderSn: detail.data.orderSn }).then((res) => { 217 cancelOrder({orderSn: detail.data.orderSn}).then((res) => {
214 detail.fetchData(); 218 detail.fetchData();
215 ElMessage({ 219 ElMessage({
216 type: "success", 220 type: "success",
217 message: languageFormat( 221 message: languageFormat(
218 language.value, 222 language.value,
219 "操作成功", 223 "操作成功",
220 "Operate successfully" 224 "Operate successfully"
221 ), 225 ),
226 });
222 }); 227 });
228 })
229 .catch(() => {
223 }); 230 });
224 })
225 .catch(() => {});
226 }, 231 },
227 comeBack() { 232 comeBack() {
228 router.push({ 233 router.push({
...@@ -240,6 +245,58 @@ onBeforeUnmount(() => { ...@@ -240,6 +245,58 @@ onBeforeUnmount(() => {
240 }); 245 });
241 246
242 detail.fetchData(); 247 detail.fetchData();
248 const {proxy} = getCurrentInstance()
249 const showSJDialog = ref(false)
250 const lpName = ref('')
251 const remark = ref('')
252
253 function downInvoice() {
254 getremark()
255 if (detail.data.receiptFlag == '0') {
256 showSJDialog.value = true
257 } else {
258 showSJ()
259 }
260 }
261
262 function getremark() {
263 getBaseInfoByActiveId('1778253367748993026').then(res => {
264 if (res.data) {
265 remark.value = res.data.remarks
266 }
267 })
268 }
269
270 function submitSJ() {
271 if(!lpName.value){
272 ElMessage.warning(language.value == 0 ? '请填写开票人' : 'Please fill in the invoice recipient')
273 return
274 }
275 ElMessageBox.confirm(language.value == 0 ? '提交后无法修改开票人，确认提交吗？' : 'Confirm to submit ?', {
276 confirmButtonText: language.value == 0 ? '确定' : 'Confirm',
277 cancelButtonText: language.value == 0 ? '取消' : 'Cancel',
278 type: 'warning'
279 }).then(() => {
280 showSJ()
281 })
282 }
283
284 const showSJ = () => {
285 // 查看电子收据预览信息
286 var obj = {
287 orderId: detail.data.orderSn,
288 type: 1
289 }
290 if (detail.data.receiptFlag == '0') {
291 obj.receiptInfo = lpName.value
292 }
293 // 报名
294 download(`/api/order/getReceipt/${obj.orderId}`, {
295 ...obj
296 }, `Receipt_${new Date().getTime()}.pdf`)
297 showSJDialog.value = false
298 detail.fetchData()
299 }
243 </script> 300 </script>
244 301
245 <template> 302 <template>
...@@ -269,14 +326,14 @@ detail.fetchData(); ...@@ -269,14 +326,14 @@ detail.fetchData();
269 <div style="width: 33%" class="td">{{ detail.data?.name }}</div> 326 <div style="width: 33%" class="td">{{ detail.data?.name }}</div>
270 <div style="width: 25%" class="td">{{ detail.data?.placeName }}</div> 327 <div style="width: 25%" class="td">{{ detail.data?.placeName }}</div>
271 <div style="width: 20%" class="td"> 328 <div style="width: 20%" class="td">
272 <span>{{ detail.data?.language=='zh-cn'? "¥" : "€" }}</span> 329 <span>{{ detail.data?.language == 'zh-cn' ? "¥" : "€" }}</span>
273 {{ detail.data?.singlePrice }} 330 {{ detail.data?.singlePrice }}
274 </div> 331 </div>
275 <div style="width: 10%" class="td"> 332 <div style="width: 10%" class="td">
276 x{{ detail.data?.seatList?.length }} 333 x{{ detail.data?.seatList?.length }}
277 </div> 334 </div>
278 <div style="width: 12%; text-align: right" class="td"> 335 <div style="width: 12%; text-align: right" class="td">
279 <span>{{ detail.data?.language=='zh-cn'? "¥" : "€" }}</span> 336 <span>{{ detail.data?.language == 'zh-cn' ? "¥" : "€" }}</span>
280 {{ detail.data?.payAmount }} 337 {{ detail.data?.payAmount }}
281 </div> 338 </div>
282 </div> 339 </div>
...@@ -305,15 +362,17 @@ detail.fetchData(); ...@@ -305,15 +362,17 @@ detail.fetchData();
305 <div> 362 <div>
306 {{ 363 {{
307 detail.data?.openType == 0 364 detail.data?.openType == 0
308 ? languageFormat(language, "日场", "Day session") 365 ? languageFormat(language, "日场", "Day session")
309 : languageFormat(language, "夜场", "Night session") 366 : languageFormat(language, "夜场", "Night session")
310 }} 367 }}
311 </div> 368 </div>
312 <div v-for="(it, index) in detail.data?.seatList" :key="index"> 369 <div v-for="(it, index) in detail.data?.seatList" :key="index">
313 <span v-if="it.venueId == 1" 370 <span v-if="it.venueId == 1"
314 >{{ it.area 371 >{{
372 it.area
315 }}{{ languageFormat(language, "区", "Zones") }}</span 373 }}{{ languageFormat(language, "区", "Zones") }}</span
316 >{{ it.pai }}{{ languageFormat(language, "排", "Row") }}{{ it.no 374 >{{ it.pai }}{{ languageFormat(language, "排", "Row") }}{{
375 it.no
317 }}{{ languageFormat(language, "座", "Seat") }} ({{ 376 }}{{ languageFormat(language, "座", "Seat") }} ({{
318 it.venueId == 1 ? "B6" : "B4" 377 it.venueId == 1 ? "B6" : "B4"
319 }}{{ languageFormat(language, "馆", "Venue") }}) 378 }}{{ languageFormat(language, "馆", "Venue") }})
...@@ -324,27 +383,27 @@ detail.fetchData(); ...@@ -324,27 +383,27 @@ detail.fetchData();
324 {{ languageFormat(language, "订单编号", "Order No") }}：{{ detail.data?.orderSn }} 383 {{ languageFormat(language, "订单编号", "Order No") }}：{{ detail.data?.orderSn }}
325 </div> 384 </div>
326 <div> 385 <div>
327 {{ languageFormat(language, "创建时间", "Order Time") }}：{{detail.data?.orderTime }} 386 {{ languageFormat(language, "创建时间", "Order Time") }}：{{ detail.data?.orderTime }}
328 </div> 387 </div>
329 </div> 388 </div>
330 <div style="width: 33%" class="td flex-col"> 389 <div style="width: 33%" class="td flex-col">
331 <div> 390 <div>
332 {{ languageFormat(language, "联系电话", "Telephone") }}：{{ detail.data?.contactPhone }} 391 {{ languageFormat(language, "联系电话", "Telephone") }}：{{ detail.data?.contactPhone }}
333 <div>&nbsp;</div> 392 <div>&nbsp;</div>
334 <!-- <br>--> 393 <!-- <br>-->
335 </div> 394 </div>
336 <div> 395 <div>
337 {{languageFormat(language,'支付方式','Form of payments')}}：{{detail.data?.language=='en-us'?'PayPal':'微信'}} 396 {{ languageFormat(language, '支付方式', 'Form of payments') }}：{{ detail.data?.language == 'en-us' ? 'PayPal' : '微信' }}
338 </div> 397 </div>
339 398
340 </div> 399 </div>
341 <!-- <div style="width: 20%" class="td ">--> 400 <!-- <div style="width: 20%" class="td ">-->
342 <!-- <div>--> 401 <!-- <div>-->
343 <!--&lt;!&ndash; {{ languageFormat(language, "联系电话", "Telephone") }}：{{ detail.data?.contactPhone }}&ndash;&gt;--> 402 <!--&lt;!&ndash; {{ languageFormat(language, "联系电话", "Telephone") }}：{{ detail.data?.contactPhone }}&ndash;&gt;-->
344 <!-- 微信--> 403 <!-- 微信-->
345 <!-- </div>--> 404 <!-- </div>-->
346 405
347 <!-- </div>--> 406 <!-- </div>-->
348 </div> 407 </div>
349 </div> 408 </div>
350 <!-- 购票人 --> 409 <!-- 购票人 -->
...@@ -354,9 +413,9 @@ detail.fetchData(); ...@@ -354,9 +413,9 @@ detail.fetchData();
354 </div> 413 </div>
355 <div class="people"> 414 <div class="people">
356 <div 415 <div
357 v-for="(it, index) in detail.data?.customerList" 416 v-for="(it, index) in detail.data?.customerList"
358 :key="index" 417 :key="index"
359 class="p_info" 418 class="p_info"
360 > 419 >
361 <div>{{ it.name }}</div> 420 <div>{{ it.name }}</div>
362 <div class="idcard"> 421 <div class="idcard">
...@@ -377,13 +436,13 @@ detail.fetchData(); ...@@ -377,13 +436,13 @@ detail.fetchData();
377 {{ languageFormat(language, "订单状态", "Order Status") }} 436 {{ languageFormat(language, "订单状态", "Order Status") }}
378 </div> 437 </div>
379 <div 438 <div
380 class="value" 439 class="value"
381 :style="{ color: status[detail.data?.state]?.color }" 440 :style="{ color: status[detail.data?.state]?.color }"
382 > 441 >
383 {{ 442 {{
384 language == 0 443 language == 0
385 ? status[detail.data?.state]?.txt 444 ? status[detail.data?.state]?.txt
386 : status[detail.data?.state]?.text_en 445 : status[detail.data?.state]?.text_en
387 }} 446 }}
388 </div> 447 </div>
389 </div> 448 </div>
...@@ -392,10 +451,10 @@ detail.fetchData(); ...@@ -392,10 +451,10 @@ detail.fetchData();
392 {{ languageFormat(language, "订单金额", "Order amount") }} 451 {{ languageFormat(language, "订单金额", "Order amount") }}
393 </div> 452 </div>
394 <div 453 <div
395 class="value" 454 class="value"
396 :style="{ color: status[detail.data?.state]?.color }" 455 :style="{ color: status[detail.data?.state]?.color }"
397 > 456 >
398 <span>{{ detail.data?.language=='zh-cn'? "¥" : "€" }}</span> 457 <span>{{ detail.data?.language == 'zh-cn' ? "¥" : "€" }}</span>
399 {{ detail.data?.payAmount }} 458 {{ detail.data?.payAmount }}
400 </div> 459 </div>
401 </div> 460 </div>
...@@ -410,16 +469,13 @@ detail.fetchData(); ...@@ -410,16 +469,13 @@ detail.fetchData();
410 </div> 469 </div>
411 <div v-else> 470 <div v-else>
412 <!-- v-if="detail.data?.state == 1 && detail.data?.isRefund" --> 471 <!-- v-if="detail.data?.state == 1 && detail.data?.isRefund" -->
413 <div 472 <div v-if="detail.data?.state == 1 && detail.data?.isRefund" class="btn_box">
414 v-if="detail.data?.state == 1 && detail.data?.isRefund"
415 class="btn_box"
416 >
417 <div class="can_pay" @click="detail.cancelOrder()"> 473 <div class="can_pay" @click="detail.cancelOrder()">
418 {{ 474 {{
419 languageFormat( 475 languageFormat(
420 language, 476 language,
421 "取消购票", 477 "取消购票",
422 "Cancel the ticket purchase" 478 "Cancel the ticket purchase"
423 ) 479 )
424 }} 480 }}
425 </div> 481 </div>
...@@ -432,23 +488,33 @@ detail.fetchData(); ...@@ -432,23 +488,33 @@ detail.fetchData();
432 <div class="pay_dis"> 488 <div class="pay_dis">
433 {{ 489 {{
434 languageFormat( 490 languageFormat(
435 language, 491 language,
436 "请联系工作人员", 492 "请联系工作人员",
437 "Please contact the staff" 493 "Please contact the staff"
438 ) 494 )
439 }} 495 }}
440 </div> 496 </div>
441 </div> 497 </div>
498
499 <div class="btn_box" v-if="detail.data?.state == 1">
500 <el-button round class="btn-lineG w100" size="large" type="primary"
501 @click="downInvoice">
502 <el-icon>
503 <Download/>
504 </el-icon>
505 {{ languageFormat(language, "下载收据", "DownLoad Invoice") }}
506 </el-button>
507 </div>
442 </div> 508 </div>
443 </div> 509 </div>
444 <div v-if="detail.data?.state == 0" class="tip"> 510 <div v-if="detail.data?.state == 0" class="tip">
445 <span v-if="language == 0" 511 <span v-if="language == 0"
446 >请尽快完成支付，还剩{{ detail.minutes }}分{{ 512 >请尽快完成支付，还剩{{ detail.minutes }}分{{
447 detail.seconds 513 detail.seconds
448 }}秒</span 514 }}秒</span
449 > 515 >
450 <span v-if="language == 1" 516 <span v-if="language == 1"
451 >Time left {{ detail.minutes }}:{{ detail.seconds }}</span 517 >Time left {{ detail.minutes }}:{{ detail.seconds }}</span
452 > 518 >
453 </div> 519 </div>
454 </div> 520 </div>
...@@ -459,15 +525,34 @@ detail.fetchData(); ...@@ -459,15 +525,34 @@ detail.fetchData();
459 /> --> 525 /> -->
460 526
461 <el-dialog 527 <el-dialog
462 v-model="detail.showCodeDialog" 528 v-model="detail.showCodeDialog"
463 title="支付" 529 title="支付"
464 width="300" 530 width="300"
465 @closed="detail.handleClose()" 531 @closed="detail.handleClose()"
466 > 532 >
467 <div> 533 <div>
468 <img class="qrcode" :src="detail.qrCodeData" /> 534 <img class="qrcode" :src="detail.qrCodeData"/>
535 </div>
536 </el-dialog>
537
538 <el-dialog :title="language==0?'开收据':'Issue a receipt'" v-model="showSJDialog" width="460px"
539 :close-on-click-modal="false" :close-on-press-escape="false">
540 <div class="flex">
541 <el-form-item :label="language==0?'开票人':'Name'">
542 <div class="flex">
543 <el-input v-model="lpName" :placeholder="language==0?'请输入开票人':'Please enter your name'"></el-input>
544 <el-button type="primary" @click="submitSJ">{{ language == 0 ? '提交并下载' : 'Submit' }}</el-button>
545 </div>
546 </el-form-item>
547 </div>
548 <div class="tip mt20" v-if="remark">
549 <label>{{ language == 0 ? '开电子收据须知' : 'Receipt notice' }}:</label>
550 <div class="pd10">
551 {{ remark }}
552 </div>
469 </div> 553 </div>
470 </el-dialog> 554 </el-dialog>
555
471 </div> 556 </div>
472 </template> 557 </template>
473 558
...@@ -477,22 +562,26 @@ detail.fetchData(); ...@@ -477,22 +562,26 @@ detail.fetchData();
477 height: 200px; 562 height: 200px;
478 margin: 0 auto; 563 margin: 0 auto;
479 } 564 }
565
480 .container { 566 .container {
481 width: 1200px; 567 width: 1200px;
482 margin: 0 auto; 568 margin: 0 auto;
483 padding: 20px 0; 569 padding: 20px 0;
484 display: flex; 570 display: flex;
485 gap: 20px; 571 gap: 20px;
572
486 .left { 573 .left {
487 width: 780px; 574 width: 780px;
488 // 票务信息 575 // 票务信息
489 .ticket { 576 .ticket {
490 background-color: #fff; 577 background-color: #fff;
491 padding: 0 20px; 578 padding: 0 20px;
579
492 .th { 580 .th {
493 display: flex; 581 display: flex;
494 justify-content: space-between; 582 justify-content: space-between;
495 padding: 20px 0; 583 padding: 20px 0;
584
496 .td { 585 .td {
497 font-weight: bold; 586 font-weight: bold;
498 font-size: 16px; 587 font-size: 16px;
...@@ -500,15 +589,18 @@ detail.fetchData(); ...@@ -500,15 +589,18 @@ detail.fetchData();
500 line-height: 24px; 589 line-height: 24px;
501 } 590 }
502 } 591 }
592
503 .line { 593 .line {
504 width: 740px; 594 width: 740px;
505 height: 1px; 595 height: 1px;
506 background: #eee; 596 background: #eee;
507 } 597 }
598
508 .tr { 599 .tr {
509 display: flex; 600 display: flex;
510 justify-content: space-between; 601 justify-content: space-between;
511 padding: 20px 0; 602 padding: 20px 0;
603
512 .td { 604 .td {
513 font-weight: 400; 605 font-weight: 400;
514 font-size: 16px; 606 font-size: 16px;
...@@ -517,15 +609,18 @@ detail.fetchData(); ...@@ -517,15 +609,18 @@ detail.fetchData();
517 } 609 }
518 } 610 }
519 } 611 }
612
520 // 座位 613 // 座位
521 .seat_box { 614 .seat_box {
522 background-color: #fff; 615 background-color: #fff;
523 padding: 0 20px; 616 padding: 0 20px;
524 margin-top: 20px; 617 margin-top: 20px;
618
525 .th { 619 .th {
526 display: flex; 620 display: flex;
527 justify-content: space-between; 621 justify-content: space-between;
528 padding: 20px 0; 622 padding: 20px 0;
623
529 .td { 624 .td {
530 font-weight: bold; 625 font-weight: bold;
531 font-size: 16px; 626 font-size: 16px;
...@@ -533,21 +628,25 @@ detail.fetchData(); ...@@ -533,21 +628,25 @@ detail.fetchData();
533 line-height: 24px; 628 line-height: 24px;
534 } 629 }
535 } 630 }
631
536 .tr { 632 .tr {
537 display: flex; 633 display: flex;
538 justify-content: space-between; 634 justify-content: space-between;
539 padding: 20px 0; 635 padding: 20px 0;
636
540 .td { 637 .td {
541 font-weight: 400; 638 font-weight: 400;
542 font-size: 16px; 639 font-size: 16px;
543 color: #333333; 640 color: #333333;
544 line-height: 24px; 641 line-height: 24px;
545 } 642 }
643
546 .flex-col { 644 .flex-col {
547 display: flex; 645 display: flex;
548 flex-direction: column; 646 flex-direction: column;
549 gap: 16px; 647 gap: 16px;
550 } 648 }
649
551 .tag_t { 650 .tag_t {
552 padding: 1px 10px; 651 padding: 1px 10px;
553 font-weight: 400; 652 font-weight: 400;
...@@ -559,27 +658,32 @@ detail.fetchData(); ...@@ -559,27 +658,32 @@ detail.fetchData();
559 } 658 }
560 } 659 }
561 } 660 }
661
562 // 购票人 662 // 购票人
563 .pay_ticket { 663 .pay_ticket {
564 background-color: #fff; 664 background-color: #fff;
565 padding: 20px; 665 padding: 20px;
566 margin-top: 20px; 666 margin-top: 20px;
667
567 .title { 668 .title {
568 font-weight: bold; 669 font-weight: bold;
569 font-size: 16px; 670 font-size: 16px;
570 color: #333333; 671 color: #333333;
571 margin-bottom: 28px; 672 margin-bottom: 28px;
572 } 673 }
674
573 .people { 675 .people {
574 display: flex; 676 display: flex;
575 justify-content: space-between; 677 justify-content: space-between;
576 flex-wrap: wrap; 678 flex-wrap: wrap;
577 gap: 15px 50px; 679 gap: 15px 50px;
680
578 .p_info { 681 .p_info {
579 font-weight: 400; 682 font-weight: 400;
580 font-size: 16px; 683 font-size: 16px;
581 color: #333333; 684 color: #333333;
582 line-height: 24px; 685 line-height: 24px;
686
583 .idcard { 687 .idcard {
584 color: #999999; 688 color: #999999;
585 } 689 }
...@@ -587,11 +691,14 @@ detail.fetchData(); ...@@ -587,11 +691,14 @@ detail.fetchData();
587 } 691 }
588 } 692 }
589 } 693 }
694
590 .right { 695 .right {
591 width: 400px; 696 width: 400px;
697
592 .balance { 698 .balance {
593 background-color: #fff; 699 background-color: #fff;
594 padding: 20px; 700 padding: 20px;
701
595 .title { 702 .title {
596 font-weight: bold; 703 font-weight: bold;
597 font-size: 20px; 704 font-size: 20px;
...@@ -599,31 +706,37 @@ detail.fetchData(); ...@@ -599,31 +706,37 @@ detail.fetchData();
599 line-height: 30px; 706 line-height: 30px;
600 margin-bottom: 28px; 707 margin-bottom: 28px;
601 } 708 }
709
602 .cell { 710 .cell {
603 display: flex; 711 display: flex;
604 justify-content: space-between; 712 justify-content: space-between;
605 align-items: center; 713 align-items: center;
606 margin-bottom: 20px; 714 margin-bottom: 20px;
715
607 &:last-child { 716 &:last-child {
608 margin: 0; 717 margin: 0;
609 } 718 }
719
610 .label { 720 .label {
611 font-weight: 400; 721 font-weight: 400;
612 font-size: 16px; 722 font-size: 16px;
613 color: #333333; 723 color: #333333;
614 } 724 }
725
615 .value { 726 .value {
616 font-weight: 400; 727 font-weight: 400;
617 font-size: 16px; 728 font-size: 16px;
618 color: #ff8124; 729 color: #ff8124;
619 } 730 }
620 } 731 }
732
621 .btn_box { 733 .btn_box {
622 border-top: 1px solid #eee; 734 border-top: 1px solid #eee;
623 padding-top: 20px; 735 padding-top: 20px;
624 display: flex; 736 display: flex;
625 gap: 20px; 737 gap: 20px;
626 user-select: none; 738 user-select: none;
739
627 .pay_dis { 740 .pay_dis {
628 width: 360px; 741 width: 360px;
629 height: 40px; 742 height: 40px;
...@@ -636,6 +749,7 @@ detail.fetchData(); ...@@ -636,6 +749,7 @@ detail.fetchData();
636 text-align: center; 749 text-align: center;
637 cursor: pointer; 750 cursor: pointer;
638 } 751 }
752
639 .pay { 753 .pay {
640 width: 170px; 754 width: 170px;
641 height: 40px; 755 height: 40px;
...@@ -648,6 +762,7 @@ detail.fetchData(); ...@@ -648,6 +762,7 @@ detail.fetchData();
648 text-align: center; 762 text-align: center;
649 cursor: pointer; 763 cursor: pointer;
650 } 764 }
765
651 .can_pay { 766 .can_pay {
652 width: 170px; 767 width: 170px;
653 height: 40px; 768 height: 40px;
...@@ -663,6 +778,7 @@ detail.fetchData(); ...@@ -663,6 +778,7 @@ detail.fetchData();
663 } 778 }
664 } 779 }
665 } 780 }
781
666 .tip { 782 .tip {
667 font-weight: 400; 783 font-weight: 400;
668 font-size: 16px; 784 font-size: 16px;
...@@ -673,6 +789,7 @@ detail.fetchData(); ...@@ -673,6 +789,7 @@ detail.fetchData();
673 } 789 }
674 } 790 }
675 } 791 }
792
676 @media screen and (max-width: 768px) { 793 @media screen and (max-width: 768px) {
677 .container { 794 .container {
678 width: 100%; 795 width: 100%;
......
src/viewsPc/seat/utils/request.js
...@@ -3,9 +3,11 @@ ...@@ -3,9 +3,11 @@
3 // import axios from "axios"; 3 // import axios from "axios";
4 import axios from "axios/dist/axios"; 4 import axios from "axios/dist/axios";
5 import { getToken } from "./local-store"; 5 import { getToken } from "./local-store";
6 import { ElMessage } from "element-plus"; 6 import {ElLoading, ElMessage} from "element-plus";
7 7 import { saveAs } from 'file-saver'
8 import { useStorage } from "@vueuse/core/index"; 8 import { useStorage } from "@vueuse/core/index";
9 import {blobValidate, tansParams} from "@/utils/ruoyi";
10 import errorCode from "@/utils/errorCode";
9 const language = useStorage("language", 0); 11 const language = useStorage("language", 0);
10 const baseURL = import.meta.env.VITE_TICKET_BASE_API 12 const baseURL = import.meta.env.VITE_TICKET_BASE_API
11 // const baseURL = VITE_TICKET_BASE_API; //"http://book.xiaojinyu.games"; // 这里填入你的基础 API URL 13 // const baseURL = VITE_TICKET_BASE_API; //"http://book.xiaojinyu.games"; // 这里填入你的基础 API URL
...@@ -44,6 +46,13 @@ http.interceptors.request.use( ...@@ -44,6 +46,13 @@ http.interceptors.request.use(
44 http.interceptors.response.use( 46 http.interceptors.response.use(
45 (response) => { 47 (response) => {
46 // 判断是否有异常 48 // 判断是否有异常
49 if (
50 response.request.responseType === 'blob' ||
51 response.request.responseType === 'arraybuffer'
52 ) {
53 return response
54 }
55
47 let error = null; // 若无异常此值为null 56 let error = null; // 若无异常此值为null
48 if (response.status !== 200) { 57 if (response.status !== 200) {
49 error = Error(`Request failed with statuCode ${response.status}`); 58 error = Error(`Request failed with statuCode ${response.status}`);
...@@ -54,6 +63,7 @@ http.interceptors.response.use( ...@@ -54,6 +63,7 @@ http.interceptors.response.use(
54 return Promise.reject(response.data); 63 return Promise.reject(response.data);
55 } 64 }
56 65
66
57 return response.data; 67 return response.data;
58 }, 68 },
59 (error) => { 69 (error) => {
...@@ -62,13 +72,53 @@ http.interceptors.response.use( ...@@ -62,13 +72,53 @@ http.interceptors.response.use(
62 } 72 }
63 ); 73 );
64 74
75 export function download(url, params, filename, config) {
76 return http.post( url,params, {
77 transformRequest: [
78 (params) => {
79 return tansParams(params)
80 }
81 ],
82 headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
83 responseType: 'blob',
84 ...config
85 })
86 .then(async(res) => {
87 const data = res.data
88 console.log(blobValidate(data))
89 const isBlob = blobValidate(data)
90 if (isBlob) {
91 let hz = ''
92 if (res.headers['content-disposition'].indexOf('zip') > -1 || res.headers['content-type'].indexOf('pdf') > -1) {
93 // if (res.headers['content-type'].indexOf('zip') > -1) {
94 // hz = '.zip'
95 // } else if (res.headers['content-type'].indexOf('pdf') > -1) {
96 // hz = '.pdf'
97 // }
98 const index = res.headers['content-disposition'].indexOf('=')
99 hz = res.headers['content-disposition'].substr(index + 1, res.headers['content-disposition'].length)
100 }
101 const blob = new Blob([data])
102 saveAs(blob, hz ? filename = decodeURIComponent(hz) : filename)
103 } else {
104 const resText = await data.text()
105 const rspObj = JSON.parse(resText)
106 const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode['default']
107 ElMessage.error(errMsg)
108 }
109 }).catch((r) => {
110 console.error(url,r)
111 ElMessage.error('下载文件出现错误，请联系管理员！')
112 })
113 }
114
65 // 封装请求函数 115 // 封装请求函数
66 const request = (method, url, data = null) => { 116 function request(method, url, data = null){
67 return http({ 117 return http({
68 method, 118 method,
69 url, 119 url,
70 data, 120 data,
71 }); 121 });
72 }; 122 }
73 123
74 export default request; 124 export default request;
......
vite.config.js
...@@ -90,7 +90,7 @@ export default defineConfig(({ mode, command }) => { ...@@ -90,7 +90,7 @@ export default defineConfig(({ mode, command }) => {
90 rewrite: (p) => p.replace(/^\/dev-api/, '') 90 rewrite: (p) => p.replace(/^\/dev-api/, '')
91 }, 91 },
92 '/ticket': { 92 '/ticket': {
93 target: 'http://192.168.1.131:8081/', 93 target: 'http://192.168.1.131:8098/',
94 // target: 'http://192.168.1.131:8081/', 94 // target: 'http://192.168.1.131:8081/',
95 // target: 'https://jijin.wtwuxicenter.com/h5', 95 // target: 'https://jijin.wtwuxicenter.com/h5',
96 // target: 'https://ticketh5.wdsfwuxicenter.com/h5/stage-api', 96 // target: 'https://ticketh5.wdsfwuxicenter.com/h5/stage-api',
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!