luo/device-voice-h5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 只要任意一张实名了就可以不强制跳
All checks were successful
构建并部署前端到生产环境 / build-and-deploy (push) Successful in 56s
Details

Browse Source
This commit is contained in:
luo
2026-07-29 17:49:25 +08:00
parent b95daedba6
commit 863a34f74c
2 changed files with 110 additions and 90 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
components/RenewalPaymentPopup.vue
View File

@@ -255,12 +255,13 @@
<style scoped lang="scss">
.renewal-popup {
width: 620rpx;
width: 600rpx;
max-width: calc(100vw - 80rpx);
padding: 32rpx;
padding: 0;
box-sizing: border-box;
background: #fff;
border-radius: 24rpx;
overflow: hidden;
}
.popup-header,
@@ -272,63 +273,72 @@
.popup-header {
justify-content: space-between;
padding: 30rpx;
border-bottom: 1rpx solid var(--border-light);
}
.popup-title {
color: var(--text-primary);
font-size: 34rpx;
font-size: 32rpx;
font-weight: 600;
}
.popup-close {
width: 52rpx;
height: 52rpx;
width: 48rpx;
height: 48rpx;
color: var(--text-tertiary);
font-size: 44rpx;
line-height: 46rpx;
font-size: 40rpx;
line-height: 48rpx;
text-align: center;
}
.package-summary {
margin-top: 28rpx;
padding: 22rpx;
background: var(--bg-secondary);
border-radius: 14rpx;
padding: 40rpx 30rpx 30rpx;
background: linear-gradient(135deg, rgba(0, 122, 255, 0.05) 0%, rgba(0, 122, 255, 0.02) 100%);
border-bottom: 1rpx solid var(--border-light);
text-align: center;
}
.summary-label {
color: var(--text-tertiary);
font-size: 24rpx;
font-size: 22rpx;
}
.summary-name {
margin-top: 8rpx;
margin: 20rpx 0 0;
color: var(--text-primary);
font-size: 30rpx;
font-weight: 600;
line-height: 1.5;
font-size: 32rpx;
font-weight: 700;
line-height: 1.4;
}
.payment-methods {
margin-top: 24rpx;
padding: 30rpx;
}
.method-item {
display: flex;
align-items: center;
justify-content: space-between;
padding: 22rpx 0;
border-bottom: 1rpx solid var(--border-light);
padding: 24rpx;
margin-bottom: 20rpx;
border: 2rpx solid var(--border-light);
border-radius: var(--radius-medium);
transition: all 0.3s;
&.active .method-name { color: var(--primary); }
}
&:last-child { margin-bottom: 0; }
.method-left { gap: 16rpx; }
&.active {
border-color: var(--primary);
background: rgba(0, 122, 255, 0.05);
}
}
.method-left { gap: 20rpx; }
.method-icon {
width: 44rpx;
height: 44rpx;
border-radius: 10rpx;
width: 64rpx;
height: 64rpx;
}
.method-badge {
@@ -345,26 +355,41 @@
.method-name { color: var(--text-primary); font-size: 28rpx; }
.method-radio {
width: 32rpx;
height: 32rpx;
border: 2rpx solid var(--border-light);
width: 36rpx;
height: 36rpx;
border: 2rpx solid var(--gray-400);
border-radius: 50%;
position: relative;
&.checked {
border: 8rpx solid var(--primary);
border-color: var(--primary);
background: var(--primary);
&::after {
content: '✓';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: #fff;
font-size: 20rpx;
font-weight: 700;
}
}
}
.method-empty {
padding: 28rpx 0;
padding: 28rpx;
color: var(--text-tertiary);
font-size: 26rpx;
text-align: center;
}
.popup-footer {
display: flex;
padding: 30rpx;
gap: 20rpx;
margin-top: 28rpx;
border-top: 1rpx solid var(--border-light);
button {
flex: 1;

113
pages/package-order/package-order.vue
View File

@@ -14,31 +14,30 @@
<view v-if="packageList.length === 0 && !loading" class="empty-state">
<image class="empty-icon" src="/static/shop.png" mode="aspectFit" alt="套餐订购"></image>
<view class="empty-title">暂无{{ activePackageType === 'formal' ? '正式' : '附加' }}套餐</view>
<view class="empty-title">暂无{{ activePackageType === 'formal' ? '正式套餐' : '加油包' }}</view>
<view class="empty-desc">当前资产暂无适用的套餐</view>
</view>
<view class="card package-card" v-for="item in packageList" :key="item.package_id">
<view class="package-header">
<view class="package-name">{{ item.package_name }}</view>
<view v-if="item.is_renewal" class="package-tag">续费套餐</view>
<view class="package-header-meta">
<view v-if="item.is_renewal" class="package-tag">续费套餐</view>
<view class="package-validity">{{ formatValidity(item.validity_days) }}</view>
</view>
</view>
<view class="package-main">
<view class="data-block">
<view class="data-label">套餐流量</view>
<view class="data-label">可用流量</view>
<view class="package-data">{{ formatData(item.data_allowance, item.data_unit) }}</view>
</view>
<view class="validity-box">
<view class="validity-value">{{ item.validity_days }}</view>
<view class="validity-label">天有效期</view>
</view>
</view>
<view class="package-desc" v-if="item.description">{{ item.description }}</view>
<view class="package-footer">
<view class="price-block">
<text class="price-symbol">¥</text>
<text class="package-price">{{ formatPackagePrice(item.retail_price) }}</text>
</view>
</view>
<view class="package-desc" v-if="item.description">{{ item.description }}</view>
<view class="package-footer">
<view class="btn">
<up-button type="primary" size="small" @click="buyPackage(item)">立即订购</up-button>
</view>
@@ -57,13 +56,13 @@
<view class="summary-price">¥{{ formatPackagePrice(currentPackage?.retail_price) }}</view>
<view class="summary-details">
<view class="detail-item">
<text class="detail-label">套餐流量</text>
<text class="detail-label">可用流量</text>
<text class="detail-value">{{ formatData(currentPackage?.data_allowance, currentPackage?.data_unit) }}</text>
</view>
<view class="detail-divider"></view>
<view class="detail-item">
<text class="detail-label">有效期</text>
<text class="detail-value">{{ currentPackage?.validity_days }} 天</text>
<text class="detail-value">{{ formatValidity(currentPackage?.validity_days) }}</text>
</view>
</view>
</view>
@@ -127,7 +126,7 @@
const activePackageType = ref('formal');
const packageTypeTabs = [
{ label: '正式套餐', value: 'formal' },
{ label: '附加套餐', value: 'addon' }
{ label: '加油包', value: 'addon' }
];
let assetTypePromise = null;
let packageRequestId = 0;
@@ -135,13 +134,18 @@
const formatData = (allowance, unit) => {
if (unit === 'MB') {
return allowance >= 1024 ? `${(allowance / 1024).toFixed(0)} GB` : `${allowance} MB`;
return allowance >= 1024 ? `${(allowance / 1024).toFixed(0)}GB` : `${allowance}MB`;
}
return `${allowance} ${unit}`;
return `${allowance}${unit}`;
};
const formatPackagePrice = (amount) => amount === null || amount === undefined ? '-' : formatMoney(amount);
const formatValidity = (days) => {
const value = String(days ?? '').trim();
return value && value !== '-' ? `${value}天有效` : '有效期未知';
};
const isPaymentMethodAvailable = (method) => {
return paymentMethodOptions.value.some((item) => item.value === method);
};
@@ -586,8 +590,14 @@
flex: 1;
}
.package-tag {
.package-header-meta {
flex-shrink: 0;
display: flex;
align-items: center;
gap: 8rpx;
}
.package-tag {
padding: 6rpx 12rpx;
background: var(--gray-100);
color: var(--gray-700);
@@ -596,6 +606,16 @@
font-weight: 600;
border: none;
}
.package-validity {
padding: 8rpx 12rpx;
border-radius: var(--radius-small);
background: rgba(10, 132, 255, 0.1);
color: var(--primary-dark);
font-size: 22rpx;
font-weight: 600;
white-space: nowrap;
}
}
.package-main {
@@ -628,50 +648,13 @@
letter-spacing: -1rpx;
}
.validity-box {
min-width: 116rpx;
.price-block {
min-width: 150rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 16rpx 18rpx;
background: rgba(255, 255, 255, 0.8);
border: 1rpx solid rgba(10, 132, 255, 0.1);
border-radius: 14rpx;
.validity-value {
font-size: 32rpx;
font-weight: 700;
color: var(--text-primary);
line-height: 1;
}
.validity-label {
font-size: 22rpx;
color: var(--text-tertiary);
margin-top: 8rpx;
}
}
}
.package-desc {
font-size: 24rpx;
color: var(--text-secondary);
line-height: 1.5;
margin-bottom: 22rpx;
}
.package-footer {
display: flex;
align-items: center;
justify-content: space-between;
gap: 24rpx;
padding-top: 22rpx;
border-top: 1rpx solid var(--gray-100);
.price-block {
display: flex;
align-items: baseline;
padding-left: 24rpx;
border-left: 1rpx solid rgba(10, 132, 255, 0.18);
color: var(--primary-dark);
white-space: nowrap;
@@ -687,10 +670,22 @@
letter-spacing: -1rpx;
}
}
}
.package-desc {
font-size: 24rpx;
color: var(--text-secondary);
line-height: 1.5;
margin-bottom: 22rpx;
}
.package-footer {
display: block;
padding-top: 22rpx;
border-top: 1rpx solid var(--gray-100);
.btn {
flex-shrink: 0;
min-width: 180rpx;
width: 100%;
}
}
}