<view class="page">
  <navigation-bar title="编辑家庭成员" back="{{true}}" color="black" background="#ffffff" />

  <view class="form-section">
    <!-- 头像选择 -->
    <view class="avatar-row">
      <view class="avatar-label">头像</view>
      <view class="avatar-options">
        <view wx:for="{{avatars}}" wx:key="*this" class="avatar-opt {{form.avatar === item ? 'selected' : ''}}" data-avatar="{{item}}" bindtap="pickAvatar">{{item}}</view>
      </view>
    </view>

    <view class="form-row">
      <view class="form-group half">
        <view class="form-label">姓名</view>
        <input class="form-input" placeholder="请输入姓名" value="{{form.name}}" bindinput="onField" data-field="name" />
      </view>
      <view class="form-group half">
        <view class="form-label">关系</view>
        <picker mode="selector" range="{{relations}}" value="{{relationIdx}}" bindchange="onRelationChange">
          <view class="form-picker {{form.relation ? '' : 'placeholder'}}">{{form.relation || '请选择'}}<text class="arrow">▼</text></view>
        </picker>
      </view>
    </view>

    <view class="form-row">
      <view class="form-group half">
        <view class="form-label">性别</view>
        <view class="gender-row">
          <view class="gender-btn {{form.gender === '男' ? 'active male' : ''}}" data-gender="男" bindtap="pickGender">♂ 男</view>
          <view class="gender-btn {{form.gender === '女' ? 'active female' : ''}}" data-gender="女" bindtap="pickGender">♀ 女</view>
        </view>
      </view>
      <view class="form-group half">
        <view class="form-label">出生日期</view>
        <picker mode="date" value="{{form.birthday}}" end="{{today}}" bindchange="onBirthdayChange">
          <view class="form-picker {{form.birthday ? '' : 'placeholder'}}">{{form.birthday || '请选择'}}<text class="arrow">📅</text></view>
        </picker>
      </view>
    </view>

    <view class="form-group">
      <view class="form-label">血型</view>
      <view class="blood-row">
        <view wx:for="{{bloodTypes}}" wx:key="*this" class="blood-chip {{form.bloodType === item ? 'active' : ''}}" data-bt="{{item}}" bindtap="pickBlood">{{item}}</view>
      </view>
    </view>

    <view class="divider">📋 健康信息</view>

    <view class="form-group">
      <view class="form-label">过敏史</view>
      <input class="form-input" placeholder="如：青霉素过敏、花粉过敏" value="{{form.allergies}}" bindinput="onField" data-field="allergies" />
    </view>

    <view class="form-group">
      <view class="form-label">慢性病史</view>
      <input class="form-input" placeholder="如：高血压、糖尿病" value="{{form.chronicDiseases}}" bindinput="onField" data-field="chronicDiseases" />
    </view>

    <view class="form-group">
      <view class="form-label">长期用药</view>
      <input class="form-input" placeholder="如：氨氯地平5mg/日" value="{{form.longTermMeds}}" bindinput="onField" data-field="longTermMeds" />
    </view>

    <view class="form-group">
      <view class="form-label">备注</view>
      <textarea class="form-textarea" placeholder="其他需要记录的信息…" value="{{form.notes}}" bindinput="onField" data-field="notes" />
    </view>
  </view>

  <view class="btn-area">
    <button class="save-btn" bindtap="save">保存</button>
  </view>
</view>
