feat: 样式调整
This commit is contained in:
Blizzard
+7
-8
@@ -77,20 +77,19 @@ Page({
|
||||
if (res.code === 200 && res.data) {
|
||||
var cfg = res.data
|
||||
// 后端单位：分 → 元
|
||||
var price = cfg.discountedPrice > 0 ? (cfg.discountedPrice / 100).toFixed(2) : (cfg.price / 100).toFixed(2)
|
||||
var originalPrice = cfg.price > 0 ? (cfg.price / 100).toFixed(2) : ''
|
||||
var originalPriceYuan = (cfg.price / 100).toFixed(2)
|
||||
var hasDiscount = cfg.discountedPrice > 0 && cfg.discountedPrice < cfg.price
|
||||
var payPrice = hasDiscount ? (cfg.discountedPrice / 100).toFixed(2) : originalPriceYuan
|
||||
self.setData({
|
||||
currentPrice: price,
|
||||
vipPrice: price,
|
||||
vipOriginalPrice: hasDiscount ? originalPrice : '',
|
||||
currentPrice: payPrice,
|
||||
vipPrice: payPrice,
|
||||
vipOriginalPrice: hasDiscount ? originalPriceYuan : '',
|
||||
vipRemark: cfg.remark || ''
|
||||
})
|
||||
}
|
||||
}).catch(function (err) {
|
||||
console.error('[VIP] 获取配置失败:', err)
|
||||
// 容错：使用默认价格
|
||||
self.setData({ currentPrice: '19.90', vipPrice: '19.90', vipOriginalPrice: '29.90' })
|
||||
self.setData({ currentPrice: '--', vipPrice: '--', vipOriginalPrice: '' })
|
||||
})
|
||||
},
|
||||
|
||||
@@ -103,7 +102,7 @@ Page({
|
||||
/** 选择套餐 */
|
||||
selectPlan(e) {
|
||||
const plan = e.currentTarget.dataset.plan
|
||||
let price = '19.9'
|
||||
let price = this.data.vipPrice || '--'
|
||||
if (this.data.mode === 'channel') {
|
||||
const map = {
|
||||
monthly: this.data.monthlyPrice,
|
||||
|
||||
+30
-6
@@ -82,17 +82,31 @@
|
||||
</view>
|
||||
<view class="benefits-grid">
|
||||
<view class="benefit-item">
|
||||
<text class="benefit-check">✅</text>
|
||||
<text class="benefit-check">🔓</text>
|
||||
<view class="benefit-info">
|
||||
<text class="benefit-name">全频道特权</text>
|
||||
<text class="benefit-name">全频道解锁</text>
|
||||
<text class="benefit-desc">所有频道自由听</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="benefit-item">
|
||||
<text class="benefit-check">🎧</text>
|
||||
<view class="benefit-info">
|
||||
<text class="benefit-name">纯净免广告</text>
|
||||
<text class="benefit-desc">收听无任何打扰</text>
|
||||
<text class="benefit-name">免广告收听</text>
|
||||
<text class="benefit-desc">纯净无打扰体验</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="benefit-item">
|
||||
<text class="benefit-check">⭐</text>
|
||||
<view class="benefit-info">
|
||||
<text class="benefit-name">优先推送</text>
|
||||
<text class="benefit-desc">新内容第一时间送达</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="benefit-item">
|
||||
<text class="benefit-check">💬</text>
|
||||
<view class="benefit-info">
|
||||
<text class="benefit-name">互动评论</text>
|
||||
<text class="benefit-desc">与创作者直接交流</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -110,7 +124,7 @@
|
||||
<view wx:if="{{vipOriginalPrice}}" class="plan-badge">限时特惠</view>
|
||||
<view class="plan-info">
|
||||
<text class="plan-name">永久会员</text>
|
||||
<text class="plan-desc">{{vipRemark || '一次购买，永久畅听全部频道'}}</text>
|
||||
<text class="plan-desc">一次购买，永久畅听全部频道</text>
|
||||
</view>
|
||||
<view class="plan-price">
|
||||
<text class="price-amount"><text class="price-symbol">¥</text>{{vipPrice || currentPrice}}</text>
|
||||
@@ -118,6 +132,11 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- VIP 提示（来自后端 remark） -->
|
||||
<view wx:if="{{vipRemark}}" class="subscribe-disclaimer">
|
||||
<text class="disclaimer-text">{{vipRemark}}</text>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!-- ────── MODE: 频道订阅 ────── -->
|
||||
@@ -211,6 +230,11 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 订阅免责提示 -->
|
||||
<view class="subscribe-disclaimer">
|
||||
<text class="disclaimer-text">声音产品属于虚拟数字内容，订阅成功后不支持退款及转让。感谢你对原创声音的支持，愿这段旅程让你觉得物超所值。</text>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
</scroll-view>
|
||||
@@ -231,7 +255,7 @@
|
||||
block
|
||||
size="large"
|
||||
bind:tap="onPay"
|
||||
style="--td-button-primary-bg-color: #FF9D42; --td-button-primary-active-bg-color: #E88A35;"
|
||||
style="--td-button-primary-bg-color: #FF9E6D; --td-button-primary-active-bg-color: #E88A35;"
|
||||
>
|
||||
{{mode === 'channel' ? '立即订阅并支付' : '立即开通并支付'}}
|
||||
</t-button>
|
||||
|
||||
+17
-2
@@ -5,7 +5,7 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
background: #FCFCFC;
|
||||
background: var(--color-bg-page);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@@ -312,7 +312,7 @@
|
||||
border-radius: 0 20rpx 0 20rpx;
|
||||
}
|
||||
.plan-badge-hot {
|
||||
background: linear-gradient(135deg, #FF9D42, #FF7832);
|
||||
background: linear-gradient(135deg, #FF9E6D, #FF7832);
|
||||
color: #FFF;
|
||||
}
|
||||
.plan-badge-save {
|
||||
@@ -398,3 +398,18 @@
|
||||
border-radius: 4rpx;
|
||||
margin-left: 8rpx;
|
||||
}
|
||||
|
||||
/* 订阅免责提示 */
|
||||
.subscribe-disclaimer {
|
||||
margin: 32rpx 32rpx 24rpx;
|
||||
padding: 24rpx 28rpx;
|
||||
background: #F9F9F9;
|
||||
border-radius: 16rpx;
|
||||
border: 1rpx solid #F0F0F0;
|
||||
}
|
||||
.disclaimer-text {
|
||||
font-size: 22rpx;
|
||||
color: #B0B0B0;
|
||||
line-height: 1.7;
|
||||
letter-spacing: 0.5rpx;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user