Files
2023-06-22 10:34:18 +02:00

354 lines
13 KiB
XML

<metal:block use-macro="main_template">
<div metal:fill-slot="content">
<div class="container">
<div class="alert alert-warning" tal:condition="message" tal:content="message" />
<div class="row">
<form method="POST" id="frm" action="${url}" class="form-horizontal">
<div class="form-group">
<label class="control-label col-sm-3">Moniteur</label>
<div class="col-sm-3">
<select class="form-control" id="cd_mon" name="cd_mon" onChange="$('#frm').submit()">
<tal:block tal:repeat="moniteurC moniteurs">
<tal:block tal:repeat="item moniteurC">
<option value="${item.CD_MON}" tal:attributes="selected cd_mon==item.CD_MON and 'selected' or None">${item.NOM} - ${item.CD_MON}</option>
</tal:block>
<option tal:condition="moniteurC" disabled>--------------------------------</option>
</tal:block>
</select>
</div>
<div class="col-sm-6">
<a href="${request.application_url}/planifier/${cd_mon}/6mois" tal:condition="layout.isAdmin()"
class="btn btn-success" role="button" >
<span class="glyphicon glyphicon-calendar"></span> Planifier activités de ${cd_mon}</a>
</div>
</div>
</form>
</div>
<br />
<div tal:condition="not isSeulB78">
<div id="calendar"></div>
<br />
<p>
<span class="label" style="background-color:LightGreen; color:black;">Validée</span>
<span class="label" style="background-color:LightBlue; color:black;">Activitée</span>
<span class="label" style="background-color:LightPink; color:black;">Réservation</span>
<span class="label" style="background-color:LightYellow; color:black;">Heure Conduite B</span>
<span class="label" style="background-color:Gold; color:black;">Examen blanc</span>
<span class="label" style="background-color:GoldenRod; color:black;">Avant permis</span>
<span class="label" style="background-color:Plum; color:black;">RDV préalable</span>
<span class="label" style="background-color:YellowGreen; color:black;">RDV pédag 1</span>
<span class="label" style="background-color:LimeGreen; color:black;">RDV pédag 2</span>
<span class="label" style="background-color:DeepSkyBlue; color:black;">1ères heures</span>
<span class="label" style="background-color:DeepPink; color:black;">Absent Retard</span>
</p>
</div>
<br />
<br />
<div tal:condition="cd_mon_B78">
<h1 tal:condition="not isSeulB78">Planning B78 de ${cd_mon_B78} (agence ${agence}) </h1>
<br />
<div id="calendarb78"></div>
<br />
<p>
<span class="label" style="background-color:LightGreen; color:black;">Validée</span>
<span class="label" style="background-color:LightBlue; color:black;">Activitée</span>
<span class="label" style="background-color:LightPink; color:black;">Réservation</span>
<span class="label" style="background-color:LightYellow; color:black;">Heure Conduite B78</span>
<span class="label" style="background-color:Gold; color:black;">Examen blanc</span>
<span class="label" style="background-color:GoldenRod; color:black;">Avant permis</span>
<span class="label" style="background-color:Plum; color:black;">RDV préalable</span>
<span class="label" style="background-color:YellowGreen; color:black;">RDV pédag 1</span>
<span class="label" style="background-color:LimeGreen; color:black;">RDV pédag 2</span>
<span class="label" style="background-color:DeepSkyBlue; color:black;">1ères heures</span>
<span class="label" style="background-color:DeepPink; color:black;">Absent Retard</span>
</p>
</div>
<!-- Modal : Confirmation CREATION -->
<div class="modal fade" id="confirmCreate" role="dialog" aria-labelledby="confirmCreateLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title">Créer un rendez-vous</h4>
</div>
<div class="modal-body">
<!-- The form is placed inside the body of modal -->
<form id="create_rdv-form" class="form-horizontal" action="${url}" method="post"
data-fv-framework="bootstrap"
data-fv-icon-valid="glyphicon glyphicon-ok"
data-fv-icon-invalid="glyphicon glyphicon-remove"
data-fv-icon-validating="glyphicon glyphicon-refresh">
<p>
Voulez-vous créer un rendez-vous pour : <br />
</p>
<div class="col-xs-offset-3 col-xs-9">
<p><b>le <span id=dateheureRDV>date</span> h</b></p>
<p>pour un élève ou une activité</p>
</div>
<div class="form-group" id="form-code">
<label class="col-xs-3 control-label">Nom ou Code</label>
<div class="col-xs-8">
<input type="text" class="form-control" id="name" name="name" placeholder="3 caractères minimum" />
<span id="text-error-message" style="font-size:11px;color:#D9534F;"></span>
</div>
</div>
<input type="hidden" name="dateRDV" id=dateRDV value="date">
<input type="hidden" name="heureRDV" id=heureRDV value="heure">
<input type="hidden" name="cd_mon" id="cd_mon" value="${cd_mon}" >
<div class="form-group">
<label class="control-label col-xs-3">Nb d'heures</label>
<div class="col-xs-6">
<select class="form-control static" name="QTE">
<tal:block tal:repeat="i [x for x in range(1,12)]">
<option tal:attributes="selected str(i)==QTE and 'selected' or None">${i}</option>
</tal:block>
</select>
</div>
</div>
<div class="form-group">
<div class="col-xs-5 col-xs-offset-3">
<button type="submit" id="submitRdv" class="btn btn-danger" name="form.submitted">Créer</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Annuler</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<!-- Modal : Confirmation CREATION -->
<div class="modal fade" id="confirmCreateB78" role="dialog" aria-labelledby="confirmCreateB78Label" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title">Créer un rendez-vous</h4>
</div>
<div class="modal-body">
<!-- The form is placed inside the body of modal -->
<form id="create_rdv-form78" class="form-horizontal" action="${url}" method="post"
data-fv-framework="bootstrap"
data-fv-icon-valid="glyphicon glyphicon-ok"
data-fv-icon-invalid="glyphicon glyphicon-remove"
data-fv-icon-validating="glyphicon glyphicon-refresh">
<p>
Voulez-vous créer un rendez-vous pour : <br />
</p>
<div class="col-xs-offset-3 col-xs-9">
<p><b>le <span id=dateheureRDVB78>date</span> h</b></p>
<p>pour un élève ou une activité</p>
</div>
<div class="form-group" id="form-code">
<label class="col-xs-3 control-label">Nom ou Code</label>
<div class="col-xs-8">
<input type="text" class="form-control" id="name78" name="name" placeholder="3 caractères minimum" />
<span id="text-error-message" style="font-size:11px;color:#D9534F;"></span>
</div>
</div>
<input type="hidden" name="dateRDV" id="dateRDVB78" value="date">
<input type="hidden" name="heureRDV" id="heureRDVB78" value="heure">
<input type="hidden" name="cd_mon_B78" id="cd_mon_B78" value="${cd_mon_B78}" >
<input type="hidden" name="cd_mon" id="cd_mon" value="${cd_mon}" >
<div class="form-group">
<label class="control-label col-xs-3">Nb d'heures</label>
<div class="col-xs-6">
<select class="form-control static" name="QTE">
<tal:block tal:repeat="i [x for x in range(1,12)]">
<option tal:attributes="selected str(i)==QTE and 'selected' or None">${i}</option>
</tal:block>
</select>
</div>
</div>
<div class="form-group">
<div class="col-xs-5 col-xs-offset-3">
<button type="submit" id="submitRdv78" class="btn btn-danger" name="form.submitted">Créer</button>
<button type="button" class="btn btn-default" data-dismiss="modal">Annuler</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<br />
<br />
</div><!-- content -->
<div metal:fill-slot="additional_scripts">
<!-- Bootstrap Fullcalendar plugin -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.9.0/fullcalendar.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar-scheduler/1.9.4/scheduler.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.9.0/locale/fr.js"></script>
<!-- autocomplete plugin -->
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$(document).ready(function() {
var datePlan = '${datePlan}';
$('#calendar').fullCalendar({
schedulerLicenseKey: 'GPL-My-Project-Is-Open-Source',
locale: 'fr',
header: {
left: 'agendaWeek month listWeek',
center: 'prev title next',
right: 'today'
},
allDaySlot: true,
allDayHtml: "Annulés",
defaultView: 'agendaWeek',
defaultDate: moment(datePlan),
slotDuration: '00:60:00',
hiddenDays: [0], // hide sunday
height: 'auto',
minTime: "07:00:00",
maxTime: "21:00:00",
displayEventTime: true,
events:${calendar_events},
eventRender: function(event, element){
element.find('.fc-title').append("<br/>" + event.description);
},
dayClick: function(date, jsEvent, view) {
// alert('Bientôt, la possibilité de créer un rdv pour le ' + date.format());
$('#dateheureRDV').html(moment(date).format('dddd DD MMMM à HH'));
$('#dateRDV').attr('value', moment(date).format('YYYY-MM-DD'));
$('#heureRDV').attr('value', moment(date).format('HH'));
$("#confirmCreate").modal("show");
}
});
$('#calendarb78').fullCalendar({
schedulerLicenseKey: 'GPL-My-Project-Is-Open-Source',
locale: 'fr',
header: {
left: 'agendaWeek month listWeek',
center: 'prev title next',
right: 'today'
},
allDaySlot: true,
allDayHtml: "Annulés",
defaultView: 'agendaWeek',
defaultDate: moment(datePlan),
slotDuration: '00:60:00',
hiddenDays: [0], // hide sunday
height: 'auto',
minTime: "07:00:00",
maxTime: "21:00:00",
displayEventTime: true,
events:${calendar_events_b78},
eventRender: function(event, element){
element.find('.fc-title').append("<br/>" + event.description);
},
dayClick: function(date, jsEvent, view) {
// alert('Bientôt, la possibilité de créer un rdv pour le ' + date.format());
$('#dateheureRDVB78').html(moment(date).format('dddd DD MMMM à HH'));
$('#dateRDVB78').attr('value', moment(date).format('YYYY-MM-DD'));
$('#heureRDVB78').attr('value', moment(date).format('HH'));
$("#confirmCreateB78").modal("show");
}
});
$('#create_rdv-form').formValidation({
framework: 'bootstrap',
excluded: ':disabled',
icon: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
});
$('#name').autocomplete({
source: function (request, response) {
$.ajax({
url:'/ajax_lookup',
dataType: 'json',
data: {
recherche: 'E' + request.term,
},
success: function (data) {
response( data );
},
});
},
minLength: 3,
appendTo: "#confirmCreate"
});
$('#name78').autocomplete({
source: function (request, response) {
$.ajax({
url:'/ajax_lookupb78',
dataType: 'json',
data: {
recherche: 'E' + request.term,
},
success: function (data) {
response( data );
},
});
},
minLength: 3,
appendTo: "#confirmCreateB78"
});
$('#create_rdv-form').submit(function(ev){
var actionurl = ev.currentTarget.action;
console.log(actionurl)
var array_code = $('#name').val().split(' | ');
console.log(array_code);
if(array_code.length == 2){
$('#text-error-message').text('');
return true;
}
else{
$('#form-code').addClass('has-feedback has-error');
$('#submitRdv').addClass('disabled').attr("disabled", true);
$('#text-error-message').text('Code non validé');
ev.preventDefault();
return false;
}
});
$('#name').on('change input',function(){
$('#text-error-message').text('');
$('#form-code').removeClass('has-feedback has-error');
$('#submitRdv').removeClass('disabled').prop("disabled", false);;
});
$('#create_rdv-form78').submit(function(ev){
var actionurl = ev.currentTarget.action;
console.log(actionurl)
var array_code = $('#name78').val().split(' | ');
console.log(array_code);
if(array_code.length == 2){
$('#text-error-message').text('');
return true;
}
else{
$('#form-code').addClass('has-feedback has-error');
$('#submitRdv78').addClass('disabled').attr("disabled", true);
$('#text-error-message').text('Code non validé');
ev.preventDefault();
return false;
}
});
$('#name78').on('change input',function(){
$('#text-error-message').text('');
$('#form-code').removeClass('has-feedback has-error');
$('#submitRdv78').removeClass('disabled').prop("disabled", false);;
});
});
</script>
</div><!-- scripts -->
</metal:block>