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 251 additions and 154 deletions
App.vue
<script>
import {
import {
getInfo
} from '@/common/login.js';
import * as api from '@/common/api.js';
import config from '@/config.js';
} from '@/common/login.js';
import * as api from '@/common/api.js';
import config from '@/config.js';
let loginUrl=['login/login', 'login/register']
let firstload = false
export default {
let loginUrl = ['login/login', 'login/register', 'personal/addVip_per']
let firstload = false
export default {
globalData: {
isLogin: false,
baseUrl_api: '',
user: null,
userType: '',
userInfo: null,
deptType: '',
genFlag: '',
authenticationStatus: '',
memberInfo: null,
isExam: false
},
onLaunch: function(options) {
console.log('App Launch', options);
this.globalData.baseUrl_api = config.baseUrl_api;
if(loginUrl.indexOf(options.path)==-1){
if (loginUrl.indexOf(options.path) == -1) {
let userName = uni.getStorageSync('userName')
if (userName) {
getInfo().then(() => {
......@@ -38,17 +50,17 @@ export default {
}
},
onShow: function() {
console.log('App Show',firstload,this.globalData.isLogin);
if(firstload&&!this.globalData.isLogin){
uni.redirectTo({
url: '/login/login'
})
}
console.log('App Show', firstload, this.globalData.isLogin);
// if (firstload && !this.globalData.isLogin) {
// uni.redirectTo({
// url: '/login/login'
// })
// }
},
onHide: function() {
console.log('App Hide');
}
};
};
</script>
<style lang="scss">
......
common/api.js
......@@ -1306,11 +1306,10 @@ export function checkBusinessLicense(data) {
}
// 生成团体订单renewYear
export function certifiedNew(params) {
export function certifiedNew(renewYear) {
return request({
url: `/system/certifiedNew/commit`,
method: 'post',
params
url: `/system/certifiedNew/commit?renewYear=${renewYear}`,
method: 'post'
})
}
......
config.js
......@@ -5,7 +5,7 @@
// staging 会员系统
// const baseUrl_api = "http://22yidpjzjifv.ngrok.xiaomiqiu123.top/stage-api/";
// const baseUrl_api = "https://ztx.itechtop.cn:8443/stage-api";
const baseUrl_api = 'http://192.168.1.189:8788'
const baseUrl_api = 'http://192.168.1.189:8787'
// const baseUrl_api = 'https://tkcn.19wk.cn:8443/stage-api'
// const baseUrl_api = 'http://tk004.wxjylt.com/stage-api'
......
myCenter/auth.vue
......@@ -20,8 +20,9 @@
<view class="flexbox" style="justify-content: flex-end;padding: 0 30rpx 40rpx;">
<button class="btn-red" style="margin: 0 20rpx 0 0;" size="mini"
v-if="activeStatus==0&&authenticationStatusa" @click="payTheFees">激活</button>
<view v-else >
<button class="btn-red" style="margin: 0 20rpx 0 0;" size="mini" :disabled="auditStatus==1||auditStatus==2||form.isPoints==0"
<view v-else>
<button class="btn-red" style="margin: 0 20rpx 0 0;" size="mini"
:disabled="auditStatus==1||auditStatus==2||form.isPoints==0"
@click="showApplyDialog">考点申请</button>
<button class="btn-red" style="margin: 0 20rpx 0 0;" size="mini" :disabled="btn"
@click="payTheFees">去缴费</button>
......@@ -40,8 +41,8 @@
<uni-list-item title="所属省份">
<template v-slot:footer>
<view class="frrr">
<uni-data-picker readonly :clear-icon="false"
v-model="form.belongProvinceId" :localdata="options">
<uni-data-picker readonly :clear-icon="false" v-model="form.belongProvinceId"
:localdata="options">
</uni-data-picker>
</view>
</template>
......@@ -91,7 +92,7 @@
</template>
</uni-list-item>
<uni-list-item title="机构照片" clickable>
<template v-slot:footer >
<template v-slot:footer>
<view class="frrr">
<view v-if="form.picturesArr&&form.picturesArr?.length>0" class="photoBook"
@click="showImage(form.picturesArr,0)">
......@@ -105,9 +106,7 @@
</uni-list>
</view>
<!-- 弹窗添加触摸事件拦截 -->
<uni-popup ref="applyPopup" type="center"
@touchmove.stop.prevent="() => {}"
@open="onPopupOpen"
<uni-popup ref="applyPopup" type="center" @touchmove.stop.prevent="() => {}" @open="onPopupOpen"
@close="onPopupClose">
<view class="apply-dialog" @touchmove.stop.prevent="() => {}">
<view class="dialog-title">考点申请</view>
......@@ -131,10 +130,12 @@
import _ from 'underscore'
import {
ref, onUnmounted
ref,
onUnmounted
} from 'vue'
import {
onLoad,onShow
onLoad,
onShow
} from '@dcloudio/uni-app'
const app = getApp()
const form = ref({
......@@ -168,7 +169,9 @@
// 页面卸载时恢复滚动（防止异常锁死）
onUnmounted(() => {
uni.setPageScrollEnabled({ enabled: true })
uni.setPageScrollEnabled({
enabled: true
})
popupShow.value = false
})
......@@ -227,19 +230,22 @@
if (form.value.businessLicense) {
form.value.businessLicenseArr = []
try{
try {
form.value.businessLicenseArr = JSON.parse(form.value.businessLicense) || []
}catch(e){
form.value.businessLicenseArr=[{url:form.value.businessLicense,name:'营业执照'}]
} catch (e) {
form.value.businessLicenseArr = [{
url: form.value.businessLicense,
name: '营业执照'
}]
}
console.log('营业执照',form.value.businessLicenseArr)
console.log('营业执照', form.value.businessLicenseArr)
}
if (form.value.certLegalIdcPhoto && form.value.certLegalIdcPhoto!=null) {
if (form.value.certLegalIdcPhoto && form.value.certLegalIdcPhoto != null) {
form.value.legalIdcPhotoArr = []
var arr = form.value.certLegalIdcPhoto?.split(',') || []
if (arr.length > 0) {
arr = _.map(arr, (p) => {
if(p.indexOf('http')==-1){
if (p.indexOf('http') == -1) {
console.log(p)
p = config.baseUrl_api + p
}
......@@ -247,14 +253,14 @@
})
form.value.legalIdcPhotoArr = arr
}
console.log('法人身份证',form.value.legalIdcPhotoArr)
console.log('法人身份证', form.value.legalIdcPhotoArr)
}
if (form.value.certPictures) {
form.value.picturesArr = []
var arr = form.value.certPictures.split(',') || []
if (arr.length > 0) {
arr = _.map(arr, (p) => {
if(p.indexOf('http')==-1){
if (p.indexOf('http') == -1) {
p = config.baseUrl_api + p
}
return p
......@@ -267,7 +273,9 @@
}
async function getMyStatusAPI() {
const { data } = await api.getMyStatus()
const {
data
} = await api.getMyStatus()
if (data && data.auditStatus) {
auditStatus.value = data.auditStatus
} else {
......@@ -279,10 +287,14 @@
function onPopupOpen() {
popupShow.value = true
// 1. 小程序API锁定页面滚动
uni.setPageScrollEnabled({ enabled: false })
uni.setPageScrollEnabled({
enabled: false
})
// 延时兜底（防止API生效延迟）
setTimeout(() => {
uni.setPageScrollEnabled({ enabled: false })
uni.setPageScrollEnabled({
enabled: false
})
}, 100)
}
......@@ -290,9 +302,13 @@
function onPopupClose() {
popupShow.value = false
// 恢复页面滚动
uni.setPageScrollEnabled({ enabled: true })
uni.setPageScrollEnabled({
enabled: true
})
setTimeout(() => {
uni.setPageScrollEnabled({ enabled: true })
uni.setPageScrollEnabled({
enabled: true
})
}, 100)
}
......@@ -330,7 +346,7 @@
function download(url) {
console.log(url)
if (url.indexOf('.png') > -1 || url.indexOf('.jpg') > -1) {
if(url.indexOf('http')>-1){
if (url.indexOf('http') > -1) {
uni.previewImage({
urls: [url],
success: function(res) {}
......@@ -342,7 +358,7 @@
})
}
} else {
if(url.indexOf('http')>-1){
if (url.indexOf('http') > -1) {
goWebView(url)
} else {
goWebView(config.baseUrl_api + url)
......@@ -390,7 +406,7 @@
});
}
function payTheFees(){
function payTheFees() {
if (!form.value.name) {
uni.showToast({
title: `请先完善团体信息`,
......@@ -399,7 +415,7 @@
return; // 新增：防止无名称时跳转
}
uni.navigateTo({
url:`/myCenter/perfect`
url: `/myCenter/perfect`
})
}
</script>
......@@ -416,7 +432,10 @@
height: 100vh !important;
}
.height1{height: 100rpx;}
.height1 {
height: 100rpx;
}
.photobox {
position: relative;
margin: 30rpx auto;
......@@ -429,6 +448,7 @@
margin: auto;
}
}
.ylImage {
width: 300rpx;
height: 200rpx;
......@@ -437,25 +457,52 @@
border-radius: 8rpx;
}
.photoBook{position: relative;border-radius: 10rpx; overflow: hidden;
&::after{content: '';position: absolute;width: 100%;height: 100%;top: 0;left: 0;
background: linear-gradient(180deg,rgba(0, 0, 0, 0),rgba(0, 0, 0, 0.7));
.photoBook {
position: relative;
border-radius: 10rpx;
overflow: hidden;
&::after {
content: '';
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7));
}
text{ position: absolute;z-index: 1;
text {
position: absolute;
z-index: 1;
font-size: 24rpx;
color: #fff;
bottom: 4rpx;
right: 8rpx;}
right: 8rpx;
}
.frrr{width: 100%;text-align: right;
}
.frrr {
width: 100%;
text-align: right;
text-align: right;
display: flex;
flex-wrap: wrap;
justify-content: flex-end;}
:deep(.selected-list){font-size: 32rpx;padding: 0;}
:deep(.input-value){padding: 0;}
justify-content: flex-end;
}
:deep(.selected-list) {
font-size: 32rpx;
padding: 0;
}
:deep(.input-value) {
padding: 0;
}
:deep(.uni-list-item__extra-text) {
font-size: 32rpx;color: #000;
font-size: 32rpx;
color: #000;
}
:deep(.uni-list-item__extra) {
......@@ -479,6 +526,7 @@
.mainbox {
margin: 30rpx;
}
.apply-dialog {
width: 530rpx;
background: #fff;
......@@ -487,25 +535,30 @@
// 新增：禁止弹窗内部滚动
touch-action: none;
}
.dialog-title {
font-size: 32rpx;
font-weight: bold;
text-align: center;
margin-bottom: 30rpx;
}
.dialog-content {
margin: 40rpx;
}
.remind {
color: #FF8124;
font-size: 26rpx;
margin-top: 40rpx;
}
.dialog-buttons {
display: flex;
justify-content: space-between;
margin-top: 40rpx;
}
.btn-cancel {
width: 225rpx;
height: 80rpx;
......@@ -517,6 +570,7 @@
text-align: center;
font-size: 14px;
}
.btn-confirm {
width: 225rpx;
height: 80rpx;
......
myCenter/sucPay.vue
......@@ -14,28 +14,16 @@
<!-- 订单信息卡片（带阴影） -->
<view class="info-card">
<view class="info-item">
<text class="label">付款账户</text>
<text class="value">(5437)</text>
</view>
<view class="info-item">
<text class="label">交易流水号</text>
<text class="value">2205051351076117833</text>
<text class="value">{{ orderInfo.tradeNo || '--' }}</text>
</view>
<view class="info-item">
<text class="label">商户名称</text>
<text class="value">中国跆拳道协会</text>
<text class="value">{{ orderInfo.merchantName|| '中国跆拳道协会' }}</text>
</view>
<view class="info-item">
<text class="label">订单金额</text>
<text class="value amount">1500.00元</text>
</view>
<view class="info-item">
<text class="label">会员编号</text>
<text class="value">CTA00004</text>
</view>
<view class="info-item">
<text class="label">会员有效期</text>
<text class="value">2028年1月25日</text>
<text class="value amount">{{ orderInfo.price ? orderInfo.price + '元' : '--' }}</text>
</view>
</view>
......@@ -47,30 +35,43 @@
</template>
<script setup>
import { onLoad } from '@dcloudio/uni-app'
const goBack = () => {
const pages = getCurrentPages()
const currentPage = pages[pages.length - 1]
const { from } = currentPage.options || {}
let delta = 1
if (from === 'payOrder') {
delta = 2 // 来自添加会员 / 订单页 → 返回 2 级
}else{
delta = 3
import {
ref
} from 'vue'
import {
onLoad
} from '@dcloudio/uni-app'
import to from 'await-to-js'
import * as api from '@/common/api.js'
const orderInfo = ref({
orderId: '',
tradeNo: '',
merchantName: '中国跆拳道协会',
price: ''
})
const goBack = () => {
uni.reLaunch({
url: '/myCenter/auth'
})
}
uni.navigateBack({ delta })
}
onLoad((option) => {
})
onLoad(async (option) => {
if (option.orderId) {
const [err, res] = await to(api.getOrderInfo(option.orderId))
if (!err && res.data) {
orderInfo.value = res.data
} else {
orderInfo.value.orderId = option.orderId
}
}
})
</script>
<style scoped>
/* 全局容器 */
.success-container {
/* 全局容器 */
.success-container {
display: flex;
flex-direction: column;
align-items: center;
......@@ -78,16 +79,16 @@ onLoad((option) => {
min-height: 100vh;
background-color: #f8f9fa;
box-sizing: border-box;
}
}
/* 成功图标容器 */
.success-icon {
/* 成功图标容器 */
.success-icon {
margin-bottom: 40rpx;
animation: fadeIn 0.6s ease-out;
}
}
/* 渐变圆形背景 */
.icon-circle {
/* 渐变圆形背景 */
.icon-circle {
width: 180rpx;
height: 180rpx;
border-radius: 50%;
......@@ -99,34 +100,34 @@ onLoad((option) => {
box-shadow: 0 8rpx 30rpx rgba(6, 193, 174, 0.3);
/* 轻微上浮动效 */
animation: scaleIn 0.8s ease-out;
}
}
/* 对勾图标 */
.check-icon {
/* 对勾图标 */
.check-icon {
font-size: 90rpx;
color: #ffffff;
font-weight: bold;
}
}
/* 支付成功标题 */
.success-title {
/* 支付成功标题 */
.success-title {
font-size: 48rpx;
font-weight: 700;
color: #333333;
margin-bottom: 12rpx;
animation: slideUp 0.6s ease-out;
}
}
/* 副标题 */
.success-subtitle {
/* 副标题 */
.success-subtitle {
font-size: 28rpx;
color: #666666;
margin-bottom: 60rpx;
animation: slideUp 0.8s ease-out;
}
}
/* 订单信息卡片 */
.info-card {
/* 订单信息卡片 */
.info-card {
width: 100%;
background: #ffffff;
border-radius: 20rpx;
......@@ -134,48 +135,55 @@ onLoad((option) => {
box-shadow: 0 6rpx 20rpx rgba(0, 0, 0, 0.05);
margin-bottom: 80rpx;
animation: fadeIn 1s ease-out;
}
}
/* 单个信息项 */
.info-item {
/* 单个信息项 */
.info-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 24rpx 0;
border-bottom: 1rpx solid #f5f5f5;
}
/* 最后一项去掉下划线 */
.info-item:last-child {
}
/* 最后一项去掉下划线 */
.info-item:last-child {
border-bottom: none;
}
}
/* 标签样式 */
.label {
/* 标签样式 */
.label {
font-size: 32rpx;
color: #666666;
}
white-space: nowrap;
margin-right: 20rpx;
flex-shrink: 0;
}
/* 值样式 */
.value {
/* 值样式 */
.value {
font-size: 32rpx;
color: #333333;
text-align: right;
}
/* 金额特殊样式 */
.amount {
word-break: break-all;
word-wrap: break-word;
}
/* 金额特殊样式 */
.amount {
color: #cd1e27;
font-weight: 600;
}
}
/* 确定按钮区域 */
.confirm-btn-area {
/* 确定按钮区域 */
.confirm-btn-area {
width: 100%;
padding: 0 20rpx;
box-sizing: border-box;
}
}
/* 确定按钮（渐变+动效） */
.confirm-btn {
/* 确定按钮（渐变+动效） */
.confirm-btn {
width: 100%;
height: 90rpx;
line-height: 90rpx;
......@@ -190,28 +198,52 @@ onLoad((option) => {
/* 禁止默认样式 */
position: relative;
overflow: hidden;
}
/* 按钮点击反馈 */
.confirm-btn::after {
}
/* 按钮点击反馈 */
.confirm-btn::after {
border: none;
}
.confirm-btn:active {
}
.confirm-btn:active {
transform: scale(0.98);
box-shadow: 0 4rpx 10rpx rgba(6, 193, 174, 0.2);
}
/* 动画定义 */
@keyframes fadeIn {
0% { opacity: 0; }
100% { opacity: 1; }
}
@keyframes scaleIn {
0% { transform: scale(0); }
70% { transform: scale(1.1); }
100% { transform: scale(1); }
}
@keyframes slideUp {
0% { opacity: 0; transform: translateY(30rpx); }
100% { opacity: 1; transform: translateY(0); }
}
}
/* 动画定义 */
@keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes scaleIn {
0% {
transform: scale(0);
}
70% {
transform: scale(1.1);
}
100% {
transform: scale(1);
}
}
@keyframes slideUp {
0% {
opacity: 0;
transform: translateY(30rpx);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
</style>
\ No newline at end of file
......
personal/sucPay.vue
......@@ -15,7 +15,7 @@
<view class="info-card">
<view class="info-item">
<text class="label">交易流水号</text>
<text class="value">{{ orderInfo.tradeNo }}</text>
<text class="value">{{ orderInfo.tradeNo||'--' }}</text>
</view>
<view class="info-item">
<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!