@extends('layouts.app')
@section('title', '寄信紀錄')
@section('content')
<div class="container-fluid pb-5">

  <div class="d-flex justify-content-between align-items-center mb-3">
    <h4 class="mb-0"><i class="bi bi-envelope-paper me-2 text-info"></i>寄信紀錄</h4>
  </div>

  <div class="card shadow-sm mb-3">
    <div class="card-body py-2">
      <form method="GET" class="row g-2 align-items-end">
        <div class="col-auto">
          <label class="form-label small mb-0">環境</label>
          <select name="env" class="form-select form-select-sm">
            <option value="">全部</option>
            <option value="vpn" @selected(request('env')==='vpn')>vpn</option>
            <option value="portal" @selected(request('env')==='portal')>portal</option>
          </select>
        </div>
        <div class="col-auto">
          <label class="form-label small mb-0">日期</label>
          <input type="date" name="date" value="{{ request('date') }}" class="form-control form-control-sm">
        </div>
        <div class="col-auto">
          <label class="form-label small mb-0">收件人 Email</label>
          <input type="text" name="email" value="{{ request('email') }}" class="form-control form-control-sm" placeholder="搜尋 email">
        </div>
        <div class="col-auto">
          <label class="form-label small mb-0">主旨</label>
          <input type="text" name="subject" value="{{ request('subject') }}" class="form-control form-control-sm" placeholder="搜尋主旨">
        </div>
        <div class="col-auto">
          <button class="btn btn-primary btn-sm"><i class="bi bi-search me-1"></i>查詢</button>
          <a href="{{ route('mail-logs.index') }}" class="btn btn-outline-secondary btn-sm">清除</a>
        </div>
      </form>
    </div>
  </div>

  <div class="card shadow-sm">
    <div class="card-body p-0">
      <div class="table-responsive">
        <table class="table table-sm table-hover align-middle mb-0">
          <thead class="table-light">
            <tr>
              <th style="width:150px">寄出時間</th>
              <th style="width:90px">環境</th>
              <th>收件人</th>
              <th>主旨</th>
            </tr>
          </thead>
          <tbody>
            @forelse($logs as $log)
              <tr>
                <td class="small">{{ $log->sent_at?->format('Y-m-d H:i:s') }}</td>
                <td>
                  <span class="badge bg-{{ $log->source_env === 'vpn' ? 'warning text-dark' : 'primary' }}">
                    {{ $log->source_env }}
                  </span>
                </td>
                <td class="small">
                  {{ $log->to_name ? "{$log->to_name} " : '' }}
                  <span class="text-muted">{{ $log->to_email }}</span>
                </td>
                <td class="small">{{ $log->subject }}</td>
              </tr>
            @empty
              <tr><td colspan="4" class="text-center text-muted py-4">沒有符合條件的紀錄</td></tr>
            @endforelse
          </tbody>
        </table>
      </div>
    </div>
  </div>

  <div class="mt-3">
    {{ $logs->links() }}
  </div>

</div>
@endsection