DGNum/demarches-normaliennes
11
1
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity

make publication page clearer for admin

Browse source 
fix default padding on select
This commit is contained in:
Lisa Durand 2023-07-17 10:41:38 +02:00
parent 77bdbf45bc
commit 1bcaf884c4
9 changed files with 175 additions and 161 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
app/assets/stylesheets/flex.scss
View file

@ -63,3 +63,7 @@
.flex-gap-2 {
gap: 2 * $default-spacer; // scss-lint:disable PropertySpelling
}
.flex-1 {
flex: 1;
}

47
app/assets/stylesheets/forms.scss
View file

@ -3,6 +3,23 @@
@import "placeholders";
.form {
input.unstyled {
padding: 0 !important;
background: none !important;
border: none !important;
width: auto !important;
&:focus {
box-shadow: none !important;
background-color: $white !important;
}
}
.placeholder {
color: $dark-grey;
font-style: italic;
}
hr {
width: 100%;
height: 0;
@ -312,36 +329,6 @@
margin-bottom: $default-fields-spacer;
}
select {
// hack found here: https://stackoverflow.com/questions/1895476/how-to-style-a-select-dropdown-with-css-only-without-javascript
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color: #FFFFFF;
background-image: image-url("icons/chevron-down.svg");
background-repeat: no-repeat;
background-size: 14px;
background-position: right 10px center;
padding-right: 4 * $default-spacer;
max-width: 100%;
&.small {
padding-right: 3 * $default-spacer;
}
// CAUTION: IE hackery ahead
&::-ms-expand {
display: none; // remove default arrow in IE 10 and 11 */
}
// target Internet Explorer 9 to undo the custom arrow */
@media screen and (min-width:0\0) {
select {
background: none\9;
}
}
}
[data-reach-combobox-input] {
min-height: 62px;
border-radius: 4px;

3
app/views/administrateurs/_breadcrumbs.html.haml
View file

@ -39,6 +39,9 @@
= t('since', scope: [:layouts, :breadcrumb], number: @procedure.id, date: l(@procedure.published_at.to_date))
- else
%p.fr-mb-1w
= t('more_info_on_test', scope: [:layouts, :breadcrumb])
= link_to t('go_to_FAQ', scope: [:layouts, :breadcrumb]), t("links.common.faq.url"), title: new_tab_suffix(t('go_to_FAQ', scope: [:layouts, :breadcrumb])), **external_link_attributes
.flex
%span.fr-badge.fr-badge--new.fr-mr-1w
= t('draft', scope: [:layouts, :breadcrumb])

4
app/views/administrateurs/procedures/_informations.html.haml
View file

@ -132,7 +132,7 @@
%p.notice
Le
- value = @procedure.auto_archive_on ? @procedure.auto_archive_on - 1.day : nil
= f.date_field :auto_archive_on, id: 'auto_archive_on', value: value
= f.date_field :auto_archive_on, id: 'auto_archive_on', class: 'fr-input', value: value
#{procedure_auto_archive_time(@procedure)}.
= render Dsfr::CalloutComponent.new(title: "Démarche déclarative") do |c|
@ -143,7 +143,7 @@
Soit il passe immédiatement « en instruction » pour être traité soit il est immédiatement « accepté ».
= f.label :declarative_with_state, 'Mentionnez l’état d’avancement (facultatif)', class: 'fr-label fr-mb-2w'
= f.select :declarative_with_state, Procedure.declarative_attributes_for_select, { include_blank: 'Non' }, class: 'form-control'
= f.select :declarative_with_state, Procedure.declarative_attributes_for_select, { include_blank: 'Non' }, class: 'fr-select'
- if !@procedure.piece_justificative_multiple?
.fr-checkbox-group

49
app/views/administrateurs/procedures/_publication_form.html.haml
View file

@ -1,15 +1,38 @@
.card.mb-4
%h2.card-title Publiez votre démarche
= form_tag admin_procedure_publish_path(procedure_id: procedure.id), method: :put, class: 'form' do
= render Procedure::PublicationWarningComponent.new(procedure: procedure)
.mt-2
- if procedure.draft_changed?
%p.mb-2 Publiez une nouvelle version de votre démarche. Les modifications suivantes seront appliquées :
= render Procedure::RevisionChangesComponent.new changes: procedure.revision_changes, previous_revision: procedure.published_revision
- if procedure.close?
= render partial: 'publication_form_inputs', locals: { procedure: procedure, closed_procedures: @closed_procedures }
- else
= form_tag admin_procedure_publish_path(procedure_id: procedure.id), method: :put, class: 'form' do
= render Procedure::PublicationWarningComponent.new(procedure: procedure)
.mt-2
- if procedure.draft_changed?
%p.mb-2 Publiez une nouvelle version de votre démarche. Les modifications suivantes seront appliquées :
= render Dsfr::AlertComponent.new(state: :info, size: :sm, extra_class_names: 'fr-mb-2w') do |c|
- c.body do
= render Procedure::RevisionChangesComponent.new changes: procedure.revision_changes, previous_revision: procedure.published_revision
- if procedure.close?
= render partial: 'publication_form_inputs', locals: { procedure: procedure, closed_procedures: @closed_procedures }
- elsif @procedure.brouillon? && @procedure.missing_steps.empty?
= render partial: 'publication_form_inputs', locals: { procedure: procedure, closed_procedures: @closed_procedures }
= render Dsfr::CalloutComponent.new(title: "Avant de publier", heading_level: 'h2') do |c|
- c.with_body do
%p.fr-mb-2w
Avez-vous bien pensé à informer votre Délégué à la Protection des Données personnelles (DPD).
%a{ href:'https://www.cnil.fr/fr/protection-des-donnees-les-bons-reflexes', target:'_blank' }
https://www.cnil.fr/fr/protection-des-donnees-les-bons-reflexes
.flex.justify-end
= submit_tag procedure_publish_label(procedure, :submit), { disabled: procedure.errors.present?, class: "fr-btn fr-btn--primary", id: 'publish' }
%p.fr-mb-2w
Si votre démarche propose de collecter des données personnelles, vous devez informer votre DPD. Chaque organisme en a un.
%p.fr-mb-2w
Ce dernier pourra vous aider dans la finalisation de votre démarche, et vous inviter à vous interroger sur les données collectées, et sur la pertinence de ces dernières.
N'oubliez pas : toutes les démarches qui contiennent des données personnelles doivent être consignées dans un registre des traitements :
%a{ href:'https://www.cnil.fr/fr/RGDP-le-registre-des-activites-de-traitement', target:'_blank' }
https://www.cnil.fr/fr/RGDP-le-registre-des-activites-de-traitement
%p.fr-mb-2w
Comment faire ?
Vous pouvez soit lui communiquer par email le lien vers la démarche en test, ou bien le nommer « administrateur ». Dans tous les cas, ne publiez votre démarche qu’après avoir eu son avis.
- else
= render partial: 'publication_form_inputs', locals: { procedure: procedure, closed_procedures: @closed_procedures }
.flex.fr-mb-5w
= submit_tag procedure_publish_label(procedure, :submit), { disabled: procedure.errors.present?, class: "fr-btn fr-btn--primary", id: 'publish' }
= link_to 'Annuler et revenir à la page de la démarche', admin_procedure_path(id: @procedure), class: 'fr-btn fr-btn--secondary fr-btn--icon-left fr-icon-arrow-go-back-line fr-ml-1w'

71
app/views/administrateurs/procedures/_publication_form_inputs.html.haml
View file

@ -1,27 +1,48 @@
%p.mb-4{ :class => ("mt-4" if procedure.close? && procedure.draft_changed?) } Publiez votre démarche, et partagez la à vos usagers.
%p Personnalisez le lien public de la démarche pour en faciliter l’accès (<strong>obligatoire pour publier votre démarche</strong>) :
%p.empty-text
= commencer_url(path: '')
= text_field_tag(:path, procedure.path,
id: 'procedure_path',
label: 'Adresse de diffusion',
placeholder: 'chemin-de-la-démarche',
required: true,
class: 'form',
pattern: '^[a-z0-9_-]{3,200}$',
title: "De 3 à 200 caractères; minuscules, chiffres et tiret seulement",
autocomplete: 'off',
style: 'width: 300px; display: inline;')
.text-info.mb-4
Attention, diffusez toujours le <strong>lien complet</strong> affiché ci-dessus, et non pas un lien générique vers #{APPLICATION_NAME}. Ne dites pas non plus aux usagers de se rendre sur le site générique #{APPLICATION_NAME}, donnez-leur toujours le lien complet.
- if closed_procedures.present?
%h2.card-title Cette démarche remplace une close ? Si oui, veuillez indiquer le n° de la démarche remplacée
= select_tag :old_procedure, options_for_select(@closed_procedures), include_blank: true
%h2.card-title Diffusion de la démarche
%p Où les utilisateurs trouveront-ils le lien de la démarche ? Typiquement, il s’agit d’une page de votre site web.
%p.center
= text_field_tag(:lien_site_web, procedure.lien_site_web,
= label_tag :procedure_path, class: 'fr-label' do
Lien de la démarche
%span.fr-hint-text
Renseignez la suite de l’URL pour personnaliser le lien public.
.fr-input-group
.fr-input
.flex
%span.placeholder
= commencer_url(path: '')
= text_field_tag(:path, procedure.path,
id: 'procedure_path',
label: 'Adresse de diffusion',
placeholder: 'chemin-de-la-démarche',
required: true,
class: 'unstyled flex-1',
pattern: '^[a-z0-9_-]{3,200}$',
title: "De 3 à 200 caractères; minuscules, chiffres et tiret seulement",
autocomplete: 'off')
-# %span{ data: { controller: 'clipboard', clipboard_text_value: '' } }
-# %button.fr-btn.fr-icon-clipboard-line.fr-btn--sm.fr-btn--secondary.fr-btn--icon-left{ data: { action: 'clipboard#copy' }, title: 'Copier le lien public' }
-# Copier le lien public
-# %span.fr-text--sm.hidden{ data: { clipboard_target: 'success' } }
-# = @success || t('.copy_confirmation')
= render Dsfr::AlertComponent.new(state: :info, size: :sm, extra_class_names: 'fr-mb-2w') do |c|
- c.body do
Attention, diffusez toujours le lien complet affiché ci-dessus ( en cliquant sur le bouton « Copier le lien public »), et non pas un lien générique vers #{APPLICATION_NAME}.
.fr-input-group
= label_tag :procedure_path, class: 'fr-label' do
Où les usagers trouveront-ils le lien de la démarche ?
%span.fr-hint-text
Il s'agit de la page de votre site web où le lien sera diffusé
= text_field_tag(:lien_site_web, procedure.lien_site_web,
required: true,
class: 'form-control',
class: 'fr-input',
autocomplete: 'off',
placeholder: 'https://exemple.gouv.fr/ma_demarche')
placeholder: 'https://exemple.gouv.fr/page_informant_sur_ma_demarche')
- if closed_procedures.present?
.fr-select-group
= label_tag :procedure_path, class: 'fr-label' do
Numéro de la démarche remplacée (facultatif)
%span.fr-hint-text
Cette démarche remplace une close ? Si oui, veuillez indiquer le n° de la démarche remplacée
= select_tag :old_procedure, options_for_select(@closed_procedures), include_blank: true, class: 'fr-select'

154
app/views/administrateurs/procedures/publication.html.haml
View file

@ -2,97 +2,69 @@
= render partial: 'administrateurs/breadcrumbs',
locals: { steps: [['Démarches', admin_procedures_back_path(@procedure)],
[@procedure.libelle.truncate_words(10), admin_procedure_path(@procedure)],
['Publication']] }
.container
- if @procedure.draft_revision.types_de_champ_public.dubious.present?
= render Dsfr::AlertComponent.new(state: :warning, title: "Attention, certains champs ne peuvent être demandés par l’administration. Voici les champs qui nous semblent suspects :", extra_class_names: 'fr-mb-2w') do |c|
- c.body do
%ul
- @procedure.draft_revision.types_de_champ_public.dubious.each do |dubious_champs|
%li.dubious-champs= "#{dubious_champs.libelle} (#{dubious_champs.description})"
.lien-demarche
%h1
- if @procedure.brouillon?
Test et publication
- else
Publication
%div{ style: 'margin-top: 30px;' }
- if @procedure.close? || @procedure.depubliee?
%p.mb-4 Cette démarche est <strong>close</strong> et n’est donc plus accessible par le public. Vous pouvez la réactiver :
= render partial: 'publication_form', locals: { procedure: @procedure, administrateur: @current_administrateur }
- elsif @procedure.draft_changed?
%p.mb-4 Cette démarche est déjà <strong>publiée</strong>. Elle a été <strong>modifiée</strong> depuis sa publication. Vous pouvez publier les changements effectués dans une nouvelle version de cette démarche :
= render partial: 'publication_form', locals: { procedure: @procedure, administrateur: @current_administrateur }
- elsif @procedure.publiee?
%p Cette démarche est <strong>publiée</strong>, certains éléments ne peuvent plus être modifiés.
Pour y accéder vous pouvez utiliser le lien :
= link_to commencer_url(@procedure.path), commencer_url(@procedure.path), target: :blank, rel: :noopener, class: "mb-4"
%p.mb-4 Attention, diffusez toujours le <strong>lien complet</strong> affiché ci-dessus, et non pas un lien générique vers #{APPLICATION_NAME}. Ne dites pas non plus aux usagers de se rendre sur le site générique #{APPLICATION_NAME}, donnez-leur toujours le lien complet.
- elsif @procedure.brouillon?
- if @procedure.missing_steps.empty?
%p
Cette démarche est actuellement <strong>en test</strong>,
pour y accéder vous pouvez utiliser le lien :
= link_to commencer_url(@procedure.path), commencer_url(@procedure.path), target: :blank, rel: :noopener
%p.mb-4
Toute personne ayant la connaissance de ce lien pourra ainsi remplir des dossiers de test sur votre démarche.
.card.mb-4
%h2.card-title Ce que vous pouvez faire lorsque vous êtes en test
%p
Profitez de la phase de test pour tester la saisie de dossiers, ainsi que toutes les fonctionnalités associées (instruction, emails automatiques, attestations, etc.).
%p
Vous pouvez effectuer toutes les modifications que vous souhaitez sur votre démarche pendant cette phase de test.
%p.mb-4.font-weight-bold
Les dossiers qui seront remplis pendant la phase de test seront automatiquement supprimés lors de la modification ou la publication de votre démarche.
%p.center
%iframe{ :src =>"https://player.vimeo.com/video/334463514?color=0069CC",:width =>"640",:height =>"360",:frameborder => "0" }
.card
%h2.card-title Prêt à publier ?
%p
À ce moment du processus de création, vous devez informer votre Délégué à la Protection des Données personnelles (DPD).
%p
(
%a{ href:'https://www.cnil.fr/fr/protection-des-donnees-les-bons-reflexes', target:'_blank' }
https://www.cnil.fr/fr/protection-des-donnees-les-bons-reflexes
)
%p
Si votre démarche propose de collecter des données personnelles, vous devez informer votre DPD. Chaque organisme en a un.
%p
Ce dernier pourra vous aider dans la finalisation de votre démarche, et vous inviter à vous interroger sur les données collectées, et sur la pertinence de ces dernières.
N'oubliez pas : toutes les démarches qui contiennent des données personnelles doivent être consignées dans un registre des traitements :
%a{ href:'https://www.cnil.fr/fr/RGDP-le-registre-des-activites-de-traitement', target:'_blank' }
https://www.cnil.fr/fr/RGDP-le-registre-des-activites-de-traitement
%p.mb-4
Comment faire :
vous pouvez soit lui communiquer par email le lien vers la démarche en test, ou bien le nommer « administrateur ». Dans tous les cas, ne publiez votre démarche qu’après avoir eu son avis.
= render partial: 'publication_form', locals: { procedure: @procedure, administrateur: @current_administrateur }
- else
.alert.alert-info
Pour pouvoir tester cette démarche, vous devez d’abord lui affecter :
['Publier']] }
.fr-container
.fr-grid-row
.fr-col-12.fr-col-offset-sm-2.fr-col-sm-8
- if @procedure.draft_revision.types_de_champ_public.dubious.present?
= render Dsfr::AlertComponent.new(state: :warning, title: "Attention, certains champs ne peuvent être demandés par l’administration. Voici les champs qui nous semblent suspects :", extra_class_names: 'fr-mb-2w') do |c|
- c.body do
%ul
- if @procedure.missing_zones?
%li= link_to("une ou plusieurs zones", zones_admin_procedure_path(id: @procedure.id))
- if @procedure.missing_instructeurs?
%li= link_to("des instructeurs", admin_procedure_groupe_instructeur_path(@procedure, @procedure.defaut_groupe_instructeur))
- if @procedure.service.nil?
%li= link_to("un service", admin_services_path(procedure_id: @procedure))
\.
- else
- if @procedure.missing_steps.include?(:service)
%p.alert.alert-danger
Vous devez renseigner les coordonnées de votre Service administratif avant de pouvoir publier votre démarche.
= link_to 'Cliquez ici.', (@current_administrateur.services.present? ? url_for(admin_services_path(procedure_id: @procedure.id)) : url_for(new_admin_service_path(procedure_id: @procedure.id)))
- @procedure.draft_revision.types_de_champ_public.dubious.each do |dubious_champs|
%li.dubious-champs= "#{dubious_champs.libelle} (#{dubious_champs.description})"
.lien-demarche
%h1
Publier votre démarche
- if @procedure.missing_steps.include?(:instructeurs)
%p.alert.alert-danger
Vous devez affecter des instructeurs avant de pouvoir publier votre démarche.
= link_to 'Cliquez ici.', admin_procedure_groupe_instructeur_path(@procedure, @procedure.defaut_groupe_instructeur)
%div{ style: 'margin-top: 30px;' }
- if @procedure.close? || @procedure.depubliee?
%p.mb-4 Cette démarche est <strong>close</strong> et n’est donc plus accessible par le public. Vous pouvez la réactiver :
= render partial: 'publication_form', locals: { procedure: @procedure, administrateur: @current_administrateur }
- elsif @procedure.draft_changed?
%p.mb-4 Cette démarche est déjà <strong>publiée</strong>. Elle a été <strong>modifiée</strong> depuis sa publication. Vous pouvez publier les changements effectués dans une nouvelle version de cette démarche :
= render partial: 'publication_form', locals: { procedure: @procedure, administrateur: @current_administrateur }
- elsif @procedure.publiee?
%p Cette démarche est <strong>publiée</strong>, certains éléments ne peuvent plus être modifiés.
Pour y accéder vous pouvez utiliser le lien :
= link_to commencer_url(@procedure.path), commencer_url(@procedure.path), target: :blank, rel: :noopener, class: "mb-4"
%p.alert.alert-info
Cette démarche n’a pas encore de lien, et n’est pas accessible par le public.
= render Dsfr::AlertComponent.new(state: :info, size: :sm, extra_class_names: 'fr-my-2w') do |c|
- c.body do
%p Attention, diffusez toujours le <strong>lien complet</strong> affiché ci-dessus, et non pas un lien générique vers #{APPLICATION_NAME}. Ne dites pas non plus aux usagers de se rendre sur le site générique #{APPLICATION_NAME}, donnez-leur toujours le lien complet.
- elsif @procedure.brouillon?
- if @procedure.missing_steps.empty?
= render partial: 'publication_form', locals: { procedure: @procedure, administrateur: @current_administrateur }
- else
= render Dsfr::AlertComponent.new(state: :warning, title: "informations manquantes", heading_level: :h2) do |c|
- c.body do
%p Pour pouvoir tester cette démarche, vous devez d’abord lui affecter :
%ul
- if @procedure.missing_zones?
%li= link_to("une ou plusieurs zones", zones_admin_procedure_path(id: @procedure.id))
- if @procedure.missing_instructeurs?
%li= link_to("des instructeurs", admin_procedure_groupe_instructeur_path(@procedure, @procedure.defaut_groupe_instructeur))
- if @procedure.service.nil?
%li= link_to("un service", admin_services_path(procedure_id: @procedure))
= link_to 'Revenir à la page de la démarche', admin_procedure_path(id: @procedure), class: 'fr-btn fr-btn--secondary fr-btn--icon-left fr-icon-arrow-go-back-line fr-mt-2w'
- else
- if @procedure.missing_steps.include?(:service)
= render Dsfr::AlertComponent.new(state: :warning, size: :sm, extra_class_names: 'fr-my-2w') do |c|
- c.body do
%p
Vous devez renseigner les coordonnées de votre Service administratif avant de pouvoir publier votre démarche.
= link_to 'Cliquez ici.', (@current_administrateur.services.present? ? url_for(admin_services_path(procedure_id: @procedure.id)) : url_for(new_admin_service_path(procedure_id: @procedure.id)))
- if @procedure.missing_steps.include?(:instructeurs)
= render Dsfr::AlertComponent.new(state: :warning, size: :sm, extra_class_names: 'fr-my-2w') do |c|
- c.body do
%p
Vous devez affecter des instructeurs avant de pouvoir publier votre démarche.
= link_to 'Cliquez ici.', admin_procedure_groupe_instructeur_path(@procedure, @procedure.defaut_groupe_instructeur)
= render Dsfr::AlertComponent.new(state: :warning, size: :sm, extra_class_names: 'fr-my-2w') do |c|
- c.body do
%p
Cette démarche n’a pas encore de lien, et n’est pas accessible par le public.
= link_to 'Revenir à la page de la démarche', admin_procedure_path(id: @procedure), class: 'fr-btn fr-btn--secondary fr-btn--icon-left fr-icon-arrow-go-back-line fr-mt-2w'

2
config/locales/views/layouts/_breadcrumb.en.yml
View file

@ -11,3 +11,5 @@ en:
closed: "Closed"
published: "Published"
draft: "Draft"
more_info_on_test: "For more information on test stage"
go_to_FAQ: "read FAQ"

2
config/locales/views/layouts/_breadcrumb.fr.yml
View file

@ -11,3 +11,5 @@ fr:
closed: "Close"
published: "Publiée"
draft: "En test"
more_info_on_test: "Pour plus d’information sur la phase de test"
go_to_FAQ: "consulter la FAQ"