118 lines
5.1 KiB
PHP
118 lines
5.1 KiB
PHP
@extends('layouts.app')
|
|
|
|
@section('title', 'Data Divisi')
|
|
|
|
@section('script')
|
|
<script>
|
|
window.openEditModal = function (btn) {
|
|
const id = btn.dataset.id;
|
|
const nama = btn.dataset.nama;
|
|
|
|
document.getElementById('edit-id').value = id;
|
|
document.getElementById('edit-nama').value = nama;
|
|
|
|
let form = document.getElementById('form-edit');
|
|
let baseUrl = "{{ route('divisi.update', ':id') }}";
|
|
form.action = baseUrl.replace(':id', id);
|
|
|
|
window.dispatchEvent(new CustomEvent('open-modal', { detail: 'edit-divisi' }));
|
|
}
|
|
</script>
|
|
@endsection
|
|
|
|
@section('content')
|
|
<div class="space-y-6">
|
|
|
|
<x-page-header title="Data Divisi" subtitle="Kelola daftar divisi perusahaan.">
|
|
|
|
<button x-data @click="$dispatch('open-modal', 'create-divisi')"
|
|
class="px-5 py-2.5 bg-primary text-white text-sm font-semibold rounded-xl hover:bg-primary/90 transition shadow-lg shadow-indigo-500/20 flex items-center gap-2">
|
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path>
|
|
</svg>
|
|
Tambah Divisi
|
|
</button>
|
|
</x-page-header>
|
|
|
|
<div class="bg-white rounded-xl shadow-sm border border-slate-200 overflow-hidden">
|
|
<x-table>
|
|
<x-slot:header>
|
|
<th class="px-6 py-5 text-xs font-bold text-slate-500 uppercase tracking-wider text-left w-10">No</th>
|
|
<th class="px-6 py-5 text-xs font-bold text-slate-500 uppercase tracking-wider text-left">Nama Divisi
|
|
</th>
|
|
<th class="px-6 py-5 text-xs font-bold text-slate-500 uppercase tracking-wider text-right">Aksi</th>
|
|
</x-slot:header>
|
|
|
|
@forelse($divisi as $key => $d)
|
|
<tr class="hover:bg-slate-50 transition border-b border-slate-50 last:border-b-0">
|
|
|
|
<td class="px-6 py-4 text-slate-500">
|
|
{{ $divisi->firstItem() + $key }}
|
|
</td>
|
|
|
|
<td class="px-6 py-4 font-medium text-slate-800">
|
|
{{ $d->nama_divisi }}
|
|
</td>
|
|
|
|
<td class="px-6 py-4 text-right">
|
|
<div class="flex items-center justify-end gap-2">
|
|
|
|
<x-button-edit onclick="openEditModal(this)" data-id="{{ $d->id_divisi }}"
|
|
data-nama="{{ $d->nama_divisi }}" />
|
|
|
|
<form id="delete-form-{{ $d->id_divisi }}" action="{{ route('divisi.destroy', $d->id_divisi) }}"
|
|
method="POST" style="display: none;">
|
|
@csrf
|
|
@method('DELETE')
|
|
</form>
|
|
|
|
<x-delete-button :id="$d->id_divisi" />
|
|
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
@empty
|
|
<x-empty-state colspan="3" message="Belum ada data divisi" hint="Silakan tambahkan divisi baru." />
|
|
@endforelse
|
|
</x-table>
|
|
|
|
<x-pagination :paginator="$divisi" />
|
|
</div>
|
|
</div>
|
|
|
|
<x-modal name="create-divisi" title="Tambah Divisi Baru">
|
|
<form action="{{ route('divisi.store') }}" method="POST" class="space-y-4">
|
|
@csrf
|
|
<div>
|
|
<x-input label="Nama Divisi" name="nama_divisi" placeholder="Contoh: Information Technology" required />
|
|
</div>
|
|
<div class="flex justify-end gap-3 pt-4">
|
|
<button type="button" x-data @click="$dispatch('close-modal', 'create-divisi')"
|
|
class="px-4 py-2 text-sm font-medium text-slate-600 bg-white border border-slate-300 rounded-xl hover:bg-slate-50">Batal</button>
|
|
<button type="submit"
|
|
class="px-4 py-2 text-sm font-medium text-white bg-primary rounded-xl hover:bg-primary/90">Simpan</button>
|
|
</div>
|
|
</form>
|
|
</x-modal>
|
|
|
|
<x-modal name="edit-divisi" title="Edit Divisi">
|
|
<form id="form-edit" action="#" method="POST" class="space-y-4">
|
|
@csrf
|
|
@method('PUT')
|
|
|
|
<input type="hidden" id="edit-id" name="id">
|
|
|
|
<x-input label="Nama Divisi" name="nama_divisi" id="edit-nama" required />
|
|
|
|
<div class="flex justify-end gap-3 pt-4">
|
|
<button type="button" x-data @click="$dispatch('close-modal', 'edit-divisi')"
|
|
class="px-4 py-2 text-sm font-medium text-slate-600 bg-white border border-slate-300 rounded-xl hover:bg-slate-50">Batal</button>
|
|
<button type="submit"
|
|
class="px-4 py-2 text-sm font-medium text-white bg-amber-500 rounded-xl hover:bg-amber-600">Update</button>
|
|
</div>
|
|
</form>
|
|
</x-modal>
|
|
|
|
|
|
@endsection
|