<%@page contentType="text/html" pageEncoding="UTF-8"%> <%@ include file="validar.jsp" %> <!DOCTYPE html> <html lang="es"> <head> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <meta charset="utf-8" /> <title>:::SISTEMA DE HORARIOS:::</title> <meta name="description" content="overview & stats" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" /> <link href="css/display.css" rel="stylesheet" type="text/css"/> <link rel="stylesheet" href="../assets/css/bootstrap.css" /> <link rel="stylesheet" href="../assets/css/font-awesome.css" /> <link rel="stylesheet" href="../assets/css/jquery-ui.css" /> <link rel="stylesheet" href="../assets/css/ace-fonts.css" /> <link rel="stylesheet" href="../assets/css/ace.css" class="ace-main-stylesheet" id="main-ace-style" /> <script src="../assets/js/ace-extra.js"></script> <!-- inline scripts related to this page --> <script type="text/javascript" language="javascript"> /*$(document).ready( function() { jQuery("#registroEncuesta").validationEngine(); });*/ </script> </head> <body class="no-skin" onLoad="cargar();"> <!-- #section:basics/navbar.layout --> <div id="navbar" class="navbar navbar-default"> <script type="text/javascript"> try { ace.settings.check('navbar', 'fixed') } catch (e) { } </script> <div class="navbar-container" id="navbar-container"> <%@ include file="banner.jsp" %> </div><!-- /.navbar-container --> <p id="lblUsuario"><%=usuario!=null?usuario.getUsuarioUsuario():""%></p> </div> <!-- /section:basics/navbar.layout --> <div class="main-container" id="main-container"> <script type="text/javascript"> try { ace.settings.check('main-container', 'fixed') } catch (e) { } </script> <!-- #section:basics/sidebar --> <div id="sidebar" class="sidebar responsive"> <script type="text/javascript"> try { ace.settings.check('sidebar', 'fixed')} catch (e) { } </script> <input id="codModulo" type="hidden" value="<%=menu!=null?menu.getCodModulo():""%>"> <input id="codCategoria" type="hidden" value="<%=menu!=null?menu.getCodCategoria():""%>"> <%@ include file="menu.jsp" %> <!-- #section:basics/sidebar.layout.minimize --> <div class="sidebar-toggle sidebar-collapse" id="sidebar-collapse"> <i class="ace-icon fa fa-angle-double-left" data-icon1="ace-icon fa fa-angle-double-left" data-icon2="ace-icon fa fa-angle-double-right"></i> </div> <!-- /section:basics/sidebar.layout.minimize --> <script type="text/javascript"> try { ace.settings.check('sidebar', 'collapsed')} catch (e) { } </script> </div> <!-- /section:basics/sidebar --> <div class="main-content"> <div class="main-content-inner"> <!-- #section:basics/content.breadcrumbs --> <div class="breadcrumbs" id="breadcrumbs"> <script type="text/javascript"> try { ace.settings.check('breadcrumbs', 'fixed') } catch (e) { } </script> <ul class="breadcrumb"> <li> <i class="ace-icon fa fa-home home-icon"></i> <a href="principal.jsp">INICIO</a> </li> <li class="active">ASIGNACIÓN</li> </ul><!-- /.breadcrumb --> </div> <!-- /section:basics/content.breadcrumbs --> <div class="page-content"> <div class="page-header"> <h1> Asignación <small> <i class="ace-icon fa fa-angle-double-right"></i> Docente al Área </small> </h1> </div><!-- /.page-header --> <div class="row"> <!-- ----------- CONTENEDOR DE FORMULARIOS--------INI----- --> <div class="col-sm-12" style="width:100%;"> <div class="col-sm-4"></div> <div class="col-sm-4"> <div class="widget-box widget-color-blue"> <div class="widget-header"> <h4 class="widget-title">Búsqueda de Docentes</h4> </div> <div class="widget-body"> <div class="widget-main no-padding"> <form id="registroEncuesta" method="post"> <fieldset> <label>Ingrese Apellidos del Docente <span style='color:red;'>*</span></label> <div> <input type="text" id="txt_bus_doc" size="80" class='form-control validate[required ,custom[onlyLetterSp]]' onChange="conMayusculas(this);" onkeypress="enter(event);" > </div> </fieldset> <div class="form-actions center"> <button class="btn btn-sm btn-info" type="button" onclick="validar_busqueda();"> <i class="ace-icon fa fa-search icon-on-right bigger-110"></i> Buscar </button> </div> </form> </div> </div> </div> </div> <div class="col-sm-4"></div> </div> <div class="col-sm-12" style="width:100%; height: 40px;"></div> <div class="col-sm-12" style="width:100%;"> <div class="col-sm-1" ></div> <div class="col-sm-10"> <!-- -------------TABLA---INI------------ --> <form id="listarDocenteArea" method="post"> <div style='display: none;' id='divDocente'></div> </form> <!-- -------------TABLA---FIN------------ --> </div> <div class="col-sm-1"></div> </div> <!-- ----------- CONTENEDOR DE FORMULARIOS--------FIN----- --> <!-- ::::::::::-ALERTAS-::::::::::::::: --> <input type="hidden" id="ape"> <input id='pagina' type='hidden'> <div id="dialog-noti1" class="hide"> <br> Se actualizó con éxito. <br><br> </div> <div id="dialog-confor1" class="hide"> <br> ¿Ésta seguro de asignar estas áreas al Docente? <br><br> </div> <div id="dialog-confor2" class="hide"> <br> ¿Desea quitar el área asignada al Docente? <br><br> </div> <div id="dialog-advertencia1" class="hide"> <br> Debe seleccionar al menos un área para realizar la asignación. <br><br> </div> <div id="dialog-advertencia2" class="hide"> <br> No se pude desvincular del área al docente, debido a que está asignado a un horario. <br><br> </div> <div id="dialog-Alerta2" class="hide"> <br> Ocurrió un error en el registro. <br><br> </div> <div id="dialog-edit" class="hide"> <br> <form id="RegistroDatos" method="post"> <div class="sttxt2" id="divRegistroDatos"></div> </form> <br><br> </div> <div id="dialog-cargando" class="hide"> <table cellpadding="0" cellspacing="0" width="100%"> <tr><td align="center"><img src="imagenes/cargando.gif" border=0></td></tr> </table> </div> <!-- ::::::::::-ALERTAS-::::::::::::::: --> </div><!-- /.row --> </div><!-- /.page-content --> </div> </div><!-- /.main-content --> <div class="footer"> <%@ include file="footer.jsp" %> </div> <a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse"> <i class="ace-icon fa fa-angle-double-up icon-only bigger-110"></i> </a> </div><!-- /.main-container --> <!-- basic scripts --> <!--[if !IE]> --> <script type="text/javascript"> window.jQuery || document.write("<script src='../assets/js/jquery.js'>" + "<" + "/script>"); </script> <!-- <![endif]--> <!--[if IE]> <script type="text/javascript"> window.jQuery || document.write("<script src='../assets/js/jquery1x.js'>"+"<"+"/script>"); </script> <![endif]--> <script type="text/javascript"> if ('ontouchstart' in document.documentElement) document.write("<script src='../assets/js/jquery.mobile.custom.js'>" + "<" + "/script>"); </script> <script src="../assets/js/bootstrap.js"></script> <!-- page specific plugin scripts --> <script src="../assets/js/jquery-ui.js"></script> <script src="../assets/js/jquery.ui.touch-punch.js"></script> <!--[if lte IE 8]> <script src="../assets/js/excanvas.js"></script> <![endif]--> <script src="../assets/js/jquery-ui.custom.js"></script> <script src="../assets/js/jquery.ui.touch-punch.js"></script> <script src="../assets/js/jquery.easypiechart.js"></script> <script src="../assets/js/jquery.sparkline.js"></script> <script src="../assets/js/flot/jquery.flot.js"></script> <script src="../assets/js/flot/jquery.flot.pie.js"></script> <script src="../assets/js/flot/jquery.flot.resize.js"></script> <!-- ace scripts --> <script src="../assets/js/ace/elements.scroller.js"></script> <script src="../assets/js/ace/elements.colorpicker.js"></script> <script src="../assets/js/ace/elements.fileinput.js"></script> <script src="../assets/js/ace/elements.typeahead.js"></script> <script src="../assets/js/ace/elements.wysiwyg.js"></script> <script src="../assets/js/ace/elements.spinner.js"></script> <script src="../assets/js/ace/elements.treeview.js"></script> <script src="../assets/js/ace/elements.wizard.js"></script> <script src="../assets/js/ace/elements.aside.js"></script> <script src="../assets/js/ace/ace.js"></script> <script src="../assets/js/ace/ace.ajax-content.js"></script> <script src="../assets/js/ace/ace.touch-drag.js"></script> <script src="../assets/js/ace/ace.sidebar.js"></script> <script src="../assets/js/ace/ace.sidebar-scroll-1.js"></script> <script src="../assets/js/ace/ace.submenu-hover.js"></script> <script src="../assets/js/ace/ace.widget-box.js"></script> <script src="../assets/js/ace/ace.settings.js"></script> <script src="../assets/js/ace/ace.settings-rtl.js"></script> <script src="../assets/js/ace/ace.settings-skin.js"></script> <script src="../assets/js/ace/ace.widget-on-reload.js"></script> <script src="../assets/js/ace/ace.searchbox-autocomplete.js"></script> <script src="../assets/js/ace/ace.searchbox-autocomplete.js"></script> <link rel="stylesheet" href="css/validationEngine.jquery.css" type="text/css"/> <!--<link rel="stylesheet" href="css/template.css" type="text/css"/>--> <!-- inline scripts related to this page --> <script type="text/javascript"> jQuery(function ($) { //override dialog's title function to allow for HTML titles $.widget("ui.dialog", $.extend({}, $.ui.dialog.prototype, { _title: function (title) { var $title = this.options.title || ' ' if (("title_html" in this.options) && this.options.title_html == true) title.html($title); else title.text($title); } })); $("#id-btn-dialog2").on('click', function (e) {//-- e.preventDefault(); $("#dialog-confirm").removeClass('hide').dialog({ resizable: false, modal: true, title: "<div class='widget-header'><h4 class='smaller'><i class='ace-icon fa fa-exclamation-triangle red'></i> Empty the recycle bin?</h4></div>", title_html: true, buttons: [ { html: "<i class='ace-icon fa fa-trash-o bigger-110'></i> Delete all items", "class": "btn btn-danger btn-xs", click: function () { $(this).dialog("close"); } } , { html: "<i class='ace-icon fa fa-times bigger-110'></i> Cancel", "class": "btn btn-xs", click: function () { $(this).dialog("close"); } } ] }); }); $('.easy-pie-chart.percentage').each(function () { var $box = $(this).closest('.infobox'); var barColor = $(this).data('color') || (!$box.hasClass('infobox-dark') ? $box.css('color') : 'rgba(255,255,255,0.95)'); var trackColor = barColor == 'rgba(255,255,255,0.95)' ? 'rgba(255,255,255,0.25)' : '#E2E2E2'; var size = parseInt($(this).data('size')) || 50; $(this).easyPieChart({ barColor: barColor, trackColor: trackColor, scaleColor: false, lineCap: 'butt', lineWidth: parseInt(size / 10), animate: /msie\s*(8|7|6)/.test(navigator.userAgent.toLowerCase()) ? false : 1000, size: size }); }) $('.sparkline').each(function () { var $box = $(this).closest('.infobox'); var barColor = !$box.hasClass('infobox-dark') ? $box.css('color') : '#FFF'; $(this).sparkline('html', { tagValuesAttribute: 'data-values', type: 'bar', barColor: barColor, chartRangeMin: $(this).data('min') || 0 }); }); //flot chart resize plugin, somehow manipulates default browser resize event to optimize it! //but sometimes it brings up errors with normal resize event handlers $.resize.throttleWindow = false; var placeholder = $('#piechart-placeholder').css({'width': '90%', 'min-height': '150px'}); var data = [ {label: "social networks", data: 38.7, color: "#68BC31"}, {label: "search engines", data: 24.5, color: "#2091CF"}, {label: "ad campaigns", data: 8.2, color: "#AF4E96"}, {label: "direct traffic", data: 18.6, color: "#DA5430"}, {label: "other", data: 10, color: "#FEE074"} ] function drawPieChart(placeholder, data, position) { $.plot(placeholder, data, { series: { pie: { show: true, tilt: 0.8, highlight: { opacity: 0.25 }, stroke: { color: '#fff', width: 2 }, startAngle: 2 } }, legend: { show: true, position: position || "ne", labelBoxBorderColor: null, margin: [-30, 15] } , grid: { hoverable: true, clickable: true } }) } drawPieChart(placeholder, data); /** we saved the drawing function and the data to redraw with different position later when switching to RTL mode dynamically so that's not needed actually. */ placeholder.data('chart', data); placeholder.data('draw', drawPieChart); //pie chart tooltip example var $tooltip = $("<div class='tooltip top in'><div class='tooltip-inner'></div></div>").hide().appendTo('body'); var previousPoint = null; placeholder.on('plothover', function (event, pos, item) { if (item) { if (previousPoint != item.seriesIndex) { previousPoint = item.seriesIndex; var tip = item.series['label'] + " : " + item.series['percent'] + '%'; $tooltip.show().children(0).text(tip); } $tooltip.css({top: pos.pageY + 10, left: pos.pageX + 10}); } else { $tooltip.hide(); previousPoint = null; } }); ///////////////////////////////////// $(document).one('ajaxloadstart.page', function (e) { $tooltip.remove(); }); var d1 = []; for (var i = 0; i < Math.PI * 2; i += 0.5) { d1.push([i, Math.sin(i)]); } var d2 = []; for (var i = 0; i < Math.PI * 2; i += 0.5) { d2.push([i, Math.cos(i)]); } var d3 = []; for (var i = 0; i < Math.PI * 2; i += 0.2) { d3.push([i, Math.tan(i)]); } var sales_charts = $('#sales-charts').css({'width': '100%', 'height': '220px'}); $.plot("#sales-charts", [ {label: "Domains", data: d1}, {label: "Hosting", data: d2}, {label: "Services", data: d3} ], { hoverable: true, shadowSize: 0, series: { lines: {show: true}, points: {show: true} }, xaxis: { tickLength: 0 }, yaxis: { ticks: 10, min: -2, max: 2, tickDecimals: 3 }, grid: { backgroundColor: {colors: ["#fff", "#fff"]}, borderWidth: 1, borderColor: '#555' } }); $('#recent-box [data-rel="tooltip"]').tooltip({placement: tooltip_placement}); function tooltip_placement(context, source) { var $source = $(source); var $parent = $source.closest('.tab-content') var off1 = $parent.offset(); var w1 = $parent.width(); var off2 = $source.offset(); //var w2 = $source.width(); if (parseInt(off2.left) < parseInt(off1.left) + parseInt(w1 / 2)) return 'right'; return 'left'; } $('.dialogs,.comments').ace_scroll({ size: 300 }); //Android's default browser somehow is confused when tapping on label which will lead to dragging the task //so disable dragging when clicking on label var agent = navigator.userAgent.toLowerCase(); if ("ontouchstart" in document && /applewebkit/.test(agent) && /android/.test(agent)) $('#tasks').on('touchstart', function (e) { var li = $(e.target).closest('#tasks li'); if (li.length == 0) return; var label = li.find('label.inline').get(0); if (label == e.target || $.contains(label, e.target)) e.stopImmediatePropagation(); }); $('#tasks').sortable({ opacity: 0.8, revert: true, forceHelperSize: true, placeholder: 'draggable-placeholder', forcePlaceholderSize: true, tolerance: 'pointer', stop: function (event, ui) { //just for Chrome!!!! so that dropdowns on items don't appear below other items after being moved $(ui.item).css('z-index', 'auto'); } } ); $('#tasks').disableSelection(); $('#tasks input:checkbox').removeAttr('checked').on('click', function () { if (this.checked) $(this).closest('li').addClass('selected'); else $(this).closest('li').removeClass('selected'); }); //show the dropdowns on top or bottom depending on window height and menu position $('#task-tab .dropdown-hover').on('mouseenter', function (e) { var offset = $(this).offset(); var $w = $(window) if (offset.top > $w.scrollTop() + $w.innerHeight() - 100) $(this).addClass('dropup'); else $(this).removeClass('dropup'); }); }); //:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: $(document).ready(function () { jQuery("#registroEncuesta").validationEngine(); }); function conMayuscula(field) { field.value = field.value.toUpperCase(); } function cargando() { $("#dialog-cargando").removeClass('hide').dialog({ resizable: false, modal: true, title: "<div class='widget-header' ><h4 class='smaller'><i class='fa fa-spinner'></i> Cargando...</h4></div>", title_html: true }); } function close_carga() { $("#dialog-cargando").dialog("close"); } function validar_busqueda() { var estado = $('#registroEncuesta').validationEngine('validate'); if (estado) { //si esta vacio var pagina = 1; buscarDocente(pagina); } else { $("#divDocente").fadeOut(); $("#txt_bus_doc").val(""); } } function buscarDocente(pagina) { let name='' var accion = ""; var cantidad = 15; var apellidoDocente = $("#txt_bus_doc").val(); $.ajax({ type: 'POST', url: '../ServletDocente?Accion=buscarDocenteSecundaria', data: 'accion=' + accion + '&apellidoDocente=' + apellidoDocente + '&cantidad=' + cantidad + '&pagina=' + pagina, beforeSend: function () { cargando(); }, success: function (resultado) { close_carga(); $("#divDocente").html(resultado); name=$("#lblUsuario").text(); if(name === "mgalvan" || name === "jramirez" || name === "fsalinas" || name === "wchancaf" || name === "rpinas" || name === "mpadilla"){ $("#divDocente #btnAsignar").hide(); } }, complete: function () { $("#divDocente").fadeIn(); $("#pagina").val(pagina); } }); } function validar_asignar() { var estado = jQuery('#listarDocenteArea').validationEngine('validate'); if (estado) { asignar(); } } function asignar() { var cantidad = $('#cantidad').val(); var codAreas = $('#codAreas').val(); var codigosA = codAreas.split("#"); var res = ""; var resp = ""; for (var i = 1; i <= cantidad; i++) { for (var j = 0; j < codigosA.length; j++) { resp = $("input[name='" + codigosA[j] + "_docente_" + i + "']:checked").val(); if (resp != "" && resp != undefined) { if (res == "") { res += resp; } else { res += "#" + resp; } } resp = ""; } } if (res == "") { alerta1(); } else { alerta2(res); } } function alerta1() { $("#dialog-advertencia1").removeClass('hide').dialog({ resizable: false, width: 400, modal: true, title: "<div class='widget-color-orange' ><div class='widget-header white' ><h4 class='smaller' ><i class='ace-icon fa fa-exclamation-triangle white'></i> <span class='white'>Advertencia</span></h4></div></div>", title_html: true, buttons: [ { html: "<i class='ace-icon fa fa-times bigger-110'></i> ACEPTAR", "class": "btn btn-warning btn-xs", click: function () { $(this).dialog("close"); } } ] }); } function alerta2(res) { $("#dialog-confor1").removeClass('hide').dialog({ resizable: false, modal: true, title: "<div class='widget-color-blue' ><div class='widget-header white' ><h4 class='smaller' ><i class='ace-icon fa fa-check-circle white'></i> <span class='white'>Conformidad</span></h4></div></div>", title_html: true, buttons: [ { html: "<i class='ace-icon fa fa-check bigger-110'></i> SI", "class": "btn btn-primary btn-xs", click: function () { asignado(res); } }, { html: "<i class='ace-icon fa fa-times bigger-110'></i> NO", "class": "btn btn-danger btn-xs", click: function () { $(this).dialog("close"); } } ] }); } function asignado(res) { $.ajax({ type: 'POST', url: '../ServletDocente?Accion=registrarAreaDocente', data: 'res=' + res, success: function (resultado) { $("#formulario_cargando").dialog("close"); }, complete: function () { alerta3(); var pagina = $("#pagina").val(); buscarDocente(pagina); } }); } function alerta3() { $("#dialog-confor1").dialog("close"); $("#dialog-noti1").removeClass('hide').dialog({ resizable: false, modal: true, title: "<div class='widget-color-green' ><div class='widget-header white' ><h4 class='smaller' ><i class='ace-icon fa fa-tags white'></i> <span class='white'>Notificación</span></h4></div></div>", title_html: true, buttons: [ { html: "<i class='ace-icon fa fa-check bigger-110'></i> ACEPTAR", "class": "btn btn-success btn-xs", click: function () { $(this).dialog("close"); } } ] }); } function verificarCruces(codigoArea, codigoDocente, dato, cont) { $.ajax({ type: 'POST', url: '../ServletDocente?Accion=verificarCruces', data: 'codigoArea=' + codigoArea + '&codigoDocente=' + codigoDocente, success: function (resultado) { ; if (resultado > 0) { alerta4(); } else { alerta5(codigoArea, codigoDocente, dato, cont); } }, complete: function () { } }); } function alerta4() { $("#dialog-advertencia2").removeClass('hide').dialog({ resizable: false, width: 400, modal: true, title: "<div class='widget-color-orange' ><div class='widget-header white' ><h4 class='smaller' ><i class='ace-icon fa fa-exclamation-triangle white'></i> <span class='white'>Advertencia</span></h4></div></div>", title_html: true, buttons: [ { html: "<i class='ace-icon fa fa-times bigger-110'></i> ACEPTAR", "class": "btn btn-warning btn-xs", click: function () { $(this).dialog("close"); } } ] }); } function alerta5(codigoArea, codigoDocente, dato, cont) { $("#dialog-confor2").removeClass('hide').dialog({ resizable: false, modal: true, title: "<div class='widget-color-blue' ><div class='widget-header white' ><h4 class='smaller' ><i class='ace-icon fa fa-check-circle white'></i> <span class='white'>Conformidad</span></h4></div></div>", title_html: true, buttons: [ { html: "<i class='ace-icon fa fa-check bigger-110'></i> SI", "class": "btn btn-primary btn-xs", click: function () { $(this).dialog("close"); quitarAreaSeleccion(codigoArea, codigoDocente, dato, cont); } }, { html: "<i class='ace-icon fa fa-times bigger-110'></i> NO", "class": "btn btn-danger btn-xs", click: function () { $(this).dialog("close"); } } ] }); } function quitarAreaSeleccion(codigoArea, codigoDocente, dato, cont) { $.ajax({ type: 'POST', url: '../ServletDocente?Accion=quitarAreaDocente', data: 'codigoArea=' + codigoArea + '&codigoDocente=' + codigoDocente, success: function (resultado) { $("#formulario_cargando").dialog("close"); }, complete: function () { $("#div_" + codigoArea + "_" + codigoDocente + "").html("<input type='checkbox' name='" + dato + "_docente_" + cont + "' value='" + codigoArea + "_" + codigoDocente + "' />"); } }); } //------------------------------- function conMayusculas(field) { field.value = field.value.toUpperCase() } function segundaCarga() { //listarArea(); } function enter(e) { tecla = (document.all) ? e.keyCode : e.which; if (tecla == 13) validar_busqueda(); } $('input').keypress(function (e) { if (e.which == 13) { return false; } }); </script> <!-- the following scripts are used in demo only for onpage help and you don't need them --> <link rel="stylesheet" href="../assets/css/ace.onpage-help.css" /> <link rel="stylesheet" href="../docs/assets/js/themes/sunburst.css" /> <script type="text/javascript"> ace.vars['base'] = '..';</script> <script src="../assets/js/ace/elements.onpage-help.js"></script> <script src="../assets/js/ace/ace.onpage-help.js"></script> <script src="../docs/assets/js/rainbow.js"></script> <script src="../docs/assets/js/language/generic.js"></script> <script src="../docs/assets/js/language/html.js"></script> <script src="../docs/assets/js/language/css.js"></script> <script src="../docs/assets/js/language/javascript.js"></script> <script src="js/languages/jquery.validationEngine-es.js" type="text/javascript" charset="utf-8"></script> <script src="js/jquery.validationEngine.js" type="text/javascript" charset="utf-8"></script> </html>