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
Expand all
Inline Side-by-side
Showing 7 changed files with 315 additions and 272 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 onLaunch: function(options) { 11 globalData: {
12 console.log('App Launch', options); 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 },
23 onLaunch: function(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(() => {
19 this.globalData.isLogin = true; 31 this.globalData.isLogin = true;
20 firstload = true 32 firstload = true
21 let firstLoadCallback = getApp().firstLoadCallback; 33 let firstLoadCallback = getApp().firstLoadCallback;
22 if (firstLoadCallback) { 34 if (firstLoadCallback) {
23 firstLoadCallback(); 35 firstLoadCallback();
24 } 36 }
25 }).catch(() => { 37 }).catch(() => {
26 firstload = true 38 firstload = true
27 uni.redirectTo({ 39 uni.redirectTo({
28 url: '/login/login' 40 url: '/login/login'
29 }) 41 })
30 }) 42 })
31 } else { 43 } else {
32 this.globalData.isLogin = false; 44 this.globalData.isLogin = false;
33 firstload = true 45 firstload = true
34 uni.redirectTo({ 46 uni.redirectTo({
35 url: '/login/login' 47 url: '/login/login'
36 }) 48 })
37 } 49 }
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,11 +5,11 @@ ...@@ -5,11 +5,11 @@
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
12 // const baseUrl_api = 'https://system.taekwondo.org.cn/stage-api' 12 // const baseUrl_api = 'https://system.taekwondo.org.cn/stage-api'
13 export default { 13 export default {
14 baseUrl_api 14 baseUrl_api
15 } 15 }
...\ No newline at end of file ...\ No newline at end of file
......
myCenter/sucPay.vue
1 <template> 1 <template>
2 <view class="success-container"> 2 <view class="success-container">
3 <!-- 成功图标（渐变圆形+动效） --> 3 <!-- 成功图标（渐变圆形+动效） -->
4 <view class="success-icon"> 4 <view class="success-icon">
5 <view class="icon-circle"> 5 <view class="icon-circle">
6 <text class="check-icon">✓</text> 6 <text class="check-icon">✓</text>
7 </view> 7 </view>
8 </view> 8 </view>
9 9
10 <!-- 支付成功标题（动画） --> 10 <!-- 支付成功标题（动画） -->
11 <view class="success-title">支付成功</view> 11 <view class="success-title">支付成功</view>
12 <view class="success-subtitle">支付成功，请等待审核</view> 12 <view class="success-subtitle">支付成功，请等待审核</view>
13 13
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> 17 <text class="label">交易流水号</text>
18 <text class="value">(5437)</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>
22 <text class="value">2205051351076117833</text> 22 <text class="value">{{ orderInfo.merchantName|| '中国跆拳道协会' }}</text>
23 </view> 23 </view>
24 <view class="info-item"> 24 <view class="info-item">
25 <text class="label">商户名称</text> 25 <text class="label">订单金额</text>
26 <text class="value">中国跆拳道协会</text> 26 <text class="value amount">{{ orderInfo.price ? orderInfo.price + '元' : '--' }}</text>
27 </view> 27 </view>
28 <view class="info-item"> 28 </view>
29 <text class="label">订单金额</text> 29
30 <text class="value amount">1500.00元</text> 30 <!-- 确定按钮（渐变+动效） -->
31 </view> 31 <view class="confirm-btn-area">
32 <view class="info-item"> 32 <button class="confirm-btn" @click="goBack">确定</button>
33 <text class="label">会员编号</text> 33 </view>
34 <text class="value">CTA00004</text> 34 </view>
35 </view> 35 </template>
36 <view class="info-item"> 36
37 <text class="label">会员有效期</text> 37 <script setup>
38 <text class="value">2028年1月25日</text> 38 import {
39 </view> 39 ref
40 </view> 40 } from 'vue'
41 41 import {
42 <!-- 确定按钮（渐变+动效） --> 42 onLoad
43 <view class="confirm-btn-area"> 43 } from '@dcloudio/uni-app'
44 <button class="confirm-btn" @click="goBack">确定</button> 44 import to from 'await-to-js'
45 </view> 45 import * as api from '@/common/api.js'
46 </view> 46
47 </template> 47 const orderInfo = ref({
48 48 orderId: '',
49 <script setup> 49 tradeNo: '',
50 import { onLoad } from '@dcloudio/uni-app' 50 merchantName: '中国跆拳道协会',
51 const goBack = () => { 51 price: ''
52 const pages = getCurrentPages() 52 })
53 const currentPage = pages[pages.length - 1] 53
54 const { from } = currentPage.options || {} 54 const goBack = () => {
55 55 uni.reLaunch({
56 let delta = 1 56 url: '/myCenter/auth'
57 57 })
58 if (from === 'payOrder') { 58 }
59 delta = 2 // 来自添加会员 / 订单页 → 返回 2 级 59
60 }else{ 60 onLoad(async (option) => {
61 delta = 3 61 if (option.orderId) {
62 } 62 const [err, res] = await to(api.getOrderInfo(option.orderId))
63 63 if (!err && res.data) {
64 uni.navigateBack({ delta }) 64 orderInfo.value = res.data
65 } 65 } else {
66 66 orderInfo.value.orderId = option.orderId
67 onLoad((option) => { 67 }
68 }) 68 }
69 </script> 69 })
70 70 </script>
71 <style scoped> 71
72 /* 全局容器 */ 72 <style scoped>
73 .success-container { 73 /* 全局容器 */
74 display: flex; 74 .success-container {
75 flex-direction: column; 75 display: flex;
76 align-items: center; 76 flex-direction: column;
77 padding: 100rpx 40rpx 60rpx; 77 align-items: center;
78 min-height: 100vh; 78 padding: 100rpx 40rpx 60rpx;
79 background-color: #f8f9fa; 79 min-height: 100vh;
80 box-sizing: border-box; 80 background-color: #f8f9fa;
81 } 81 box-sizing: border-box;
82 82 }
83 /* 成功图标容器 */ 83
84 .success-icon { 84 /* 成功图标容器 */
85 margin-bottom: 40rpx; 85 .success-icon {
86 animation: fadeIn 0.6s ease-out; 86 margin-bottom: 40rpx;
87 } 87 animation: fadeIn 0.6s ease-out;
88 88 }
89 /* 渐变圆形背景 */ 89
90 .icon-circle { 90 /* 渐变圆形背景 */
91 width: 180rpx; 91 .icon-circle {
92 height: 180rpx; 92 width: 180rpx;
93 border-radius: 50%; 93 height: 180rpx;
94 /* 青绿色渐变 */ 94 border-radius: 50%;
95 background: linear-gradient(135deg, #06c1ae, #04a896); 95 /* 青绿色渐变 */
96 display: flex; 96 background: linear-gradient(135deg, #06c1ae, #04a896);
97 align-items: center; 97 display: flex;
98 justify-content: center; 98 align-items: center;
99 box-shadow: 0 8rpx 30rpx rgba(6, 193, 174, 0.3); 99 justify-content: center;
100 /* 轻微上浮动效 */ 100 box-shadow: 0 8rpx 30rpx rgba(6, 193, 174, 0.3);
101 animation: scaleIn 0.8s ease-out; 101 /* 轻微上浮动效 */
102 } 102 animation: scaleIn 0.8s ease-out;
103 103 }
104 /* 对勾图标 */ 104
105 .check-icon { 105 /* 对勾图标 */
106 font-size: 90rpx; 106 .check-icon {
107 color: #ffffff; 107 font-size: 90rpx;
108 font-weight: bold; 108 color: #ffffff;
109 } 109 font-weight: bold;
110 110 }
111 /* 支付成功标题 */ 111
112 .success-title { 112 /* 支付成功标题 */
113 font-size: 48rpx; 113 .success-title {
114 font-weight: 700; 114 font-size: 48rpx;
115 color: #333333; 115 font-weight: 700;
116 margin-bottom: 12rpx; 116 color: #333333;
117 animation: slideUp 0.6s ease-out; 117 margin-bottom: 12rpx;
118 } 118 animation: slideUp 0.6s ease-out;
119 119 }
120 /* 副标题 */ 120
121 .success-subtitle { 121 /* 副标题 */
122 font-size: 28rpx; 122 .success-subtitle {
123 color: #666666; 123 font-size: 28rpx;
124 margin-bottom: 60rpx; 124 color: #666666;
125 animation: slideUp 0.8s ease-out; 125 margin-bottom: 60rpx;
126 } 126 animation: slideUp 0.8s ease-out;
127 127 }
128 /* 订单信息卡片 */ 128
129 .info-card { 129 /* 订单信息卡片 */
130 width: 100%; 130 .info-card {
131 background: #ffffff; 131 width: 100%;
132 border-radius: 20rpx; 132 background: #ffffff;
133 padding: 40rpx 30rpx; 133 border-radius: 20rpx;
134 box-shadow: 0 6rpx 20rpx rgba(0, 0, 0, 0.05); 134 padding: 40rpx 30rpx;
135 margin-bottom: 80rpx; 135 box-shadow: 0 6rpx 20rpx rgba(0, 0, 0, 0.05);
136 animation: fadeIn 1s ease-out; 136 margin-bottom: 80rpx;
137 } 137 animation: fadeIn 1s ease-out;
138 138 }
139 /* 单个信息项 */ 139
140 .info-item { 140 /* 单个信息项 */
141 display: flex; 141 .info-item {
142 justify-content: space-between; 142 display: flex;
143 align-items: center; 143 justify-content: space-between;
144 padding: 24rpx 0; 144 align-items: center;
145 border-bottom: 1rpx solid #f5f5f5; 145 padding: 24rpx 0;
146 } 146 border-bottom: 1rpx solid #f5f5f5;
147 /* 最后一项去掉下划线 */ 147 }
148 .info-item:last-child { 148
149 border-bottom: none; 149 /* 最后一项去掉下划线 */
150 } 150 .info-item:last-child {
151 151 border-bottom: none;
152 /* 标签样式 */ 152 }
153 .label { 153
154 font-size: 32rpx; 154 /* 标签样式 */
155 color: #666666; 155 .label {
156 } 156 font-size: 32rpx;
157 157 color: #666666;
158 /* 值样式 */ 158 white-space: nowrap;
159 .value { 159 margin-right: 20rpx;
160 font-size: 32rpx; 160 flex-shrink: 0;
161 color: #333333; 161 }
162 text-align: right; 162
163 } 163 /* 值样式 */
164 /* 金额特殊样式 */ 164 .value {
165 .amount { 165 font-size: 32rpx;
166 color: #cd1e27; 166 color: #333333;
167 font-weight: 600; 167 text-align: right;
168 } 168 word-break: break-all;
169 169 word-wrap: break-word;
170 /* 确定按钮区域 */ 170 }
171 .confirm-btn-area { 171
172 width: 100%; 172 /* 金额特殊样式 */
173 padding: 0 20rpx; 173 .amount {
174 box-sizing: border-box; 174 color: #cd1e27;
175 } 175 font-weight: 600;
176 176 }
177 /* 确定按钮（渐变+动效） */ 177
178 .confirm-btn { 178 /* 确定按钮区域 */
179 width: 100%; 179 .confirm-btn-area {
180 height: 90rpx; 180 width: 100%;
181 line-height: 90rpx; 181 padding: 0 20rpx;
182 /* 按钮渐变背景 */ 182 box-sizing: border-box;
183 background: #fff; 183 }
184 color: #C4121B; 184
185 font-size: 36rpx; 185 /* 确定按钮（渐变+动效） */
186 font-weight: 600; 186 .confirm-btn {
187 border-radius: 45rpx; 187 width: 100%;
188 border: 1px solid #C4121B; 188 height: 90rpx;
189 animation: slideUp 1s ease-out; 189 line-height: 90rpx;
190 /* 禁止默认样式 */ 190 /* 按钮渐变背景 */
191 position: relative; 191 background: #fff;
192 overflow: hidden; 192 color: #C4121B;
193 } 193 font-size: 36rpx;
194 /* 按钮点击反馈 */ 194 font-weight: 600;
195 .confirm-btn::after { 195 border-radius: 45rpx;
196 border: none; 196 border: 1px solid #C4121B;
197 } 197 animation: slideUp 1s ease-out;
198 .confirm-btn:active { 198 /* 禁止默认样式 */
199 transform: scale(0.98); 199 position: relative;
200 box-shadow: 0 4rpx 10rpx rgba(6, 193, 174, 0.2); 200 overflow: hidden;
201 } 201 }
202 202
203 /* 动画定义 */ 203 /* 按钮点击反馈 */
204 @keyframes fadeIn { 204 .confirm-btn::after {
205 0% { opacity: 0; } 205 border: none;
206 100% { opacity: 1; } 206 }
207 } 207
208 @keyframes scaleIn { 208 .confirm-btn:active {
209 0% { transform: scale(0); } 209 transform: scale(0.98);
210 70% { transform: scale(1.1); } 210 box-shadow: 0 4rpx 10rpx rgba(6, 193, 174, 0.2);
211 100% { transform: scale(1); } 211 }
212 } 212
213 @keyframes slideUp { 213 /* 动画定义 */
214 0% { opacity: 0; transform: translateY(30rpx); } 214 @keyframes fadeIn {
215 100% { opacity: 1; transform: translateY(0); } 215 0% {
216 } 216 opacity: 0;
217 }
218
219 100% {
220 opacity: 1;
221 }
222 }
223
224 @keyframes scaleIn {
225 0% {
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!