@extends('voyager::master')

@section('css')
 {{--   <link rel="stylesheet" href="{{ asset('assets/voyager/css/clock.css') }}">--}}
{{--    <link rel="stylesheet" href="{{ asset('assets/voyager/css/lightbox.min.css') }}">--}}
@stop

@push('javascript')
{{--    <script src="{{ asset('assets/voyager/js/digital-clock.js') }}" type="text/javascript"></script>--}}
   {{-- <script src="{{ asset('assets/voyager/js/lightbox.min.js') }}"></script>--}}
@endpush

@section('content')

    <div class="container main-dashboard">

        <div class="row">
        <div class="col-12 desktop-platform-main-btns-wrap mb-2">
            <div class="row">
                <div class="main-btns-dashboard">
                      <a class="btn-purple circle-radius " href="{{ route('voyager.received-money.index') }}">
                        <div class="icon-btn"><img
                                src="{{ asset('assets/voyager/images/icons/safe-deposite.png') }}">
                        </div>
                        <span>  {{ __('messages.admin.Received-money') }}
                                    </span>
                    </a>
                    <a class="btn-red2 circle-radius " href="{{ route('voyager.received-money.debtors') }}">
                        <div class="icon-btn"><img
                                src="{{ asset('assets/voyager/images/icons/accounting.png') }}">
                        </div>
                        <span>  {{ __('messages.admin.close_account_daily') }}
                                    </span>
                    </a>
                    @can('browse', app('\App\Models\DailyEarning'))
                    <a class="btn-red circle-radius " href="{{ route('voyager.daily-earning.index') }}">
                        <div class="icon-btn"><img
                                src="{{ asset('assets/voyager/images/icons/accounting.png') }}">
                        </div>
                        <span>  {{ __('messages.admin.daily_earning') }}
                                    </span>
                    </a>
                    @endcan
                     <a class="btn-blue circle-radius" href="{{ route('voyager.supervisor-status-report.index') }}">
                        <div class="icon-btn">
                            <img src="{{ asset('assets/voyager/images/icons/repor1.png') }}"></div>
                        <span>  {{ __('messages.admin.Supervisor-status-report') }}
                                    </span>

                    </a>
                    <a class="btn-pink circle-radius" href="{{ route('voyager.form-eighteen-report.create') }}">
                        <div class="icon-btn">
                            <img src="{{ asset('assets/voyager/images/icons/report-3.png') }}"></div>
                        <span>  {{ __('messages.admin.Form-eighteen-report') }}
                                    </span>

                    </a>
                       <a class="btn-orange-light circle-radius" href="{{ route('voyager.gasoline-product-sales-report.index') }}">
                        <div class="icon-btn">
                            <img src="{{ asset('assets/voyager/images/icons/echo-gasolibe.png') }}"></div>
                        <span>  {{ __('messages.admin.Gasoline product sales report') }}
                                    </span>

                    </a>
                        <a class="btn-purple-light circle-radius" href="{{ route('voyager.fuel-income.create') }}">
                        <div class="icon-btn">
                            <img src="{{ asset('assets/voyager/images/icons/tank-truck4.png') }}"></div>
                        <span>  {{ __('messages.admin.Fuel-income') }}
                                    </span>

                    </a>

                     <!-- <a class="btn-green circle-radius" href="{{ route('general_supervisor') }}">
                        <div class="icon-btn"><img
                                src="{{ asset('assets/voyager/images/icons/icon-truck2.png') }}"></div>

                        <span> {{ __('messages.credit-equip') }}
                                    </span>
                    </a>-->
                    <a class="btn-green-2  circle-radius" href="{{ route('voyager.daily-closing.index') }}">
                        <div class="icon-btn">
                            <img src="{{ asset('assets/voyager/images/icons/deal.png') }}"></div>
                        <span>  استمارة غلق الیومي
                                    </span>

                    </a>
                      <a class="btn-green circle-radius" href="{{ route('voyager.send-daily.index') }}">
                        <div class="icon-btn"><img
                                src="{{ asset('assets/voyager/images/icons/icon-logo1.png') }}"></div>

                        <span> ارسال الموقف الیومي                                   </span>
                    </a>
                    @can('browse', app('\App\Models\AccountsTransaction'))
                    <a class="btn-blue circle-radius" href="{{ route('voyager.cash-deposits.index') }}">
                        <div class="icon-btn"><img
                                src="{{ asset('assets/voyager/images/icons/calculater.png') }}"></div>

                        <span> ايداعات                                  </span>
                    </a>
                    <a class=" btn-purple circle-radius" href="{{ route('voyager.accounts-transactions.index') }}">
                        <div class="icon-btn"><img
                                src="{{ asset('assets/voyager/images/icons/icon-masarif.png') }}"></div>

                        <span>المصاریف                                 </span>
                    </a>
                    @endcan
                  <!-- <a class="btn-green-2 circle-radius" href="{{ route('voyager.refueling-cars-report.index') }}">
                        <div class="icon-btn">
                            <img src="{{ asset('assets/voyager/images/icons/deal.png') }}"></div>
                        <span>  {{ __('messages.admin.Refueling-cars-report') }}
                                    </span>

                    </a> -->
                    <a class="btn-red2 circle-radius" href="{{ route('derivative') }}">
                        <div class="icon-btn"><img
                                src="{{ asset('assets/voyager/images/icons/fule-pumb.png') }}">
                        </div>
                        <span>
                                      {{ __('messages.derivative') }}
                                    </span>
                    </a>
                    <a class="btn-orange circle-radius" href="{{ route('supervisor') }}">
                        <div class="icon-btn"><img
                                src="{{ asset('assets/voyager/images/icons/fule-pumb.png') }}">
                        </div>
                        <span>
                                      {{ __('messages.Close the daily counters') }}
                                    </span>
                    </a>
                    @can('browse', app('App\Models\Supervisors'))
                        <a class="btn-pink circle-radius" href="{{ route('voyager.supervisors.index') }}">
                            <div class="icon-btn">
                                <img src="{{ asset('assets/voyager/images/icons/icon-masarif.png') }}">
                            </div>
                            <span>
                                {{ __('messages.admin.Supervisors') }}
                            </span>
                        </a>
                    @endcan
                    {{-- <a class="btn-purple circle-radius" href="{{ route('deposit') }}">
                        <div class="icon-btn"><img
                                src="{{ asset('assets/voyager/images/icons/safe-deposite.png') }}">
                        </div>
                        <span>  {{ __('messages.receipt_of_deposits') }}
                                    </span>
                    </a>

                    <a class="btn-orange-light circle-radius" href="{{ route('expenses') }}">
                        <div class="icon-btn">
                            <img src="{{ asset('assets/voyager/images/icons/echo-gasolibe.png') }}"></div>
                        <span>  {{ __('messages.expenses') }}
                                    </span>

                    </a>--}}
                </div>


            </div>
        </div>


        <div class="col-md-12 main-panel-borderde ">
            <div class="panel-head pl-0 pe-0">
                <div class="row ">
                    <div class="col-12  col-sm-5 col-md-8 col-lg-9"></div>
                    <div class="col-12 col-sm-7 col-md-4 col-lg-3 mr-auto pr-1 ">
                        <div class="form-group input-group">
                            <label class="control-label">{{ __('messages.Date') }}:</label>
                            <input type="date" class="form-control" placeholder=""
                                   onchange="utility.handleChangeDashboardSupervisors(this.value, '{{ csrf_token() }}')">
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-12 dashborad-report-main-wrapp" id="supervisors-dashboard">
             @include('voyager::partials.supervisors', ['groups' => $groups, 'data' => $data])
            </div>

        </div>
{{--        <div class="col-12">
            <div class="row">
                <div class="col-lg-5 pl-lg-3">
                    <div id="station-d" class="mt-4 ">
                        <h3>{{setting('admin.branch_name')}}</h3>
                        <div id="station-image"><img src="{{ asset('assets/voyager/images/112.png') }}"
                                                     alt="{{setting('admin.branch_name')}}">
                        </div>
                    </div>
                </div>

            <div class="clock-section col-lg-2   ">
                    <div class="clock-d mt-4">
                        <section class="clock container">
                            <div class="clock__container grid">
                                <div class="clock__content grid">
                                    <div class="clock__circle">
                                        <span class="clock__twelve"></span>
                                        <span class="clock__three"></span>
                                        <span class="clock__six"></span>
                                        <span class="clock__nine"></span>

                                        <div class="clock__rounder"></div>
                                        <div class="clock__hour" id="clock-hour"></div>
                                        <div class="clock__minutes" id="clock-minutes"></div>
                                        <div class="clock__seconds" id="clock-seconds"></div>


                                    </div>

                                    <div>
                                        <div class="clock__text" style="display: none">
                                            <div class="clock__text-hour" id="text-hour"></div>
                                            <div class="clock__text-minutes" id="text-minutes"></div>
                                            <div class="clock__text-ampm" id="text-ampm"></div>
                                        </div>

                                        <div class="clock__date">
                                            <span id="date-day-week"></span>
                                            <span id="date-month"></span>
                                            <span id="date-day"></span>
                                            <span id="date-year" ></span>
                                        </div>
                                    </div>
                                </div>


                            </div>
                        </section>


                    </div>

                </div>


                <div class="slider-section col-lg-5 pr-lg-3">
                    <div class="slider">

                        <div id="carouselExampleCaptions" class="carousel slide carousel-fade"
                             data-bs-ride="carousel">
                            <div class="carousel-indicators">
                                <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="0"
                                        class="active" aria-current="true" aria-label="Slide 1"></button>
                                <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="1"
                                        aria-label="Slide 2"></button>
                                <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="2"
                                        aria-label="Slide 3"></button>
                                <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="3"
                                        aria-label="Slide 4"></button>
                                <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="4"
                                        aria-label="Slide 5"></button>
                                <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="5"
                                        aria-label="Slide 6"></button>

                            </div>
                            <div class="carousel-inner">
                                <div class="carousel-item active">

                                    <a href="{{ asset('assets/voyager/images/slider/1.jpg') }}"
                                       class="" title="My Caption" data-lightbox="image-set">

                                        <img src="{{ asset('assets/voyager/images/slider/1.jpg') }}"
                                             class="swipebox" title="My Caption"/>

                                    </a>
                                </div>
                                <div class="carousel-item">
                                    <a href="{{ asset('assets/voyager/images/slider/2.jpg') }}"
                                       class="" title="My Caption" data-lightbox="image-set">

                                        <img src="{{ asset('assets/voyager/images/slider/2.jpg') }}"
                                             class="swipebox" title="My Caption"/>

                                    </a>
                                </div>
                                <div class="carousel-item">
                                    <a href="{{ asset('assets/voyager/images/slider/3.jpg') }}"
                                       class="" title="My Caption" data-lightbox="image-set">

                                        <img src="{{ asset('assets/voyager/images/slider/3.jpg') }}"
                                             class="swipebox" title="My Caption"/>

                                    </a>
                                </div>
                                <div class="carousel-item">
                                    <a href="{{ asset('assets/voyager/images/slider/4.jpg') }}"
                                       class="" title="My Caption" data-lightbox="image-set">

                                        <img src="{{ asset('assets/voyager/images/slider/4.jpg') }}"
                                             class="swipebox" title="My Caption"/>

                                    </a>

                                </div>
                                <div class="carousel-item">
                                    <a href="{{ asset('assets/voyager/images/slider/5.jpg') }}"
                                       class="" title="My Caption" data-lightbox="image-set">

                                        <img src="{{ asset('assets/voyager/images/slider/5.jpg') }}"
                                             class="swipebox" title="My Caption"/>

                                    </a>
                                </div>
                                <div class="carousel-item">
                                    <a href="{{ asset('assets/voyager/images/slider/6.jpg') }}"
                                       class="" title="My Caption" data-lightbox="image-set">

                                        <img src="{{ asset('assets/voyager/images/slider/6.jpg') }}"
                                             class="swipebox" title="My Caption"/>

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

                        </div>


                    </div>


                </div>
            </div>
        </div>--}}
    </div>
    </div>
@stop