@extends('app-new')
@push('head-script')
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/tables/datatable/dataTables.bootstrap5.min.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/tables/datatable/responsive.bootstrap5.min.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/components.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/vendors.min.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/extensions/toastr.min.css">

    <!-- BEGIN: Page CSS-->
    <link rel="stylesheet" type="text/css" href="/app-assets/css/core/menu/menu-types/vertical-menu.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/plugins/forms/pickers/form-flat-pickr.css">
    <!-- END: Page CSS-->
@endpush

@push('content-header')
    <div class="row breadcrumbs-top">
        <div class="col-12">
            <h2 class="content-header-title float-start mb-0">Bus Late Report</h2>
            <div class="breadcrumb-wrapper">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="/{!! $alias !!}/home">{{ trans('common/common.home') }}</a>
                    </li>
                    <li class="breadcrumb-item"><a href="/{!! $alias !!}/buses">Buses</a>
                    </li>
                    <li class="breadcrumb-item active">Bus Late Report
                    </li>
                </ol>
            </div>
        </div>
    </div>
@endpush
@section('content')
    <section id="dashboard-ecommerce">
        <div class="row match-height">
            <!-- Statistics Card -->
            <div class="col-xl-12 col-md-12 col-12">
                <div class="card card-statistics">
                    <div class="card-body statistics-body">
                        <form>
                            <div class="row">
                                <div class="col-md-12">
                                    <div class="row d-flex align-items-end">
                                        <div class="col-md-2">
                                            <label class="form-label"
                                                for="year">{{ trans('admin/template.year') }}</label>
                                            <select class="form-control mb-2 select2" name="year" id="year">
                                                @foreach ($years as $val)
                                                    <option class="form-control" value="{{ $val }}"
                                                        @if ($val == $year) selected @endif>
                                                        {{ $val }}</option>
                                                @endforeach
                                            </select>
                                        </div>

                                        <div class="col-md-2">
                                            <label class="form-label"
                                                for="area_id">{{ trans('admin/template.month') }}</label>
                                            <select class="form-control mb-2 select2" name="month" id="month">
                                                @foreach ($months as $key => $val)
                                                    <option class="form-control" value="{{ $key }}"
                                                        @if ($key == $month) selected @endif>
                                                        {{ $val }}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                        
                                        <div class="col-md-3">
                                            <label class="form-label" for="basicSelect">Bus</label>
                                            <select class="form-control select2" id="bus_id" name="bus_id">
                                                <option value="0">All</option>
                                                @foreach ($buses as $bus)
                                                    <option value="{{ $bus->id }}"
                                                        @if (old('bus_id', request()->bus_id) == $bus->id) selected @endif>
                                                        {{ $bus->name }}
                                                    </option>
                                                @endforeach
                                            </select>
                                        </div>

                                        <div class="col-md-3">
                                            <label class="form-label" for="basicSelect">Shift</label>
                                            <select class="form-control select2" id="shift_id" name="shift_id">
                                                <option value="0">All</option>
                                                @foreach ($shifts as $shift)
                                                    <option value="{{ $shift->id }}"
                                                        @if (old('shift_id', request()->shift_id) == $shift->id) selected @endif>
                                                        {{ $shift->name }}
                                                    </option>
                                                @endforeach
                                            </select>
                                        </div>

                                        <div class="col-md-1">
                                            <button class="btn btn-primary">
                                                {{ trans('common/common.search') }}
                                            </button>
                                        </div>

                                        <div class="col-md-1">
                                            <a target="_blank"
                                                href="/{!! $alias !!}/bus/late-report/export?{{ request()->getQueryString() }}"
                                                class="btn btn-secondary">
                                                <span>PDF</span>
                                            </a>
                                        </div>

                                        <div class="col-md-12 mt-2">
                                            <div class="table-responsive">
                                                <table class="table mt-2">
                                                    <thead>
                                                        <tr>
                                                            <th>#</th>
                                                            <th>Bus Name</th>
                                                            <th>Date</th>
                                                            <th>Shift</th>
                                                            <th>Check In Time</th>
                                                            <th>Check Out Time</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        @foreach ($busLogs as $key => $busLog)
                                                            <tr>
                                                                <td>{{ $key + 1 }}</td>
                                                                <td>{{ @$busLog->bus->name }}</td>
                                                                <td>{{ @$busLog->date }}</td>
                                                                <td>{{ @$busLog->shift->name }}</td>
                                                                <td
                                                                    class="{{ $busLog->bus->incoming_end_time < $busLog->check_in_time ? 'text-danger' : 'text-success' }}">
                                                                    {{ @$busLog->check_in_time }}
                                                                </td>
                                                                <td class="{{ $busLog->bus->outgoing_start_time < $busLog->check_out_time ? 'text-danger' : 'text-success' }}">{{ @$busLog->check_out_time }}</td>
                                                            </tr>
                                                        @endforeach
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Dashboard Ecommerce ends -->
@endsection
@push('footer-script')
    <!-- BEGIN: Page Vendor JS-->
    <script src="/app-assets/vendors/js/tables/datatable/jquery.dataTables.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/dataTables.bootstrap5.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/dataTables.responsive.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/responsive.bootstrap5.js"></script>
    <script src="/app-assets/vendors/js/pickers/flatpickr/flatpickr.min.js"></script>
    <script src="/app-assets/js/scripts/ui/ui-feather.js"></script>

    <script src="/app-assets/vendors/js/tables/datatable/datatables.checkboxes.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/datatables.buttons.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/jszip.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/pdfmake.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/vfs_fonts.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/buttons.html5.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/buttons.print.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/dataTables.rowGroup.min.js"></script>
    <!-- END: Page Vendor JS-->
    <script src="/app-assets/vendors/js/extensions/toastr.min.js"></script>
    <script type="text/javascript" src="/assets/js/moment.min.js"></script>
    <script type="text/javascript" src="/assets/js/daterangepicker.js"></script>
    <link rel="stylesheet" type="text/css" href="/assets/css/daterangepicker.css" />

    <script src="/app-assets/vendors/js/forms/wizard/bs-stepper.min.js"></script>
    <script src="/app-assets/vendors/js/forms/select/select2.full.min.js"></script>
    <script src="/app-assets/js/scripts/forms/form-wizard.js"></script>
    <script src="{{ asset('js/common-script.js') }}"></script>
    <script src="{{ asset('js/sweetalert.js') }}"></script>

    <!-- BEGIN: Page JS-->
    <!-- END: Page JS-->
    <script>
        $(window).on('load', function() {
            if (feather) {
                feather.replace({
                    width: 14,
                    height: 14
                });
            }
        });
    </script>
@endpush