Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Modale au clic sur un créneau de la page planning #1122

Merged
merged 4 commits into from
Nov 9, 2024
Merged

Modale au clic sur un créneau de la page planning #1122

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
e83ae61
first shot at a modal for buckets on the /schedule page
njean42 Aug 11, 2024
aea4c3a
S'assurer que les 'form's sont définies avant de les afficher (mode a…
njean42 Nov 1, 2024
0a0a596
Ajout de la <div class="modal-content"> pour avoir l'espace blanc aut…
njean42 Nov 1, 2024
1a1ddce
Conditionner l'affichage des boutons "Envoyer un email" et "Éditer" (…
njean42 Nov 3, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
175 changes: 101 additions & 74 deletions app/Resources/views/admin/booking/_partial/bucket_modal.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,12 @@
{#
Template for the modal popup used to change the user register for a shift bucket in /booking/admin
Also on the /schedule page to display more shift infos (without any action buttons)
It use the materialize modal class https://materializeweb.com/modals.html
id = "modal-bucket"
#}
{% if (display_names ?? true) %}
{% set display_names = display_name_shifters %}
{% endif %}
{% set nbBookableShifts = shifts | filter ( shift => not shift.shifter) | length %}
{% set nbShifts = (shifts | length) %}
{% set nbBookedShifts = nbShifts - nbBookableShifts %}
Expand Down Expand Up @@ -33,7 +37,9 @@ id = "modal-bucket"
{% if use_card_reader_to_validate_shifts and shift.isPastOrCurrent %}
<span class="{% if shift.wasCarriedOut %}green-text{% else %}red-text{% endif %}">&#9673;</span>&nbsp;
{% endif %}
{{ shift.shifter.displayNameWithMemberNumber }}
{% if display_names %}
{{ shift.shifter.displayNameWithMemberNumber }}
{% endif %}
{% if shift.formation %}&nbsp;({{ shift.formation.name }}){% endif %}
{% if not shift.formation and shift.shifter.formations | length > 0 %}
&nbsp;<strong class="orange-text">({{ shift.shifter.formations | join(', ') }})</strong>
Expand All @@ -54,7 +60,7 @@ id = "modal-bucket"
<strong>{% if shift.fixe %}fixe{% else %}volant{% endif %}</strong>
{% endif %}
réservé
{% if shift.shifter != shift.booker.beneficiary %}
{% if shift.shifter != shift.booker.beneficiary and display_names %}
pour <a href="{{ path("member_show", { 'member_number': shift.shifter.membership.memberNumber }) }}" target="_blank">{{ shift.shifter }}</a>
{% endif %}
le <i>{{ shift.bookedTime | date_fr_full_with_time }}</i>
Expand All @@ -75,18 +81,20 @@ id = "modal-bucket"
{% endif %}
{{ form_end(shift_validate_invalidate_forms[shift.id]) }}
{% endif %}
{{ form_start(shift_free_forms[shift.id], {'attr': { 'style': 'display:inline;' }}) }}
{% do shift_free_forms[shift.id].reason.setRendered() %} <!-- hidden -->
{% if shift.isPast %}
<button type="submit" class="btn red" title="Supprimer la participation">
<i class="material-icons left">delete</i>Supprimer la participation
</button>
{% else %}
<button type="submit" class="btn orange" title="Libérer">
<i class="material-icons left">lock_open</i>Libérer
</button>
{% endif %}
{{ form_end(shift_free_forms[shift.id]) }}
{% if shift_free_forms is defined %}
Copy link
Collaborator Author

@njean42 njean42 Aug 11, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Je ne sais pas trop ce que sont les shift_free_forms, et donc je ne sais pas si vérifier leur présence est la meilleure façon de faire ici.

Idem pour les autres if … is defined plus bas :

  • shift_book_forms
  • bucket_shift_add_form
  • bucket_lock_unlock_form

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ce ne sont pas des free_form, mais des shift_free forms ;) Le créneaux libres sont une fonctionnalités offerte par Elefan que l'on n'utilise pas nous. Une variable existe pour activer la fonctionnalité.

{{ form_start(shift_free_forms[shift.id], {'attr': { 'style': 'display:inline;' }}) }}
{% do shift_free_forms[shift.id].reason.setRendered() %} <!-- hidden -->
{% if shift.isPast %}
<button type="submit" class="btn red" title="Supprimer la participation">
<i class="material-icons left">delete</i>Supprimer la participation
</button>
{% else %}
<button type="submit" class="btn orange" title="Libérer">
<i class="material-icons left">lock_open</i>Libérer
</button>
{% endif %}
{{ form_end(shift_free_forms[shift.id]) }}
{% endif %}
{% endif %}
<!-- shift.createdBy -->
{% if shift.createdBy %}
Expand All @@ -104,8 +112,13 @@ id = "modal-bucket"
<div class="col s12">
<b>
<span style="font-style: italic">
{% if shift.lastShifter %}réservé à {{ shift.lastShifter.displayNameWithMemberNumber }}
{% else %}libre
{% if shift.lastShifter %}
réservé
{% if display_names %}
à {{ shift.lastShifter.displayNameWithMemberNumber }}
{% endif %}
{% else %}
libre
{% endif %}
</span>
</b>
Expand All @@ -119,29 +132,32 @@ id = "modal-bucket"
</div>
<div class="collapsible-body">
<!-- shift book form -->
{{ form_start(shift_book_forms[shift.id], {'attr': { 'style': 'display:inline;' }}) }}
<div class="row">
<div class="col {% if use_fly_and_fixed %}s7{% else %}s9{% endif %} input-field">
{{ form_label(shift_book_forms[shift.id].shifter) }}
{{ form_widget(shift_book_forms[shift.id].shifter) }}
</div>
{% if use_fly_and_fixed %}
<div class="col s2 input-field">
{{ form_widget(shift_book_forms[shift.id].fixe) }}
{% if shift_book_forms is defined %}
{{ form_start(shift_book_forms[shift.id], {'attr': { 'style': 'display:inline;' }}) }}
<div class="row">
<div class="col {% if use_fly_and_fixed %}s7{% else %}s9{% endif %} input-field">
{{ form_label(shift_book_forms[shift.id].shifter) }}
{{ form_widget(shift_book_forms[shift.id].shifter) }}
</div>
{% endif %}
<div class="col s3 input-field">
{% if not use_fly_and_fixed %}
{{ form_widget(shift_book_forms[shift.id].fixe) }}
{% if use_fly_and_fixed %}
<div class="col s2 input-field">
{{ form_widget(shift_book_forms[shift.id].fixe) }}
</div>
{% endif %}
<button type="submit" class="btn">
<i class="material-icons left">add</i>Ajouter
</button>
<div class="col s3 input-field">
{% if not use_fly_and_fixed %}
{{ form_widget(shift_book_forms[shift.id].fixe) }}
{% endif %}
<button type="submit" class="btn">
<i class="material-icons left">add</i>Ajouter
</button>
</div>
</div>
</div>
{{ form_end(shift_book_forms[shift.id]) }}
{{ form_end(shift_book_forms[shift.id]) }}
{% endif %}

<!-- shift delete form -->
{% if is_granted("ROLE_ADMIN") %}
{% if is_granted("ROLE_ADMIN") and shift_delete_forms is defined %}
{% if not shift.lastShifter %}
{{ form_start(shift_delete_forms[shift.id]) }}
<button type="submit" title="Supprimer le poste" class="btn red">
Expand All @@ -164,49 +180,60 @@ id = "modal-bucket"
</ul>

{# add shift form #}
{{ form_start(bucket_shift_add_form, {'attr': { 'style': 'display:inline;' }}) }}
<input type="hidden" id="{{ bucket_shift_add_form.start.date.vars.id }}" name="{{ bucket_shift_add_form.start.date.vars.full_name }}" value="{{ bucket_shift_add_form.start.date.vars.value }}">
<input type="hidden" id="{{ bucket_shift_add_form.start.time.vars.id }}" name="{{ bucket_shift_add_form.start.time.vars.full_name }}" value="{{ bucket_shift_add_form.start.time.vars.value }}">
<input type="hidden" id="{{ bucket_shift_add_form.end.date.vars.id }}" name="{{ bucket_shift_add_form.end.date.vars.full_name }}" value="{{ bucket_shift_add_form.end.date.vars.value }}">
<input type="hidden" id="{{ bucket_shift_add_form.end.time.vars.id }}" name="{{ bucket_shift_add_form.end.time.vars.full_name }}" value="{{ bucket_shift_add_form.end.time.vars.value }}">
{{ form_widget(bucket_shift_add_form.job) }}
<div class="row valign-wrapper">
<div class="col s3">
{{ form_label(bucket_shift_add_form.number) }}
{{ form_widget(bucket_shift_add_form.number) }}
{% if bucket_shift_add_form is defined %}
{{ form_start(bucket_shift_add_form, {'attr': { 'style': 'display:inline;' }}) }}
<input type="hidden" id="{{ bucket_shift_add_form.start.date.vars.id }}" name="{{ bucket_shift_add_form.start.date.vars.full_name }}" value="{{ bucket_shift_add_form.start.date.vars.value }}">
<input type="hidden" id="{{ bucket_shift_add_form.start.time.vars.id }}" name="{{ bucket_shift_add_form.start.time.vars.full_name }}" value="{{ bucket_shift_add_form.start.time.vars.value }}">
<input type="hidden" id="{{ bucket_shift_add_form.end.date.vars.id }}" name="{{ bucket_shift_add_form.end.date.vars.full_name }}" value="{{ bucket_shift_add_form.end.date.vars.value }}">
<input type="hidden" id="{{ bucket_shift_add_form.end.time.vars.id }}" name="{{ bucket_shift_add_form.end.time.vars.full_name }}" value="{{ bucket_shift_add_form.end.time.vars.value }}">
{{ form_widget(bucket_shift_add_form.job) }}
<div class="row valign-wrapper">
<div class="col s3">
{{ form_label(bucket_shift_add_form.number) }}
{{ form_widget(bucket_shift_add_form.number) }}
</div>
<div class="col s6">
{{ form_label(bucket_shift_add_form.formation) }}
{{ form_widget(bucket_shift_add_form.formation) }}
</div>
<div class="col s3">
<button type="submit" class="btn waves-effect waves-light teal">
<i class="material-icons left">add</i>Ajouter
</button>
</div>
</div>
<div class="col s6">
{{ form_label(bucket_shift_add_form.formation) }}
{{ form_widget(bucket_shift_add_form.formation) }}
</div>
<div class="col s3">
<button type="submit" class="btn waves-effect waves-light teal">
<i class="material-icons left">add</i>Ajouter
</button>
</div>
</div>
{{ form_row(bucket_shift_add_form._token) }}
{{ form_end(bucket_shift_add_form, {'render_rest': false}) }}
{{ form_row(bucket_shift_add_form._token) }}
{{ form_end(bucket_shift_add_form, {'render_rest': false}) }}
{% endif %}

{# bucket actions #}
<a href="{{ path('mail_bucketshift', { 'id': bucket.id }) }}" class="btn">
<i class="material-icons left">mail</i>Envoyer un email
</a>
{{ form_start(bucket_lock_unlock_form, {'attr': { 'style': 'display:inline;' }}) }}
{% if bucket.locked %}
<button type="submit" class="btn orange">
<i class="material-icons left">lock_open</i>Déverrouiller
</button>
{% else %}
<button type="submit" class="btn orange">
<i class="material-icons left">lock</i>Verrouiller
</button>
{% if display_send_email_button ?? false and is_granted("ROLE_ADMIN_PANEL") %}
<a href="{{ path('mail_bucketshift', { 'id': bucket.id }) }}" class="btn">
<i class="material-icons left">mail</i>Envoyer un email
</a>
{% endif %}
{{ form_end(bucket_lock_unlock_form) }}
<a href="{{ path('bucket_edit', { 'id': bucket.id }) }}" class="btn deep-purple">
<i class="material-icons left">edit</i>Editer
</a>
{% if is_granted("ROLE_ADMIN") %}

{% if bucket_lock_unlock_form is defined %}
{{ form_start(bucket_lock_unlock_form, {'attr': { 'style': 'display:inline;' }}) }}
{% if bucket.locked %}
<button type="submit" class="btn orange">
<i class="material-icons left">lock_open</i>Déverrouiller
</button>
{% else %}
<button type="submit" class="btn orange">
<i class="material-icons left">lock</i>Verrouiller
</button>
{% endif %}
{{ form_end(bucket_lock_unlock_form) }}
{% endif %}

{% if display_edit_button ?? false and is_granted("ROLE_SHIFT_MANAGER") %}
<a href="{{ path('bucket_edit', { 'id': bucket.id }) }}" class="btn deep-purple">
<i class="material-icons left">edit</i>Editer
</a>
{% endif %}

{% if is_granted("ROLE_ADMIN") and bucket_delete_form is defined %}
<!-- bucket delete is allowed only if all shifts are free -->
{{ form_start(bucket_delete_form, {'attr': { 'style': 'display:inline;' }}) }}
<button id="bucket_delete" class="btn red" title="Supprimer tous les créneaux à cette heure et ce poste" {% if not use_time_log_saving and (nbBookedShifts > 0) %}disabled{% endif %}>
Expand Down
7 changes: 6 additions & 1 deletion app/Resources/views/admin/member/_partial/member_or_user_link.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,16 @@
{% if (display_names ?? true) %}
{% set display_names = display_name_shifters %}
{% endif %}
{% set target_blank = target_blank ?? false %}

{% if user %}
{% if user and display_names %}
{% if user.beneficiary %}
<a href="{{ path("member_show", { 'member_number': user.beneficiary.membership.memberNumber }) }}" {% if target_blank %}target="_blank"{% endif %}>
{{ user.beneficiary }}
</a>
{% else %}
{{ user }}
{% endif %}
{% else %}
quelqu'un⋅e
{% endif %}
13 changes: 12 additions & 1 deletion app/Resources/views/booking/_partial/shift.html.twig
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,12 @@
{% endfor %}
{% endif %}
</div>
<a {% if firstBookableShift %}href="#book{{ firstBookableShift.id }}"{% endif %}
<a
{% if firstBookableShift %}
href="#book{{ firstBookableShift.id }}"
{% else %}
href="#show{{ bucket.id }}"
{% endif %}
class="modal-trigger tooltipped" data-position="top" data-delay="100" data-tooltip="{{ bucket.sortedShifts.first.job.name }}">
<div class="z-depth-1 {{ bucket.sortedShifts.first.job.color }} lighten-5 black-text" style="position: relative">
<div class="shift-block">
Expand Down Expand Up @@ -65,4 +70,10 @@
</div>
{% if firstBookableShift %}
{% include "booking/_partial/modal.html.twig" with { beneficiary: beneficiary, user: app.user, bucket: bucket, cycle: cycle } %}
{% else %}
<div id="show{{ bucket.id }}" class="modal">
<div class="modal-content">
{% include "admin/booking/_partial/bucket_modal.html.twig" with { shifts: bucket.getSortedShifts() } %}
</div>
</div>
{% endif %}
2 changes: 2 additions & 0 deletions src/AppBundle/Controller/BookingController.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -340,6 +340,8 @@ public function showBucketAction(Request $request, Shift $bucket)

return $this->render('admin/booking/_partial/bucket_modal.html.twig', [
'shifts' => $shifts,
'display_send_email_button' => true,
'display_edit_button' => true,
'bucket_shift_add_form' => $bucketShiftAddForm->createView(),
'shift_book_forms' => $shiftBookForms,
'shift_delete_forms' => $shiftDeleteForms,
Expand Down
Loading