324 lines
12 KiB
Plaintext
324 lines
12 KiB
Plaintext
<!--pages/my/my.wxml-->
|
|
<!--Soul创业实验 - 我的页面 1:1还原Web版本-->
|
|
<view class="page page-transition">
|
|
<!-- 自定义导航栏 -->
|
|
<view class="nav-bar" style="padding-top: {{statusBarHeight}}px;">
|
|
<view class="nav-content">
|
|
<text class="nav-title-left brand-color">我的</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 导航栏占位 -->
|
|
<view class="nav-placeholder" style="height: {{statusBarHeight + 44}}px;"></view>
|
|
|
|
<!-- 用户卡片 - 未登录：假资料界面，名字旁点击登录打开弹窗 -->
|
|
<view class="user-card card-gradient" wx:if="{{!isLoggedIn}}">
|
|
<view class="user-header-row">
|
|
<view class="avatar avatar-placeholder">
|
|
<image class="avatar-img" wx:if="{{guestAvatar}}" src="{{guestAvatar}}" mode="aspectFill"/>
|
|
<text class="avatar-text" wx:else>{{guestNickname[0] || '游'}}</text>
|
|
</view>
|
|
<view class="user-info-block">
|
|
<view class="user-name-row">
|
|
<text class="user-name">{{guestNickname}}</text>
|
|
<view class="btn-login-inline" bindtap="showLogin">点击登录</view>
|
|
</view>
|
|
<view class="user-id-row">
|
|
<text class="user-id user-id-guest">登录后查看完整信息</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="stats-grid">
|
|
<view class="stat-item">
|
|
<text class="stat-value brand-color">--</text>
|
|
<text class="stat-label">已读章节</text>
|
|
</view>
|
|
<view class="stat-item">
|
|
<text class="stat-value brand-color">--</text>
|
|
<text class="stat-label">推荐好友</text>
|
|
</view>
|
|
<view class="stat-item">
|
|
<text class="stat-value gold-color">--</text>
|
|
<text class="stat-label">待领收益</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 用户卡片 - 已登录状态 -->
|
|
<view class="user-card card-gradient" wx:else>
|
|
<view class="user-header-row">
|
|
<!-- 头像 - 点击选择头像 -->
|
|
<button class="avatar-btn-simple" open-type="chooseAvatar" bindchooseavatar="onChooseAvatar">
|
|
<view class="avatar">
|
|
<image class="avatar-img" wx:if="{{userInfo.avatar}}" src="{{userInfo.avatar}}" mode="aspectFill"/>
|
|
<text class="avatar-text" wx:else>{{userInfo.nickname[0] || '用'}}</text>
|
|
</view>
|
|
</button>
|
|
|
|
<!-- 用户信息 -->
|
|
<view class="user-info-block">
|
|
<view class="user-name-row">
|
|
<text class="user-name" bindtap="editNickname">{{userInfo.nickname || '点击设置昵称'}}</text>
|
|
</view>
|
|
<view class="user-id-row" bindtap="copyUserId">
|
|
<text class="user-id">ID: {{userIdShort}}</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 创业伙伴按钮 - inline 在同一行 -->
|
|
<view class="margin-partner-badge">
|
|
<view class="partner-badge">
|
|
<text class="partner-icon">⭐</text>
|
|
<text class="partner-text">创业伙伴</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="stats-grid">
|
|
<view class="stat-item">
|
|
<text class="stat-value brand-color">{{readCount}}</text>
|
|
<text class="stat-label">已读章节</text>
|
|
</view>
|
|
<view class="stat-item">
|
|
<text class="stat-value brand-color">{{referralCount}}</text>
|
|
<text class="stat-label">推荐好友</text>
|
|
</view>
|
|
<view class="stat-item">
|
|
<text class="stat-value gold-color">{{pendingEarnings > 0 ? '¥' + pendingEarnings : '--'}}</text>
|
|
<text class="stat-label">待领收益</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 收益卡片 - 艺术化设计 - 仅登录用户显示 -->
|
|
<view class="earnings-card" wx:if="{{isLoggedIn}}">
|
|
<!-- 背景装饰圆 -->
|
|
<view class="bg-decoration bg-decoration-gold"></view>
|
|
<view class="bg-decoration bg-decoration-brand"></view>
|
|
|
|
<view class="earnings-content">
|
|
<!-- 标题行：右侧为刷新图标 -->
|
|
<view class="earnings-header">
|
|
<view class="earnings-title-wrap">
|
|
<text class="earnings-icon">💰</text>
|
|
<text class="earnings-title">我的收益</text>
|
|
</view>
|
|
<view class="earnings-refresh-wrap" bindtap="refreshEarnings">
|
|
<text class="earnings-refresh-icon {{earningsRefreshing ? 'earnings-refresh-spin' : ''}}">↻</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 收益数据：加载中显示 - 占位 -->
|
|
<view class="earnings-data">
|
|
<view class="earnings-main">
|
|
<text class="earnings-label">累计收益</text>
|
|
<text class="earnings-amount-large gold-gradient">{{earningsLoading ? '-' : '¥' + earnings}}</text>
|
|
</view>
|
|
<view class="earnings-secondary">
|
|
<text class="earnings-label">可提现</text>
|
|
<text class="earnings-amount-medium">{{earningsLoading ? '-' : '¥' + pendingEarnings}}</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 操作按钮 -->
|
|
<view class="earnings-action" bindtap="goToReferral">
|
|
<text class="action-icon">🎁</text>
|
|
<text class="action-text">推广中心 / 提现</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 待确认收款（用户确认模式）- 仅登录用户显示 -->
|
|
<view class="pending-confirm-card" wx:if="{{isLoggedIn}}">
|
|
<view class="pending-confirm-header">
|
|
<text class="pending-confirm-title">待确认收款</text>
|
|
<text class="pending-confirm-desc" wx:if="{{pendingConfirmList.length > 0}}">审核已通过，点击下方按钮完成收款</text>
|
|
<text class="pending-confirm-desc" wx:else>暂无待确认的提现，审核通过后会出现在这里</text>
|
|
</view>
|
|
<view class="pending-confirm-list" wx:if="{{pendingConfirmList.length > 0}}">
|
|
<view class="pending-confirm-item" wx:for="{{pendingConfirmList}}" wx:key="id">
|
|
<view class="pending-confirm-info">
|
|
<text class="pending-confirm-amount">¥{{item.amount}}</text>
|
|
<text class="pending-confirm-time">{{item.createdAt}}</text>
|
|
</view>
|
|
<view class="pending-confirm-btn" bindtap="confirmReceive" data-index="{{index}}">确认收款</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- Tab切换 - 仅登录用户显示 -->
|
|
<view class="tab-bar-custom" wx:if="{{isLoggedIn}}">
|
|
<view
|
|
class="tab-item {{activeTab === 'overview' ? 'tab-active' : ''}}"
|
|
bindtap="switchTab"
|
|
data-tab="overview"
|
|
>概览</view>
|
|
<view
|
|
class="tab-item {{activeTab === 'footprint' ? 'tab-active' : ''}}"
|
|
bindtap="switchTab"
|
|
data-tab="footprint"
|
|
>
|
|
<text class="tab-icon">🐾</text>
|
|
<text>我的足迹</text>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<!-- 概览内容 - 仅登录用户显示 -->
|
|
<view class="tab-content" wx:if="{{activeTab === 'overview' && isLoggedIn}}">
|
|
<!-- 菜单列表 -->
|
|
<view class="menu-card card">
|
|
<view
|
|
class="menu-item"
|
|
wx:for="{{menuList}}"
|
|
wx:key="id"
|
|
bindtap="handleMenuTap"
|
|
data-id="{{item.id}}"
|
|
>
|
|
<view class="menu-left">
|
|
<view class="menu-icon {{item.iconBg === 'brand' ? 'icon-brand' : item.iconBg === 'gold' ? 'icon-gold' : item.iconBg === 'gray' ? 'icon-gray' : ''}}">
|
|
{{item.icon}}
|
|
</view>
|
|
<text class="menu-title">{{item.title}}</text>
|
|
</view>
|
|
<view class="menu-right">
|
|
<text class="menu-count" wx:if="{{item.count !== undefined}}">{{item.count}}笔</text>
|
|
<text class="menu-badge gold-color" wx:if="{{item.badge}}">{{item.badge}}</text>
|
|
<text class="menu-arrow">→</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 足迹内容 -->
|
|
<view class="tab-content" wx:if="{{activeTab === 'footprint' && isLoggedIn}}">
|
|
<!-- 阅读统计 -->
|
|
<view class="stats-card card">
|
|
<view class="card-title">
|
|
<text class="title-icon">👁️</text>
|
|
<text>阅读统计</text>
|
|
</view>
|
|
<!-- 根据 matchEnabled 显示 2 列或 3 列布局 -->
|
|
<view class="stats-row {{matchEnabled ? '' : 'stats-row-two-cols'}}">
|
|
<view class="stat-box">
|
|
<text class="stat-icon brand-color">📖</text>
|
|
<text class="stat-num">{{readCount}}</text>
|
|
<text class="stat-text">已读章节</text>
|
|
</view>
|
|
<view class="stat-box">
|
|
<text class="stat-icon gold-color">⏱️</text>
|
|
<text class="stat-num">{{totalReadTime}}</text>
|
|
<text class="stat-text">阅读分钟</text>
|
|
</view>
|
|
<view class="stat-box" wx:if="{{matchEnabled}}">
|
|
<text class="stat-icon pink-color">👥</text>
|
|
<text class="stat-num">{{matchHistory}}</text>
|
|
<text class="stat-text">匹配伙伴</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 最近阅读 -->
|
|
<view class="recent-card card">
|
|
<view class="card-title">
|
|
<text class="title-icon">📖</text>
|
|
<text>最近阅读</text>
|
|
</view>
|
|
<view class="recent-list" wx:if="{{recentChapters.length > 0}}">
|
|
<view
|
|
class="recent-item"
|
|
wx:for="{{recentChapters}}"
|
|
wx:key="id"
|
|
bindtap="goToRead"
|
|
data-id="{{item.id}}"
|
|
>
|
|
<view class="recent-left">
|
|
<text class="recent-index">{{index + 1}}</text>
|
|
<text class="recent-title">{{item.title}}</text>
|
|
</view>
|
|
<text class="recent-btn">继续阅读</text>
|
|
</view>
|
|
</view>
|
|
<view class="empty-state" wx:else>
|
|
<text class="empty-icon">📖</text>
|
|
<text class="empty-text">暂无阅读记录</text>
|
|
<view class="empty-btn" bindtap="goToChapters">去阅读 →</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 匹配记录 - 根据配置显示 -->
|
|
<view class="match-card card" wx:if="{{matchEnabled}}">
|
|
<view class="card-title">
|
|
<text class="title-icon">👥</text>
|
|
<text>匹配记录</text>
|
|
</view>
|
|
<view class="empty-state">
|
|
<text class="empty-icon">👥</text>
|
|
<text class="empty-text">暂无匹配记录</text>
|
|
<view class="empty-btn" bindtap="goToMatch">去匹配 →</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 登录弹窗：可取消，用户主动选择是否登录 -->
|
|
<view class="modal-overlay" wx:if="{{showLoginModal}}" bindtap="closeLoginModal">
|
|
<view class="modal-content login-modal-content" catchtap="stopPropagation">
|
|
<view class="modal-close" bindtap="closeLoginModal">✕</view>
|
|
<view class="login-icon">🔐</view>
|
|
<text class="login-title">登录 Soul创业实验</text>
|
|
<text class="login-desc">登录后可购买章节、解锁更多内容</text>
|
|
|
|
<button
|
|
class="btn-wechat {{agreeProtocol ? '' : 'btn-wechat-disabled'}}"
|
|
bindtap="handleWechatLogin"
|
|
disabled="{{isLoggingIn || !agreeProtocol}}"
|
|
>
|
|
<text class="btn-wechat-icon">微</text>
|
|
<text>{{isLoggingIn ? '登录中...' : '微信快捷登录'}}</text>
|
|
</button>
|
|
<view class="login-modal-cancel" bindtap="closeLoginModal">取消</view>
|
|
|
|
<view class="login-agree-row" catchtap="toggleAgree">
|
|
<view class="agree-checkbox {{agreeProtocol ? 'agree-checked' : ''}}">{{agreeProtocol ? '✓' : ''}}</view>
|
|
<text class="agree-text">我已阅读并同意</text>
|
|
<text class="agree-link" catchtap="openUserProtocol">《用户协议》</text>
|
|
<text class="agree-text">和</text>
|
|
<text class="agree-link" catchtap="openPrivacy">《隐私政策》</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 修改昵称弹窗 -->
|
|
<view class="modal-overlay" wx:if="{{showNicknameModal}}" bindtap="closeNicknameModal">
|
|
<view class="modal-content nickname-modal" catchtap="stopPropagation">
|
|
<view class="modal-close" bindtap="closeNicknameModal">✕</view>
|
|
<view class="modal-header">
|
|
<text class="modal-icon">✏️</text>
|
|
<text class="modal-title">修改昵称</text>
|
|
</view>
|
|
|
|
<view class="nickname-input-wrap">
|
|
<input
|
|
class="nickname-input"
|
|
type="nickname"
|
|
value="{{editingNickname}}"
|
|
placeholder="点击输入昵称"
|
|
placeholder-class="nickname-placeholder"
|
|
bindchange="onNicknameChange"
|
|
bindinput="onNicknameInput"
|
|
maxlength="20"
|
|
/>
|
|
<text class="input-tip">微信用户可点击自动填充昵称</text>
|
|
</view>
|
|
|
|
<view class="modal-actions">
|
|
<view class="modal-btn modal-btn-cancel" bindtap="closeNicknameModal">取消</view>
|
|
<view class="modal-btn modal-btn-confirm" bindtap="confirmNickname">确定</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 底部留白 -->
|
|
<view class="bottom-space"></view>
|
|
</view>
|