6989ade3e2
1. 分销规则： - 链接带ID绑定推荐关系 - 一级分销 + 30天有效期 - 客户抢夺机制（过期可被抢走） - 90%收益归分发者 2. 新增统计数据： - 绑定用户数 - 链接进入人数 - 带来付款人数 3. 微信支付： - 添加点击反馈 - 优化支付流程日志 - 改善错误提示 4. 分销中心UI优化
217 lines
8.8 KiB
Plaintext
217 lines
8.8 KiB
Plaintext
<!--分销中心 - 按照Web版本1:1还原-->
|
||
<view class="page">
|
||
<!-- 导航栏 -->
|
||
<view class="nav-bar" style="padding-top: {{statusBarHeight}}px;">
|
||
<view class="nav-back" bindtap="goBack">
|
||
<text class="back-icon">‹</text>
|
||
</view>
|
||
<text class="nav-title">推广中心</text>
|
||
<view class="nav-right">
|
||
<view class="nav-btn" bindtap="showNotification">🔔</view>
|
||
<view class="nav-btn" bindtap="showSettings">⚙️</view>
|
||
</view>
|
||
</view>
|
||
<view style="height: {{statusBarHeight + 44}}px;"></view>
|
||
|
||
<view class="content">
|
||
<!-- 过期提醒横幅 -->
|
||
<view class="expiring-banner" wx:if="{{expiringCount > 0}}">
|
||
<view class="banner-icon">⚠️</view>
|
||
<view class="banner-content">
|
||
<text class="banner-title">{{expiringCount}} 位用户绑定即将过期</text>
|
||
<text class="banner-desc">30天内未付款将解除绑定关系</text>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 收益卡片 -->
|
||
<view class="earnings-card">
|
||
<view class="earnings-bg"></view>
|
||
<view class="earnings-main">
|
||
<view class="earnings-header">
|
||
<view class="earnings-left">
|
||
<view class="wallet-icon">💰</view>
|
||
<view class="earnings-info">
|
||
<text class="earnings-label">累计收益</text>
|
||
<text class="commission-rate">{{shareRate}}% 返利</text>
|
||
</view>
|
||
</view>
|
||
<view class="earnings-right">
|
||
<text class="earnings-value">¥{{earnings}}</text>
|
||
<text class="pending-text">待结算: ¥{{pendingEarnings}}</text>
|
||
</view>
|
||
</view>
|
||
<view class="earnings-detail">
|
||
<text class="detail-item">已提现: ¥{{withdrawnEarnings}}</text>
|
||
</view>
|
||
<view class="withdraw-btn {{pendingEarnings < 10 ? 'btn-disabled' : ''}}" bindtap="handleWithdraw">
|
||
{{pendingEarnings < 10 ? '满10元可提现' : '申请提现'}}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 核心数据统计（重点可见数据） -->
|
||
<view class="stats-grid">
|
||
<view class="stat-card highlight">
|
||
<text class="stat-value brand">{{bindingCount}}</text>
|
||
<text class="stat-label">绑定用户数</text>
|
||
<text class="stat-tip">当前有效绑定</text>
|
||
</view>
|
||
<view class="stat-card">
|
||
<text class="stat-value">{{visitCount}}</text>
|
||
<text class="stat-label">链接进入人数</text>
|
||
<text class="stat-tip">通过你的链接进入</text>
|
||
</view>
|
||
<view class="stat-card highlight">
|
||
<text class="stat-value gold">{{paidCount}}</text>
|
||
<text class="stat-label">付款人数</text>
|
||
<text class="stat-tip">成功转化购买</text>
|
||
</view>
|
||
<view class="stat-card">
|
||
<text class="stat-value orange">{{expiringCount}}</text>
|
||
<text class="stat-label">即将过期</text>
|
||
<text class="stat-tip">7天内到期</text>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 推广规则 -->
|
||
<view class="rules-card">
|
||
<view class="rules-header">
|
||
<view class="rules-icon">📋</view>
|
||
<text class="rules-title">推广规则</text>
|
||
</view>
|
||
<view class="rules-list">
|
||
<text class="rule-item">• <text class="brand">链接带ID</text>：谁发的链接，进的人就绑谁</text>
|
||
<text class="rule-item">• <text class="brand">一级、一月</text>：只有一级分销，绑定有效期30天</text>
|
||
<text class="rule-item">• <text class="orange">长期不发</text>：别人发得多，过期后客户会被「抢走」</text>
|
||
<text class="rule-item">• <text class="gold">每天发</text>：持续发的人绑定续期，收益越来越高</text>
|
||
<text class="rule-item">• <text class="brand">{{shareRate}}%给分发</text>：好友付款后，你得 {{shareRate}}% 收益</text>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 绑定用户列表 -->
|
||
<view class="binding-card">
|
||
<view class="binding-header" bindtap="toggleBindingList">
|
||
<view class="binding-title">
|
||
<text class="binding-icon">👥</text>
|
||
<text class="title-text">绑定用户</text>
|
||
<text class="binding-count">({{totalBindings}})</text>
|
||
</view>
|
||
<text class="toggle-icon">{{showBindingList ? '▲' : '▼'}}</text>
|
||
</view>
|
||
|
||
<block wx:if="{{showBindingList}}">
|
||
<!-- Tab切换 -->
|
||
<view class="binding-tabs">
|
||
<view
|
||
class="tab-item {{activeTab === 'active' ? 'tab-active' : ''}}"
|
||
bindtap="switchTab"
|
||
data-tab="active"
|
||
>绑定中 ({{activeBindings.length}})</view>
|
||
<view
|
||
class="tab-item {{activeTab === 'converted' ? 'tab-active' : ''}}"
|
||
bindtap="switchTab"
|
||
data-tab="converted"
|
||
>已付款 ({{convertedBindings.length}})</view>
|
||
<view
|
||
class="tab-item {{activeTab === 'expired' ? 'tab-active' : ''}}"
|
||
bindtap="switchTab"
|
||
data-tab="expired"
|
||
>已过期 ({{expiredBindings.length}})</view>
|
||
</view>
|
||
|
||
<!-- 用户列表 -->
|
||
<view class="binding-list">
|
||
<block wx:if="{{currentBindings.length === 0}}">
|
||
<view class="empty-state">
|
||
<text class="empty-icon">👤</text>
|
||
<text class="empty-text">暂无用户</text>
|
||
</view>
|
||
</block>
|
||
<block wx:else>
|
||
<view
|
||
class="binding-item"
|
||
wx:for="{{currentBindings}}"
|
||
wx:key="id"
|
||
>
|
||
<view class="user-avatar {{item.status === 'converted' ? 'avatar-converted' : item.status === 'expired' ? 'avatar-expired' : ''}}">
|
||
<text wx:if="{{item.status === 'converted'}}">✓</text>
|
||
<text wx:elif="{{item.status === 'expired'}}">⏰</text>
|
||
<text wx:else>{{item.nickname[0] || '用'}}</text>
|
||
</view>
|
||
<view class="user-info">
|
||
<text class="user-name">{{item.nickname || '匿名用户'}}</text>
|
||
<text class="user-time">绑定于 {{item.bindingDate}}</text>
|
||
</view>
|
||
<view class="user-status">
|
||
<block wx:if="{{item.status === 'converted'}}">
|
||
<text class="status-amount">+¥{{item.commission}}</text>
|
||
<text class="status-order">订单 ¥{{item.orderAmount}}</text>
|
||
</block>
|
||
<block wx:else>
|
||
<text class="status-tag {{item.daysRemaining <= 3 ? 'tag-red' : item.daysRemaining <= 7 ? 'tag-orange' : 'tag-green'}}">
|
||
{{item.status === 'expired' ? '已过期' : item.daysRemaining + '天'}}
|
||
</text>
|
||
</block>
|
||
</view>
|
||
</view>
|
||
</block>
|
||
</view>
|
||
</block>
|
||
</view>
|
||
|
||
<!-- 分享按钮 -->
|
||
<view class="share-section">
|
||
<view class="share-item" bindtap="generatePoster">
|
||
<view class="share-icon poster">🖼️</view>
|
||
<view class="share-info">
|
||
<text class="share-title">生成推广海报</text>
|
||
<text class="share-desc">一键生成精美海报分享</text>
|
||
</view>
|
||
<text class="share-arrow">→</text>
|
||
</view>
|
||
|
||
<button class="share-item share-btn-wechat" open-type="share">
|
||
<view class="share-icon wechat">💬</view>
|
||
<view class="share-info">
|
||
<text class="share-title">分享给好友</text>
|
||
<text class="share-desc">直接发送小程序卡片</text>
|
||
</view>
|
||
<text class="share-arrow">→</text>
|
||
</button>
|
||
|
||
<view class="share-item" bindtap="shareToMoments">
|
||
<view class="share-icon link">📝</view>
|
||
<view class="share-info">
|
||
<text class="share-title">复制朋友圈文案</text>
|
||
<text class="share-desc">一键复制推广文案</text>
|
||
</view>
|
||
<text class="share-arrow">→</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 海报生成弹窗 -->
|
||
<view class="modal-overlay" wx:if="{{showPosterModal}}" bindtap="closePosterModal">
|
||
<view class="modal-content poster-modal" catchtap="stopPropagation">
|
||
<view class="modal-header">
|
||
<text class="modal-title">推广海报</text>
|
||
<view class="modal-close" bindtap="closePosterModal">✕</view>
|
||
</view>
|
||
|
||
<!-- 海报预览 -->
|
||
<view class="poster-preview">
|
||
<canvas canvas-id="promoPosterCanvas" class="poster-canvas" style="width: 300px; height: 450px;"></canvas>
|
||
</view>
|
||
|
||
<view class="poster-actions">
|
||
<view class="poster-btn btn-save" bindtap="savePoster">
|
||
<text class="btn-icon">💾</text>
|
||
<text>保存到相册</text>
|
||
</view>
|
||
</view>
|
||
|
||
<text class="poster-tip">保存后可分享到朋友圈或发送给好友</text>
|
||
</view>
|
||
</view>
|
||
</view>
|