<view class="edit-page">
  <custom-nav padding-x="42">
    <view class="edit-nav">
      <view class="nav-back" bindtap="handleBack">
        <text></text>
      </view>
      <text class="nav-title">编辑资料</text>
      <view class="nav-placeholder"></view>
    </view>
  </custom-nav>

  <view class="edit-content">
    <view class="edit-card">
      <view class="section-title">
        <text class="section-mark"></text>
        <text>头像</text>
      </view>

      <view class="avatar-row">
        <view class="avatar-wrap">
          <view class="avatar-large">
            <image src="{{userinfo.avatar}}"></image>
          </view>
          <view class="camera-badge">
            <image class="camera-icon icon-placeholder" src="/static/images/my/caram.png" mode="aspectFit"></image>
          </view>
        </view>
        <view class="change-avatar" bindtap="handleChangeAvatar">
          <image class="image-icon icon-placeholder" src="/static/images/my/image.png" mode="aspectFit"></image>
          <text>更换头像</text>
        </view>
      </view>

      <view class="divider"></view>

      <view class="section-title nickname-title">
        <text class="section-mark"></text>
        <text>昵称</text>
      </view>

      <view class="input-shell">
        <input class="nickname-input" value="{{userinfo.nickname}}" maxlength="12" placeholder="请输入昵称" bindinput="handleNicknameInput" />
        <image class="edit-icon icon-placeholder" src="/static/images/my/image.png" mode="aspectFit"></image>
      </view>
      <text class="input-tip">2–12个字符</text>

      <view class="card-spacer"></view>

      <view class="sync-tip">
        <image class="shield-icon icon-placeholder" src="/static/images/my/image.png" mode="aspectFit"></image>
        <text>修改后将同步更新个人中心信息</text>
      </view>

      <view class="save-btn" bindtap="handleSave">保存修改</view>
    </view>
  </view>
</view>

