From 7abe3e1b2dcd5503f5f63f71b55b942d93480ec2 Mon Sep 17 00:00:00 2001 From: Mathieu Jaumotte Date: Thu, 13 Jan 2022 14:11:08 +0100 Subject: [PATCH 01/15] chill-no-data-statement smaller (https://gitlab.com/champs-libres/departement-de-la-vendee/chill/-/issues/354) --- src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss b/src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss index a570b645a..18caf498c 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss +++ b/src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss @@ -318,6 +318,7 @@ dl.definition-inline { .custom_field_no_data, .chill-no-data-statement { font-style: italic; + font-size: 90%; } /// flash From 0afccd12a998fe8bd4ffb75e8b1a7c526b8b3a99 Mon Sep 17 00:00:00 2001 From: Mathieu Jaumotte Date: Thu, 13 Jan 2022 14:11:53 +0100 Subject: [PATCH 02/15] fix error when twig insert onthefly with parent undefined --- .../ChillMainBundle/Resources/public/vuejs/OnTheFly/index.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/OnTheFly/index.js b/src/Bundle/ChillMainBundle/Resources/public/vuejs/OnTheFly/index.js index 479cc1248..3e8683de1 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/OnTheFly/index.js +++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/OnTheFly/index.js @@ -22,7 +22,7 @@ containers.forEach((container) => { options: { buttonText: container.dataset.buttonText || null, displayBadge: container.dataset.displayBadge || false, - parent: JSON.parse(container.dataset.parent) || null, + parent: container.dataset.parent ? JSON.parse(container.dataset.parent) : null, } } } @@ -33,4 +33,5 @@ containers.forEach((container) => { .mount(container); //console.log('container dataset', container.dataset); + //console.log('data-parent', container.dataset.parent); }); From 650e0d79bea9cc39d784044fb349652cd2cd3c53 Mon Sep 17 00:00:00 2001 From: Mathieu Jaumotte Date: Thu, 13 Jan 2022 15:03:05 +0100 Subject: [PATCH 03/15] improve notification list and show styles --- .../Resources/public/chill/chillmain.scss | 4 +++ .../public/chill/scss/notification.scss | 36 +++++++++++-------- .../Notification/NotificationReadToggle.vue | 2 +- .../views/Notification/_list_item.html.twig | 14 ++++---- .../views/Notification/show.html.twig | 5 +-- .../translations/messages.fr.yml | 1 + 6 files changed, 38 insertions(+), 24 deletions(-) diff --git a/src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss b/src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss index 18caf498c..1d2a52d89 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss +++ b/src/Bundle/ChillMainBundle/Resources/public/chill/chillmain.scss @@ -240,6 +240,10 @@ table.table-bordered { color: $gray-800; font-size: 90%; + p { + margin-bottom: 0.75rem !important; + } + // test a bottom right decoration (to be confirmed) &.test { position: relative; diff --git a/src/Bundle/ChillMainBundle/Resources/public/chill/scss/notification.scss b/src/Bundle/ChillMainBundle/Resources/public/chill/scss/notification.scss index 23993299d..af0f058d5 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/chill/scss/notification.scss +++ b/src/Bundle/ChillMainBundle/Resources/public/chill/scss/notification.scss @@ -36,25 +36,31 @@ div.notification { div.notification-list, div.notification-show { div.item-bloc { - div.item-row.header { - - div.item-col { - &:first-child { - flex-grow: 1; + div.item-row { + &.notification-header { + div.item-col { + &:first-child { + flex-grow: 1; + } + &:last-child { + flex-grow: 0; + } } - &:last-child { - flex-grow: 0; + ul.small_in_title { + list-style-type: circle; + li { + span.item-key { + display: inline-block; + width: 3em; + } + } } } - - ul.small_in_title { - list-style-type: circle; - li { - span.item-key { - display: inline-block; - width: 3em; - } + div.notification-content { + margin: 1.5rem; + p { + margin-bottom: 0.75rem; } } } diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/Notification/NotificationReadToggle.vue b/src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/Notification/NotificationReadToggle.vue index f1b246626..c60124592 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/Notification/NotificationReadToggle.vue +++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/Notification/NotificationReadToggle.vue @@ -34,7 +34,7 @@ :href="showUrl" :title="$t('action.show')" > - + diff --git a/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig b/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig index 8123373f2..4b9b69c30 100644 --- a/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig +++ b/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig @@ -6,7 +6,7 @@ -
+
    @@ -53,11 +53,13 @@ {% include data.template with data.template_data %}
-
-
-
+
+
+ {% if full_content is defined and full_content == 'true' %} + {{ notification.message|chill_markdown_to_html }} + {% else %} {{ notification.message|u.truncate(250, '…', false)|chill_markdown_to_html }} -
+ {% endif %}
{% if action_button is not defined or action_button != 'false' %} @@ -79,7 +81,7 @@ {% if is_granted('CHILL_MAIN_NOTIFICATION_SEE', notification) %}
  • + class="btn btn-show change-icon" title="{{ 'notification.see_comments_thread'|trans }}">
    • {% endif %} diff --git a/src/Bundle/ChillMainBundle/Resources/views/Notification/show.html.twig b/src/Bundle/ChillMainBundle/Resources/views/Notification/show.html.twig index 2d3b27728..1b2f8f189 100644 --- a/src/Bundle/ChillMainBundle/Resources/views/Notification/show.html.twig +++ b/src/Bundle/ChillMainBundle/Resources/views/Notification/show.html.twig @@ -40,7 +40,8 @@ 'template': handler.getTemplate(notification), 'template_data': handler.getTemplateData(notification) }, - 'action_button': 'false' + 'action_button': 'false', + 'full_content': 'true' } %}
    @@ -87,7 +88,7 @@ {% endif %}
    -

    {{ 'Write a new comment'|trans }}

    +

    {{ 'Write a new comment'|trans }}

    {{ form_start(appendCommentForm) }} {{ form_errors(appendCommentForm) }} diff --git a/src/Bundle/ChillMainBundle/translations/messages.fr.yml b/src/Bundle/ChillMainBundle/translations/messages.fr.yml index a3a375891..d990790e0 100644 --- a/src/Bundle/ChillMainBundle/translations/messages.fr.yml +++ b/src/Bundle/ChillMainBundle/translations/messages.fr.yml @@ -380,4 +380,5 @@ notification: you were notified by %sender%: Vous avez été notifié par %sender% you were notified by system: Vous avez été notifié automatiquement subject: Objet + see_comments_thread: Voir le fil de commentaires associé From d7d7fb5693d7e24501fa524baf2fddd4a5609e60 Mon Sep 17 00:00:00 2001 From: Mathieu Jaumotte Date: Thu, 13 Jan 2022 16:15:49 +0100 Subject: [PATCH 04/15] add a chill button "tpchild", to create on-the-fly thirdparty (kind=child) --- .../ChillMainBundle/Resources/public/chill/scss/buttons.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/Bundle/ChillMainBundle/Resources/public/chill/scss/buttons.scss b/src/Bundle/ChillMainBundle/Resources/public/chill/scss/buttons.scss index 86e2f2299..ad0584d74 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/chill/scss/buttons.scss +++ b/src/Bundle/ChillMainBundle/Resources/public/chill/scss/buttons.scss @@ -22,6 +22,7 @@ $chill-theme-buttons: ( "choose": $gray-300, "notify": $gray-300, "unlink": $chill-red, + "tpchild": $chill-pink, ); @each $button, $color in $chill-theme-buttons { @@ -50,6 +51,7 @@ $chill-theme-buttons: ( &.btn-unlink, &.btn-action, &.btn-edit, + &.btn-tpchild, &.btn-update { &, &:hover { color: $light; @@ -75,6 +77,7 @@ $chill-theme-buttons: ( &.btn-remove::before, &.btn-choose::before, &.btn-notify::before, + &.btn-tpchild::before, &.btn-cancel::before { font: normal normal normal 14px/1 ForkAwesome; margin-right: 0.5em; @@ -101,6 +104,7 @@ $chill-theme-buttons: ( &.btn-choose::before { content: "\f00c"; } // fa-check // f046 fa-check-square-o &.btn-unlink::before { content: "\f127"; } // fa-chain-broken &.btn-notify::before { content: "\f1d8"; } // fa-paper-plane + &.btn-tpchild::before { content: "\f007"; } // fa-user } From 819017112db11258bc72d19e3a7c601906dc8140 Mon Sep 17 00:00:00 2001 From: Mathieu Jaumotte Date: Thu, 13 Jan 2022 18:56:07 +0100 Subject: [PATCH 05/15] JS toggle class read/unread when clicking on vue component NotificationReadToggle.vue --- .../public/module/notification/toggle_read.js | 14 +++++++++++++- .../views/Notification/_list_item.html.twig | 3 ++- .../extension_list_notifications_for.html.twig | 3 ++- .../Resources/views/Notification/show.html.twig | 1 + 4 files changed, 18 insertions(+), 3 deletions(-) diff --git a/src/Bundle/ChillMainBundle/Resources/public/module/notification/toggle_read.js b/src/Bundle/ChillMainBundle/Resources/public/module/notification/toggle_read.js index 82a118f77..9788ca82a 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/module/notification/toggle_read.js +++ b/src/Bundle/ChillMainBundle/Resources/public/module/notification/toggle_read.js @@ -26,13 +26,25 @@ window.addEventListener('DOMContentLoaded', function (e) { buttonNoText: 'false' === el.dataset.buttonText, showUrl: el.dataset.showButtonUrl, isRead: 1 === +el.dataset.notificationCurrentIsRead, + container: el.dataset.container + } + }, + computed: { + getContainer() { + return document.getElementById(this.container); } }, methods: { onMarkRead() { + if (null !== this.getContainer) { + this.getContainer.classList.replace('read', 'unread'); + } this.isRead = false; }, onMarkUnread() { + if (null !== this.getContainer) { + this.getContainer.classList.replace('unread', 'read'); + } this.isRead = true; }, } @@ -40,4 +52,4 @@ window.addEventListener('DOMContentLoaded', function (e) { .use(i18n) .mount(el); }); -}) +}); diff --git a/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig b/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig index 4b9b69c30..710bb00ae 100644 --- a/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig +++ b/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig @@ -1,4 +1,4 @@ -
    +

    @@ -70,6 +70,7 @@ {% if is_granted('CHILL_MAIN_NOTIFICATION_UPDATE', notification) %} diff --git a/src/Bundle/ChillMainBundle/Resources/views/Notification/extension_list_notifications_for.html.twig b/src/Bundle/ChillMainBundle/Resources/views/Notification/extension_list_notifications_for.html.twig index 31267e135..ebe498d0d 100644 --- a/src/Bundle/ChillMainBundle/Resources/views/Notification/extension_list_notifications_for.html.twig +++ b/src/Bundle/ChillMainBundle/Resources/views/Notification/extension_list_notifications_for.html.twig @@ -4,7 +4,7 @@

    {# TODO pagination or limit #} {% for notification in notifications %} -
    +
    {% if not notification.isSystem %} {% if notification.sender == app.user %} @@ -17,6 +17,7 @@ From 20fcaa5428d1dbb9b93db83889343fb6205ec193 Mon Sep 17 00:00:00 2001 From: Mathieu Jaumotte Date: Fri, 14 Jan 2022 15:03:36 +0100 Subject: [PATCH 06/15] notification: add prefix in object --- .../Resources/views/Notification/_list_item.html.twig | 2 +- src/Bundle/ChillMainBundle/translations/messages.fr.yml | 1 + 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig b/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig index 710bb00ae..3cead3aff 100644 --- a/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig +++ b/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig @@ -2,7 +2,7 @@

    - {{ notification.title }} + {{ 'notification.object_prefix'|trans ~ notification.title }}

    diff --git a/src/Bundle/ChillMainBundle/translations/messages.fr.yml b/src/Bundle/ChillMainBundle/translations/messages.fr.yml index d990790e0..2e726a48c 100644 --- a/src/Bundle/ChillMainBundle/translations/messages.fr.yml +++ b/src/Bundle/ChillMainBundle/translations/messages.fr.yml @@ -381,4 +381,5 @@ notification: you were notified by system: Vous avez été notifié automatiquement subject: Objet see_comments_thread: Voir le fil de commentaires associé + object_prefix: "[CHILL] notification - " From 22022e5143419c8ed63b8469f5faeb2309b0b880 Mon Sep 17 00:00:00 2001 From: Mathieu Jaumotte Date: Fri, 14 Jan 2022 20:02:00 +0100 Subject: [PATCH 07/15] JS toggle class read/unread status works on *all* container (change DOM selector) --- .../public/module/notification/toggle_read.js | 16 ++++++++-------- .../views/Notification/_list_item.html.twig | 2 +- .../extension_list_notifications_for.html.twig | 2 +- 3 files changed, 10 insertions(+), 10 deletions(-) diff --git a/src/Bundle/ChillMainBundle/Resources/public/module/notification/toggle_read.js b/src/Bundle/ChillMainBundle/Resources/public/module/notification/toggle_read.js index 9788ca82a..68b06b76a 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/module/notification/toggle_read.js +++ b/src/Bundle/ChillMainBundle/Resources/public/module/notification/toggle_read.js @@ -6,7 +6,7 @@ const i18n = _createI18n({}); window.addEventListener('DOMContentLoaded', function (e) { document.querySelectorAll('.notification_toggle_read_status') - .forEach(function (el) { + .forEach(function (el, i) { createApp({ template: ' +

    diff --git a/src/Bundle/ChillMainBundle/Resources/views/Notification/extension_list_notifications_for.html.twig b/src/Bundle/ChillMainBundle/Resources/views/Notification/extension_list_notifications_for.html.twig index ebe498d0d..8bb695078 100644 --- a/src/Bundle/ChillMainBundle/Resources/views/Notification/extension_list_notifications_for.html.twig +++ b/src/Bundle/ChillMainBundle/Resources/views/Notification/extension_list_notifications_for.html.twig @@ -4,7 +4,7 @@

    {# TODO pagination or limit #} {% for notification in notifications %} -
    +
    {% if not notification.isSystem %} {% if notification.sender == app.user %} From 120ce40dbed11488649350fa8ce6374fabb5e070 Mon Sep 17 00:00:00 2001 From: Mathieu Jaumotte Date: Sat, 15 Jan 2022 17:13:20 +0100 Subject: [PATCH 08/15] notification list: use bootstrap accordion to fold/unfold notification content --- .../public/chill/scss/notification.scss | 12 ++ .../views/Notification/_list_item.html.twig | 201 ++++++++++-------- .../views/Notification/list.html.twig | 6 +- 3 files changed, 130 insertions(+), 89 deletions(-) diff --git a/src/Bundle/ChillMainBundle/Resources/public/chill/scss/notification.scss b/src/Bundle/ChillMainBundle/Resources/public/chill/scss/notification.scss index af0f058d5..93e9bd152 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/chill/scss/notification.scss +++ b/src/Bundle/ChillMainBundle/Resources/public/chill/scss/notification.scss @@ -66,3 +66,15 @@ div.notification-show { } } } + +// Override bootstrap accordion +div#notification-fold { + .accordion-button { + padding: 0; + background-color: unset; + &:not(.collapsed) { + background-color: unset; + box-shadow: unset; + } + } +} diff --git a/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig b/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig index 836993924..62b593725 100644 --- a/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig +++ b/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig @@ -1,91 +1,118 @@
    -
    -

    - - {{ 'notification.object_prefix'|trans ~ notification.title }} - -

    -
    -
    -
    -
      - {% if step is not defined or step == 'inbox' %} -
    • - - - {{ 'notification.from'|trans }} : - - - {% if not notification.isSystem %} - - {{ notification.sender|chill_entity_render_string }} - - {% else %} - {{ 'notification.is_system'|trans }} - {% endif %} -
      • - {% endif %} - {% if notification.addressees|length > 0 %} -
    • - - - {{ 'notification.to'|trans }} : - - - {% for a in notification.addressees %} - - {{ a|chill_entity_render_string }} - - {% endfor %} -
      • - {% endif %} -
    -
    - -
    - {{ notification.date|format_datetime('long', 'short') }} -
    - -
    -
    -
    - {% include data.template with data.template_data %} -
    -
    -
    -
    - {% if full_content is defined and full_content == 'true' %} - {{ notification.message|chill_markdown_to_html }} - {% else %} - {{ notification.message|u.truncate(250, '…', false)|chill_markdown_to_html }} - {% endif %} -
    -
    - {% if action_button is not defined or action_button != 'false' %} -
    -
      -
    • - {# Vue component #} - -
      • - {% if is_granted('CHILL_MAIN_NOTIFICATION_UPDATE', notification) %} -
    • - -
      • - {% endif %} - {% if is_granted('CHILL_MAIN_NOTIFICATION_SEE', notification) %} -
    • - -
      • - {% endif %} -
    -
    + {% if fold_item is defined and fold_item != 'false' %} +
    + + {% endif %} + +
    +
    +
      + {% if step is not defined or step == 'inbox' %} +
    • + + + {{ 'notification.from'|trans }} : + + + {% if not notification.isSystem %} + + {{ notification.sender|chill_entity_render_string }} + + {% else %} + {{ 'notification.is_system'|trans }} + {% endif %} +
      • + {% endif %} + {% if notification.addressees|length > 0 %} +
    • + + + {{ 'notification.to'|trans }} : + + + {% for a in notification.addressees %} + + {{ a|chill_entity_render_string }} + + {% endfor %} +
      • + {% endif %} +
    +
    +
    + {{ notification.date|format_datetime('long', 'short') }} +
    +
    + + {% if fold_item is defined and fold_item != 'false' %} +
    +
    + {% endif %} + +
    +
    + {% include data.template with data.template_data %} +
    +
    +
    +
    + {% if full_content is defined and full_content == 'true' %} + {{ notification.message|chill_markdown_to_html }} + {% else %} + {{ notification.message|u.truncate(250, '…', false)|chill_markdown_to_html }} + {% endif %} +
    +
    + {% if action_button is not defined or action_button != 'false' %} +
    +
      +
    • + {# Vue component #} + +
      • + {% if is_granted('CHILL_MAIN_NOTIFICATION_UPDATE', notification) %} +
    • + +
      • + {% endif %} + {% if is_granted('CHILL_MAIN_NOTIFICATION_SEE', notification) %} +
    • + +
      • + {% endif %} +
    +
    + {% endif %} + + {% if fold_item is defined and fold_item != 'false' %} +
    + {% endif %} +
    diff --git a/src/Bundle/ChillMainBundle/Resources/views/Notification/list.html.twig b/src/Bundle/ChillMainBundle/Resources/views/Notification/list.html.twig index cd0cc5b67..a8a3eb7e8 100644 --- a/src/Bundle/ChillMainBundle/Resources/views/Notification/list.html.twig +++ b/src/Bundle/ChillMainBundle/Resources/views/Notification/list.html.twig @@ -46,10 +46,12 @@

    {{ 'notification.Any notification sent'|trans }}

    {% endif %} {% else %} -
    +
    {% for data in datas %} {% set notification = data.notification %} - {% include 'ChillMainBundle:Notification:_list_item.html.twig' %} + {% include 'ChillMainBundle:Notification:_list_item.html.twig' with { + 'fold_item': 'true' + } %} {% endfor %}
    {% endif %} From d8065514776ee9b6d33ef01620348daa321f095e Mon Sep 17 00:00:00 2001 From: Mathieu Jaumotte Date: Sat, 15 Jan 2022 20:33:31 +0100 Subject: [PATCH 09/15] notification, list item: manage option fold_item with macro --- .../views/Notification/_list_item.html.twig | 221 +++++++++--------- 1 file changed, 111 insertions(+), 110 deletions(-) diff --git a/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig b/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig index 62b593725..91de10f99 100644 --- a/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig +++ b/src/Bundle/ChillMainBundle/Resources/views/Notification/_list_item.html.twig @@ -1,118 +1,119 @@ +{% macro title(c) %} +
    +

    + + {{ 'notification.object_prefix'|trans ~ c.notification.title }} + +

    +
    +{% endmacro %} + +{% macro header(c) %} +
    +
    +
      + {% if c.step is not defined or c.step == 'inbox' %} +
    • + + + {{ 'notification.from'|trans }} : + + + {% if not c.notification.isSystem %} + + {{ c.notification.sender|chill_entity_render_string }} + + {% else %} + {{ 'notification.is_system'|trans }} + {% endif %} +
      • + {% endif %} + {% if c.notification.addressees|length > 0 %} +
    • + + + {{ 'notification.to'|trans }} : + + + {% for a in c.notification.addressees %} + + {{ a|chill_entity_render_string }} + + {% endfor %} +
      • + {% endif %} +
    +
    +
    + {{ c.notification.date|format_datetime('long', 'short') }} +
    +
    +{% endmacro %} + +{% macro content(c) %} +
    +
    + {% include c.data.template with c.data.template_data %} +
    +
    +
    +
    + {% if c.full_content is defined and c.full_content == 'true' %} + {{ c.notification.message|chill_markdown_to_html }} + {% else %} + {{ c.notification.message|u.truncate(250, '…', false)|chill_markdown_to_html }} + {% endif %} +
    +
    + {% if c.action_button is not defined or c.action_button != 'false' %} +
    +
      +
    • + {# Vue component #} + +
      • + {% if is_granted('CHILL_MAIN_NOTIFICATION_UPDATE', c.notification) %} +
    • + +
      • + {% endif %} + {% if is_granted('CHILL_MAIN_NOTIFICATION_SEE', c.notification) %} +
    • + +
      • + {% endif %} +
    +
    + {% endif %} +{% endmacro %} +
    {% if fold_item is defined and fold_item != 'false' %} -
    - - {% endif %} - -
    -
    -
      - {% if step is not defined or step == 'inbox' %} -
    • - - - {{ 'notification.from'|trans }} : - - - {% if not notification.isSystem %} - - {{ notification.sender|chill_entity_render_string }} - - {% else %} - {{ 'notification.is_system'|trans }} - {% endif %} -
      • - {% endif %} - {% if notification.addressees|length > 0 %} -
    • - - - {{ 'notification.to'|trans }} : - - - {% for a in notification.addressees %} - - {{ a|chill_entity_render_string }} - - {% endfor %} -
      • - {% endif %} -
    -
    -
    - {{ notification.date|format_datetime('long', 'short') }} -
    +
    + + {{ _self.header(_context) }}
    - - {% if fold_item is defined and fold_item != 'false' %} -
    -
    - {% endif %} - -
    -
    - {% include data.template with data.template_data %} -
    +
    + {{ _self.content(_context) }}
    -
    -
    - {% if full_content is defined and full_content == 'true' %} - {{ notification.message|chill_markdown_to_html }} - {% else %} - {{ notification.message|u.truncate(250, '…', false)|chill_markdown_to_html }} - {% endif %} -
    -
    - {% if action_button is not defined or action_button != 'false' %} -
    -
      -
    • - {# Vue component #} - -
      • - {% if is_granted('CHILL_MAIN_NOTIFICATION_UPDATE', notification) %} -
    • - -
      • - {% endif %} - {% if is_granted('CHILL_MAIN_NOTIFICATION_SEE', notification) %} -
    • - -
      • - {% endif %} -
    -
    - {% endif %} - - {% if fold_item is defined and fold_item != 'false' %} -
    + {% else %} + {{ _self.title(_context) }} + {{ _self.header(_context) }} + {{ _self.content(_context) }} {% endif %}
    From 7e932e838f9b9d7dbad306e87a515b622be6bc4b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Julien=20Fastr=C3=A9?= Date: Mon, 17 Jan 2022 15:28:49 +0100 Subject: [PATCH 10/15] Squashed commit of the following: MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit commit 9e767fa3e0788d87437c235e51fcdc4f26f75d98 Author: Julien Fastré Date: Mon Jan 17 15:28:02 2022 +0100 traductions commit db6513474377b702cc2258be3e2ba720d007bc11 Author: nobohan Date: Mon Jan 17 12:17:22 2022 +0100 add person: increase z-index of toast and wait for validation before closing modal commit 7af4c3434ef39b27eb51881611338b50a379acc8 Merge: a09c8ee8a 46c6d0e29 Author: Julien Fastré Date: Sun Jan 16 22:51:45 2022 +0100 Merge remote-tracking branch 'origin/master' into issue357_front_end_validation commit a09c8ee8af962021b9d6a402863c8c5671c0e621 Author: nobohan Date: Wed Jan 12 15:47:11 2022 +0100 upd CHANGELOG commit a312a9463d861659f70909bed7d8aa67fef444f2 Author: nobohan Date: Wed Jan 12 15:29:32 2022 +0100 address: display error message if some fields are empty (street & streetnumber) commit 0035128138ddd3d877befae3e489329634555f79 Author: nobohan Date: Wed Jan 12 14:47:43 2022 +0100 address: display error message if some fields are empty commit 49cb15467297bd24c5eb9a0dd7e366ccd7744679 Author: nobohan Date: Tue Jan 11 20:58:00 2022 +0100 address: add field validation (WIP) commit 1a7ec9e39631e00d59fcb3204a157e1583679cda Author: nobohan Date: Tue Jan 11 17:16:43 2022 +0100 Activity: fix vuejs warning commit fa0b9271c2b4963564fdc1e0eda09a12758caa4b Author: nobohan Date: Tue Jan 11 16:13:23 2022 +0100 location: treat 422 error when POSTing new location commit c7b9a1a3fe8891f80699faa2dd277064dce7b0b6 Author: nobohan Date: Tue Jan 11 16:00:29 2022 +0100 location: fix error when creating a new location: a new location could not be added to the availableLocations due to refactoring commit f1c61a2387df7507c79c55e7defe46fbb052df6c Author: nobohan Date: Tue Jan 11 15:20:33 2022 +0100 person: treat 422 error in AddPerson for thirdparty commit 8f6a70b240c286c18e1a102953f243e57b4af97a Author: nobohan Date: Tue Jan 11 11:30:05 2022 +0100 person: add validation for required fields in on-the-fly person commit 40e4bf953fa8e9a04a34e0330562bd25324c5589 Author: nobohan Date: Tue Jan 11 09:34:15 2022 +0100 vuejs: better violations message in 422 error handling commit 378f3a16fc34228334cd44b9e7ca618bc7eb72aa Author: nobohan Date: Mon Jan 10 18:11:02 2022 +0100 person: on-the-fly person: first implementation of makeFetch for posting person --- CHANGELOG.md | 2 + .../Resources/public/vuejs/Activity/App.vue | 2 +- .../vuejs/Activity/components/Location.vue | 2 +- .../components/Location/NewLocation.vue | 52 ++++++++-------- .../Resources/public/vuejs/Activity/index.js | 6 +- .../Resources/public/vuejs/Activity/store.js | 3 + .../Resources/public/chill/chillmain.scss | 5 ++ .../Resources/public/lib/api/apiMethods.js | 4 +- .../vuejs/Address/components/AddAddress.vue | 25 +++++++- .../AddAddress/AddressSelection.vue | 12 +++- .../components/AddAddress/CitySelection.vue | 12 +++- .../AddAddress/CountrySelection.vue | 18 ++++-- .../vuejs/Address/components/EditPane.vue | 20 ++++++- .../vuejs/OnTheFly/components/OnTheFly.vue | 17 +++++- .../ChillPersonBundle/Entity/Person.php | 7 +-- .../public/vuejs/_components/AddPersons.vue | 53 ++++++++++------ .../vuejs/_components/OnTheFly/Person.vue | 60 +++++++++++++++---- .../translations/validators.fr.yml | 3 + 18 files changed, 226 insertions(+), 77 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 568224874..233c1f51b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -17,6 +17,8 @@ and this project adheres to * [main] Add mainLocation field to User entity and add it in user form type * [course list in person context] show full username/label for ref * [accompanying period work] remove the possibility to generate document from an accompanying period work +* vuejs: add validation on required fields for AddPerson, Address and Location components +* vuejs: treat 422 validation errors in locations and AddPerson components ## Test releases diff --git a/src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/App.vue b/src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/App.vue index 2fb9d022d..4809a5fae 100644 --- a/src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/App.vue +++ b/src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/App.vue @@ -11,7 +11,7 @@ import Location from './components/Location.vue'; export default { name: "App", - props: ['hasSocialIssues', 'hasLocation', 'hasPerson'], + props: ['hasSocialIssues', 'hasLocation', 'hasPerson'], components: { ConcernedGroups, SocialIssuesAcc, diff --git a/src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/components/Location.vue b/src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/components/Location.vue index b8249ccc5..91c5db839 100644 --- a/src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/components/Location.vue +++ b/src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/components/Location.vue @@ -24,7 +24,7 @@ v-model="location" > - +
    diff --git a/src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/components/Location/NewLocation.vue b/src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/components/Location/NewLocation.vue index 35bf9a065..c9a1c233c 100644 --- a/src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/components/Location/NewLocation.vue +++ b/src/Bundle/ChillActivityBundle/Resources/public/vuejs/Activity/components/Location/NewLocation.vue @@ -18,15 +18,6 @@ @@ -23,7 +25,7 @@ import VueMultiselect from 'vue-multiselect'; export default { name: 'CountrySelection', components: { VueMultiselect }, - props: ['context', 'entity'], + props: ['context', 'entity', 'flag', 'checkErrors'], emits: ['getCities'], data() { return { @@ -34,14 +36,13 @@ export default { }, computed: { sortedCountries() { - //console.log('sorted countries'); const countries = this.entity.loaded.countries; let sortedCountries = []; sortedCountries.push(...countries.filter(c => c.countryCode === 'FR')) sortedCountries.push(...countries.filter(c => c.countryCode === 'BE')) sortedCountries.push(...countries.filter(c => c.countryCode !== 'FR').filter(c => c.countryCode !== 'BE')) return sortedCountries; - } + }, }, mounted() { this.init(); @@ -50,6 +51,7 @@ export default { init() { if (this.value !== undefined) { this.selectCountry(this.value); + this.flag.dirty = false; } }, selectCountryByCode(countryCode) { @@ -62,7 +64,13 @@ export default { //console.log('select country', value); this.entity.selected.country = value; this.$emit('getCities', value); - } + this.checkErrors(); + }, + remove() { + this.flag.dirty = true; + this.entity.selected.country = null; + this.checkErrors(); + }, } }; diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/EditPane.vue b/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/EditPane.vue index af1263b43..486d28e73 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/EditPane.vue +++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/Address/components/EditPane.vue @@ -7,6 +7,12 @@ Loading...
    +
    +
      +
    • {{ e }}
      • +
    +
    +

    {{ $t('select_an_address_title') }}

    @@ -25,6 +31,8 @@ @@ -33,13 +41,17 @@ v-bind:context="context" v-bind:focusOnAddress="focusOnAddress" v-bind:updateMapCenter="updateMapCenter" + v-bind:flag="flag" + v-bind:checkErrors="checkErrors" @getReferenceAddresses="$emit('getReferenceAddresses', selected.city)"> + v-bind:updateMapCenter="updateMapCenter" + v-bind:flag="flag" + v-bind:checkErrors="checkErrors">
    @@ -99,7 +111,9 @@ export default { 'flag', 'entity', 'errorMsg', - 'insideModal' + 'insideModal', + 'errors', + 'checkErrors', ], emits: ['getCities', 'getReferenceAddresses'], data() { @@ -128,7 +142,7 @@ export default { get() { return this.entity.selected.isNoAddress; } - } + }, }, methods: { focusOnAddress() { diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/OnTheFly/components/OnTheFly.vue b/src/Bundle/ChillMainBundle/Resources/public/vuejs/OnTheFly/components/OnTheFly.vue index d4342fdee..8c93eec71 100644 --- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/OnTheFly/components/OnTheFly.vue +++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/OnTheFly/components/OnTheFly.vue @@ -90,7 +90,7 @@ export default { OnTheFlyThirdparty, OnTheFlyCreate }, - props: ['type', 'id', 'action', 'buttonText', 'displayBadge', 'parent'], + props: ['type', 'id', 'action', 'buttonText', 'displayBadge', 'parent', 'canCloseModal'], emits: ['saveFormOnTheFly'], data() { return { @@ -162,7 +162,20 @@ export default { return 'entity-' + this.type + ' badge-' + this.type; } }, + watch: { + canCloseModal: { + handler: function(val, oldVal) { + if (val) { + this.closeModal(); + } + }, + deep: true + } + }, methods: { + closeModal() { + this.modal.showModal = false; + }, openModal() { //console.log('## OPEN ON THE FLY MODAL'); //console.log('## type:', this.type, ', action:', this.action); @@ -200,8 +213,6 @@ export default { // pass datas to parent this.$emit('saveFormOnTheFly', { type: type, data: data }); - - this.modal.showModal = false; }, buildLocation(id, type) { if (type === 'person') { diff --git a/src/Bundle/ChillPersonBundle/Entity/Person.php b/src/Bundle/ChillPersonBundle/Entity/Person.php index 73b83f246..91e430a2f 100644 --- a/src/Bundle/ChillPersonBundle/Entity/Person.php +++ b/src/Bundle/ChillPersonBundle/Entity/Person.php @@ -151,7 +151,6 @@ class Person implements HasCenterInterface, TrackCreationInterface, TrackUpdateI * @var DateTime * * @ORM\Column(type="date", nullable=true) - * @Assert\Date * @Birthdate */ private $birthdate; @@ -259,7 +258,7 @@ class Person implements HasCenterInterface, TrackCreationInterface, TrackUpdateI * @var string * * @ORM\Column(type="string", length=255) - * @Assert\NotBlank + * @Assert\NotBlank(message="The firstname cannot be empty") * @Assert\Length( * max=255, * ) @@ -282,7 +281,7 @@ class Person implements HasCenterInterface, TrackCreationInterface, TrackUpdateI * @var string * * @ORM\Column(type="string", length=9, nullable=true) - * @Assert\NotNull + * @Assert\NotNull(message="The gender must be set") */ private $gender; @@ -326,7 +325,7 @@ class Person implements HasCenterInterface, TrackCreationInterface, TrackUpdateI * @var string * * @ORM\Column(type="string", length=255) - * @Assert\NotBlank + * @Assert\NotBlank(message="The lastname cannot be empty") * @Assert\Length( * max=255, * ) diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/AddPersons.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/AddPersons.vue index f118671ed..59647e160 100644 --- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/AddPersons.vue +++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/AddPersons.vue @@ -66,9 +66,10 @@
    + @saveFormOnTheFly="saveFormOnTheFly" + :canCloseModal="canCloseOnTheFlyModal">
    @@ -91,8 +92,7 @@ import Modal from 'ChillMainAssets/vuejs/_components/Modal'; import OnTheFly from 'ChillMainAssets/vuejs/OnTheFly/components/OnTheFly.vue'; import PersonSuggestion from './AddPersons/PersonSuggestion'; import { searchEntities } from 'ChillPersonAssets/vuejs/_api/AddPersons'; -import { postPerson } from "ChillPersonAssets/vuejs/_api/OnTheFly"; -import { postThirdparty } from "ChillThirdPartyAssets/vuejs/_api/OnTheFly"; +import { makeFetch } from 'ChillMainAssets/lib/api/apiMethods'; export default { name: 'AddPersons', @@ -120,7 +120,8 @@ export default { suggested: [], selected: [], priorSuggestion: {} - } + }, + canCloseOnTheFlyModal: false } }, computed: { @@ -267,22 +268,36 @@ export default { saveFormOnTheFly({ type, data }) { console.log('saveFormOnTheFly from addPersons, type', type, ', data', data); if (type === 'person') { - console.log('type person with', data); - postPerson(data) - .then(person => new Promise((resolve, reject) => { - console.log('onthefly create: post person', person); - this.newPriorSuggestion(person); - resolve(); - })); + makeFetch('POST', '/api/1.0/person/person.json', data) + .then(response => { + this.newPriorSuggestion(response); + this.canCloseOnTheFlyModal = true; + }) + .catch((error) => { + if (error.name === 'ValidationException') { + for (let v of error.violations) { + this.$toast.open({message: v }); + } + } else { + this.$toast.open({message: 'An error occurred'}); + } + }) } else if (type === 'thirdparty') { - console.log('type thirdparty with', data); - postThirdparty(data) - .then(thirdparty => new Promise((resolve, reject) => { - console.log('onthefly create: post thirdparty', thirdparty); - this.newPriorSuggestion(thirdparty); - resolve(); - })); + makeFetch('POST', '/api/1.0/thirdparty/thirdparty.json', data) + .then(response => { + this.newPriorSuggestion(response); + this.canCloseOnTheFlyModal = true; + }) + .catch((error) => { + if (error.name === 'ValidationException') { + for (let v of error.violations) { + this.$toast.open({message: v }); + } + } else { + this.$toast.open({message: 'An error occurred'}); + } + }) } } }, diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/OnTheFly/Person.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/OnTheFly/Person.vue index 799e5651b..9543da3bb 100644 --- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/OnTheFly/Person.vue +++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/OnTheFly/Person.vue @@ -22,24 +22,45 @@
    - +
    - +
    - +
    - @@ -62,8 +83,8 @@
    @@ -71,8 +92,8 @@
    @@ -80,11 +101,17 @@
    +
    +
      +
    • {{ e }}
      • +
    +
    +
    @@ -108,6 +135,7 @@ export default { config: { altNames: [] }, + errors: [] } }, computed: { @@ -183,6 +211,18 @@ export default { } }, methods: { + checkErrors(e) { + this.errors = []; + if (!this.person.lastName) { + this.errors.push("Le nom ne doit pas être vide."); + } + if (!this.person.firstName) { + this.errors.push("Le prénom ne doit pas être vide."); + } + if (!this.person.gender) { + this.errors.push("Le genre doit être renseigné"); + } + }, loadData() { getPerson(this.id) .then(person => new Promise((resolve, reject) => { diff --git a/src/Bundle/ChillPersonBundle/translations/validators.fr.yml b/src/Bundle/ChillPersonBundle/translations/validators.fr.yml index b421e9f43..96cfd565f 100644 --- a/src/Bundle/ChillPersonBundle/translations/validators.fr.yml +++ b/src/Bundle/ChillPersonBundle/translations/validators.fr.yml @@ -16,6 +16,9 @@ The birthdate must be before %date%: La date de naissance doit être avant le %d 'Invalid phone number: it should begin with the international prefix starting with "+", hold only digits and be smaller than 20 characters. Ex: +33623456789': 'Numéro de téléphone invalide: il doit commencer par le préfixe international précédé de "+", ne comporter que des chiffres et faire moins de 20 caractères. Ex: +33623456789' 'The email is not valid': 'Le courriel n''est pas valide' Two addresses has the same validFrom date: La date de validité est identique à celle d'une autre adresse +The firstname cannot be empty: Le prénom ne peut pas être vide +The lastname cannot be empty: Le nom de famille ne peut pas être vide +The gender must be set: Le genre doit être renseigné #export list You must select at least one element: Vous devez sélectionner au moins un élément From 59b2b07a21ba5b14c8f8e17bb5e943fc7c9887b3 Mon Sep 17 00:00:00 2001 From: Julie Lenaerts Date: Mon, 17 Jan 2022 18:04:43 +0100 Subject: [PATCH 11/15] space added between deathdate and age + changelog updated --- CHANGELOG.md | 1 + .../ChillPersonBundle/Resources/views/Entity/person.html.twig | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 233c1f51b..8c78c7a3c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -19,6 +19,7 @@ and this project adheres to * [accompanying period work] remove the possibility to generate document from an accompanying period work * vuejs: add validation on required fields for AddPerson, Address and Location components * vuejs: treat 422 validation errors in locations and AddPerson components +* [person]: space added between deathdate and age in twig renderbox (https://gitlab.com/champs-libres/departement-de-la-vendee/chill/-/issues/380) ## Test releases diff --git a/src/Bundle/ChillPersonBundle/Resources/views/Entity/person.html.twig b/src/Bundle/ChillPersonBundle/Resources/views/Entity/person.html.twig index 61bf3e83b..622318643 100644 --- a/src/Bundle/ChillPersonBundle/Resources/views/Entity/person.html.twig +++ b/src/Bundle/ChillPersonBundle/Resources/views/Entity/person.html.twig @@ -90,7 +90,7 @@ {#- must be on one line to avoid spaces with dash -#} {%- if options['addAge'] -%} - {{ 'years_old'|trans({ 'age': person.age }) }} +  {{ 'years_old'|trans({ 'age': person.age }) }} {%- endif -%} {%- elseif person.birthdate is not null -%}