191 lines
15 KiB
Plaintext
191 lines
15 KiB
Plaintext
<view capture-bind:tap="onLoginSubscribeTap" class="app-shell j-handwritten-page" style="{{layoutStyle}}">
|
||
<launch-transition />
|
||
<!-- pages/profile/profile.wxml -->
|
||
<view wx:if="{{!showEditProfileModal && !showEditPartnerModal}}" class="j-fixed-header"><view class="j-fixed-heading" style="height:{{barHeight}}px;padding-right:{{navSide}}px;"><text class="j-eyebrow">MY CORNER</text><text class="j-page-title">我的小角落</text></view></view>
|
||
<view wx:if="{{!showEditProfileModal && !showEditPartnerModal}}" class="page-root" bindtouchstart="onTouchStart" bindtouchend="onTouchEnd">
|
||
<scroll-view class="page-bg j-main-scroll" scroll-y show-scrollbar="{{false}}" bounces="{{true}}" bindscroll="onScroll" scroll-top="{{scrollTop}}">
|
||
<view class="j-body">
|
||
<view class="j-profile-summary" bindtap="showEditProfileModal"><view class="j-profile-info"><text class="j-profile-name">{{myNickname}}</text><text class="j-caption">ID {{myDisplayId}}</text><text class="j-caption">{{myGender}} {{myAge}} {{myBirthday}}</text></view><view class="j-avatar"><image wx:if="{{myAvatarUrl}}" src="{{myAvatarUrl}}" mode="aspectFill" /><text wx:else>{{myInitial}}</text></view></view>
|
||
<view class="j-section-head"><text>我们的关系</text></view>
|
||
<view wx:if="{{bindingKnown && hasPartner}}" class="j-relation-card" bindtap="showEditPartnerModal"><view class="j-row"><view><text class="j-small-title">{{partnerName}}</text><text class="j-caption" wx:if="{{partnerDisplayId}}">ID {{partnerDisplayId}}</text><text class="j-caption">{{partnerDetail}}</text></view><view class="j-avatar"><image wx:if="{{partnerAvatarUrl}}" src="{{partnerAvatarUrl}}" mode="aspectFill" /><text wx:else>{{partnerInitial}}</text></view></view></view>
|
||
<view wx:elif="{{bindingKnown}}" class="j-invite" bindtap="showInvitePanel"><view><text class="j-small-title">另一半还没有加入</text><text class="j-caption">邀请TA，共写这本生活手账</text></view><text class="j-outline-label">绑定情侣</text></view>
|
||
<page-state wx:elif="{{bindingError}}" kind="error" title="绑定状态加载失败" action="重新加载" bind:action="loadData" /><page-state wx:else kind="loading" title="正在获取绑定状态" />
|
||
<view wx:if="{{storageVip}}" class="j-storage-card j-storage-vip" bindtap="goStorage">
|
||
<view class="j-storage-top">
|
||
<text class="j-storage-label">存储空间</text>
|
||
<text class="j-storage-val j-vip">👑 {{storageText}}</text>
|
||
</view>
|
||
<view class="j-storage-bottom">
|
||
<text class="j-storage-hint">已用 {{storageUsedText}}{{storageExpireText ? ' · ' + storageExpireText : ''}}</text>
|
||
<text class="j-storage-cta">查看 ›</text>
|
||
</view>
|
||
</view>
|
||
<view wx:else class="j-storage-card" bindtap="goStorage">
|
||
<view class="j-storage-top">
|
||
<text class="j-storage-label">存储空间</text>
|
||
<text class="j-storage-val">{{storageText}}</text>
|
||
</view>
|
||
<view class="j-storage-bar"><view class="j-storage-fill" style="width:{{storagePercent}}%;"></view></view>
|
||
<view class="j-storage-bottom">
|
||
<text class="j-storage-hint">{{storageOverQuota ? '已超出免费空间，升级后可继续上传' : '已用 ' + storagePercent + '% 免费空间'}}</text>
|
||
<text class="j-storage-cta">{{storageOverQuota ? '扩容 ›' : '查看 ›'}}</text>
|
||
</view>
|
||
</view>
|
||
<view class="profile-statistics">
|
||
<view class="profile-stat-grid">
|
||
<view class="profile-stat-item" wx:for="{{statisticItems}}" wx:key="key" data-key="{{item.key}}" bindtap="openStatistic" hover-class="profile-stat-pressed">
|
||
<view class="profile-stat-icon {{item.color}}"><image src="/images/{{item.icon}}.svg" mode="aspectFit" /></view>
|
||
<view class="profile-stat-label"><text>{{item.label}}</text><text wx:if="{{item.count !== ''}}" class="profile-stat-count">{{item.count}}</text></view>
|
||
</view>
|
||
</view>
|
||
<view wx:if="{{statsError}}" class="profile-stats-retry" bindtap="loadProfileStats">部分统计未加载，点击重试</view>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
|
||
|
||
|
||
<view wx:if="{{showEditProfileModal}}" class="edit-root" capture-bind:touchstart="onEditTouchStart" capture-bind:touchend="onEditTouchEnd" capture-bind:touchcancel="onEditTouchCancel">
|
||
<view class="edit-nav"><view class="back-btn" bindtap="hideEditProfileModal"><image class="back-icon" src="/images/back.svg" mode="aspectFit" /></view></view>
|
||
<scroll-view class="edit-body" scroll-y show-scrollbar="{{false}}">
|
||
<view class="edit-avatar-wrap" bindtap="chooseAvatar"><image wx:if="{{editAvatarUrl}}" src="{{editAvatarUrl}}" mode="aspectFill" class="edit-avatar-img"></image><text wx:else class="edit-avatar-placeholder">{{editNicknameInitial || '?'}}</text><text class="edit-avatar-hint">点击更换头像</text></view>
|
||
<text class="edit-id">我的ID: {{myDisplayId}}</text>
|
||
<view class="input-group"><label>昵称</label><input data-swipe-ignore="{{true}}" placeholder-class="handwritten-placeholder" class="input" placeholder="你的昵称" value="{{editNickname}}" bindinput="onEditNicknameInput" /></view>
|
||
<view class="input-group"><label>性别</label><picker mode="selector" range="{{genderOptions}}" bindchange="onEditGenderChange"><view class="input">{{editGenderText || '请选择'}}</view></picker></view>
|
||
<view class="input-group"><label>生日</label><picker mode="date" value="{{editBirthday}}" bindchange="onEditBirthdayInput"><view class="input">{{editBirthday || '请选择日期'}}</view></picker><text style="font-size:24rpx;color:#B74768;margin-top:8rpx;display:block;" wx:if="{{editAge}}">自动计算：{{editAge}}岁</text></view>
|
||
<view class="input-group" wx:if="{{hasPartner}}"><label>恋爱纪念日</label><picker mode="date" value="{{tempLoveDate}}" bindchange="onLoveDateInput"><view class="input">{{tempLoveDate || '设置你们在一起的日期'}}</view></picker></view>
|
||
<view class="input-group" wx:if="{{hasPartner}}"><label>恋爱故事</label><textarea data-swipe-ignore="{{true}}" placeholder-class="handwritten-placeholder" class="input" style="min-height:120rpx;" placeholder="记录你们的故事..." value="{{tempLoveStory}}" bindinput="onLoveStoryInput"></textarea></view>
|
||
</scroll-view>
|
||
<view class="edit-footer"><button class="btn btn-primary" bindtap="saveProfile" hover-class="none">保存</button></view>
|
||
</view>
|
||
|
||
<view wx:if="{{showEditPartnerModal}}" class="edit-root partner-edit" capture-bind:touchstart="onEditTouchStart" capture-bind:touchend="onEditTouchEnd" capture-bind:touchcancel="onEditTouchCancel">
|
||
<view class="edit-nav"><view class="back-btn" bindtap="hideEditPartnerModal"><image class="back-icon" src="/images/back.svg" mode="aspectFit" /></view><text class="partner-nav-title">编辑TA的资料</text></view>
|
||
<scroll-view class="edit-body" scroll-y show-scrollbar="{{false}}">
|
||
<view class="edit-avatar-wrap" bindtap="choosePartnerAvatar"><image wx:if="{{editPartnerAvatarUrl}}" src="{{editPartnerAvatarUrl}}" mode="aspectFill" class="edit-avatar-img" /><text wx:else class="edit-avatar-placeholder">{{editPartnerNameInitial || '?'}}</text><text class="edit-avatar-hint">{{partnerAvatarUploading ? '正在上传头像…' : '点击更换头像'}}</text></view>
|
||
<text class="edit-id" wx:if="{{partnerDisplayId}}">TA的ID: {{partnerDisplayId}}</text>
|
||
<view class="input-group"><label>昵称</label><input data-swipe-ignore="{{true}}" placeholder-class="handwritten-placeholder" class="input" value="{{editPartnerNickname}}" placeholder="TA的昵称" bindinput="onEditPartnerNicknameInput" disabled="{{partnerSaving}}" /></view>
|
||
<view class="input-group"><label>性别</label><picker mode="selector" range="{{genderOptions}}" bindchange="onEditPartnerGenderChange" disabled="{{partnerSaving}}"><view class="input">{{editPartnerGenderText || '请选择'}}</view></picker></view>
|
||
<view class="input-group"><label>生日</label><picker mode="date" value="{{editPartnerBirthday}}" bindchange="onEditPartnerBirthdayInput" disabled="{{partnerSaving}}"><view class="input">{{editPartnerBirthday || '请选择日期'}}</view></picker><text class="edit-avatar-hint" wx:if="{{editPartnerAge}}">自动计算：{{editPartnerAge}}岁</text></view>
|
||
<view class="input-group"><label>恋爱纪念日</label><picker mode="date" value="{{tempLoveDate}}" bindchange="onLoveDateInput" disabled="{{partnerSaving}}"><view class="input">{{tempLoveDate || '设置你们在一起的日期'}}</view></picker></view>
|
||
<view class="input-group"><label>恋爱故事</label><textarea data-swipe-ignore="{{true}}" placeholder-class="handwritten-placeholder" class="input" style="min-height:120rpx;" value="{{tempLoveStory}}" placeholder="记录你们的故事…" bindinput="onLoveStoryInput" disabled="{{partnerSaving}}" /></view>
|
||
</scroll-view>
|
||
<view class="edit-footer"><button class="btn btn-primary" bindtap="savePartnerProfile" loading="{{partnerSaving}}" disabled="{{partnerSaving || partnerAvatarUploading}}" hover-class="none">保存</button></view>
|
||
</view>
|
||
|
||
<!-- ===== 邀请绑定面板 ===== -->
|
||
<view wx:if="{{showInvitePanel}}" class="invite-root">
|
||
<view class="invite-nav">
|
||
<view class="back-btn" bindtap="hideInvitePanel"><image class="back-icon" src="/images/back.svg" mode="aspectFit" /></view>
|
||
<text class="invite-nav-title">💕 绑定情侣</text>
|
||
<view style="width:56rpx;"></view>
|
||
</view>
|
||
<scroll-view class="invite-body" scroll-y show-scrollbar="{{false}}">
|
||
<view class="container" style="padding-top:200rpx;">
|
||
<view class="card" style="padding:32rpx;text-align:center;margin-bottom:32rpx;">
|
||
<text style="font-size:26rpx;color:#888;display:block;">你的ID</text>
|
||
<text style="font-size:64rpx;font-weight:700;color:#B74768;display:block;margin-top:8rpx;" wx:if="{{myDisplayId}}">{{myDisplayId}}</text>
|
||
<text style="font-size:64rpx;font-weight:700;color:#B74768;display:block;margin-top:8rpx;" wx:else>---</text>
|
||
<text style="font-size:22rpx;color:#888;display:block;margin-top:8rpx;">将此ID告诉TA</text>
|
||
</view>
|
||
|
||
<view class="input-group">
|
||
<label>TA的ID</label>
|
||
<input placeholder-class="handwritten-placeholder" class="input" type="tel" placeholder="输入对方的6位ID" value="{{inviteTargetId}}" bindinput="onInviteTargetIdInput" maxlength="6" />
|
||
</view>
|
||
<button class="btn btn-primary" bindtap="sendInvite" hover-class="none">
|
||
<text>💕</text> 发送邀请
|
||
</button>
|
||
|
||
<view style="margin:32rpx 0;display:flex;align-items:center;gap:16rpx;">
|
||
<view style="flex:1;height:2rpx;background:#FFE4EC;"></view>
|
||
<text style="font-size:26rpx;color:#888;">或</text>
|
||
<view style="flex:1;height:2rpx;background:#FFE4EC;"></view>
|
||
</view>
|
||
|
||
<button class="btn btn-secondary" open-type="share" hover-class="none">
|
||
<text>💌</text> 分享给微信好友
|
||
</button>
|
||
|
||
<view class="invite-tabs" style="margin-top:32px;">
|
||
<view class="invite-tab {{inviteTab == 'received' ? 'active' : ''}}" bindtap="switchInviteTab" data-tab="received">收到的邀请</view>
|
||
<view class="invite-tab {{inviteTab == 'sent' ? 'active' : ''}}" bindtap="switchInviteTab" data-tab="sent">发出的邀请</view>
|
||
</view>
|
||
|
||
<view class="invite-list" wx:if="{{inviteTab == 'received'}}">
|
||
<block wx:for="{{receivedInvites}}" wx:key="id">
|
||
<view class="invite-card">
|
||
<view class="invite-card-header">
|
||
<view class="invite-avatar">{{item.from_initial}}</view>
|
||
<view class="invite-info">
|
||
<text class="invite-name">{{item.from_nickname || item.from_username}}</text>
|
||
<text class="invite-time">{{item.short_date}}</text>
|
||
</view>
|
||
<text class="invite-status {{item.status == 'accepted' ? 'accepted' : 'pending'}}">{{item.status == 'accepted' ? '已接受' : '待处理'}}</text>
|
||
</view>
|
||
<view class="invite-message" wx:if="{{item.message}}">💌 {{item.message}}</view>
|
||
<view class="invite-actions" wx:if="{{item.status == 'pending'}}">
|
||
<button class="btn btn-primary btn-sm" bindtap="acceptInvite" data-id="{{item.id}}" hover-class="none">✅ 接受</button>
|
||
<button class="btn btn-outline btn-sm" bindtap="rejectInvite" data-id="{{item.id}}" hover-class="none">❌ 拒绝</button>
|
||
</view>
|
||
</view>
|
||
</block>
|
||
<view class="empty-tip" wx:if="{{receivedInvites.length == 0}}">
|
||
<text>暂无收到的邀请 💭</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="invite-list" wx:if="{{inviteTab == 'sent'}}">
|
||
<block wx:for="{{sentInvites}}" wx:key="id">
|
||
<view class="invite-card">
|
||
<view class="invite-card-header">
|
||
<view class="invite-avatar" style="background:linear-gradient(135deg,#82B1FF,#B388FF);">{{item.to_initial}}</view>
|
||
<view class="invite-info">
|
||
<text class="invite-name">{{item.to_nickname || item.to_username || item.to_phone}}</text>
|
||
<text class="invite-time">{{item.short_date}}</text>
|
||
</view>
|
||
<text class="invite-status {{item.status == 'accepted' ? 'accepted' : 'pending'}}">{{item.status == 'accepted' ? '已接受' : '待处理'}}</text>
|
||
</view>
|
||
</view>
|
||
</block>
|
||
<view class="empty-tip" wx:if="{{sentInvites.length == 0}}">
|
||
<text>暂无发出的邀请 💭</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
|
||
<!-- ===== 分享绑定弹窗 ===== -->
|
||
<view wx:if="{{showShareBindModal}}" class="modal-overlay" bindtap="hideShareBindModal">
|
||
<view class="modal" catchtap="noop" style="text-align:center;">
|
||
<view class="auth-header">
|
||
<text class="auth-icon" style="font-size:128rpx;">💌</text>
|
||
<text class="auth-title">情侣邀请</text>
|
||
<text class="auth-desc" wx:if="{{!shareDisagree}}">有人想和你绑定为情侣</text>
|
||
<text class="auth-desc" wx:if="{{shareDisagree}}" style="color:#FF4757;">需要对方同意绑定后才能使用</text>
|
||
</view>
|
||
<view wx:if="{{!shareDisagree}}">
|
||
<view class="card" style="padding:48rpx 32rpx;margin-bottom:40rpx;">
|
||
<text style="font-size:36rpx;font-weight:600;display:block;color:#4A4A4A;">ID: {{shareInviterId}}</text>
|
||
<text style="font-size:26rpx;color:#888;display:block;margin-top:8rpx;">想要和你绑定为情侣 💕</text>
|
||
</view>
|
||
<button class="btn btn-primary" bindtap="acceptShareBind" hover-class="none">
|
||
<text>💕</text> 同意绑定
|
||
</button>
|
||
<button class="btn btn-outline" style="margin-top:16rpx;" bindtap="rejectShareBind" hover-class="none">
|
||
不同意
|
||
</button>
|
||
</view>
|
||
<view wx:if="{{shareDisagree}}">
|
||
<view style="padding:80rpx 0;">
|
||
<text style="font-size:80rpx;display:block;">😅</text>
|
||
<text style="font-size:30rpx;color:#888;display:block;margin-top:32rpx;">需要对方同意绑定后才能使用本应用</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|