@extends('layouts.master')
<style>
    .table-bordered td, .table-bordered th{ border:1px solid #00000042 !important; font-size: 13px !important; }
    .first-table td, .first-table th{ font-size: 13px !important; }
    .form-control { appearance: auto  !important; }
    .table:not(.table-bordered) td, .table:not(.table-bordered) th, .table:not(.table-bordered) tr {
    font-size: 1.075rem!important;
 
}
.odd {
    background-color: #f2f2f2 !important;
}
    @media print {
            #kt_header {
                display: none;
            }

            #kt_footer {
                display: none !important;
            }

            #backbtn,
            #detailsbtn,
            #yearDropdown,
            #printButton,
            #dropdownMenuButton1,
            #printandyeardropdown,
            #truckreporthead {
                display: none;
            }
        }

</style>
@section('content')
@php
                                                $currentYear = date('Y'); 
                                                $selectedYear = request()->get('year') ?? $currentYear; // Default to current year if not selected
                                                $startYear = 2019; // Set your starting year
                                            @endphp
    <div class="content d-flex flex-column flex-column-fluid" id="kt_content">
        <div id="kt_content_container" class="container-xxl">
            <div class="d-flex flex-wrap flex-stack pb-7">
            <h3 class="text-muted" id="pdfhead" style="display:none">Compliance Report</h3>
                <div class="d-flex flex-wrap align-items-center my-1"  id="topheadsection">
                    <h3 class="fw-bold me-5 my-1" id="truckreporthead">Compliance <span class="text-muted">Report</span>
                    </h3>
                    <a id="backbtn" href="{{ route('assets.trucks.edit',$truck->truck_id) }}" class="btn btn-primary btn-sm me-2"><i
                    class="fa fa-arrow-left" aria-hidden="true"></i>Back</a>

                                    <div class="row" id="yearDropdown">

                                    <select id="year" class="form-control ms-4" style="padding: 7px; display:none">
                                            <option value="">Please select</option>
                                       
                                            @for ($year = $currentYear; $year >= $startYear; $year--)
                                                <option value="{{ $year }}" @if($selectedYear == $year) selected @endif>{{ $year }}</option>
                                            @endfor
                                        </select>
                                  </div>

                                  <a class="btn btn-primary btn-sm me-2 ms-10" href="javascript:void(0);" onclick="window.print()" id="printButton">Print</a>
                                  <!-- <button class="btn btn-primary dropdown-toggle" type="button" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false" style="padding: 7px 10px;">
                                       Export
                                    </button>
                                    <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton1" id="printandyeardropdown">
                                        <li><a class="dropdown-item" href="{{ route('assets.trucks.truckProfitSummeryReportPdf',$truck->truck_id) }}?year={{$cur_year}}" class="btn btn-primary btn-sm me-2">Pdf</a> </li>
                                        <li><a class="dropdown-item" href="{{ route('assets.trucks.totalprofitsummeryForTurckCsv',$truck->truck_id) }}?year={{$cur_year}}" class="btn btn-primary btn-sm me-2">Csv</a> </li>
                                        <li><a class="dropdown-item" href="{{ route('assets.trucks.yearlyprofitTruckSummeryReportExcel',$truck->truck_id) }}?year={{$cur_year}}" class="btn btn-primary btn-sm me-2">Excel</a> </li>
                                    </ul> -->
                                    <a id="backbtn" target="_blank" href="{{ route('assets.trucks.edit',$truck->truck_id) }}" class="btn btn-primary btn-sm ms-2">View Truck #{{$truck->UNIT_ID}}</a>
                                    <!-- <a id="detailsbtn" href="{{ route('assets.trucks.profitAndLossReport',$truck->truck_id) }}?year={{$cur_year}}" target="_blank" class="btn btn-primary btn-sm ms-2">Summary Report Details</a> -->
                    <h3 class="fw-bold me-5 my-1"></h3>
                </div>
            </div>
            <div class="card card-flush">
                <div class="card-body">
                    <div class=" pb-lg-11 pb-7">
                        <div class="container">
                                <div class="modal-body">
                                        <div  style="margin:0 auto;text-align:center;"> <span  style="font-weight: bold; font-size: 20px; margin-top: 9px;">{{ getAuthCompanyName() }} - Truck#({{$truck->UNIT_ID}})</span></div>
                                        <h3 style="color:green">Compliance Report</h3>
                                        <hr>    
                                        <div class="row">
                                        <table class="table first-table" width="100%">
                                                <tr>
                                                  <td><b>Unit#:</b> {{$truck->UNIT_ID}}</td>
                                                  <td><b>Make: </b>{{$truck->MAKE}}</td>
                                                  <td><b>Model:</b> {{$truck->MODEL}}</td>
                                                  <td><b>Year:</b> {{$truck->year}}</td>
                                                  

                                                </tr>
                                                <tr>
                                                   <td><b>Plate / Reg #:</b> {{$truck->PLATE}}</td>
                                                   <td><b>VIN:</b> {{$truck->VIN}}</td>                                                  
                                                   <td><b>Registration Expiration:</b> {{ ($truck->LIC_1_EXP_DATE && $truck->LIC_1_EXP_DATE != '0000-00-00 00:00:00') ? date('m/d/Y',strtotime($truck->LIC_1_EXP_DATE)) : ''}}</td>
                                                   <td></td>                                             
                                                 </tr>
                                               
                                            </table>
                                              </div>                                            
                                            <hr>
                                            <div class="row">                        
                                            <div class="table-responsive p-5">
                                              <h2 class="fw-bold text-gray-900 mt-2">All Repairs</h2>
                                                {!! $dataTable->table() !!}

                                                </div>

                                            </div>
                                            <div class="table-responsive p-5">
                                            <h2 class="fw-bold text-gray-900 mt-2">All DVIR</h2>
                                            <table id="truckDvirList"
                                                    class="table table-striped table-row-bordered table-row-dashed gy-4 align-middle fw-bold dataTable no-footer">
                                                    <thead>
                                                        <tr class="thead-bg-color">
                                                            <th class="fs-7 text-gray-500 text-uppercase">#</th>
                                                            <th class="fs-7 text-gray-500 text-uppercase">Loacation</th>
                                                            <th class="fs-7 text-gray-500 text-uppercase">Odm start</th>
                                                            <th class="fs-7 text-gray-500 text-uppercase">Date / Time</th>                                                           
                                                           
                                                        </tr>
                                                    </thead>

                                                </table>
                                            </div>

                                            <div class="table-responsive p-5">
                                            <h2 class="fw-bold text-gray-900 mt-2">All Accidents</h2>
                                            <table id="driverAccidentList"
                                                        class="table table-striped table-row-bordered table-row-dashed gy-4 align-middle fw-bold dataTable no-footer">
                                                        <thead>
                                                            <tr class="thead-bg-color">
                                                                <!-- <th class="fs-7 text-gray-500 text-uppercase">#</th> -->
                                                                <th class="fs-7 text-gray-500 text-uppercase">Driver Name</th>
                                                                <th class="fs-7 text-gray-500 text-uppercase">Accident Date</th>
                                                                <th class="fs-7 text-gray-500 text-uppercase">Accident Time</th>
                                                                <th class="fs-7 text-gray-500 text-uppercase">Location</th>
                                                                <th class="fs-7 text-gray-500 text-uppercase">Cost</th>
                                                                <th class="fs-7 text-gray-500 text-uppercase">Driver Action</th>                                                              
                                                               
                                                            </tr>
                                                        </thead>
                                                    </table>
                                            </div>
                                        </div>
                                </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

@endsection()
@section('script')
{!! $dataTable->scripts() !!}
    <script>
        $('.datetimepicker').daterangepicker({
            timePicker: false ,
            singleDatePicker: true,
            locale: {
                format: 'MM/DD/YYYY'
            }
        });

        document.getElementById('printButton').addEventListener('click', function() {
            window.print();
        });

        document.getElementById('year').addEventListener('change', function() {
        const selectedYear = this.value;
        var truckId = "{{ $truck->truck_id }}"; // This should be set by your server-side code
        var year = selectedYear; // This should be a JavaScript variable
        var baseUrl = "{{ route('assets.trucks.totalmonthtruckSummeryReport', $truck->truck_id) }}";
        var fullUrl = baseUrl + "?year=" + encodeURIComponent(year);
        location.href = fullUrl;
});

    const table = $('#truckRepairList');
    table.on('preXhr.dt', function(e, setting, data) {
    data.truckid = '{{request()->route('truckId')}}';
    data.status = '{{request()->route('status')}}';

});

const table1 = $('#truckDvirList');
        table1.on('preXhr.dt', function(e, setting, data) {
            data.truckId = '{{ request()->route('truckId') }}';
        });
        $('#truckDvirList').DataTable({
            dom: 'Bfrtip',
            buttons: [
                'csv', 'excel', 'print', 'reset', 'reload'
            ],
            processing: true,
            serverSide: true,
            searching: false,
            ajax: '{!! route('assets.trucks.complinceDvirDataTable') !!}',
            data: {
                formName: 'afscpMcn',
                action: 'search',
            },
            paging: false, 
            pageLength: -1, 
            order: [
                [0, 'desc']
            ],
            columns: [
                {
                    data: 'dvir_id',
                    name: 'dvir_id'
                },
                {
                    data: 'location',
                    name: 'location'
                },
                {
                    data: 'odm_start',
                    name: 'odm_start'
                },
                {
                    data: 'date',
                    name: 'date'
                },
                // {
                //     data: 'action',
                //     name: 'action',
                //     orderable: false,
                //     searchable: false
                // }
            ],
            drawCallback: function(settings) {

            },
            initComplete: function(settings, json) {
                $(".dt-buttons").addClass("d-none");
            }
        });
        const table2 = $('#driverAccidentList');
        table2.on('preXhr.dt', function(e, setting, data) {
            data.truckId = '{{ request()->route('truckId') }}';
        });

        $('#driverAccidentList').DataTable({
            dom: 'Bfrtip',
            buttons: [
                'csv', 'excel', 'print', 'reset', 'reload'
            ],
            processing: true,
            serverSide: true,
            searching: false,
            ajax: '{!! route('assets.trucks.driverAccidentDataTable') !!}',
            data: {
                formName: 'afscpMcn',
                action: 'search',
            },
            paging: false, 
            pageLength: -1, 
            order: [
                [0, 'desc']
            ],
            columns: [{
                    data: 'DRIVER_NAME',
                    name: 'DRIVER_NAME'
                },               
               
                {
                    data: 'ACC_DATE',
                    name: 'ACC_DATE'
                },
                {
                    data: 'ACC_TIME',
                    name: 'ACC_TIME'
                },               
               
                {
                    data: 'LOCATION',
                    name: 'LOCATION'
                },
                {
                    data: 'COSTS',
                    name: 'COSTS'
                },
                {
                    data: 'DRIVER_ACTION',
                    name: 'DRIVER_ACTION'
                },

                // {
                //     data: 'action',
                //     name: 'action'
                // },

            ],
            
        });
    </script>
@endsection