@extends('layouts.app')
@section('title', '防火牆申請初審')

@section('content')
<div class="container py-4" style="max-width:1000px;">

  <div class="mb-4">
    <h3 class="mb-0 fw-bold"><i class="bi bi-shield-lock me-2 text-warning"></i>防火牆申請初審</h3>
    <div class="text-muted small mt-1">初審通過後將送交 pake 進行最終審核並套用 UFW</div>
  </div>

  @if(session('success'))
    <div class="alert alert-success alert-dismissible fade show">
      {{ session('success') }}<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
    </div>
  @endif
  @if(session('error'))
    <div class="alert alert-danger alert-dismissible fade show">
      {{ session('error') }}<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
    </div>
  @endif

  {{-- ── 待初審 ── --}}
  <h5 class="fw-semibold mb-3">
    <span class="badge bg-warning text-dark me-2">{{ $pending->count() }}</span>待初審
  </h5>

  @if($pending->isEmpty())
    <div class="alert alert-light border text-muted mb-5">目前沒有待初審的申請。</div>
  @else
  <div class="d-flex flex-column gap-3 mb-5">
    @foreach($pending as $r)
    <div class="card border-0 shadow-sm">
      <div class="card-body p-4">
        <div class="row g-3 align-items-start">
          <div class="col-md-8">
            <div class="d-flex align-items-center gap-3 mb-3">
              <span class="badge bg-warning text-dark fs-6">待初審</span>
              <span class="text-muted small">#{{ $r->id }} · {{ $r->created_at->format('Y/m/d H:i') }}</span>
            </div>
            <div class="row g-2 mb-3">
              <div class="col-sm-4">
                <div class="text-muted small">申請人</div>
                <div class="fw-semibold">{{ $r->user->name }}</div>
                <div class="text-muted small">{{ $r->user->email }}</div>
              </div>
              <div class="col-sm-4">
                <div class="text-muted small">申請 IP</div>
                <code class="fs-6">{{ $r->ip_address }}</code>
              </div>
              <div class="col-sm-4">
                <div class="text-muted small">目標 / Port</div>
                <div>{{ $r->target_server }}</div>
                @foreach($r->ports as $p)
                  <span class="badge bg-secondary me-1">:{{ $p }}</span>
                @endforeach
              </div>
            </div>
            <div class="text-muted small mb-1">申請原因</div>
            <div>{{ $r->reason }}</div>
          </div>
          <div class="col-md-4">
            <form method="POST" action="{{ route('firewall-requests.supervisor.approve', $r) }}" class="mb-2">
              @csrf
              <textarea name="supervisor_note" class="form-control form-control-sm mb-2"
                rows="2" placeholder="初審備註（選填）"></textarea>
              <button type="submit" class="btn btn-warning w-100 text-dark fw-semibold">
                <i class="bi bi-check-lg me-1"></i>初審通過
              </button>
            </form>
            <form method="POST" action="{{ route('firewall-requests.supervisor.reject', $r) }}">
              @csrf
              <textarea name="supervisor_note" class="form-control form-control-sm mb-2"
                rows="2" placeholder="拒絕原因（建議填寫）"></textarea>
              <button type="submit" class="btn btn-outline-danger w-100">
                <i class="bi bi-x-lg me-1"></i>拒絕
              </button>
            </form>
          </div>
        </div>
      </div>
    </div>
    @endforeach
  </div>
  @endif

  {{-- ── 歷史紀錄 ── --}}
  <h5 class="fw-semibold mb-3">歷史紀錄</h5>
  <div class="card border-0 shadow-sm">
    <div class="table-responsive">
      <table id="fwSupTable" class="table table-hover align-middle mb-0">
        <thead class="table-light">
          <tr>
            <th>#</th><th>申請人</th><th>IP</th><th>Port</th>
            <th>申請原因</th><th>狀態</th><th>初審備註</th><th>初審時間</th>
          </tr>
        </thead>
        <tbody>
          @forelse($reviewed as $r)
          <tr>
            <td class="text-muted small">{{ $r->id }}</td>
            <td>
              <div>{{ $r->user->name }}</div>
              <div class="text-muted small">{{ $r->user->email }}</div>
            </td>
            <td><code>{{ $r->ip_address }}</code></td>
            <td>
              @foreach($r->ports as $p)
                <span class="badge bg-secondary me-1">{{ $p }}</span>
              @endforeach
            </td>
            <td class="small text-muted" style="max-width:200px;"><span class="text-truncate d-block" title="{{ $r->reason }}">{{ $r->reason }}</span></td>
            <td><span class="badge bg-{{ $r->statusBadge() }}">{{ $r->statusLabel() }}</span></td>
            <td class="small text-muted">{{ $r->supervisor_note ?: '—' }}</td>
            <td class="small text-muted">{{ $r->supervisor_reviewed_at?->format('Y/m/d H:i') ?? '—' }}</td>
          </tr>
          @empty
          <tr><td colspan="8" class="text-center text-muted py-4">尚無紀錄</td></tr>
          @endforelse
        </tbody>
      </table>
    </div>
  </div>

</div>
@endsection

@push('scripts')
<script>
$(function () {
    $('#fwSupTable').DataTable({
        order: [[0, 'desc']],
        pageLength: 20,
        language: { url: '/vendor/datatables/i18n/zh-HANT.json' },
        columnDefs: [{ targets: [3, 4, 6], orderable: false }]
    });
});
</script>
@endpush