<!--pages/business/loan-contracts/loan-contracts.wxml-->
<view class="loan-contracts-container">
  <!-- 搜索栏 -->
  <view class="search-bar">
    <view class="search-input">
      <text class="search-icon">🔍</text>
      <input 
        placeholder="搜索合同编号或客户姓名" 
        value="{{searchKeyword}}"
        bindinput="onSearchInput"
      />
    </view>
  </view>

  <!-- 筛选栏 -->
  <view class="filter-bar">
    <picker 
      bindchange="onFilterChange" 
      value="{{filterStatus}}" 
      range="{{['全部', '生效中', '已到期', '已终止', '已完成', '待处理']}}"
      range-key=""
    >
      <view class="filter-item">
        <text>状态筛选</text>
        <text class="filter-value">{{filterStatus === 'all' ? '全部' : filterStatus}}</text>
        <text class="arrow">></text>
      </view>
    </picker>
  </view>

  <!-- 合同列表 -->
  <view class="contract-list">
    <view 
      class="contract-item" 
      wx:for="{{contracts}}" 
      wx:key="id"
      data-contract-id="{{item.id}}"
    >
      <view class="contract-header" bindtap="viewContractDetail" data-contract-id="{{item.id}}">
        <text class="contract-number">{{item.contractNumber}}</text>
        <view class="contract-status {{item.status}}">
          <text>{{item.statusText}}</text>
        </view>
      </view>
      
      <view class="contract-info">
        <view class="info-row">
          <text class="info-label">客户姓名：</text>
          <text class="info-value">{{item.customerName || '暂无'}}</text>
        </view>
        
        <view class="info-row">
          <text class="info-label">客户ID：</text>
          <text class="info-value">{{item.customerId || '暂无'}}</text>
        </view>
        
        <view class="info-row">
          <text class="info-label">合同类型：</text>
          <text class="info-value">{{item.typeText}}</text>
        </view>
        
        <view class="info-row">
          <text class="info-label">合同金额：</text>
          <text class="info-value">{{item.amount}}元</text>
        </view>
        
        <view class="info-row">
          <text class="info-label">合同期限：</text>
          <text class="info-value">{{item.term}}个月</text>
        </view>
        
        <view class="info-row">
          <text class="info-label">利率：</text>
          <text class="info-value">{{item.interestRate}}%</text>
        </view>
        
        <view class="info-row">
          <text class="info-label">签订时间：</text>
          <text class="info-value">{{item.signDate || '暂无'}}</text>
        </view>
        
        <view class="info-row">
          <text class="info-label">到期时间：</text>
          <text class="info-value">{{item.expiryDate || '暂无'}}</text>
        </view>
        
        <view class="info-row">
          <text class="info-label">联系电话：</text>
          <text class="info-value">{{item.phone}}</text>
        </view>
        
        <view class="info-row">
          <text class="info-label">申请单号：</text>
          <text class="info-value">{{item.applicationNumber || '暂无'}}</text>
        </view>
        
        <view class="info-row">
          <text class="info-label">资产类型：</text>
          <text class="info-value">{{item.assetType || '暂无'}}</text>
        </view>
        
        <view class="info-row">
          <text class="info-label">申请用途：</text>
          <text class="info-value">{{item.purpose || '暂无'}}</text>
        </view>
        
        <view class="info-row">
          <text class="info-label">产品名称：</text>
          <text class="info-value">{{item.productName || '暂无'}}</text>
        </view>
        
        <view class="info-row">
          <text class="info-label">已还金额：</text>
          <text class="info-value">{{item.paidAmount || 0}}元</text>
        </view>
        
        <view class="info-row">
          <text class="info-label">剩余金额：</text>
          <text class="info-value">{{item.remainingAmount || 0}}元</text>
        </view>
        
        <view class="info-row">
          <text class="info-label">还款进度：</text>
          <text class="info-value">{{item.repaymentProgress || 0}}%</text>
        </view>
        
        <view class="info-row" wx:if="{{item.remark}}">
          <text class="info-label">备注：</text>
          <text class="info-value">{{item.remark}}</text>
        </view>
      </view>
      
      <!-- 操作按钮 -->
      <view class="contract-actions">
        <button 
          class="action-btn detail-btn" 
          bindtap="viewContractDetail" 
          data-contract-id="{{item.id}}"
        >
          详情
        </button>
        <button 
          class="action-btn edit-btn" 
          bindtap="editContract" 
          data-contract-id="{{item.id}}"
        >
          编辑
        </button>
      </view>
    </view>
  </view>

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

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