From d856969790bdbb66a864c251eed69d48aaff59a8 Mon Sep 17 00:00:00 2001 From: Lisa Durand Date: Tue, 10 Jan 2023 10:19:52 +0100 Subject: [PATCH] add a bit of logic to display batch buttons : if more than 3 we group them in a dropdown --- .../batch_operation_component.fr.yml | 8 +-- .../batch_operation_component.html.haml | 57 +++++++------------ .../_batch_operation_inline_buttons.html.haml | 28 +++++++++ 3 files changed, 52 insertions(+), 41 deletions(-) create mode 100644 app/views/instructeurs/dossiers/_batch_operation_inline_buttons.html.haml diff --git a/app/components/dossiers/batch_operation_component/batch_operation_component.fr.yml b/app/components/dossiers/batch_operation_component/batch_operation_component.fr.yml index ab809deb9..4b4eb45ab 100644 --- a/app/components/dossiers/batch_operation_component/batch_operation_component.fr.yml +++ b/app/components/dossiers/batch_operation_component/batch_operation_component.fr.yml @@ -1,6 +1,6 @@ fr: operations: - archiver: 'Archiver les dossiers sélectionnés' - passer_en_instruction: 'Passer en instruction les dossiers sélectionnés' - accepter: 'Accepter les dossiers sélectionnés' - follow: 'Suivre les dossiers sélectionnés' + archiver: 'Archiver les dossiers' + passer_en_instruction: 'Passer en instruction les dossiers' + accepter: 'Accepter les dossiers' + follow: 'Suivre les dossiers' diff --git a/app/components/dossiers/batch_operation_component/batch_operation_component.html.haml b/app/components/dossiers/batch_operation_component/batch_operation_component.html.haml index cb8d503ee..5548797c8 100644 --- a/app/components/dossiers/batch_operation_component/batch_operation_component.html.haml +++ b/app/components/dossiers/batch_operation_component/batch_operation_component.html.haml @@ -1,41 +1,24 @@ -.batch-operation.fr-ml-auto - - if available_operations[:options].count == 1 - - opt = available_operations[:options].dig(0) - = form_for(BatchOperation.new, url: instructeur_batch_operations_path(procedure_id: procedure.id), method: :post, html: { class: 'fr-ml-auto', id: "#{dom_id(BatchOperation.new)}" }) do |form| - = form.button opt[:label], class: ['fr-btn fr-btn--icon-left', icons[opt[:operation].to_sym]], disabled: true, name: "#{form.object_name}[operation]", value: opt[:operation] +.batch-operation.fr-ml-auto.flex + - if available_operations[:options].count.between?(1,3) + = form_for(BatchOperation.new, url: instructeur_batch_operations_path(procedure_id: procedure.id), method: :post, html: { class: 'form', id: "#{dom_id(BatchOperation.new)}" }) do |form| + - available_operations[:options].each do |opt| + = render partial: "instructeurs/dossiers/batch_operation_inline_buttons", locals: { opt: opt, icons: icons, form: form } + - else - .dropdown{ data: { controller: 'menu-button', popover: 'true' } } - -# Dropdown button title - %button.fr-btn.dropdown-button{ disabled: true, data: { menu_button_target: 'button'} } - Actions multiples + = form_for(BatchOperation.new, url: instructeur_batch_operations_path(procedure_id: procedure.id), method: :post, html: { class: 'form flex', id: "#{dom_id(BatchOperation.new)}" }) do |form| + - available_operations[:options][0,2].each do |opt| + = render partial: "instructeurs/dossiers/batch_operation_inline_buttons", locals: { opt: opt, icons: icons, form: form } - #state-menu.dropdown-content.fade-in-down{ data: { menu_button_target: 'menu' } } - = form_for(BatchOperation.new, url: instructeur_batch_operations_path(procedure_id: procedure.id), method: :post, html: { class: 'form', id: "#{dom_id(BatchOperation.new)}" }) do |form| + .dropdown{ data: { controller: 'menu-button', popover: 'true' } } + -# Dropdown button title + %button.fr-btn.fr-btn--sm.fr-ml-1w.dropdown-button{ disabled: true, data: { menu_button_target: 'button'} } + Autres actions multiples + + #state-menu.dropdown-content.fade-in-down{ data: { menu_button_target: 'menu' } } %ul.dropdown-items - - available_operations[:options].each do |opt| + - available_operations[:options][2, available_operations[:options].count].each do |opt| %li{ 'data-turbo': 'true' } - - if opt[:operation] == 'accepter' - .wrapper - - %a.dropdown-items-link{ href: '#', onclick: "DS.showMotivation(event, 'accept');" } - %span{ class: icons[opt[:operation].to_sym] } - .dropdown-description - %h4= opt[:label] - - .motivation.hidden.accept - = form.text_area :motivation, class: 'motivation-text-area' - .optional-justificatif{ id: "justificatif_motivation_suggest_accept", onclick: "DS.showImportJustificatif('accept');" } - .button Ajouter un justificatif (optionnel) - .hidden{ id: "justificatif_motivation_import_accept" } - = form.file_field :justificatif_motivation, direct_upload: true - - .text-right - %span{ onclick: 'DS.motivationCancel();', class: 'fr-btn fr-btn--secondary' } Annuler - - = form.button "Valider la décision", class: ['fr-btn'], disabled: true, name: "#{form.object_name}[operation]", value: opt[:operation] - - else - = form.button opt[:label], class: 'dropdown-items-link', disabled: true, name: "#{form.object_name}[operation]", value: opt[:operation] do - %span{ class: icons[opt[:operation].to_sym] } - .dropdown-description - %h4= opt[:label] - + = form.button opt[:label], class: 'dropdown-items-link ', disabled: true, name: "#{form.object_name}[operation]", value: opt[:operation] do + %span{ class: icons[opt[:operation].to_sym] } + .dropdown-description + %h4= opt[:label] diff --git a/app/views/instructeurs/dossiers/_batch_operation_inline_buttons.html.haml b/app/views/instructeurs/dossiers/_batch_operation_inline_buttons.html.haml new file mode 100644 index 000000000..cd418ed03 --- /dev/null +++ b/app/views/instructeurs/dossiers/_batch_operation_inline_buttons.html.haml @@ -0,0 +1,28 @@ +- if opt[:operation] == 'accepter' + .dropdown{ data: { controller: 'menu-button', popover: 'true' } } + -# Dropdown button title + %button{ disabled: true, class: ['fr-btn fr-btn--sm fr-btn--icon-left fr-ml-1w', icons[opt[:operation].to_sym]], disabled: true, name: "#{form.object_name}[operation]" , data: { menu_button_target: 'button'} } + = opt[:label] + + #state-menu.dropdown-content.fade-in-down{ data: { menu_button_target: 'menu' } } + %ul.dropdown-items + %li.inactive{ 'data-turbo': 'true' } + - if opt[:operation] == 'accepter' + .wrapper + .dropdown-items-link + %span{ class: icons[opt[:operation].to_sym] } + .dropdown-description + %h4= opt[:label] + + .motivation.accept + = form.text_area :motivation, class: 'motivation-text-area' + .optional-justificatif{ id: "justificatif_motivation_suggest_accept", onclick: "DS.showImportJustificatif('accept');" } + .button Ajouter un justificatif (optionnel) + .hidden{ id: "justificatif_motivation_import_accept" } + = form.file_field :justificatif_motivation, direct_upload: true + + + = form.button "Valider la décision", class: ['fr-btn fr-mt-2w'], disabled: true, name: "#{form.object_name}[operation]", value: opt[:operation] + +- else + = form.button opt[:label], class: ['fr-btn fr-btn--sm fr-btn--icon-left fr-ml-1w', icons[opt[:operation].to_sym]], disabled: true, name: "#{form.object_name}[operation]", value: opt[:operation]