<!--养殖场详情页面-->
<view class="page-container">
  <!-- 养殖场头部信息 -->
  <view class="farm-header" wx:if="{{farmInfo}}">
    <view class="header-bg">
      <image 
        class="bg-image" 
        src="{{farmInfo.cover_image || '/images/default-farm-bg.jpg'}}" 
        mode="aspectFill"
      ></image>
      <view class="header-overlay"></view>
    </view>
    
    <view class="header-content">
      <view class="farm-basic-info">
        <text class="farm-name">{{farmInfo.name}}</text>
        <text class="farm-code">编号：{{farmInfo.code}}</text>
        <view class="farm-status-row">
          <text class="status {{formatStatus(farmInfo.status).class}}">
            {{formatStatus(farmInfo.status).text}}
          </text>
          <text class="farm-type">{{farmInfo.type_name}}</text>
        </view>
      </view>
      
      <view class="header-actions">
        <button class="action-btn" bindtap="onEditFarm">
          <image src="/images/icons/edit.png" mode="aspectFit"></image>
        </button>
        <button class="action-btn" open-type="share">
          <image src="/images/icons/share.png" mode="aspectFit"></image>
        </button>
      </view>
    </view>
  </view>

  <!-- 标签切换 -->
  <view class="tab-bar">
    <view 
      class="tab-item {{activeTab === item.key ? 'active' : ''}}"
      wx:for="{{tabs}}"
      wx:key="key"
      data-tab="{{item.key}}"
      bindtap="onTabChange"
    >
      <text>{{item.name}}</text>
    </view>
  </view>

  <!-- 内容区域 -->
  <scroll-view 
    class="content-scroll"
    scroll-y
    refresher-enabled
    refresher-triggered="{{refreshing}}"
    bindrefresherrefresh="onPullDownRefresh"
  >
    <!-- 概览标签 -->
    <view class="tab-content" wx:if="{{activeTab === 'overview'}}">
      <!-- 基本信息卡片 -->
      <view class="info-card">
        <view class="card-title">基本信息</view>
        <view class="info-grid">
          <view class="info-item">
            <text class="info-label">面积</text>
            <text class="info-value">{{formatArea(farmInfo.area)}}</text>
          </view>
          <view class="info-item">
            <text class="info-label">容量</text>
            <text class="info-value">{{formatNumber(farmInfo.capacity)}}头</text>
          </view>
          <view class="info-item">
            <text class="info-label">存栏</text>
            <text class="info-value">{{statistics.overview.total_animals}}头</text>
          </view>
          <view class="info-item">
            <text class="info-label">健康率</text>
            <text class="info-value text-success">{{statistics.overview.health_rate}}%</text>
          </view>
        </view>
      </view>

      <!-- 天气信息卡片 -->
      <view class="weather-card" wx:if="{{weatherInfo}}">
        <view class="card-title">天气信息</view>
        <view class="weather-content">
          <view class="weather-main">
            <text class="temperature">{{weatherInfo.temperature}}°C</text>
            <text class="weather-desc">{{weatherInfo.weather}}</text>
          </view>
          <view class="weather-details">
            <view class="weather-item">
              <text class="weather-label">湿度</text>
              <text class="weather-value">{{weatherInfo.humidity}}%</text>
            </view>
            <view class="weather-item">
              <text class="weather-label">风力</text>
              <text class="weather-value">{{weatherInfo.wind}}</text>
            </view>
          </view>
        </view>
        <text class="weather-update">更新时间：{{weatherInfo.updated_at}}</text>
      </view>

      <!-- 地址信息卡片 -->
      <view class="address-card">
        <view class="card-title">位置信息</view>
        <view class="address-content">
          <text class="address-text">{{farmInfo.address}}</text>
          <button class="location-btn" bindtap="onViewLocation">
            <image src="/images/icons/location.png" mode="aspectFit"></image>
            <text>查看位置</text>
          </button>
        </view>
      </view>

      <!-- 联系信息卡片 -->
      <view class="contact-card" wx:if="{{farmInfo.contact_phone}}">
        <view class="card-title">联系方式</view>
        <view class="contact-content">
          <text class="contact-phone">{{farmInfo.contact_phone}}</text>
          <button class="call-btn" bindtap="onCallPhone">
            <image src="/images/icons/phone.png" mode="aspectFit"></image>
            <text>拨打电话</text>
          </button>
        </view>
      </view>
    </view>

    <!-- 动物标签 -->
    <view class="tab-content" wx:if="{{activeTab === 'animals'}}">
      <view class="animals-header">
        <text class="section-title">动物列表</text>
        <view class="animals-actions">
          <button class="btn-small btn-secondary" bindtap="onViewAllAnimals">查看全部</button>
          <button class="btn-small btn-primary" bindtap="onAddAnimal">添加动物</button>
        </view>
      </view>

      <view class="animals-list" wx:if="{{animalList.length > 0}}">
        <view 
          class="animal-item"
          wx:for="{{animalList}}"
          wx:key="id"
          data-animal="{{item}}"
          bindtap="onAnimalTap"
        >
          <image 
            class="animal-avatar" 
            src="{{item.avatar || '/images/default-animal.png'}}" 
            mode="aspectFill"
          ></image>
          <view class="animal-info">
            <text class="animal-name">{{item.name}}</text>
            <text class="animal-breed">{{item.breed}}</text>
            <text class="animal-age">{{item.age_days}}天</text>
          </view>
          <view class="animal-status">
            <text class="status {{item.health_status === 'healthy' ? 'status-success' : 'status-warning'}}">
              {{item.health_status_name}}
            </text>
            <text class="animal-weight">{{item.weight}}kg</text>
          </view>
        </view>
      </view>

      <view class="empty" wx:if="{{animalList.length === 0}}">
        <image class="empty-icon" src="/images/empty-animal.png" mode="aspectFit"></image>
        <text class="empty-text">还没有动物</text>
        <button class="btn btn-primary mt-3" bindtap="onAddAnimal">添加动物</button>
      </view>
    </view>

    <!-- 统计标签 -->
    <view class="tab-content" wx:if="{{activeTab === 'statistics' && statistics}}">
      <!-- 概览统计 -->
      <view class="stats-overview">
        <view class="stats-grid">
          <view class="stat-item">
            <text class="stat-number">{{statistics.overview.total_animals}}</text>
            <text class="stat-label">总数量</text>
          </view>
          <view class="stat-item">
            <text class="stat-number">{{statistics.overview.healthy_animals}}</text>
            <text class="stat-label">健康</text>
          </view>
          <view class="stat-item">
            <text class="stat-number">{{statistics.overview.sick_animals}}</text>
            <text class="stat-label">患病</text>
          </view>
          <view class="stat-item">
            <text class="stat-number">{{formatMoney(statistics.overview.total_value)}}</text>
            <text class="stat-label">总价值</text>
          </view>
        </view>
      </view>

      <!-- 品种分布 -->
      <view class="breed-distribution" wx:if="{{statistics.breed_distribution}}">
        <view class="card-title">品种分布</view>
        <view class="breed-list">
          <view 
            class="breed-item"
            wx:for="{{statistics.breed_distribution}}"
            wx:key="breed"
          >
            <text class="breed-name">{{item.breed}}</text>
            <view class="breed-progress">
              <view class="progress-bar">
                <view 
                  class="progress-fill" 
                  style="width: {{item.percentage}}%"
                ></view>
              </view>
              <text class="breed-count">{{item.count}}头 ({{item.percentage}}%)</text>
            </view>
          </view>
        </view>
      </view>
    </view>
  </scroll-view>

  <!-- 加载状态 -->
  <view class="loading" wx:if="{{loading}}">
    <view class="loading-spinner"></view>
    <text>加载中...</text>
  </view>
</view>