@extends('layouts.admin')

@section('title','Jabatan')

@section('content')
<div class="page-head">
    <div>
        <h1 class="page-title">Jabatan</h1>
        <p class="page-subtitle">Kelola jabatan berdasarkan departemen.</p>
    </div>
    <button class="btn btn-gold" data-modal-open="positionModal">
        <i data-lucide="plus"></i> Tambah Jabatan
    </button>
</div>

<form class="card filter-bar">
    <div class="field">
        <label>Pencarian</label>
        <input class="control" name="q" value="{{ request('q') }}" placeholder="Nama jabatan">
    </div>
    <button class="btn btn-primary">
        <i data-lucide="search"></i> Cari
    </button>
</form>

<div class="card table-wrap">
    <table class="data-table">
        <thead>
            <tr>
                <th>Jabatan</th>
                <th>Departemen</th>
                <th>Deskripsi</th>
                <th>Karyawan</th>
                <th>Status</th>
                <th>Aksi</th>
            </tr>
        </thead>
        <tbody>
            @forelse($items as $item)
                <tr>
                    <td><strong>{{ $item->name }}</strong></td>
                    <td>{{ $item->department->name }}</td>
                    <td>{{ Str::limit($item->description,50) }}</td>
                    <td>{{ $item->employees_count }}</td>
                    <td><span class="badge {{ $item->status }}">{{ ucfirst($item->status) }}</span></td>
                    <td>
                        <div class="cluster">
                            <button
                                type="button"
                                class="btn btn-ghost btn-sm"
                                data-modal-open="positionModal"
                                data-title="Edit Jabatan"
                                data-method="PUT"
                                data-record="{{ json_encode($item->only(['department_id','name','description','status'])) }}"
                                data-action="{{ route('admin.positions.update',$item) }}"
                                aria-label="Edit jabatan {{ $item->name }}"
                                title="Edit jabatan"
                            >
                                <i data-lucide="pencil"></i>
                            </button>
                            <form
                                method="post"
                                action="{{ route('admin.positions.destroy',$item) }}"
                                data-confirm="Hapus jabatan {{ $item->name }}?"
                            >
                                @csrf
                                @method('DELETE')
                                <button
                                    class="btn btn-danger btn-sm"
                                    @disabled($item->employees_count > 0)
                                    aria-label="Hapus jabatan {{ $item->name }}"
                                    title="{{ $item->employees_count > 0 ? 'Tidak bisa dihapus karena masih digunakan karyawan' : 'Hapus jabatan' }}"
                                >
                                    <i data-lucide="trash-2"></i>
                                </button>
                            </form>
                        </div>
                    </td>
                </tr>
            @empty
                <tr><td colspan="6" class="empty">Belum ada data jabatan.</td></tr>
            @endforelse
        </tbody>
    </table>
</div>

<div style="margin-top:16px">{{ $items->links() }}</div>

<dialog class="modal" id="positionModal">
    <form method="post" action="{{ route('admin.positions.store') }}">
        @csrf
        <input type="hidden" name="_method" value="POST">

        <div class="modal-head split">
            <strong data-modal-title>Tambah Jabatan</strong>
            <button type="button" class="btn btn-ghost btn-sm" data-modal-close>
                <i data-lucide="x"></i>
            </button>
        </div>

        <div class="modal-body stack">
            <div class="field">
                <label>Departemen</label>
                <select class="control" name="department_id" required>
                    @foreach($departments as $department)
                        <option value="{{ $department->id }}">{{ $department->name }}</option>
                    @endforeach
                </select>
            </div>
            <div class="field">
                <label>Nama jabatan</label>
                <input class="control" name="name" required>
            </div>
            <div class="field">
                <label>Deskripsi</label>
                <textarea class="control" name="description"></textarea>
            </div>
            <div class="field">
                <label>Status</label>
                <select class="control" name="status">
                    <option value="active">Aktif</option>
                    <option value="inactive">Tidak Aktif</option>
                </select>
            </div>
        </div>

        <div class="form-actions">
            <button type="button" class="btn btn-ghost" data-modal-close>Batal</button>
            <button class="btn btn-gold">
                <i data-lucide="save"></i> Simpan Jabatan
            </button>
        </div>
    </form>
</dialog>
@endsection