{{-- resources/views/admin/keuangan/pengaturan/_tab_keuangan_keluar_jenis.blade.php --}}
{{-- Tombol Tambah --}}
<div class="d-flex mb-3">
    <button class="btn btn-primary btn-round" data-bs-toggle="modal" data-bs-target="#modalTambahJenisKeluar">
        <i class="fa fa-plus"></i> Tambah Jenis Pengeluaran
    </button>
</div>

{{-- Tabel Daftar --}}
<div class="table-responsive">
    <table class="table table-striped table-hover align-middle">
        <thead class="table-dark text-center">
            <tr>
                <th>No</th>
                <th>Nama Jenis Pengeluaran</th>
                <th>Kategori</th>
                <th>Keterangan</th>
                <th>Aksi</th>
            </tr>
        </thead>
        <tbody>
            @forelse ($jenisKeluar as $item)
                <tr class="text-center">
                    <td>{{ ($jenisKeluar->currentPage()-1) * $jenisKeluar->perPage() + $loop->iteration }}</td>
                    <td class="text-start fw-bold">{{ $item->nama_jenis }}</td>
                    <td>{{ $item->kategori }}</td>
                    <td class="text-start">{{ $item->keterangan }}</td>
                    <td>
                        <div class="btn-group" role="group">
                            <button class="btn btn-warning btn-sm" data-bs-toggle="modal" data-bs-target="#modalEditJenisKeluar-{{ $item->id }}" title="Edit">
                                <i class="fa fa-edit"></i>
                            </button>
                            <form action="{{ route('admin.keuangan-keluar-jenis.destroy', $item->id) }}" 
                                  method="POST" class="d-inline"
                                  data-confirm-delete="true"
                                  data-item-name="{{ $item->nama_jenis }}">
                                @csrf
                                @method('DELETE')
                                <button type="submit" class="btn btn-danger btn-sm" title="Hapus"><i class="fa fa-trash"></i></button>
                            </form>
                        </div>
                    </td>
                </tr>
            @empty
                <tr>
                    <td colspan="5" class="text-center text-muted py-4">Belum ada data jenis pengeluaran.</td>
                </tr>
            @endforelse
        </tbody>
    </table>
    {{-- Paginasi --}}
    <div class="mt-3 d-flex justify-content-end">
        {{ $jenisKeluar->appends(['jenis_keluar_page' => $jenisKeluar->currentPage()])->links('pagination::bootstrap-5') }}
    </div>
</div>

<div class="modal fade" id="modalTambahJenisKeluar" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">Tambah Jenis Pengeluaran Baru</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <form method="POST" action="{{ route('admin.keuangan-keluar-jenis.store') }}">
        @csrf
        <div class="modal-body">
          <div class="mb-3">
            <label for="nama_jenis_tambah_keluar" class="form-label">Nama Jenis <span class="text-danger">*</span></label>
            <input type="text" class="form-control @error('nama_jenis') is-invalid @enderror" 
                   id="nama_jenis_tambah_keluar" name="nama_jenis" value="{{ old('nama_jenis') }}" required placeholder="Contoh: Belanja ATK">
            @error('nama_jenis') <div class="invalid-feedback">{{ $message }}</div> @enderror
          </div>
          <div class="mb-3">
            <label for="kategori_tambah_keluar" class="form-label">Kategori</label>
            <input type="text" class="form-control @error('kategori') is-invalid @enderror" 
                   id="kategori_tambah_keluar" name="kategori" value="{{ old('kategori') }}" placeholder="Contoh: Operasional">
            @error('kategori') <div class="invalid-feedback">{{ $message }}</div> @enderror
          </div>
          <div class="mb-3">
            <label for="keterangan_tambah_keluar" class="form-label">Keterangan</label>
            <textarea class="form-control @error('keterangan') is-invalid @enderror" 
                      id="keterangan_tambah_keluar" name="keterangan" rows="3">{{ old('keterangan') }}</textarea>
          </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Batal</button>
          <button type="submit" class="btn btn-primary">Simpan</button>
        </div>
      </form>
    </div>
  </div>
</div>

@foreach ($jenisKeluar as $item)
<div class="modal fade" id="modalEditJenisKeluar-{{ $item->id }}" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">Edit: {{ $item->nama_jenis }}</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <form method="POST" action="{{ route('admin.keuangan-keluar-jenis.update', $item->id) }}">
        @csrf
        @method('PUT')
        <div class="modal-body">
          <div class="mb-3">
            <label for="nama_jenis-{{ $item->id }}" class="form-label">Nama Jenis <span class="text-danger">*</span></label>
            <input type="text" class="form-control @error('nama_jenis') is-invalid @enderror" 
                   id="nama_jenis-{{ $item->id }}" name="nama_jenis" 
                   value="{{ old('nama_jenis', $item->nama_jenis) }}" required>
            @error('nama_jenis') <div class="invalid-feedback">{{ $message }}</div> @enderror
          </div>
          <div class="mb-3">
            <label for="kategori-{{ $item->id }}" class="form-label">Kategori</label>
            <input type="text" class="form-control @error('kategori') is-invalid @enderror" 
                   id="kategori-{{ $item->id }}" name="kategori" 
                   value="{{ old('kategori', $item->kategori) }}">
            @error('kategori') <div class="invalid-feedback">{{ $message }}</div> @enderror
          </div>
          <div class="mb-3">
            <label for="keterangan-{{ $item->id }}" class="form-label">Keterangan</label>
            <textarea class="form-control @error('keterangan') is-invalid @enderror" 
                      id="keterangan-{{ $item->id }}" name="keterangan" rows="3">{{ old('keterangan', $item->keterangan) }}</textarea>
          </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Batal</button>
          <button type="submit" class="btn btn-primary">Simpan Perubahan</button>
        </div>
      </form>
    </div>
  </div>
</div>
@endforeach