<!-- pages/device/host/host.wxml - 智能主机页面 -->
<view class="page-container">
  <!-- 搜索栏 -->
  <view class="search-bar">
    <view class="search-input-wrapper">
      <input 
        class="search-input" 
        placeholder="请输入主机编号" 
        value="{{searchValue}}"
        bindinput="onSearchInput"
        bindconfirm="handleSearch"
      />
      <view class="search-clear" wx:if="{{searchValue}}" bindtap="clearSearch">✕</view>
    </view>
    <button class="search-btn" bindtap="handleSearch">搜索</button>
  </view>

  <!-- 数据统计 -->
  <view class="data-stats">
    <text class="stats-text">共 {{total}} 条数据</text>
    <text class="stats-text">第 {{page}}/{{totalPages}} 页</text>
  </view>

  <!-- 数据列表 -->
  <view class="data-list">
    <view class="list-item" wx:for="{{list}}" wx:key="id" bindtap="viewDetail" data-id="{{item.id}}">
      <view class="item-header">
        <text class="item-number">{{item.deviceNumber || item.title || item.number}}</text>
        <text class="item-status {{item.networkStatus === '已联网' ? 'status-online' : 'status-offline'}}">
          {{item.networkStatus || '未联网'}}
        </text>
      </view>
      <view class="item-content">
        <view class="item-row">
          <text class="item-label">养殖场：</text>
          <text class="item-value">{{item.farmName || '-'}}</text>
        </view>
        <view class="item-row">
          <text class="item-label">SIM卡号：</text>
          <text class="item-value">{{item.simId || '-'}}</text>
        </view>
        <view class="item-row">
          <text class="item-label">信号强度：</text>
          <text class="item-value">{{item.signalValue || item.signal || '-'}}</text>
        </view>
        <view class="item-row">
          <text class="item-label">GPS状态：</text>
          <text class="item-value">{{item.gpsStatus || '-'}}</text>
        </view>
        <view class="item-row">
          <text class="item-label">电量：</text>
          <text class="item-value">{{item.battery || item.voltage || 0}}%</text>
        </view>
        <view class="item-row">
          <text class="item-label">温度：</text>
          <text class="item-value">{{item.temperature || '-'}}℃</text>
        </view>
        <view class="item-row">
          <text class="item-label">经纬度：</text>
          <text class="item-value">{{item.latitude}}, {{item.longitude}}</text>
        </view>
        <view class="item-row">
          <text class="item-label">更新时间：</text>
          <text class="item-value">{{item.updateTime || item.lastUpdate || '-'}}</text>
        </view>
      </view>
    </view>

    <!-- 空状态 -->
    <view class="empty-state" wx:if="{{!loading && list.length === 0}}">
      <text class="empty-text">暂无数据</text>
    </view>

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

  <!-- 分页器 -->
  <view class="pagination" wx:if="{{totalPages > 1}}">
    <view class="page-btn {{page === 1 ? 'disabled' : ''}}" bindtap="prevPage">
      <text>上一页</text>
    </view>

    <view class="page-numbers">
      <block wx:for="{{totalPages}}" wx:key="index">
        <view 
          class="page-number {{page === index + 1 ? 'active' : ''}}" 
          wx:if="{{index + 1 === 1 || index + 1 === totalPages || (index + 1 >= page - 2 && index + 1 <= page + 2)}}"
          bindtap="changePage" 
          data-page="{{index + 1}}"
        >
          {{index + 1}}
        </view>
        <view class="page-ellipsis" wx:if="{{index + 1 === page - 3 || index + 1 === page + 3}}">
          ...
        </view>
      </block>
    </view>

    <view class="page-btn {{page === totalPages ? 'disabled' : ''}}" bindtap="nextPage">
      <text>下一页</text>
    </view>
  </view>
</view>
