From 77f88bbbbe6d41b36fea211422fb5c275bc36c7a Mon Sep 17 00:00:00 2001 From: Colin Darie Date: Wed, 13 Nov 2024 18:40:09 +0100 Subject: [PATCH] style(admin): fix archives table --- app/assets/stylesheets/archive.scss | 19 ------ app/assets/stylesheets/dossiers_table.scss | 4 -- app/assets/stylesheets/dsfr.scss | 4 ++ .../deleted_dossiers_component.html.haml | 51 ++++++++------- .../administrateurs/archives/index.html.haml | 10 +-- app/views/experts/avis/procedure.html.haml | 2 +- .../instructeurs/procedures/show.html.haml | 2 +- app/views/recherche/_hidden_dossier.html.haml | 2 +- app/views/recherche/index.html.haml | 4 +- app/views/shared/archives/_table.html.haml | 64 ++++++++++--------- .../procedure_archive_and_export_spec.rb | 2 +- spec/system/instructeurs/instruction_spec.rb | 2 +- .../instructeurs/procedure_sort_spec.rb | 36 +++++------ 13 files changed, 98 insertions(+), 104 deletions(-) delete mode 100644 app/assets/stylesheets/archive.scss diff --git a/app/assets/stylesheets/archive.scss b/app/assets/stylesheets/archive.scss deleted file mode 100644 index 09bcb85c5..000000000 --- a/app/assets/stylesheets/archive.scss +++ /dev/null @@ -1,19 +0,0 @@ -@import 'constants'; - -table.archive-table { - .text-right { - text-align: right; - } - - .center { - text-align: center; - } - - td { - padding: 3 * $default-spacer $default-spacer; - } - - a.button { - background-image: none; // remove DSFR underline - } -} diff --git a/app/assets/stylesheets/dossiers_table.scss b/app/assets/stylesheets/dossiers_table.scss index 381267c62..4fca583c1 100644 --- a/app/assets/stylesheets/dossiers_table.scss +++ b/app/assets/stylesheets/dossiers_table.scss @@ -10,10 +10,6 @@ white-space: nowrap; } - .number-col { - font-variant-numeric: tabular-nums; - } - .follow-col { .fr-btn { margin-bottom: 0; diff --git a/app/assets/stylesheets/dsfr.scss b/app/assets/stylesheets/dsfr.scss index 9a1bc9007..94653512a 100644 --- a/app/assets/stylesheets/dsfr.scss +++ b/app/assets/stylesheets/dsfr.scss @@ -248,3 +248,7 @@ input[type='radio'] { .fr-tags-group > li { line-height: inherit; } + +.fr-cell--numeric { + font-variant-numeric: tabular-nums; +} diff --git a/app/components/dossiers/deleted_dossiers_component/deleted_dossiers_component.html.haml b/app/components/dossiers/deleted_dossiers_component/deleted_dossiers_component.html.haml index c1d03d08c..488e0c634 100644 --- a/app/components/dossiers/deleted_dossiers_component/deleted_dossiers_component.html.haml +++ b/app/components/dossiers/deleted_dossiers_component/deleted_dossiers_component.html.haml @@ -16,31 +16,38 @@ %li = t(".deleted_explanation_second_#{role}") - .fr-table.fr-table--layout-fixed.fr-mt-3w - %table - %thead - %tr - %th N° dossier - %th Libellé de la démarche - %th Raison de suppression - %th Date de suppression - %tbody - - @deleted_dossiers.each do |deleted_dossier| - %tr - %td.number-col - = deleted_dossier.dossier_id + .fr-table + .fr-table__wrapper + .fr-table__container + .fr-table__content + %table + %thead + %tr + %th N° dossier + %th Libellé de la démarche + %th Raison de suppression + %th Date de suppression + %tbody + - @deleted_dossiers.each do |deleted_dossier| + %tr + %td.fr-cell--numeric + = deleted_dossier.dossier_id - %td.number-col - = deleted_dossier.procedure.libelle.truncate_words(10) + %td.fr-cell--numeric + = deleted_dossier.procedure.libelle.truncate_words(10) - %td - = deletion_reason_badge(deleted_dossier.reason) - -# .fr-badge - -# = t("activerecord.attributes.deleted_dossier.reason.#{deleted_dossier.reason}") - %td.deleted-cell - = l(deleted_dossier.deleted_at, format: '%d/%m/%y') + %td + = deletion_reason_badge(deleted_dossier.reason) + -# .fr-badge + -# = t("activerecord.attributes.deleted_dossier.reason.#{deleted_dossier.reason}") + %td.deleted-cell + = l(deleted_dossier.deleted_at, format: '%d/%m/%y') - = paginate @deleted_dossiers, views_prefix: 'shared' + .fr-table__footer + .fr-table__footer--start + .fr-table__footer--middle + = paginate @deleted_dossiers, views_prefix: 'shared' + .fr-table__footer--end.flex-no-grow - else %p diff --git a/app/views/administrateurs/archives/index.html.haml b/app/views/administrateurs/archives/index.html.haml index 86cc6465e..5f2bad20b 100644 --- a/app/views/administrateurs/archives/index.html.haml +++ b/app/views/administrateurs/archives/index.html.haml @@ -4,12 +4,14 @@ ['Export et Archives']] } -.container.flex - %h1.mb-2.mr-2 +.fr-container.flex + %h1 Archives -# index not renderable as administrateur flagged as manager, so render it anyway - = render Dossiers::ExportDropdownComponent.new(procedure: @procedure, export_url: method(:download_admin_procedure_exports_path), show_export_template_tab: false) -.container + .fr-ml-2w.fr-my-1w + = render Dossiers::ExportDropdownComponent.new(procedure: @procedure, export_url: method(:download_admin_procedure_exports_path), show_export_template_tab: false) + +.fr-container = render Dossiers::ExportLinkComponent.new(procedure: @procedure, exports: @exports, export_url: method(:download_admin_procedure_exports_path)) = render partial: "shared/archives/notice" diff --git a/app/views/experts/avis/procedure.html.haml b/app/views/experts/avis/procedure.html.haml index e99b39d37..d0db1c7e0 100644 --- a/app/views/experts/avis/procedure.html.haml +++ b/app/views/experts/avis/procedure.html.haml @@ -42,7 +42,7 @@ %tbody - @avis.each do |avis| %tr - %td.number-col + %td.fr-cell--numeric = link_to(expert_avis_path(avis.procedure, avis), class: 'cell-link') do = avis.dossier.id %td= link_to(avis.dossier.user_email_for(:display), expert_avis_path(avis.procedure, avis), class: 'cell-link') diff --git a/app/views/instructeurs/procedures/show.html.haml b/app/views/instructeurs/procedures/show.html.haml index 25b98f8b0..14dc7f824 100644 --- a/app/views/instructeurs/procedures/show.html.haml +++ b/app/views/instructeurs/procedures/show.html.haml @@ -127,7 +127,7 @@ aria: { label: t('views.instructeurs.dossiers.batch_operation.enabled', dossier_id: p.dossier_id) } = label_tag dom_id(BatchOperation.new, "checkbox_#{p.dossier_id}"), "Sélectionner le dossier #{p.dossier_id}", class: 'fr-label' - %td.number-col + %td.fr-cell--numeric - if p.hidden_by_administration_at.present? %span.cell-link= p.dossier_id - else diff --git a/app/views/recherche/_hidden_dossier.html.haml b/app/views/recherche/_hidden_dossier.html.haml index 6f72ce7cb..9939ec0ed 100644 --- a/app/views/recherche/_hidden_dossier.html.haml +++ b/app/views/recherche/_hidden_dossier.html.haml @@ -1,4 +1,4 @@ -%td.number-col +%td.fr-cell--numeric %p.cell-link= p.dossier_id %td diff --git a/app/views/recherche/index.html.haml b/app/views/recherche/index.html.haml index 1f4f2ecbb..a661edda3 100644 --- a/app/views/recherche/index.html.haml +++ b/app/views/recherche/index.html.haml @@ -36,7 +36,7 @@ %tr{ class: [p.hidden_by_administration_at.present? && "file-hidden-by-user"] } - if instructeur_and_expert_dossier - %td.number-col + %td.fr-cell--numeric .cell-link.relative = p.dossier_id - if @notifications_dossier_ids.include?(p.dossier_id) @@ -52,7 +52,7 @@ = render partial: "recherche/hidden_dossier", locals: {p: p, procedure_libelle: procedure_libelle, user_email: user_email} - else - %td.number-col + %td.fr-cell--numeric %a.cell-link.relative{ href: path } = p.dossier_id - if @notifications_dossier_ids.include?(p.dossier_id) diff --git a/app/views/shared/archives/_table.html.haml b/app/views/shared/archives/_table.html.haml index dcfd4be49..c6baf0934 100644 --- a/app/views/shared/archives/_table.html.haml +++ b/app/views/shared/archives/_table.html.haml @@ -1,32 +1,36 @@ -%table.archive-table - %thead - %tr - %th   - %th.text-right Nombre de dossiers terminés - %th.text-right Poids estimé - %th.center Télécharger +.fr-table.fr-table--bordered.fr-my-4w + .fr-table__wrapper + .fr-table__container + .fr-table__content + %table + %thead + %tr + %th{ scope: 'col' } + %th.fr-cell---right{ scope: 'col' } Nombre de dossiers terminés + %th.fr-cell---right{ scope: 'col' } Poids estimé + %th{ scope: 'col' } Télécharger - %tbody - - count_dossiers_termines_by_month.each do |date, count| - - matching_archive = archives.find { |archive| archive.time_span_type == 'monthly' && archive.month == date } - - weight = estimate_weight(matching_archive, count, average_dossier_weight) + %tbody + - count_dossiers_termines_by_month.each do |date, count| + - matching_archive = archives.find { |archive| archive.time_span_type == 'monthly' && archive.month == date } + - weight = estimate_weight(matching_archive, count, average_dossier_weight) - %tr - %td - = I18n.l(date, format: "%B %Y").capitalize - %td.text-right - = count - %td.text-right - = number_to_human_size(weight) - %td.center - - if matching_archive.present? - - if matching_archive.available? - = link_to url_for(matching_archive.file), class: 'fr-btn fr-btn--secondary fr-icon-download-line fr-btn--icon-left fr-btn--sm' do - = t(:archive_ready_html, scope: [:instructeurs, :procedure], generated_period: time_ago_in_words(matching_archive.updated_at)) - - else - = dsfr_icon("fr-icon-flashlight-line", :sm) - = t(:archive_pending_html, scope: [:instructeurs, :procedure], created_period: time_ago_in_words(matching_archive.created_at)) - - elsif weight.nil? || weight < Archive::MAX_SIZE - = link_to "Demander la création", create_archive_url(procedure, date), method: :post, class: "fr-btn fr-btn--secondary fr-icon-download-line fr-btn--icon-left fr-btn--sm" - - else - Archive trop volumineuse + %tr + %td + = I18n.l(date, format: "%B %Y").capitalize + %td.fr-cell--right.fr-cell--numeric + = count + %td.fr-cell--right + = number_to_human_size(weight) + %td + - if matching_archive.present? + - if matching_archive.available? + = link_to url_for(matching_archive.file), class: 'fr-btn fr-btn--secondary fr-icon-download-line fr-btn--icon-left fr-btn--sm' do + = t(:archive_ready_html, scope: [:instructeurs, :procedure], generated_period: time_ago_in_words(matching_archive.updated_at)) + - else + = dsfr_icon("fr-icon-flashlight-line", :sm) + = t(:archive_pending_html, scope: [:instructeurs, :procedure], created_period: time_ago_in_words(matching_archive.created_at)) + - elsif weight.nil? || weight < Archive::MAX_SIZE + = link_to "Demander la création", create_archive_url(procedure, date), method: :post, class: "fr-btn fr-btn--secondary fr-icon-download-line fr-btn--icon-left fr-btn--sm" + - else + Archive trop volumineuse diff --git a/spec/system/administrateurs/procedure_archive_and_export_spec.rb b/spec/system/administrateurs/procedure_archive_and_export_spec.rb index eb868f788..c4c06f456 100644 --- a/spec/system/administrateurs/procedure_archive_and_export_spec.rb +++ b/spec/system/administrateurs/procedure_archive_and_export_spec.rb @@ -32,7 +32,7 @@ describe 'Creating a new procedure', js: true do # check archive expect { - page.first(".archive-table .fr-btn").click + page.first(".fr-table .fr-btn").click }.to have_enqueued_job(ArchiveCreationJob).with(procedure, an_instance_of(Archive), administrateur) expect(page).to have_content("Votre demande a été prise en compte. Selon le nombre de dossiers, cela peut prendre de quelques minutes à plusieurs heures. Vous recevrez un courriel lorsque le fichier sera disponible.") expect(Archive.first.month).not_to be_nil diff --git a/spec/system/instructeurs/instruction_spec.rb b/spec/system/instructeurs/instruction_spec.rb index 5e06cd74f..cdbf85c42 100644 --- a/spec/system/instructeurs/instruction_spec.rb +++ b/spec/system/instructeurs/instruction_spec.rb @@ -208,7 +208,7 @@ describe 'Instructing a dossier:', js: true do end scenario 'download' do expect { - page.first(".archive-table .fr-btn").click + page.first(".fr-table .fr-btn").click }.to have_enqueued_job(ArchiveCreationJob).with(procedure, an_instance_of(Archive), instructeur) expect(Archive.first.month).not_to be_nil end diff --git a/spec/system/instructeurs/procedure_sort_spec.rb b/spec/system/instructeurs/procedure_sort_spec.rb index beb59e8a0..2bde17e47 100644 --- a/spec/system/instructeurs/procedure_sort_spec.rb +++ b/spec/system/instructeurs/procedure_sort_spec.rb @@ -19,18 +19,18 @@ describe "procedure sort", js: true do scenario "should be able to sort with header" do # sorted by notifications (updated_at desc) by default, filtered by followed expect(all(".dossiers-table tbody tr").count).to eq(3) - expect(find(".dossiers-table tbody tr:nth-child(2) .number-col a").text).to eq(followed_dossier.id.to_s) - expect(find(".dossiers-table tbody tr:nth-child(3) .number-col a").text).to eq(followed_dossier_2.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(2) .fr-cell--numeric a").text).to eq(followed_dossier.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(3) .fr-cell--numeric a").text).to eq(followed_dossier_2.id.to_s) click_on "Nº dossier" # sort by id asc - expect(find(".dossiers-table tbody tr:nth-child(2) .number-col a").text).to eq(followed_dossier.id.to_s) - expect(find(".dossiers-table tbody tr:nth-child(3) .number-col a").text).to eq(followed_dossier_2.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(2) .fr-cell--numeric a").text).to eq(followed_dossier.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(3) .fr-cell--numeric a").text).to eq(followed_dossier_2.id.to_s) click_on "Nº dossier" # reverse order - sort by id desc - expect(find(".dossiers-table tbody tr:nth-child(2) .number-col a").text).to eq(followed_dossier_2.id.to_s) - expect(find(".dossiers-table tbody tr:nth-child(3) .number-col a").text).to eq(followed_dossier.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(2) .fr-cell--numeric a").text).to eq(followed_dossier_2.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(3) .fr-cell--numeric a").text).to eq(followed_dossier.id.to_s) end scenario "should be able to sort with header with sva date" do @@ -41,20 +41,20 @@ describe "procedure sort", js: true do visit instructeur_procedure_path(procedure, statut: "suivis") # sorted by notifications (updated_at desc) by default, filtered by followed expect(all(".dossiers-table tbody tr").count).to eq(3) - expect(find(".dossiers-table tbody tr:nth-child(2) .number-col a").text).to eq(followed_dossier.id.to_s) - expect(find(".dossiers-table tbody tr:nth-child(3) .number-col a").text).to eq(followed_dossier_2.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(2) .fr-cell--numeric a").text).to eq(followed_dossier.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(3) .fr-cell--numeric a").text).to eq(followed_dossier_2.id.to_s) click_on "Date décision SVA", exact: true # sort by sva date asc # find("thead .sva-col a").click # sort by sva date asc - expect(find(".dossiers-table tbody tr:nth-child(2) .number-col a").text).to eq(followed_dossier.id.to_s) - expect(find(".dossiers-table tbody tr:nth-child(3) .number-col a").text).to eq(followed_dossier_2.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(2) .fr-cell--numeric a").text).to eq(followed_dossier.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(3) .fr-cell--numeric a").text).to eq(followed_dossier_2.id.to_s) click_on "Date décision SVA ↑", exact: true # reverse order - sort by sva date desc # find("thead .sva-col a").click # reverse order - sort by sva date desc - expect(find(".dossiers-table tbody tr:nth-child(2) .number-col a").text).to eq(followed_dossier_2.id.to_s) - expect(find(".dossiers-table tbody tr:nth-child(3) .number-col a").text).to eq(followed_dossier.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(2) .fr-cell--numeric a").text).to eq(followed_dossier_2.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(3) .fr-cell--numeric a").text).to eq(followed_dossier.id.to_s) end scenario "should be able to sort with direct link to notification sort" do @@ -65,14 +65,14 @@ describe "procedure sort", js: true do find("label", text: "Remonter les dossiers avec une notification").click # reverse order - sort by updated_at asc expect(page).not_to have_checked_field("Remonter les dossiers avec une notification") - expect(find(".dossiers-table tbody tr:nth-child(2) .number-col a").text).to eq(followed_dossier_2.id.to_s) - expect(find(".dossiers-table tbody tr:nth-child(3) .number-col a").text).to eq(followed_dossier.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(2) .fr-cell--numeric a").text).to eq(followed_dossier_2.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(3) .fr-cell--numeric a").text).to eq(followed_dossier.id.to_s) find("label", text: "Remonter les dossiers avec une notification").click # set order back - sort by updated_at desc expect(page).to have_checked_field("Remonter les dossiers avec une notification") - expect(find(".dossiers-table tbody tr:nth-child(2) .number-col a").text).to eq(followed_dossier.id.to_s) - expect(find(".dossiers-table tbody tr:nth-child(3) .number-col a").text).to eq(followed_dossier_2.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(2) .fr-cell--numeric a").text).to eq(followed_dossier.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(3) .fr-cell--numeric a").text).to eq(followed_dossier_2.id.to_s) end scenario "should be able to sort back by notification filter after any other sort" do @@ -83,7 +83,7 @@ describe "procedure sort", js: true do find("label", text: "Remonter les dossiers avec une notification").click # sort by updated_at desc expect(page).to have_checked_field("Remonter les dossiers avec une notification") - expect(find(".dossiers-table tbody tr:nth-child(2) .number-col a").text).to eq(followed_dossier.id.to_s) - expect(find(".dossiers-table tbody tr:nth-child(3) .number-col a").text).to eq(followed_dossier_2.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(2) .fr-cell--numeric a").text).to eq(followed_dossier.id.to_s) + expect(find(".dossiers-table tbody tr:nth-child(3) .fr-cell--numeric a").text).to eq(followed_dossier_2.id.to_s) end end