<!--pages/farmer/edit/edit.wxml-->
<view class="container">
  <!-- 状态栏 -->
  <view class="status-bar" style="height: {{statusBarHeight}}px;"></view>
  
  <!-- 加载状态 -->
  <view wx:if="{{loading}}" class="loading-container">
    <view class="loading-spinner"></view>
    <text class="loading-text">加载中...</text>
  </view>
  
  <!-- 表单内容 -->
  <scroll-view wx:else class="form-container" scroll-y="true">
    <!-- 基本信息 -->
    <view class="form-section">
      <view class="section-title">基本信息</view>
      
      <view class="form-item">
        <view class="form-label">
          <text class="required">*</text>
          <text>姓名</text>
        </view>
        <input 
          class="form-input" 
          placeholder="请输入养殖户姓名"
          value="{{formData.name}}"
          bindinput="onInputChange"
          data-field="name"
        />
      </view>
      
      <view class="form-item">
        <view class="form-label">
          <text class="required">*</text>
          <text>手机号</text>
        </view>
        <input 
          class="form-input" 
          placeholder="请输入手机号"
          type="number"
          maxlength="11"
          value="{{formData.phone}}"
          bindinput="onInputChange"
          data-field="phone"
        />
      </view>
      
      <view class="form-item">
        <view class="form-label">身份证号</view>
        <input 
          class="form-input" 
          placeholder="请输入身份证号"
          maxlength="18"
          value="{{formData.idCard}}"
          bindinput="onInputChange"
          data-field="idCard"
        />
      </view>
      
      <view class="form-item">
        <view class="form-label">
          <text class="required">*</text>
          <text>所属区域</text>
        </view>
        <picker 
          mode="selector" 
          range="{{areaList}}" 
          range-key="name"
          value="{{areaIndex}}"
          bindchange="onAreaChange"
        >
          <view class="form-picker">
            <text class="{{formData.area ? '' : 'placeholder'}}">
              {{formData.area || '请选择所属区域'}}
            </text>
            <text class="picker-arrow">></text>
          </view>
        </picker>
      </view>
      
      <view class="form-item">
        <view class="form-label">状态</view>
        <picker 
          mode="selector" 
          range="{{statusList}}" 
          range-key="name"
          value="{{statusIndex}}"
          bindchange="onStatusChange"
        >
          <view class="form-picker">
            <text class="{{formData.status ? '' : 'placeholder'}}">
              {{formData.status || '请选择状态'}}
            </text>
            <text class="picker-arrow">></text>
          </view>
        </picker>
      </view>
    </view>
    
    <!-- 养殖场信息 -->
    <view class="form-section">
      <view class="section-title">养殖场信息</view>
      
      <view class="form-item">
        <view class="form-label">
          <text class="required">*</text>
          <text>养殖场名称</text>
        </view>
        <input 
          class="form-input" 
          placeholder="请输入养殖场名称"
          value="{{formData.farmName}}"
          bindinput="onInputChange"
          data-field="farmName"
        />
      </view>
      
      <view class="form-item">
        <view class="form-label">养殖场地址</view>
        <input 
          class="form-input" 
          placeholder="请输入养殖场地址"
          value="{{formData.farmAddress}}"
          bindinput="onInputChange"
          data-field="farmAddress"
        />
      </view>
      
      <view class="form-item">
        <view class="form-label">养殖规模</view>
        <input 
          class="form-input" 
          placeholder="请输入养殖数量"
          type="number"
          value="{{formData.animalCount}}"
          bindinput="onInputChange"
          data-field="animalCount"
        />
      </view>
      
      <view class="form-item">
        <view class="form-label">养殖类型</view>
        <picker 
          mode="selector" 
          range="{{animalTypeList}}" 
          range-key="name"
          value="{{animalTypeIndex}}"
          bindchange="onAnimalTypeChange"
        >
          <view class="form-picker">
            <text class="{{formData.animalType ? '' : 'placeholder'}}">
              {{formData.animalType || '请选择养殖类型'}}
            </text>
            <text class="picker-arrow">></text>
          </view>
        </picker>
      </view>
    </view>
    
    <!-- 联系信息 -->
    <view class="form-section">
      <view class="section-title">联系信息</view>
      
      <view class="form-item">
        <view class="form-label">邮箱</view>
        <input 
          class="form-input" 
          placeholder="请输入邮箱地址"
          value="{{formData.email}}"
          bindinput="onInputChange"
          data-field="email"
        />
      </view>
      
      <view class="form-item">
        <view class="form-label">紧急联系人</view>
        <input 
          class="form-input" 
          placeholder="请输入紧急联系人姓名"
          value="{{formData.emergencyContact}}"
          bindinput="onInputChange"
          data-field="emergencyContact"
        />
      </view>
      
      <view class="form-item">
        <view class="form-label">紧急联系电话</view>
        <input 
          class="form-input" 
          placeholder="请输入紧急联系电话"
          type="number"
          maxlength="11"
          value="{{formData.emergencyPhone}}"
          bindinput="onInputChange"
          data-field="emergencyPhone"
        />
      </view>
    </view>
    
    <!-- 备注信息 -->
    <view class="form-section">
      <view class="section-title">备注信息</view>
      
      <view class="form-item">
        <view class="form-label">备注</view>
        <textarea 
          class="form-textarea" 
          placeholder="请输入备注信息"
          maxlength="200"
          value="{{formData.remark}}"
          bindinput="onInputChange"
          data-field="remark"
        />
        <view class="char-count">{{formData.remark.length}}/200</view>
      </view>
    </view>
    
    <!-- 底部间距 -->
    <view class="bottom-space"></view>
  </scroll-view>
  
  <!-- 底部操作栏 -->
  <view wx:if="{{!loading}}" class="bottom-bar">
    <button class="cancel-btn" bindtap="onCancel">取消</button>
    <button class="submit-btn" bindtap="onSubmit" disabled="{{!canSubmit}}">
      {{isSubmitting ? '保存中...' : '保存修改'}}
    </button>
  </view>
</view>