findme-miniprogram-frontend/subpackages/profile/personal-details/personal-details.wxml

161 lines
5.8 KiB
Text
Raw Permalink Normal View History

2025-12-27 17:16:03 +08:00
<view class="personal">
<scroll-view class="personal-container"
scroll-y="true"
enhanced="true"
bounces="true"
show-scrollbar="false"
refresher-enabled="true"
refresher-triggered="{{refreshing}}"
bindrefresherrefresh="onRefresh">
<!-- 头像 + customId + 昵称 -->
<view class="card intro-card">
<view class="row">
<text class="left">头像</text>
<view class="right">
<image src="{{user.avatar}}" class="avatar-img" mode="aspectFill" bindtap="chooseAvatar"/>
</view>
</view>
<view class="row">
<text class="left">昵称</text>
<view class="right">
<input
class="input"
placeholder="请输入昵称"
value="{{user.nickname}}"
maxlength="15"
bindinput="onNicknameInput"
/>
</view>
</view>
</view>
<!-- 个人简介 -->
<text class="left" style="position:relative;top:-12rpx;">个人简介</text>
<view class="card intro-card">
<textarea
class="textarea"
value="{{user.bio}}"
bindinput="onIntroInput"
maxlength="150"
placeholder="请填写个人简介最多150字"
></textarea>
</view>
<!-- 关于我 -->
<text class="left">关于我</text>
<view class="card intro-card">
<view class="row" bindtap="openSheet" data-key="occupation" data-title="选择职业" data-options="{{occupationOptions}}">
<text class="left">职业</text>
<view class="right">
<text class="value">{{user.occupation || '请选择'}}</text>
<text class="chev"></text>
</view>
</view>
<view class="row">
<text class="left">毕业院校</text>
<view class="right">
<input
class="input"
placeholder="请输入毕业院校"
value="{{user.school}}"
maxlength="100"
bindinput="onSchoolInput"
/>
</view>
</view>
<view class="row" bindtap="openSheet" data-key="gender" data-title="选择性别" data-options="{{genderOptions}}">
<text class="left">性别</text>
<view class="right">
<text class="value">{{genderDisplayText}}</text>
<text class="chev"></text>
</view>
</view>
<view class="row">
<text class="left">民族</text>
<view class="right">
<input
class="input"
placeholder="请输入民族"
value="{{user.ethnicity}}"
maxlength="50"
bindinput="onEthnicityInput"
/>
</view>
</view>
<view class="row">
<text class="left">生日</text>
<view class="right">
<picker mode="date" value="{{user.birthday}}" start="1900-01-01" end="2100-12-31" bindchange="onBirthdayChange">
<text class="value">{{user.birthday || '请选择'}}</text>
</picker>
<text class="chev"></text>
</view>
</view>
<view class="row">
<text class="left">家乡</text>
<view class="right">
<picker mode="region" value="{{user.hometown}}" bindchange="onHometownChange">
<text class="value" wx:if="{{!user.hometown || user.hometown.length === 0}}">请选择</text>
<view class="value">{{user.hometown[0]}} {{user.hometown[1]}} {{user.hometown[2]}}</view>
</picker>
<text class="chev"></text>
</view>
</view>
</view>
<!-- 更多 -->
<text class="left">更多</text>
<view class="card intro-card">
<view class="row">
<text class="left">星座</text>
<view class="right"><text style="color:#bfbfbf;font-size: 28rpx;">{{user.zodiacSign || '选择生日后会自动试算哦😘'}}</text></view>
</view>
<view class="row" bindtap="openSheet" data-key="height" data-title="选择身高" data-options="{{heightOptions}}">
<text class="left">身高</text>
<view class="right"><text class="value">{{user.height || '请选择'}} cm</text><text class="chev"></text></view>
</view>
<view class="row" bindtap="openSheet" data-key="mbtiType" data-title="选择MBTI类型" data-options="{{mbtiTypeOptions}}">
<text class="left">MBTI类型</text>
<view class="right"><text class="value">{{user.mbtiType || '请选择'}}</text><text class="chev"></text></view>
</view>
<view class="row" bindtap="openSheet" data-key="sleepHabit" data-title="选择睡眠习惯" data-options="{{sleepHabitOptions}}">
<text class="left">睡眠习惯</text>
<view class="right"><text class="value">{{user.sleepHabit || '请选择'}}</text><text class="chev"></text></view>
</view>
<view class="row" bindtap="openSheet" data-key="socialActivity" data-title="选择社交活跃度" data-options="{{socialActivityOptions}}">
<text class="left">社交活跃度</text>
<view class="right"><text class="value">{{user.socialActivity || '请选择'}}</text><text class="chev"></text></view>
</view>
</view>
</scroll-view>
<!-- 保存按钮 -->
<view class="save-button-container">
<view class="save-button" bind:tap="handleSave">保存</view>
</view>
<!-- 底部内联选择面板sheet -->
<view wx:if="{{showSheet}}">
<view class="mask" bindtap="closeSheet"></view>
<view class="sheet">
<view class="sheet-handle"></view>
<view class="sheet-title">
<text>{{sheetTitle}}</text>
<!-- <button class="sheet-done" bindtap="closeSheet">完成</button> -->
</view>
<scroll-view class="sheet-list" scroll-y="true">
<view wx:for="{{sheetOptions}}" wx:key="index" wx:for-item="item" data-index="{{index}}" bindtap="onSheetSelect" class="sheet-item {{item==selectedValue? 'active' : ''}}">
<text class="sheet-item-text">{{item}}</text>
<text wx:if="{{item==selectedValue}}" class="sheet-check">✓</text>
</view>
</scroll-view>
</view>
</view>
</view>