split filter in 2 partials too display filters tags on its own div to have more spaces

This commit is contained in:
Lisa Durand 2023-01-10 14:06:56 +01:00
parent d856969790
commit 7abf51ca81
8 changed files with 32 additions and 27 deletions

View file

@ -1,15 +0,0 @@
%span.dropdown{ data: { controller: 'menu-button', popover: 'true' } }
%button.fr-btn.fr-btn--secondary.fr-btn--sm.fr-mr-1w.dropdown-button{ data: { menu_button_target: 'button' } }
= t('views.instructeurs.dossiers.filters.title')
#filter-menu.dropdown-content.left-aligned.fade-in-down{ data: { menu_button_target: 'menu' } }
= render Dossiers::FilterComponent.new(procedure: procedure, procedure_presentation: @procedure_presentation, statut: statut)
- current_filters.group_by { |filter| filter['table'] }.each_with_index do |(table, filters), i|
- if i > 0
= " et "
- filters.each_with_index do |filter, i|
- if i > 0
= " ou "
= link_to remove_filter_instructeur_procedure_path(procedure, { statut: statut, field: "#{filter['table']}/#{filter['column']}", value: filter['value'] }),
class: "fr-tag fr-tag--dismiss fr-mb-1w", aria: { label: "Retirer le filtre #{filter['column']}" } do
= "#{filter['label'].truncate(50)} : #{procedure_presentation.human_value_for_filter(filter)}"

View file

@ -0,0 +1,5 @@
%span.dropdown{ data: { controller: 'menu-button', popover: 'true' } }
%button.fr-btn.fr-btn--secondary.fr-btn--sm.fr-mr-2w.dropdown-button{ data: { menu_button_target: 'button' } }
= t('views.instructeurs.dossiers.filters.title')
#filter-menu.dropdown-content.left-aligned.fade-in-down{ data: { menu_button_target: 'menu' } }
= render Dossiers::FilterComponent.new(procedure: procedure, procedure_presentation: @procedure_presentation, statut: statut)

View file

@ -0,0 +1,11 @@
- if current_filters.count > 0
.fr-mb-2w
- current_filters.group_by { |filter| filter['table'] }.each_with_index do |(table, filters), i|
- if i > 0
= " et "
- filters.each_with_index do |filter, i|
- if i > 0
= " ou "
= link_to remove_filter_instructeur_procedure_path(procedure, { statut: statut, field: "#{filter['table']}/#{filter['column']}", value: filter['value'] }),
class: "fr-tag fr-tag--dismiss fr-mb-1w", aria: { label: "Retirer le filtre #{filter['column']}" } do
= "#{filter['label'].truncate(50)} : #{procedure_presentation.human_value_for_filter(filter)}"

View file

@ -56,10 +56,11 @@
.fr-container--fluid.fr-mx-4w.overflow-y-visible
%hr
.flex.fr-mb-2w
.flex.align-center
- if @filtered_sorted_paginated_ids.present? || @current_filters.count > 0
= render partial: "dossiers_filter_dropdown", locals: { procedure: @procedure, statut: @statut}
= render Dossiers::NotifiedToggleComponent.new(procedure: @procedure, procedure_presentation: @procedure_presentation)
= render partial: "dossiers_filter", locals: { procedure: @procedure, procedure_presentation: @procedure_presentation, current_filters: @current_filters, statut: @statut, filterable_fields_for_select: @filterable_fields_for_select }
.fr-ml-auto
%span.dropdown{ data: { controller: 'menu-button', popover: 'true' } }
%button.fr-btn.fr-btn--sm.fr-btn--secondary.dropdown-button.fr-ml-1w{ data: { menu_button_target: 'button' } }
@ -87,6 +88,8 @@
= render Dossiers::ExportComponent.new(procedure: @procedure, exports: @exports, statut: @statut, count: @dossiers_count, export_url: method(:download_export_instructeur_procedure_path))
- if @filtered_sorted_paginated_ids.present? || @current_filters.count > 0
= render partial: "dossiers_filter_tags", locals: { procedure: @procedure, procedure_presentation: @procedure_presentation, current_filters: @current_filters, statut: @statut }
- batch_operation_component = Dossiers::BatchOperationComponent.new(statut: @statut, procedure: @procedure)
- if @batch_operations.present?
@ -97,7 +100,7 @@
.flex.align-center
%span.fr-h6.fr-mb-0.fr-mr-2w
= t('views.instructeurs.dossiers.dossiers_count', count: @dossiers_count)
= render Dossiers::NotifiedToggleComponent.new(procedure: @procedure, procedure_presentation: @procedure_presentation)
= render batch_operation_component
.fr-table.fr-table--bordered
%table.table.dossiers-table.hoverable