@extends('layouts.app')

@section('title', 'পেমেন্ট অ্যালার্ট')

@section('content')
<div class="topbar">
  <div>
    <h1>পেমেন্ট অ্যালার্ট</h1>
    <div class="topbar-sub">সব পার্টির বকেয়া ও রিমাইন্ডার এক জায়গায়</div>
  </div>
  <a href="{{ route('alerts.create') }}" class="btn btn-gold">+ নতুন অ্যালার্ট</a>
</div>

<div class="panel">
  <div class="panel-head">
    <h2>অ্যালার্ট তালিকা</h2>
    <div style="display:flex; gap:10px; align-items:center; flex-wrap:wrap;">
      <div class="tabs">
        @foreach (['all' => 'সব', 'due' => 'বকেয়া', 'overdue' => 'ওভারডিউ', 'paid' => 'পরিশোধিত'] as $key => $label)
          <a href="{{ route('alerts.index', array_filter(['status' => $key, 'q' => $q])) }}"
             class="tab {{ $status === $key ? 'active' : '' }}">{{ $label }}</a>
        @endforeach
      </div>
      <form method="GET" action="{{ route('alerts.index') }}">
        <input type="hidden" name="status" value="{{ $status }}">
        <input class="search-box" type="text" name="q" value="{{ $q }}" placeholder="পার্টি খুঁজুন...">
      </form>
    </div>
  </div>
  <table>
    <thead><tr><th>পার্টি</th><th>পরিমাণ</th><th>মেয়াদ</th><th>স্ট্যাটাস</th><th style="text-align:right;">অ্যাকশন</th></tr></thead>
    <tbody>
      @forelse ($alerts as $alert)
        <tr class="row">
          <td><div class="party">{{ $alert->party->name }}</div><div class="party-sub">{{ $alert->party->branch }}</div></td>
          <td class="amt">৳ {{ number_format($alert->amount, 0) }}</td>
          <td>{{ $alert->due_date->translatedFormat('d M Y') }}</td>
          <td>
            @if ($alert->status === 'paid')
              <span class="badge paid">পরিশোধিত</span>
            @elseif ($alert->status === 'overdue')
              <span class="badge overdue">ওভারডিউ</span>
            @else
              <span class="badge due">বকেয়া</span>
            @endif
          </td>
          <td>
            <div class="row-actions">
              @if ($alert->status !== 'paid')
                <form method="POST" action="{{ route('alerts.remind', $alert) }}">
                  @csrf
                  <button class="mini-btn" type="submit">
                    {{ $alert->reminder_sent_at ? '✓ পুনরায় পাঠান' : 'রিমাইন্ডার পাঠান' }}
                  </button>
                </form>
                <form method="POST" action="{{ route('alerts.markPaid', $alert) }}">
                  @csrf
                  <button class="mini-btn" type="submit">পরিশোধিত করুন</button>
                </form>
              @else
                <span class="mini-btn" style="color:var(--success); border-color:var(--success);">✓ সম্পন্ন</span>
              @endif
            </div>
          </td>
        </tr>
      @empty
        <tr><td colspan="5" style="text-align:center; color:var(--text3); padding:28px;">কোনো ফলাফল পাওয়া যায়নি</td></tr>
      @endforelse
    </tbody>
  </table>
  <div class="pagination">{{ $alerts->links() }}</div>
</div>
@endsection