@php
$order_count=$data['order_count'];
@endphp
@extends('layouts.app')

    @section('styles')

    @endsection

        @section('content')

                        <!-- PAGE-HEADER -->
                        <div class="page-header">
                            <h1 class="page-title">Dashboard</h1>
                            <div>
                                <ol class="breadcrumb">
                                    <li class="breadcrumb-item"><a href="javascript:void(0)">Home</a></li>
                                    <li class="breadcrumb-item active" aria-current="page">Dashboard</li>
                                </ol>
                            </div>
                        </div>
                        <!-- PAGE-HEADER END -->

                        <!-- ROW-1 -->
                        @hasanyrole('Super Admin|Admin')
                        <div class="row">

                               <!-- COL END -->
                            <div style="cursor:pointer;" onclick="redirect('{{url('/')}}/admin/home_banner')" class="col-sm-12 col-md-6 col-lg-6 col-xl-3">
                                <div class="card bg-indigo img-card box-info-shadow">
                                    <div class="card-body">
                                        <div class="d-flex">
                                            <div class="text-white">
                                                <h2 class="mb-0 number-font counter">{{$data['notification_count']}}</h2>
                                                <p class="text-white mb-0">Banners</p>
                                            </div>
                                            <div class="ms-auto"> <i class="fa fa-image text-white fs-30 me-2 mt-2"></i> </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- COL END -->

                                      <!-- COL END -->
                            <div style="cursor:pointer;" onclick="redirect('{{url('/')}}/admin/blogs')" class="col-sm-12 col-md-6 col-lg-6 col-xl-3">
                                <div class="card bg-gray-dark img-card box-info-shadow">
                                    <div class="card-body">
                                        <div class="d-flex">
                                            <div class="text-white">
                                                <h2 class="mb-0 number-font counter">{{$data['blog_count']}}</h2>
                                                <p class="text-white mb-0">Blogs</p>
                                            </div>
                                            <div class="ms-auto"> <i class="fa fa-newspaper-o text-white fs-30 me-2 mt-2"></i> </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- COL END -->
                                     <!-- COL END -->
                            <div style="cursor:pointer;" onclick="redirect('{{url('/')}}/admin/packages')" class="col-sm-12 col-md-6 col-lg-6 col-xl-3">
                                <div class="card  bg-success img-card box-success-shadow">
                                    <div class="card-body">
                                        <div class="d-flex">
                                            <div class="text-white">
                                                <h2 class="mb-0 number-font counter">{{$data['package_count']}}</h2>
                                                <p class="text-white mb-0"> Package</p>
                                            </div>
                                            <div class="ms-auto"> <i class="fa fa-package text-white fs-30 me-2 mt-2"></i> </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- COL END -->
                                  <!-- COL END -->
                             <div style="cursor:pointer;" onclick="redirect('{{url('/')}}/admin/hotel')" class="col-sm-12 col-md-6 col-lg-6 col-xl-3">
                                <div class="card bg-secondary img-card box-secondary-shadow">
                                    <div class="card-body">
                                        <div class="d-flex">
                                            <div class="text-white">
                                                <h2 class="mb-0 number-font counter">{{$data['hotel_count']}}</h2>
                                                <p class="text-white mb-0 ">Hotel</p>
                                            </div>
                                            <div class="ms-auto"> <i class="fa fa-hotel text-white fs-30 me-2 mt-2"></i> </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                                </div>


                                @endhasanyrole



                        </div>





        @endsection

    @section('scripts')

    <script>
    // ######################Order Graph Section#############
    var graph_max_size={{$data['graph_max_size']}};
    var graph_setp_size={{$data['graph_setp_size']}};
     var chart_label=null;
    var order_array = null;
    //################End OF Order Graph Section ##################
    </script>
    <!-- SPARKLINE JS-->
    <script src="{{asset('assets/plugins/jquery-sparkline/jquery.sparkline.min.js')}}"></script>

    <!-- CHART-CIRCLE JS-->
    <script src="{{asset('assets/plugins/circle-progress/circle-progress.min.js')}}"></script>

    <!-- INTERNAL SELECT2 JS -->
    <script src="{{asset('assets/plugins/select2/select2.full.min.js')}}"></script>
    <script src="{{asset('assets/js/select2.js')}}"></script>

    <!-- PIETY CHART JS-->
    <script src="{{asset('assets/plugins/peitychart/jquery.peity.min.js')}}"></script>
    <script src="{{asset('assets/plugins/peitychart/peitychart.init.js')}}"></script>

    <!-- INTERNAL CHARTJS CHART JS-->
    <script src="{{asset('assets/plugins/chart/Chart.bundle.js')}}"></script>
    <script src="{{asset('assets/plugins/chart/rounded-barchart.js')}}"></script>
    <script src="{{asset('assets/plugins/chart/utils.js')}}"></script>

    <!-- INTERNAL SELECT2 JS -->
    <script src="{{asset('assets/plugins/select2/select2.full.min.js')}}"></script>

    <!-- INTERNAL Data tables js-->
    <script src="{{asset('assets/plugins/datatable/js/jquery.dataTables.min.js')}}"></script>
    <script src="{{asset('assets/plugins/datatable/js/dataTables.bootstrap5.js')}}"></script>
    <script src="{{asset('assets/plugins/datatable/dataTables.responsive.min.js')}}"></script>

    <!-- INTERNAL APEXCHART JS -->
    <script src="{{asset('assets/js/apexcharts.js')}}"></script>
    <script src="{{asset('assets/plugins/apexchart/irregular-data-series.js')}}"></script>

    <!-- C3 CHART JS -->
    <script src="{{asset('assets/plugins/charts-c3/c3-chart.js')}}"></script>
    <script src="{{asset('assets/plugins/charts-c3/d3.v5.min.js')}}"></script>

    <!-- CHART-DONUT JS -->
    <script src="{{asset('assets/js/charts.js')}}"></script>

    <!-- INTERNAL Flot JS -->
    <script src="{{asset('assets/plugins/flot/jquery.flot.js')}}"></script>
    <script src="{{asset('assets/plugins/flot/jquery.flot.fillbetween.js')}}"></script>
    <script src="{{asset('assets/plugins/flot/chart.flot.sampledata.js')}}"></script>
    <script src="{{asset('assets/plugins/flot/dashboard.sampledata.js')}}"></script>

    <!-- INTERNAL Vector js -->
    <script src="{{asset('assets/plugins/jvectormap/jquery-jvectormap-2.0.2.min.js')}}"></script>
    <script src="{{asset('assets/plugins/jvectormap/jquery-jvectormap-world-mill-en.js')}}"></script>

    <!-- INTERNAL INDEX JS -->
    <script src="{{asset('assets/js/index.js')}}"></script>
    <script src="{{asset('assets/js/index1.js')}}"></script>




    <!-- COUNTERS JS-->
    <script src="{{asset('assets/plugins/counters/counterup.min.js')}}"></script>
    <script src="{{asset('assets/plugins/counters/waypoints.min.js')}}"></script>
    <script src="{{asset('assets/plugins/counters/counters-1.js')}}"></script>

<script>
         ///// Token Status Refreshing
         var token = $("meta[name=csrf-token]").attr("content");

function redirect(url){
    window.location.replace(url);

}
function t(e, o, r, t) {
          var a = document.getElementById("transactions");
          a.height = "330";
          var l = a.getContext("2d"),
            n = l.createLinearGradient(0, 80, 0, 280);
          n.addColorStop(0, e || "rgba(108, 95, 252, 0.8)"),
            n.addColorStop(1, o || "rgba(108, 95, 252, 0.2) ");
          var c = l.createLinearGradient(0, 80, 0, 280);
          c.addColorStop(0, r || "rgba(5, 195, 251, 0.8)"),
            c.addColorStop(1, r || "rgba(5, 195, 251, 0.2) ");
          new Chart(a, {
            type: "line",
            data: {
              labels: [
                "Jan",
                "Feb",
                "Mar",
                "Apr",
                "May",
                "June",
                "July",
                "Aug",
                "Sep",
                "Oct",
                "Nov",
                "Dec",
              ],
              type: "line",
              datasets: [
                {
                  label: "Total Sales",
                  data: [
                    100, 210, 180, 454, 454, 230, 230, 656, 656, 350, 350, 210,
                  ],
                  backgroundColor: n,
                  borderColor: t || "#6c5ffc",
                  pointBackgroundColor: "#fff",
                  pointHoverBackgroundColor: n,
                  pointBorderColor: t || "#6c5ffc",
                  pointHoverBorderColor: n,
                  pointBorderWidth: 0,
                  pointRadius: 0,
                  pointHoverRadius: 0,
                  borderWidth: 3,
                  fill: "origin",
                },
                {
                  label: "Total Orders",
                  data: [
                    200, 530, 110, 110, 480, 520, 780, 435, 475, 738, 454, 454,
                  ],
                  backgroundColor: "transparent",
                  borderColor: "#05c3fb",
                  pointBackgroundColor: "#fff",
                  pointHoverBackgroundColor: c,
                  pointBorderColor: "#05c3fb",
                  pointHoverBorderColor: c,
                  pointBorderWidth: 0,
                  pointRadius: 0,
                  pointHoverRadius: 0,
                  borderWidth: 3,
                  fill: "origin",
                },
              ],
            },
            options: {
              responsive: !0,
              maintainAspectRatio: !1,
              tooltips: { enabled: !1 },
              legend: { display: !1, labels: { usePointStyle: !1 } },
              scales: {
                xAxes: [
                  {
                    display: !0,
                    gridLines: {
                      display: !1,
                      drawBorder: !1,
                      color: "rgba(119, 119, 142, 0.08)",
                    },
                    ticks: { fontColor: "#b0bac9", autoSkip: !0 },
                    scaleLabel: {
                      display: !1,
                      labelString: "Month",
                      fontColor: "transparent",
                    },
                  },
                ],
                yAxes: [
                  {
                    ticks: {
                      min: 0,
                      max: 1050,
                      stepSize: 150,
                      fontColor: "#b0bac9",
                    },
                    display: !0,
                    gridLines: {
                      display: !0,
                      drawBorder: !1,
                      zeroLineColor: "rgba(142, 156, 173,0.1)",
                      color: "rgba(142, 156, 173,0.1)",
                    },
                    scaleLabel: {
                      display: !1,
                      labelString: "sales",
                      fontColor: "transparent",
                    },
                  },
                ],
              },
              title: { display: !1, text: "Normal Legend" },
            },
          });
        }
</script>
    @endsection