@extends('layouts.app')
@section('title', 'Dashboard')
@section('pages')
<style type="text/css">
  .swal2-html-container {
    margin: 1em 0.6em 0.3em;
  }
</style>
{{--<div class="alert alert-warning alert-dismissible fade show border-0 py-2" role="alert">
  👋 Welcome to <strong>{{Auth::user()->name}}</strong>
  <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>--}}

            <div class="row row-cols-1 row-cols-lg-4 row-cols-xl-4 row-cols-xxl-4">
              {{--<div class="col">
                <div class="card radius-5">
                  <div class="card-body">
                    <div class="d-flex align-items-center">
                      <div class="">
                        <p class="mb-1">Total Enquiry</p>
                        <h4 class="mb-0 text-primary">{{$enquiryCount}}</h4>
                      </div>
                      <div class="ms-auto fs-2 text-primary">
                      <i class="bi-list"></i>
                      </div>
                    </div>
                    <!-- <div class="border-top my-2"></div>
                    <small class="mb-0"><span class="text-success">+2.5 <i class="bi bi-arrow-up"></i></span> Compared to last month</small> -->
                  </div>
                </div>
               </div>
               <div class="col">
                <div class="card radius-5">
                  <div class="card-body">
                    <div class="d-flex align-items-center">
                      <div class="">
                        <p class="mb-1">Total Product</p>
                        <h4 class="mb-0 text-success">{{$productCount}}</h4>
                      </div>
                      <div class="ms-auto fs-2 text-success">
                        <i class="bi bi-p-circle"></i>
                      </div>
                    </div>
                    <!-- <div class="border-top my-2"></div>
                    <small class="mb-0"><span class="text-success">+3.6 <i class="bi bi-arrow-up"></i></span> Compared to last month</small> -->
                  </div>
                </div>
               </div>

               {{--<div class="col">
                <div class="card radius-5">
                  <div class="card-body">
                    <div class="d-flex align-items-center">
                      <div class="">
                        <p class="mb-1">Total Category </p>
                        <h4 class="mb-0 text-pink">{{$categoryCount}}</h4>
                      </div>
                      <div class="ms-auto fs-2 text-pink">
                        <i class="bi bi-bucket"></i>
                      </div>
                    </div>
                    <!-- <div class="border-top my-2"></div>
                    <small class="mb-0"><span class="text-danger">-1.8 <i class="bi bi-arrow-down"></i></span> Compared to last month</small> -->
                  </div>
                </div>
               </div>
               <div class="col">
                <div class="card radius-5">
                  <div class="card-body">
                    <div class="d-flex align-items-center">
                      <div class="">
                        <p class="mb-1">Return</p>
                        <h4 class="mb-0 text-orange">{{$returnCount}}</h4>
                      </div>
                      <div class="ms-auto fs-2 text-orange">
                        <i class="bi bi-recycle"></i>
                      </div>
                    </div>
                    <!-- <div class="border-top my-2"></div>
                    <small class="mb-0"><span class="text-success">+3.7 <i class="bi bi-arrow-up"></i></span> Compared to last month</small> -->
                  </div>
                </div>
               </div> --}}
            </div>
            <!--end row-->


            <!-- <div class="row">
              <div class="col-12 col-lg-8 col-xl-8">
                <div class="card radius-5">
                  <div class="card-body">
                     <div class="row row-cols-1 row-cols-lg-2 g-3 align-items-center mb-3">
                        <div class="col">
                          <h5 class="mb-0">Sales Figures</h5>
                        </div>
                        <div class="col">
                          <div class="d-flex align-items-center justify-content-sm-end gap-3 cursor-pointer">
                             <div class="font-13"><i class="bi bi-circle-fill text-primary"></i><span class="ms-2">Sales</span></div>
                             <div class="font-13"><i class="bi bi-circle-fill text-success"></i><span class="ms-2">Orders</span></div>
                          </div>
                        </div>
                     </div>
                     <div id="chart1"></div>
                  </div>
                </div>
              </div>
              <div class="col-12 col-lg-4 col-xl-4">
                <div class="card radius-5">
                  <div class="card-body">
                    <div class="d-flex align-items-center gap-4">
                      <div class="">
                        <span class="donut" data-peity='{ "fill": ["#8932ff", "rgba(135, 50, 255, 0.15)"], "innerRadius": 28, "radius": 50, "width": 67, "height": 67}'>3/5</span>
                      </div>
                      <div class="">
                        <h4 class="mb-0">68%</h4>
                        <p class="mb-1">Conversation Rate</p>
                      </div>
                      <div class="dropdown ms-auto">
                        <a class="dropdown-toggle dropdown-toggle-nocaret" href="#" data-bs-toggle="dropdown"><i class="bx bx-dots-horizontal-rounded font-22 text-option"></i>
                        </a>
                        <ul class="dropdown-menu">
                          <li><a class="dropdown-item" href="javascript:;">Action</a>
                          </li>
                          <li><a class="dropdown-item" href="javascript:;">Another action</a>
                          </li>
                          <li>
                            <hr class="dropdown-divider">
                          </li>
                          <li><a class="dropdown-item" href="javascript:;">Something else here</a>
                          </li>
                        </ul>
                      </div>
                    </div>
                    <div class="border-top my-4"></div>
                    <div class="d-flex align-items-center gap-4">
                      <div class="">
                        <span class="donut" data-peity='{ "fill": ["#ff6632", "rgba(255, 101, 50, 0.15)"], "innerRadius": 28, "radius": 50, "width": 67, "height": 67}'>3.5/5</span>
                      </div>
                      <div class="">
                        <h4 class="mb-0">76%</h4>
                        <p class="mb-1">Traffic this year</p>
                      </div>
                      <div class="dropdown ms-auto">
                        <a class="dropdown-toggle dropdown-toggle-nocaret" href="#" data-bs-toggle="dropdown"><i class="bx bx-dots-horizontal-rounded font-22 text-option"></i>
                        </a>
                        <ul class="dropdown-menu">
                          <li><a class="dropdown-item" href="javascript:;">Action</a>
                          </li>
                          <li><a class="dropdown-item" href="javascript:;">Another action</a>
                          </li>
                          <li>
                            <hr class="dropdown-divider">
                          </li>
                          <li><a class="dropdown-item" href="javascript:;">Something else here</a>
                          </li>
                        </ul>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="card radius-5">
                  <div class="card-body">
                     <div class="d-flex align-items-end">
                        <div>
                          <h4 class="mb-1">256.2K</h4>
                          <p class="mb-0">Visitors this year</p>
                        </div>
                        <div class="ms-auto">
                          <p class="mb-0 text-danger">1.5% <i class="bi bi-arrow-up"></i></p>
                        </div>
                     </div>
                     <div id="chart2"></div>
                  </div>
                </div>
              </div>
            </div> -->
            <!--end row-->

            <!-- <div class="row">
               <div class="col-12 col-lg-6 col-xl-6 d-flex">
                 <div class="card radius-5 w-100">
                  <div class="card-body">
                    <div class="row g-3 align-items-center">
                      <div class="col">
                        <h5 class="mb-0">Statistics</h5>
                      </div>
                      <div class="col">
                        <div class="d-flex">
                          <div class="dropdown ms-auto">
                            <a class="dropdown-toggle dropdown-toggle-nocaret" href="#" data-bs-toggle="dropdown"><i class="bx bx-dots-horizontal-rounded font-22 text-option"></i>
                            </a>
                            <ul class="dropdown-menu">
                              <li><a class="dropdown-item" href="javascript:;">Action</a>
                              </li>
                              <li><a class="dropdown-item" href="javascript:;">Another action</a>
                              </li>
                              <li>
                                <hr class="dropdown-divider">
                              </li>
                              <li><a class="dropdown-item" href="javascript:;">Something else here</a>
                              </li>
                            </ul>
                          </div>
                        </div>
                      </div>
                   </div>
                    <div class="row row-cols-3 row-cols-md-3 g-3 mt-4">
                       <div class="col text-center">
                            <div class="w_chart" id="chart3" data-percent="68">
                            <span class="w_percent"></span>
                          </div>
                            <h5 class="mt-3 mb-0">2.4K</h5>
                            <p class="mb-0 font-13">Customers</p>
                          </div>
                          <div class="col text-center">
                            <div class="w_chart" id="chart4" data-percent="78">
                            <span class="w_percent"></span>
                          </div>
                          <h5 class="mt-3 mb-0">1.8K</h5>
                           <p class="mb-0 font-13">Item Sold</p>
                        </div>
                        <div class="col text-center">
                          <div class="w_chart" id="chart5" data-percent="46">
                          <span class="w_percent"></span>
                        </div>
                           <h5 class="mt-3 mb-0">2.6K</h5>
                           <p class="mb-0 font-13">Tickets</p>
                      </div>
                    </div>
                    <div class="bg-light p-3 radius-5 mt-3">
                      <p class="mb-0">There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable</p>
                    </div>
                  </div>
                 </div>
               </div>
               <div class="col-12 col-lg-6 col-xl-6 d-flex">
                <div class="card radius-5 w-100">
                  <div class="card-body">
                    <div class="row row-cols-1 row-cols-lg-2 g-3 align-items-center">
                      <div class="col">
                        <h5 class="mb-0">Product Actions</h5>
                      </div>
                      <div class="col">
                        <div class="d-flex align-items-center justify-content-sm-end gap-3 cursor-pointer">
                           <div class="font-13"><i class="bi bi-circle-fill text-primary"></i><span class="ms-2">Views</span></div>
                           <div class="font-13"><i class="bi bi-circle-fill text-warning"></i><span class="ms-2">Clicks</span></div>
                        </div>
                      </div>
                     </div>
                      <div id="chart6"></div>
                    </div>
                  </div>
               </div>
            </div> -->
            <!--end row-->

            <div class="fixed_contact_btn" data-bs-toggle="tooltip" data-bs-placement="left" data-bs-title="Chat with us on WhatsApp!">
		<button type="button" onclick="window.location.href='https://api.whatsapp.com/send?phone=+919366744376&text=urlencodedtext'" aria-label="supprt"><i class="bi bi-whatsapp"></i>Support</button>
	</div>
@endsection
@section('js')

{{-- @if($financial_years < 1)
<script type="text/javascript">
  $(document).ready(function() {
    Swal.fire({
      icon: "warning",
      title: "Warning",
      @if(in_array('financial-year-create', $authRolePermissions))
        text: "No financial year found!",
        confirmButtonText: `<a href="{{ url('financialyear') }}" style="text-decoration:none; color: white;">Create financial year</a>`,
      @else
        text: "No financial year found! Contact your service provider.",
      @endif
      showDenyButton: true,
      denyButtonText: `Close`
    });
  });
</script> --}}
{{-- @endif --}}
@endsection