<view class="page">
  <!-- 头部与搜索栏 -->
  <view class="header">
    <text class="title">牛只管理 · 栏舍设置</text>
    <view class="search-bar">
      <input class="search-input" placeholder="输入栏舍名称（精确）" bindinput="onSearchInput" confirm-type="search" bindconfirm="onSearchConfirm" value="{{searchName}}" />
      <button class="search-btn" bindtap="onSearchConfirm">查询</button>
    </view>
  </view>

  <!-- 列表 -->
  <view class="list">
    <block wx:for="{{displayRecords}}" wx:key="index">
      <view class="card">
        <view class="card-header">
          <view class="main">
            <text class="name">栏舍：{{item.name || '-'}}</text>
            <text class="code">编码：{{item.code || '-'}}</text>
          </view>
          <view class="meta">
            <text>养殖场：{{item.farmName || '-'}} </text>
            <text>状态：{{item.status || '-'}} </text>
            <text>容量：{{item.capacity || '-'}} </text>
          </view>
          <view class="time">
            <text>创建时间：{{item.createdAtStr || '-'}} </text>
          </view>
        </view>

        <view class="card-body">
          <block wx:for="{{item.displayFields}}" wx:key="key">
            <view class="row">
              <text class="label">{{item.label}}：</text>
              <text class="value">{{item.value}}</text>
            </view>
          </block>
        </view>
      </view>
    </block>
    <view wx:if="{{!displayRecords || displayRecords.length === 0}}" class="empty">暂无数据</view>
  </view>

  <!-- 分页 -->
  <view class="pagination" wx:if="{{pages && pages.length}}">
    <button class="pager-btn" bindtap="onPrevPage" disabled="{{currentPage<=1}}">上一页</button>
    <block wx:for="{{pages}}" wx:key="page">
      <button class="page-item {{currentPage === item ? 'active' : ''}}" data-page="{{item}}" bindtap="onPageTap">{{item}}</button>
    </block>
    <button class="pager-btn" bindtap="onNextPage" disabled="{{!hasMore}}">下一页</button>
  </view>
</view>