完善功能

This commit is contained in:
wangxiaowei
2026-04-11 23:00:20 +08:00
parent be1ce34a74
commit 74aa8d8ac4
5 changed files with 333 additions and 67 deletions

View File

@ -10,7 +10,7 @@
<view class="kt-eg-name">{{ item.eg_name }}</view>
<view class="kt-name">{{ item.name }}</view>
<view class="kt-btn-bg">
<view>立即开通</view>
<view :class="item.order ? 'kt-txt2' : 'kt-txt1'">{{ item.order ? '续费' : '立即开通' }}</view>
</view>
</view>
</view>
@ -94,9 +94,13 @@ page {
font-size: 30rpx;
font-weight: bold;
& view {
& .kt-txt1 {
padding-left: 60rpx;
}
& .kt-txt2 {
padding-left: 80rpx;
}
}
.mb-20 {

View File

@ -9,7 +9,7 @@
<view class="info-name" style="position: absolute; top: 40rpx; left: 40rpx;">{{ info.eg_name }}
</view>
<view class="info-name" style="position: absolute; top: 100rpx; left: 40rpx;">{{ info.name }}</view>
<view v-if="info.order.end_time && id == info.order.group_id" style="position: absolute; bottom: 68rpx; right: 40rpx; display: flex; align-items: center;">
<view v-if="info.order && info.order.end_time && id == info.order.group_id" style="position: absolute; bottom: 68rpx; right: 40rpx; display: flex; align-items: center;">
<image class="diamond" src="https://xh.stnav.com/uploads/sport/icon_zs.png" mode="aspectFit">
</image>
<text style="color: #834B08;font-weight: bold;">有效期{{ info.order.end_time }}到期</text>
@ -81,8 +81,18 @@
<!-- Bottom Button -->
<view class="bottom-bar">
<view class="btn-submit" @click="hanldeTakePhoto" v-if="info.order.end_time && id == info.order.group_id">录入人脸</view>
<!-- 两个按钮并排显示的情况 -->
<view class="btn-group" v-if="result && result.status == 1 && id == result.group_id && info.order && info.order.id">
<view class="btn-submit btn-half btn-secondary" @click="hanldeTakePhoto">人脸信息</view>
<view class="btn-submit btn-half" @click="handleSubmit">立即续费</view>
</view>
<!-- 单个按钮显示的情况 -->
<template v-else>
<view class="btn-submit btn-disabled" v-if="result && result.status == 0 && id == result.group_id">审核中</view>
<view class="btn-submit" @click="handleSubmit" v-else-if="result && result.status == 2 && id == result.group_id">重新提交</view>
<view class="btn-submit" @click="handleSubmit" v-else>立即开通</view>
</template>
</view>
<!-- 完善信息提示弹窗 -->
@ -125,10 +135,10 @@
</view>
</view>
<view class="buy-modal-tips">
<view class="buy-modal-tips" v-if="!isRenewal">
开通成功之后需要录入人脸信息
</view>
<view class="buy-modal-btn" @click="confirmBuy">立即开通</view>
<view class="buy-modal-btn" @click="confirmBuy">{{ isRenewal ? '立即续费' : '立即开通' }}</view>
</view>
</view>
@ -167,6 +177,8 @@ export default {
end_time: '', // 会员到期时间
},
}, // 套餐详情数据
result: null, // 审核数据
isRenewal: false, // 是否为续费
};
},
created() {
@ -181,12 +193,30 @@ export default {
this.comboType = args.type || 'adult'
this.id = args.id
this.handleGetDetails();
this.handleInit();
},
methods: {
goBack() {
uni.navigateBack();
},
handleInit() {
let self = this;
self._post(
'ground.group/getGroupData',
{
group_id: self.id
},
result => {
self.result = result.data
console.log("🚀 ~ self.result:", self.result)
},
false,
() => {
}
);
},
handleGetDetails() {
let self = this;
self._post(
@ -194,6 +224,7 @@ export default {
{ id: self.id },
result => {
self.info = result.data;
console.log("🚀 ~ self.info:", self.info)
},
false,
() => {
@ -204,37 +235,26 @@ export default {
handleSubmit() {
let self = this;
// 判断之前是否开通过任意一张会员卡,如果开通过且没有过期,提示"您已购买过套餐卡,无需重复购买"
if (self.info.order?.end_time) {
uni.showToast({ title: '您已购买过套餐卡,无需重复购买', icon: 'none' });
return false;
if (self.info.order && self.info.order.id) {
self.isRenewal = true;
} else {
self.isRenewal = false;
}
//TODO 如果信息审核没有通过uni.showToast提示"信息审核没通过,请耐心等待"
// 成人卡不需要提交资料
// if (self.id == 2) {
// self.showBuyModal = true;
// } else {
// 其他卡需要先判断是否提交过资料,如果没有提交过资料,弹出提示完善信息的弹窗;如果提交过资料,根据审核状态提示不同的消息或者弹窗
self._post(
'ground.group/getGroupData',
null,
result => {
console.log("🚀 ~ result.data:", result.data)
if (!result.data) {
if (!self.result) {
// 没有填写过信息,弹出完善信息提示弹窗
self.showInfoModal = true;
return false;
}
if (result.data.status == 0) {
if (self.result.status == 0) {
setTimeout(() => {
uni.showToast({ title: '信息审核中,请耐心等待', icon: 'none' });
}, 100);
return false;
}
if (result.data.status == 2) {
if (self.result.status == 2) {
setTimeout(() => {
uni.showToast({ title: '审核失败,请重新提交', icon: 'none' });
}, 100);
@ -243,25 +263,27 @@ export default {
return false;
}
if (result.data.status == 1) {
if (self.result.status == 1) {
// 已经审核通过,弹出开通会员弹窗
self.showBuyModal = true;
return false;
}
},
false,
() => {
}
);
// }
},
closeInfoModal() {
this.showInfoModal = false;
},
goToFillInfo() {
this.showInfoModal = false;
let self = this;
self.showInfoModal = false;
uni.navigateTo({
url: '/bundle/combo/info?id=' + this.id
url: '/bundle/combo/info?id=' + self.id,
events:{
data: (e) => {
if (e.notice == 'success') {
self.handleInit()
}
}
}
});
},
closeBuyModal() {
@ -275,7 +297,7 @@ export default {
let self = this
self.showBuyModal = false;
self._post(
'order.group/submitStoreOrder',
'order.group/submitGroupOrder',
{
group_id: self.id,
group_type: self.selectedPlan, // 1-月卡 2-季卡
@ -328,16 +350,29 @@ export default {
)
},
closeSuccessModal() {
this.showSuccessModal = false;
if (this.isRenewal) {
this.handleGetDetails();
return;
}
let orderId = this.info.order ? this.info.order.id : '';
uni.navigateTo({
url: '/bundle/combo/face-list?id=' + this.id + '&order_id=' + this.info.order.id
url: '/bundle/combo/face-list?id=' + this.id + '&order_id=' + orderId
});
},
hanldeTakePhoto() {
if (this.result.status == 0) {
setTimeout(() => {
uni.showToast({ title: '信息审核中,请耐心等待', icon: 'none' });
}, 100);
return false;
}
let orderId = this.info.order ? this.info.order.id : '';
uni.navigateTo({
url: '/bundle/combo/face-list?id=' + this.id + '&order_id=' + this.info.order.id
url: '/bundle/combo/face-list?id=' + this.id + '&order_id=' + orderId
});
}
}
@ -564,8 +599,17 @@ page {
background-color: #fff;
padding: 20rpx 40rpx 60rpx;
box-sizing: border-box;
box-shadow: 0 -4rpx 20rpx rgba(0, 0, 0, 0.05);
.btn-group {
display: flex;
align-items: center;
justify-content: space-between;
gap: 30rpx;
}
.btn-submit {
flex: 1;
background: linear-gradient(90deg, #F6E1B0 0%, #EDC66E 100%);
color: #333;
font-size: 32rpx;
@ -575,6 +619,26 @@ page {
align-items: center;
justify-content: center;
border-radius: 45rpx;
box-shadow: 0 6rpx 12rpx rgba(237, 198, 110, 0.3);
transition: all 0.2s;
}
.btn-submit:active {
transform: scale(0.98);
box-shadow: 0 2rpx 6rpx rgba(237, 198, 110, 0.2);
}
.btn-disabled {
background: #F5F5F5;
color: #999;
box-shadow: none;
}
.btn-secondary {
background: #FDF8EE;
border: 2rpx solid #EDC66E;
color: #834B08;
box-shadow: none;
}
}

View File

@ -98,7 +98,7 @@
self._post(
'ground.group/getGroupData',
null,
{group_id: self.id},
result => {
if (result.data && result.data.face_url) {
self.youthFace = result.data.face_url;

View File

@ -163,7 +163,7 @@
<view class="form-item-row no-border">
<view class="label">联系电话</view>
<input class="input-grey" type="number" placeholder="请填写联系方式"
placeholder-class="placeholder-style-small" v-model="formData.phone" />
placeholder-class="placeholder-style-small" v-model="formData.mobile" />
</view>
</view>
@ -227,8 +227,8 @@ export default {
card: '',
},
parents: [
{ name: '', both: '', card: '' },
{ name: '', both: '', card: '' }
{ id: 0, name: '', both: '', card: '' },
{ id: 0, name: '', both: '', card: '' }
],
child: {
name: '',
@ -239,15 +239,102 @@ export default {
group_id: 0
},
id: 0,
isSubmitting: false
isSubmitting: false,
setting: {
company: {}
},
info: {}, // 用户信息数据
}
},
onLoad(args) {
this.comboType = args.type || 'adult'
this.id = args.id
this.formData.group_id = this.id
this.handleInit()
this.handleGetSetting()
},
methods: {
handleInit() {
let self = this;
self._post(
'ground.group/getGroupData',
{
group_id: self.id
},
result => {
if (result.code && result.data) {
const data = result.data;
self.info = data;
self.formData.mobile = data.mobile || '';
if (data.group_id == 1 ) {
// 青年卡
self.formData.youth = {
name: data.name,
both: data.both,
card: data.card,
}
}
if (data.group_id == 2) {
// 成人卡
self.formData.adult = {
name: data.name,
both: data.both,
card: data.card,
}
}
if (data.group_id == 3 || data.group_id == 4) {
// 亲子卡
if (data.parent && data.parent.length > 0) {
self.formData.parents[0] = {
id: data.parent[0].id,
name: data.parent[0].name,
both: data.parent[0].both,
card: data.parent[0].card,
}
}
if (data.parent && data.parent.length > 1) {
self.formData.parents[1] = {
id: data.parent[0].id,
name: data.parent[1].name,
both: data.parent[1].both,
card: data.parent[1].card,
}
}
self.formData.child = {
name: data.name,
both: data.both,
card: data.card,
}
}
}
},
false,
() => {
}
);
},
handleGetSetting() {
let self = this;
self._post(
'ground.ground/groundSetting',
{
app_id: self.getAppId()
},
function(res) {
if (res.code) {
self.info = res.data;
}
}
)
},
onYouthDateChange(e) {
this.formData.youth.both = e.detail.value;
},
@ -265,13 +352,39 @@ export default {
},
contactUs() {
uni.showToast({ title: '正在连接客服...', icon: 'none' });
console.log("🚀 ~ this.setting:", this.setting)
uni.makePhoneCall({
phoneNumber: this.setting.company.contact
});
},
submitForm() {
let self = this;
const regex = /^[1-9]\d{5}(18|19|20)?\d{2}(0[1-9]|1[0-2])(0[1-9]|[12]\d|3[01])\d{3}[\dXx]$/;
const validateCardAndAgeMatch = (card, both, prefix, ageRule) => {
let idBirthStr = card.length === 15 ? '19' + card.substring(6, 12) : card.substring(6, 14);
let idDateStr = `${idBirthStr.substring(0, 4)}-${idBirthStr.substring(4, 6)}-${idBirthStr.substring(6, 8)}`;
if (idDateStr !== both) {
return `${prefix}出生日期选错了与身份证不符`;
}
if (ageRule) {
const today = new Date();
let age = today.getFullYear() - parseInt(idBirthStr.substring(0, 4));
const m = (today.getMonth() + 1) - parseInt(idBirthStr.substring(4, 6));
if (m < 0 || (m === 0 && today.getDate() < parseInt(idBirthStr.substring(6, 8)))) {
age--;
}
if (ageRule === 'adult' && age < 18) {
return `${prefix}必须满18周岁`;
}
if (ageRule === 'child' && age >= 18) {
return `${prefix}须未满18周岁`;
}
}
return null;
};
// id == 1 验证 youth 属性
if (self.id == 1) {
let youth = self.formData.youth;
@ -281,6 +394,8 @@ export default {
if (!regex.test(youth.card)) {
return uni.showToast({ title: '请输入正确的身份证号码', icon: 'none' });
}
let err = validateCardAndAgeMatch(youth.card, youth.both, '', 'child');
if (err) return uni.showToast({ title: err, icon: 'none' });
}
// 成人卡
@ -293,6 +408,8 @@ export default {
if (!regex.test(adult.card)) {
return uni.showToast({ title: '请输入正确的身份证号码', icon: 'none' });
}
let err = validateCardAndAgeMatch(adult.card, adult.both, '', 'adult');
if (err) return uni.showToast({ title: err, icon: 'none' });
}
// id == 3(第一个亲子卡) 或 4 时,验证 parents[0] 和 child 属性
@ -304,6 +421,8 @@ export default {
if (!regex.test(p0.card)) {
return uni.showToast({ title: '请输入正确的家长1身份证号码', icon: 'none' });
}
let err0 = validateCardAndAgeMatch(p0.card, p0.both, '家长1', 'adult');
if (err0) return uni.showToast({ title: err0, icon: 'none' });
// id == 4 时(第二个亲子卡),还需要额外验证 parents[1] 属性
if (self.id == 4) {
@ -314,6 +433,8 @@ export default {
if (!regex.test(p1.card)) {
return uni.showToast({ title: '请输入正确的家长2身份证号码', icon: 'none' });
}
let err1 = validateCardAndAgeMatch(p1.card, p1.both, '家长2', 'adult');
if (err1) return uni.showToast({ title: err1, icon: 'none' });
}
let child = self.formData.child;
@ -323,15 +444,17 @@ export default {
if (!regex.test(child.card)) {
return uni.showToast({ title: '请输入正确的子女身份证号码', icon: 'none' });
}
let errC = validateCardAndAgeMatch(child.card, child.both, '子女', 'child');
if (errC) return uni.showToast({ title: errC, icon: 'none' });
}
// 所有场景必填联系电话
if (!self.formData.phone) {
if (!self.formData.mobile) {
return uni.showToast({ title: '请填写联系电话', icon: 'none' });
}
const phoneReg = /^1[3-9]\d{9}$/;
if (!phoneReg.test(self.formData.phone)) {
if (!phoneReg.test(self.formData.mobile)) {
return uni.showToast({ title: '请输入正确的手机号码', icon: 'none' });
}
@ -381,6 +504,7 @@ export default {
this.showSuccessPopup = false;
// 点击好的之后,可以跳转或返回上一页
uni.navigateBack();
this.getOpenerEventChannel().emit('data', {notice: 'success'});
}
}
}

View File

@ -17,19 +17,37 @@
<image style="width: 40rpx;height: 40rpx;" src="@/static/icon/notice.png" mode=""></image>
<view class="notice-txt">{{ setting.notice }}</view>
</view> -->
<!--
<view style="display: flex; justify-content: center; margin-bottom: 20rpx;" @click="toRecharge">
<image style="width: 690rpx;height: 140rpx;" src="https://xh.stnav.com/uploads/sport/recharge.png" mode=""></image>
</view>
<view style="display: flex; justify-content: center; margin-bottom: 26rpx;" @click="toCombo">
<image style="width: 690rpx;height: 200rpx;" src="https://xh.stnav.com/uploads/sport/to-combo2.png" mode=""></image>
</view>
</view> -->
<!-- <view style="display: flex; justify-content: center; margin-bottom: 40rpx;" @click="toCombo">
<image style="width: 690rpx;height: 230rpx;" src="https://xh.stnav.com/uploads/sport/to-combo1.png" mode=""></image>
</view> -->
<view class="card-container">
<view class="card left-card" @click="toRecharge" style="background-image: url('https://xh.stnav.com/uploads/sport/home_image2.png'); background-size: 100% 100%; background-repeat: no-repeat;">
<view class="card-text">
<view class="card-title" style="color: #4693F6;">网球充值卡</view>
<view class="card-subtitle left-subtitle" style="color: #4693F6;">充值立享优惠</view>
<view style="margin-top: 50rpx;"><text class="card-btn" style="background-color: #6A9CFD; color: #fff;">立即抢购</text></view>
</view>
</view>
<view class="card right-card" @click="toCombo" style="background-image: url('https://xh.stnav.com/uploads/sport/home_image1.png'); background-size: 100% 100%; background-repeat: no-repeat;">
<view class="card-text">
<view class="card-title" style="color: #D1834F;">篮球套餐卡</view>
<view class="card-subtitle right-subtitle" style="color: #CD9C7B;">青年卡亲子卡成年卡...等你来领</view>
<view><text class="card-btn" style="background-color: #D19A62; color: #fff;">立即查看</text></view>
</view>
</view>
</view>
<!-- 预约球馆 -->
<view class="info">
<view class="title">
@ -719,6 +737,62 @@ export default {
</script>
<style lang="scss">
.card-container {
display: flex;
justify-content: space-between;
padding: 0 30rpx;
margin-bottom: 30rpx;
}
.card {
width: 330rpx;
height: 200rpx;
border-radius: 16rpx;
position: relative;
padding: 24rpx;
box-sizing: border-box;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.card-text {
position: relative;
z-index: 2;
}
.card-title {
font-size: 32rpx;
font-weight: bold;
margin-bottom: 8rpx;
}
.card-subtitle {
font-size: 22rpx;
margin-bottom: 24rpx;
line-height: 1.3;
}
.left-subtitle {
width: 160rpx;
}
.right-subtitle {
width: 250rpx;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.card-btn {
font-size: 20rpx;
padding: 6rpx 24rpx;
border-radius: 30rpx;
}
page {
background-color: $xh-bg;
}