2023-12-19 12:51:30 +01:00
= render partial: 'administrateurs/breadcrumbs',
locals: { steps: [['Démarches', admin_procedures_path],
[@procedure.libelle.truncate_words(10), admin_procedure_path(@procedure)],
['Attestation']] }
2023-12-22 14:13:20 +01:00
= render NestedForms::FormOwnerComponent.new
2023-12-22 14:24:39 +01:00
= form_for @attestation_template, url: admin_procedure_attestation_template_v2_path(@procedure), html: { multipart: true },
data: { turbo: 'true',
controller: 'autosubmit attestation',
attestation_logo_attachment_official_label_value: AttestationTemplate.human_attribute_name(:logo_additional),
attestation_logo_attachment_free_label_value: AttestationTemplate.human_attribute_name(:logo) } do |f|
#attestation-edit.fr-container.fr-mt-4w{ data: { controller: 'tiptap' } }
2024-01-12 12:20:06 +01:00
.fr-mb-6w
= render Dsfr::AlertComponent.new(state: :info, title: "Nouvel éditeur d’ attestation", heading_level: 'h3') do |c|
- c.with_body do
Cette page permet la mise en forme de l’ attestation avec un nouvel éditeur plus flexible
tout en respectant la charte de l’ état. Essayez-la et donnez-nous votre avis
en nous envoyant un email à #{mail_to(CONTACT_EMAIL, subject: "Feedback attestation v2")}.
%br
%strong Les attestations délivrées suivent encore l’ ancien format :
l’ activation des attestations basées sur ce format sera bientôt disponible.
%br
= link_to("Suivez ce lien pour revenir aux attestations actuellement délivrées", edit_admin_procedure_attestation_template_path(@procedure))
2023-12-22 14:24:39 +01:00
.fr-grid-row.fr-grid-row--gutters
.fr-col-12.fr-col-md-8
2023-12-19 12:51:30 +01:00
%fieldset.fr-fieldset{ aria: { labelledby: 'edit-attestation' } }
%legend.fr-fieldset__legend#edit-attestation
%h1.fr-h2 Attestation
%p.fr-text--regular
L’ attestation est émise au moment où un dossier est accepté, elle est jointe à l’ email d’ accusé d’ acceptation.
Elle est également disponible au téléchargement depuis l’ espace personnel de l’ usager.
2023-12-22 14:24:39 +01:00
.fr-fieldset__element
.fr-toggle
= f.check_box :official_layout, class: "fr-toggle-input", id: dom_id(@attestation_template, :official_layout), data: { "attestation-target": "layoutToggle"}
%label.fr-toggle__label{ for: dom_id(@attestation_template, :official_layout), data: { fr_checked_label: "Activé", fr_unchecked_label: "Désactivé" } }
Je souhaite générer une attestation à la charte de l’ état (logo avec Marianne)
2023-12-19 12:51:30 +01:00
.fr-fieldset__element.fr-mt-2w
2024-01-19 10:14:14 +01:00
%h2.fr-h4 En-tête
2023-12-19 12:51:30 +01:00
2023-12-22 14:24:39 +01:00
.fr-fieldset__element{ class: class_names("hidden" => !@attestation_template.official_layout?), data: { "attestation-target": 'logoMarianneLabelFieldset'} }
2024-01-12 12:49:49 +01:00
= render Dsfr::InputComponent.new(form: f, attribute: :label_logo, input_type: :text_area, required: @attestation_template.official_layout?, opts: { rows: 3, data: { controller: :textarea, textarea_max_rows_value: 3 } }) do |c|
2023-12-19 12:51:30 +01:00
- c.with_hint { "Exemple: Ministère de la Mer. 3 lignes maximum" }
2023-12-22 14:24:39 +01:00
.fr-fieldset__element{ data: { attestation_target: 'logoAttachmentFieldset' } }
%label.fr-label{ for: field_id(@attestation_template, :logo) }
- if @attestation_template.official_layout?
= AttestationTemplate.human_attribute_name(:logo_additional)
- else
= AttestationTemplate.human_attribute_name(:logo)
%span.fr-hint-text
Dimensions conseillées : au minimum 500px de largeur ou de hauteur.
2023-12-22 14:13:20 +01:00
%div{ id: dom_id(@attestation_template, :logo_attachment) }
= render Attachment::EditComponent.new(attached_file: @attestation_template.logo, direct_upload: false)
2023-12-19 12:51:30 +01:00
.fr-fieldset__element
2024-01-10 17:24:36 +01:00
= render Dsfr::InputComponent.new(form: f, attribute: :label_direction, input_type: :text_area, required: false, opts: { rows: 2, data: { controller: :textarea, textarea_max_rows_value: 2 } }) do |c|
2023-12-19 12:51:30 +01:00
- c.with_hint { "Exemple: Direction interministérielle du numérique. 2 lignes maximum" }
.fr-fieldset__element.fr-mt-2w
2024-01-19 10:14:14 +01:00
%label.fr-label.fr-h4
2023-12-19 12:51:30 +01:00
= AttestationTemplate.human_attribute_name :body
= render EditableChamp::AsteriskMandatoryComponent.new
.editor.mt-2{ data: { tiptap_target: 'editor' } }
= f.hidden_field :tiptap_body, data: { tiptap_target: 'input' }
.fr-fieldset__element
.flex.flex-gap-2
- @buttons.each do |buttons|
.flex.flex-gap-1
- buttons.each do |(label, action, icon)|
%button.fr-btn.fr-btn--secondary.fr-btn--sm{ type: 'button', title: label, class: "fr-icon-#{icon}", data: { action: 'click->tiptap#menuButton', tiptap_target: 'button', tiptap_action: action } }
= label
.fr-fieldset__element
2024-01-19 10:14:14 +01:00
%label.fr-label
Balises
%p.fr-hint-text
Intégrez à l’ attestation du texte issu du dossier. Cliquez sur un bouton de balise pour l’ ajouter là où se trouve le curseur, ou tapez dans l’ éditeur le caractère
%code @
suivi du nom de la balise. Les balises pour les champs conditionnés ne sont pas disponibles.
2023-12-19 12:51:30 +01:00
2024-01-19 10:14:14 +01:00
= render TagsButtonListComponent.new(tags: @attestation_template.tags_categorized)
2024-01-18 13:12:09 +01:00
2023-12-19 12:51:30 +01:00
.fr-fieldset__element.fr-mt-2w
2024-01-19 10:14:14 +01:00
%h2.fr-h4 Pied de page
2023-12-19 12:51:30 +01:00
.fr-fieldset__element
%label.fr-label{ for: field_id(@attestation_template, :signature) } Tampon ou signature
%span.fr-hint-text
Dimensions conseillées : au minimum 500px de largeur ou de hauteur.
2023-12-22 14:13:20 +01:00
%div{ id: dom_id(@attestation_template, :signature_attachment) }
= render Attachment::EditComponent.new(attached_file: @attestation_template.signature, direct_upload: false)
2023-12-19 12:51:30 +01:00
.fr-fieldset__element
2024-01-10 17:24:36 +01:00
= render Dsfr::InputComponent.new(form: f, attribute: :footer, input_type: :text_area, required: false, opts: { rows: 3, data: { controller: :textarea, textarea_max_rows_value: 3 } }) do |c|
2023-12-19 12:51:30 +01:00
- c.with_hint { "Exemple: 20 avenue de Ségur, 75007 Paris" }
2023-12-22 14:24:39 +01:00
.fr-col-12.fr-col-md-4.fr-background-alt--blue-france
2024-01-10 18:17:12 +01:00
= image_tag("attestation-template-schema-official.jpg", class: "attestation-schema", alt: "Schéma d’ une attestation au modèle de l’ état")
2023-12-22 14:24:39 +01:00
2023-12-22 14:14:41 +01:00
.padded-fixed-footer
.fixed-footer
.fr-container
.fr-grid-row
2024-01-12 12:20:06 +01:00
.fr-col-7
2023-12-22 14:14:41 +01:00
%ul.fr-btns-group.fr-btns-group--inline-md
%li
= f.button 'Enregistrer', class: 'fr-btn'
%li
2024-01-12 12:50:04 +01:00
= link_to 'Prévisualiser l’ attestation PDF', admin_procedure_attestation_template_v2_path(@procedure, format: :pdf), class: 'fr-btn fr-btn--secondary', target: '_blank', rel: 'noopener'
2023-12-22 14:14:41 +01:00
%li
= link_to 'Annuler', admin_procedure_path(id: @procedure), class: 'fr-btn fr-btn--tertiary-no-outline', data: { confirm: 'Êtes-vous sûr de vouloir annuler les modifications effectuées ?'}
2024-01-12 12:20:06 +01:00
.fr-col-5
-# .fr-toggle
-# = f.check_box :activated, class: "fr-toggle-input", disabled: true, id: dom_id(@attestation_template, :activated)
-# %label.fr-toggle__label{ for: dom_id(@attestation_template, :activated), data: { fr_checked_label: "Attestation activée", fr_unchecked_label: "Attestation désactivée" } }
%p.fr-pt-1w.fr-hint-text.text-right L’ activation de cette attestation sera bientôt disponible.