@extends('common.master')
@section('content')
    <div class="page-body" id="loadder1" style="display: block;">
        <div class="loadder1">
            Loading..
        </div>
    </div>

    <div class="page-body" id="home_show1" style="display: none;">
        <div class="container-fluid">
            <div class="page-title">
                <div class="row">
                    <div class="col-6">
                        <h4>Home </h4>
                    </div>
                    <div class="col-6">
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item"><a href="#">
                                    <svg class="stroke-icon">
                                        <use href="{{ asset('assets/svg/icon-sprite.svg#stroke-home') }}"></use>
                                    </svg></a></li>
                            <li class="breadcrumb-item">Dashboard</li>
                            <li class="breadcrumb-item active">Home </li>
                        </ol>
                    </div>
                </div>
            </div>
        </div>

        <div class="container-fluid">
            <div class="row widget-grid">

                <div class="row">
                    <div class="col-sm-6" style="padding-left: 30px">
                        <div class="card widget-1">
                            <div class="card-body">
                                <div class="widget-content">
                                    <div class="widget-round primary">
                                        <div class="bg-round">
                                            <svg xmlns="http://www.w3.org/2000/svg"
                                                xmlns:xlink="http://www.w3.org/1999/xlink" fill="#000000" height="800px"
                                                width="800px" version="1.1" id="Layer_1" viewBox="0 0 512 512"
                                                xml:space="preserve">
                                                <g>
                                                    <g>
                                                        <g>
                                                            <path
                                                                d="M486.4,102.4H375.467V25.6c0-4.702,3.831-8.533,8.533-8.533h34.133c4.702,0,8.533,3.831,8.533,8.533v8.533h-8.533     c-4.71,0-8.533,3.823-8.533,8.533c0,4.71,3.823,8.533,8.533,8.533h8.533v17.067h-8.533c-4.71,0-8.533,3.823-8.533,8.533     s3.823,8.533,8.533,8.533H435.2c4.71,0,8.533-3.823,8.533-8.533V25.6c0-14.114-11.486-25.6-25.6-25.6H384     c-14.114,0-25.6,11.486-25.6,25.6v81.801l-12.066,12.066H165.666L153.6,107.401V25.6C153.6,11.486,142.114,0,128,0H93.867     c-14.114,0-25.6,11.486-25.6,25.6v51.2c0,4.71,3.823,8.533,8.533,8.533s8.533-3.823,8.533-8.533V25.6     c0-4.702,3.831-8.533,8.533-8.533H128c4.702,0,8.533,3.831,8.533,8.533v8.533H128c-4.71,0-8.533,3.823-8.533,8.533     c0,4.71,3.823,8.533,8.533,8.533h8.533v17.067H128c-4.71,0-8.533,3.823-8.533,8.533s3.823,8.533,8.533,8.533h8.533V102.4H25.6     C11.486,102.4,0,113.886,0,128v34.133c0,11.11,7.151,20.489,17.067,24.021v283.179c0,23.526,19.14,42.667,42.667,42.667h392.533     c23.526,0,42.667-19.14,42.667-42.667v-256c0-4.71-3.823-8.533-8.533-8.533s-8.533,3.823-8.533,8.533v256     c0,14.114-11.486,25.6-25.6,25.6H59.733c-14.114,0-25.6-11.486-25.6-25.6V179.2c0-4.71-3.823-8.533-8.533-8.533     c-4.702,0-8.533-3.831-8.533-8.533V128c0-4.702,3.831-8.533,8.533-8.533h115.934l14.566,14.566c1.596,1.596,3.772,2.5,6.033,2.5     h187.733c2.261,0,4.429-0.905,6.033-2.5l14.566-14.566H486.4c4.702,0,8.533,3.831,8.533,8.533v34.133     c0,4.702-3.831,8.533-8.533,8.533H59.733c-4.71,0-8.533,3.823-8.533,8.533s3.823,8.533,8.533,8.533H486.4     c14.114,0,25.6-11.486,25.6-25.6V128C512,113.886,500.514,102.4,486.4,102.4z" />
                                                            <path
                                                                d="M366.933,341.333c-4.71,0-8.533,3.823-8.533,8.533s3.823,8.533,8.533,8.533H435.2c4.71,0,8.533-3.823,8.533-8.533     s-3.823-8.533-8.533-8.533H366.933z" />
                                                            <path
                                                                d="M226.534,442.812c1.229,0.623,2.551,0.922,3.857,0.922c2.475,0,4.898-1.075,6.562-3.072l85.333-102.4     c2.125-2.543,2.577-6.084,1.178-9.079c-1.408-2.995-4.42-4.915-7.731-4.915h-40.789l15.019-75.127     c0.794-3.942-1.28-7.902-4.966-9.498c-3.686-1.604-8.004-0.401-10.342,2.867l-85.333,119.467     c-1.852,2.603-2.108,6.016-0.64,8.866c1.459,2.833,4.386,4.625,7.586,4.625h40.269l-14.413,57.66     C221.158,436.992,222.985,441.011,226.534,442.812z M212.847,358.4l52.582-73.617l-9.267,46.345     c-0.503,2.509,0.154,5.103,1.775,7.083s4.036,3.123,6.596,3.123h32.981l-49.792,59.742l8.021-32.068     c0.64-2.551,0.06-5.257-1.553-7.322c-1.613-2.074-4.096-3.285-6.724-3.285H212.847z" />
                                                            <path
                                                                d="M110.933,392.533c4.71,0,8.533-3.823,8.533-8.533v-25.6h25.6c4.71,0,8.533-3.823,8.533-8.533s-3.823-8.533-8.533-8.533     h-25.6v-25.6c0-4.71-3.823-8.533-8.533-8.533s-8.533,3.823-8.533,8.533v25.6H76.8c-4.71,0-8.533,3.823-8.533,8.533     S72.09,358.4,76.8,358.4h25.6V384C102.4,388.71,106.223,392.533,110.933,392.533z" />
                                                        </g>
                                                    </g>
                                                </g>
                                            </svg>
                                            <svg class="half-circle svg-fill">
                                                <use href="{{ asset('assets/svg/icon-sprite.svg#halfcircle') }}"></use>
                                            </svg>

                                        </div>
                                    </div>
                                    <div>
                                        <h4>{{ $gen_count }}</h4><span class="f-light">Generator</span>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="col-sm-6" style="padding-left: 30px">
                        <div class="card widget-1">
                            <div class="card-body">
                                <div class="widget-content">
                                    <div class="widget-round success">
                                        <div class="bg-round">
                                            <svg xmlns="http://www.w3.org/2000/svg" width="800px" height="800px"
                                                viewBox="0 0 24 24" fill="none">
                                                <rect height="4" stroke="#000000" stroke-linecap="round"
                                                    stroke-linejoin="round" stroke-width="2" width="4" x="10" y="4" />
                                                <rect height="4" stroke="#000000" stroke-linecap="round"
                                                    stroke-linejoin="round" stroke-width="2" width="4" x="10" y="16" />
                                                <rect height="4" stroke="#000000" stroke-linecap="round"
                                                    stroke-linejoin="round" stroke-width="2" width="4" x="3" y="16" />
                                                <rect height="4" stroke="#000000" stroke-linecap="round"
                                                    stroke-linejoin="round" stroke-width="2" width="4" x="17" y="16" />
                                                <path
                                                    d="M12 8V12M12 16V12M12 12H17C18.1046 12 19 12.8954 19 14V16M12 12H7C5.89543 12 5 12.8954 5 14V16"
                                                    stroke="#000000" stroke-linecap="round" stroke-linejoin="round"
                                                    stroke-width="2" />
                                            </svg>
                                            <svg class="half-circle svg-fill">
                                                <use href="{{ asset('assets/svg/icon-sprite.svg#halfcircle') }}"></use>
                                            </svg>
                                        </div>
                                    </div>
                                    <div>
                                        <h4>{{ $pool_count }}</h4><span class="f-light">Pool</span>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>


                </div>



                <div class="col-xxl-5 col-xl-6 col-md-7 box-col-8">
                    <div class="left-sidebar-wrapper card">
                        <div class="left-sidebar-chat">
                            <div class="input-group"><span class="input-group-text"><i class="search-icon text-gray"
                                        data-feather="search"></i></span>
                                <input class="form-control" type="text" placeholder="Search here.." id="myInput"
                                    onkeyup="myFunction();">

                            </div>
                        </div>
                        <div class="advance-options">
                            <ul class="nav border-tab" id="chat-options-tab" role="tablist">
                                <li class="nav-item"><a class="nav-link active" id="chats-tab" data-bs-toggle="tab"
                                        href="#chats" role="tab" aria-controls="chats" aria-selected="true"></a>
                                </li>
                                <li class="nav-item"><a class="nav-link" id="contacts-tab" data-bs-toggle="tab"
                                        href="#contacts" role="tab" aria-controls="contacts"
                                        aria-selected="false"></a></li>
                                <li class="nav-item"><a class="nav-link" id="offline-tab" data-bs-toggle="tab"
                                        href="#offline" role="tab" aria-controls="offline"
                                        aria-selected="false"></a></li>
                            </ul>
                            <div class="tab-content" id="chat-options-tabContent">

                                <div class="tab-pane fade show active" id="chats" role="tabpanel"
                                    aria-labelledby="chats-tab">
                                    <div class="common-space">
                                        <p>Generators</p>

                                    </div>
                                    <div class="contact-wrapper">
                                        <ul class="border-0" id="result1">

                                        </ul>
                                        <ul class="border-0" id="search_result1" style="display: none;">

                                        </ul>
                                    </div>
                                </div>
                                <div class="tab-pane fade" id="contacts" role="tabpanel"
                                    aria-labelledby="contacts-tab">
                                    <div class="common-space">
                                        <p>Active</p>
                                    </div>

                                    <div class="contact-wrapper">
                                        <ul class="border-0" id="result2">

                                        </ul>

                                        <ul class="border-0" id="search_result2" style="display: none;">

                                        </ul>

                                    </div>
                                </div>

                                <div class="tab-pane fade" id="offline" role="tabpanel" aria-labelledby="offline-tab">
                                    <div class="common-space">
                                        <p>Inactive</p>
                                    </div>

                                    <div class="contact-wrapper">
                                        <ul class="border-0" id="result3">

                                        </ul>

                                        <ul class="border-0" id="search_result3" style="display: none;">

                                        </ul>

                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-xxl-7 col-xl-6 col-md-5 box-col-5">
                    <div class="card">
                        <div class="card-header card-no-border">
                            <div style="width: 100%" id="initial_map">

                            </div>
                        </div>

                    </div>
                </div>



                <div class="row">
                    <div class="col-xl-12">
                        <div class="col-md-12 row" style="margin-top: 30px;"></div>
                    </div>
                </div>


            </div>
        </div>
        <!-- Container-fluid Ends-->
    </div>
    <!-- footer start-->
@endsection

@section('scripts')
    <script src="https://maps.googleapis.com/maps/api/js?key={{ $map_token }}&callback=initMap&v=weekly" defer></script>
    <script src="{{ asset('scripts/dashboard.js') }}"></script>
@endsection