<?php
require_once("../../config/conexion.php");
require_once("../../models/Permisos.php");
require_once("../../models/Biometrico.php");
$permiso = new Permisos();
$resultado = $permiso->Permisos_por_Perfil("BIOMETRICO", $_SESSION["perfil"]);
foreach ($resultado as $row) {
    $crear = $row["crear"];
    $estado = $row["estado"];
    $actualizar = $row["actualizar"];
    $eliminar = $row["eliminar"];
    $contacto = $row["contacto"];
    $leer = $row["leer"];
}
if (isset($_SESSION["usuariodbk"])) {
    ?>
    <!DOCTYPE html>
    <html lang="es">
        <head>
            <?php
            require_once '../html/MainHead.php';
            ?>
            <title>SIED | BIOMETRICO REPORTERIA</title>
            <script src="https://unpkg.com/jspdf@latest/dist/jspdf.umd.min.js"></script>
            <script src="https://unpkg.com/jspdf-autotable@3.5.28/dist/jspdf.plugin.autotable.js"></script>
            <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
            <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2-bootstrap-theme/0.1.0-beta.10/select2-bootstrap.min.css" integrity="sha512-kq3FES+RuuGoBW3a9R2ELYKRywUEQv0wvPTItv3DSGqjpbNtGWVdvT8qwdKkqvPzT93jp8tSF4+oN4IeTEIlQA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
            <link href="https://cdn.jsdelivr.net/npm/gridjs/dist/theme/mermaid.min.css" rel="stylesheet" />
            
        </head>
        <body class="hold-transition sidebar-mini layout-fixed">           
            <?php require_once '../html/MainMenu.php'; ?> 
            <?php require_once '../html/MainHeader.php'; ?>             
            <div class="content-wrapper ">
                <div class="content-header">
                    <div class="container-fluid">
                        <div class="row mb-2">
                            <div class="col-sm-6">
                                <h1 class="m-0">BIOMETRICO REPORTERIA</h1>
                            </div>
                            <div class="col-sm-6">
                                <ol class="breadcrumb float-sm-right">
                                    <li class="breadcrumb-item"><a href="../UsuHome/">Inicio</a></li>
                                    <li class="breadcrumb-item active">Biometrico Reporteria</li>
                                </ol>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="br-pagebody mg-t-5 pd-x-30">
                    <section class="content">
                        <div class="container-fluid">
                            <div class="row row-sm mg-t-20">
                                <div class="col-12">
                                    <div class="card">
                                        <div class="card-header">
                                            <h3 class="card-title">
                                                <i class="fas fa-users"></i>
                                                Biometrico
                                            </h3>
                                        </div>
                                        <div class="card-body responsive">
                                            <div class="row">
                                                <div class="col-md-12">
                                                    <div class="form-group">
                                                        <label for="month">Selecionar el mes:</label>
                                                        <input type="month" id="month" name="month" class="form-control" value="">
                                                    </div>
                                                </div>
                                                <div class="col-md-12">
                                                    <div class="row mt-2">
                                                        <div class="col-md-4">
                                                            <label>Regular <span class="badge badge-success ml-2"><i class="fas fa-check"></i></span></label>
                                                        </div>
                                                        <div class="col-md-4">
                                                            <label>Tardanza <span class="badge badge-warning ml-2"><i class="fas fa-times"></i></span></label>
                                                        </div>
                                                        <div class="col-md-4">
                                                            <label>Salida Anticipada <span class="badge badge-info ml-2"><i class="fas fa-grip-lines"></i></span></label>
                                                        </div>
                                                    </div>
                                                    <h4 class="text-center mb-4 mt-2" id="date-text"></h4>
                                                    <div class="table-responsive">
                                                        <table id="table-calendar" class="table table-bordered">
                                                        </table>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </section>
                </div>
            </div>
            
            <div class="modal fade" data-backdrop="static" data-keyboard="false" id="modal-details">
                <div class="modal-dialog modal-lg" role="document">
                    <div class="modal-content bd-0">
                        <div class="modal-header">
                            <h6 class="modal-title">Detalles de Asistencia</h6>
                            <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="row mb-4">
                                <div class="col-md-3">
                                    <h5 class="text-center">
                                        <span class="badge badge-info">
                                            EI = Entrada Inicial
                                        </span> 
                                    </h5>
                                </div>
                                <div class="col-md-3">
                                    <h5 class="text-center">
                                        <span class="badge badge-info">
                                            SA = Salida de Almuerzo
                                        </span>
                                    </h5>
                                </div>
                                <div class="col-md-3">
                                    <h5 class="text-center">
                                        <span class="badge badge-info">
                                            EA = Entrada de Almuerzo
                                        </span>
                                    </h5>
                                </div>
                                <div class="col-md-3">
                                    <h5 class="text-center">
                                        <span class="badge badge-info">
                                            SF = Salida Final
                                        </span>
                                    </h5>
                                </div>
                            </div>
                            
                            <div class="row">
                                <div class="col-md-6">
                                    <h4 class="mb-4 mt-2 float-left" id="date-details"></h4>
                                </div>
                                <div class="col-md-6">
                                    <button class="btn btn-sm btn-primary float-right" id="download-pdf">
                                        <i class="fas fa-file-download mr-2"></i> Generar PDF
                                    </button>
                                </div>
                            </div>
                            
                            <div class="table-responsive">
                                <table class="table table-bordered" id="table-user">
                                    <thead>
                                        <tr>
                                            <th>Nombre</th>
                                            <th>Apellido</th>
                                            <th>Fecha</th>
                                        </tr>
                                    </thead>      

                                    <tbody>
                                        <tr>
                                            <td id="name"></td>
                                            <td id="lastname"></td>
                                            <td id="date"></td>
                                        </tr>
                                    </tbody>
                                </table>
                                <table class="table table-bordered" id="instructions">
                                    <tbody>
                                        <tr>
                                            <td><b>EI</b> </td>
                                            <td>Entrada Inicial</td>
                                        </tr>
                                        <tr>
                                            <td><b>SA</b></td>
                                            <td>Salida de Almuerzo</td>
                                        </tr>
                                        <tr>
                                            <td><b>EA</b></td>
                                            <td>Entrada de Almuerzo</td>
                                        </tr>
                                        <tr>
                                            <td><b>SF</b></td>
                                            <td>Salida Final</td>
                                        </tr>
                                    </tbody>
                                </table>
                                <table class="table table-bordered" id="table-details">
                                </table>

                                <table class="table table-bordered" id="table-hours">
                                    <thead>
                                        <th>Atrasos Totales</th>
                                        <th>Salidas Anticipadas Totales</th>
                                        <th>Horas Trabajadas Totales</th> 
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td id="total-late">
                                                
                                            </td>
                                            <td id="total-early">

                                            </td>
                                            <td id="total-hours">   

                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <?php require_once '../html/MainFooter.php'; ?> 
            <aside class="control-sidebar control-sidebar-dark">
            </aside>
            <?php require_once 'mantenimiento.php'; ?>
            <?php require_once 'visualizar.php'; ?>
            
            <?php require_once '../html/MainJS.php'; ?>
            <script type="text/javascript" src="reporteria.js"></script>
            <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.4/moment.min.js" crossorigin="anonymous" referrerpolicy="no-referrer"></script> 
           
        </body>
    </html>
    <?php
} else {
    header("Location:" . Conexion::ruta() . "view/404/");
}
?>