@extends('layouts.app', ['class' => 'g-sidenav-show bg-gray-100'])
{{-- section content --}}
@section('content')
    @include('layouts.navbars.auth.topnav', ['title' => ''])
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">
                <div class="row mx-1">
                    <div class="card">
                        <div class="row">
                            <div class="card-header col-md-auto">
                                <h5 class="mb-0">List {{ $title_menu }}</h5>
                            </div>
                            <div class="col">
                                {{-- alert --}}
                                @include('components.alert')
                            </div>
                        </div>
                        <hr class="horizontal dark mt-0">
                        <div class="row px-4 py-2">
                            <div class="col-lg">
                                <div class="nav-wrapper">
                                    {{-- check authorize add --}}
                                    @if ($authorize->add == '1')
                                        {{-- button add --}}
                                        <button class="btn btn-primary mb-0"
                                            onclick="window.location='{{ URL::to($url_menu . '/add') }}'"><i
                                                class="fas fa-plus me-1"> </i><span class="font-weight-bold">Tambah</button>
                                    @endif
                                </div>
                            </div>
                        </div>
                        <div class="d-flex flex-wrap justify-content-between align-items-start gap-3 px-4">
                            <div class="d-flex gap-2">
                                <form action="{{ route('trkrr.excel') }}" method="POST" target="_blank">
                                    @csrf
                                    <button type="submit" class="btn btn-secondary btn-md">
                                        <i class="fas fa-file-excel text-success"></i> Excel
                                    </button>
                                </form>
                                <form action="">
                                    <button class="btn btn-secondary btn-md" type="button"
                                        onclick="window.open('{{ route('trs_trkrr.listpdf') }}', '_blank')">
                                        <i class="fas fa-file-pdf text-danger"></i> PDF
                                    </button>
                                </form>
                            </div>
                        </div>
                        <div class="row px-4">
                            <div class="table-responsive">
                                <table class="table display" id="penjadwalanTable">
                                    <thead class="thead-light" style="background-color: #00b7bd4f;">
                                        <tr>
                                            <th style="text-align:left; vertical-align:middle; padding-left:15px">No
                                            </th>
                                            <th style="text-align:left; vertical-align:middle; padding-left:15px">Action
                                            </th>
                                            <th style="text-align:left; vertical-align:middle; padding-left:15px">Nama
                                                Kurir</th>
                                            <th style="text-align:left; vertical-align:middle; padding-left:15px">Tanggal
                                            </th>
                                            <th style="text-align:left; vertical-align:middle; padding-left:15px">Kendaraan</th>
                                            <th style="text-align:left; vertical-align:middle; padding-left:15px">Status
                                            </th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @if ($trs_pengiriman->isEmpty())
                                            <tr>
                                                <td colspan="6" class="text-center py-2"
                                                    style="border-bottom:2px solid #b9b9b9; background-color: #f9f9f9;">Maaf
                                                    - Data tidak ada</td>
                                            </tr>
                                        @else
                                            @foreach ($trs_pengiriman as $pengiriman)
                                                @php
                                                    $isCancelled = strtolower($pengiriman->status) === 'cancel';
                                                @endphp
                                                <tr class="text-sm font-weight-normal"
                                                    style="{{ $isCancelled ? 'background-color:rgba(255, 0, 0, 0.3); color:black;' : 'background-color:#f9f9f9;' }} border-bottom:2px solid #b9b9b9;">
                                                    {{-- Kolom Action --}}
                                                    <td data-label="No"
                                                        style="text-align:left; vertical-align:middle; padding-left:15px">
                                                        {{ $loop->iteration }}</td>
                                                    <td data-label="Action">
                                                        <div class="btn-group">
                                                            {{-- Tombol View --}}
                                                            <button class="btn btn-primary btn-sm mb-0 px-3" type="button"
                                                                title="View Data"
                                                                onclick="window.location='{{ url($url_menu . '/show' . '/' . encrypt($pengiriman->id)) }}'">
                                                                <i class="fas fa-eye"></i>
                                                                <span class="font-weight-bold">View</span>
                                                            </button>
                                                            @if ($authorize->edit == '1' && strtolower($pengiriman->status) !== 'complete')
                                                                <button type="button"
                                                                    class="btn btn-sm btn-primary mb-0 px-3 dropdown-toggle dropdown-toggle-split"
                                                                    data-bs-toggle="dropdown" aria-expanded="false">
                                                                    <span class="visually-hidden">Toggle Dropdown</span>
                                                                </button>
                                                                <ul class="dropdown-menu">
                                                                    {{-- Tombol Edit --}}

                                                                        <li class="mb-2">
                                                                            <button type="button"
                                                                                class="btn btn-sm btn-warning mx-2 mb-0 w-90"
                                                                                title="Edit Data"
                                                                                onclick="window.location='{{ url($url_menu . '/edit' . '/' . encrypt($pengiriman->id)) }}'">
                                                                                <i class="fas fa-edit"></i>
                                                                                <span class="font-weight-bold"> Edit</span>
                                                                            </button>
                                                                        </li>

                                                                    {{-- Tombol Hapus --}}
                                                                    @if ($authorize->delete == '1')
                                                                        <li>
                                                                            <form
                                                                                action="{{ route('trdrv.destroy', ['id' => encrypt($pengiriman->id)]) }}"
                                                                                method="POST" style="display: inline">
                                                                                @csrf
                                                                                @method('DELETE')
                                                                                <button type="submit"
                                                                                    class="btn btn-sm btn-danger mx-2 mb-0 w-90"
                                                                                    title="Hapus Data"
                                                                                    onclick="deleteData(event, '{{ $pengiriman->id }}', 'menghapus')">
                                                                                    <i class="fas fa-trash"></i>
                                                                                    <span class="font-weight-bold"> Hapus</span>
                                                                                </button>
                                                                            </form>
                                                                        </li>
                                                                    @endif
                                                                </ul>
                                                            @endif
                                                        </div>
                                                    </td>
                                                    <td data-label="Nama Driver"
                                                        style="text-align:left; vertical-align:middle; padding-left:15px">
                                                        {{ $pengiriman->firstname }}</td>
                                                    <td data-label="Tanggal"
                                                        style="text-align:left; vertical-align:middle; padding-left:15px">
                                                        {{ \Carbon\Carbon::parse($pengiriman->tanggal)->locale('id')->translatedFormat('d F Y') }}
                                                    </td>
                                                    <td data-label="Kendaraan"
                                                        style="text-align:left; vertical-align:middle; padding-left:15px">
                                                        @php
                                                            $isManualValid =
                                                                is_string($pengiriman->nomor_kendaraan_manual) &&
                                                                !empty($pengiriman->nomor_kendaraan_manual);
                                                        @endphp

                                                        @if ($isManualValid)
                                                            {{ $pengiriman->nomor_kendaraan_manual }} - {{ $pengiriman->namakendaraan }}
                                                        @elseif (!empty($pengiriman->nomorkendaraan))
                                                            {{ $pengiriman->nomorkendaraan }} - {{ $pengiriman->namakendaraan }}
                                                        @else
                                                            Nomor Kendaraan Tidak Ada
                                                        @endif
                                                    </td>
                                                    <td data-label="Status"
                                                        style="text-align:left; vertical-align:middle; padding-left:15px">
                                                        {{ $pengiriman->status }}</td>
                                                </tr>
                                            @endforeach
                                        @endif
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="row px-4 py-2">
                            <div class="col-lg">
                                <div class="nav-wrapper" id="noted"><code>Note : <i aria-hidden="true"
                                            style="color: #ffc2cd;" class="fas fa-circle"></i> Data not active</code>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    {{-- check flag js on dmenu --}}
    @if ($jsmenu == '1')
        @if (view()->exists("js.{$dmenu}"))
            @push('addjs')
                {{-- file js in folder (resources/views/js) --}}
                @include('js.' . $dmenu);
            @endpush
        @else
            @push('addjs')
                <script>
                    Swal.fire({
                        title: 'JS Not Found!!',
                        text: 'Please Create File JS',
                        icon: 'error',
                        confirmButtonColor: '#028284'
                    });
                </script>
            @endpush
        @endif
    @endif
@endsection
<style>
    @media (max-width: 768px) {
        table.display thead {
            display: none;
        }

        table.display tbody tr {
            display: block;
            margin-bottom: 1rem;
            border: 1px solid #dee2e6;
            border-radius: 0.5rem;
            padding: 0.75rem;
            background-color: white;
        }

        table.display tbody td {
            display: flex;
            justify-content: space-between;
            padding: 0.5rem 0;
            border: none;
        }

        table.display tbody td::before {
            content: attr(data-label);
            font-weight: bold;
            color: #333;
        }
    }
</style>
@push('js')
    @if (!$trs_pengiriman->isEmpty())
        <script>
            $(document).ready(function() {
                $('#penjadwalanTable').DataTable({
                    responsive: true,
                    pageLength: 10,
                    ordering: true,
                    columnDefs: [{
                            orderable: false,
                            targets: 1
                        } // kolom "Action" tidak bisa di-sort
                    ]
                });
            });

            function deleteData(event, id, msg) {
                event.preventDefault(); // Hindari submit default
                Swal.fire({
                    title: 'Konfirmasi',
                    text: `Apakah Anda yakin ingin ${msg} data ${id}?`,
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonText: `Ya, ${msg}`,
                    cancelButtonText: 'Batal',
                    confirmButtonColor: '#d33'
                }).then((result) => {
                    if (result.isConfirmed) {
                        event.target.closest('form').submit();
                    }
                });
            }

            function downloadExcel() {
                const csrfToken = document.querySelector('meta[name="csrf-token"]').getAttribute('content');

                fetch("{{ route('trkrr.excel') }}", {
                        method: "POST",
                        headers: {
                            "X-CSRF-TOKEN": csrfToken,
                            "Accept": "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
                        }
                    })
                    .then(response => {
                        if (!response.ok) throw new Error('Network response was not OK');
                        return response.blob();
                    })
                    .then(blob => {
                        const url = window.URL.createObjectURL(blob);
                        const a = document.createElement('a');
                        a.href = url;
                        a.download = "list_jadwal_driver.xlsx";
                        document.body.appendChild(a);
                        a.click();
                        a.remove();
                        window.URL.revokeObjectURL(url);
                    })
                    .catch(error => {
                        alert("Gagal mengunduh file.");
                        console.error(error);
                    });
            }
        </script>
    @endif
@endpush