74 lines
3.7 KiB
Plaintext
74 lines
3.7 KiB
Plaintext
<!--卡若创业派对 - 头像与昵称设置页-->
|
||
<view class="page">
|
||
<view class="nav-bar" style="padding-top: {{statusBarHeight}}px;">
|
||
<view class="nav-back" bindtap="goBack"><icon name="chevron-left" size="44" color="rgba(255,255,255,0.8)" customClass="back-icon"></icon></view>
|
||
<text class="nav-title">头像与昵称</text>
|
||
<view class="nav-placeholder"></view>
|
||
</view>
|
||
<view style="height: {{statusBarHeight + 44}}px;"></view>
|
||
|
||
<view class="content">
|
||
<view class="guide-card">
|
||
<icon name="handshake" size="64" color="#00CED1" customClass="guide-icon"></icon>
|
||
<text class="guide-title">{{fromNewUser ? '欢迎加入，先完成基础信息' : '设置对外展示信息'}}</text>
|
||
<text class="guide-badge" wx:if="{{fromNewUser}}">新用户引导</text>
|
||
<text class="guide-desc" wx:if="{{uiFocus === 'avatar'}}">请先换一张清晰头像，伙伴更容易认出你。</text>
|
||
<text class="guide-desc" wx:elif="{{uiFocus === 'nickname'}}">请改一个真实好记的昵称，方便伙伴称呼你。</text>
|
||
<text class="guide-desc" wx:else>头像与昵称会出现在名片与匹配卡片上，方便伙伴认出你。</text>
|
||
<text class="guide-desc guide-desc-sub" wx:if="{{fromNewUser}}">完成后可继续编辑完整档案（手机号、行业、MBTI 等）。</text>
|
||
</view>
|
||
|
||
<!-- 头像：点击直接弹出微信原生选择器；头像与文字水平对齐 -->
|
||
<view class="avatar-section {{uiFocus === 'avatar' ? 'section-focus' : ''}}">
|
||
<button class="avatar-wrap-btn" open-type="chooseAvatar" bindchooseavatar="onChooseAvatar">
|
||
<view class="avatar-wrap">
|
||
<view class="avatar-inner">
|
||
<image wx:if="{{avatar}}" class="avatar-img" src="{{avatar}}" mode="aspectFill"/>
|
||
<view wx:else class="avatar-placeholder">{{nickname ? nickname[0] : '?'}}</view>
|
||
</view>
|
||
<view class="avatar-camera"><icon name="camera" size="48" color="#ffffff"></icon></view>
|
||
</view>
|
||
</button>
|
||
</view>
|
||
|
||
<!-- 昵称：点击前先请求隐私授权，解决 errno:104 昵称选择器无法弹出 -->
|
||
<view class="form-section {{uiFocus === 'nickname' ? 'section-focus' : ''}}">
|
||
<text class="form-label">昵称</text>
|
||
<view class="form-input-wrap" catchtouchstart="onNicknameAreaTouch">
|
||
<input
|
||
class="form-input-inner"
|
||
type="nickname"
|
||
placeholder="请输入昵称"
|
||
value="{{nickname}}"
|
||
focus="{{nicknameInputFocus}}"
|
||
bindinput="onNicknameInput"
|
||
bindchange="onNicknameChange"
|
||
bindblur="onNicknameBlur"
|
||
maxlength="20"
|
||
/>
|
||
</view>
|
||
<text class="input-tip">微信用户可点击输入框自动填充昵称，或手动输入</text>
|
||
</view>
|
||
|
||
<!-- 隐私授权弹窗（昵称需授权后方可唤起微信昵称选择器） -->
|
||
<view class="privacy-mask" wx:if="{{showPrivacyModal}}" catchtouchmove="preventMove">
|
||
<view class="privacy-modal">
|
||
<text class="privacy-title">温馨提示</text>
|
||
<text class="privacy-desc">为获取微信昵称，请先同意《用户隐私保护指引》</text>
|
||
<button id="agree-btn" class="privacy-btn" open-type="agreePrivacyAuthorization" bindagreeprivacyauthorization="handleAgreePrivacy">同意</button>
|
||
<view class="privacy-cancel" bindtap="handleDisagreePrivacy">拒绝</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="save-btn" bindtap="saveProfile" disabled="{{saving}}">
|
||
{{saving ? '保存中...' : '完成'}}
|
||
</view>
|
||
|
||
<view class="link-row" bindtap="goToFullProfile">
|
||
<text class="link-text">编辑完整档案</text>
|
||
<icon name="chevron-right" size="28" color="#00CED1" customClass="link-arrow"></icon>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|