123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279 |
- <?php
- session_start();
- require_once 'classes/MainMenu.php';
- require_once './classes/SGI.php';
- require_once 'classes/Template.php';
- require_once 'include/bd_pdo.php';
- ?>
- <!DOCTYPE html>
- <html>
- <head>
- <title>Alumnos - Home</title>
- <?php if ($_SESSION['RolUsuario_desc'] == 'ALUMNO')
- Template::getCSS(array('custominputfile.css','elementos.css','secciones/home.css'));
- else
- Template::getCSS(); ?>
- </head>
- <body>
- <?php $menuObj = new MainMenu($_SESSION["RolUsuario_id"], 0, 0, $pdo);
- $menuObj->printMenu();
- if ($_SESSION['RolUsuario_desc'] == 'ALUMNO') {?>
- <main class="container-fluid marco">
- <div class="bg-main d-flex flex-column p-3">
- <div class="d-flex flex-row justify-content-center align-items-center">
- <div class="position-relative foto">
- <img id="foto" />
- <div class="divIconsFoto position-absolute d-flex flex-row justify-content-around align-items-center">
- <div class="iconFoto d-flex justify-content-center align-items-center" data-toggle="modal" data-target="#modalFoto"><i class="ing-camara"></i></div>
- <div id="limpiaFoto" class="iconFoto d-flex justify-content-center align-items-center"><i class="ing-borrar"></i></div>
- </div>
- </div>
- </div>
- <div class="acercaTit display-7 px-3 py-2 mt-4 mb-2 ml-n3">Acerca de mi</div>
- <div id="txtAcerca" placeholder="Escribe tu reseña aquí"></div>
- <div class="d-flex justify-content-end align-items-center mt-3">
- <span class="ing-editar iconAcciones text-azul2 btnCirc" data-tipo="2"></span>
- <div class="btns">
- <span class="ing-aceptar iconAcciones text-success" data-tipo="2"></span>
- <span class="ing-cancelar iconAcciones text-danger" data-tipo="2"></span>
- </div>
- </div>
- <div class="flex-grow-1 d-flex flex-column justify-content-end align-items-center">
- <div class="align-self-end">
- <span class="ing-mas iconAcciones text-success" data-toggle="modal" data-target="#modalAddRedes"></span>
- <span class="ing-menos iconAcciones text-danger" data-tipo="3"></span>
- </div>
- <div id="divRedes" class="d-flex flex-row justify-content-around align-items-start flex-wrap"></div>
- </div>
- </div>
- <div class="datos p-3">
- <div id="estatus" class="indivisa-text-bold-italic text-secondary display-6"></div>
- <div id="completo">
- <label class="indivisa-text-black text-primary display-4"></label>
- <input type="hidden" id="msg" />
- <i id="validacion" class="ing-importante2 display-6 align-top text-azul1 pointer invisible" data-trigger="click hover" data-html="true" data-toggle="tooltip" data-placement="top" title=" "></i>
- </div>
- <div class="d-flex flex-column justify-content-start align-items-center">
- <input id="nombre" type="text" class="indivisa-text-black text-primary display-4 mb-1" value="" disabled="true">
- <input id="apellidos" type="text" class="indivisa-text-black text-primary display-4 mb-2" value="" disabled="true">
- </div>
- <div class="d-flex flex-column flex-sm-row justify-content-between align-items-center">
- <div class="d-flex justify-content-start align-items-center display-7"><span class="text-azul2 mr-1">CURP:</span><input id="curp" type="text" value="" maxlength="18" disabled /></div>
- <div class="d-flex justify-content-around align-items-center align-self-end">
- <span class="ing-editar iconAcciones text-azul2" data-tipo="1"></span>
- <div class="btns mt-2 mt-sm-0">
- <span class="ing-aceptar iconAcciones text-success" data-tipo="1"></span>
- <span class="ing-cancelar iconAcciones text-danger" data-tipo="1"></span>
- </div>
- </div>
- </div>
- <section id="carreras" class="mt-4 px-3 px-md-5"></section>
- </div>
- <div class="intereses d-flex flex-column p-3">
- <div class="d-flex flex-row justify-content-end align-items-center bordeInf mb-0 pb-2">
- <h4 class="text-center flex-grow-1">Mis Intereses</h4>
- <div id="accionIntereses">
- <span class="ing-mas iconAcciones text-success" data-toggle="modal" data-target="#modalInteres"></span>
- <span class="ing-menos iconAcciones text-danger" data-tipo="4"></span>
- </div>
- <div id="eliminaIntereses">
- <span class="ing-aceptar iconAcciones text-success" data-tipo="4"></span>
- <span class="ing-cancelar iconAcciones text-danger" data-tipo="4"></span>
- </div>
- </div>
- <div class="container-fluid flex-grow-1">
- <div class="row h-100 container mx-0 px-0">
- <div class="col-sm-12 p-3 bordeInfInteres">
- <h6 class="mb-0 py-2">Profesionales</h6>
- <ul id="profesionales" class="row"></ul>
- </div>
- <div class="col-sm-12 p-3">
- <h6 class="mb-0 py-2">Personales</h6>
- <ul id="personales" class="row"></ul>
- </div>
- </div>
- </div>
- </div>
- </main>
- <!----- MODALS ----->
- <div class="modalGral modal fade" id="modalFoto" tabindex="-1" data-backdrop="static" aria-labelledby="modalConfirmar" aria-hidden="true">
- <div class="modal-dialog modal-dialog-centered">
- <form id="formFoto" class="modal-content" method="post" enctype="multipart/form-data">
- <div class="modal-header d-flex flex-column">
- <h5 class="modal-title w-100 text-center mb-2">Cambia tu foto</h5>
- <div class="display-7 text-secondary">Considera subir una foto de frente (no selfie), medio tronco hacia arriba, con fondo blanco y vestimenta formal.<br />Esta foto podrá ser utilizada para documentos de la facultad por lo que es importante cumplir con las recomendaciones.</div>
- </div>
- <div class="modal-body">
- <div id="divArchivo" class="w-100 d-flex flex-column">
- <div class="carga text-azul2 mb-3">
- <div class="d-flex flex-column justify-content-center align-items-center">
- <div class="display-6 text-azul2">Cargando foto</div>
- <div>
- <div class="mb-2 fa-solid fa-gear fa-spin" style="color: var(--azul2);"></div>
- <div class="mb-2 fa-solid fa-gear fa-spin fa-rotate-by fa-spin" style="--fa-rotate-angle: 45deg; color: var(--azul2-75);"></div>
- <div class="mb-2 fa-solid fa-gear fa-spin" style="color: var(--azul2-50);"></div>
- <div class="mb-2 fa-solid fa-gear fa-spin fa-rotate-by fa-spin" style="--fa-rotate-angle: 45deg; color: var(--azul2-25);"></div>
- <div class="mb-2 fa-solid fa-gear fa-spin" style="color: var(--azul1-25);"></div>
- <div class="mb-2 fa-solid fa-gear fa-spin fa-rotate-by fa-spin" style="--fa-rotate-angle: 45deg; color: var(--azul1-50);"></div>
- <div class="mb-2 fa-solid fa-gear fa-spin" style="color: var(--azul1-75);"></div>
- <div class="mb-2 fa-solid fa-gear fa-spin fa-rotate-by fa-spin" style="--fa-rotate-angle: 45deg; color: var(--azul1);"></div>
- </div>
- </div>
- </div>
- <input id="addArchivo" name="archivo" type="file">
- </div>
- </div>
- <div class="modal-footer">
- <button type="button" id="btnOkFoto" data-dato="0" class="btn btn-verde btnIcon"><span class="ing-aceptar"></span></button>
- <button type="button" class="btn btn-rojo btnIcon" data-dismiss="modal"><span class="ing-cancelar"></span></button>
- </div>
- </form>
- </div>
- </div>
- <div class="modalGral modal fade" id="modalInteres" tabindex="-1" data-backdrop="static" aria-labelledby="modalInteres" aria-hidden="true">
- <div class="modal-dialog modal-dialog-centered">
- <div class="modal-content">
- <div class="modal-header d-flex flex-column">
- <h5 class="modal-title w-100 text-center mb-2">Agrega un interés</h5>
- <div class="display-7 text-secondary text-justify">Los intereses permiten compartirte información de la facultad o la universidad referente a los mismos.</div>
- </div>
- <div class="modal-body">
- <label class="lblTit">Tipo de Interés</label>
- <div id="ddlInteres" data-id="-1" class="dropdownlist mb-3">
- <button id="btnInteres"><label>Elige el tipo de interés</label><span class="ing-caret"></span></button>
- <ul>
- <li class="dropdownlist-item" data-id="0">Personal</li>
- <li class="dropdownlist-item" data-id="1">Profesional</li>
- </ul>
- </div>
- <label class="lblTit">Interés</label>
- <input id="inputInteres" type="text" placeholder="Escribe tu interés">
- </div>
- <div class="modal-footer">
- <button type="button" class="btn btn-verde btnIcon" id="btnOkAddInteres"><span class="ing-aceptar"></span></button>
- <button type="button" class="btn btn-rojo btnIcon" data-dismiss="modal"><span class="ing-cancelar"></span></button>
- </div>
- </div>
- </div>
- </div>
- <div class="modalGral modal fade" id="modalAddRedes" tabindex="-1" data-backdrop="static" aria-labelledby="modalAddRedes" aria-hidden="true">
- <div class="modal-dialog modal-dialog-centered">
- <div class="modal-content">
- <div class="modal-header">
- <h5 class="modal-title">Agrega una Red o Dato de Contacto</h5>
- </div>
- <div class="modal-body">
- <label class="lblTit">Dato de contacto | Red</label>
- <div id="dlRed" class="position-relative datalist mb-3" data-id="-1" data-subtipo="-1">
- <input id="inputRed" class="datalist-input" type="text" placeholder="Escribe aquí el dato o red que buscas" autocomplete="off">
- <span id="iconRed" class="text-primary input-buscar"></span>
- <ul style="display:none">
- <?php $redes = SGI::getRedes($pdo);
- if (count($redes) > 0){
- array_push($redes, array('TipoContacto_id' => 0, 'TipoContacto_desc' => 'Contacto de Emergencia', 'TipoContacto_icono' => 'fa-solid fa-book-medical', 'SubtipoContacto' => false));
- $temp = array();
- $key = array_search(0, array_column($redes, 'TipoContacto_id'));
- $temp = $redes[$key];
- unset($redes[$key]);
- array_unshift($redes, $temp);
- $key = array_search(2, array_column($redes, 'TipoContacto_id'));
- $temp = $redes[$key];
- unset($redes[$key]);
- array_unshift($redes, $temp);
- $key = array_search(3, array_column($redes, 'TipoContacto_id'));
- $temp = $redes[$key];
- unset($redes[$key]);
- array_unshift($redes, $temp);
- $key = array_search(1, array_column($redes, 'TipoContacto_id'));
- $temp = $redes[$key];
- unset($redes[$key]);
- array_unshift($redes, $temp);
- }
- if (isset($redes)) {
- foreach ($redes as $red) { ?>
- <li data-id="<?php echo $red['TipoContacto_id']; ?>" data-subtipo="<?php echo intval($red['SubtipoContacto']); ?>"><i class="<?php echo $red['TipoContacto_icono']; ?> mr-1"></i><label><?php echo $red['TipoContacto_desc']; ?></label></li>
- <?php }
- } ?>
- </ul>
- </div>
- <label id="titNomEmergencia" class="lblTit emergencia">Nombre Contacto de Emergencia</label>
- <input id="inputNomEmergencia" type="text" class="emergencia mb-3" placeholder="Escribe el nombre de la persona que será contacto de emergencia">
- <label id="titDato" class="lblTit dato"></label>
- <input id="inputDato" type="text" class="dato mb-3">
- <label id="titSubTipo" class="lblTit subtipo"></label>
- <div id="ddlSubTipo" data-id="0" class="dropdownlist subtipo mb-3">
- <button id="btnSubTipo"><label></label><span class="ing-caret"></span></button>
- <ul></ul>
- </div>
- <label id="titUsoRed" class="lblTit uso"></label>
- <div id="ddlUsoRed" data-id="0" class="dropdownlist uso">
- <button id="btnUsoRed"><label>Elige el tipo de uso</label><span class="ing-caret"></span></button>
- <ul>
- <li class="dropdownlist-item" data-id="2">Empresarial</li>
- <li class="dropdownlist-item" data-id="1">Personal</li>
- </ul>
- </div>
- </div>
- <div class="modal-footer">
- <button type="button" class="btn btn-verde btnIcon" id="btnOkAddRedes"><span class="ing-aceptar"></span></button>
- <button type="button" class="btn btn-rojo btnIcon" data-dismiss="modal"><span class="ing-cancelar"></span></button>
- </div>
- </div>
- </div>
- </div>
- <div class="modalGral modal fade" id="modalSupRedes" tabindex="-1" data-backdrop="static" aria-labelledby="modalSupRedes" aria-hidden="true">
- <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">
- <div class="modal-content">
- <div class="modal-header">
- <h5 class="modal-title">Elimina Red o Dato de Contacto</h5>
- </div>
- <div class="modal-body">
- </div>
- <div class="modal-footer">
- <button type="button" class="btn btn-verde btnIcon" id="btnOkSupRedes"><span class="ing-aceptar"></span></button>
- <button type="button" class="btn btn-rojo btnIcon" data-dismiss="modal"><span class="ing-cancelar"></span></button>
- </div>
- </div>
- </div>
- </div>
- <div class="modal fade" id="modalAviso" tabindex="-1" aria-labelledby="modalAviso" aria-hidden="true">
- <div class="modal-dialog modal-dialog-centered">
- <div class="modal-content msgAviso d-flex flex-row justify-content-between align-items-stretch">
- <div class="modal-header iconAviso d-flex justify-content-center align-items-center"><i class="display-3 "></i></div>
- <div class="modal-body txtAviso flex-grow-1 d-flex flex-column justify-content-center align-items-center">
- <div class="display-5 msg1 indivisa-text-black mb-3">Título</div>
- <div class="mb-3 msg2">Texto del Mensaje</div>
- <div class="rounded-pill p-2 text-white" data-dismiss="modal" aria-label="Close">Cerrar</div>
- </div>
- </div>
- </div>
- </div>
- <div class="modalGral modal fade" id="modalEliminar" tabindex="-1" data-backdrop="static" aria-labelledby="modalEliminar" aria-hidden="true">
- <div class="modal-dialog modal-dialog-centered">
- <div class="modal-content">
- <div class="modal-body text-center display-5"></div>
- <div class="modal-footer">
- <button type="button" class="btn btn-verde btnIcon" id="btnOkEliminar"><span class="ing-aceptar"></span></button>
- <button type="button" class="btn btn-rojo btnIcon" data-dismiss="modal"><span class="ing-cancelar"></span></button>
- </div>
- </div>
- </div>
- </div>
- <?php } else { ?>
- <main class="container-fluid content marco">
- <div class="row justify-content-center" style="min-height: 600px;">
- <img id="errorImg" class="col-sm-3" src="img/nico_error.svg" />
- <div class="col-sm-9 display-4 d-flex flex-row justify-content-center align-items-center text-center">No tienes acceso a ésta página</div>
- </div>
- </main>
- <?php } ?>
- <!-- FOOTER -->
- <div style="isolation: isolate;">
- <?php Template::footer(); ?>
- </div>
- <?php if ($_SESSION['RolUsuario_desc'] == 'ALUMNO')
- Template::getJS(array('custominputfile.js','elementos.js','secciones/home.js'));
- else
- Template::getJS(); ?>
- </body>
- </html>
|