@extends('admin.layouts.master')
@section('content')

    <!-- END: Header-->


    @include('admin.layouts.nav')
    @include('admin.layouts.navbar')
    <!-- END: Main Menu-->

    <div class="app-content content">
        <div class="content-overlay"></div>
        <div class="header-navbar-shadow"></div>
        <div class="content-wrapper">
            <div class="content-header row">
            </div>
            <div class="content-body">
                <!-- Dashboard Ecommerce Starts -->
                <section id="dashboard-ecommerce">
                    <div class="row">


                        <div class="col-lg-3 col-sm-6 col-12">
                            <div class="card">
                                <div class="card-header d-flex align-items-start pb-0">
                                    <div>
                                        <h2 class="text-bold-700 mb-0">{{  \App\Models\User::count()  }} </h2>
                                        <p>الاعضاء</p>
                                    </div>
                                    <div class="avatar bg-rgba-success p-50 m-0">
                                        <div class="avatar-content">
                                            <i class="feather icon-users text-success font-medium-5"></i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>


                        <div class="col-lg-3 col-sm-6 col-12">
                            <div class="card">
                                <div class="card-header d-flex align-items-start pb-0">
                                    <div>
                                        <h2 class="text-bold-700 mb-0">{{  \App\Models\User::role('owner')->count()  }} </h2>
                                        <p>الملاك</p>
                                    </div>
                                    <div class="avatar bg-rgba-success p-50 m-0">
                                        <div class="avatar-content">
                                            <i class="feather icon-users text-success font-medium-5"></i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>


                        <div class="col-lg-3 col-sm-6 col-12">
                            <div class="card">
                                <div class="card-header d-flex align-items-start pb-0">
                                    <div>
                                        <h2 class="text-bold-700 mb-0">{{  \App\Models\User::role('marketed')->count()  }} </h2>
                                        <p>المسوقين</p>
                                    </div>
                                    <div class="avatar bg-rgba-success p-50 m-0">
                                        <div class="avatar-content">
                                            <i class="feather icon-users text-success font-medium-5"></i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>


                        <div class="col-lg-3 col-sm-6 col-12">
                            <div class="card">
                                <div class="card-header d-flex align-items-start pb-0">
                                    <div>
                                        <h2 class="text-bold-700 mb-0">{{  \App\Models\City::count()  }}</h2>
                                        <p>المناطق</p>
                                    </div>
                                    <div class="avatar bg-rgba-success p-50 m-0">
                                        <div class="avatar-content">
                                            <i class="feather icon-users text-success font-medium-5"></i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>


                        <div class="col-lg-3 col-sm-6 col-12">
                            <div class="card">
                                <div class="card-header d-flex align-items-start pb-0">
                                    <div>
                                        <h2 class="text-bold-700 mb-0">{{  \App\Models\Area::count()  }}</h2>
                                        <p>الاحياء</p>
                                    </div>
                                    <div class="avatar bg-rgba-success p-50 m-0">
                                        <div class="avatar-content">
                                            <i class="feather icon-users text-success font-medium-5"></i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="col-lg-3 col-sm-6 col-12">
                            <div class="card">
                                <div class="card-header d-flex align-items-start pb-0">
                                    <div>
                                        <h2 class="text-bold-700 mb-0">{{  \App\Models\Ad::count()  }}</h2>
                                        <p>الاعلانات</p>
                                    </div>
                                    <div class="avatar bg-rgba-success p-50 m-0">
                                        <div class="avatar-content">
                                            <i class="feather icon-users text-success font-medium-5"></i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>






                        <div class="col-lg-3 col-sm-6 col-12">
                            <div class="card">
                                <div class="card-header d-flex align-items-start pb-0">
                                    <div>
                                        <h2 class="text-bold-700 mb-0">{{  \App\Models\RequestAd::count()  }} </h2>
                                        <p>الطلبات</p>
                                    </div>
                                    <div class="avatar bg-rgba-success p-50 m-0">
                                        <div class="avatar-content">
                                            <i class="feather icon-users text-success font-medium-5"></i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>




                    </div>


                    <div class="container">
                        <div class="row">


                            <div class="col-md-12">
                                <div class="panel panel-default">
                                    <div class="panel-heading">المستخدمين</div>
                                    <div class="panel-body">
                                        <canvas id="canvas" height="280" width="600"></canvas>
                                    </div>
                                </div>
                            </div>




                        </div>
                    </div>


                </section>
                <!-- Dashboard Ecommerce ends -->

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

    <!-- BEGIN: Footer-->

@endsection

@push('js')
<script>
    {{--var line = new Morris.Line({--}}
    {{--    element: 'line-chart',--}}
    {{--    resize: true,--}}
    {{--    data: [--}}
    {{--            @foreach ($sales_data as $data)--}}
    {{--        {--}}
    {{--            ym: "{{ $data->year }}-{{ $data->month }}", sum: "{{ $data->sum == 'null' ? 0 : $data->sum }}"--}}
    {{--        },--}}
    {{--        @endforeach--}}
    {{--    ],--}}
    {{--    xkey: 'ym',--}}
    {{--    ykeys: ['sum'],--}}
    {{--    labels: ['@lang('admin.total')'],--}}
    {{--    lineWidth: 2,--}}
    {{--    hideHover: 'auto',--}}
    {{--    gridStrokeWidth: 0.4,--}}
    {{--    pointSize: 4,--}}
    {{--    gridTextFamily: 'Open Sans',--}}
    {{--    gridTextSize: 10--}}
    {{--});--}}

</script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>
    <script>
        var month = ;
        var user = ;
        var user_notactice = ;
        var barChartData = {
            labels: month,
            datasets: [

                {
                    label: "المسوقين",
                    backgroundColor: "yellow",
                    data: user,
                },
                {
                    label: "العملاء",
                    backgroundColor: "blue",
                    data: user_notactice,
                },


            ],

        };

        window.onload = function() {
            var ctx = document.getElementById("canvas").getContext("2d");
            window.myBar = new Chart(ctx, {
                type: 'bar',
                data: barChartData,
                options: {
                    elements: {
                        rectangle: {
                            borderWidth: 2,
                            borderColor: '#c1c1c1',
                            borderSkipped: 'bottom'
                        }
                    },
                    responsive: true,
                    title: {
                        display: true,
                        text: 'المستخدمين'
                    }
                }
            });
        };
    </script>

@endpush