miniprogramme/pages/personal-details/personal-details.wxml

<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">用户ID</text>
        <view class="right" >
          <text class="value">{{user.customId}}</text>
        </view>
      </view>
      
      <view class="row" bindtap="startEdit">
        <text class="left">昵称</text>
         <!-- 非编辑状态 -->
        <view class="right" wx:if="{{!isEditing}}">
          <text class="value">{{user.nickname || '请输入昵称'}}</text>
          <text class="chev">›</text>
        </view>
        <view class="right" wx:if="{{isEditing}}">
          <input 
            class="input"
            placeholder="请输入昵称"
            value="{{tempNickname}}"
            maxlength="15"
            bindinput="onInput"
            bindblur="onBlur"
            focus="{{true}}"
          />
          <view class="icon-btn" bindtap="confirmEdit">✔️</view>
          <!-- <view class="icon-btn" bindtap="cancelEdit">✖️</view> -->
        </view>
        
      </view>
    </view>

    <!-- 个人简介 -->
    <text class="left" style="position:relative;top:-12rpx;">个人简介</text>
    <view class="card intro-card">
      <view wx:if="{{!editingIntro}}" class="intro-box" bindtap="toggleIntroEdit">
        <text class="intro-text">{{user.bio || '点击编辑个人简介'}}</text>
      </view>

      <view wx:if="{{editingIntro}}" class="intro-edit">
        <textarea class="textarea" value="{{tempIntro}}" bindinput="onIntroInput" maxlength="100" placeholder="请填写个人简介（最多100字）"></textarea>
        <view class="intro-actions">
          <button class="btn cancel" bindtap="cancelIntro">取消</button>
          <button class="btn save" bindtap="saveIntro">保存</button>
        </view>
      </view>
    </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" bindtap="openSheet" data-key="education" data-title="选择教育" data-options="{{educationOptions}}">
        <text class="left">教育</text>
        <view class="right">
          <text class="value">{{user.education || '请选择'}}</text>
          <text class="chev">›</text>
        </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">{{user.gender || '请选择'}}</text>
          <text class="chev">›</text>
        </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" data-key="constellation" data-title="选择星座" data-options="{{constellationOptions}}">
        <text class="left">星座</text>
        <view class="right"><text style="color:#bfbfbf;">{{user.constellation || '选择生日后会自动试算哦😘'}}</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 || '请选择'}}</text><text class="chev">›</text></view>
      </view>
      <view class="row" bindtap="openSheet" data-key="personality" data-title="选择人格类型" data-options="{{personalityOptions}}">
        <text class="left">人格类型</text>
        <view class="right"><text class="value">{{user.personality || '请选择'}}</text><text class="chev">›</text></view>
      </view>
      <view class="row" bindtap="openSheet" data-key="sleep" data-title="选择睡眠习惯" data-options="{{sleepOptions}}">
        <text class="left">睡眠习惯</text>
        <view class="right"><text class="value">{{user.sleep || '请选择'}}</text><text class="chev">›</text></view>
      </view>
      <view class="row" bindtap="openSheet" data-key="social" data-title="选择社交活跃度" data-options="{{socialOptions}}">
        <text class="left">社交活跃度</text>
        <view class="right"><text class="value">{{user.social || '请选择'}}</text><text class="chev">›</text></view>
      </view>
    </view>
  </scroll-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>