@extends('admin.admin_dashboard')
@section('admin')

<div class="page-content">
  <div class="container-fluid">

    {{-- Breadcrumb & New Payment --}}
    <div class="page-breadcrumb d-flex flex-column flex-sm-row align-items-center justify-content-between mb-3 p-3 bg-primary text-white rounded shadow-sm">
      <nav aria-label="breadcrumb">
        <ol class="breadcrumb mb-0 p-0">
          <li class="breadcrumb-item">
            <a href="{{ route('admin.dashboard') }}" class="text-white">
              <i class="bx bx-home-alt"></i>
            </a>
          </li>
          <li class="breadcrumb-item active text-white" aria-current="page">Advance Payments</li>
        </ol>
      </nav>
      @can('advances.add')
      <a href="{{ route('advances.create') }}" class="btn btn-light d-flex align-items-center">
        <i class="bx bx-plus-circle me-2"></i> New Payment
      </a>
      @endcan
    </div>

    @can('advances.view')
    <div class="card shadow border-0 rounded">
      <div class="card-body p-4">
        <div class="table-responsive">
          <table id="example" class="table table-hover table-striped table-bordered align-middle">
            <thead class="table-dark">
              <tr>
                <th>#</th>
                <th>Advance Ref</th>
                <th>Farmer</th>
                <th class="text-end">Amount</th>
                <th>Date</th>
                <th class="text-center">Action</th>
              </tr>
            </thead>
            <tbody>
              @foreach($payments as $k => $p)
              <tr>
                <td class="fw-bold text-center">{{ $k+1 + ($payments->currentPage()-1)*$payments->perPage() }}</td>
                <td>#{{ $p->advance->id }}</td>
                <td>{{ $p->advance->farmer->farmer_fname }}</td>
                <td class="text-end">{{ number_format($p->payment_amount,2) }}</td>
                <td>{{ \Carbon\Carbon::parse($p->payment_date)->format('Y-m-d') }}</td>
                <td class="text-center">
                  <div class="dropdown">
                    <a href="#" class="btn btn-light btn-sm dropdown-toggle" data-bs-toggle="dropdown">
                      <i class="bx bx-dots-vertical-rounded"></i>
                    </a>
                    <ul class="dropdown-menu dropdown-menu-end">
                      @can('advances.view')
                      <li><a class="dropdown-item" href="{{ route('advances.show',$p->id) }}">
                        <i class="bx bx-show me-2"></i> View
                      </a></li>
                      @endcan
                      @can('advances.edit')
                      <li><a class="dropdown-item" href="{{ route('advances.edit',$p->id) }}">
                        <i class="bx bx-edit-alt me-2"></i> Edit
                      </a></li>
                      @endcan
                      @can('advances.delete')
                      <li><a class="dropdown-item text-danger delete-advance" href="{{ route('advances.destroy',$p->id) }}">
                        <i class="bx bx-trash me-2"></i> Delete
                      </a></li>
                      @endcan
                    </ul>
                  </div>
                </td>
              </tr>
              @endforeach
            </tbody>
          </table>
        </div>
        <div class="mt-3">
          {{ $payments->links('vendor.pagination.bootstrap-5') }}
        </div>
      </div>
    </div>
    @endcan

  </div>
</div>

<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script>
document.addEventListener('DOMContentLoaded', function(){
  document.querySelectorAll('.delete-advance').forEach(el=>{
    el.addEventListener('click', e=>{
      e.preventDefault();
      Swal.fire({
        title: 'Delete this payment?',
        text: "This cannot be undone!",
        icon: 'warning',
        showCancelButton: true,
        confirmButtonText: 'Yes, delete'
      }).then(r=>{
        if(r.isConfirmed) window.location.href = el.getAttribute('href');
      });
    });
  });
});
</script>

@endsection