@extends('layouts.app')

@section('conteudo')

<br>
<center>
    @if (session('erro'))
    <div class="alert alert-danger">
        {{ session('erro') }}
    </div>
    @endif




</center>

<!-- Adicionando classe "corpo" à div que será alterada -->
<div class="corpo">

    <!-- Hero -->
    <div class="bg-dark" style="margin-top: 5%;">
        <div class="bg-black-75">
            <div class="content">
                <div class="py-4 text-center" style="margin-top:-3%">
                    <h1 class="fw-bold text-white mb-2">
                        {{$projeto->descricao}}
                    </h1>
                    <h2 class="h3 fw-normal text-white-75">
                        {{$funcionario->nome_completo}}
                    </h2>
                </div>
                <div style=" margin-left:90%; margin-top:-8%">
                    @can('pode_visualizar_chamada')
                    <a class="btn  btn-primary my-2" href="/chamadas">
                        <i class="fa fa-reply" aria-hidden="true"></i>
                    </a>
                    @endcan
                </div>
            </div>
        </div>
    </div>
    <!-- END Hero -->

    {{-- Botão para imprimir PDF --}}
    {{-- <div class="text-right" style="margin: 20px;">
        <button id="printPDF" class="btn btn-primary">
            <i class="fa fa-print"></i> Imprimir PDF
        </button>
    </div> --}}

    <button id="imprimirRelatorio" class="btn-block-option">
        <i class="si si-printer me-1"></i> Imprimir Relatório
    </button>


    <!-- Print Page functionality is initialized dmPrint() -->
    {{-- <form id="printForm" method="post" action="/imprimir_chamadas_mensal">
        @csrf

        <input type="hidden" name="turma_id" value="{{ $request->input('turma_id') }}">
        <input type="hidden" name="mes" value="{{ $request->input('mes') }}">
        <input type="hidden" name="funcionario_id" value="{{ $request->input('funcionario_id') }}">
        <input type="hidden" name="projeto_id" value="{{ $request->input('projeto_id') }}">
        <input type="hidden" name="juntar_turmas" value="{{ $request->input('juntar_turmas') }}">

        <input type="hidden" name="sexo" value="{{ $request->input('sexo') }}">
        <input type="hidden" name="cor" value="{{ $request->input('cor') }}">
        <input type="hidden" name="possui_irmaos" value="{{ $request->input('possui_irmaos') }}">
        <input type="hidden" name="ex_beneficiario" value="{{ $request->input('ex_beneficiario') }}">
        <input type="hidden" name="aluno_autorizado_sair" value="{{ $request->input('aluno_autorizado_sair') }}">
        <input type="hidden" name="autorizacao_imagem" value="{{ $request->input('autorizacao_imagem') }}">
        <input type="hidden" name="data_inicial" value="{{ $request->input('data_inicial') }}">
        <input type="hidden" name="data_final" value="{{ $request->input('data_final') }}">
        <input type="hidden" name="faixa_etaria_de" value="{{ $request->input('faixa_etaria_de') }}">
        <input type="hidden" name="faixa_etaria_ate" value="{{ $request->input('faixa_etaria_ate') }}">
        <input type="hidden" name="ano" value="{{ $request->input('ano') }}">


        <button type="submit" class="btn-block-option">
            <i class="si si-printer me-1"></i> Imprimir Relatório
        </button>
    </form> --}}


    {{-- só quem tem permissão para visualizar esta página --}}
    @can('pode_visualizar_chamada')
    @foreach ($chamadasDoMes as $chamada)
    <div class="">
        <div class="row items-push">
            <div class="col-12 col-sm-12" style="margin-top: 10px; ">
                <div class="block block-rounded" style="height: 100%;">
                    <div class="block-header block-header-default">
                        <h3 class="block-title">Data: {{date('d-m-Y', strtotime($chamada->data))}} | Projeto: {{$projeto->descricao}} | Turma: {{$chamada->nome_turma}}</h3>
                        <br><br><br>
                    </div>
                    <div class="col-6 col-sm-3 col-lg-3 text-center" style="float:left; margin-top: 10px; margin-left: 25%">
                        <a class="item item-rounded bg-body-dark text-dark fs-2 mb-2 mx-auto">
                            @if($chamada->foto1 == null)
                            <p style="font-size: 12px;"> Não Adicionado </p>
                            @else
                            <img style="width: 150px; height: 120px;" src="{{ $chamada->foto1 }}" data-toggle="modal" data-target="#modalEliminar1">
                            @endif
                        </a>
                    </div>
                    <div class="col-6 col-sm-3 col-lg-3 text-center" style="float:left; margin-top: 10px; margin-right: 20%;">
                        <a class="item item-rounded bg-body-dark text-dark fs-2 mb-2 mx-auto">
                            @if($chamada->foto2 == null)
                            <p style="font-size: 12px;"> Não Adicionado </p>
                            @else
                            <img style="width: 150px; height: 120px;" src="{{ $chamada->foto2 }}" data-toggle="modal" data-target="#modalEliminar2">
                            @endif
                        </a>
                    </div>
                    <br>
                    <div class="col-12 col-sm-12 col-lg-12" style="width: 90%; margin-left: 5%; margin-top: 100px;">
                        <label class="form-label" for="example-select" style="text-align: right;">Descrição do que foi feito em aula:</label>
                        <p>{!! $chamada->descricao !!}</p>
                    </div>
                    <hr>
                    <div class="col-12 col-sm-12 col-lg-12" style="width: 90%; margin-left: 5%;">
                        <table class="table table-hover">
                            <thead>
                                <tr>
                                    <th scope="col">Nome</th>
                                    <th scope="col">Presença</th>
                                    <th scope="col">Observação</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($estudantes as $item)
                                @if($item->turma_id == $chamada->turma_id)
                                <tr>
                                    <td scope="row">{{$item->nome}}</td>
                                    <td scope="row">
                                        @if($item->created_at > $chamada->data || (isset($item->data_inativacao) && $item->data_inativacao < $chamada->data))
                                        <span>N</span>
                                        @else
                                        <input disabled type="checkbox" class="form-check-input" id="chamadaCheck" name="presencas[]" {{ in_array($item->id, $presencasPorData[$chamada->data] ?? []) ? 'checked' : '' }} value="{{$item->id}}">
                                        @endif
                                    </td>
                                    <td scope="row">
                                        <p>{{ $selected_observacoes[$loop->index] ?? '' }}</p>
                                    </td>
                                </tr>
                                @endif
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                    <div class="col-12" style="width: 90%; margin-left: 5%;">
                        <label class="form-label" for="example-select">Observações:</label>
                        <p>{{$chamada->observacoes}}</p>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Modal -->
    <div class="modal fade" id="modalEliminar1" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Foto</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="card" style="width: 100%;">
                        <img class="card-img-top" src="{{ $chamada->foto1 }}" alt="Card image cap">
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Modal -->
    <div class="modal fade" id="modalEliminar2" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Foto</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="card" style="width: 100%;">
                        <img class="card-img-top" src="{{ $chamada->foto2 }}" alt="Card image cap">
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endforeach

    {{-- Pra quem não tem permissão de visualizar essa página aparecerá a mensagem abaixo --}}
    @else

    <center>
        <br>
        <div class="alert alert-danger" role="alert">
            Você não tem permissão pra visualizar essa página!
        </div>
    </center>

    @endcan

</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.9.3/html2pdf.bundle.min.js"></script>
<script>
    document.getElementById('printPDF').addEventListener('click', function() {
        // Altera o estilo da div "corpo"
        const corpo = document.querySelector('.corpo');
        corpo.style.width = '100%';
        corpo.style.marginTop = '10px';

        // Oculta o botão de impressão
        const printButton = document.getElementById('printPDF');
        printButton.style.display = 'none';

        const options = {
            margin: 0, // Removendo margens para ocupar a largura total
            filename: 'chamadas_mensal.pdf',
            image: {
                type: 'jpeg',
                quality: 0.98
            },
            html2canvas: {
                scale: 2
            },
            jsPDF: {
                unit: 'in',
                format: 'a4',
                orientation: 'portrait'
            } // ou 'landscape' se preferir
        };

        // Gera o PDF e, em seguida, reverte o estilo
        html2pdf().from(corpo).set(options).save().then(() => {
            corpo.style.width = '';
            corpo.style.marginLeft = '';
        });
    });
</script>


<script>
    document.getElementById('imprimirRelatorio').addEventListener('click', function(e) {
        e.preventDefault();

        let data = {
            turma_id: '{{ $request->input('turma_id') }}',
            mes: '{{ $request->input('mes') }}',
            funcionario_id: '{{ $request->input('funcionario_id') }}',
            projeto_id: '{{ $request->input('projeto_id') }}',
            juntar_turmas: '{{ $request->input('juntar_turmas') }}',
            sexo: '{{ $request->input('sexo') }}',
            cor: '{{ $request->input('cor') }}',
            possui_irmaos: '{{ $request->input('possui_irmaos') }}',
            ex_beneficiario: '{{ $request->input('ex_beneficiario') }}',
            aluno_autorizado_sair: '{{ $request->input('aluno_autorizado_sair') }}',
            autorizacao_imagem: '{{ $request->input('autorizacao_imagem') }}',
            data_inicial: '{{ $request->input('data_inicial') }}',
            data_final: '{{ $request->input('data_final') }}',
            faixa_etaria_de: '{{ $request->input('faixa_etaria_de') }}',
            faixa_etaria_ate: '{{ $request->input('faixa_etaria_ate') }}',
            ano: '{{ $request->input('ano') }}',
            _token: '{{ csrf_token() }}'
        };

        fetch('{{ route('imprimir_relatorio_chamadas_mensal') }}', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'X-CSRF-TOKEN': data._token
            },
            body: JSON.stringify(data)
        })
        .then(response => response.json())

        // Exibe o toast message imediatamente após o clique
        toastr.info('Seu relatório está sendo gerado. Você será notificado quando estiver pronto para download.');
        // alert('Seu relatório está sendo gerado. Você será notificado quando estiver pronto para download.');

        // Redireciona após 2 segundos
        setTimeout(function() {
            window.location.href = '{{ route('reports.index') }}'; // Certifique-se de que 'reports.index' corresponde à rota 'meus-relatorios'
        }, 3000);

    });
</script>


@endsection