<!--pages/index/index.wxml-->
<view class="home-container">
  <!-- 头部欢迎区域 -->
  <view class="welcome-section">
    <view class="welcome-content">
      <view class="user-info">
        <view class="avatar">
          <image src="/images/avatar.png" class="avatar-img" />
        </view>
        <view class="user-details">
          <view class="username">{{userInfo.name || '银行管理员'}}</view>
          <view class="user-role">{{userInfo.role || '客户经理'}}</view>
        </view>
      </view>
      <view class="weather-info">
        <view class="weather-icon">💰</view>
        <view class="weather-text">今日收益 +2.5%</view>
      </view>
    </view>
  </view>

  <!-- 银行卡区域 -->
  <view class="bank-cards-section">
    <view class="section-title">我的银行卡</view>
    <scroll-view class="cards-scroll" scroll-x="true">
      <view class="cards-container">
        <view
          wx:for="{{bankCards}}"
          wx:key="id"
          class="bank-card"
          data-card-id="{{item.id}}"
          bindtap="handleCardTap"
        >
          <view class="bank-card-header">
            <view class="bank-name">{{item.bankName}}</view>
            <view class="card-type">{{item.type}}</view>
          </view>
          <view class="bank-card-number">{{item.number}}</view>
          <view class="bank-card-info">
            <view class="bank-card-balance">{{item.balance}}</view>
            <view class="bank-card-type">余额</view>
          </view>
        </view>
      </view>
    </scroll-view>
  </view>

  <!-- 快捷功能区域 -->
  <view class="quick-actions">
    <view class="section-title">快捷功能</view>
    <view class="action-grid">
      <view
        wx:for="{{quickActions}}"
        wx:key="key"
        class="action-item"
        data-action="{{item.key}}"
        bindtap="handleAction"
      >
        <view class="action-icon">{{item.icon}}</view>
        <view class="action-text">{{item.name}}</view>
      </view>
    </view>
  </view>

  <!-- 数据概览区域 -->
  <view class="stats-section">
    <view class="section-title">数据概览</view>
    <view class="stats-grid">
      <view
        wx:for="{{statsData}}"
        wx:key="key"
        class="stat-item"
      >
        <view class="stat-value">{{item.value}}</view>
        <view class="stat-label">{{item.label}}</view>
        <view class="stat-trend {{item.trend}}">
          {{item.trendText}}
        </view>
      </view>
    </view>
  </view>

  <!-- 最近交易区域 -->
  <view class="recent-transactions">
    <view class="section-title">最近交易</view>
    <view class="transaction-list">
      <view
        wx:for="{{recentTransactions}}"
        wx:key="id"
        class="transaction-item"
        data-transaction-id="{{item.id}}"
        bindtap="handleTransactionTap"
      >
        <view class="transaction-icon">
          <text wx:if="{{item.type === 'income'}}">💰</text>
          <text wx:elif="{{item.type === 'expense'}}">💸</text>
          <text wx:else>🔄</text>
        </view>
        <view class="transaction-content">
          <view class="transaction-title">{{item.title}}</view>
          <view class="transaction-time">{{item.time}}</view>
        </view>
        <view class="transaction-amount {{item.type}}">{{item.amount}}</view>
        <view class="transaction-status {{item.status}}">
          <text wx:if="{{item.status === 'success'}}">成功</text>
          <text wx:elif="{{item.status === 'pending'}}">处理中</text>
          <text wx:else>失败</text>
        </view>
      </view>
    </view>
  </view>
</view>
