@php use Illuminate\Support\Facades\DB; @endphp
@extends('layouts.admin')
@section('content')
<div class="admin-shell">
    @livewire('navigation.side-menu')
    @livewire('navigation.top-menu')

    <div class="page-wrapper">
        <div class="page-content admin-page-content">
            <h3>{{ $title ?? '' }}</h3>
            @if(isset($content))
                {!! $content !!}
            @elseif(isset($view))
                {{ view($view, $variables ?? []) }}
            @else
                @livewire($class, $variables ?? [])
            @endif
        </div>
    </div>

    <style>
        .admin-shell {
            --bs-topbar-height: 60px;
        }

        .page-wrapper > .admin-page-content {
            box-sizing: border-box;
            margin-top: var(--bs-topbar-height);
            padding-top: 24px;
            padding-left: 30px;
            padding-right: 24px;
        }

        .topbar {
            z-index: 1000;
            pointer-events: auto;
        }

        .admin-shell .topbar > .container-xxl {
            width: calc(100% - 24px);
            margin-right: auto;
            margin-left: auto;
            position: relative;
            left: 2px;
        }

        @media (max-width: 767.98px) {
            .page-wrapper > .admin-page-content {
                padding-top: 16px;
                padding-left: 20px;
                padding-right: 86px;
            }
        }
    </style>

    <script>
        document.addEventListener('DOMContentLoaded', function() {
            @php
                $callSchedules = \App\Models\Collection\CallSchedule::query()
                    ->where('idasesor', auth()->id())
                    ->whereDate('fecha', now())
                    ->exists();
            @endphp

            const hasCallSchedules = {!! json_encode($callSchedules) !!};

            function showAlert() {
                if (!hasCallSchedules) return;

                const lastShown = localStorage.getItem('lastCallScheduleAlert');
                const now = new Date().getTime();
                const twentyFiveMinutes = 25 * 60 * 1000; // 25 минут в миллисекундах
                // const twentyFiveMinutes = 10000;

                if (!lastShown || (now - parseInt(lastShown)) > twentyFiveMinutes) {
                    Swal.fire({
                        title: 'LLAMADAS VENCIDAS',
                        html: `@include('components.layouts.modal')`,
                        width: '800px',
                        showCloseButton: false,
                        backdrop: true,
                        allowOutsideClick: true,
                        showConfirmButton: false,
                    });

                    localStorage.setItem('lastCallScheduleAlert', now.toString());
                }
            }

            showAlert();
            const intervalId = setInterval(showAlert, 60000);

            window.addEventListener('beforeunload', function() {
                clearInterval(intervalId);
            });
        });
    </script>
</div>
@endsection