@extends('layout.index')
@section('title', 'Real Time Map')

<!-- Dashboard Ecommerce start -->
@section('content')

@php $user=Session::get('logged_in'); 
    $data  = array();
    $data = DB::table('admin_user')->where('id', $user['id'])->get('theme_mode');
@endphp

    <style>
        #notation_panel {
            position: absolute;
            float: left !important;
            left: 5px;
            padding: 10px;
            top: 198px;
            z-index: 1000;
            width: 190px;
            max-height: 400px;
            background-color: #000000c4;
            border-radius: 5px;
            /* opacity: 0.7; */
            color: #ffffff;
            border-radius: 5px;
        }

        #notation_panel td{
            color: #fff;
        }

    </style>

   

    <div class="content-body">
        <!-- Bordered table start -->
        <div class="row" id="table-bordered">
            <div class="col-12">
                <div class="card mb-1">
                    <div class="card-header w-100">
                        <div class="content-header-left">
                            <div class="row breadcrumbs-top">
                                <div class="col-sm-12">
                                    <h2 class="content-header-title float-left mb-0">Real Time Map</h2>
                                </div>
                            </div>
                        </div>
                        <div class="d-flex justify-content-end breadcrumb-wrapper">
                            <nav aria-label="breadcrumb">
                                <ol class="breadcrumb mr-1">
                                    <li class="breadcrumb-item"><a href="javascript:void(0)">Home</a></li>
                                    <li class="breadcrumb-item active" aria-current="page">Real Time Map</li>
                                </ol>
                            </nav>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Bordered table end -->
    </div>

    <div class="content-body">
        <!-- Bordered table start -->
        <div class="row" id="table-bordered">
            <div class="col-12">
                <div class="card">
                    <form method="post" id="search_frm" action="{{ route('home.search') }}">
                        @csrf
                        <div class="card-header w-100 p-1">
                            <div class="row w-100">
                                <div class="col-sm-2">
                                    <div class="form-group m-0">
                                        <select class="select2 form-select" id="division_id" name="division_id"
                                            onChange="submit_my_form(),get_wards()">
                                            <option value="">--- All Division ---</option>
                                            @foreach ($divisions as $val)
                                                @php $selected = '';   @endphp
                                                @if ($division_id == $val->id)
                                                    @php $selected ='selected'; @endphp
                                                @endif
                                                <option {{ $selected }} value="{{ $val->id }}">
                                                    {{ $val->division_name }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>

                                <div class="col-sm-2">
                                    <div class="form-group m-0">
                                        <select class="select2 form-select" id="ward_id" name="ward_id"
                                            onChange="submit_my_form(),get_prabhag_boundray()">
                                            <option value="0">--All Wards--</option>
                                            @foreach ($wards as $val)
                                                @php $selected = '';  @endphp
                                                @if ($ward_id == $val->id)
                                                    @php $selected ='selected'; @endphp
                                                @endif
                                                <option {{ $selected }} value="{{ $val->id }}">
                                                    {{ $val->ward_name }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>

                                <div class="col-sm-2">
                                    <div class="form-group m-0">
                                        <select name="vehicle_id" id="vehicle_id" class="select2 form-select"
                                            onChange="submit_my_form()">
                                            <option value="0">--All Vehicles--</option>
                                            @foreach ($vehicle as $val)
                                                @php $selected = '';  @endphp
                                                @if ($vehicle_id == $val->id)
                                                    @php $selected ='selected'; @endphp
                                                @endif
                                                <option {{ $selected }} value="{{ $val->id }}">
                                                    {{ $val->vehicle_number }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>

                                <div class="col-sm-2">
                                    <div class="form-group m-0">
                                        <select name="vehicle_type" id="vehicle_type" class="select2 form-select"
                                            onChange="submit_my_form()">
                                            <option value="0">--- All Vehicle Types ---</option>
                                            @foreach ($vehicle_type as $val)
                                                @php $selected = '';  @endphp
                                                @if ($vehicle_type_id == $val->id)
                                                    @php $selected ='selected'; @endphp
                                                @endif
                                                <option {{ $selected }} value="{{ $val->id }}">
                                                    {{ $val->type }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>

                                <div class="col-sm-2">
                                    @if ($division_id || $vehicle_type_id || $vehicle_id || $ward_id)
                                        <a title="Clear" href="{{ url('home/clear_search') }}"
                                            class="btn btn-outline-primary" data-column="3"><i data-feather="rotate-ccw"
                                                class="me-25"></i><span> Clear</span></a>
                                    @endif
                                </div>

                                <div class="col-sm-2">
                                    <p class="btn btn-primary float-right">Present Vehicle Count <span
                                            class="badge badge-warning badge-pill ml-auto mr-1"></span>
                                    </p>
                                </div>
                            </div>
                        </div>
                    </form>

                    <div id="notation_panel_div"></div>