添加套餐管理

This commit is contained in:
wangxiaowei
2026-04-10 00:16:04 +08:00
parent 8854cdd32d
commit c9c1d74957
3 changed files with 354 additions and 158 deletions

View File

@ -2,56 +2,18 @@
<view class="page-container">
<!-- Top Background & Card -->
<view class="top-section">
<!-- 成人卡 -->
<template v-if="comboType === 'adult'">
<image class="bg-img" src="https://xh.stnav.com/uploads/sport/crk-bg.png"></image>
<!-- 添加的卡片文字内容 -->
<view class="card-text-content" :style="{ top: (statusBarHeight + navHeight + 20) + 'px' }">
<view class="card-title">
<view class="en">Adult Card</view>
<view class="zh">成人卡</view>
</view>
<view class="card-date">
<view style="width: 100%; height: 100%; position: relative;">
<image class="bg-img" src="https://xh.stnav.com/uploads/sport/card-bg.png"></image>
<view style="position: absolute; left: 50%; transform: translateX(-50%); bottom: 0;">
<image :src="info.img" style="width: 690rpx; height: 290rpx;"></image>
<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 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>有效期2026.03.05到期</text>
<text style="color: #834B08;font-weight: bold;">有效期2026.03.05到期</text>
</view>
</view>
</template>
<!-- 青年卡 -->
<template v-if="comboType === 'youth'">
<image class="bg-img" src="https://xh.stnav.com/uploads/sport/qnk-bg.png"></image>
<!-- 添加的卡片文字内容 -->
<view class="card-text-content" :style="{ top: (statusBarHeight + navHeight + 20) + 'px' }">
<view class="card-title">
<view class="en">Adult Card</view>
<view class="zh">青年卡</view>
</view>
<view class="card-date">
<image class="diamond" src="https://xh.stnav.com/uploads/sport/icon_zs.png" mode="aspectFit"></image>
<text>有效期2026.03.05到期</text>
</view>
</view>
</template>
<!-- 亲子卡 -->
<template v-if="comboType === 'family'">
<image class="bg-img" src="https://xh.stnav.com/uploads/sport/qzk-bg.png"></image>
<!-- 添加的卡片文字内容 -->
<view class="card-text-content" :style="{ top: (statusBarHeight + navHeight + 20) + 'px' }">
<view class="card-title-parten">
<view class="en">Adult Card</view>
<view class="zh">亲子卡</view>
</view>
<view class="card-date">
<image class="diamond" src="https://xh.stnav.com/uploads/sport/icon_zs.png" mode="aspectFit"></image>
<text>有效期2026.03.05到期</text>
</view>
</view>
</template>
</view>
<view class="nav-header" :style="{ paddingTop: statusBarHeight + 'px' }">
<view class="nav-content" :style="{ height: navHeight + 'px' }">
@ -105,10 +67,7 @@
<view class="rules-title">权益说明</view>
<view class="rules-subtitle">更多会员专属权益与服务内容</view>
<view class="rules-list">
<view class="rule-item">· 这里是权益说明内容这里是内容</view>
<view class="rule-item">· 这里是权益说明内容这里是内容</view>
<view class="rule-item">· 这里是权益说明内容这里是内容</view>
<view class="rule-item">· 这里是权益说明内容这里是内容</view>
<rich-text :nodes="info.content"></rich-text>
</view>
</view>
</view>
@ -142,27 +101,18 @@
<view class="plan-name">月卡</view>
<view class="plan-price">
<text style="font-size: 24rpx; margin-right: 4rpx;"></text>
<text>50.00</text>
<text>{{ info.price }}</text>
</view>
<view class="plan-desc">指导价50/</view>
<view class="plan-desc">指导价{{ info.month_price }}/</view>
<view class="check-mark"></view>
</view>
<view class="plan-item" :class="{ active: selectedPlan === 1 }" @click="selectPlan(1)">
<view class="plan-name">季卡</view>
<view class="plan-price">
<text style="font-size: 24rpx; margin-right: 4rpx;"></text>
<text>128.00</text>
<text>{{ info.price }}</text>
</view>
<view class="plan-desc">指导价128/</view>
<view class="check-mark"></view>
</view>
<view class="plan-item" :class="{ active: selectedPlan === 2 }" @click="selectPlan(2)">
<view class="plan-name">年卡</view>
<view class="plan-price">
<text style="font-size: 24rpx; margin-right: 4rpx;"></text>
<text>218.00</text>
</view>
<view class="plan-desc">指导价218元/</view>
<view class="plan-desc">指导价{{ info.month_price }}/</view>
<view class="check-mark"></view>
</view>
</view>
@ -193,6 +143,7 @@
export default {
data() {
return {
id: 0,
statusBarHeight: 20,
navHeight: 44,
comboType: 'adult', // 套餐类型adult(成人卡) youth(青年卡) family(亲子卡)
@ -200,6 +151,7 @@ export default {
showBuyModal: false, // 会员购买弹窗
showSuccessModal: false, // 购买成功弹窗
selectedPlan: 0, // 选择的套餐
info: null, // 套餐详情数据
};
},
created() {
@ -212,25 +164,69 @@ export default {
},
onLoad(args) {
this.comboType = args.type || 'adult'
this.id = args.id
this.handleGetDetails();
},
methods: {
goBack() {
uni.navigateBack();
},
handleSubmit() {
this.showSuccessModal = true;
return false
//TODO 如果信息审核没有通过uni.showToast提示"信息审核没通过,请耐心等待"
handleGetDetails() {
let self = this;
self._post(
'ground.group/getGroupDetails',
{ id: self.id },
result => {
self.info = result.data;
},
false,
() => {
}
);
},
// 检测是否填写过表单信息,没有的话需要跳转到信息完善页面
// 测试:默认 true 弹出购买弹窗。如果为 false 弹出提示完善信息弹窗
const hasFilledInfo = true;
if (!hasFilledInfo) {
this.showInfoModal = true;
handleSubmit() {
let self = this;
//TODO 如果信息审核没有通过uni.showToast提示"信息审核没通过,请耐心等待"
// 成人卡不需要提交资料
if (self.id == 2) {
self.showBuyModal = true;
} else {
// 已经填写过信息,弹出开通会员弹窗
this.showBuyModal = true;
self._post(
'ground.group/getGroupData',
null,
result => {
if (!result.data) {
// 没有填写过信息,弹出完善信息提示弹窗
self.showInfoModal = true;
return false;
}
if (result.data.status == 0) {
uni.showToast({ title: '信息审核中,请耐心等待', icon: 'none' });
}
if (result.data.status == 2) {
uni.showToast({ title: '审核失败,请重新提交', icon: 'none' });
}
if (result.data.status == 1) {
// 已经审核通过,弹出开通会员弹窗
self.showBuyModal = true;
}
},
false,
() => {
}
);
// const hasFilledInfo = true;
// if (!hasFilledInfo) {
// self.showInfoModal = true;
// } else {
// // 已经填写过信息,弹出开通会员弹窗
// self.showBuyModal = true;
// }
}
},
closeInfoModal() {
@ -239,7 +235,7 @@ export default {
goToFillInfo() {
this.showInfoModal = false;
uni.navigateTo({
url: '/bundle/combo/info?type=' + this.comboType
url: '/bundle/combo/info?id=' + this.id
});
},
closeBuyModal() {
@ -329,16 +325,14 @@ page {
justify-content: flex-end;
align-items: center;
.diamond {
width: 26rpx;
height: 20rpx;
margin-right: 6rpx;
}
}
}
.nav-header {
position: relative;
position: absolute;
top: 0;
left: 0;
z-index: 1;
width: 100%;
@ -480,6 +474,7 @@ page {
bottom: 0;
left: 0;
width: 100%;
z-index: 99;
background-color: #fff;
padding: 20rpx 40rpx 60rpx;
box-sizing: border-box;
@ -621,7 +616,7 @@ page {
margin-bottom: 40rpx;
.plan-item {
width: 31%;
width: 48%;
border: 2rpx solid #EEEEEE;
border-radius: 12rpx;
padding: 38rpx 0;
@ -769,4 +764,17 @@ page {
margin-top: 40rpx;
}
}
.info-name {
font-weight: bold;
font-size: 32rpx;
color: #834B08;
line-height: 44rpx;
}
.diamond {
width: 26rpx;
height: 20rpx;
margin-right: 6rpx;
}
</style>