@extends('layouts.admin.app')

@section('content')

@php
$query = 'Queries';
$complaint = 'Complaint';
@endphp
<body>

  <main id="main" class="main">
    <div class="pagetitle">
      <h1>Dashboard</h1>
      <nav>
        <ol class="breadcrumb">
          <li class="breadcrumb-item"><a href="{{route('csd.home')}}">Home</a></li>
          <li class="breadcrumb-item active">Dashboard</li>
        </ol>
      </nav>
    </div><!-- End Page Title -->

<section class="section dashboard">
  <div class="row">
    <!-- Query Contacts -->
    <div class="col-lg-8">
      <div class="row">
        <h4>Query contacts</h4>
        @forelse($Queriescontacts as $Queriescontact)
          <a class="dropdown-item" href="{{ url('/csd/sitelabels/' . $query . '/' . $Queriescontact->countryName) }}">
            <div class="col-xxl-4 col-md-6">
              <div class="card info-card sales-card">
                <div class="card-body">
                  <h5 class="card-title">{{ $Queriescontact->countryName }} <span>| unread Notifications</span></h5>
                  <div class="d-flex align-items-center">
                    <div class="card-icon rounded-circle d-flex align-items-center justify-content-center">
                      <i class="ri-mail-unread-fill"></i>
                    </div>
                    <div class="ps-3">
                      <h6>{{ $Queriescontact->unread ?? 0 }}</h6>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </a>
        @empty
          <div class="col-xxl-4 col-md-6">
            <div class="card info-card sales-card">
              <div class="card-body">
                <h5 class="card-title">No Data <span>| unread Notifications</span></h5>
                <div class="d-flex align-items-center">
                  <div class="card-icon rounded-circle d-flex align-items-center justify-content-center">
                    <i class="ri-mail-unread-fill"></i>
                  </div>
                  <div class="ps-3">
                    <h6>0</h6>
                  </div>
                </div>
              </div>
            </div>
          </div>
        @endforelse
      </div>
    </div>
  </div>
</section>

<section class="section dashboard">
  <div class="row">
    <!-- Complaint Contacts -->
    <div class="col-lg-8">
      <div class="row">
        <h4>Complaint contacts</h4>
        @forelse($Complaintcontacts as $Complaintcontact)
          <a class="dropdown-item" href="{{ url('/csd/sitelabels/' . $complaint . '/' . $Complaintcontact->countryName) }}">
            <div class="col-xxl-4 col-md-6">
              <div class="card info-card sales-card">
                <div class="card-body">
                  <h5 class="card-title">{{ $Complaintcontact->countryName }} <span>| unread Notifications</span></h5>
                  <div class="d-flex align-items-center">
                    <div class="card-icon rounded-circle d-flex align-items-center justify-content-center">
                      <i class="ri-mail-unread-fill"></i>
                    </div>
                    <div class="ps-3">
                      <h6>{{ $Complaintcontact->unread ?? 0 }}</h6>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </a>
        @empty
          <div class="col-xxl-4 col-md-6">
            <div class="card info-card sales-card">
              <div class="card-body">
                <h5 class="card-title">No Data <span>| unread Notifications</span></h5>
                <div class="d-flex align-items-center">
                  <div class="card-icon rounded-circle d-flex align-items-center justify-content-center">
                    <i class="ri-mail-unread-fill"></i>
                  </div>
                  <div class="ps-3">
                    <h6>0</h6>
                  </div>
                </div>
              </div>
            </div>
          </div>
        @endforelse
      </div>
    </div>
  </div>
</section>


</body>

</html>
<script>
    
    /******auto refresh HTML only if there has been no activity on a page******/

    var inactivityTimeout;
    var inactivityDuration = 600000; // 10 minutes in milliseconds

    function resetInactivityTimer() {
        clearTimeout(inactivityTimeout);
        inactivityTimeout = setTimeout(refreshPage, inactivityDuration);
    }

    function refreshPage() {
        location.reload();
    }

    // Event listeners to reset the inactivity timer
    document.addEventListener('mousemove', resetInactivityTimer);
    document.addEventListener('keydown', resetInactivityTimer);
    document.addEventListener('scroll', resetInactivityTimer);

    // Initial setup of the inactivity timer
    resetInactivityTimer();
    
    
</script>

<style type="text/css">
  .bg-dark-corporate{background-color: #214158 !important;}
</style>


{{--
<!-- <div>
<div class="row" >
  <div class="col-sm-3" style="display: inline-flex; width: calc(33.33% - 10px); margin-right: 10px;">  <div class="card" style="width: 100%; border-radius: 10px;margin-top:50px;margin-left:10px;">
      <div class="card-body">
        <h5 class="card-title" style="display: inline-block; width: calc(60% - 10px); margin-right: 10px;">Gift Basket Italy</h5>  <p class="card-text" style="display: inline-block;">Pending Masseges({{$GBITContactData}}) </p>
        <a href="{{url('/csd/sitelabels')}}/{{$gbit}}" class="btn btn-primary">View</a>
      </div>
    </div>
  </div>
  <div class="col-sm-3" style="display: inline-flex; width: calc(33.33% - 10px); margin-right: 10px;">  <div class="card" style="width: 100%; border-radius: 10px;margin-top:50px;">
      <div class="card-body">
        <h5 class="card-title" style="display: inline-block; width: calc(60% - 10px); margin-right: 10px;">Gift Basket France</h5>  <p class="card-text" style="display: inline-block;">Pending Masseges({{$GBFRContactData}})</p>
        <a href="{{url('/csd/sitelabels')}}/{{$gbfr}}" class="btn btn-primary">View</a>
      </div>
    </div>
  </div>
  <div class="col-sm-3" style="display: inline-flex; width: calc(33.33% - 10px); margin-right: 10px;">  <div class="card" style="width: 100%; border-radius: 10px;margin-top:50px;">
      <div class="card-body">
        <h5 class="card-title" style="display: inline-block; width: calc(60% - 10px); margin-right: 10px;">Gift Basket Singapore</h5>  <p class="card-text" style="display: inline-block;">Pending Masseges({{$GBSGContactData}})</p>
        <a href="{{url('/csd/sitelabels')}}/{{$gbsg}}" class="btn btn-primary">View</a>
      </div>
    </div>
  </div>
  <div class="col-sm-3" style="display: inline-flex; width: calc(33.33% - 10px); margin-right: 10px;">  <div class="card" style="width: 100%; border-radius: 10px;margin-top:50px;margin-left:10px;">
      <div class="card-body">
        <h5 class="card-title" style="display: inline-block; width: calc(60% - 10px); margin-right: 10px;">Gift Basket Brazil</h5>  <p class="card-text" style="display: inline-block;">Pending Masseges({{$GBBRContactData}})</p>
        <a href="{{url('/csd/sitelabels')}}/{{$gbbr}}" class="btn btn-primary">View</a>
      </div>
    </div>
  </div>
  <div class="col-sm-3" style="display: inline-flex; width: calc(33.33% - 10px); margin-right: 10px;">  <div class="card" style="width: 100%; border-radius: 10px;margin-top:50px;margin-left:10px;">
      <div class="card-body">
        <h5 class="card-title" style="display: inline-block; width: calc(60% - 10px); margin-right: 10px;">Gift Basket Germany</h5>  <p class="card-text" style="display: inline-block;">Pending Masseges({{$GBGContactData}})</p>
        <a href="{{url('/csd/sitelabels')}}/{{$gbg}}" class="btn btn-primary">View</a>
      </div>
    </div>
  </div>
</div>
</div> -->
<!--  $i++; -->

<!-- <script src="{{ asset('admin/assets/extra-libs/multicheck/datatable-checkbox-init.js') }}"></script>
<script src="{{ asset('admin/assets/extra-libs/multicheck/jquery.multicheck.js') }}"></script>
<script src="{{ asset('admin/assets/extra-libs/DataTables/datatables.min.js') }}"></script>
<script>
    /****************************************
     *       Basic Table                   *
     ****************************************/
    $('#zero_config').DataTable({
        "order": [[0, "asc"]] 
    });

    
    
</script> -->


--}}


@endsection

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js" integrity="sha512-v2CJ7UaYy4JwqLDIrZUI/4hqeoQieOmAZNXBeQyjo21dadnwR+8ZaIJVT8EE2iyI61OV8e6M8PP2/4hpQINQ/g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

{{--
<!-- <script>
    $(document).ready(function() {
        function checkTimeAndSendRequest() {
            $.ajax({
                url: '{{route("csd.getTime")}}',
                method: 'get', 
                success: function(response) {
                    var servertime = new Date(response); 

                    var hours = servertime.getHours();
                    var minutes = servertime.getMinutes();
                    var ampm = hours >= 12 ? 'PM' : 'AM';
                    hours = hours % 12;
                    hours = hours ? hours : 12; 

                    // console.log('Current Time:', hours + ':' + (minutes < 10 ? '0' + minutes : minutes) + ' ' + ampm);

                    if (hours === 4 && minutes === 48 && ampm === 'PM') {
                        sendAjaxRequest();
                        // console.log('Sending AJAX request...');
                    }
                },
                error: function(error) {
                    console.log('AJAX error:', error);
                }
            });
        }

        function sendAjaxRequest() {
            // console.log('AJAX request initiated');
            $.ajax({
                url: '{{route("csd.MailCheck")}}', 
                method: 'get', 
                success: function(response) {
                    // console.log('AJAX success:', response);
                },
                error: function(error) {
                    console.log('AJAX error:', error);
                }
            });
        }
        checkTimeAndSendRequest();
        setInterval(checkTimeAndSendRequest, 30000);
    });
</script> -->--}}