Skip to content

杨炀 / ztx_wx_gzt

Go to a project
Toggle navigation
Toggle navigation pinning
dc453c5f by 华明祺
Options

feat: 优化会员认证和支付流程 

- App.vue: 添加 globalData 初始化，修复选择证件照后跳转登录页的问题
- common/api.js: certifiedNew 接口改为 URL 参数传参
- myCenter/goPay.vue: 使用 await-to-js 重构支付逻辑，添加 loading 状态
- myCenter/sucPay.vue: 接收 orderId 参数，通过接口获取订单信息并展示
- personal/sucPay.vue: 调整订单信息字段绑定
- config.js: 更新 API 基础地址
1 parent 87d7b854
Inline Side-by-side
Showing 7 changed files with 462 additions and 311 deletions
App.vue
1 <script> 1 <script>
2 import { 2 import {
3 getInfo 3 getInfo
4 } from '@/common/login.js'; 4 } from '@/common/login.js';
5 import * as api from '@/common/api.js'; 5 import * as api from '@/common/api.js';
6 import config from '@/config.js'; 6 import config from '@/config.js';
7 7
8 let loginUrl=['login/login', 'login/register'] 8 let loginUrl = ['login/login', 'login/register', 'personal/addVip_per']
9 let firstload = false 9 let firstload = false
10 export default { 10 export default {
11 globalData: {
12 isLogin: false,
13 baseUrl_api: '',
14 user: null,
15 userType: '',
16 userInfo: null,
17 deptType: '',
18 genFlag: '',
19 authenticationStatus: '',
20 memberInfo: null,
21 isExam: false
22 },
11 onLaunch: function(options) { 23 onLaunch: function(options) {
12 console.log('App Launch', options); 24 console.log('App Launch', options);
13 25
14 this.globalData.baseUrl_api = config.baseUrl_api; 26 this.globalData.baseUrl_api = config.baseUrl_api;
15 if(loginUrl.indexOf(options.path)==-1){ 27 if (loginUrl.indexOf(options.path) == -1) {
16 let userName = uni.getStorageSync('userName') 28 let userName = uni.getStorageSync('userName')
17 if (userName) { 29 if (userName) {
18 getInfo().then(() => { 30 getInfo().then(() => {
...@@ -38,17 +50,17 @@ export default { ...@@ -38,17 +50,17 @@ export default {
38 } 50 }
39 }, 51 },
40 onShow: function() { 52 onShow: function() {
41 console.log('App Show',firstload,this.globalData.isLogin); 53 console.log('App Show', firstload, this.globalData.isLogin);
42 if(firstload&&!this.globalData.isLogin){ 54 // if (firstload && !this.globalData.isLogin) {
43 uni.redirectTo({ 55 // uni.redirectTo({
44 url: '/login/login' 56 // url: '/login/login'
45 }) 57 // })
46 } 58 // }
47 }, 59 },
48 onHide: function() { 60 onHide: function() {
49 console.log('App Hide'); 61 console.log('App Hide');
50 } 62 }
51 }; 63 };
52 </script> 64 </script>
53 65
54 <style lang="scss"> 66 <style lang="scss">
......
common/api.js
...@@ -1306,11 +1306,10 @@ export function checkBusinessLicense(data) { ...@@ -1306,11 +1306,10 @@ export function checkBusinessLicense(data) {
1306 } 1306 }
1307 1307
1308 // 生成团体订单renewYear 1308 // 生成团体订单renewYear
1309 export function certifiedNew(params) { 1309 export function certifiedNew(renewYear) {
1310 return request({ 1310 return request({
1311 url: `/system/certifiedNew/commit`, 1311 url: `/system/certifiedNew/commit?renewYear=${renewYear}`,
1312 method: 'post', 1312 method: 'post'
1313 params
1314 }) 1313 })
1315 } 1314 }
1316 1315
......
config.js
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
5 // staging 会员系统 5 // staging 会员系统
6 // const baseUrl_api = "http://22yidpjzjifv.ngrok.xiaomiqiu123.top/stage-api/"; 6 // const baseUrl_api = "http://22yidpjzjifv.ngrok.xiaomiqiu123.top/stage-api/";
7 // const baseUrl_api = "https://ztx.itechtop.cn:8443/stage-api"; 7 // const baseUrl_api = "https://ztx.itechtop.cn:8443/stage-api";
8 const baseUrl_api = 'http://192.168.1.189:8788' 8 const baseUrl_api = 'http://192.168.1.189:8787'
9 // const baseUrl_api = 'https://tkcn.19wk.cn:8443/stage-api' 9 // const baseUrl_api = 'https://tkcn.19wk.cn:8443/stage-api'
10 // const baseUrl_api = 'http://tk004.wxjylt.com/stage-api' 10 // const baseUrl_api = 'http://tk004.wxjylt.com/stage-api'
11 11
......
myCenter/auth.vue
...@@ -20,8 +20,9 @@ ...@@ -20,8 +20,9 @@
20 <view class="flexbox" style="justify-content: flex-end;padding: 0 30rpx 40rpx;"> 20 <view class="flexbox" style="justify-content: flex-end;padding: 0 30rpx 40rpx;">
21 <button class="btn-red" style="margin: 0 20rpx 0 0;" size="mini" 21 <button class="btn-red" style="margin: 0 20rpx 0 0;" size="mini"
22 v-if="activeStatus==0&&authenticationStatusa" @click="payTheFees">激活</button> 22 v-if="activeStatus==0&&authenticationStatusa" @click="payTheFees">激活</button>
23 <view v-else > 23 <view v-else>
24 <button class="btn-red" style="margin: 0 20rpx 0 0;" size="mini" :disabled="auditStatus==1||auditStatus==2||form.isPoints==0" 24 <button class="btn-red" style="margin: 0 20rpx 0 0;" size="mini"
25 :disabled="auditStatus==1||auditStatus==2||form.isPoints==0"
25 @click="showApplyDialog">考点申请</button> 26 @click="showApplyDialog">考点申请</button>
26 <button class="btn-red" style="margin: 0 20rpx 0 0;" size="mini" :disabled="btn" 27 <button class="btn-red" style="margin: 0 20rpx 0 0;" size="mini" :disabled="btn"
27 @click="payTheFees">去缴费</button> 28 @click="payTheFees">去缴费</button>
...@@ -40,8 +41,8 @@ ...@@ -40,8 +41,8 @@
40 <uni-list-item title="所属省份"> 41 <uni-list-item title="所属省份">
41 <template v-slot:footer> 42 <template v-slot:footer>
42 <view class="frrr"> 43 <view class="frrr">
43 <uni-data-picker readonly :clear-icon="false" 44 <uni-data-picker readonly :clear-icon="false" v-model="form.belongProvinceId"
44 v-model="form.belongProvinceId" :localdata="options"> 45 :localdata="options">
45 </uni-data-picker> 46 </uni-data-picker>
46 </view> 47 </view>
47 </template> 48 </template>
...@@ -91,7 +92,7 @@ ...@@ -91,7 +92,7 @@
91 </template> 92 </template>
92 </uni-list-item> 93 </uni-list-item>
93 <uni-list-item title="机构照片" clickable> 94 <uni-list-item title="机构照片" clickable>
94 <template v-slot:footer > 95 <template v-slot:footer>
95 <view class="frrr"> 96 <view class="frrr">
96 <view v-if="form.picturesArr&&form.picturesArr?.length>0" class="photoBook" 97 <view v-if="form.picturesArr&&form.picturesArr?.length>0" class="photoBook"
97 @click="showImage(form.picturesArr,0)"> 98 @click="showImage(form.picturesArr,0)">
...@@ -105,9 +106,7 @@ ...@@ -105,9 +106,7 @@
105 </uni-list> 106 </uni-list>
106 </view> 107 </view>
107 <!-- 弹窗添加触摸事件拦截 --> 108 <!-- 弹窗添加触摸事件拦截 -->
108 <uni-popup ref="applyPopup" type="center" 109 <uni-popup ref="applyPopup" type="center" @touchmove.stop.prevent="() => {}" @open="onPopupOpen"
109 @touchmove.stop.prevent="() => {}"
110 @open="onPopupOpen"
111 @close="onPopupClose"> 110 @close="onPopupClose">
112 <view class="apply-dialog" @touchmove.stop.prevent="() => {}"> 111 <view class="apply-dialog" @touchmove.stop.prevent="() => {}">
113 <view class="dialog-title">考点申请</view> 112 <view class="dialog-title">考点申请</view>
...@@ -131,10 +130,12 @@ ...@@ -131,10 +130,12 @@
131 130
132 import _ from 'underscore' 131 import _ from 'underscore'
133 import { 132 import {
134 ref, onUnmounted 133 ref,
134 onUnmounted
135 } from 'vue' 135 } from 'vue'
136 import { 136 import {
137 onLoad,onShow 137 onLoad,
138 onShow
138 } from '@dcloudio/uni-app' 139 } from '@dcloudio/uni-app'
139 const app = getApp() 140 const app = getApp()
140 const form = ref({ 141 const form = ref({
...@@ -168,7 +169,9 @@ ...@@ -168,7 +169,9 @@
168 169
169 // 页面卸载时恢复滚动（防止异常锁死） 170 // 页面卸载时恢复滚动（防止异常锁死）
170 onUnmounted(() => { 171 onUnmounted(() => {
171 uni.setPageScrollEnabled({ enabled: true }) 172 uni.setPageScrollEnabled({
173 enabled: true
174 })
172 popupShow.value = false 175 popupShow.value = false
173 }) 176 })
174 177
...@@ -227,19 +230,22 @@ ...@@ -227,19 +230,22 @@
227 230
228 if (form.value.businessLicense) { 231 if (form.value.businessLicense) {
229 form.value.businessLicenseArr = [] 232 form.value.businessLicenseArr = []
230 try{ 233 try {
231 form.value.businessLicenseArr = JSON.parse(form.value.businessLicense) || [] 234 form.value.businessLicenseArr = JSON.parse(form.value.businessLicense) || []
232 }catch(e){ 235 } catch (e) {
233 form.value.businessLicenseArr=[{url:form.value.businessLicense,name:'营业执照'}] 236 form.value.businessLicenseArr = [{
237 url: form.value.businessLicense,
238 name: '营业执照'
239 }]
234 } 240 }
235 console.log('营业执照',form.value.businessLicenseArr) 241 console.log('营业执照', form.value.businessLicenseArr)
236 } 242 }
237 if (form.value.certLegalIdcPhoto && form.value.certLegalIdcPhoto!=null) { 243 if (form.value.certLegalIdcPhoto && form.value.certLegalIdcPhoto != null) {
238 form.value.legalIdcPhotoArr = [] 244 form.value.legalIdcPhotoArr = []
239 var arr = form.value.certLegalIdcPhoto?.split(',') || [] 245 var arr = form.value.certLegalIdcPhoto?.split(',') || []
240 if (arr.length > 0) { 246 if (arr.length > 0) {
241 arr = _.map(arr, (p) => { 247 arr = _.map(arr, (p) => {
242 if(p.indexOf('http')==-1){ 248 if (p.indexOf('http') == -1) {
243 console.log(p) 249 console.log(p)
244 p = config.baseUrl_api + p 250 p = config.baseUrl_api + p
245 } 251 }
...@@ -247,14 +253,14 @@ ...@@ -247,14 +253,14 @@
247 }) 253 })
248 form.value.legalIdcPhotoArr = arr 254 form.value.legalIdcPhotoArr = arr
249 } 255 }
250 console.log('法人身份证',form.value.legalIdcPhotoArr) 256 console.log('法人身份证', form.value.legalIdcPhotoArr)
251 } 257 }
252 if (form.value.certPictures) { 258 if (form.value.certPictures) {
253 form.value.picturesArr = [] 259 form.value.picturesArr = []
254 var arr = form.value.certPictures.split(',') || [] 260 var arr = form.value.certPictures.split(',') || []
255 if (arr.length > 0) { 261 if (arr.length > 0) {
256 arr = _.map(arr, (p) => { 262 arr = _.map(arr, (p) => {
257 if(p.indexOf('http')==-1){ 263 if (p.indexOf('http') == -1) {
258 p = config.baseUrl_api + p 264 p = config.baseUrl_api + p
259 } 265 }
260 return p 266 return p
...@@ -267,7 +273,9 @@ ...@@ -267,7 +273,9 @@
267 } 273 }
268 274
269 async function getMyStatusAPI() { 275 async function getMyStatusAPI() {
270 const { data } = await api.getMyStatus() 276 const {
277 data
278 } = await api.getMyStatus()
271 if (data && data.auditStatus) { 279 if (data && data.auditStatus) {
272 auditStatus.value = data.auditStatus 280 auditStatus.value = data.auditStatus
273 } else { 281 } else {
...@@ -279,10 +287,14 @@ ...@@ -279,10 +287,14 @@
279 function onPopupOpen() { 287 function onPopupOpen() {
280 popupShow.value = true 288 popupShow.value = true
281 // 1. 小程序API锁定页面滚动 289 // 1. 小程序API锁定页面滚动
282 uni.setPageScrollEnabled({ enabled: false }) 290 uni.setPageScrollEnabled({
291 enabled: false
292 })
283 // 延时兜底（防止API生效延迟） 293 // 延时兜底（防止API生效延迟）
284 setTimeout(() => { 294 setTimeout(() => {
285 uni.setPageScrollEnabled({ enabled: false }) 295 uni.setPageScrollEnabled({
296 enabled: false
297 })
286 }, 100) 298 }, 100)
287 } 299 }
288 300
...@@ -290,9 +302,13 @@ ...@@ -290,9 +302,13 @@
290 function onPopupClose() { 302 function onPopupClose() {
291 popupShow.value = false 303 popupShow.value = false
292 // 恢复页面滚动 304 // 恢复页面滚动
293 uni.setPageScrollEnabled({ enabled: true }) 305 uni.setPageScrollEnabled({
306 enabled: true
307 })
294 setTimeout(() => { 308 setTimeout(() => {
295 uni.setPageScrollEnabled({ enabled: true }) 309 uni.setPageScrollEnabled({
310 enabled: true
311 })
296 }, 100) 312 }, 100)
297 } 313 }
298 314
...@@ -330,7 +346,7 @@ ...@@ -330,7 +346,7 @@
330 function download(url) { 346 function download(url) {
331 console.log(url) 347 console.log(url)
332 if (url.indexOf('.png') > -1 || url.indexOf('.jpg') > -1) { 348 if (url.indexOf('.png') > -1 || url.indexOf('.jpg') > -1) {
333 if(url.indexOf('http')>-1){ 349 if (url.indexOf('http') > -1) {
334 uni.previewImage({ 350 uni.previewImage({
335 urls: [url], 351 urls: [url],
336 success: function(res) {} 352 success: function(res) {}
...@@ -342,7 +358,7 @@ ...@@ -342,7 +358,7 @@
342 }) 358 })
343 } 359 }
344 } else { 360 } else {
345 if(url.indexOf('http')>-1){ 361 if (url.indexOf('http') > -1) {
346 goWebView(url) 362 goWebView(url)
347 } else { 363 } else {
348 goWebView(config.baseUrl_api + url) 364 goWebView(config.baseUrl_api + url)
...@@ -390,7 +406,7 @@ ...@@ -390,7 +406,7 @@
390 }); 406 });
391 } 407 }
392 408
393 function payTheFees(){ 409 function payTheFees() {
394 if (!form.value.name) { 410 if (!form.value.name) {
395 uni.showToast({ 411 uni.showToast({
396 title: `请先完善团体信息`, 412 title: `请先完善团体信息`,
...@@ -399,7 +415,7 @@ ...@@ -399,7 +415,7 @@
399 return; // 新增：防止无名称时跳转 415 return; // 新增：防止无名称时跳转
400 } 416 }
401 uni.navigateTo({ 417 uni.navigateTo({
402 url:`/myCenter/perfect` 418 url: `/myCenter/perfect`
403 }) 419 })
404 } 420 }
405 </script> 421 </script>
...@@ -416,7 +432,10 @@ ...@@ -416,7 +432,10 @@
416 height: 100vh !important; 432 height: 100vh !important;
417 } 433 }
418 434
419 .height1{height: 100rpx;} 435 .height1 {
436 height: 100rpx;
437 }
438
420 .photobox { 439 .photobox {
421 position: relative; 440 position: relative;
422 margin: 30rpx auto; 441 margin: 30rpx auto;
...@@ -429,6 +448,7 @@ ...@@ -429,6 +448,7 @@
429 margin: auto; 448 margin: auto;
430 } 449 }
431 } 450 }
451
432 .ylImage { 452 .ylImage {
433 width: 300rpx; 453 width: 300rpx;
434 height: 200rpx; 454 height: 200rpx;
...@@ -437,25 +457,52 @@ ...@@ -437,25 +457,52 @@
437 border-radius: 8rpx; 457 border-radius: 8rpx;
438 } 458 }
439 459
440 .photoBook{position: relative;border-radius: 10rpx; overflow: hidden; 460 .photoBook {
441 &::after{content: '';position: absolute;width: 100%;height: 100%;top: 0;left: 0; 461 position: relative;
442 background: linear-gradient(180deg,rgba(0, 0, 0, 0),rgba(0, 0, 0, 0.7)); 462 border-radius: 10rpx;
463 overflow: hidden;
464
465 &::after {
466 content: '';
467 position: absolute;
468 width: 100%;
469 height: 100%;
470 top: 0;
471 left: 0;
472 background: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7));
443 } 473 }
444 text{ position: absolute;z-index: 1; 474
475 text {
476 position: absolute;
477 z-index: 1;
445 font-size: 24rpx; 478 font-size: 24rpx;
446 color: #fff; 479 color: #fff;
447 bottom: 4rpx; 480 bottom: 4rpx;
448 right: 8rpx;} 481 right: 8rpx;
449 } 482 }
450 .frrr{width: 100%;text-align: right; 483 }
484
485 .frrr {
486 width: 100%;
487 text-align: right;
451 text-align: right; 488 text-align: right;
452 display: flex; 489 display: flex;
453 flex-wrap: wrap; 490 flex-wrap: wrap;
454 justify-content: flex-end;} 491 justify-content: flex-end;
455 :deep(.selected-list){font-size: 32rpx;padding: 0;} 492 }
456 :deep(.input-value){padding: 0;} 493
494 :deep(.selected-list) {
495 font-size: 32rpx;
496 padding: 0;
497 }
498
499 :deep(.input-value) {
500 padding: 0;
501 }
502
457 :deep(.uni-list-item__extra-text) { 503 :deep(.uni-list-item__extra-text) {
458 font-size: 32rpx;color: #000; 504 font-size: 32rpx;
505 color: #000;
459 } 506 }
460 507
461 :deep(.uni-list-item__extra) { 508 :deep(.uni-list-item__extra) {
...@@ -479,6 +526,7 @@ ...@@ -479,6 +526,7 @@
479 .mainbox { 526 .mainbox {
480 margin: 30rpx; 527 margin: 30rpx;
481 } 528 }
529
482 .apply-dialog { 530 .apply-dialog {
483 width: 530rpx; 531 width: 530rpx;
484 background: #fff; 532 background: #fff;
...@@ -487,25 +535,30 @@ ...@@ -487,25 +535,30 @@
487 // 新增：禁止弹窗内部滚动 535 // 新增：禁止弹窗内部滚动
488 touch-action: none; 536 touch-action: none;
489 } 537 }
538
490 .dialog-title { 539 .dialog-title {
491 font-size: 32rpx; 540 font-size: 32rpx;
492 font-weight: bold; 541 font-weight: bold;
493 text-align: center; 542 text-align: center;
494 margin-bottom: 30rpx; 543 margin-bottom: 30rpx;
495 } 544 }
545
496 .dialog-content { 546 .dialog-content {
497 margin: 40rpx; 547 margin: 40rpx;
498 } 548 }
549
499 .remind { 550 .remind {
500 color: #FF8124; 551 color: #FF8124;
501 font-size: 26rpx; 552 font-size: 26rpx;
502 margin-top: 40rpx; 553 margin-top: 40rpx;
503 } 554 }
555
504 .dialog-buttons { 556 .dialog-buttons {
505 display: flex; 557 display: flex;
506 justify-content: space-between; 558 justify-content: space-between;
507 margin-top: 40rpx; 559 margin-top: 40rpx;
508 } 560 }
561
509 .btn-cancel { 562 .btn-cancel {
510 width: 225rpx; 563 width: 225rpx;
511 height: 80rpx; 564 height: 80rpx;
...@@ -517,6 +570,7 @@ ...@@ -517,6 +570,7 @@
517 text-align: center; 570 text-align: center;
518 font-size: 14px; 571 font-size: 14px;
519 } 572 }
573
520 .btn-confirm { 574 .btn-confirm {
521 width: 225rpx; 575 width: 225rpx;
522 height: 80rpx; 576 height: 80rpx;
......
myCenter/goPay.vue
...@@ -5,11 +5,13 @@ ...@@ -5,11 +5,13 @@
5 <view class="yearRow"> 5 <view class="yearRow">
6 <view class="label">缴费年限</view> 6 <view class="label">缴费年限</view>
7 <view class="control"> 7 <view class="control">
8 <image class="icon" @click="minusYear" src="/static/dd_02.png" mode="widthFix" v-if="form.renewYear > 1" ></image> 8 <image class="icon" @click="minusYear" src="/static/dd_02.png" mode="widthFix"
9 <image class="icon" src="/static/dd_02_g.png" mode="widthFix" v-else ></image> 9 v-if="form.renewYear > 1"></image>
10 <image class="icon" src="/static/dd_02_g.png" mode="widthFix" v-else></image>
10 <text class="num">{{ form.renewYear }}年</text> 11 <text class="num">{{ form.renewYear }}年</text>
11 <image class="icon" src="/static/btn_03.png" mode="widthFix" @click="plusYear" v-if="form.renewYear < 5" ></image> 12 <image class="icon" src="/static/btn_03.png" mode="widthFix" @click="plusYear"
12 <image class="icon" src="/static/btn_03_g.png" mode="widthFix" v-else ></image> 13 v-if="form.renewYear < 5"></image>
14 <image class="icon" src="/static/btn_03_g.png" mode="widthFix" v-else></image>
13 </view> 15 </view>
14 </view> 16 </view>
15 </view> 17 </view>
...@@ -18,11 +20,12 @@ ...@@ -18,11 +20,12 @@
18 <!-- 费用合计 --> 20 <!-- 费用合计 -->
19 <view class="row "> 21 <view class="row ">
20 <text class="label">费用合计</text> 22 <text class="label">费用合计</text>
21 <text class="value red">{{ form.renewYear * memberFee }}元</text> 23 <text class="value red">{{ (form.renewYear * memberFee).toFixed(2) }}元</text>
22 </view> 24 </view>
23 25
24 <view class="hintRow" v-if="preferentialPolicy"> 26 <view class="hintRow" v-if="preferentialPolicy">
25 <text class="hintText">温馨提示：根据中国跆协{{ preferentialData.name || '优惠' }}政策减免一年费用，每个单位在政策有效期内只享受一次</text> 27 <text
28 class="hintText">温馨提示：根据中国跆协{{ preferentialData.name || '优惠' }}政策减免一年费用，每个单位在政策有效期内只享受一次</text>
26 </view> 29 </view>
27 </view> 30 </view>
28 31
...@@ -48,7 +51,7 @@ ...@@ -48,7 +51,7 @@
48 <view class="bottomBtn"> 51 <view class="bottomBtn">
49 <view class="deductRow"> 52 <view class="deductRow">
50 <text class="label">减免费用</text> 53 <text class="label">减免费用</text>
51 <text class="value red">-{{ memberFee }}元</text> 54 <text class="value red">-{{ memberFee.toFixed(2) }}元</text>
52 </view> 55 </view>
53 <button class="payBtn" @click="handelPay" :loading="isPaying">立即支付 ¥{{ memberTotalFee }}</button> 56 <button class="payBtn" @click="handelPay" :loading="isPaying">立即支付 ¥{{ memberTotalFee }}</button>
54 </view> 57 </view>
...@@ -57,148 +60,198 @@ ...@@ -57,148 +60,198 @@
57 </template> 60 </template>
58 61
59 <script setup> 62 <script setup>
60 import { ref, computed } from 'vue' 63 import {
61 import { onLoad } from '@dcloudio/uni-app'; 64 ref,
62 import * as api from '@/common/api.js' 65 computed
63 66 } from 'vue'
64 const form = ref({ 67 import {
68 onLoad
69 } from '@dcloudio/uni-app';
70 import to from 'await-to-js'
71 import * as api from '@/common/api.js'
72
73 const form = ref({
65 renewYear: 1 74 renewYear: 1
66 }) 75 })
67 const memberFee = ref(0) 76 const memberFee = ref(0)
68 const preferentialPolicy = ref(false) 77 const preferentialPolicy = ref(false)
69 const preferentialData = ref({ name: '优惠' }) 78 const preferentialData = ref({
70 const payType = ref('1') 79 name: '优惠'
71 const isPaying = ref(false) 80 })
72 81 const payType = ref('1')
73 const memberTotalFee = computed(() => { 82 const isPaying = ref(false)
83
84 const memberTotalFee = computed(() => {
74 if (preferentialPolicy.value) { 85 if (preferentialPolicy.value) {
75 return memberFee.value * form.value.renewYear - memberFee.value * 1 86 return (memberFee.value * form.value.renewYear - memberFee.value * 1).toFixed(2)
76 } else { 87 } else {
77 return memberFee.value * form.value.renewYear 88 return (memberFee.value * form.value.renewYear).toFixed(2)
78 } 89 }
79 }) 90 })
80 91
81 // 年限减 92 // 年限减
82 const minusYear = () => { 93 const minusYear = () => {
83 if (form.value.renewYear > 1) { 94 if (form.value.renewYear > 1) {
84 form.value.renewYear-- 95 form.value.renewYear--
85 } 96 }
86 } 97 }
87 // 年限加 98 // 年限加
88 const plusYear = () => { 99 const plusYear = () => {
89 if (form.value.renewYear < 6) { 100 if (form.value.renewYear < 6) {
90 form.value.renewYear++ 101 form.value.renewYear++
91 } 102 }
92 } 103 }
93 104
94 // 支付方式切换 105 // 支付方式切换
95 const onPayTypeChange = (e) => { 106 const onPayTypeChange = (e) => {
96 payType.value = e.detail.value 107 payType.value = e.detail.value
97 } 108 }
98 109
99 // 支付操作 110 // 支付操作
100 const handelPay = async () => { 111 const handelPay = async () => {
101 // if (memberTotalFee.value <= 0) return 112 if (memberTotalFee.value < 0) {
113 uni.showToast({
114 title: '支付金额异常',
115 icon: 'none'
116 })
117 return
118 }
102 119
120 // 显示 loading
121 uni.showLoading({
122 title: '支付中...',
123 mask: true
124 })
103 isPaying.value = true 125 isPaying.value = true
104 const { data } = await api.certifiedNew({ renewYear: form.value.renewYear }) 126
127 // 创建订单
128 const [orderErr, orderRes] = await to(api.certifiedNew(form.value.renewYear))
129 if (orderErr) {
130 uni.hideLoading()
105 isPaying.value = false 131 isPaying.value = false
132 uni.showToast({
133 title: '创建订单失败',
134 icon: 'none'
135 })
136 return
137 }
138
139 const data = orderRes.data
140 // 无需支付，直接成功
106 if (data.payFlag == 0) { 141 if (data.payFlag == 0) {
142 uni.hideLoading()
143 isPaying.value = false
107 uni.navigateTo({ 144 uni.navigateTo({
108 url: `/myCenter/sucPay` 145 url: `/myCenter/sucPay?orderId=${data.orderId}`
109 }) 146 })
110 } else { 147 return
148 }
149
150 // 需要支付回调
111 if (data.orderId) { 151 if (data.orderId) {
112 api.callBack2(data.orderId) 152 await to(api.callBack2(data.orderId))
153 uni.hideLoading()
154 isPaying.value = false
155
113 uni.navigateTo({ 156 uni.navigateTo({
114 url: `/myCenter/sucPay` 157 url: `/myCenter/sucPay?orderId=${data.orderId}`
115 }) 158 })
116
117 } 159 }
118 } 160 }
119 }
120 161
121 onLoad((option) => { 162 onLoad((option) => {
122 // 接收年限 163 // 接收年限
123 form.value.renewYear = Number(option.renewYear || 1) 164 form.value.renewYear = Number(option.renewYear || 1)
124 // 初始化获取费用和优惠 165 // 初始化获取费用和优惠
125 init() 166 init()
126 }) 167 })
127 168
128 // 初始化接口 169 // 初始化接口
129 async function init() { 170 async function init() {
130 try { 171 uni.showLoading({
131 await getMyMemberCertUnitFeeApi() 172 title: '加载中...'
132 await canUseDiscountApi() 173 })
133 await getZtxDiscountPolicyApi() 174 const [err] = await to(Promise.all([
134 } catch (err) { 175 getMyMemberCertUnitFeeApi(),
176 canUseDiscountApi(),
177 getZtxDiscountPolicyApi()
178 ]))
179 uni.hideLoading()
180 if (err) {
135 console.error('初始化失败：', err) 181 console.error('初始化失败：', err)
136 } 182 }
137 } 183 }
138 184
139 // 获取会员单价 185 // 获取会员单价
140 async function getMyMemberCertUnitFeeApi() { 186 async function getMyMemberCertUnitFeeApi() {
141 const res = await api.getMyMemberCertUnitFee() 187 const [err, res] = await to(api.getMyMemberCertUnitFee())
188 if (!err && res.data) {
142 memberFee.value = Number(res.data || 1500) 189 memberFee.value = Number(res.data || 1500)
143 } 190 }
144 191 }
145 // 是否可用优惠 192
146 async function canUseDiscountApi() { 193 // 是否可用优惠
147 const res = await api.canUseDiscount() 194 async function canUseDiscountApi() {
148 preferentialPolicy.value = res.data || true 195 const [err, res] = await to(api.canUseDiscount())
149 } 196 if (!err && res.data !== undefined) {
150 197 preferentialPolicy.value = res.data
151 // 获取优惠政策详情 198 }
152 async function getZtxDiscountPolicyApi() { 199 }
153 const res = await api.getZtxDiscountPolicy() 200
154 preferentialData.value = res.data || { name: '优惠' } 201 // 获取优惠政策详情
155 } 202 async function getZtxDiscountPolicyApi() {
203 const [err, res] = await to(api.getZtxDiscountPolicy())
204 if (!err && res.data) {
205 preferentialData.value = res.data
206 }
207 }
156 </script> 208 </script>
157 209
158 <style scoped> 210 <style scoped>
159 /* 整体容器 */ 211 /* 整体容器 */
160 .container { 212 .container {
161 min-height: 100vh; 213 min-height: 100vh;
162 background-color: #f7f7f7; 214 background-color: #f7f7f7;
163 } 215 }
164 216
165 /* 内容区域 */ 217 /* 内容区域 */
166 .content { 218 .content {
167 padding: 20rpx 20rpx 120rpx; 219 padding: 20rpx 20rpx 120rpx;
168 } 220 }
169 221
170 /* 卡片 */ 222 /* 卡片 */
171 .card { 223 .card {
172 background: #fff; 224 background: #fff;
173 border-radius: 8rpx; 225 border-radius: 8rpx;
174 padding: 25rpx 20rpx; 226 padding: 25rpx 20rpx;
175 margin-bottom: 20rpx; 227 margin-bottom: 20rpx;
176 } 228 }
177 229
178 /* 缴费年限行 */ 230 /* 缴费年限行 */
179 .yearRow { 231 .yearRow {
180 display: flex; 232 display: flex;
181 align-items: center; 233 align-items: center;
182 justify-content: space-between; 234 justify-content: space-between;
183 margin-bottom: 20rpx; 235 margin-bottom: 20rpx;
184 } 236 }
185 237
186 .yearRow .label { 238 .yearRow .label {
187 font-size: 28rpx; 239 font-size: 28rpx;
188 color: #333; 240 color: #333;
189 } 241 }
190 242
191 .yearRow .control { 243 .yearRow .control {
192 display: flex; 244 display: flex;
193 align-items: center; 245 align-items: center;
194 } 246 }
195 .control image { 247
248 .control image {
196 width: 50rpx; 249 width: 50rpx;
197 height: 50rpx; 250 height: 50rpx;
198 } 251 }
199 252
200 /* 加减按钮样式 */ 253 /* 加减按钮样式 */
201 .num-btn { 254 .num-btn {
202 width: 40rpx; 255 width: 40rpx;
203 height: 40rpx; 256 height: 40rpx;
204 border-radius: 50%; 257 border-radius: 50%;
...@@ -207,59 +260,59 @@ async function getZtxDiscountPolicyApi() { ...@@ -207,59 +260,59 @@ async function getZtxDiscountPolicyApi() {
207 justify-content: center; 260 justify-content: center;
208 background-color: #fff; 261 background-color: #fff;
209 border: 1rpx solid #C4121B; 262 border: 1rpx solid #C4121B;
210 } 263 }
211 264
212 .num-btn.disabled { 265 .num-btn.disabled {
213 border-color: #ccc; 266 border-color: #ccc;
214 } 267 }
215 268
216 .num-btn.disabled .btn-icon { 269 .num-btn.disabled .btn-icon {
217 color: #ccc; 270 color: #ccc;
218 } 271 }
219 272
220 .btn-icon { 273 .btn-icon {
221 font-size: 24rpx; 274 font-size: 24rpx;
222 color: #C4121B; 275 color: #C4121B;
223 font-weight: bold; 276 font-weight: bold;
224 } 277 }
225 278
226 .yearRow .num { 279 .yearRow .num {
227 font-size: 28rpx; 280 font-size: 28rpx;
228 color: #333; 281 color: #333;
229 min-width: 80rpx; 282 min-width: 80rpx;
230 text-align: center; 283 text-align: center;
231 margin: 0 10rpx; 284 margin: 0 10rpx;
232 } 285 }
233 286
234 287
235 /* 通用行 */ 288 /* 通用行 */
236 .row { 289 .row {
237 display: flex; 290 display: flex;
238 justify-content: space-between; 291 justify-content: space-between;
239 align-items: center; 292 align-items: center;
240 293
241 } 294 }
242 295
243 .row .label { 296 .row .label {
244 font-size: 28rpx; 297 font-size: 28rpx;
245 color: #333; 298 color: #333;
246 } 299 }
247 300
248 .row .value { 301 .row .value {
249 font-size: 30rpx; 302 font-size: 30rpx;
250 color: #C4121B; 303 color: #C4121B;
251 font-weight: 500; 304 font-weight: 500;
252 } 305 }
253 306
254 /* 优惠提示 */ 307 /* 优惠提示 */
255 .hintRow { 308 .hintRow {
256 display: flex; 309 display: flex;
257 align-items: flex-start; 310 align-items: flex-start;
258 font-size: 24rpx; 311 font-size: 24rpx;
259 line-height: 1.4; 312 line-height: 1.4;
260 } 313 }
261 314
262 .hint-icon { 315 .hint-icon {
263 width: 24rpx; 316 width: 24rpx;
264 height: 24rpx; 317 height: 24rpx;
265 border-radius: 50%; 318 border-radius: 50%;
...@@ -270,24 +323,25 @@ async function getZtxDiscountPolicyApi() { ...@@ -270,24 +323,25 @@ async function getZtxDiscountPolicyApi() {
270 margin-right: 10rpx; 323 margin-right: 10rpx;
271 flex-shrink: 0; 324 flex-shrink: 0;
272 margin-top: 2rpx; 325 margin-top: 2rpx;
273 } 326 }
274 .icon{ 327
275 width:30px; 328 .icon {
276 } 329 width: 30px;
330 }
277 331
278 .icon-check { 332 .icon-check {
279 color: #fff; 333 color: #fff;
280 font-size: 16rpx; 334 font-size: 16rpx;
281 } 335 }
282 336
283 .hintRow .hintText { 337 .hintRow .hintText {
284 color: #FF8124; 338 color: #FF8124;
285 flex: 1; 339 flex: 1;
286 margin-top: 10rpx; 340 margin-top: 10rpx;
287 } 341 }
288 342
289 /* 减免费用 */ 343 /* 减免费用 */
290 .deductRow { 344 .deductRow {
291 background: #fff; 345 background: #fff;
292 padding: 20rpx 20rpx; 346 padding: 20rpx 20rpx;
293 display: flex; 347 display: flex;
...@@ -295,64 +349,64 @@ async function getZtxDiscountPolicyApi() { ...@@ -295,64 +349,64 @@ async function getZtxDiscountPolicyApi() {
295 align-items: center; 349 align-items: center;
296 margin-bottom: 10rpx; 350 margin-bottom: 10rpx;
297 border-radius: 8rpx; 351 border-radius: 8rpx;
298 } 352 }
299 353
300 .deductRow .label { 354 .deductRow .label {
301 font-size: 28rpx; 355 font-size: 28rpx;
302 color: #333; 356 color: #333;
303 } 357 }
304 358
305 .deductRow .value { 359 .deductRow .value {
306 font-size: 30rpx; 360 font-size: 30rpx;
307 color: #C4121B; 361 color: #C4121B;
308 } 362 }
309 363
310 /* 支付方式行 */ 364 /* 支付方式行 */
311 .payRow { 365 .payRow {
312 background: #fff; 366 background: #fff;
313 border-radius: 8rpx; 367 border-radius: 8rpx;
314 padding: 20rpx 20rpx; 368 padding: 20rpx 20rpx;
315 margin-bottom: 20rpx; 369 margin-bottom: 20rpx;
316 } 370 }
317 371
318 .radioItem { 372 .radioItem {
319 display: flex; 373 display: flex;
320 align-items: center; 374 align-items: center;
321 } 375 }
322 376
323 /* 自定义红色单选框 */ 377 /* 自定义红色单选框 */
324 ::v-deep .custom-radio .wx-radio-input { 378 ::v-deep .custom-radio .wx-radio-input {
325 width: 30rpx; 379 width: 30rpx;
326 height: 30rpx; 380 height: 30rpx;
327 border-radius: 50%; 381 border-radius: 50%;
328 border: 2rpx solid #ccc; 382 border: 2rpx solid #ccc;
329 } 383 }
330 384
331 ::v-deep .custom-radio .wx-radio-input.wx-radio-input-checked { 385 ::v-deep .custom-radio .wx-radio-input.wx-radio-input-checked {
332 border-color: #C4121B !important; 386 border-color: #C4121B !important;
333 background: #C4121B !important; 387 background: #C4121B !important;
334 } 388 }
335 389
336 390
337 .payInfo { 391 .payInfo {
338 display: flex; 392 display: flex;
339 align-items: center; 393 align-items: center;
340 margin-left: 15rpx; 394 margin-left: 15rpx;
341 } 395 }
342 396
343 .payInfo .icon { 397 .payInfo .icon {
344 width: 40rpx; 398 width: 40rpx;
345 height: 40rpx; 399 height: 40rpx;
346 margin-right: 10rpx; 400 margin-right: 10rpx;
347 } 401 }
348 402
349 .payInfo text { 403 .payInfo text {
350 font-size: 28rpx; 404 font-size: 28rpx;
351 color: #333; 405 color: #333;
352 } 406 }
353 407
354 /* 总费用行（突出显示） */ 408 /* 总费用行（突出显示） */
355 .totalRow { 409 .totalRow {
356 background: #fff; 410 background: #fff;
357 border-radius: 8rpx; 411 border-radius: 8rpx;
358 padding: 20rpx 20rpx; 412 padding: 20rpx 20rpx;
...@@ -360,21 +414,21 @@ async function getZtxDiscountPolicyApi() { ...@@ -360,21 +414,21 @@ async function getZtxDiscountPolicyApi() {
360 justify-content: space-between; 414 justify-content: space-between;
361 align-items: center; 415 align-items: center;
362 margin-top: 10rpx; 416 margin-top: 10rpx;
363 } 417 }
364 418
365 .totalRow .label { 419 .totalRow .label {
366 font-size: 28rpx; 420 font-size: 28rpx;
367 color: #333; 421 color: #333;
368 } 422 }
369 423
370 .redBig { 424 .redBig {
371 font-size: 32rpx; 425 font-size: 32rpx;
372 color: #C4121B; 426 color: #C4121B;
373 font-weight: bold; 427 font-weight: bold;
374 } 428 }
375 429
376 /* 底部按钮 */ 430 /* 底部按钮 */
377 .bottomBtn { 431 .bottomBtn {
378 position: fixed; 432 position: fixed;
379 bottom: 0; 433 bottom: 0;
380 left: 0; 434 left: 0;
...@@ -382,9 +436,9 @@ async function getZtxDiscountPolicyApi() { ...@@ -382,9 +436,9 @@ async function getZtxDiscountPolicyApi() {
382 padding: 20rpx 20rpx; 436 padding: 20rpx 20rpx;
383 background: #fff; 437 background: #fff;
384 border-top: 1rpx solid #eee; 438 border-top: 1rpx solid #eee;
385 } 439 }
386 440
387 .payBtn { 441 .payBtn {
388 width: 100%; 442 width: 100%;
389 height: 88rpx; 443 height: 88rpx;
390 line-height: 88rpx; 444 line-height: 88rpx;
...@@ -394,15 +448,15 @@ async function getZtxDiscountPolicyApi() { ...@@ -394,15 +448,15 @@ async function getZtxDiscountPolicyApi() {
394 font-size: 32rpx; 448 font-size: 32rpx;
395 text-align: center; 449 text-align: center;
396 border: none; 450 border: none;
397 } 451 }
398 452
399 .payBtn[disabled] { 453 .payBtn[disabled] {
400 background-color: #ccc; 454 background-color: #ccc;
401 color: #999; 455 color: #999;
402 } 456 }
403 457
404 /* 通用红色文字 */ 458 /* 通用红色文字 */
405 .red { 459 .red {
406 color: #C4121B; 460 color: #C4121B;
407 } 461 }
408 </style> 462 </style>
...\ No newline at end of file ...\ No newline at end of file
......
myCenter/sucPay.vue
...@@ -14,28 +14,16 @@ ...@@ -14,28 +14,16 @@
14 <!-- 订单信息卡片（带阴影） --> 14 <!-- 订单信息卡片（带阴影） -->
15 <view class="info-card"> 15 <view class="info-card">
16 <view class="info-item"> 16 <view class="info-item">
17 <text class="label">付款账户</text>
18 <text class="value">(5437)</text>
19 </view>
20 <view class="info-item">
21 <text class="label">交易流水号</text> 17 <text class="label">交易流水号</text>
22 <text class="value">2205051351076117833</text> 18 <text class="value">{{ orderInfo.tradeNo || '--' }}</text>
23 </view> 19 </view>
24 <view class="info-item"> 20 <view class="info-item">
25 <text class="label">商户名称</text> 21 <text class="label">商户名称</text>
26 <text class="value">中国跆拳道协会</text> 22 <text class="value">{{ orderInfo.merchantName|| '中国跆拳道协会' }}</text>
27 </view> 23 </view>
28 <view class="info-item"> 24 <view class="info-item">
29 <text class="label">订单金额</text> 25 <text class="label">订单金额</text>
30 <text class="value amount">1500.00元</text> 26 <text class="value amount">{{ orderInfo.price ? orderInfo.price + '元' : '--' }}</text>
31 </view>
32 <view class="info-item">
33 <text class="label">会员编号</text>
34 <text class="value">CTA00004</text>
35 </view>
36 <view class="info-item">
37 <text class="label">会员有效期</text>
38 <text class="value">2028年1月25日</text>
39 </view> 27 </view>
40 </view> 28 </view>
41 29
...@@ -47,30 +35,43 @@ ...@@ -47,30 +35,43 @@
47 </template> 35 </template>
48 36
49 <script setup> 37 <script setup>
50 import { onLoad } from '@dcloudio/uni-app' 38 import {
51 const goBack = () => { 39 ref
52 const pages = getCurrentPages() 40 } from 'vue'
53 const currentPage = pages[pages.length - 1] 41 import {
54 const { from } = currentPage.options || {} 42 onLoad
55 43 } from '@dcloudio/uni-app'
56 let delta = 1 44 import to from 'await-to-js'
57 45 import * as api from '@/common/api.js'
58 if (from === 'payOrder') { 46
59 delta = 2 // 来自添加会员 / 订单页 → 返回 2 级 47 const orderInfo = ref({
60 }else{ 48 orderId: '',
61 delta = 3 49 tradeNo: '',
50 merchantName: '中国跆拳道协会',
51 price: ''
52 })
53
54 const goBack = () => {
55 uni.reLaunch({
56 url: '/myCenter/auth'
57 })
62 } 58 }
63 59
64 uni.navigateBack({ delta }) 60 onLoad(async (option) => {
65 } 61 if (option.orderId) {
66 62 const [err, res] = await to(api.getOrderInfo(option.orderId))
67 onLoad((option) => { 63 if (!err && res.data) {
68 }) 64 orderInfo.value = res.data
65 } else {
66 orderInfo.value.orderId = option.orderId
67 }
68 }
69 })
69 </script> 70 </script>
70 71
71 <style scoped> 72 <style scoped>
72 /* 全局容器 */ 73 /* 全局容器 */
73 .success-container { 74 .success-container {
74 display: flex; 75 display: flex;
75 flex-direction: column; 76 flex-direction: column;
76 align-items: center; 77 align-items: center;
...@@ -78,16 +79,16 @@ onLoad((option) => { ...@@ -78,16 +79,16 @@ onLoad((option) => {
78 min-height: 100vh; 79 min-height: 100vh;
79 background-color: #f8f9fa; 80 background-color: #f8f9fa;
80 box-sizing: border-box; 81 box-sizing: border-box;
81 } 82 }
82 83
83 /* 成功图标容器 */ 84 /* 成功图标容器 */
84 .success-icon { 85 .success-icon {
85 margin-bottom: 40rpx; 86 margin-bottom: 40rpx;
86 animation: fadeIn 0.6s ease-out; 87 animation: fadeIn 0.6s ease-out;
87 } 88 }
88 89
89 /* 渐变圆形背景 */ 90 /* 渐变圆形背景 */
90 .icon-circle { 91 .icon-circle {
91 width: 180rpx; 92 width: 180rpx;
92 height: 180rpx; 93 height: 180rpx;
93 border-radius: 50%; 94 border-radius: 50%;
...@@ -99,34 +100,34 @@ onLoad((option) => { ...@@ -99,34 +100,34 @@ onLoad((option) => {
99 box-shadow: 0 8rpx 30rpx rgba(6, 193, 174, 0.3); 100 box-shadow: 0 8rpx 30rpx rgba(6, 193, 174, 0.3);
100 /* 轻微上浮动效 */ 101 /* 轻微上浮动效 */
101 animation: scaleIn 0.8s ease-out; 102 animation: scaleIn 0.8s ease-out;
102 } 103 }
103 104
104 /* 对勾图标 */ 105 /* 对勾图标 */
105 .check-icon { 106 .check-icon {
106 font-size: 90rpx; 107 font-size: 90rpx;
107 color: #ffffff; 108 color: #ffffff;
108 font-weight: bold; 109 font-weight: bold;
109 } 110 }
110 111
111 /* 支付成功标题 */ 112 /* 支付成功标题 */
112 .success-title { 113 .success-title {
113 font-size: 48rpx; 114 font-size: 48rpx;
114 font-weight: 700; 115 font-weight: 700;
115 color: #333333; 116 color: #333333;
116 margin-bottom: 12rpx; 117 margin-bottom: 12rpx;
117 animation: slideUp 0.6s ease-out; 118 animation: slideUp 0.6s ease-out;
118 } 119 }
119 120
120 /* 副标题 */ 121 /* 副标题 */
121 .success-subtitle { 122 .success-subtitle {
122 font-size: 28rpx; 123 font-size: 28rpx;
123 color: #666666; 124 color: #666666;
124 margin-bottom: 60rpx; 125 margin-bottom: 60rpx;
125 animation: slideUp 0.8s ease-out; 126 animation: slideUp 0.8s ease-out;
126 } 127 }
127 128
128 /* 订单信息卡片 */ 129 /* 订单信息卡片 */
129 .info-card { 130 .info-card {
130 width: 100%; 131 width: 100%;
131 background: #ffffff; 132 background: #ffffff;
132 border-radius: 20rpx; 133 border-radius: 20rpx;
...@@ -134,48 +135,55 @@ onLoad((option) => { ...@@ -134,48 +135,55 @@ onLoad((option) => {
134 box-shadow: 0 6rpx 20rpx rgba(0, 0, 0, 0.05); 135 box-shadow: 0 6rpx 20rpx rgba(0, 0, 0, 0.05);
135 margin-bottom: 80rpx; 136 margin-bottom: 80rpx;
136 animation: fadeIn 1s ease-out; 137 animation: fadeIn 1s ease-out;
137 } 138 }
138 139
139 /* 单个信息项 */ 140 /* 单个信息项 */
140 .info-item { 141 .info-item {
141 display: flex; 142 display: flex;
142 justify-content: space-between; 143 justify-content: space-between;
143 align-items: center; 144 align-items: center;
144 padding: 24rpx 0; 145 padding: 24rpx 0;
145 border-bottom: 1rpx solid #f5f5f5; 146 border-bottom: 1rpx solid #f5f5f5;
146 } 147 }
147 /* 最后一项去掉下划线 */ 148
148 .info-item:last-child { 149 /* 最后一项去掉下划线 */
150 .info-item:last-child {
149 border-bottom: none; 151 border-bottom: none;
150 } 152 }
151 153
152 /* 标签样式 */ 154 /* 标签样式 */
153 .label { 155 .label {
154 font-size: 32rpx; 156 font-size: 32rpx;
155 color: #666666; 157 color: #666666;
156 } 158 white-space: nowrap;
159 margin-right: 20rpx;
160 flex-shrink: 0;
161 }
157 162
158 /* 值样式 */ 163 /* 值样式 */
159 .value { 164 .value {
160 font-size: 32rpx; 165 font-size: 32rpx;
161 color: #333333; 166 color: #333333;
162 text-align: right; 167 text-align: right;
163 } 168 word-break: break-all;
164 /* 金额特殊样式 */ 169 word-wrap: break-word;
165 .amount { 170 }
171
172 /* 金额特殊样式 */
173 .amount {
166 color: #cd1e27; 174 color: #cd1e27;
167 font-weight: 600; 175 font-weight: 600;
168 } 176 }
169 177
170 /* 确定按钮区域 */ 178 /* 确定按钮区域 */
171 .confirm-btn-area { 179 .confirm-btn-area {
172 width: 100%; 180 width: 100%;
173 padding: 0 20rpx; 181 padding: 0 20rpx;
174 box-sizing: border-box; 182 box-sizing: border-box;
175 } 183 }
176 184
177 /* 确定按钮（渐变+动效） */ 185 /* 确定按钮（渐变+动效） */
178 .confirm-btn { 186 .confirm-btn {
179 width: 100%; 187 width: 100%;
180 height: 90rpx; 188 height: 90rpx;
181 line-height: 90rpx; 189 line-height: 90rpx;
...@@ -190,28 +198,52 @@ onLoad((option) => { ...@@ -190,28 +198,52 @@ onLoad((option) => {
190 /* 禁止默认样式 */ 198 /* 禁止默认样式 */
191 position: relative; 199 position: relative;
192 overflow: hidden; 200 overflow: hidden;
193 } 201 }
194 /* 按钮点击反馈 */ 202
195 .confirm-btn::after { 203 /* 按钮点击反馈 */
204 .confirm-btn::after {
196 border: none; 205 border: none;
197 } 206 }
198 .confirm-btn:active { 207
208 .confirm-btn:active {
199 transform: scale(0.98); 209 transform: scale(0.98);
200 box-shadow: 0 4rpx 10rpx rgba(6, 193, 174, 0.2); 210 box-shadow: 0 4rpx 10rpx rgba(6, 193, 174, 0.2);
201 } 211 }
202 212
203 /* 动画定义 */ 213 /* 动画定义 */
204 @keyframes fadeIn { 214 @keyframes fadeIn {
205 0% { opacity: 0; } 215 0% {
206 100% { opacity: 1; } 216 opacity: 0;
207 } 217 }
208 @keyframes scaleIn { 218
209 0% { transform: scale(0); } 219 100% {
210 70% { transform: scale(1.1); } 220 opacity: 1;
211 100% { transform: scale(1); } 221 }
212 } 222 }
213 @keyframes slideUp { 223
214 0% { opacity: 0; transform: translateY(30rpx); } 224 @keyframes scaleIn {
215 100% { opacity: 1; transform: translateY(0); } 225 0% {
216 } 226 transform: scale(0);
227 }
228
229 70% {
230 transform: scale(1.1);
231 }
232
233 100% {
234 transform: scale(1);
235 }
236 }
237
238 @keyframes slideUp {
239 0% {
240 opacity: 0;
241 transform: translateY(30rpx);
242 }
243
244 100% {
245 opacity: 1;
246 transform: translateY(0);
247 }
248 }
217 </style> 249 </style>
...\ No newline at end of file ...\ No newline at end of file
......
personal/sucPay.vue
...@@ -15,7 +15,7 @@ ...@@ -15,7 +15,7 @@
15 <view class="info-card"> 15 <view class="info-card">
16 <view class="info-item"> 16 <view class="info-item">
17 <text class="label">交易流水号</text> 17 <text class="label">交易流水号</text>
18 <text class="value">{{ orderInfo.tradeNo }}</text> 18 <text class="value">{{ orderInfo.tradeNo||'--' }}</text>
19 </view> 19 </view>
20 <view class="info-item"> 20 <view class="info-item">
21 <text class="label">商户名称</text> 21 <text class="label">商户名称</text>
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!