@extends('employee.layouts.app')
@section('title', 'Manajemen Karier | Career Development and Consultation (CDC)')
@push('styles')
    <link href="{{ asset('assets/employee/plugins/custom/datatables/datatables.bundle.css') }}" rel="stylesheet"
        type="text/css" />
@endpush
@section('navigation')
    <h1 class="my-1 d-flex align-items-center text-dark fw-bolder fs-3">Karier
        <span class="mx-2 border-gray-200 h-20px border-start ms-3"></span>
        <small class="my-1 text-muted fs-7 fw-bold ms-1">Manajemen Karier</small>
    </h1>
@endsection
@section('content')
    <div class="card">
        <div class="pt-4 border card-body">
            <table class="table align-middle table-row-dashed fs-6 gy-5" id="myTable">
                <thead>
                    <th class="max-w-5px">Nomor</th>
                    <th class="min-w-50px">Kode</th>
                    <th class="min-w-125px">Karier</th>
                    <th class="min-w-100px">Tipe Karier</th>
                    <th class="min-w-125px">Jurusan</th>
                    <th class="min-w-125px">Deskripsi</th>
                    <th class="min-w-100px">Pengaturan</th>
                </thead>
                <tbody class="text-gray-600 fw-bold">
                    @foreach ($careers as $index => $career)
                        <tr>
                            <td>{{ $index + 1 }}</td>
                            <td>{{ $career->career_code }}</td>
                            <td>{{ ucfirst($career->career_title) }}</td>
                            <td>{{ $career->is_specific === 1 ? 'Spesifik' : 'Umum' }}</td>
                            <td>
                                @foreach ($career->departments as $department)
                                    <span class="badge badge-light">{{ $department->department_name }}</span>
                                @endforeach
                            <td>{!! mb_strimwidth($career->career_description, 0, 150, '...') !!}</td>
                            <td>
                                <div class="d-flex">
                                    <a href="{{ route('careers.edit', $career->id) }}"
                                        class="btn btn-light btn-active-light-primary btn-sm">Perbarui
                                    </a>
                                    <form action="{{ route('careers.delete', $career->id) }}" method="POST">
                                        @csrf
                                        @method('delete')
                                        <a onclick="event.preventDefault(); this.closest('form').submit();"
                                            class="mx-2 btn btn-light btn-active-light-primary btn-sm">Hapus</a>
                                    </form>
                                </div>
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
@endsection
@push('scripts')
    <script src="{{ asset('assets/employee/plugins/custom/datatables/datatables.bundle.js') }}"></script>
    <script src="{{ asset('assets/employee/plugins/custom/datatables/table.js') }}"></script>
@endpush