Merge pull request #9107 from demarches-simplifiees/remove-previsualisation-from-admin-procedure-creation
[Refonte page accueil demarche] Formulaire de création admin full page - plus de prévisualisation
This commit is contained in:
Lisa Durand
GitHub
commit
968f05f648
15 changed files with 73 additions and 148 deletions
|
|
@ -3,15 +3,6 @@
|
|||
@import "placeholders";
|
||||
|
||||
.form {
|
||||
h1 {
|
||||
text-align: center;
|
||||
margin-bottom: 20px;
|
||||
|
||||
@media (max-width: $two-columns-breakpoint) {
|
||||
font-size: 26px;
|
||||
}
|
||||
}
|
||||
|
||||
hr {
|
||||
width: 100%;
|
||||
height: 0;
|
||||
|
|
@ -649,6 +640,14 @@ textarea::placeholder {
|
|||
color: $dark-grey;
|
||||
}
|
||||
|
||||
.send-wrapper--with-border-top {
|
||||
border-top: 2px solid rgba(0, 0, 145, 1);
|
||||
.sticky-action-footer {
|
||||
border-top: 2px solid $blue-france-500;
|
||||
position: sticky;
|
||||
// scss-lint:disable VendorPrefix
|
||||
position: -webkit-sticky; // This is needed on Safari (tested on 12.1)
|
||||
// scss-lint:enable VendorPrefix
|
||||
bottom: 0;
|
||||
padding: $default-padding 0;
|
||||
background-color: $white;
|
||||
z-index: 2;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -69,8 +69,6 @@
|
|||
|
||||
.procedure-form__actions {
|
||||
display: flex;
|
||||
margin-left: -$default-padding;
|
||||
margin-right: -$default-padding;
|
||||
padding: $default-spacer $default-padding;
|
||||
background: $light-grey;
|
||||
border-top: 1px solid $border-grey;
|
||||
|
|
|
|||
|
|
@ -12,7 +12,6 @@ import '../shared/toggle-target';
|
|||
import { registerControllers } from '../shared/stimulus-loader';
|
||||
|
||||
import '../new_design/form-validation';
|
||||
import '../new_design/procedure-form';
|
||||
|
||||
import { toggleCondidentielExplanation } from '../new_design/avis';
|
||||
import {
|
||||
|
|
|
|||
|
|
@ -1,26 +0,0 @@
|
|||
import { delegate } from '@utils';
|
||||
|
||||
function syncInputToElement(fromSelector, toSelector) {
|
||||
const fromElement = document.querySelector(fromSelector);
|
||||
const toElement = document.querySelector(toSelector);
|
||||
if (toElement && fromElement) {
|
||||
toElement.innerText = fromElement.value;
|
||||
}
|
||||
}
|
||||
|
||||
function syncFormToPreview() {
|
||||
syncInputToElement('#procedure_libelle', '.procedure-title');
|
||||
syncInputToElement('#procedure_description', '.js_description p');
|
||||
syncInputToElement(
|
||||
'#procedure_description_target_audience',
|
||||
'.js_description_target_audience p'
|
||||
);
|
||||
}
|
||||
|
||||
delegate('input', '.procedure-form #procedure_libelle', syncFormToPreview);
|
||||
delegate('input', '.procedure-form #procedure_description', syncFormToPreview);
|
||||
delegate(
|
||||
'input',
|
||||
'.procedure-form #procedure_description_target_audience',
|
||||
syncFormToPreview
|
||||
);
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
#breadcrumbs.sub-header
|
||||
.container.flex.justify-between.align-baseline.column
|
||||
.fr-container.flex.justify-between.align-baseline.column
|
||||
%nav.fr-breadcrumb.mt-0{ role: "navigation", aria: { label: t('you_are_here', scope: [:layouts, :breadcrumb]) } }
|
||||
%button.fr-breadcrumb__button{ aria: { expanded: "false", controls: "breadcrumb-1" } }
|
||||
= t('show', scope: [:layouts, :breadcrumb])
|
||||
|
|
|
|||
|
|
@ -21,7 +21,9 @@
|
|||
= t(:notice, scope: [:administrateurs, :duree_conservation_dossiers_dans_ds])
|
||||
- if f.object.duree_conservation_dossiers_dans_ds.to_i < Procedure::NEW_MAX_DUREE_CONSERVATION
|
||||
= t(:new_duration_constraint, scope: [:administrateurs, :duree_conservation_dossiers_dans_ds], new_duration_in_month: f.object.max_duree_conservation_dossiers_dans_ds)
|
||||
= f.number_field :duree_conservation_dossiers_dans_ds, { class: 'fr-input', placeholder: '6', required: true, max: f.object.max_duree_conservation_dossiers_dans_ds }
|
||||
|
||||
.fr-input-group
|
||||
= f.number_field :duree_conservation_dossiers_dans_ds, { class: 'fr-input', placeholder: '6', required: true, max: f.object.max_duree_conservation_dossiers_dans_ds }
|
||||
|
||||
- if @procedure.created_at.present?
|
||||
= render Dsfr::InputComponent.new(form: f, attribute: :lien_site_web, input_type: :text_field, opts: {}, required: false)
|
||||
|
|
@ -89,11 +91,11 @@
|
|||
%p.notice
|
||||
En choisissant cette option, l’usager devra renseigner son n° SIRET.<br>Grâce à l’API Entreprise, les informations sur la personne morale (raison sociale, adresse du siège, etc.) seront automatiquement renseignées.
|
||||
|
||||
%p.explication
|
||||
%p
|
||||
Si votre démarche s’adresse indifféremment à une personne morale ou un particulier, choisissez l'option « Particuliers ». Vous pourrez ajouter un champ SIRET directement dans le formulaire.
|
||||
|
||||
%h3.header-subsection Ajouter des tags
|
||||
%p.explication Les tags sont des mots ou des expressions que vous attribuez aux démarches pour décrire leur contenu et pour les retrouver. Les tags sont partagés avec la communauté, ce qui vous permet de voir les tags attribués aux démarches créées par les autres administrateurs.
|
||||
%p Les tags sont des mots ou des expressions que vous attribuez aux démarches pour décrire leur contenu et pour les retrouver. Les tags sont partagés avec la communauté, ce qui vous permet de voir les tags attribués aux démarches créées par les autres administrateurs.
|
||||
= hidden_field_tag 'procedure[tags]', JSON.generate(@procedure.tags)
|
||||
= react_component("ComboMultiple",
|
||||
id: "procedure_tags_combo",
|
||||
|
|
@ -101,7 +103,7 @@
|
|||
selected: @procedure.tags,
|
||||
disabled: [],
|
||||
label: 'Tags',
|
||||
group: '.procedure-form__column--form',
|
||||
group: '.procedure_tags_combo',
|
||||
name: 'tags',
|
||||
describedby: 'procedure-tags',
|
||||
acceptNewValues: true)
|
||||
|
|
|
|||
|
|
@ -4,25 +4,21 @@
|
|||
locals: { steps: [['Démarches', admin_procedures_back_path(@procedure)],
|
||||
[@procedure.libelle.truncate_words(10), admin_procedure_path(@procedure)],
|
||||
['Description']] }
|
||||
.procedure-form
|
||||
.procedure-form__columns.container
|
||||
= render NestedForms::FormOwnerComponent.new
|
||||
= form_for @procedure,
|
||||
url: url_for({ controller: 'administrateurs/procedures', action: :update, id: @procedure.id }),
|
||||
html: { class: 'form procedure-form__column--form',
|
||||
multipart: true } do |f|
|
||||
|
||||
%h1.page-title Description
|
||||
= render NestedForms::FormOwnerComponent.new
|
||||
= form_for @procedure,
|
||||
url: url_for({ controller: 'administrateurs/procedures', action: :update, id: @procedure.id }),
|
||||
html: { class: 'form procedure_tags_combo', multipart: true } do |f|
|
||||
.fr-container
|
||||
.fr-grid-row
|
||||
.fr-col-12.fr-col-offset-sm-2.fr-col-sm-8
|
||||
%h1.fr-h2 Description
|
||||
|
||||
= render partial: 'administrateurs/procedures/informations', locals: { f: f }
|
||||
= render partial: 'administrateurs/procedures/informations', locals: { f: f }
|
||||
|
||||
.procedure-form__actions.sticky--bottom
|
||||
.actions-right
|
||||
= link_to 'Annuler', admin_procedure_path(id: @procedure), class: 'fr-btn fr-btn--secondary fr-mr-2w', data: { confirm: 'Êtes-vous sûr de vouloir annuler les modifications effectuées ?'}
|
||||
= f.button 'Enregistrer', class: 'fr-btn'
|
||||
|
||||
.procedure-form__column--preview
|
||||
.procedure-form__preview.sticky--top
|
||||
%h3.procedure-form__preview-title Aperçu
|
||||
.procedure-preview
|
||||
= render partial: 'shared/procedure_description', locals: { procedure: @procedure }
|
||||
.sticky-action-footer
|
||||
.fr-container
|
||||
.fr-grid-row
|
||||
.fr-col-12.fr-col-offset-sm-2.fr-col-sm-8
|
||||
= f.button 'Enregistrer', class: 'fr-btn fr-mr-2w'
|
||||
= link_to 'Annuler', admin_procedure_path(id: @procedure), class: 'fr-btn fr-btn--secondary', data: { confirm: 'Êtes-vous sûr de vouloir annuler les modifications effectuées ?'}
|
||||
|
|
|
|||
|
|
@ -4,25 +4,20 @@
|
|||
locals: { steps: [['Démarches', admin_procedures_back_path(@procedure)],
|
||||
['Nouvelle']] }
|
||||
|
||||
.procedure-form
|
||||
.procedure-form__columns.container
|
||||
= render NestedForms::FormOwnerComponent.new
|
||||
= form_for @procedure,
|
||||
url: url_for({ controller: 'administrateurs/procedures', action: :create, id: @procedure.id }),
|
||||
html: { class: 'form procedure-form__column--form', multipart: true } do |f|
|
||||
= render NestedForms::FormOwnerComponent.new
|
||||
= form_for @procedure,
|
||||
url: url_for({ controller: 'administrateurs/procedures', action: :create, id: @procedure.id }),
|
||||
html: { class: 'form procedure_tags_combo', multipart: true } do |f|
|
||||
.fr-container
|
||||
.fr-grid-row
|
||||
.fr-col-12.fr-col-offset-sm-2.fr-col-sm-8
|
||||
%h1.fr-h2 Nouvelle démarche
|
||||
|
||||
%h1.page-title Nouvelle démarche
|
||||
= render partial: 'administrateurs/procedures/informations', locals: { f: f }
|
||||
|
||||
|
||||
= render partial: 'administrateurs/procedures/informations', locals: { f: f }
|
||||
|
||||
.procedure-form__actions.sticky--bottom
|
||||
.actions-right
|
||||
= link_to 'Annuler', admin_procedures_path, class: 'fr-btn fr-btn--secondary fr-mr-2w', data: { confirm: 'Êtes-vous sûr de vouloir annuler la création de cette démarche ?'}
|
||||
= f.button 'Créer la démarche', class: 'fr-btn'
|
||||
|
||||
.procedure-form__column--preview
|
||||
.procedure-form__preview.sticky--top
|
||||
%h3.procedure-form__preview-title Aperçu
|
||||
.procedure-preview
|
||||
= render partial: 'shared/procedure_description', locals: { procedure: @procedure }
|
||||
.sticky-action-footer
|
||||
.fr-container
|
||||
.fr-grid-row
|
||||
.fr-col-12.fr-col-offset-sm-2.fr-col-sm-8
|
||||
= f.button 'Créer la démarche', class: 'fr-btn fr-mr-2w'
|
||||
= link_to 'Annuler', admin_procedures_path, class: 'fr-btn fr-btn--secondary', data: { confirm: 'Êtes-vous sûr de vouloir annuler la création de cette démarche ?'}
|
||||
|
|
|
|||
|
|
@ -1,49 +1,37 @@
|
|||
= render partial: 'administrateurs/breadcrumbs',
|
||||
locals: { steps: [['Démarches', admin_procedures_back_path(@procedure)],
|
||||
["#{@procedure.libelle.truncate_words(10)}"]],
|
||||
metadatas: true }
|
||||
locals: { steps: [['Démarches', admin_procedures_back_path(@procedure)],
|
||||
["#{@procedure.libelle.truncate_words(10)}"]],
|
||||
metadatas: true }
|
||||
|
||||
.container.procedure-admin-container
|
||||
- if @procedure.draft_revision.valid?
|
||||
- if !@procedure.brouillon?
|
||||
= link_to admin_procedure_archives_path(@procedure), class: 'button', id: "archive-procedure" do
|
||||
%span.icon.download
|
||||
Télécharger
|
||||
.fr-container.procedure-admin-container
|
||||
%ul.fr-btns-group.fr-btns-group--inline-sm.fr-btns-group--icon-left
|
||||
- if @procedure.draft_revision.valid?
|
||||
- if !@procedure.brouillon?
|
||||
= link_to 'Télécharger', admin_procedure_archives_path(@procedure), class: 'fr-btn fr-btn--tertiary fr-btn--icon-left fr-icon-download-line', id: "archive-procedure"
|
||||
|
||||
= link_to commencer_dossier_vide_for_revision_path(@procedure.active_revision), target: "_blank", rel: "noopener", class: 'button', id: "pdf-procedure" do
|
||||
%span.icon.printer
|
||||
PDF
|
||||
= link_to 'PDF', commencer_dossier_vide_for_revision_path(@procedure.active_revision), target: "_blank", rel: "noopener", class: 'fr-btn fr-btn--tertiary fr-btn--icon-left fr-icon-printer-line', id: "pdf-procedure"
|
||||
|
||||
= link_to apercu_admin_procedure_path(@procedure), target: "_blank", rel: "noopener", class: 'button', id: "preview-procedure" do
|
||||
%span.icon.preview
|
||||
Prévisualiser
|
||||
- if @procedure.brouillon? || @procedure.draft_changed?
|
||||
= link_to 'Tester la démarche', sanitize_url(@procedure_lien_test), target: :blank, rel: :noopener, class: 'fr-btn fr-btn--tertiary fr-btn--icon-left fr-icon-edit-line'
|
||||
|
||||
- if @procedure.brouillon? || @procedure.draft_changed?
|
||||
= link_to sanitize_url(@procedure_lien_test), target: :blank, rel: :noopener, class: 'button' do
|
||||
%span.icon.in-progress
|
||||
Tester
|
||||
- if @procedure.publiee? || @procedure.brouillon?
|
||||
= link_to 'Envoyer une copie', admin_procedure_transfert_path(@procedure), class: 'fr-btn fr-btn--tertiary fr-btn--icon-left fr-icon-arrow-right-up-line'
|
||||
|
||||
- if @procedure.publiee? || @procedure.brouillon?
|
||||
= link_to admin_procedure_transfert_path(@procedure), class: 'button' do
|
||||
%span.icon.reply
|
||||
Envoyer une copie
|
||||
- if !@procedure.publiee? && !@procedure.close? && !@procedure.depubliee?
|
||||
= link_to 'Publier', admin_procedure_publication_path(@procedure), class: 'fr-btn fr-btn--primary fr-btn--icon-left fr-icon-success-line', id: 'publish-procedure-link', data: { disable_with: "Publication..." }
|
||||
|
||||
- if !@procedure.publiee? && !@procedure.close? && !@procedure.depubliee?
|
||||
= link_to 'Publier', admin_procedure_publication_path(@procedure), class: 'button primary', id: 'publish-procedure-link', data: { disable_with: "Publication..." }
|
||||
- if (@procedure.close? || @procedure.depubliee?) && !@procedure.draft_changed?
|
||||
= link_to 'Réactiver', admin_procedure_publication_path(@procedure), class: 'fr-btn fr-btn--primary fr-btn--icon-left fr-icon-success-line', id: 'publish-procedure-link', data: { disable_with: "Publication..." }
|
||||
|
||||
- if (@procedure.close? || @procedure.depubliee?) && !@procedure.draft_changed?
|
||||
= link_to 'Réactiver', admin_procedure_publication_path(@procedure), class: 'button primary', id: 'publish-procedure-link', data: { disable_with: "Publication..." }
|
||||
- if @procedure.locked? && !@procedure.close?
|
||||
= link_to 'Clore', admin_procedure_archive_path(procedure_id: @procedure.id), method: :put, class: 'fr-btn fr-btn--tertiary fr-btn--icon-left fr-icon-archive-line', id: "close-procedure-link", data: { confirm: "Voulez-vous vraiment clore la démarche ? \nLes dossiers en cours pourront être instruits, mais aucun nouveau dossier ne pourra plus être déposé.", disable_with: "Archivage..."}
|
||||
|
||||
- if @procedure.locked? && !@procedure.close?
|
||||
= link_to admin_procedure_archive_path(procedure_id: @procedure.id), method: :put, class: 'button', id: "close-procedure-link", data: { confirm: "Voulez-vous vraiment clore la démarche ? \nLes dossiers en cours pourront être instruits, mais aucun nouveau dossier ne pourra plus être déposé.", disable_with: "Archivage..."} do
|
||||
%span.icon.archive
|
||||
Clore
|
||||
|
||||
.container
|
||||
.fr-container
|
||||
= render TypesDeChampEditor::ErrorsSummary.new(revision: @procedure.draft_revision)
|
||||
|
||||
- if @procedure.draft_changed?
|
||||
.container
|
||||
.fr-container
|
||||
.card.featured
|
||||
.card-title
|
||||
= t(:has_changes, scope: [:administrateurs, :revision_changes])
|
||||
|
|
@ -54,7 +42,7 @@
|
|||
|
||||
- if !@procedure.procedure_expires_when_termine_enabled?
|
||||
= render partial: 'administrateurs/procedures/suggest_expires_when_termine', locals: { procedure: @procedure }
|
||||
.container
|
||||
.fr-container
|
||||
%h2.fr-mt-5w.fr-mb-3w.fr-h1 Indispensable avant publication
|
||||
.fr-grid-row.fr-grid-row--gutters
|
||||
= render Procedure::Card::PresentationComponent.new(procedure: @procedure)
|
||||
|
|
|
|||
|
|
@ -71,7 +71,6 @@
|
|||
- if procedure_id.present?
|
||||
= hidden_field_tag :procedure_id, procedure_id
|
||||
|
||||
.send-wrapper.justify-content--space-between.send-wrapper--with-border-top.my-0.py-3
|
||||
.sticky-action-footer
|
||||
= f.submit "Enregistrer", class: "fr-btn fr-mr-2w"
|
||||
= link_to "Annuler et revenir à la page de suivi", admin_procedure_path(id: @procedure.id), class: "fr-btn fr-btn--secondary"
|
||||
= f.submit "Enregistrer", class: "fr-btn"
|
||||
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
= image_tag procedure.logo_url, alt: procedure_logo_alt
|
||||
- if procedure.euro_flag
|
||||
= image_tag("flag_of_europe.svg", id: 'euro_flag', class: (!procedure.euro_flag ? "hidden" : ""))
|
||||
%h1.procedure-title.fr-h2
|
||||
%h1.fr-h2
|
||||
= procedure.libelle
|
||||
|
||||
- if procedure.persisted? && procedure.estimated_duration_visible?
|
||||
|
|
|
|||
|
|
@ -41,14 +41,6 @@ describe 'Creating a new procedure', js: true do
|
|||
|
||||
add_champ
|
||||
expect(page).to have_selector('.type-de-champ', count: 1)
|
||||
|
||||
click_on Procedure.last.libelle
|
||||
|
||||
preview_window = window_opened_by { find('#preview-procedure').click }
|
||||
within_window(preview_window) do
|
||||
expect(page).to have_current_path(apercu_admin_procedure_path(Procedure.last))
|
||||
expect(page).to have_field('libelle de champ')
|
||||
end
|
||||
end
|
||||
|
||||
scenario 'a warning is displayed when creating an invalid procedure' do
|
||||
|
|
|
|||
|
|
@ -44,7 +44,6 @@ describe 'Publishing a procedure', js: true do
|
|||
click_on 'Publier'
|
||||
|
||||
expect(page).to have_text('Démarche publiée')
|
||||
expect(page).to have_selector('#preview-procedure')
|
||||
end
|
||||
|
||||
context 'when the procedure has invalid champs' do
|
||||
|
|
@ -93,7 +92,6 @@ describe 'Publishing a procedure', js: true do
|
|||
click_on 'publish'
|
||||
|
||||
expect(page).to have_text('Démarche publiée')
|
||||
expect(page).to have_selector('#preview-procedure')
|
||||
end
|
||||
end
|
||||
|
||||
|
|
@ -125,7 +123,6 @@ describe 'Publishing a procedure', js: true do
|
|||
find('#publish').click
|
||||
|
||||
expect(page).to have_text('Démarche publiée')
|
||||
expect(page).to have_selector('#preview-procedure')
|
||||
end
|
||||
end
|
||||
|
||||
|
|
|
|||
|
|
@ -32,10 +32,6 @@ describe 'Administrateurs can edit procedures', js: true do
|
|||
expect(page).to have_field('procedure_libelle', with: procedure.libelle)
|
||||
|
||||
fill_in('procedure_libelle', with: 'Ma petite démarche')
|
||||
within('.procedure-form__preview') do
|
||||
expect(page).to have_content('Ma petite démarche')
|
||||
end
|
||||
|
||||
click_on 'Enregistrer'
|
||||
|
||||
expect(page).to have_selector('.fr-breadcrumb li', text: 'Ma petite démarche')
|
||||
|
|
|
|||
|
|
@ -1,15 +1,5 @@
|
|||
RSpec.describe 'administrateurs/procedures/edit', type: :view do
|
||||
let(:logo) { fixture_file_upload('spec/fixtures/files/logo_test_procedure.png', 'image/png') }
|
||||
let(:procedure) { create(:procedure, logo: logo, lien_site_web: 'http://some.website') }
|
||||
|
||||
context 'when procedure logo is present' do
|
||||
it 'display on the page' do
|
||||
assign(:procedure, procedure)
|
||||
render
|
||||
|
||||
expect(rendered).to have_selector('.procedure-logos')
|
||||
end
|
||||
end
|
||||
let(:procedure) { create(:procedure, lien_site_web: 'http://some.website') }
|
||||
|
||||
context 'when opendata is enabled' do
|
||||
it 'asks for opendata' do
|
||||
|
|
|
|||
Loading…
Reference in a new issue