267 lines
10 KiB
XML
267 lines
10 KiB
XML
<metal:block use-macro="main_template">
|
||
<div metal:fill-slot="content">
|
||
<div class="container">
|
||
<div class="row" style="margin-left:1em;">
|
||
<div class="col-sx-12">
|
||
<button class="btn btn-primary" type="button" data-toggle="modal" data-target="#confirmDuplicate" >
|
||
<span class="glyphicon glyphicon-plus"></span> Semaine Type</button>
|
||
</div>
|
||
</div>
|
||
<br />
|
||
<div id="calendar"></div>
|
||
</div>
|
||
|
||
<br />
|
||
<!-- Modal : Creation stage -->
|
||
<div class="modal fade" id="confirmCreate" role="dialog" aria-labelledby="confirmCreateLabel" aria-hidden="true">
|
||
<div class="modal-dialog modal-lg">
|
||
<div class="modal-content ">
|
||
<div class="modal-header">
|
||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||
<h4 class="modal-title">Planning A du</h4>
|
||
</div>
|
||
<div class="modal-body">
|
||
<!-- The form is placed inside the body of modal -->
|
||
<form id="create-planning-moto" class="form-horizontal" action="" 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">
|
||
|
||
|
||
<div class="form-group" id="form-code">
|
||
<label class="col-sm-3 control-label" style="margin-top:8px">Type</label>
|
||
<div class="col-sm-8 col-md-7" style="margin-top:8px">
|
||
<input type="text" class="form-control" id="type" name="TYPE" placeholder="3 caractères minimum" value="${type}" readonly/>
|
||
<span id="text-error-message" style="font-size:11px;color:#D9534F;"></span>
|
||
</div>
|
||
</div>
|
||
<div class="form-group" id="form-code">
|
||
<label class="col-sm-3 control-label" >Date </label>
|
||
<div class="col-sm-8 col-md-7">
|
||
<input type="text" class="form-control" id="DATE" name="DATE" placeholder="3 caractères minimum" readonly />
|
||
<span id="text-error-message" style="font-size:11px;color:#D9534F;"></span>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="control-label col-xs-3">Groupe</label>
|
||
<div class="col-sm-8 col-md-7">
|
||
<select class="form-control" name="GROUPE" id="select-group">
|
||
<tal:block tal:repeat="key [x for x in groupe.keys()]">
|
||
<option value="${key}" >${groupe[key]}</option>
|
||
</tal:block>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<div class="form-group" id="form-code">
|
||
<label class="col-sm-3 control-label">Libellé </label>
|
||
<div class="col-sm-8 col-md-7">
|
||
<input type="text" class="form-control"
|
||
data-fv-notempty="true"
|
||
data-fv-notempty-message="Le libellé est obligatoire"
|
||
id="LIBELLE" name="LIBELLE" />
|
||
<span id="text-error-message" style="font-size:11px;color:#D9534F;"></span>
|
||
</div>
|
||
</div>
|
||
<div class="form-group" id="form-code" tal:condition="type != 'A' ">
|
||
<label class="col-md-3 col-sm-3 control-label" style="margin-top:8px">Total places Plateau </label>
|
||
<div class="col-sm-8 col-md-6" style="margin-top:8px">
|
||
<input type="number" class="form-control" id="TOTAL" value="0" name="TOTAL" />
|
||
<span id="text-error-message" style="font-size:11px;color:#D9534F;"></span>
|
||
</div>
|
||
</div>
|
||
<div class="form-group" id="form-code" tal:condition="type == 'A' ">
|
||
<label class="col-md-3 col-sm-3 control-label" style="margin-top:8px">Total places Plateau </label>
|
||
<div class="col-sm-8 col-md-2" style="margin-top:8px">
|
||
<input type="number" class="form-control" id="TOTAL" value="0" name="TOTAL" />
|
||
<span id="text-error-message" style="font-size:11px;color:#D9534F;"></span>
|
||
</div>
|
||
<label class="col-sm-3 col-md-2 control-label" style="margin-top:8px">Total places Route</label>
|
||
<div class="col-sm-8 col-md-3" style="margin-top:8px">
|
||
<input type="number" class="form-control" id="ROUTE" value="0" name="ROUTE" />
|
||
<span id="text-error-message" style="font-size:11px;color:#D9534F;"></span>
|
||
</div>
|
||
</div>
|
||
<div class="form-group">
|
||
<div class="col-xs-5 col-xs-offset-3">
|
||
<button type="button" class="btn btn-default" data-dismiss="modal" style="margin-top:8px">Annuler</button>
|
||
<button type="submit" id="submitRdv" class="btn btn-danger" name="form.submitted" style="margin-top:8px">Enregistrer</button>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- duplicate modale -->
|
||
<div class="modal fade" id="confirmDuplicate" role="dialog" aria-labelledby="confirmCreateLabel" aria-hidden="true">
|
||
<div class="modal-dialog modal-md">
|
||
<div class="modal-content ">
|
||
<div class="modal-header">
|
||
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
|
||
<h4 class="modal-title">Duplication planning</h4>
|
||
</div>
|
||
<div class="modal-body">
|
||
<!-- The form is placed inside the body of modal -->
|
||
<form id="duplicate-planning-moto" class="form-horizontal" action="" 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">
|
||
|
||
<div class="form-group" id="form-code">
|
||
<label class="col-sm-3 control-label" >De la semaine du </label>
|
||
<div class="col-sm-8 col-md-7">
|
||
<input type="text" class="form-control" id="DATE1" name="DATE1" placeholder="3 caractères minimum" />
|
||
<span id="text-error-message" style="font-size:11px;color:#D9534F;"></span>
|
||
</div>
|
||
</div>
|
||
<div class="form-group" id="form-code">
|
||
<label class="col-sm-3 control-label" >Vers la semiane du </label>
|
||
<div class="col-sm-8 col-md-7">
|
||
<input type="text" class="form-control" id="DATE2" name="DATE2" placeholder="3 caractères minimum" />
|
||
<span id="text-error-message" style="font-size:11px;color:#D9534F;"></span>
|
||
</div>
|
||
</div>
|
||
<div class="form-group" id="form-code">
|
||
<label class="col-md-3 col-sm-3 control-label" style="margin-top:8px">Sur</label>
|
||
<div class="col-sm-8 col-md-3" style="margin-top:8px">
|
||
<input type="number" class="form-control" id="NB" value="3" name="NB" />
|
||
<span id="text-error-message" style="font-size:11px;color:#D9534F;"></span>
|
||
</div>
|
||
<label class="col-md-3 col-sm-3 control-label" style="margin-top:8px">Semaines</label>
|
||
</div>
|
||
<div class="form-group">
|
||
<div class="col-xs-5 col-xs-offset-3">
|
||
<button type="button" class="btn btn-default" data-dismiss="modal" style="margin-top:8px">Annuler</button>
|
||
<button type="submit" id="submitRdv" class="btn btn-danger" name="form.duplicated" style="margin-top:8px">Dupliquer</button>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<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>
|
||
<script>
|
||
$(document).ready(function() {
|
||
$('#calendar').fullCalendar({
|
||
schedulerLicenseKey: 'GPL-My-Project-Is-Open-Source',
|
||
locale: 'fr',
|
||
header: {
|
||
left: 'month listWeek',
|
||
center: 'prev title next',
|
||
right: 'today'
|
||
},
|
||
allDaySlot: false,
|
||
defaultView: 'month',
|
||
hiddenDays: [0], // hide sunday
|
||
height: 'auto',
|
||
minTime: "07:00:00",
|
||
maxTime: "21:00:00",
|
||
displayEventTime: false,
|
||
events:${calendar_events},
|
||
eventRender: function(event, element){
|
||
element.find('.fc-title').append("<br/>" + event.description);
|
||
},
|
||
dayClick: function(date, jsEvent, view) {
|
||
var string_date = date.format('DD-MM-YYYY');
|
||
$('#DATE').val(string_date);
|
||
$(".modal-title").html('Planning ${type} du '+string_date);
|
||
$('#confirmCreate').modal("show");
|
||
}
|
||
});
|
||
$('#create-planning-moto').formValidation({
|
||
fields: {
|
||
TOTAL: {
|
||
validators: {
|
||
callback: {
|
||
message: 'Total devrait une valeur positive',
|
||
callback: function(input) {
|
||
var num = Number(input)
|
||
return num >= 0
|
||
}
|
||
}
|
||
}
|
||
},
|
||
ROUTE: {
|
||
validators: {
|
||
callback: {
|
||
message: 'Route devrait une valeur positive',
|
||
callback: function(input) {
|
||
return input !== "" && parseInt(input) >= 0
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
});
|
||
$('#DATE1').datetimepicker({
|
||
format: 'DD/MM/YYYY'
|
||
}).on('dp.change', function (ev) {
|
||
fv.formValidation.revalidateField($('#DATE1'))
|
||
});
|
||
$('#DATE2').datetimepicker({
|
||
format: 'DD/MM/YYYY',
|
||
}).on('dp.change', function (ev) {
|
||
fv.formValidation.revalidateField($('#DATE2'))
|
||
});
|
||
var fv = $('#duplicate-planning-moto').formValidation({
|
||
fields: {
|
||
DATE1: {
|
||
validators: {
|
||
callback: {
|
||
message: 'La date saisie doit être un lundi !',
|
||
callback: function(input) {
|
||
var dt = moment(input,'DD/MM/YYYY')
|
||
return dt && dt.day() == 1
|
||
}
|
||
}
|
||
}
|
||
},
|
||
DATE2: {
|
||
validators: {
|
||
callback: {
|
||
message: 'La date saisie doit être un lundi !',
|
||
callback: function(input) {
|
||
var dt = moment(input,'DD/MM/YYYY')
|
||
return dt && dt.day() == 1
|
||
}
|
||
}
|
||
}
|
||
},
|
||
},
|
||
}).data();
|
||
|
||
$('#DATE1').on('input change',function(){
|
||
// fv.formValidation.updateStatus($('#DATE1'),'INVALID').revalidateField($('#DATE1'));
|
||
fv.formValidation.validateField($('#DATE1'))
|
||
})
|
||
$('#DATE2').on('input change',function(){
|
||
// fv.formValidation.updateStatus($('#DATE2'),'INVALID').revalidateField($('#DATE1'));
|
||
fv.formValidation.validateField($('#DATE2'))
|
||
})
|
||
|
||
$('#TOTAL1').on('input change',function(){
|
||
// fv.formValidation.updateStatus($('#TOTAL1'),'INVALID').revalidateField($('#TOTAL1'));
|
||
fv.formValidation.validateField($('#TOTAL1'))
|
||
})
|
||
$('#TOTAL2').on('input change',function(){
|
||
// fv.formValidation.updateStatus($('#TOTAL2'),'INVALID').revalidateField($('#TOTAL1'));
|
||
fv.formValidation.validateField($('#TOTAL2'))
|
||
})
|
||
|
||
});
|
||
</script>
|
||
</div>
|
||
</metal:block>
|
||
|
||
|