@extends('admin.layouts.app')

@section('content')
    @include('admin.layouts.headers.page')
    <div class="container-fluid mt--7">
        <div class="row">
            <div class="col-md-12">
                <div class="card shadow">
                    <div class="card-header">
                        <h1>Bem-vindo ao painel iWill.</h1>
                    </div>
                    <div class="card-body">
                        <!-- Seção de Professores e Alunos -->
                        <div class="row mt-2 justify-content-center align-items-center text-center">
                            <div class="col">
                                <div class="form-group text-center">
                                    <a class="nav-link {{ request()->is('admin/professores*') ? 'active' : '' }}" href="{{ url('admin/professores') . '?name=&status=approved&phone=&email=&state=&city=&min_birth_date=&max_birth_date=&order=#' }}">
                                        <img src="{{ asset('/images/web/doll/ps5.png') }}" alt="Imagem de exemplo" style="width: 55px; height: 50px;" class="mb-2">
                                        <label for="expiration_date" class="form-control-label">Professores cadastrados</label>
                                        <h1 class="h1-title">{{ $totalTeachersApproved }}</h1>
                                    </a>
                                </div>
                            </div>
                            <div class="col">
                                <div class="form-group text-center">
                                    <a class="nav-link {{ request()->is('admin/alunos*') ? 'active' : '' }}" href="{{ url('admin/alunos') . '?_token=2DoWzc75qkPhAdToi0LsvMAlxHeO6uTFnxsKD2mD&name=&email=&min_expiration_date=&min_birth_date=&max_expiration_date=&max_birth_date=&status=approved&order=#' }}">
                                        <img src="{{ asset('/images/web/doll/p12.png') }}" alt="Imagem de exemplo" style="width: 70px; height: 50px;" class="mb-2">
                                        <label for="expiration_date" class="form-control-label">Alunos ativos</label>
                                        <h1 class="h1-title">{{ $totalStudentsApproved }}</h1>
                                    </a>
                                </div>
                            </div>
                        </div>

                        <!-- Seção de Métricas -->
                        <div class="row mt-4 justify-content-center align-items-center text-center">
                            @foreach(['LTV', 'CAC', 'CHURN', 'NPS'] as $metric)
                                <div class="col-3">
                                    <div class="form-group text-center">
                                        <a class="nav-link {{ request()->is('admin/professores*') ? 'active' : '' }}" href="{{ url('admin/professores') . '?name=&status=approved&phone=&email=&state=&city=&min_birth_date=&max_birth_date=&order=#' }}">
                                            <label for="expiration_date" class="form-control-label">{{ $metric }}</label>
                                            <h1 class="h1-title">?</h1>
                                        </a>
                                    </div>
                                </div>
                            @endforeach
                        </div>

                        <!-- Divisória -->
                        <hr style="border-top: 1px solid #ddd; width: 80%; margin: 10px auto;">

                        <!-- Seção de Aulas Pendentes -->
                        <div class="row d-flex justify-content-center align-items-center">
                            <div class="col-md-4">
                                <h1>Aulas pendentes!</h1>
                            </div>
                        </div>
                        <div class="row justify-content-center">
                            <div class="col-md-12">
                                <table class="table table-striped table-responsive">
                                    <thead>
                                        <tr>
                                            <th style="width: 10%;">Aluno</th>
                                            <th style="width: 20%;">Data e Hora</th>
                                            <th style="width: 15%;">Duração</th>
                                            <th style="width: 20%;">Professor</th>
                                            <th style="width: 15%;">Status</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($aulasPendentes as $aula)
                                            <tr>
                                                <td>{{ $aula->student_name }}</td>
                                                <td>{{ \Carbon\Carbon::parse($aula->lesson_date_time)->timezone('America/Sao_Paulo')->format('d/m/Y H:i') }}</td>
                                                <td>{{ $aula->duration_in_minutes ?? 'N/A' }}</td>
                                                <td>{{ $aula->teacher_name ?? 'N/A' }}</td>
                                                <td>{{ $aula->lesson_status }}</td>
                                            </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>

                        <!-- Divisória -->
                        <hr style="border-top: 1px solid #ddd; width: 80%; margin: 10px auto;">

                        <!-- Seção de Filtros -->
                        <div class="monthButtons">
                            <button type="button" class="btn btn-secondary btn-sm custom-small-btn" onclick="resetFilters()">TOTAL</button>
                            @foreach (['jan' => 'Janeiro', 'feb' => 'Fevereiro', 'mar' => 'Março', 'apr' => 'Abril', 'may' => 'Maio', 'jun' => 'Junho', 'jul' => 'Julho', 'aug' => 'Agosto', 'sep' => 'Setembro', 'oct' => 'Outubro', 'nov' => 'Novembro', 'dec' => 'Dezembro'] as $key => $month)
                                <button type="button" class="btn btn-secondary btn-sm custom-small-btn" onclick="setMonth('{{ $key }}')">{{ $month }}</button>
                            @endforeach
                        </div>
                        <div class="filterClass">
                            <form id="filterForm" action="#" method="get">
                                @csrf
                                <div class="row mt-2 justify-content-center align-items-center">
                                    <div class="col">
                                        <div class="form-group">
                                            <label for="expiration_date_start" class="form-control-label">Data inicial</label>
                                            <input class="form-control" type="date" value="{{ request()->get('expiration_date_start') }}" name="expiration_date_start" id="expiration_date_start">
                                        </div>
                                    </div>
                                    <div class="col mt-2">
                                        <div class="form-group">
                                            <label for="expiration_date_end" class="form-control-label">Data final</label>
                                            <input class="form-control" type="date" value="{{ request()->get('expiration_date_end') }}" name="expiration_date_end" id="expiration_date_end">
                                        </div>
                                    </div>
                                </div>
                                <button class="mt-2 btn btn-primary" type="submit">Enviar</button>
                            </form>
                        </div>

                        <!-- Seção de Aulas Finalizadas -->
                        <div class="row mt-4">
                            <div class="col-md-2">
                                <h3>Aulas finalizadas</h3>
                                <h1>{{ $totalFinished }}</h1>
                            </div>
                            <div class="col-md-2">
                                <h3>Professor 12h-</h3>
                                <h1>{{ $totalCancelledTooLateByTeacher }}</h1>
                            </div>
                            <div class="col-md-2">
                                <h3>Aluno 12h-</h3>
                                <h1>{{ $totalCancelledTooLateByStudent }}</h1>
                            </div>
                            <div class="col-md-2">
                                <h3>Recusadas</h3>
                                <h1>{{ $totalRefused }}</h1>
                            </div>
                        </div>

                        <!-- Divisória -->
                        <hr style="border-top: 1px solid #ddd; width: 80%; margin: 10px auto;">

                        <!-- Seção de Incentivar -->
                        <div class="row d-flex justify-content-center align-items-center">
                            <div class="col-md-3">
                                <h1>Incentivar</h1>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-12">
                                <table class="table table-striped table-responsive">
                                    <thead>
                                        <tr>
                                            <th>Name</th>
                                            <th>Total Créditos</th>
                                            <th>Última Aula</th>
                                            <th>Grupo</th>
                                            <th>Ação</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach($incentivar as $status)
                                            <tr>
                                                <td>{{ $status->name }}</td>
                                                <td>{{ $status->total_creditos }}</td>
                                                <td>{{ \Carbon\Carbon::parse($status->ultima_aula)->format('d/m/Y H:i') }}</td>
                                                <td>{{ $status->grupo }}</td>
                                                <td>
                                                    <a href="whatsapp://send?text=Olá, {{ $status->name }}!">
                                                        <img src="{{ asset('/images/web/icons/whatsapp-brands.svg') }}" alt="Enviar" style="width: 24px; height: 24px;">
                                                    </a>
                                                </td>
                                            </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
    </div>

    

    @include('admin.layouts.footers.auth')

    <script>
        function setMonth(month) {
            const year = new Date().getFullYear();
            let startDate, endDate;

            switch (month) {
                case 'jan':
                    startDate = new Date(year, 0, 1);
                    endDate = new Date(year, 0, 31);
                    break;
                case 'feb':
                    startDate = new Date(year, 1, 1);
                    endDate = new Date(year, 1, 28);
                    break;
                case 'mar':
                    startDate = new Date(year, 2, 1);
                    endDate = new Date(year, 2, 31);
                    break;
                case 'apr':
                    startDate = new Date(year, 3, 1);
                    endDate = new Date(year, 3, 30);
                    break;
                case 'may':
                    startDate = new Date(year, 4, 1);
                    endDate = new Date(year, 4, 31);
                    break;
                case 'jun':
                    startDate = new Date(year, 5, 1);
                    endDate = new Date(year, 5, 30);
                    break;
                case 'jul':
                    startDate = new Date(year, 6, 1);
                    endDate = new Date(year, 6, 31);
                    break;
                case 'aug':
                    startDate = new Date(year, 7, 1);
                    endDate = new Date(year, 7, 31);
                    break;
                case 'sep':
                    startDate = new Date(year, 8, 1);
                    endDate = new Date(year, 8, 30);
                    break;
                case 'oct':
                    startDate = new Date(year, 9, 1);
                    endDate = new Date(year, 9, 31);
                    break;
                case 'nov':
                    startDate = new Date(year, 10, 1);
                    endDate = new Date(year, 10, 30);
                    break;
                case 'dec':
                    startDate = new Date(year, 11, 1);
                    endDate = new Date(year, 11, 31);
                    break;
            }

            document.getElementById('expiration_date_start').value = startDate.toISOString().split('T')[0];
            document.getElementById('expiration_date_end').value = endDate.toISOString().split('T')[0];
        }

        function resetFilters() {
            document.getElementById('expiration_date_start').value = '';
            document.getElementById('expiration_date_end').value = '';
        }
    </script>



@endsection