@extends('layouts.app')



@section('top_css')

    <link href="{{ asset('admins/vendor/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css') }}" rel="stylesheet">

@endsection



@section('content')

<div class="content-body">

    <!-- row -->

    <div class="page-titles">

        <ol class="breadcrumb">

            <li>

                <h5 class="bc-title">Dashboard</h5>

            </li>

        </ol>

    </div>

    <div class="container-fluid">

        <div class="row">

            <div class="col-md-12 wid-100">

                <div class="row">

                    <div class="col-xl-3 col-sm-6 same-card">

                        <div class="card">

                            <div class="card-body depostit-card">

                                <div class="depostit-card-media d-flex justify-content-between style-1">

                                    <div>

                                        <h6>Doctors</h6>

                                        <h3>{{ $totalDoctors }}</h3>

                                    </div>

                                    <div class="icon-box bg-danger-light">

                                        <svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">

                                            <path fill-rule="evenodd" clip-rule="evenodd" d="M8.79222 13.9396C12.1738 13.9396 15.0641 14.452 15.0641 16.4989C15.0641 18.5458 12.1931 19.0729 8.79222 19.0729C5.40972 19.0729 2.52039 18.5651 2.52039 16.5172C2.52039 14.4694 5.39047 13.9396 8.79222 13.9396Z" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"></path>

                                            <path fill-rule="evenodd" clip-rule="evenodd" d="M8.79223 11.0182C6.57206 11.0182 4.77173 9.21874 4.77173 6.99857C4.77173 4.7784 6.57206 2.97898 8.79223 2.97898C11.0115 2.97898 12.8118 4.7784 12.8118 6.99857C12.8201 9.21049 11.0326 11.0099 8.82064 11.0182H8.79223Z" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"></path>

                                            <path d="M15.1095 9.9748C16.5771 9.76855 17.7073 8.50905 17.7101 6.98464C17.7101 5.48222 16.6147 4.23555 15.1782 3.99997" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"></path>

                                            <path d="M17.0458 13.5045C18.4675 13.7163 19.4603 14.2149 19.4603 15.2416C19.4603 15.9483 18.9928 16.4067 18.2374 16.6936" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"></path>

                                        </svg>

                                    </div>

                                </div>

                                <div class="progress-box mt-0">

                                    <div class="d-flex justify-content-between">

                                        <p class="mb-0">Active / Inactive</p>

                                        <p class="mb-0">{{ $activeDoctors }} / {{ $inActiveDoctors }}</p>

                                    </div>

                                    <div class="progress">

                                        <div class="progress-bar bg-primary"

                                            style="width:{{ $doctorPercent }}%; height:5px; border-radius:4px;"

                                            role="progressbar"></div>

                                    </div>

                                </div>

                            </div>

                        </div>

                    </div>



                    <div class="col-xl-3 col-sm-6 same-card">

                        <div class="card">

                            <div class="card-body depostit-card">

                                <div class="depostit-card-media d-flex justify-content-between style-1">

                                    <div>

                                        <h6>Plans</h6>

                                        <h3>{{ $totalPlans }}</h3>

                                    </div>

                                    <div class="icon-box bg-danger-light">

                                        <svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">

                                            <path d="M6.64111 13.5497L9.38482 9.9837L12.5145 12.4421L15.1995 8.97684" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"></path>

                                            <ellipse cx="18.3291" cy="3.85021" rx="1.76201" ry="1.76201" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"></ellipse>

                                            <path d="M13.6808 2.86012H7.01867C4.25818 2.86012 2.54651 4.81512 2.54651 7.57561V14.9845C2.54651 17.7449 4.22462 19.6915 7.01867 19.6915H14.9058C17.6663 19.6915 19.3779 17.7449 19.3779 14.9845V8.53213" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"></path>

                                        </svg>

                                    </div>

                                </div>

                                <div class="progress-box mt-0">

                                    <div class="d-flex justify-content-between">

                                        <p class="mb-0">Active / Inactive</p>

                                        <p class="mb-0">{{ $activePlans }} / {{ $inActivePlans }}</p>

                                    </div>

                                    <div class="progress">

                                        <div class="progress-bar bg-primary"

                                            style="width:{{ $planPercent }}%; height:5px; border-radius:4px;"

                                            role="progressbar"></div>

                                    </div>

                                </div>

                            </div>

                        </div>

                    </div>



                    <div class="col-xl-3 col-sm-6 same-card">

                        <div class="card">

                            <div class="card-body depostit-card">

                                <div class="depostit-card-media d-flex justify-content-between style-1">

                                    <div>

                                        <h6>Services</h6>

                                        <h3>{{ $totalServices }}</h3>

                                    </div>

                                    <div class="icon-box bg-danger-light">

                                        <svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">

                                            <path fill-rule="evenodd" clip-rule="evenodd" d="M14.9732 2.52102H7.0266C4.25735 2.52102 2.52118 4.48177 2.52118 7.25651V14.7438C2.52118 17.5186 4.2491 19.4793 7.0266 19.4793H14.9723C17.7507 19.4793 19.4795 17.5186 19.4795 14.7438V7.25651C19.4795 4.48177 17.7507 2.52102 14.9732 2.52102Z" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"></path>

                                            <path d="M7.73657 11.0002L9.91274 13.1754L14.2632 8.82493" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"></path>

                                        </svg>

                                    </div>

                                </div>

                                <div class="progress-box mt-0">

                                    <div class="d-flex justify-content-between">

                                        <p class="mb-0">Active / Inactive</p>

                                        <p class="mb-0">{{ $activeServices }} / {{ $inActiveServices }}</p>

                                    </div>

                                    <div class="progress">

                                        <div class="progress-bar bg-primary"

                                            style="width:{{ $servicePercent }}%; height:5px; border-radius:4px;"

                                            role="progressbar"></div>

                                    </div>

                                </div>

                            </div>

                        </div>

                    </div>

                    <div class="col-xl-3 col-sm-6 same-card">

                        <div class="card">

                            <div class="card-body depostit-card">

                                <div class="depostit-card-media d-flex justify-content-between style-1">

                                    <div>

                                        <h6>Appointments</h6>

                                        <h3>1000</h3>

                                    </div>

                                    <div class="icon-box bg-danger-light">

                                        <svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">

                                            <path fill-rule="evenodd" clip-rule="evenodd" d="M13.5096 2.53165H7.41104C5.50437 2.52432 3.94146 4.04415 3.89654 5.9499V15.7701C3.85437 17.7071 5.38979 19.3121 7.32671 19.3552C7.35512 19.3552 7.38262 19.3561 7.41104 19.3552H14.7343C16.6538 19.2773 18.1663 17.6915 18.1525 15.7701V7.36798L13.5096 2.53165Z" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"></path>

                                            <path d="M13.2688 2.52084V5.18742C13.2688 6.48909 14.3211 7.54417 15.6228 7.54784H18.1482" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"></path>

                                            <path d="M13.0974 14.0786H8.1474" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"></path>

                                            <path d="M11.2229 10.6388H8.14655" stroke="#888888" stroke-linecap="round" stroke-linejoin="round"></path>

                                        </svg>

                                    </div>

                                </div>

                                <div class="progress-box mt-0">

                                    <div class="d-flex justify-content-between">

                                        <p class="mb-0">Total / Today</p>

                                        <p class="mb-0">1000 / 200</p>

                                    </div>

                                    <div class="progress">

                                        <div class="progress-bar bg-primary"

                                            style="width:80%; height:5px; border-radius:4px;"

                                            role="progressbar"></div>

                                    </div>

                                </div>

                            </div>

                        </div>

                    </div>

                </div>



                <div class="row">

                    <div class="col-xl-12">

                        <div class="card overflow-hidden">

                            <div class="card-header border-0 pb-0 flex-wrap">

                                <h4 class="heading mb-0">Appointment Stats</h4>

                            </div>

                            <div class="card-body  p-0">

                                <div id="overiewChart"></div>

                                <div class="ttl-project">

                                    <div class="pr-data">

                                        <h5 class="text-primary">12,721</h5>

                                        <span>Number Of Appointments</span>

                                    </div>

                                    <div class="pr-data">

                                        <h5 class="text-success">Rs 15,000</h5>

                                        <span>Revenue</span>

                                    </div>

                                </div>

                            </div>

                        </div>

                    </div>

                </div>

            </div>



            <div class="col-md-12 bst-seller">

                <div class="card">

                    <div class="card-header border-0">

                        <h4 class="heading mb-0">Recent Appointments</h4>

                    </div>

                    <div class="card-body p-0">

                        <div

                            class="table-responsive active-projects active-projects ItemsCheckboxSec selling-product shorting ">

                            <table class="table">

                                <thead>

                                    <tr>

                                        <th>Sr No</th>

                                        <th>Patient</th>

                                        <th>Timing</th>

                                        <th>Fees</th>

                                        <th>Doctor</th>

                                        <th>Action</th>

                                    </tr>

                                </thead>

                                <tbody>

                                    <tr>

                                        <td>1</td>

                                        <td>

                                            <div class="products">

                                                <img src="{{ asset('admins/images/contacts/d1.jpg') }}" class="avatar avatar-md" alt="">

                                                <div>

                                                    <h6><a href="javascript:void(0)">John Doe</a></h6>

                                                    <span>24 Apr 2021</span>

                                                </div>

                                            </div>

                                        </td>

                                        <td><span class="badge badge-danger light border-0">9:00AM - 11:00AM</span></td>

                                        <td><span class="text-primary">Rs 500</span></td>

                                        <td>

                                            <div class="products">

                                                <img src="https://shrimann.onlinefood.app/uploads/doctor/46neCSjL1694080463.jpg" class="avatar avatar-md" alt="">

                                                <div>

                                                    <h6><a href="javascript:void(0)">Dr. Harmeet Paul Singh</a></h6>

                                                </div>

                                            </div>

                                        </td>

                                        <td>--</td>

                                    </tr>

                                    <tr>

                                        <td>2</td>

                                        <td>

                                            <div class="products">

                                                <img src="{{ asset('admins/images/contacts/d4.jpg') }}" class="avatar avatar-md" alt="">

                                                <div>

                                                    <h6><a href="javascript:void(0)">John Doe</a></h6>

                                                    <span>24 Apr 2021</span>

                                                </div>

                                            </div>

                                        </td>

                                        <td><span class="badge badge-danger light border-0">9:00AM - 11:00AM</span></td>

                                        <td><span class="text-primary">Rs 500</span></td>

                                        <td>

                                            <div class="products">

                                                <img src="https://shrimann.onlinefood.app/uploads/doctor/46neCSjL1694080463.jpg" class="avatar avatar-md" alt="">

                                                <div>

                                                    <h6><a href="javascript:void(0)">Dr. Harmeet Paul Singh</a></h6>

                                                </div>

                                            </div>

                                        </td>

                                        <td>--</td>

                                    </tr>

                                    <tr>

                                        <td>3</td>

                                        <td>

                                            <div class="products">

                                                <img src="{{ asset('admins/images/contacts/d2.jpg') }}" class="avatar avatar-md" alt="">

                                                <div>

                                                    <h6><a href="javascript:void(0)">John Doe</a></h6>

                                                    <span>24 Apr 2021</span>

                                                </div>

                                            </div>

                                        </td>

                                        <td><span class="badge badge-danger light border-0">9:00AM - 11:00AM</span></td>

                                        <td><span class="text-primary">Rs 500</span></td>

                                        <td>

                                            <div class="products">

                                                <img src="https://shrimann.onlinefood.app/uploads/doctor/46neCSjL1694080463.jpg" class="avatar avatar-md" alt="">

                                                <div>

                                                    <h6><a href="javascript:void(0)">Dr. Harmeet Paul Singh</a></h6>

                                                </div>

                                            </div>

                                        </td>

                                        <td>--</td>

                                    </tr>

                                    <tr>

                                        <td>4</td>

                                        <td>

                                            <div class="products">

                                                <img src="{{ asset('admins/images/contacts/d1.jpg') }}" class="avatar avatar-md" alt="">

                                                <div>

                                                    <h6><a href="javascript:void(0)">John Doe</a></h6>

                                                    <span>24 Apr 2021</span>

                                                </div>

                                            </div>

                                        </td>

                                        <td><span class="badge badge-danger light border-0">9:00AM - 11:00AM</span></td>

                                        <td><span class="text-primary">Rs 500</span></td>

                                        <td>

                                            <div class="products">

                                                <img src="https://shrimann.onlinefood.app/uploads/doctor/46neCSjL1694080463.jpg" class="avatar avatar-md" alt="">

                                                <div>

                                                    <h6><a href="javascript:void(0)">Dr. Harmeet Paul Singh</a></h6>

                                                </div>

                                            </div>

                                        </td>

                                        <td>--</td>

                                    </tr>

                                    <tr>

                                        <td>5</td>

                                        <td>

                                            <div class="products">

                                                <img src="{{ asset('admins/images/contacts/d6.jpg') }}" class="avatar avatar-md" alt="">

                                                <div>

                                                    <h6><a href="javascript:void(0)">John Doe</a></h6>

                                                    <span>24 Apr 2021</span>

                                                </div>

                                            </div>

                                        </td>

                                        <td><span class="badge badge-danger light border-0">9:00AM - 11:00AM</span></td>

                                        <td><span class="text-primary">Rs 500</span></td>

                                        <td>

                                            <div class="products">

                                                <img src="https://shrimann.onlinefood.app/uploads/doctor/46neCSjL1694080463.jpg" class="avatar avatar-md" alt="">

                                                <div>

                                                    <h6><a href="javascript:void(0)">Dr. Harmeet Paul Singh</a></h6>

                                                </div>

                                            </div>

                                        </td>

                                        <td>--</td>

                                    </tr>

                                </tbody>

                            </table>

                        </div>

                    </div>

                </div>

            </div>

        </div>

    </div>

</div>

@endsection



@section('bottom_script')

    <script src="{{ asset('admins/vendor/chart.js/Chart.bundle.min.js') }}"></script>

    <script src="{{ asset('admins/vendor/apexchart/apexchart.js') }}"></script>

    <script src="{{ asset('admins/js/dashboard/dashboard-1.js') }}"></script>

    <script src="{{ asset('admins/vendor/draggable/draggable.js') }}"></script>



    <script src="{{ asset('admins/vendor/bootstrap-datetimepicker/js/moment.js') }}"></script>

    <script src="{{ asset('admins/vendor/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js') }}"></script>



    {{-- <script src="{{ asset('admins/vendor/jqvmap/js/jquery.vmap.min.js') }}"></script>

    <script src="{{ asset('admins/vendor/jqvmap/js/jquery.vmap.world.js') }}"></script>

    <script src="{{ asset('admins/vendor/jqvmap/js/jquery.vmap.usa.js') }}"></script> --}}

@endsection