REMOVE ASAP -> APPOINTMENT 3.0.9 UPGRADE : Add fix for templates and …

…labels
citelibre · Feb 5, 2025 · c1fe12c · c1fe12c
1 parent 87015e1
commit c1fe12c
Show file tree

Hide file tree

Showing 6 changed files with 2,723 additions and 0 deletions.
diff --git a/...ide/classes/fr/paris/lutece/plugins/appointment/resources/appointment_messages.properties b/...ide/classes/fr/paris/lutece/plugins/appointment/resources/appointment_messages.properties
diff --git a/.../classes/fr/paris/lutece/plugins/appointment/resources/appointment_messages_en.properties b/.../classes/fr/paris/lutece/plugins/appointment/resources/appointment_messages_en.properties
diff --git a/...re-rendezvous/webapp/WEB-INF/templates/admin/plugins/appointment/appointment_commons.html b/...re-rendezvous/webapp/WEB-INF/templates/admin/plugins/appointment/appointment_commons.html
diff --git a/...vous/webapp/WEB-INF/templates/admin/plugins/appointment/slots/manage_annual_calendar.html b/...vous/webapp/WEB-INF/templates/admin/plugins/appointment/slots/manage_annual_calendar.html
@@ -0,0 +1,195 @@
+<link rel="stylesheet" href="css/admin/plugins/appointment/js-year-calendar.min.css">
+<link rel="stylesheet" href="css/admin/plugins/appointment/appointment.css">
+<@appointmentTabs tab='year' form=appointmentform context='slot'>
+    <@row>
+        <@columns sm=10>
+            <@div id="calendar"></@div>
+        </@columns>
+        <@columns sm=2>
+			<@p params=' style="border-bottom: 1px solid #000;margin-bottom: 15px; padding:15px 0"'>
+                <@span params='style="border-radius: 50%;background-color:#DDD;width: 20px;height: 20px;display: inline-block;vertical-align: middle;"'></@span> #i18n{appointment.annual.label.daySpecifity}
+            </@p>
+            <@ul class="list-unstyled">
+                <#list listReservationRule as rule>
+                    <@li class='py-2'>
+                        <@aButton color='link btn-outline-default justify-content-start w-75' href='jsp/admin/plugins/appointment/ManageAppointmentSlots.jsp?view=manageTypicalWeek&id_form=${id_form}&id_reservation_rule=${rule.idReservationRule}'>
+                            <@icon prefix='fas fa-' style='circle me-2' params=' style="color:${rule.color!};"' /> ${rule.name} 
+                        </@aButton>
+                    </@li>
+                </#list>
+            </@ul>
+        </@columns>
+    </@row>
+</@appointmentTabs>
+<@div id="context-menu"></@div>
+<@modal id='event-modal' size='md' >
+	<@modalHeader modalTitle='#i18n{appointment.assign.typicalWeek.defaultTitle}' />
+	<@modalBody>
+		<@tform id='form-validate' action='jsp/admin/plugins/appointment/ManageAnnualCalendar.jsp' params='enctype="multipart/form-data"'>
+			<@input type='hidden' name='action' value='doAssignWeek' />
+			<@input type='hidden' name='id_form' value='${id_form}' />
+			<@input type='hidden' name='id_week_definition' value='' />
+			<@formGroup labelFor='date_of_apply' labelKey='#i18n{appointment.manageAppointments.startingDateOfSearch}' rows=2>
+				<@inputGroup>
+					<@input type='text' name='date_of_apply' id='date_of_apply' value="" />
+					<@inputGroupItem type='text'>
+						<@icon style='calendar' />
+					</@inputGroupItem>
+				</@inputGroup>
+			</@formGroup>
+			<@formGroup labelFor='endingDate' labelKey='#i18n{appointment.manageAppointments.endingDateOfSearch}' rows=2>
+				<@inputGroup>
+					<@input type='text' name='ending_date_of_apply' id='ending_date_of_apply' value="" />
+					<@inputGroupItem type='text'>
+						<@icon style='calendar' />
+					</@inputGroupItem>
+				</@inputGroup>
+			</@formGroup>	
+			<@formGroup labelFor='type' labelKey='#i18n{appointment.week.toApplay}' rows=2>
+                <@select name='id_reservation_rule' id='id_reservation_rule'>
+                <#list listReservationRule as rule>
+				    <@option value=rule.idReservationRule label=rule.name />
+                </#list>
+				</@select>
+			</@formGroup>		
+			<@formGroup rows=2>
+                <@button type='submit' name='save' id='save' buttonIcon='check' title='#i18n{appointment.labelSave}' />
+                <@button type='submit' name='delete' id='delete' title='#i18n{portal.util.labelDelete}' buttonIcon='trash' color='danger'  />
+                <@button type='button' params='data-bs-dismiss="modal"' title='#i18n{portal.util.labelCancel}' buttonIcon='times' color='default' />   
+			</@formGroup>	
+		</@tform>
+	</@modalBody>
+</@modal>
+<script src="js/admin/plugins/appointment/moment.min.js"></script>
+<script src="js/admin/plugins/appointment/locale-all.js"></script>
+<script src="js/admin/plugins/appointment/bootstrap-datetimepicker.min.js"></script>
+<script src="js/admin/plugins/appointment/js-year-calendar.min.js"></script>
+<script src="js/admin/plugins/appointment/locales/js-year-calendar.${language}.js"></script>
+<script>
+moment.locale( '${language}' );
+function isOlderThanToday( dtCompare ) {    
+    var dateToday = new Date().setUTCHours( 0, 0, 0, 0); // Today
+    var isOlder=dtCompare.setUTCHours( 24, 0, 0, 0) >= dateToday ? true : false; 
+    console.log( dtCompare.setUTCHours( 0, 0, 0, 0) );
+    return isOlder;   
+}    
+
+let calendar = null;
+function editEvent( event) {
+    if( event.weekDef != undefined  ){
+        $('#event-modal input[name="id_week_definition"]').val( event.weekDef );
+        $('#event-modal #delete').show();
+        if( !isOlderThanToday( event.startDate ) ){
+            $('#event-modal #delete').attr('disabled','disabled');
+        } else {
+            $('#event-modal #delete').removeAttr('disabled');
+        }
+    } else {
+        $('#event-modal #delete').hide();
+    }
+
+    $('#event-modal input[name="date_of_apply"]').val( moment( event.startDate ).format('L') );
+    $('#event-modal input[name="date_of_apply"]').datetimepicker({ locale: '${language}', format: 'L' });
+    $('#event-modal input[name="ending_date_of_apply"]').val( moment( event.endDate ).format('L') );
+    $('#event-modal input[name="ending_date_of_apply"]').datetimepicker({ locale: '${language}', format: 'L'});
+    //$('#event-modal').modal();
+    const eventModal = bootstrap.Modal.getOrCreateInstance('#event-modal')
+    eventModal.toggle()
+}
+
+function deleteEvent(event) {
+   location.href= 'jsp/admin/plugins/appointment/ManageAnnualCalendar.jsp?action=doRemoveWeekFromCalendar&id_week_definition='+event.idweekdef+'&id_form=${id_form}';
+}
+
+var specDates = [<#list specificSlotDates as sDate>'${sDate}',</#list>];
+var popover = null;
+$(function() {
+    calendar = new Calendar('#calendar', { 
+        language: '${language}',
+        startYear: ${start_year},
+        enableContextMenu: true,
+        enableRangeSelection: true,
+        contextMenuItems:[
+            {
+                text: '#i18n{appointment.createEntry.manageField.buttonItemsPerPage}',
+                click: editEvent
+            },
+            {
+                text: '#i18n{appointment.delete.title}',
+                click: deleteEvent
+            }
+        ],
+        selectRange: function(e) {
+            if ( e.events.length > 0 ){
+                editEvent({ startDate: e.startDate, endDate: e.endDate, weekDef: e.events[0].idweekdef });
+            } else {
+                editEvent({ startDate: e.startDate, endDate: e.endDate });
+            }
+        },
+        mouseOnDay: function(e) {
+            if(e.events.length > 0) {
+                var content = '';
+                for(var i in e.events) {
+                    content += '<div class="event-tooltip-content">'
+                            + '<div class="event-name" style="color:' + e.events[i].color + '">' + e.events[i].name + '</div>'
+                            + '<div class="event-location">' + e.events[i].location + '</div>'
+                            + '</div>';
+                }
+                // $(e.element).popover({ 
+                //     trigger: 'manual',
+                //     container: 'body',
+                //     html:true,
+                //     content: content
+                // });
+                //$(e.element).popover('show');
+                popover = new bootstrap.Popover( e.element, { 
+                    trigger: 'manual',
+                    container: 'body',
+                    html: true,
+                    content: content
+                });
+                popover.show()
+            }
+        },
+        mouseOutDay: function(e) {
+            if(e.events.length > 0) {
+                //$(e.element).popover('hide');
+                popover.hide();
+            }
+        },
+        dayContextMenu: function(e) {
+            //$(e.element).popover('hide');
+            popover.hide();
+        },
+        customDayRenderer: function( e, date){
+            const cDay = moment( date ).format('YYYY-MM-DD');
+            const result = specDates.findIndex( yday => yday === cDay );
+            if( result != -1 ){
+                $(e).addClass( 'isSpecific' );
+            }
+        },
+        dataSource: [
+            <#list listReservationRule as rule>
+                <#list listWeekDefinition?filter( weekdef -> weekdef.idReservationRule  = rule.idReservationRule ) as weekdef>
+                    {
+                        id: ${rule.idReservationRule},
+                        name: '${rule.name?js_string}',
+                        location: '${rule.descriptionRule?js_string}',
+                        startDate: new Date(${weekdef.dateOfApply.year}, ${weekdef.dateOfApply.monthValue -1}, ${weekdef.dateOfApply.dayOfMonth}),
+                        endDate: new Date(${weekdef.endingDateOfApply.year}, ${weekdef.endingDateOfApply.monthValue -1}, ${weekdef.endingDateOfApply.dayOfMonth!}),
+                        color: '${rule.color}',
+                        idweekdef: ${weekdef.idWeekDefinition},
+                    },
+                </#list>
+            </#list>
+        ]
+    });
+
+    if( document.getElementById('loader') != undefined ){ document.getElementById('loader').remove() };
+
+    $('#event-modal #delete').click(function( em ) {
+        $('#event-modal input[name="action"]').val( 'doUnssignWeek' );
+    })
+});
+</script>
+
diff --git a/...ezvous/webapp/WEB-INF/templates/admin/plugins/appointment/slots/manage_specific_week.html b/...ezvous/webapp/WEB-INF/templates/admin/plugins/appointment/slots/manage_specific_week.html
@@ -0,0 +1,134 @@
+<@appointmentTabs tab='specificWeek' form=appointmentform context='slot'/>
+
+<@getCommentModal 'commentModal' '#i18n{appointment.create_comment.pageTitle}' "comment" "startingValidityDate" "endingValidityDate" "idStartingTime" "idEndingTime" "doAddComment" id_form mailing_list />
+
+<@getCommentModal 'modify-comment' '#i18n{appointment.modify_comment.pageTitle}' "comment" "modifyStartingValidityDate" "modifyEndingValidityDate" "idModifyStartingTime" "idModifyEndingTime" "doModifyComment" id_form mailing_list />
+
+<@modal id='updatePlanningSlot' params='data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1"'>
+    <@modalBody>
+        <@tform action='jsp/admin/plugins/appointment/ManageSpecificWeek.jsp'>						
+        <@input type='hidden' name='action' value='doModifyListSlot' />
+        <@input type='hidden' name='id_form' value='${appointmentform.idForm}' />
+        <@input type='hidden' id='slotData' name='slotsData' value='' />
+        <@input type='hidden' id='idWorkingDay' name='workingDay' value='' />
+        <@input type='hidden' id='capacity' name='capacity' value='new_cap' />
+        <@input type='hidden' id='date_of_display_slot' name='date_of_display' value='${date_of_display}' />	
+        <@formGroup labelKey='#i18n{appointment.modifySlot.labelDate}' rows=2>
+            <@staticText id="dtSlot"></@staticText>
+        </@formGroup>
+        <@formGroup labelFor='is_open' labelKey='#i18n{appointment.modifySlot.labelOpen}' helpKey='#i18n{appointment.modifySlot.labelOpenHelp}' rows=2>
+            <@checkBox name='is_open' id='is_open' value='true' checked=true />
+        </@formGroup>
+        <@formGroup labelFor='maxCapacity' labelKey='#i18n{appointment.modifySlot.labelMaxCapacityForThisSlot}' mandatory=true rows=2>
+            <@input type='number' id='maxCapacity' name='max_capacity' value='' min=0 max=99 maxlength=3 />	
+        </@formGroup>
+        <@formGroup labelKey='#i18n{appointment.model.entity.appointmentform.attribute.timeStart}' rows=2>
+            <@staticText id='timeStart'></@staticText>
+        </@formGroup>
+        <@formGroup labelFor='timeEnd' labelKey='#i18n{appointment.model.entity.appointmentform.attribute.timeEnd}' helpKey='#i18n{appointment.modifySlot.helpModifyEndSlot}' mandatory=true rows=2>
+            <@inputGroup>
+                <@input type='text' name='ending_time' id='timeEnd' value='' />
+                <@inputGroupItem type='text'>
+                    <@icon style='clock' />
+                </@inputGroupItem>
+            </@inputGroup>
+        </@formGroup>
+        <@formGroup labelFor='shift_slot' rows=2>
+            <@radioButton labelFor='shift_slot_false' labelKey='#i18n{appointment.modifySlot.notShiftSlot}' name='shift_slot' id='shift_slot_false' checked=true value='false' />
+            <@radioButton labelFor='shift_slot_true' labelKey='#i18n{appointment.modifySlot.shiftSlot}' name='shift_slot' id='shift_slot_true' value='true' />
+        </@formGroup>
+        <@formGroup rows=2>
+            <@button type='submit' buttonIcon='check' name='modify' id='modify' title='#i18n{portal.util.labelModify}' />
+            <@button color='secondary' title='#i18n{portal.util.labelCancel}' params=' data-bs-dismiss="modal" aria-label="#i18n{portal.util.labelCancel}"' />
+        </@formGroup>
+        </@tform>
+    </@modalBody>
+</@modal>
+<@modal id='updatePlanningMultiSlot' params='data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1"'>
+    <@modalBody>
+        <@tform action="jsp/admin/plugins/appointment/ManageSpecificWeek.jsp">
+            <@input type='hidden' name='action' value='doModifyListSlot' />
+            <@input type='hidden' name='id_form' value='${appointmentform.idForm}' />
+            <@input type='hidden' id='slotsData' name='slotsData' value='' />
+            <@input type='hidden' id='date_of_display_multi' name='date_of_display' value='${date_of_display}' />
+            <@formGroup labelKey='#i18n{appointment.modifySlot.labelSlotStatus}' helpKey='#i18n{appointment.modifySlot.labelOpenHelp}' rows=2>
+                <@radioButton orientation='inline' labelFor='shift_slot_open' id='shift_slot_open' labelKey='#i18n{appointment.modifySlot.labelOpen}' name='is_open' value='true' />
+                <@radioButton orientation='inline' labelFor='shift_slot_close' id='shift_slot_close' labelKey='#i18n{appointment.modifySlot.labelClose}' name='is_open' value='false' />
+                <@radioButton orientation='inline' labelFor='shift_slot_null' id='shift_slot_null' labelKey='#i18n{appointment.modifySlot.labelNoValue}' name='is_open' value='' checked=true  />
+            </@formGroup>
+            <@formGroup labelFor='shift_slot' rows=2>
+                <@radioButton labelFor='var_cap' labelKey='#i18n{appointment.modifySlot.labelCapacityChange}' name='capacity' id='var_cap' checked=true value='var_cap' />
+                <@radioButton labelFor='new_cap' labelKey='Nouvelle capacité' name='capacity' id='new_cap' value='new_cap' />
+                <@input type='number' id='newCapacity' name='max_capacity' value='0' min=-99 max=99 />
+            </@formGroup>
+            <@formGroup rows=2>
+                <@button type='submit' color='primary' title='#i18n{portal.util.labelValidate}' />
+                <@button color='secondary' title='#i18n{portal.util.labelCancel}' params=' data-bs-dismiss="modal" aria-label="#i18n{portal.util.labelCancel}"' />
+            </@formGroup>
+        </@tform>
+    </@modalBody>
+</@modal>
+<script src="js/admin/plugins/appointment/selectable.min.js"></script>
+<script src="js/admin/plugins/appointment/selectable.table.min.js"></script>
+<script src="js/admin/plugins/appointment/locales/bootstrap-datepicker.${locale}.js" ></script>
+<script>
+var slotDuration = '${min_duration}';
+var minTime = '${min_time}';
+var maxTime = '${max_time}';
+var defaultDate = '${date_of_display}';
+var startingDateOfDisplay = '${date_of_display}';
+var endingDateOfDisplay = '${ending_date_of_display}';
+var dow = [<#if dow??><#list dow as day>'${day}',</#list></#if>];
+var events = [
+<#if comment_events??>
+    <@getComments comment_events />
+</#if>
+<#if events??>
+    <#list events as event>
+        <#assign maxCap = event.maxCapacity?number />
+        <#assign realCap = appointmentform.capacityPerSlot?number />
+        <#if realCap = 0><#assign realCap = 1></#if>
+        <#assign nbFull = maxCap / realCap  * 100 >
+        <#assign eventTitle='${maxCap} / ${realCap}'>
+        <#assign strCustomColor><#if event.isOpen & ( maxCap > realCap )>rgba(255,165,0,1)<#elseif event.isOpen &  ( maxCap <= realCap )>rgba(204,235,255,1)<#else>rgba(255,0,0,1)</#if></#assign>
+         {
+            "title" : "${event.maxCapacity} / ${appointmentform.capacityPerSlot}<#if event.isSpecific> (*)</#if>",
+            "start" : "${event.startingDateTime}",
+            "end" : "${event.endingDateTime}",
+            "id" : "${event.idSlot}",
+            "color" : <#if event.isOpen>"transparent"<#else>"#bebebe"</#if>,
+            "textColor" : "#2c2c2d",
+            "url" : "jsp/admin/plugins/appointment/ManageSpecificWeek.jsp?view=viewModifySlot&id_form=${appointmentform.idForm}&id_slot=${event.idSlot}&starting_date_time=${event.startingDateTime}&ending_date_time=${event.endingDateTime}&is_open=<#if event.isOpen>true<#else>false</#if>&is_specific=<#if event.isSpecific>true<#else>false</#if>&max_capacity=${event.maxCapacity}",
+            "customStyle" : <#if event.isOpen>"linear-gradient( 90deg, ${strCustomColor} 0%, ${strCustomColor} ${nbFull?floor}%, rgba(255,255,255,1) ${nbFull?floor}% )",<#else>"",</#if>
+            "customClass" : "fc-custom",
+            "backgroundColor" : <#if event.isOpen>"#fff"<#else>"#bebebe"</#if>,
+            "borderColor" : "#bebebe",
+            "isOpen" : "${event.isOpen?c}",
+            "isSpecific" : "${event.isSpecific?c}",
+            "maxCapacity" : "${event.maxCapacity}",
+            "idForm" : "${event.idForm}",
+            "date" : "${event.date}"
+        },
+    </#list>
+</#if>
+];
+
+$( '#new_cap' ).click( function(){
+    $('#newCapacity').attr('min','0');
+    if( $('#newCapacity').val() < 0 ){
+        $('#newCapacity').val(0);
+    }
+});
+
+$('#var_cap').click(function(){
+    $('#newCapacity').attr('min','-99');
+});
+<@fullCalendarScript isSpecific=true >
+$('#timeEnd').datetimepicker({
+    format: 'HH:mm',
+    stepping: 5
+});
+</@fullCalendarScript>
+</script>
+<#include "/admin/util/editor/editor.html" />
+<@initEditor type='comment' />