111 lines
4.4 KiB
PHP
111 lines
4.4 KiB
PHP
<?php
|
|
include_once "import/html_forms.php";
|
|
?>
|
|
|
|
<link rel="stylesheet" href="css/clockpicker.css">
|
|
<form id="justificar">
|
|
<div class="form-box">
|
|
<div class="col-md-6 col-sm-12 text-center mb-3">
|
|
Selecciona la fecha que deseas justificar.
|
|
</div>
|
|
<div class="form-group row">
|
|
<label for="filter_fecha" class="col-4 col-form-label">Fecha *</label>
|
|
<div class="col-6 ">
|
|
<input id="filter_fecha" name="fecha" type="text" class="form-control date-picker" placeholder="dd/mm/aaaa" maxlength="10" required="required" readonly>
|
|
<div class="invalid-feedback">No es una fecha válida.</div>
|
|
</div>
|
|
</div>
|
|
<!-- Hora inicio CLOCKPICKER -->
|
|
<div class="form-group row">
|
|
<label for="filter_hora_inicio" class="col-4 col-form-label">Hora estimada *</label>
|
|
<div class="input-group clockpicker col-6 ">
|
|
<input id="filter_hora_inicio" name="hora_inicio" type="text" class="form-control" placeholder="hh:mm" maxlength="5" required="required" readonly>
|
|
<div class="input-group-append">
|
|
<span class="input-group-text" onclick="$('#filter_hora_inicio').focus();">
|
|
<i class="ing-reloj"></i>
|
|
</span>
|
|
</div>
|
|
<div class="invalid-feedback">No es una hora válida.</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- Hora fin -->
|
|
<div class="form-group row">
|
|
<label for="filter_hora_fin" class="col-4 col-form-label">Hora límite</label>
|
|
<div class="input-group clockpicker col-6">
|
|
<input id="filter_hora_fin" name="hora_fin" type="text" class="form-control" placeholder="hh:mm" maxlength="5" readonly>
|
|
<div class="input-group-append">
|
|
<span class="input-group-text" onclick="$('#filter_hora_fin').focus();">
|
|
<i class="ing-reloj"></i>
|
|
</span>
|
|
</div>
|
|
<div class="invalid-feedback">No es una hora válida.</div>
|
|
</div>
|
|
</div>
|
|
<!-- ClaveULSA -->
|
|
<div class="form-group row">
|
|
<label for="filter_clave" class="col-4 col-form-label">Clave</label>
|
|
<div class="col-6">
|
|
<input id="filter_clave" name="clave" type="text" class="form-control" pattern="(do)?[0-9]{3,6}" placeholder="Clave del profesor (do)" maxlength="8" title="Clave del profesor (do)">
|
|
<div class="invalid-feedback">No es una clave válida.</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Nombre -->
|
|
<div class="form-group row">
|
|
<label for="filter_nombre" class="col-4 col-form-label">Nombre</label>
|
|
<div class="col-6">
|
|
<input id="filter_nombre" name="nombre" type="text" class="form-control" placeholder="Nombre del profesor" maxlength="50" title="Nombre del profesor">
|
|
<div class="invalid-feedback">No es un nombre válido.</div>
|
|
</div>
|
|
</div>
|
|
<!-- button center -->
|
|
<div class="form-group row justify-content-center p-3">
|
|
<button class="btn btn-primary mr-3" id="main-button" type="button">
|
|
<?= $ICO['buscar'] ?>
|
|
Buscar profesores
|
|
</button>
|
|
<!-- reload page -->
|
|
<button type="button" class="btn btn-outline-danger" onclick="location.reload();">
|
|
<span class="ing-borrar icono"></span>
|
|
Limpiar
|
|
</button>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</form>
|
|
|
|
<script src="js/clockpicker.js"></script>
|
|
<script>
|
|
$(".date-picker").datepicker($.datepicker.regional["es"]);
|
|
$(".date-picker").datepicker({
|
|
dateFormat: "dd/mm/yyyy",
|
|
changeMonth: true,
|
|
});
|
|
|
|
$('.clockpicker').clockpicker({
|
|
placement: 'bottom',
|
|
align: 'right',
|
|
donetext: 'Aceptar',
|
|
autoclose: true,
|
|
'default': 'now',
|
|
|
|
afterShow: function() {
|
|
$('.clockpicker-minutes').find('.clockpicker-tick').filter(function() {
|
|
return $(this).text() % 5 !== 0;
|
|
}).remove();
|
|
|
|
$('.clockpicker-hours').find('.clockpicker-tick').filter(function(index, element) {
|
|
let num = parseInt($(element).text());
|
|
let condition = num < 7 || num > 22;
|
|
return condition;
|
|
}).remove();
|
|
}
|
|
|
|
});
|
|
// only accept from 7:00 to 22:00
|
|
|
|
|
|
</script>
|