Atenea
/
sgi


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692
							<?php
    require_once("../include/constantes.php");
    require_once("../include/bd_pdo.php");
    require_once("../classes/ValidaSesion.php");
    require_once("../classes/MainMenu.php");

    $menu = 27;
    $submenu = 277;

    //--- Objeto para validar usuario. El id de usuario lo lee desde sesión
    $objSesion = new ValidaSesion($pdo, $submenu, APSA);
    if(!$objSesion->tieneAcceso()){
        $objSesion->terminaSesion();
    }
    $objSesion->validaPeriodoUsuario();//si no tiene periodo manda a main
    
    //Obtiene plan de estudios
    $stmt = $pdo->prepare('Select * from fs_planestudio(:nivel, NULL, NULL, true, NULL, NULL) WHERE "Carrera_esComun" IS NOT true');
    $stmt->bindParam(":nivel", $_SESSION["nivel_id"]);
    if(!$stmt->execute()){
        print_r($stmt->errorInfo());
        $errorDesc = "Ocurrió un error al cargar los planes de estudios";
    }else
        $plan_rs = $stmt->fetchAll();
    $stmt->closeCursor();

    $stmt = null;

    if(count($plan_rs) == 0){
        header("Location: planestudios.php?error=4");
        exit();
    }

    function recorta($texto, $tam){
        $cortado = substr($texto, 0, $tam);
        $pos = strrpos($cortado, " ");
        return substr($cortado, 0, $pos);
    }
?>

<!DOCTYPE html>
<html lang="es" prefix="og: http://ogp.me/ns#">
    <head>
	<title>APSA - Facultad de Ingeniería</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <link rel="icon" type="image/png" href="../img/favicon.png" />
        <link rel="stylesheet" href="../css/bootstrap-ulsa.min.css" type="text/css">
        <link rel="stylesheet" href="../css/indivisa.css" type="text/css">
        <link rel="stylesheet" href="../css/sgi.css?rand=<?php echo rand();?>" type="text/css">
        <link rel="stylesheet" href="../css/fa_all.css" type="text/css">
        <link rel="stylesheet" href="../css/jquery-ui.css" type="text/css">
        <link rel="stylesheet" href="./css/mapacurricular.css" type="text/css">
        <script src="../js/util.js"></script>
    </head>
    <body>
        <div>
            <?php
                function getRGBA_color($hex, $nivel){
                    list($r, $g, $b) = sscanf($hex, "#%02x%02x%02x");
                    $style = "rgba($r,$g, $b,";
                    $a = 1.0;
                    switch($nivel){
                        case 0: $a = 0.15; break;
                        //case 1: $a = 0.32; break;
                        //case 2: $a = 0.48; break;
                        case 3: $a = 0.50; break;
                        //case 4: $a = 0.80; break;
                    }
                    $style .= "$a)";
                    return $style;
                }

                //--- Objeto que pinta menu
                $menuObj = new MainMenu($_SESSION["usuario_id"], $menu, $pdo, APSA, "Atributos de egreso por plan");//usr, menu, pdo, sist
                $menuObj->printMenu();
                
                //Obtiene materias y sus planes
                
                if(isset($_POST["plan"]) && is_numeric($_POST["plan"])){
                    $filter_plan = filter_input(INPUT_POST, "plan", FILTER_SANITIZE_NUMBER_INT);//limpia texto

                    //Obtiene atributo
                    $stmt = $pdo->prepare('Select * from fs_atributoegreso(:plan, NULL)');
                    $stmt->bindParam(":plan", $filter_plan);
                    if(!$stmt->execute()){
                        $errorDesc = "Ocurrió un error al cargar los atributos";
                    }else{
                        $atributo_rs = $stmt->fetchAll();
                    }
                    $stmt->closeCursor();

                    //Obtiene niveles de atributos de egreso
                    $stmt = $pdo->prepare('Select * from fs_atributoegreso_nivel(NULL)');
                    if(!$stmt->execute()){
                        //print_r($stmt->errorInfo());
                        $errorDesc = "Ocurrió un error al cargar los atribuos de egreso";
                    }else{
                        $nivel_rs = $stmt->fetchAll();
                    }
                    $stmt->closeCursor();
                    $stmt = null;

                    //Obtiene mapa
                    $stmt = $pdo->prepare('Select * from fs_planestudio_atributoegreso(:plan, :usr)');
                    $stmt->bindParam(":plan", $filter_plan);
                    $stmt->bindParam(":usr", $_SESSION["usuario_id"]);
                    if(!$stmt->execute()){
                        $errorDesc = "Ocurrió un error al cargar los grupos";
                    }else{
                        $materiasplan_rs = $stmt->fetchAll();
                        $materiasArray = array();//Gruarda el RS formateado
                        
                        $id_old=0;
                        $sem_old=0;
                        /*
                        {
                            {sem1
                                {nombre, clave, area, atributos=>{atributo1, atributo2} },
                                {nombre, clave, area},
                            },
                            {sem2
                                {nombre, clave, area},
                                {nombre, clave, area},
                            },
                        }
                        */
                        $i=0;
                        $semestreArr[] = array();
                        foreach($materiasplan_rs as $row){
                            if($id_old != $row["Materia_id"]){
                                if($id_old != 0){
                                    $semestreArr[$i]["atributos"] = $atributoArr;
                                    $i++;
                                }
                                $id_old = $row["Materia_id"];
                                $atributoArr = array();
                            }
                            if($sem_old != $row["Materia_semestre"]){//cambio de semestre
                                if($sem_old != 0){
                                    $materiasArray[] = array("semestre"=> $sem_old, "materias"=>$semestreArr);
                                }
                                $sem_old = $row["Materia_semestre"];
                                $semestreArr = array();//reiniciar para unevo semestre
                            }
                            //Si tiene atributo lo guarda
                            $semestreArr[$i] = array("id"=>$row["Materia_id"], "nombre" => $row["Materia_desc"], "clave" => $row["Materia_clave"], "area"=>$row["Area_desc"], "editable"=>$row["Editable"], "atributos"=>array());
                            if(!empty($row["AtributoEgreso_id"])){
                                $atributoArr[] = array("num"=>$row["AtributoEgreso_id"], "desc"=>$row["AtributoEgreso_desc"],
                                    "nivel"=>$row["AtributoNivel_id"], "nivel_desc"=>$row["AtributoNivel_desc"], "color"=>getRGBA_color($row["AtributoEgresoGeneral_color"], $row["AtributoNivel_id"]));
                            }
                        }
                        if($id_old != 0){
                            $semestreArr[$i]["atributos"] = $atributoArr;
                        }
                        if($sem_old != 0){
                            $materiasArray[] = array("semestre"=> $sem_old, "materias"=>$semestreArr);
                        }
                        
                    }
                    $stmt->closeCursor();
                }
                
                
                //--Manejo de errores y mensajes de exito
                if(isset($_GET["error"]) && is_numeric($_GET["error"])){
                    switch ($_GET["error"]){
                        case 0: $errorDesc = "No se reciberon los datos del grupo."; break;
                        case 1: $errorDesc = "Ocurrió un error al insertar los datos del grupo."; break;
                        case 2: $errorDesc = "Ocurrió un error al actualizar los datos del grupo."; break;
                        case 3: $errorDesc = "No tienes permisos para realizar esa acción."; break;
                        case 4: $errorDesc = "Ocurrió un error al cargar los datos grupos."; break;
                        case 5: $errorDesc = "No existen grupos para el periodo. Primero debes crear grupos en esta sección."; break;
                        case 6: $errorDesc = "El grupo que buscas no existe. Consulta la lista de grupos disponibles en esta sección."; break;
                    }
                }
                if(isset($_GET["ok"]) && is_numeric($_GET["ok"])){
                    switch ($_GET["ok"]){
                        case 0: $successDesc = "Los atributos se guardaron correctamente."; break;
                        case 1: $successDesc = "Los atributo se actualizaron correctamente."; break;
                    }
                }
            ?>
            <div class="container-fluid pt-4 marco">
                
                <?php include_once("../include/errorMessage.php");?>
                
                <?php
                if(isset($plan_rs)){
                ?>
                <!-- Filtro -->
                <div class="row">
                    <div class="col-12">
                        <form action="atributosegreso_plan.php" method="post">
                            <div class="form-box form-box-info">
                                <div class="form-group row">
                                    <label for="filter_plan" class="col-4 col-form-label">Plan de estudios</label> 
                                    <div class="col-8 col-sm-6">
                                        <div class="datalist datalist-select mb-1 w-100">
                                            <div class="datalist-input">Selecciona un plan</div>
                                            <span class="ing-buscar icono"></span>
                                            <ul style="display:none">
                                                <li data-id="">Selecciona un plan</li>
                                                <?php foreach($plan_rs as $plan) {?>
                                                <li data-id="<?php echo $plan["PlanEstudio_id"];?>" <?php if(isset($filter_plan) && $filter_plan == $plan["PlanEstudio_id"]){echo "class='selected'";}?> ><?php echo $plan["Carrera_desc"]." - ".$plan["PlanEstudio_desc"];?></li>
                                                <?php }?>
                                            </ul>
                                            <input type="hidden" id="filter_plan" name="plan" value="">
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group row">
                                <div class="col-12 text-center">
                                    <button type="submit" class="btn btn-outline-primary"><?php echo $ICO["buscar"]; ?> Consultar</button>
                                </div>
                            </div>
                         </form>
                    </div>
                </div>
            </div>
            <main  class="container-fluid content">
                <?php if(empty($materiasplan_rs) || count($materiasplan_rs)==0){ ?>
                <h3 class="text-center text-warning"><?php echo $ICO["alerta"];?> Selecciona un plan de estudios</h3>
                <?php } else {?>
                
                <div class="row mb-4 bg-info">
                    <div class="col-sm-9">
                        <div class="row">
                            <div class="col-12">
                                <p class="alert-heading py-2">
                                    <a class="d-block collapsed" data-toggle="collapse" href="#avanzadoBox" role="button" aria-expanded="false" aria-controls="collapseExample">
                                    <strong class="mx-4">Atributos de egreso</strong><i class="ing-caret ing-fw"></i></a>
                                </p>
                            </div>
                            <div class="col-12 collapse px-5" id="avanzadoBox">
                                <div class="row">
                                <?php
                                foreach($atributo_rs as $atributo){
                                    echo '<div class="col-sm-6"><span class="mr-5 text-80">';
                                    echo '<span class="badge mr-2 nivel5" style="color:#fff; background-color:'.$atributo["AtributoEgresoGeneral_color"].'"> Atributo '.$atributo["AtributoEgreso_id"].'</span>';
                                    echo $atributo["AtributoEgreso_desc"]."</span></div>";
                                }
                                ?>
                                </div>
                                <div class="row mt-3">
                                    <div class="col-12">
                                        <hr/>
                                        <p class="mb-1"><strong>Niveles</strong></p>
                                        <ul class="list-inline atributo-list text-80">
                                            <li class="list-inline-item mr-3">Los niveles de cumplimiento se indican a través de la intensidad del color: </li>
                                            <?php foreach($nivel_rs as $nivel){ ?>
                                            <li class="list-inline-item">
                                                <span class="badge nivel<?php echo $nivel["AtributoNivel_id"];?>" style="background-color:<?php echo getRGBA_color("#001D68", $nivel["AtributoNivel_id"]);?>"><?php echo "Nivel ".$nivel["AtributoNivel_desc"];?></span>
                                            </li>
                                            <?php } ?>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-sm-3 pt-2">
                        <select id="filter_atributo" class="form-control">
                            <option value="0">Mostrar todos los atributos</option>
                            <?php foreach($atributo_rs as $atributo) {?>
                            <option value="<?php echo $atributo["AtributoEgreso_id"];?>">Mostrar solo atributo <?php echo $atributo["AtributoEgreso_id"];?></option>
                            <?php }?>
                        </select>
                    </div>
                </div>

                <div class="row ">
                    <div class="col-12">
                        
                        <div class="d-flex align-items-start" style="overflow-x: auto;">
                            <?php
                            foreach($materiasArray as $semestre){
                                ?>
                            
                            <div class="d-flex flex-column flex-mismo-ancho">
                                <div class="d-flex flex-mismo-ancho semestre">
                                    <p class="text-center font-weight-bold text-primary text-uppercase w-100"><span class="text-danger"><?php echo $semestre["semestre"]; ?>.</span> semestre</p>
                                </div>
                                <?php foreach($semestre["materias"] as $materia){
                                    $clase = "";
                                    if(!empty($materia["atributos"]) && count($materia["atributos"])>0){
                                        foreach($materia["atributos"] as $atr){
                                            $clase.= "atr-".$atr["num"]." ";
                                        }
                                    }else{
                                        $clase = "sin-atributos";
                                    }
                                ?>
                                <div class="d-flex flex-mismo-ancho bloque-materia <?php echo $clase;?>" id="mat<?php echo $materia["id"]; ?>">
                                    <div class="menu-wrapper w-100">
                                        <p class="materia-titulo"><?php echo $materia["nombre"];?></p>
                                        <p class="mb-2"><b>Clave:</b> <?php echo $materia["clave"];?><br>
                                        <b>Área:</b> <?php echo $materia["area"];?></p>
                                    
                                        
                                        <ul class="list-inline atributo-list">
                                        <?php if(!empty($materia["atributos"]) && count($materia["atributos"])>0){?>
                                            <?php foreach($materia["atributos"] as $atr){ ?>
                                            <li class="list-inline-item">
                                                <span class="badge nivel<?php echo $atr["nivel"];?>" style="background-color:<?php echo $atr["color"];?>" data-toggle="tooltip" data-placement="top" data-html="true" title="<b>Atributo <?php echo $atr["num"];?></b><br><?php echo $atr["nivel_desc"];?>">AE <?php echo $atr["num"];?></span>
                                            </li>
                                            <?php } ?>
                                        <?php } ?>
                                        </ul>
                                                                                
                                        <div class="menu-flotante d-none" data-id="<?php echo $materia["id"]; ?>">
                                            <span class="float-right iconos">
                                                <span class="ing-buscar ing-fw bloque-ver mx-1" aria-hidden="true" title="Ver detalle"></span>
                                                <?php if($materia["editable"] || $_SESSION["sgi_administrador"]){?>
                                                <span class="ing-editar ing-fw bloque-edita mx-1" aria-hidden="true" title="Editar atributos"></span>
                                                <?php } ?>
                                            </span>
                                        </div>
                                        
                                    </div>
                                </div>
                                <?php }//termina materias ?>
                            </div>
                            <?php }//termina semestres ?>
                        </div>
                        
                    </div>
                </div>
                
                <?php } 
                }?>
            </div>
            
            <!--- FOOTER--->
            <?php require_once("../include/footer.php"); ?>
            
            <?php if($objSesion->puedeEditar()){ ?>
            <!-- Modal -->
            <div class="modal fade" id="modalVer" tabindex="-1" role="dialog" aria-labelledby="modalVer" aria-hidden="true">
                <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h4 class="col-12 modal-title text-center"><span id="modalLabel">Detalles de Materia</span>
                            <button type="button" class="close text-white" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button></h4>
                        </div>
                        <div class="modal-body pb-0">
                            <div class="row">
                                <div class="col-4"><p><strong>Clave:</strong> <span class="mat-clave"></span></p></div>
                                <div class="col-4 text-center"><p><strong>Semestre:</strong> <span class="mat-sem"></span></p></div>
                            </div>
                            <div class="row bg-info pt-3">
                                <div class="col-4"><p><strong>Área:</strong> <span class="mat-area"></span></p></div>
                                <div class="col-4 text-center"><p><strong>Horas de clase:</strong> <span class="mat-horasclase"></span></p></div>
                            </div>

                            <div class="row pt-3" id="mat-atributos-block">
                                <div class="col-4 text-center barra-right"><p><strong>Atributos de egreso:</strong></div>
                                <div class="col-8 text-left" id="mat-atributos"></div>
                            </div>
                            
                            <!-- <div class="row">
                                <div class="col-6 mt-4" id="relacionadas-block">
                                    <p><strong>Materias relacionadas:</strong></p>
                                    <ul class="relacionada m-0"></ul>
                                </div>
                                <div class="col-6 mt-4" id="submaterias-block">
                                    <p><strong><span class="mat-tipo"></span></strong></p>
                                    <ul class="submateria m-0"></ul>
                                </div>
                            </div> -->
                            
                            <div class="bg-primary text-white pt-2 px-4 mt-4" style="margin-left: -16px; margin-right: -16px;">
                                <div class="row">
                                    <div class="col text-right ">
                                        <h5 class="mat-plan"></h5>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="modal" aria-hidden="true">
                <div class="modal-dialog modal-dialog-centered" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h4 class="col-12 modal-title text-center">Editar Atributos
                            <button type="button" class="close text-white" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button></h4>
                        </div>
                        <div class="modal-body">
                            <form action="" method="post" id="formaModal">
                                <input type="hidden" name="mat_id" id="mat_id">
                                <div class="row">
                                    <div class="col-12">
                                        <table class="table table-sm table-borderless">
                                            <thead class="table-dark">
                                                <tr>
                                                    <th style="width:60%">Atributo</th>
                                                    <th style="width:30%">Nivel</th>
                                                    <th>&nbsp;</th>
                                                </tr>
                                            </thead>
                                            <tbody id="atributo-list">
                                                <tr>
                                                    <td>
                                                        <select name="atributo[]" class="form-control form-control-sm atributo_select">
                                                            <option value="0">- Sin atributo -</option>
                                                            <?php foreach($atributo_rs as $atributo){?>
                                                            <option value="<?php echo $atributo["AtributoEgreso_id"];?>"><?php echo $atributo["AtributoEgreso_id"]."- ".recorta($atributo["AtributoEgreso_desc"], 50);?>...</option>
                                                            <?php } ?>
                                                        </select>
                                                    </td>
                                                    <td>
                                                        <select name="nivel[]" class="form-control form-control-sm nivel_select">
                                                            <?php foreach($nivel_rs as $nivel){?>
                                                            <option value="<?php echo $nivel["AtributoNivel_id"];?>"><?php echo $nivel["AtributoNivel_desc"];?></option>
                                                            <?php } ?>
                                                        </select>
                                                    </td>
                                                    <td class="text-center"><button type="button" class="btn btn-sm btn-outline-danger borra-atributo" title="Quitar atributo"><?php echo $ICO["borrar2"];?></button></td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>  
                                </div>
                                <div class="row mb-5">
                                    <div class="col-6 pl-4">
                                        <button type="button" class="btn btn-outline-primary btn-block" id="agrega-atributo"><?php echo $ICO["mas"];?> Agregar atributo</button>
                                    </div>
                                </div>

                                <div class="form-group row">
                                    <div class="offset-4 col-8">
                                        <button type="button" class="btn btn-outline-primary" id="submitBtn" data-tipo="1"><?php echo $ICO["aceptar"];?> Guardar</button>
                                        <button type="reset" class="btn btn-outline-danger" data-dismiss="modal"><?php echo $ICO["cancelar"];?> Cancelar</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
            
            <div class="modal fade" id="modal_confirm" tabindex="-1" role="dialog" aria-labelledby="modal" aria-hidden="true">
                <div class="modal-dialog modal-dialog-centered" role="document">
                    <div class="modal-content">
                        <div class="modal-body">
                            <div class="row">
                                <div class="col">
                                    <p class="font-weight-bold">¿Estás seguro de que quieres borrar el grupo?</p>
                                    <p>Esta acción no se puede deshacer.</p>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <input type="hidden" id="id_borrar" value="">
                            <button type="button" class="btn btn-outline-primary btn-borrar"><?php echo $ICO["aceptar"];?> Borrar</button>
                            <button type="button" class="btn btn-outline-danger" data-dismiss="modal" aria-label="Close"><?php echo $ICO["cancelar"];?> Cancelar</button>
                        </div>
                    </div>
                </div>
            </div>
            <?php } ?>
        </div>
        
        <script src="../js/jquery.min.js"></script>
        <script src="../js/jquery-ui.js"></script>
        <script src="../js/datepicker-es.js"></script>
        <script src="../js/bootstrap/popper.min.js"></script>
        <script src="../js/bootstrap/bootstrap.min.js"></script>
        <script src="../js/fechas.js"></script>
        <script src="../js/sidebarmenu.js"></script>
        <script src="../js/datalist.js"></script>
        <script>
            $(function () {
                $('[data-toggle="tooltip"]').tooltip()
            })
        </script>
        <?php if($objSesion->puedeEditar() && isset($filter_plan)){ ?>
        <script>
            $(document).on( "mouseenter", ".menu-wrapper", function(){
                $(this).find('.menu-flotante').removeClass('d-none');
            });
            $(document).on( "mouseleave", ".menu-wrapper", function(){
                $(this).find('.menu-flotante').addClass('d-none');
            });

            $(document).on( "click", ".bloque-edita", function(event){
                var cid= $(this).parents(".menu-flotante").data("id");
                $("#mat_id").val(cid);
                $.ajax({
                    url:  './action/atributomateria_select.php',
                    type: 'POST', 
                    dataType: 'json',
                    data: { mat: cid },
                    success: function(result) {
                        if(result["error"]!= "" && result["error"] !== undefined){
                            $("#errorBox").collapse('show');
                            $("#errorBox_text").html(result["error"]);
                            $('#messageBox')[0].scrollIntoView({ block: "end" });
                        }else{
                            while($('#atributo-list tr').length > 1){
                                $("#atributo-list tr:last-child").remove();
                            }
                            if(result["atributoArr"].length > 0){
                                for(var i=0; i<result["atributoArr"].length; i++){
                                    var cloned;
                                    if(i==0){
                                        cloned = $("#atributo-list tr:first-child");
                                    }else{
                                        cloned = $("#atributo-list tr:first-child").clone(true).appendTo("#atributo-list");
                                    }
                                    cloned.find(".atributo_select").val(result["atributoArr"][i]["id"]);
                                    cloned.find(".nivel_select").val(result["atributoArr"][i]["nivel"]);
                                }
                            }else{
                                $("#atributo-list .atributo_select").get(0).selectedIndex = 0;
                                $("#atributo-list .nivel_select").get(0).selectedIndex = 0;
                            }
                            hideBorraAtributo();
                            
                            $('#modal').modal('show');
                        }
                    },
                    error: function(jqXHR, textStatus, errorThrown ){
                        $("#modal").modal('hide');
                        $("#errorBox").collapse('show');
                        $("#errorBox_text").html(errorThrown);
                        $('#messageBox')[0].scrollIntoView({ block: "end" });
                    }
                });//ajax
                $('#modal').modal('show');
            });

            $(document).on( "click", ".bloque-ver", function(event){
                var cid = $(this).parents(".menu-flotante").data("id");
                $.ajax({
                    url:  './action/materia_select.php',
                    type: 'POST', 
                    dataType: 'json',
                    data: { id: cid },
                    success: function(result) {
                        if(result["error"]!= "" && result["error"] !== undefined){
                            $("#errorBox").collapse('show');
                            $("#errorBox_text").html(result["error"]);
                            $('#messageBox')[0].scrollIntoView({ block: "end" });
                        }else{
                            $("#modalVer").find("#modalLabel").html(result["desc"]);
                            $("#modalVer").find(".mat-area").html(result["area"]);
                            $("#modalVer").find(".mat-plan").html(result["plan"]);
                            $("#modalVer").find(".mat-clave").html(result["clave"]);
                            
                            $("#modalVer").find(".mat-sem").html(result["sem"]);
                            $("#modalVer").find(".mat-horasclase").html(result["horas_clase"]);
                            //$("#modal").find(".mat-horaslab").html(result["horas_lab"]);
                            
                            if(result["total_atributos"] > 0){
                                $("#mat-atributos-block").removeClass("d-none");
                                var html = "";
                                for(var i=0; i < result["atributosArr"].length; i++){
                                    html+="<p><span class='badge text-white' style='background-color:"+result["atributosArr"][i]["color"]+"'>Atributo "+result["atributosArr"][i]["num"]+"</span> <i>"+result["atributosArr"][i]["nivel"]+"</i><br> <small>"+result["atributosArr"][i]["desc"]+"</small></p>";
                                }

                                $("#mat-atributos").html(html);
                            }else{
                                $("#mat-atributos-block").addClass("d-none");
                                $("#mat-atributos").html("");
                            }
                            $('#modalVer').modal('show');
                        }
                    },
                    error: function(jqXHR, textStatus, errorThrown ){
                        $("#modal").modal('hide');
                        $("#errorBox").collapse('show');
                        $("#errorBox_text").html(errorThrown);
                        $('#messageBox')[0].scrollIntoView({ block: "end" });
                    }
                });//ajax
            });

            function hideBorraAtributo(){
                var total = $("#atributo-list >tr").length;//cuenta renglones actuales
                if(total == 1){
                    $('.borra-atributo').hide();
                }else{
                    $('.borra-atributo').show();
                }
            }

            function atributoHTML(num, desc, nivel, color){
                return '<li class="list-inline-item"> \
                            <span class="badge nivel'+nivel+'" style="background-color:'+color+'" data-toggle="tooltip" data-placement="top" data-html="true" title="<b>Atributo '+num+'</b><br>'+desc+'">AE '+num+'</span> \
                        </li>';
            }
            
            $(document).ready(function(){
                setDatalistFirst("#plan");
                $("#filter_atributo option:first-child").prop("selected", true);
                hideBorraAtributo();

                $("#filter_atributo").change(function(){
                    var id_ver = $(this).val();
                    if(id_ver == 0){
                        $(".bloque-materia").removeClass("oculto");
                    }else{
                        $(".bloque-materia").addClass("oculto");
                        $(".atr-"+id_ver).removeClass("oculto");
                    }
                    

                });

                $("#agrega-atributo").click(function(){
                    var cloned = $("#atributo-list >tr:first-child").clone(true).appendTo("#atributo-list");
                    cloned.find('select').get(0).selectedIndex = 0;
                    hideBorraAtributo();
                });
                
                $(".borra-atributo").click(function(){//quita profesor
                    $(this).parents("tr").remove();
                    hideBorraAtributo();
                });
                
                $("#submitBtn").click(function(){
                    //Valida que no estén repetidos
                    var atributosArr=[];
                    var atributosObj = [];
                    var error = false;
                    $('#atributo-list tr .is-invalid').removeClass("is-invalid");

                    $.each($('#atributo-list tr .atributo_select'), function(){
                        if(atributosArr.includes($(this).val())){
                            $(this).addClass("is-invalid");
                            error = true;
                        }else{
                            atributosArr.push($(this).val());
                        }
                    });

                    if(!error){

                        $.each($('#atributo-list tr'), function(){
                            atributosObj.push({"id":$(this).find(".atributo_select").val(), "nivel":$(this).find(".nivel_select").val(),});
                        });

                        //Actualiza en BD
                        $.ajax({
                            url:  './action/atributomateria_update.php',
                            type: 'POST', 
                            dataType: 'json',
                            data: { "plan": <?php echo $filter_plan;?>, "mat": $("#mat_id").val(), "atributos": atributosObj },
                            success: function(result) {
                                if(result["error"]!= "" && result["error"] !== undefined){
                                    $("#errorBox").collapse('show');
                                    $("#errorBox_text").html(result["error"]);
                                    $('#messageBox')[0].scrollIntoView({ block: "end" });
                                }else{
                                    
                                    //Quita atributos
                                    var lista = $("#mat"+$("#mat_id").val()+" .atributo-list");
                                    lista.html("");
                                    
                                    if(result["atributosArr"].length > 0){
                                        for(var i=0; i < result["atributosArr"].length; i++){
                                            lista.append(atributoHTML(result["atributosArr"][i]["id"], result["atributosArr"][i]["desc"], result["atributosArr"][i]["nivel"], result["atributosArr"][i]["color"]));
                                        }
                                    }
                                }
                                $('#modal').modal('hide');
                            },
                            error: function(jqXHR, textStatus, errorThrown ){
                                $("#modal").modal('hide');
                                $("#errorBox").collapse('show');
                                $("#errorBox_text").html(errorThrown);
                                $('#messageBox')[0].scrollIntoView({ block: "end" });
                                $('#modal').modal('hide');
                            }
                        });//ajax
                    }
                });
                
            });
        </script>
        <?php } ?>
    </body>
</html>