sundynix/sundynix-radio-mp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
Blizzard
2026-03-05 09:08:21 +08:00
commit 0a61c4ddec
2189 changed files with 38610 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/vip/index.wxml
+209
View File
@@ -0,0 +1,209 @@
<!-- 会员/订阅中心 -->
<page-meta page-style="overflow: hidden;" />
<view class="vip-page">
<!-- ── 已是VIP，直接返回 ── -->
<view wx:if="{{isVip && mode === 'vip'}}" class="vip-done">
<text class="vip-done-icon">👑</text>
<text class="vip-done-title">您已经是全频道会员</text>
<text class="vip-done-desc">畅享全部频道，尊享专属权益</text>
<button class="done-back-btn" bindtap="goBack">返回</button>
</view>
<!-- ── 主Scroll区域 ── -->
<scroll-view
wx:else
scroll-y
enhanced
show-scrollbar="{{false}}"
class="vip-scroll"
>
<!-- 头部区域，根据模式切换文案 -->
<view class="vip-hero">
<text class="vip-hero-title">{{mode === 'channel' ? channelName : '开通全频道会员'}}</text>
<text class="vip-hero-desc">
{{mode === 'channel' ? '选择适合你的订阅方案，随时随地收听' : '解锁全部频道，告别无聊早晨'}}
</text>
</view>
<!-- ────── MODE: VIP 全频道 ────── -->
<block wx:if="{{mode === 'vip'}}">
<!-- 权益卡片 -->
<view class="benefits-card-wrap">
<view class="card benefits-card">
<view class="benefits-title">
<text class="benefit-crown">👑</text>
<text>会员专属特权</text>
</view>
<view class="benefits-grid">
<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 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>
</view>
</view>
<!-- 套餐 -->
<view class="plan-section">
<text class="plan-title">选择套餐</text>
<view
class="plan-card {{selectedPlan === 'vip-all' ? 'selected' : ''}}"
bindtap="selectPlan"
data-plan="vip-all"
>
<view wx:if="{{selectedPlan === 'vip-all'}}" class="plan-badge">限时特惠</view>
<view class="plan-info">
<text class="plan-name">全频道连续包月</text>
<text class="plan-desc">自动续费，随时可取消</text>
</view>
<view class="plan-price">
<text class="price-amount"><text class="price-symbol">¥</text>19.9</text>
<text class="price-original">¥29.9</text>
</view>
</view>
</view>
</block>
<!-- ────── MODE: 频道订阅 ────── -->
<block wx:else>
<!-- 权益说明 -->
<view class="benefits-card-wrap">
<view class="card benefits-card">
<view class="benefits-title">
<text class="benefit-crown">🎙️</text>
<text>订阅后专属权益</text>
</view>
<view class="benefit-item" style="width:100%; margin-bottom:16rpx;">
<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" style="width:100%; margin-bottom:16rpx;">
<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" style="width:100%;">
<text class="benefit-check">🎧</text>
<view class="benefit-info">
<text class="benefit-name">后台播放，不中断</text>
<text class="benefit-desc">边听边做其他事</text>
</view>
</view>
</view>
</view>
<!-- 价格套餐 -->
<view class="plan-section">
<text class="plan-title">选择方案</text>
<!-- 包月 -->
<view
wx:if="{{monthlyPrice > 0}}"
class="plan-card {{selectedPlan === 'monthly' ? 'selected' : ''}}"
bindtap="selectPlan"
data-plan="monthly"
>
<view class="plan-info">
<text class="plan-name">包月</text>
<text class="plan-desc">按月订阅，随时取消</text>
</view>
<view class="plan-price">
<text class="price-amount"><text class="price-symbol">¥</text>{{monthlyPrice}}</text>
<text class="price-original">/ 月</text>
</view>
</view>
<!-- 包季 -->
<view
wx:if="{{quarterlyPrice > 0}}"
class="plan-card {{selectedPlan === 'quarterly' ? 'selected' : ''}}"
bindtap="selectPlan"
data-plan="quarterly"
>
<view wx:if="{{_quarterlySaving > 0}}" class="plan-badge plan-badge-save">省{{_quarterlySaving}}元</view>
<view class="plan-info">
<text class="plan-name">包季</text>
<text class="plan-desc">约¥{{_quarterlyMonthly}}/月，比包月更划算</text>
</view>
<view class="plan-price">
<text class="price-amount"><text class="price-symbol">¥</text>{{quarterlyPrice}}</text>
<text class="price-original">/ 季</text>
</view>
</view>
<!-- 包年 -->
<view
wx:if="{{annualPrice > 0}}"
class="plan-card {{selectedPlan === 'annual' ? 'selected' : ''}}"
bindtap="selectPlan"
data-plan="annual"
>
<view class="plan-badge plan-badge-hot">最受欢迎</view>
<view wx:if="{{_annualSaving > 0}}" class="plan-badge plan-badge-save" style="right: 96rpx;">省{{_annualSaving}}元</view>
<view class="plan-info">
<text class="plan-name">包年</text>
<text class="plan-desc">约¥{{_annualMonthly}}/月，最优惠</text>
</view>
<view class="plan-price">
<text class="price-amount"><text class="price-symbol">¥</text>{{annualPrice}}</text>
<text class="price-original">/ 年</text>
</view>
</view>
</view>
</block>
</scroll-view>
<!-- 底部支付栏（scroll-view 外，flex 布局固定底部，真机可靠） -->
<view class="pay-bar" wx:if="{{!isVip || mode === 'channel'}}">
<view class="pay-summary">
<text class="pay-label">总计：</text>
<text class="pay-amount">¥{{currentPrice}}</text>
</view>
<view class="pay-method">
<text class="pay-method-text">使用 微信支付 支付</text>
<text class="wechat-check">✓</text>
</view>
<t-button
theme="primary"
shape="round"
block
size="large"
bind:tap="onPay"
style="--td-button-primary-bg-color: #FF9D42; --td-button-primary-active-bg-color: #E88A35;"
>
{{mode === 'channel' ? '立即订阅并支付' : '立即开通并支付'}}
</t-button>
</view>
</view>