Skip to content

jijin / dance-pc

Go to a project
Toggle navigation
Toggle navigation pinning
667164b6 by yyx
Options

英文版

1 parent d84293f4
Inline Side-by-side
Showing 8 changed files with 385 additions and 120 deletions
src/viewsPc/seat/add-watch-people.vue
1 <script setup> 1 <script setup>
2 import { ElMessage } from "element-plus"; 2 import { ElMessage } from "element-plus";
3 import { addViewPeople } from "./api/index.js"; 3 import { addViewPeople } from "./api/index.js";
4 import { languageFormat } from "./utils/language.js";
5 import { useStorage } from "@vueuse/core/index";
6 const language = useStorage("language", 0);
4 7
5 const router = useRouter(); 8 const router = useRouter();
6 9
...@@ -9,21 +12,30 @@ const people = reactive({ ...@@ -9,21 +12,30 @@ const people = reactive({
9 name: "", 12 name: "",
10 idCard: "", 13 idCard: "",
11 }, 14 },
12 type: "身份证", 15 type: language == 0 ? "身份证" : "Identity Card",
13 onConfirm() { 16 onConfirm() {
14 if (!people.form.name) 17 if (!people.form.name)
15 return ElMessage({ type: "warning", message: "请输入姓名" }); 18 return ElMessage({
19 type: "warning",
20 message: languageFormat(language, "请输入姓名", "Name"),
21 });
16 if (!people.form.idCard) 22 if (!people.form.idCard)
17 return ElMessage({ type: "warning", message: "请输入证件号" }); 23 return ElMessage({
24 type: "warning",
25 message: languageFormat(language, "请输入证件号", "ID Numbe"),
26 });
18 27
19 // 使用正则验证身份证号码格式 28 // 使用正则验证身份证号码格式
20 const idCardRegex = 29 const idCardRegex =
21 /^[1-9]\d{5}(19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[\dXx]$/; 30 /^[1-9]\d{5}(19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[\dXx]$/;
22 if (!idCardRegex.test(people.form.idCard)) 31 if (!idCardRegex.test(people.form.idCard) && language == 0)
23 return ElMessage({ type: "warning", message: "身份证号格式不正确" }); 32 return ElMessage({ type: "warning", message: "身份证号格式不正确" });
24 33
25 addViewPeople(people.form).then((res) => { 34 addViewPeople(people.form).then((res) => {
26 ElMessage({ type: "success", message: "操作成功" }); 35 ElMessage({
36 type: "success",
37 message: languageFormat(language, "操作成功", "Operate successfully"),
38 });
27 router.go(-2); 39 router.go(-2);
28 }); 40 });
29 }, 41 },
...@@ -32,19 +44,25 @@ const people = reactive({ ...@@ -32,19 +44,25 @@ const people = reactive({
32 44
33 <template> 45 <template>
34 <div class="container"> 46 <div class="container">
35 <div class="title">新增观影人</div> 47 <div class="title">
48 {{ languageFormat(language, "新增观影人", "Companion") }}
49 </div>
36 <div class="content"> 50 <div class="content">
37 <div class="form-item"> 51 <div class="form-item">
38 <div> 52 <div>
39 <div class="label">姓名</div> 53 <div class="label">
54 {{ languageFormat(language, "姓名", "Full Name") }}
55 </div>
40 <el-input 56 <el-input
41 v-model="people.form.name" 57 v-model="people.form.name"
42 style="width: 570px" 58 style="width: 570px"
43 placeholder="请输入姓名" 59 :placeholder="language == 0 ? '请输入姓名' : 'Nama'"
44 /> 60 />
45 </div> 61 </div>
46 <div> 62 <div>
47 <div class="label">证件类型</div> 63 <div class="label">
64 {{ languageFormat(language, "证件类型", "Type of Document") }}
65 </div>
48 <el-input 66 <el-input
49 v-model="people.type" 67 v-model="people.type"
50 style="width: 570px" 68 style="width: 570px"
...@@ -55,19 +73,25 @@ const people = reactive({ ...@@ -55,19 +73,25 @@ const people = reactive({
55 </div> 73 </div>
56 <div class="form-item"> 74 <div class="form-item">
57 <div> 75 <div>
58 <div class="label">身份证号</div> 76 <div class="label">
77 {{ languageFormat(language, "身份证号", "Identity Card") }}
78 </div>
59 <el-input 79 <el-input
60 v-model="people.form.idCard" 80 v-model="people.form.idCard"
61 style="width: 570px" 81 style="width: 570px"
62 placeholder="请输入身份证号" 82 :placeholder="language == 0 ? '请输入身份证号' : 'ID Numbe'"
63 /> 83 />
64 </div> 84 </div>
65 </div> 85 </div>
66 </div> 86 </div>
67 87
68 <div class="footer"> 88 <div class="footer">
69 <div class="can_pay">取消</div> 89 <div class="can_pay">
70 <div class="pay" @click="people.onConfirm()">确认</div> 90 {{ languageFormat(language, "取消", "Cancel") }}
91 </div>
92 <div class="pay" @click="people.onConfirm()">
93 {{ languageFormat(language, "确认", "Confirm") }}
94 </div>
71 </div> 95 </div>
72 </div> 96 </div>
73 </template> 97 </template>
......
src/viewsPc/seat/confirm-order.vue
...@@ -4,7 +4,9 @@ import { ElMessage } from "element-plus"; ...@@ -4,7 +4,9 @@ import { ElMessage } from "element-plus";
4 import { payOrder, viewPeopleList, checkPaySuccess } from "./api/index.js"; 4 import { payOrder, viewPeopleList, checkPaySuccess } from "./api/index.js";
5 import qrCodeDialog from "./components/qrCodeDialog.vue"; 5 import qrCodeDialog from "./components/qrCodeDialog.vue";
6 import qrcode from "qrcode"; 6 import qrcode from "qrcode";
7 import { onUnmounted } from "vue"; 7 import { languageFormat } from "./utils/language.js";
8 import { useStorage } from "@vueuse/core/index";
9 const language = useStorage("language", 0);
8 10
9 const route = useRoute(); 11 const route = useRoute();
10 const router = useRouter(); 12 const router = useRouter();
...@@ -22,7 +24,10 @@ const startCheckSuccessListener = (orderSn, actId) => { ...@@ -22,7 +24,10 @@ const startCheckSuccessListener = (orderSn, actId) => {
22 timer = null; 24 timer = null;
23 // 支付成功 25 // 支付成功
24 payment.showCodeDialog = false; 26 payment.showCodeDialog = false;
25 ElMessage({ type: "success", message: "支付成功" }); 27 ElMessage({
28 type: "success",
29 message: anguageFormat(language, "支付成功", "Payment succeeded"),
30 });
26 router.replace({ 31 router.replace({
27 path: "/seat/order", 32 path: "/seat/order",
28 }); 33 });
...@@ -54,14 +59,18 @@ const payment = reactive({ ...@@ -54,14 +59,18 @@ const payment = reactive({
54 payType: 1, 59 payType: 1,
55 paymentAmount: order.data?.paymentAmount, 60 paymentAmount: order.data?.paymentAmount,
56 }).then((res) => { 61 }).then((res) => {
57 payment.qrInfo = res.data; 62 if (res.data.language == "zh-cn") {
58 qrcode.toDataURL(res.data.scanCodeUrl, (err, url) => { 63 payment.qrInfo = res.data;
59 if (url) { 64 qrcode.toDataURL(res.data.scanCodeUrl, (err, url) => {
60 payment.qrCodeData = url; 65 if (url) {
61 } 66 payment.qrCodeData = url;
62 }); 67 }
63 payment.showCodeDialog = true; 68 });
64 startCheckSuccessListener(res.data.orderSn, props.activityId); 69 payment.showCodeDialog = true;
70 startCheckSuccessListener(res.data.orderSn, props.activityId);
71 } else {
72 // TODO: 这里是PayPal支付
73 }
65 }); 74 });
66 }, 75 },
67 handleCloce() { 76 handleCloce() {
...@@ -98,8 +107,8 @@ const audience = reactive({ ...@@ -98,8 +107,8 @@ const audience = reactive({
98 }); 107 });
99 108
100 onUnmounted(() => { 109 onUnmounted(() => {
101 clearInterval(timer) 110 clearInterval(timer);
102 }) 111 });
103 112
104 audience.fetchData(); 113 audience.fetchData();
105 order.fetchData(); 114 order.fetchData();
...@@ -107,7 +116,9 @@ order.fetchData(); ...@@ -107,7 +116,9 @@ order.fetchData();
107 116
108 <template> 117 <template>
109 <div class="container"> 118 <div class="container">
110 <div class="title">订单确认</div> 119 <div class="title">
120 {{ languageFormat(language, "订单确认", "Order confirmation") }}
121 </div>
111 <div class="content"> 122 <div class="content">
112 <div class="left"> 123 <div class="left">
113 <div class="info"> 124 <div class="info">
...@@ -118,19 +129,25 @@ order.fetchData(); ...@@ -118,19 +129,25 @@ order.fetchData();
118 <div class="ticket_info"> 129 <div class="ticket_info">
119 <div class="tit_box"> 130 <div class="tit_box">
120 <div class="line"></div> 131 <div class="line"></div>
121 <div class="txt">订票信息</div> 132 <div class="txt">
133 {{ languageFormat(language, "订票信息", "Ticket Info") }}
134 </div>
122 </div> 135 </div>
123 136
124 <div class="form"> 137 <div class="form">
125 <el-form> 138 <el-form>
126 <el-form-item label="联系人"> 139 <el-form-item :label="language == 0 ? '联系人' : 'contacts'">
127 <el-input 140 <el-input
128 v-model="payment.form.phone" 141 v-model="payment.form.phone"
129 placeholder="请输入联系人电话" 142 :placeholder="
143 language == 0
144 ? '请输入联系电话'
145 : 'Please enter the contact phone number'
146 "
130 style="width: 260px" 147 style="width: 260px"
131 /> 148 />
132 </el-form-item> 149 </el-form-item>
133 <el-form-item label="观看人"> 150 <el-form-item :label="language == 0 ? '观看人' : 'contacts'">
134 <div class="p_box"> 151 <div class="p_box">
135 <div class="people"> 152 <div class="people">
136 <el-checkbox-group 153 <el-checkbox-group
...@@ -155,7 +172,7 @@ order.fetchData(); ...@@ -155,7 +172,7 @@ order.fetchData();
155 class="btn" 172 class="btn"
156 @click="$router.push({ path: '/seat/people_manage' })" 173 @click="$router.push({ path: '/seat/people_manage' })"
157 > 174 >
158 新增 175 {{ languageFormat(language, "新增", "Add") }}
159 </div> 176 </div>
160 </div> 177 </div>
161 </el-form-item> 178 </el-form-item>
...@@ -167,16 +184,19 @@ order.fetchData(); ...@@ -167,16 +184,19 @@ order.fetchData();
167 <div class="right"> 184 <div class="right">
168 <div class="tit_box"> 185 <div class="tit_box">
169 <div class="line"></div> 186 <div class="line"></div>
170 <div class="txt">订单明细</div> 187 <div class="txt">
188 {{ languageFormat(language, "订单明细", "Order summary") }}
189 </div>
171 </div> 190 </div>
172 191
173 <div class="detail"> 192 <div class="detail">
174 <div class="detail_top"> 193 <div class="detail_top">
175 <div class="time">{{ order.data?.dateStr }}</div> 194 <div class="time">{{ order.data?.dateStr }}</div>
176 <div class="ticket"> 195 <div class="ticket">
177 {{ order.data?.singlePrice }}元票档 x{{ 196 {{ order.data?.singlePrice }}<span v-if="language == 0">元</span
197 >{{ languageFormat(language, "票档", "Ticket file") }} x{{
178 order.data?.seatInfo?.length 198 order.data?.seatInfo?.length
179 }}张 199 }}{{ languageFormat(language, "张", "tickets") }}
180 </div> 200 </div>
181 </div> 201 </div>
182 <div class="detail_center"> 202 <div class="detail_center">
...@@ -185,25 +205,35 @@ order.fetchData(); ...@@ -185,25 +205,35 @@ order.fetchData();
185 :key="index" 205 :key="index"
186 class="ticket" 206 class="ticket"
187 > 207 >
188 <span v-if="it.venueId == 1">{{ it.area }}区</span> 208 <span v-if="it.venueId == 1"
189 {{ it.pai }}排{{ it.no }}座 ({{ 209 >{{ it.area }}{{ languageFormat(language, "区", "Zones") }}
210 </span>
211 {{ it.pai }}{{ languageFormat(language, "排", "Row") }} {{ it.no
212 }}{{ languageFormat(language, "座", "Seat") }} ({{
190 it.venueId == 1 ? "B6" : "B4" 213 it.venueId == 1 ? "B6" : "B4"
191 }}馆) 214 }}馆)
192 </div> 215 </div>
193 </div> 216 </div>
194 <div class="detail_b"> 217 <div class="detail_b">
195 <div class="sum_txt">共计</div> 218 <div class="sum_txt">
196 <div class="price_num">¥{{ order.data?.paymentAmount }}</div> 219 {{ languageFormat(language, "共计", "Total") }}
220 </div>
221 <div class="price_num">
222 <span v-if="language == 1">¥</span>{{ order.data?.paymentAmount }}
223 </div>
197 </div> 224 </div>
198 </div> 225 </div>
199 </div> 226 </div>
200 </div> 227 </div>
201 <div class="footer"> 228 <div class="footer">
202 <div> 229 <div>
203 <span class="label">共计金额：</span 230 <span class="label"
231 >{{ languageFormat(language, "共计金额", "Subtotal") }}：</span
204 ><span class="value">¥{{ order.data?.paymentAmount }}</span> 232 ><span class="value">¥{{ order.data?.paymentAmount }}</span>
205 </div> 233 </div>
206 <div class="pay" @click="payment.paymentHandle()">立即支付</div> 234 <div class="pay" @click="payment.paymentHandle()">
235 {{ languageFormat(language, "立即支付", "Pay Now") }}
236 </div>
207 </div> 237 </div>
208 238
209 <el-dialog 239 <el-dialog
......
src/viewsPc/seat/order-detail.vue
...@@ -10,6 +10,9 @@ import { ...@@ -10,6 +10,9 @@ import {
10 import qrCodeDialog from "./components/qrCodeDialog.vue"; 10 import qrCodeDialog from "./components/qrCodeDialog.vue";
11 import { ElMessageBox, ElMessage } from "element-plus"; 11 import { ElMessageBox, ElMessage } from "element-plus";
12 import qrcode from "qrcode"; 12 import qrcode from "qrcode";
13 import { languageFormat } from "./utils/language.js";
14 import { useStorage } from "@vueuse/core/index";
15 const language = useStorage("language", 0);
13 16
14 const route = useRoute(); 17 const route = useRoute();
15 const router = useRouter(); 18 const router = useRouter();
...@@ -124,14 +127,18 @@ const detail = reactive({ ...@@ -124,14 +127,18 @@ const detail = reactive({
124 detail.pay_loading = true; 127 detail.pay_loading = true;
125 immediatePay({ orderSn: detail.data.orderSn, payType: 1 }) 128 immediatePay({ orderSn: detail.data.orderSn, payType: 1 })
126 .then((res) => { 129 .then((res) => {
127 detail.qrInfo = res.data; 130 if (res.data.language == "zh-cn") {
128 qrcode.toDataURL(res.data.scanCodeUrl, (err, url) => { 131 detail.qrInfo = res.data;
129 if (url) { 132 qrcode.toDataURL(res.data.scanCodeUrl, (err, url) => {
130 detail.qrCodeData = url; 133 if (url) {
131 } 134 detail.qrCodeData = url;
132 }); 135 }
133 startCheckSuccessListener(detail.data.orderSn); 136 });
134 detail.showCodeDialog = true; 137 startCheckSuccessListener(detail.data.orderSn);
138 detail.showCodeDialog = true;
139 } else {
140 // TODO: 这里是PayPal支付
141 }
135 }) 142 })
136 .finally(() => (detail.pay_loading = false)); 143 .finally(() => (detail.pay_loading = false));
137 }, 144 },
...@@ -203,11 +210,21 @@ detail.fetchData(); ...@@ -203,11 +210,21 @@ detail.fetchData();
203 <!-- 票务信息 --> 210 <!-- 票务信息 -->
204 <div class="ticket"> 211 <div class="ticket">
205 <div class="th"> 212 <div class="th">
206 <div style="width: 33%" class="td">票务信息</div> 213 <div style="width: 33%" class="td">
207 <div style="width: 25%" class="td">地点</div> 214 {{ languageFormat(language, "票务信息", "Ticket Info") }}
208 <div style="width: 20%" class="td">单价</div> 215 </div>
209 <div style="width: 10%" class="td">数量</div> 216 <div style="width: 25%" class="td">
210 <div style="width: 12%; text-align: right" class="td">小计</div> 217 {{ languageFormat(language, "地点", "Venue") }}
218 </div>
219 <div style="width: 20%" class="td">
220 {{ languageFormat(language, "单价", "Price") }}
221 </div>
222 <div style="width: 10%" class="td">
223 {{ languageFormat(language, "数量", "Ticket Qty.") }}
224 </div>
225 <div style="width: 12%; text-align: right" class="td">
226 {{ languageFormat(language, "小计", "Subtotal") }}
227 </div>
211 </div> 228 </div>
212 <div class="line"></div> 229 <div class="line"></div>
213 <div class="tr"> 230 <div class="tr">
...@@ -227,32 +244,55 @@ detail.fetchData(); ...@@ -227,32 +244,55 @@ detail.fetchData();
227 <!-- 座位 --> 244 <!-- 座位 -->
228 <div class="seat_box"> 245 <div class="seat_box">
229 <div class="th"> 246 <div class="th">
230 <div style="width: 30.33%" class="td">时间座位</div> 247 <div style="width: 30.33%" class="td">
231 <div style="width: 30.33%" class="td">订单信息</div> 248 {{ languageFormat(language, "时间座位", "Seat Info") }}
232 <div style="width: 30.33%" class="td">联系方式</div> 249 </div>
250 <div style="width: 30.33%" class="td">
251 {{ languageFormat(language, "订单信息", "Summary") }}
252 </div>
253 <div style="width: 30.33%" class="td">
254 {{ languageFormat(language, "联系方式", "Contact details") }}
255 </div>
233 </div> 256 </div>
234 <div class="tr"> 257 <div class="tr">
235 <div style="width: 30.33%" class="td flex-col"> 258 <div style="width: 30.33%" class="td flex-col">
236 <div>{{ detail.data?.dateStr }}</div> 259 <div>{{ detail.data?.dateStr }}</div>
237 <div v-for="(it, index) in detail.data?.seatList" :key="index"> 260 <div v-for="(it, index) in detail.data?.seatList" :key="index">
238 <span v-if="it.venueId == 1">{{ it.area }}区</span 261 <span v-if="it.venueId == 1"
239 >{{ it.pai }}排{{ it.no }}座 ({{ 262 >{{ it.area
263 }}{{ languageFormat(language, "区", "Zones") }}</span
264 >{{ it.pai }}{{ languageFormat(language, "排", "Row") }}{{ it.no
265 }}{{ languageFormat(language, "座", "Seat") }} ({{
240 it.venueId == 1 ? "B6" : "B4" 266 it.venueId == 1 ? "B6" : "B4"
241 }}馆) 267 }}馆)
242 </div> 268 </div>
243 </div> 269 </div>
244 <div style="width: 30.33%" class="td flex-col"> 270 <div style="width: 30.33%" class="td flex-col">
245 <div>订单编号：{{ detail.data?.orderSn }}</div> 271 <div>
246 <div>创建时间：{{ detail.data?.orderTime }}</div> 272 {{ languageFormat(language, "订单编号", "Order No.") }}：{{
273 detail.data?.orderSn
274 }}
275 </div>
276 <div>
277 {{ languageFormat(language, "创建时间", "Order Time") }}：{{
278 detail.data?.orderTime
279 }}
280 </div>
247 </div> 281 </div>
248 <div style="width: 30.33%" class="td"> 282 <div style="width: 30.33%" class="td">
249 <div>联系电话：{{ detail.data?.contactPhone }}</div> 283 <div>
284 {{ languageFormat(language, "联系电话", "Telephone") }}：{{
285 detail.data?.contactPhone
286 }}
287 </div>
250 </div> 288 </div>
251 </div> 289 </div>
252 </div> 290 </div>
253 <!-- 购票人 --> 291 <!-- 购票人 -->
254 <div class="pay_ticket"> 292 <div class="pay_ticket">
255 <div class="title">购票人</div> 293 <div class="title">
294 {{ languageFormat(language, "购票人", "Full Name") }}
295 </div>
256 <div class="people"> 296 <div class="people">
257 <div 297 <div
258 v-for="(it, index) in detail.data?.customerList" 298 v-for="(it, index) in detail.data?.customerList"
...@@ -260,7 +300,11 @@ detail.fetchData(); ...@@ -260,7 +300,11 @@ detail.fetchData();
260 class="p_info" 300 class="p_info"
261 > 301 >
262 <div>{{ it.name }}</div> 302 <div>{{ it.name }}</div>
263 <div class="idcard">身份证：{{ it.idCard }}</div> 303 <div class="idcard">
304 {{ languageFormat(language, "身份证", "ID number") }}：{{
305 it.idCard
306 }}
307 </div>
264 </div> 308 </div>
265 </div> 309 </div>
266 </div> 310 </div>
...@@ -268,9 +312,13 @@ detail.fetchData(); ...@@ -268,9 +312,13 @@ detail.fetchData();
268 312
269 <div class="right"> 313 <div class="right">
270 <div class="balance"> 314 <div class="balance">
271 <div class="title">结算信息</div> 315 <div class="title">
316 {{ languageFormat(language, "结算信息", "Payment details") }}
317 </div>
272 <div class="cell"> 318 <div class="cell">
273 <div class="label">订单状态</div> 319 <div class="label">
320 {{ languageFormat(language, "订单状态", "Order Status") }}
321 </div>
274 <div 322 <div
275 class="value" 323 class="value"
276 :style="{ color: status[detail.data?.state]?.color }" 324 :style="{ color: status[detail.data?.state]?.color }"
...@@ -279,33 +327,65 @@ detail.fetchData(); ...@@ -279,33 +327,65 @@ detail.fetchData();
279 </div> 327 </div>
280 </div> 328 </div>
281 <div class="cell"> 329 <div class="cell">
282 <div class="label">订单金额</div> 330 <div class="label">
331 {{ languageFormat(language, "订单金额", "Order amount") }}
332 </div>
283 <div 333 <div
284 class="value" 334 class="value"
285 :style="{ color: status[detail.data?.state]?.color }" 335 :style="{ color: status[detail.data?.state]?.color }"
286 > 336 >
287 ¥{{ detail.data?.payAmount }} 337 <span v-if="language == 0">¥</span>{{ detail.data?.payAmount }}
288 </div> 338 </div>
289 </div> 339 </div>
290 <!-- button --> 340 <!-- button -->
291 <div v-if="detail.data?.state == 0" class="btn_box"> 341 <div v-if="detail.data?.state == 0" class="btn_box">
292 <div class="can_pay" @click="detail.cancelPay()">取消支付</div> 342 <div class="can_pay" @click="detail.cancelPay()">
293 <div class="pay" @click="detail.payment()">立即支付</div> 343 {{ languageFormat(language, "取消支付", "Cancel the payment") }}
344 </div>
345 <div class="pay" @click="detail.payment()">
346 {{ languageFormat(language, "立即支付", "Pay Now") }}
347 </div>
294 </div> 348 </div>
295 <div v-else> 349 <div v-else>
296 <!-- v-if="detail.data?.state == 1 && detail.data?.isRefund" --> 350 <!-- v-if="detail.data?.state == 1 && detail.data?.isRefund" -->
297 <div v-if="detail.data?.state == 1 && detail.data?.isRefund" class="btn_box"> 351 <div
298 <div class="can_pay" @click="detail.cancelOrder()">取消购票</div> 352 v-if="detail.data?.state == 1 && detail.data?.isRefund"
299 <div class="pay" @click="detail.comeBack()">再来一单</div> 353 class="btn_box"
354 >
355 <div class="can_pay" @click="detail.cancelOrder()">
356 {{
357 languageFormat(
358 language,
359 "取消购票",
360 "Cancel the ticket purchase"
361 )
362 }}
363 </div>
364 <div class="pay" @click="detail.comeBack()">
365 {{
366 languageFormat(
367 language,
368 "再来一单",
369 "Make another order"
370 )
371 }}
372 </div>
300 </div> 373 </div>
301 374
302 <div v-else class="btn_box"> 375 <div v-else class="btn_box">
303 <div class="pay_dis">请联系工作人员</div> 376 <div class="pay_dis"> {{
377 languageFormat(
378 language,
379 "请联系工作人员",
380 "Please contact the staff"
381 )
382 }}</div>
304 </div> 383 </div>
305 </div> 384 </div>
306 </div> 385 </div>
307 <div v-if="detail.data?.state == 0" class="tip"> 386 <div v-if="detail.data?.state == 0" class="tip">
308 请尽快完成支付，还剩{{ detail.minutes }}分{{ detail.seconds }}秒 387 <span v-if="language==0">请尽快完成支付，还剩{{ detail.minutes }}分{{ detail.seconds }}秒</span>
388 <span v-if="language==1">Time left {{ detail.minutes }}:{{ detail.seconds }}</span>
309 </div> 389 </div>
310 </div> 390 </div>
311 391
......
src/viewsPc/seat/order-list.vue
...@@ -11,37 +11,46 @@ import qrCodeDialog from "./components/qrCodeDialog.vue"; ...@@ -11,37 +11,46 @@ import qrCodeDialog from "./components/qrCodeDialog.vue";
11 import { ElMessageBox, ElMessage } from "element-plus"; 11 import { ElMessageBox, ElMessage } from "element-plus";
12 import qrcode from "qrcode"; 12 import qrcode from "qrcode";
13 import { md5 } from "md5js"; 13 import { md5 } from "md5js";
14 import { languageFormat } from "./utils/language.js";
15 import { useStorage } from "@vueuse/core/index";
16 const language = useStorage("language", 0);
14 17
15 const userStore = useUserStore(); 18 const userStore = useUserStore();
16 19
17 const status = reactive({ 20 const status = reactive({
18 0: { 21 0: {
19 txt: "待支付", 22 txt: "待支付",
23 text_en: "Pending Payment",
20 color: "#F740A6", 24 color: "#F740A6",
21 bgColor: "#FFE2F2", 25 bgColor: "#FFE2F2",
22 }, 26 },
23 1: { 27 1: {
24 txt: "购票成功", 28 txt: "购票成功",
29 text_en: "Transaction completed",
25 color: "#FFCC00", 30 color: "#FFCC00",
26 bgColor: "#FFF7D9", 31 bgColor: "#FFF7D9",
27 }, 32 },
28 2: { 33 2: {
29 txt: "交易关闭", 34 txt: "交易关闭",
35 text_en: "Transaction closed",
30 color: "#757575", 36 color: "#757575",
31 bgColor: "#DDDDDD", 37 bgColor: "#DDDDDD",
32 }, 38 },
33 3: { 39 3: {
34 txt: "已退款", 40 txt: "已退款",
41 text_en: "Already refunded",
35 color: "#757575", 42 color: "#757575",
36 bgColor: "#DDDDDD", 43 bgColor: "#DDDDDD",
37 }, 44 },
38 4: { 45 4: {
39 txt: '退款中', 46 txt: "退款中",
47 text_en: "In the process of refunding",
40 color: "#F740A6", 48 color: "#F740A6",
41 bgColor: "#FFE2F2", 49 bgColor: "#FFE2F2",
42 }, 50 },
43 5: { 51 5: {
44 txt: "完成", 52 txt: "完成",
53 text_en: "Finish",
45 color: "#34C759", 54 color: "#34C759",
46 bgColor: "#D2FFDD", 55 bgColor: "#D2FFDD",
47 }, 56 },
...@@ -162,7 +171,7 @@ onUnmounted(() => { ...@@ -162,7 +171,7 @@ onUnmounted(() => {
162 171
163 // 用户免登录 172 // 用户免登录
164 const login = async () => { 173 const login = async () => {
165 const userId = userStore.user?.userId 174 const userId = userStore.user?.userId;
166 const sign = md5(`uid=${userId}lgo1acfkw51jfo`, 32); 175 const sign = md5(`uid=${userId}lgo1acfkw51jfo`, 32);
167 return loginFree({ 176 return loginFree({
168 userId: userId, 177 userId: userId,
...@@ -173,9 +182,8 @@ const login = async () => { ...@@ -173,9 +182,8 @@ const login = async () => {
173 }); 182 });
174 }; 183 };
175 onMounted(() => { 184 onMounted(() => {
176 login() 185 login();
177 }); 186 });
178
179 </script> 187 </script>
180 188
181 <template> 189 <template>
...@@ -195,13 +203,35 @@ onMounted(() => { ...@@ -195,13 +203,35 @@ onMounted(() => {
195 <img class="cover_img" :src="it.coverImg" /> 203 <img class="cover_img" :src="it.coverImg" />
196 <div class="info"> 204 <div class="info">
197 <div class="title">{{ it.name }}</div> 205 <div class="title">{{ it.name }}</div>
198 <div class="common">时间：{{ it.dateStr }}</div> 206 <div class="common">
199 <div class="common">地址：{{ it.placeName }}</div> 207 {{ languageFormat(language, "时间", "Event Date & Time") }}：{{
200 <div class="common">订单编号：{{ it.orderSn }}</div> 208 it.dateStr
201 <div class="common">张数：{{ it.ticketNum }}张</div> 209 }}
202 <div class="common">金额：￥{{ it.payAmount }}</div> 210 </div>
211 <div class="common">
212 {{ languageFormat(language, "地址", "Location") }}：{{
213 it.placeName
214 }}
215 </div>
216 <div class="common">
217 {{ languageFormat(language, "订单编号", "Order No.") }}：{{
218 it.orderSn
219 }}
220 </div>
221 <div class="common">
222 {{ languageFormat(language, "张数", "Location") }}：{{ it.ticketNum
223 }}{{ languageFormat(language, "张", "tickets") }}
224 </div>
225 <div class="common">
226 {{ languageFormat(language, "金额", "Ticket Price") }}：<span
227 v-if="language == 0"
228 >￥</span
229 >{{ it.payAmount }}
230 </div>
203 <div class="status"> 231 <div class="status">
204 <div class="label">订单状态：</div> 232 <div class="label">
233 {{ languageFormat(language, "订单状态", "Order Status") }}：
234 </div>
205 <div class="value"> 235 <div class="value">
206 <div 236 <div
207 :style="{ 237 :style="{
...@@ -211,10 +241,19 @@ onMounted(() => { ...@@ -211,10 +241,19 @@ onMounted(() => {
211 }" 241 }"
212 class="tag" 242 class="tag"
213 > 243 >
214 {{ status[it.state].txt }} 244 {{
245 language == 0 ? status[it.state].txt : status[it.state].txt_en
246 }}
215 </div> 247 </div>
216 <div v-if="it.state == 0" class="tip"> 248 <div v-if="it.state == 0" class="tip">
217 请尽快完成支付，还剩{{ order.minutes }}分{{ order.seconds }}秒 249 <span v-if="language == 0"
250 >请尽快完成支付，还剩{{ order.minutes }}分{{
251 order.seconds
252 }}秒</span
253 >
254 <span v-else
255 >Time left {{ order.minutes }}:{{ order.seconds }}</span
256 >
218 </div> 257 </div>
219 </div> 258 </div>
220 </div> 259 </div>
......
src/viewsPc/seat/people-manage.vue
1 <script setup> 1 <script setup>
2 import { deleteViewPeople, viewPeopleList } from "./api/index.js"; 2 import { deleteViewPeople, viewPeopleList } from "./api/index.js";
3 import { ElMessageBox, ElMessage } from "element-plus"; 3 import { ElMessageBox, ElMessage } from "element-plus";
4 4 import { languageFormat } from "./utils/language.js";
5 import { useStorage } from "@vueuse/core/index";
6 const language = useStorage("language", 0);
5 7
6 const audience = reactive({ 8 const audience = reactive({
7 data: [], 9 data: [],
...@@ -12,18 +14,30 @@ const audience = reactive({ ...@@ -12,18 +14,30 @@ const audience = reactive({
12 }, 14 },
13 15
14 deletePeople(id) { 16 deletePeople(id) {
15 ElMessageBox.confirm("确定删除该观看人吗？", "提示", { 17 ElMessageBox.confirm(
16 confirmButtonText: "确认", 18 languageFormat(
17 cancelButtonText: "取消", 19 language,
18 type: "warning", 20 "确认删除该观看人吗？",
19 draggable: true, 21 "Are you sure to delete this viewer?"
20 }) 22 ),
23 languageFormat(language, "提示", "Reminder"),
24 {
25 confirmButtonText: languageFormat(language, "确认", "confirm"),
26 cancelButtonText: languageFormat(language, "取消", "cancel"),
27 type: "warning",
28 draggable: true,
29 }
30 )
21 .then(() => { 31 .then(() => {
22 deleteViewPeople({ id }).then(() => { 32 deleteViewPeople({ id }).then(() => {
23 audience.fetchData(); 33 audience.fetchData();
24 ElMessage({ 34 ElMessage({
25 type: "success", 35 type: "success",
26 message: "操作成功", 36 message: languageFormat(
37 language,
38 "操作成功",
39 "Operate successfully"
40 ),
27 }); 41 });
28 }); 42 });
29 }) 43 })
...@@ -41,9 +55,9 @@ audience.fetchData(); ...@@ -41,9 +55,9 @@ audience.fetchData();
41 class="add_btn" 55 class="add_btn"
42 @click="$router.push({ path: '/seat/add_watch_people' })" 56 @click="$router.push({ path: '/seat/add_watch_people' })"
43 > 57 >
44 新增 58 {{ languageFormat(language, "新增", "Add") }}
45 </div> 59 </div>
46 观影人管理 60 {{ languageFormat(language, "观影人管理", "Viewers") }}
47 </div> 61 </div>
48 <div class="content"> 62 <div class="content">
49 <div class="people_box"> 63 <div class="people_box">
...@@ -53,8 +67,14 @@ audience.fetchData(); ...@@ -53,8 +67,14 @@ audience.fetchData();
53 class="people_item" 67 class="people_item"
54 > 68 >
55 <div class="name">{{ it.name }}</div> 69 <div class="name">{{ it.name }}</div>
56 <div class="idcard">身份证：{{ it.idCard }}</div> 70 <div class="idcard">
57 <div class="btn" @click="audience.deletePeople(it.id)">删除</div> 71 {{ languageFormat(language, "身份证", "Identity Card") }}：{{
72 it.idCard
73 }}
74 </div>
75 <div class="btn" @click="audience.deletePeople(it.id)">
76 {{ languageFormat(language, "删除", "delete") }}
77 </div>
58 </div> 78 </div>
59 </div> 79 </div>
60 </div> 80 </div>
......
src/viewsPc/seat/seat-picker.vue
1 <script setup> 1 <script setup>
2 import { ElMessage } from "element-plus"; 2 import { ElMessage } from "element-plus";
3 import { getPriceLevelInfo, getSiteConfig, confirmOrder } from "./api/index.js"; 3 import { getPriceLevelInfo, getSiteConfig, confirmOrder } from "./api/index.js";
4 import { onBeforeUnmount } from "vue"; 4 import { languageFormat } from "./utils/language.js";
5 import { useStorage } from "@vueuse/core/index";
6 const language = useStorage("language", 0);
5 7
6 const route = useRoute(); 8 const route = useRoute();
7 const router = useRouter(); 9 const router = useRouter();
...@@ -78,7 +80,11 @@ function onWindowMessage(e) { ...@@ -78,7 +80,11 @@ function onWindowMessage(e) {
78 selectedSeats.value?.length >= 5 && 80 selectedSeats.value?.length >= 5 &&
79 seatData.active == 0 81 seatData.active == 0
80 ) 82 )
81 return ElMessage({ type: "warning", message: "最多选择5个座位" }); 83 return ElMessage({ type: "warning", message: languageFormat(
84 language,
85 "最多选择5个座位",
86 "Selectt at most 5 seats"
87 ) });
82 88
83 const newActive = seatData.active == 0 ? 1 : 0; 89 const newActive = seatData.active == 0 ? 1 : 0;
84 const siteConfigItem = siteConfig.data.find((it) => it.id == seatData.id); 90 const siteConfigItem = siteConfig.data.find((it) => it.id == seatData.id);
...@@ -204,7 +210,14 @@ const sumPrice = computed(() => { ...@@ -204,7 +210,14 @@ const sumPrice = computed(() => {
204 const toConfirmOrder = () => { 210 const toConfirmOrder = () => {
205 const seatIds = selectedSeats.value.map((it) => it.id); 211 const seatIds = selectedSeats.value.map((it) => it.id);
206 if (!seatIds.length) 212 if (!seatIds.length)
207 return ElMessage({ type: "warning", message: "请先选择座位" }); 213 return ElMessage({
214 type: "warning",
215 message: languageFormat(
216 language,
217 "请先选择座位",
218 "Please select the seat first."
219 ),
220 });
208 confirmOrder({ 221 confirmOrder({
209 actId: props.activityId, 222 actId: props.activityId,
210 openType: route.query.openType, 223 openType: route.query.openType,
...@@ -268,7 +281,9 @@ price.fetchData(); ...@@ -268,7 +281,9 @@ price.fetchData();
268 @click="price.onClickPrice(it)" 281 @click="price.onClickPrice(it)"
269 > 282 >
270 <img class="seat" :src="it.unSelectIcon" /> 283 <img class="seat" :src="it.unSelectIcon" />
271 <span class="price">{{ it.price }}¥</span> 284 <span class="price"
285 >{{ it.price }}<span v-if="language == 0">¥</span></span
286 >
272 </div> 287 </div>
273 </div> 288 </div>
274 </div> 289 </div>
...@@ -278,7 +293,11 @@ price.fetchData(); ...@@ -278,7 +293,11 @@ price.fetchData();
278 <!-- v-for="(it, index) in selectedSeats" --> 293 <!-- v-for="(it, index) in selectedSeats" -->
279 <div v-for="(it, index) in selectedSeats" class="seat_item"> 294 <div v-for="(it, index) in selectedSeats" class="seat_item">
280 <img class="seat_icon" :src="it.selectIcon" /> 295 <img class="seat_icon" :src="it.selectIcon" />
281 <span class="num">{{ it.area }}区 {{ it.pai }}排{{ it.no }}座</span> 296 <span class="num"
297 >{{ it.area }}{{ languageFormat(language, "区", "Zones") }}
298 {{ it.pai }}{{ languageFormat(language, "排", "Row") }} {{ it.no }}
299 {{ languageFormat(language, "座", "Seat") }}</span
300 >
282 <el-icon 301 <el-icon
283 style="cursor: pointer" 302 style="cursor: pointer"
284 color="#ccc" 303 color="#ccc"
...@@ -289,7 +308,9 @@ price.fetchData(); ...@@ -289,7 +308,9 @@ price.fetchData();
289 </div> 308 </div>
290 <div class="pay"> 309 <div class="pay">
291 <div class="sum">¥{{ sumPrice?.toFixed(2) }}</div> 310 <div class="sum">¥{{ sumPrice?.toFixed(2) }}</div>
292 <div class="pay_btn" @click="toConfirmOrder()">立即购买</div> 311 <div class="pay_btn" @click="toConfirmOrder()">
312 {{ languageFormat(language, "立即购买", "Continue") }}
313 </div>
293 </div> 314 </div>
294 </div> 315 </div>
295 316
......
src/viewsPc/seat/ticket-detail.vue
...@@ -11,6 +11,9 @@ import { ...@@ -11,6 +11,9 @@ import {
11 getSitePlaceInfo, 11 getSitePlaceInfo,
12 getPriceLevelInfo, 12 getPriceLevelInfo,
13 } from "./api/index.js"; 13 } from "./api/index.js";
14 import { languageFormat } from "./utils/language.js";
15 import { useStorage } from "@vueuse/core/index";
16 const language = useStorage("language", 0);
14 17
15 const route = useRoute(); 18 const route = useRoute();
16 const router = useRouter(); 19 const router = useRouter();
...@@ -90,13 +93,41 @@ const select_form = reactive({ ...@@ -90,13 +93,41 @@ const select_form = reactive({
90 await login(userId); 93 await login(userId);
91 94
92 if (!select_form.venueItem?.id) 95 if (!select_form.venueItem?.id)
93 return ElMessage({ type: "warning", message: "请选择时间" }); 96 return ElMessage({
97 type: "warning",
98 message: languageFormat(
99 language,
100 "请选择时间",
101 "Please select the time"
102 ),
103 });
94 if (select_form.session == -1) 104 if (select_form.session == -1)
95 return ElMessage({ type: "warning", message: "请选择场次" }); 105 return ElMessage({
106 type: "warning",
107 message: languageFormat(
108 language,
109 "请选择场次",
110 "Please select the session"
111 ),
112 });
96 if (!select_form.place) 113 if (!select_form.place)
97 return ElMessage({ type: "warning", message: "请选择场馆" }); 114 return ElMessage({
115 type: "warning",
116 message: languageFormat(
117 language,
118 "请选择场馆",
119 "Please choose the venue"
120 ),
121 });
98 if (!select_form.ticket_block) 122 if (!select_form.ticket_block)
99 return ElMessage({ type: "warning", message: "请选择票档" }); 123 return ElMessage({
124 type: "warning",
125 message: languageFormat(
126 language,
127 "请选择票档",
128 "Please choose the ticket category"
129 ),
130 });
100 131
101 router.push({ 132 router.push({
102 path: "/seat/seat_picker", 133 path: "/seat/seat_picker",
...@@ -225,7 +256,7 @@ watch( ...@@ -225,7 +256,7 @@ watch(
225 <div class="info"> 256 <div class="info">
226 <div class="title">{{ detail.data?.name }}</div> 257 <div class="title">{{ detail.data?.name }}</div>
227 <div class="time"> 258 <div class="time">
228 时间：{{ 259 {{ languageFormat(language, "时间", "Event Date & Time") }}：{{
229 detail.data?.startTime 260 detail.data?.startTime
230 ? dayjs(detail.data?.startTime).format("YYYY.MM.DD ddd") 261 ? dayjs(detail.data?.startTime).format("YYYY.MM.DD ddd")
231 : "" 262 : ""
...@@ -237,10 +268,16 @@ watch( ...@@ -237,10 +268,16 @@ watch(
237 : "" 268 : ""
238 }} 269 }}
239 </div> 270 </div>
240 <div class="address">地址：{{ detail.data?.address }}</div> 271 <div class="address">
272 {{ languageFormat(language, "地址", "Location") }}：{{
273 detail.data?.address
274 }}
275 </div>
241 <!-- 时间 --> 276 <!-- 时间 -->
242 <div class="select_item_box"> 277 <div class="select_item_box">
243 <div class="label">时间</div> 278 <div class="label">
279 {{ languageFormat(language, "时间", "Event Date & Time") }}
280 </div>
244 <div class="select_item"> 281 <div class="select_item">
245 <div 282 <div
246 v-for="(it, index) in timeVenue.data" 283 v-for="(it, index) in timeVenue.data"
...@@ -251,13 +288,13 @@ watch( ...@@ -251,13 +288,13 @@ watch(
251 @click="select_form.onClickVenue(it)" 288 @click="select_form.onClickVenue(it)"
252 > 289 >
253 {{ it.dateStr }} 290 {{ it.dateStr }}
254 <div v-if="it.type == 1" class="tag_t">套票</div> 291 <div v-if="it.type == 1" class="tag_t">{{ languageFormat(language, "套票", "Package ticket") }}</div>
255 </div> 292 </div>
256 </div> 293 </div>
257 </div> 294 </div>
258 <!-- 场次 --> 295 <!-- 场次 -->
259 <div class="select_item_box"> 296 <div class="select_item_box">
260 <div class="label">场次</div> 297 <div class="label">{{ languageFormat(language, "场次", "Session") }}</div>
261 <div class="select_item"> 298 <div class="select_item">
262 <div 299 <div
263 :class="[ 300 :class="[
...@@ -269,7 +306,7 @@ watch( ...@@ -269,7 +306,7 @@ watch(
269 ]" 306 ]"
270 @click="select_form.onClickSession(0)" 307 @click="select_form.onClickSession(0)"
271 > 308 >
272 日场 309 {{ languageFormat(language, "日场", "Day session") }}
273 </div> 310 </div>
274 <div 311 <div
275 :class="[ 312 :class="[
...@@ -281,13 +318,15 @@ watch( ...@@ -281,13 +318,15 @@ watch(
281 ]" 318 ]"
282 @click="select_form.onClickSession(1)" 319 @click="select_form.onClickSession(1)"
283 > 320 >
284 夜场 321 {{ languageFormat(language, "夜场", "Night session") }}
285 </div> 322 </div>
286 </div> 323 </div>
287 </div> 324 </div>
288 <!-- 场馆 --> 325 <!-- 场馆 -->
289 <div class="select_item_box"> 326 <div class="select_item_box">
290 <div class="label">场馆</div> 327 <div class="label">
328 {{ languageFormat(language, "场馆", "Venue") }}
329 </div>
291 <div class="select_item"> 330 <div class="select_item">
292 <div 331 <div
293 v-for="(it, index) in sitePlaceInfo.data" 332 v-for="(it, index) in sitePlaceInfo.data"
...@@ -310,7 +349,9 @@ watch( ...@@ -310,7 +349,9 @@ watch(
310 v-if="price.data?.length && select_form.place" 349 v-if="price.data?.length && select_form.place"
311 class="select_item_box" 350 class="select_item_box"
312 > 351 >
313 <div class="label">票档</div> 352 <div class="label">
353 {{ languageFormat(language, "票档", "Ticket Category") }}
354 </div>
314 <div class="select_item"> 355 <div class="select_item">
315 <div 356 <div
316 v-for="(it, index) in price.data" 357 v-for="(it, index) in price.data"
...@@ -329,16 +370,22 @@ watch( ...@@ -329,16 +370,22 @@ watch(
329 </div> 370 </div>
330 </div> 371 </div>
331 <!-- button --> 372 <!-- button -->
332 <div class="btn" @click="select_form.toSelectSeat()">选座购票</div> 373 <div class="btn" @click="select_form.toSelectSeat()">
374 {{ languageFormat(language, "选座购票", "Seat selection") }}
375 </div>
333 </div> 376 </div>
334 </div> 377 </div>
335 378
336 <!-- bottom --> 379 <!-- bottom -->
337 <div class="container bottom"> 380 <div class="container bottom">
338 <div class="title">活动介绍</div> 381 <div class="title">
382 {{ languageFormat(language, "活动介绍", "Event Details") }}
383 </div>
339 <div class="rich_content" v-html="detail.data?.introduceInfo"></div> 384 <div class="rich_content" v-html="detail.data?.introduceInfo"></div>
340 385
341 <div class="title" style="margin-top: 30px">购票须知</div> 386 <div class="title" style="margin-top: 30px">
387 {{ languageFormat(language, "购票须知", "Ticketing Information") }}
388 </div>
342 <div class="rich_content" v-html="detail.data?.buyNotice"></div> 389 <div class="rich_content" v-html="detail.data?.buyNotice"></div>
343 </div> 390 </div>
344 </div> 391 </div>
......
src/viewsPc/seat/utils/language.js 0 → 100644
1
2 export const languageFormat = (language = 0, zh, en) => {
3 return language == 1 ? en : zh;
4 };
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!