@extends('layouts.base')
@section('tittle', 'List Driver')
@section('content')

<div class="d-flex justify-content-between align-items-center mb-4">
    <div>
        <h1 class="h3 mb-0 text-gray-800">List Data Driver</h1>
        <p class="mb-0">Data ini dikelola oleh Logistic Division</p>
    </div>
    <div>
        <a href="{{ route('adddriver') }}" class="btn btn-info btn-icon-split" style="font-size: 1.5rem;">
            <span class="icon text-white-50"><i class="fas fa-plus"></i></span> <span class="text">Tambah Driver</span>
        </a>
    </div>
</div>

<div class="table-responsive">
    <table class="table table-bordered" id="mytable" width="100%" cellspacing="0">
        <thead>
            <tr>
                <th>Nama</th>
                <th>Nomer HP</th>
            @if (Auth::user()->role_id == 2)
                <th hidden>AKSI</th>
            @elseif (Auth::user()->role_id == 1)
                <th>AKSI</th>
            @endif
            </tr>
        </thead>
        <tbody id="tableBody">
            @include('cars.drivers_table_data', ['drivers' => $drivers])
        </tbody>
    </table>
</div>

<script>
    $(document).ready(function() {
        // Inisialisasi DataTables dengan tombol export dan kustomisasi warna
        $('#mytable').DataTable({
            dom: 'Bfrtip', // 'B' untuk Buttons (tombol export)
            buttons: [
                {
                    extend: 'copy',
                    text: '<i class="fas fa-copy"></i> Salin', // Ikon Font Awesome + teks
                    className: 'btn btn-info btn-sm' // Kelas Bootstrap untuk warna biru muda
                },
                {
                    extend: 'csv',
                    text: '<i class="fas fa-file-csv"></i> CSV',
                    className: 'btn btn-success btn-sm' // Kelas Bootstrap untuk warna hijau
                },
                {
                    extend: 'excel',
                    text: '<i class="fas fa-file-excel"></i> Excel',
                    className: 'btn btn-primary btn-sm' // Kelas Bootstrap untuk warna biru utama
                },
                {
                    extend: 'pdf',
                    text: '<i class="fas fa-file-pdf"></i> PDF',
                    className: 'btn btn-danger btn-sm' // Kelas Bootstrap untuk warna merah
                },
                {
                    extend: 'print',
                    text: '<i class="fas fa-print"></i> Cetak',
                    className: 'btn btn-secondary btn-sm' // Kelas Bootstrap untuk warna abu-abu
                },
                {
                    extend: 'colvis',
                    text: '<i class="fas fa-columns"></i> Kolom',
                    className: 'btn btn-dark btn-sm' // Kelas Bootstrap untuk warna gelap
                }
            ]
        });

        $(document).on('click', '.delete-btn', function() {
            var id = $(this).data('id');
            $('#confirmDelete').data('id', id);
        });

        $('#confirmDelete').click(function() {
            var id = $(this).data('id');
            $.ajax({
                type: "POST",
                url: "{{ route('deletedriver', ['id' => 'placeholder']) }}".replace('placeholder', id),
                data: {
                    "_token": "{{ csrf_token() }}"
                },
                success: function(data) {
                    $('#deleteModal').modal('hide');
                    if (data.success) {
                        // Jika ada elemen alert success di halaman
                        if ($('#ajaxSuccessAlert').length) {
                            $('#ajaxSuccessAlert').text(data.message).show();
                            setTimeout(function() {
                                $('#ajaxSuccessAlert').fadeOut('fast');
                                location.reload();
                            }, 300);
                        } else {
                            // Jika tidak ada, fallback ke alert browser
                            alert(data.message);
                            location.reload(); // Refresh halaman setelah sukses
                        }
                    } else {
                        alert(data.message);
                    }
                },
                error: function(data) {
                    console.log('Error:', data);
                    alert('Terjadi kesalahan saat menghapus data.');
                }
            });
        });
    });
</script>

@endsection