a11y(select): use new ComboMultiple component

This commit is contained in:
Paul Chavard 2022-01-05 11:42:33 +01:00
parent d6b6bb0f2a
commit 3513182e7c
6 changed files with 44 additions and 34 deletions

View file

@ -44,14 +44,15 @@
.instructeur-wrapper .instructeur-wrapper
%p.notice Pendant l'instruction dun dossier, les instructeurs peuvent demander leur avis à un ou plusieurs experts. %p.notice Pendant l'instruction dun dossier, les instructeurs peuvent demander leur avis à un ou plusieurs experts.
%p.notice Entrez les adresses email des experts que vous souhaitez affecter à cette démarche %p#experts-emails.notice Entrez les adresses email des experts que vous souhaitez affecter à cette démarche
- hidden_field_id = SecureRandom.uuid = hidden_field_tag :emails, nil
= hidden_field_tag :emails, nil, data: { uuid: hidden_field_id } = react_component("ComboMultiple",
= react_component("ComboMultipleDropdownList",
options: [], options: [],
selected: [], disabled: [], selected: [], disabled: [],
hiddenFieldId: hidden_field_id, group: '.instructeur-wrapper',
label: 'email expert', name: 'emails',
label: 'Emails',
describedby: 'experts-emails',
acceptNewValues: true) acceptNewValues: true)
= f.submit 'Affecter à la démarche', class: 'button primary send' = f.submit 'Affecter à la démarche', class: 'button primary send'

View file

@ -5,12 +5,12 @@
.instructeur-wrapper .instructeur-wrapper
- if !procedure.routee? - if !procedure.routee?
%p.notice Entrez les adresses email des instructeurs que vous souhaitez affecter à cette démarche %p.notice Entrez les adresses email des instructeurs que vous souhaitez affecter à cette démarche
- hidden_field_id = SecureRandom.uuid = hidden_field_tag :emails, nil
= hidden_field_tag :emails, nil, data: { uuid: hidden_field_id } = react_component("ComboMultiple",
= react_component("ComboMultipleDropdownList",
options: available_instructeur_emails, selected: [], disabled: [], options: available_instructeur_emails, selected: [], disabled: [],
hiddenFieldId: hidden_field_id, group: '.instructeur-wrapper',
label: 'email instructeur', name: 'emails',
label: 'Emails',
acceptNewValues: true) acceptNewValues: true)
= f.submit 'Affecter', class: 'button primary send' = f.submit 'Affecter', class: 'button primary send'

View file

@ -4,13 +4,12 @@
%p.avis-notice Les invités pourront consulter le dossier, donner un avis et contribuer au fil de messagerie. Ils ne pourront pas modifier le dossier. %p.avis-notice Les invités pourront consulter le dossier, donner un avis et contribuer au fil de messagerie. Ils ne pourront pas modifier le dossier.
= form_for avis, url: url, html: { class: 'form', data: { persisted_content_id: "expert-ask-avis-for-dossier-#{@avis.dossier.id}" } } do |f| = form_for avis, url: url, html: { class: 'form', data: { persisted_content_id: "expert-ask-avis-for-dossier-#{@avis.dossier.id}" } } do |f|
- hidden_field_id = SecureRandom.uuid = hidden_field_tag 'avis[emails]', nil
= hidden_field_tag 'avis[emails]', nil, data: { uuid: hidden_field_id } = react_component("ComboMultiple",
= react_component("ComboMultipleDropdownList", options: [], selected: [], disabled: [],
options: [], group: '.ask-avis',
selected: [], disabled: [], name: 'emails',
hiddenFieldId: hidden_field_id, label: 'Emails',
label: 'avis_emails',
acceptNewValues: true) acceptNewValues: true)
= f.text_area :introduction, rows: 3, value: avis.introduction || 'Bonjour, merci de me donner votre avis sur ce dossier.', required: true, class: 'persisted-input' = f.text_area :introduction, rows: 3, value: avis.introduction || 'Bonjour, merci de me donner votre avis sur ce dossier.', required: true, class: 'persisted-input'
%p.tab-title Ajouter une pièce jointe %p.tab-title Ajouter une pièce jointe

View file

@ -8,8 +8,12 @@
Le destinataire suivra automatiquement le dossier Le destinataire suivra automatiquement le dossier
= form_for dossier, url: send_to_instructeurs_instructeur_dossier_path(dossier.procedure, dossier), method: :post, html: { class: 'form recipients-form' } do |f| = form_for dossier, url: send_to_instructeurs_instructeur_dossier_path(dossier.procedure, dossier), method: :post, html: { class: 'form recipients-form' } do |f|
.flex.justify-start.align-start .flex.justify-start.align-start
- hidden_field_id = SecureRandom.uuid = hidden_field_tag :recipients, nil
= hidden_field_tag :recipients, nil, data: { uuid: hidden_field_id } = react_component("ComboMultiple",
= react_component("ComboMultipleDropdownList", options: potential_recipients.map{|r| [r.email, r.id]}, selected: [], disabled: [], hiddenFieldId: hidden_field_id, label: "email instructeur") options: potential_recipients.map{|r| [r.email, r.id]},
selected: [], disabled: [],
group: '.recipients-form',
name: 'recipients',
label: 'Emails')
= f.submit "Envoyer", class: "button large send gap-left" = f.submit "Envoyer", class: "button large send gap-left"

View file

@ -96,9 +96,14 @@
Personnaliser Personnaliser
#custom-menu.dropdown-content.fade-in-down #custom-menu.dropdown-content.fade-in-down
= form_tag update_displayed_fields_instructeur_procedure_path(@procedure), method: :patch, class: 'dropdown-form large columns-form' do = form_tag update_displayed_fields_instructeur_procedure_path(@procedure), method: :patch, class: 'dropdown-form large columns-form' do
- hidden_field_id = SecureRandom.uuid = hidden_field_tag :values, nil
= hidden_field_tag :values, nil, data: { uuid: hidden_field_id } = react_component("ComboMultiple",
= react_component("ComboMultipleDropdownList", options: @displayed_fields_options, selected: @displayed_fields_selected, disabled: [], hiddenFieldId: hidden_field_id, label: 'colonne') options: @displayed_fields_options,
selected: @displayed_fields_selected,
disabled: [],
label: 'Colonne à afficher',
group: '.columns-form',
name: 'values')
= submit_tag "Enregistrer", class: 'button' = submit_tag "Enregistrer", class: 'button'

View file

@ -2,20 +2,21 @@
%h1.tab-title Inviter des personnes à donner leur avis %h1.tab-title Inviter des personnes à donner leur avis
%p.avis-notice Les invités pourront consulter le dossier, donner un avis et contribuer au fil de messagerie. Ils ne pourront pas modifier le dossier. %p.avis-notice Les invités pourront consulter le dossier, donner un avis et contribuer au fil de messagerie. Ils ne pourront pas modifier le dossier.
- if @dossier.procedure.experts_require_administrateur_invitation - if @dossier.procedure.experts_require_administrateur_invitation
%p.avis-notice Choisissez des experts à qui vous souhaitez demander un avis parmi la liste prédéfinie par les administrateurs de la démarche %p#avis-emails-description.avis-notice
Choisissez des experts à qui vous souhaitez demander un avis parmi la liste prédéfinie par les administrateurs de la démarche
- else - else
%p.avis-notice Entrez les adresses email des experts à qui vous souhaitez demander un avis %p#avis-emails-description.avis-notice
Entrez les adresses email des experts à qui vous souhaitez demander un avis
= form_for avis, url: url, html: { class: 'form', data: { persisted_content_id: "instructeur-ask-avis-for-dossier-#{@dossier.id}" } } do |f| = form_for avis, url: url, html: { class: 'form', data: { persisted_content_id: "instructeur-ask-avis-for-dossier-#{@dossier.id}" } } do |f|
- hidden_field_id = SecureRandom.uuid = hidden_field_tag 'avis[emails]', nil
= hidden_field_tag 'avis[emails]', nil, data: { uuid: hidden_field_id } = react_component("ComboMultiple",
= react_component("ComboMultipleDropdownList",
options: @dossier.procedure.experts_require_administrateur_invitation ? @experts_emails : [], options: @dossier.procedure.experts_require_administrateur_invitation ? @experts_emails : [],
selected: [], selected: [], disabled: [],
disabled: [], label: 'Emails',
hiddenFieldId: hidden_field_id, group: '.ask-avis',
label: 'avis_emails', name: 'emails',
id: 'avis_emails', describedby: 'avis-emails-description',
acceptNewValues: !@dossier.procedure.experts_require_administrateur_invitation) acceptNewValues: !@dossier.procedure.experts_require_administrateur_invitation)
= f.text_area :introduction, rows: 3, value: avis.introduction || 'Bonjour, merci de me donner votre avis sur ce dossier.', required: true, class: "persisted-input" = f.text_area :introduction, rows: 3, value: avis.introduction || 'Bonjour, merci de me donner votre avis sur ce dossier.', required: true, class: "persisted-input"
%p.tab-title Ajouter une pièce jointe %p.tab-title Ajouter une pièce jointe