Merge pull request #9308 from demarches-simplifiees/add-tabs-for-instructeur-index-procedures

ETQ instructeur mes démarches sont filtrées par onglet pour les retrouver plus facilement

app/assets/stylesheets/badges.scss

@@ -19,15 +19,6 @@
     background-color: $orange;
     color: #FFFFFF;
   }
-
-  &.procedure-synthese-badge {
-    color: $white;
-    background-color: $dark-grey;
-    margin-left: 3px;
-    padding-left: $default-spacer;
-    padding-right: $default-spacer;
-    vertical-align: baseline;
-  }
 }
 
 .badge-group {

app/assets/stylesheets/procedure_list.scss

@@ -3,10 +3,6 @@
 @import "mixins";
 
 .procedure-list {
-  .procedure-item {
-    background-color: rgba(0, 0, 0, 0.02);
-  }
-
   .procedure-logo-link {
     background-image: none;
   }
@@ -20,9 +16,6 @@
     background-position: 95% 50%;
   }
 
-  .procedure-status {
-    margin-left: auto;
-  }
 
   .procedure-stats {
     list-style-type: none;

app/assets/stylesheets/procedure_logo.scss

@@ -7,7 +7,6 @@
 
   background-color: #FFFFFF;
   background-position: 95% 50%;
-  border: 1px solid $border-grey;
   height: 84px;
   width: 84px;
   margin-right: $default-padding;

app/controllers/instructeurs/procedures_controller.rb

@@ -14,6 +14,13 @@ module Instructeurs
         .includes(:defaut_groupe_instructeur)
         .order(closed_at: :desc, unpublished_at: :desc, published_at: :desc, created_at: :desc)
 
+      @procedures_publiees = paginated_published_procedures
+      @procedures_draft = paginated_draft_procedures
+      @procedures_closed = paginated_closed_procedures
+      @procedures_publiees_count = current_instructeur.procedures.publiees.count
+      @procedures_draft_count = current_instructeur.procedures.brouillons.count
+      @procedures_closed_count = current_instructeur.procedures.closes.count
+
       dossiers = current_instructeur.dossiers
         .joins(groupe_instructeur: :procedure)
         .where(procedures: { hidden_at: nil })
@@ -47,6 +54,35 @@ module Instructeurs
 
       @procedure_ids_en_cours_with_notifications = current_instructeur.procedure_ids_with_notifications(:en_cours)
       @procedure_ids_termines_with_notifications = current_instructeur.procedure_ids_with_notifications(:termine)
+      @statut = params[:statut]
+      @statut.blank? ? @statut = 'publiees' : @statut = params[:statut]
+    end
+
+    def paginated_published_procedures
+      current_instructeur
+        .procedures
+        .publiees
+        .page(params[:page])
+        .per(ITEMS_PER_PAGE)
+        .order(published_at: :desc)
+    end
+
+    def paginated_draft_procedures
+      current_instructeur
+        .procedures
+        .brouillons
+        .page(params[:page])
+        .per(ITEMS_PER_PAGE)
+        .order(created_at: :desc)
+    end
+
+    def paginated_closed_procedures
+      current_instructeur
+        .procedures
+        .closes
+        .page(params[:page])
+        .per(ITEMS_PER_PAGE)
+        .order(created_at: :desc)
     end
 
     def show

app/views/administrateurs/procedures/_procedures_list.html.haml

@@ -1,3 +1,6 @@
+.fr-h6
+  = page_entries_info procedures
+
 - procedures.each do |procedure|
   .card
     .flex.justify-between

app/views/administrateurs/procedures/index.html.haml

@@ -7,10 +7,10 @@
 
     %nav.tabs{ role: 'navigation', 'aria-label': t('views.users.dossiers.secondary_menu') }
       %ul
-        = tab_item(t('pluralize.published', count: @procedures_publiees.count), admin_procedures_path(statut: 'publiees'), active: @statut == 'publiees', badge: number_with_html_delimiter(@procedures_publiees_count))
+        = tab_item(t('pluralize.published', count: @procedures_publiees_count), admin_procedures_path(statut: 'publiees'), active: @statut == 'publiees', badge: number_with_html_delimiter(@procedures_publiees_count))
         = tab_item('En test', admin_procedures_path(statut: 'brouillons'), active: @statut == 'brouillons', badge: number_with_html_delimiter(@procedures_draft_count))
-        = tab_item(t('pluralize.closed', count: @procedures_closed.count), admin_procedures_path(statut: 'archivees'), active: @statut == 'archivees', badge: number_with_html_delimiter(@procedures_closed_count))
+        = tab_item(t('pluralize.closed', count: @procedures_closed_count), admin_procedures_path(statut: 'archivees'), active: @statut == 'archivees', badge: number_with_html_delimiter(@procedures_closed_count))
-        = tab_item(t('pluralize.deleted', count: @procedures_deleted.count), admin_procedures_path(statut: 'supprimees'), active: @statut === 'supprimees', badge: number_with_html_delimiter(@procedures_deleted_count))
+        = tab_item(t('pluralize.deleted', count: @procedures_deleted_count), admin_procedures_path(statut: 'supprimees'), active: @statut === 'supprimees', badge: number_with_html_delimiter(@procedures_deleted_count))
 
 .fr-container#procedures{ data: { item_count: @statut === "publiees" ? @procedures_publiees_count : @statut === "brouillons" ? @procedures_draft_count : @procedures_closed_count } }
   - if @statut === "publiees"

app/views/experts/avis/index.html.haml

@@ -3,9 +3,9 @@
 .container
   %h1.page-title Avis
 
-  %ul.procedure-list
+  %ul.procedure-list.fr-pl-0
     - @avis_by_procedure.each do |p, procedure_avis|
-      %li.procedure-item.flex.align-start.fr-my-3w.fr-p-2w{ id: dom_id(p) }
+      %li.flex.align-start.fr-my-3w.fr-p-2w{ id: dom_id(p) }
         .flex
           = link_to instructeur_procedure_path(p), class: 'procedure-logo-link' do
             .procedure-logo{ style: "background-image: url(#{p.logo_url})" }
@@ -35,10 +35,10 @@
                       = pluralize(with_answer_count, "avis donné")
 
           - if p.close?
-            .procedure-status
+            .ml-auto
               %span.label
                 = t('helpers.procedure.close')
           - elsif p.depubliee?
-            .procedure-status
+            .ml-auto
               %span.label
                 = t('helpers.procedure.unpublished')

app/views/instructeurs/procedures/_list.html.haml

@@ -1,4 +1,4 @@
-%li.procedure-item.flex.align-start.fr-my-3w.fr-p-2w
+%li.flex.align-start.fr-mb-5w
   .flex
     = link_to instructeur_procedure_path(p), class: 'procedure-logo-link' do
       .procedure-logo{ style: "background-image: url(#{p.logo_url})" }
@@ -77,8 +77,8 @@
                 = t('pluralize.archived', count: archived_count)
 
     - if p.close?
-      .procedure-status
+      .ml-auto
-        %span.label Close
+        %span.fr-badge Close
     - elsif p.depubliee?
-      .procedure-status
+      .ml-auto
-        %span.label Dépubliée
+        %span.fr-badge Dépubliée

app/views/instructeurs/procedures/_synthese.html.haml

@@ -1,6 +1,6 @@
 - if procedures.length > 1
-  .tab-title
+  .flex.align-center.fr-mb-2w
-    %span
+    %h2.fr-text--sm.fr-mb-1w= t('views.instructeurs.dossiers.dossier_synthesis')
-      = t('views.instructeurs.dossiers.dossier_synthesis')
     - all_dossiers_counts.each_with_index  do |(label, dossier_count)|
-        %span.badge.procedure-synthese-badge= number_with_html_delimiter(dossier_count) + ' ' + label
+      - if dossier_count != 0
+        %span.fr-badge.fr-ml-1w.fr-mb-1w= number_with_html_delimiter(dossier_count) + ' ' + label

app/views/instructeurs/procedures/index.html.haml

@@ -1,12 +1,31 @@
 - content_for(:title, "Démarches")
 
-.container
+.sub-header
-  %h1.page-title Démarches
+  .fr-container
+    %h1.fr-h3.fr-mb-0 Démarches
     = render partial: 'instructeurs/procedures/synthese', locals: { procedures: @procedures, all_dossiers_counts: @all_dossiers_counts }
 
-  %ul.procedure-list
+    %nav.tabs{ role: 'navigation', 'aria-label': t('views.users.dossiers.secondary_menu') }
+      %ul
+        = tab_item(t('pluralize.published', count: @procedures_publiees_count), instructeur_procedures_path(statut: 'publiees'), active: @statut == 'publiees', badge: number_with_html_delimiter(@procedures_publiees_count))
+        = tab_item('En test', instructeur_procedures_path(statut: 'brouillons'), active: @statut == 'brouillons', badge: number_with_html_delimiter(@procedures_draft_count))
+        = tab_item(t('pluralize.closed', count: @procedures_closed_count), instructeur_procedures_path(statut: 'archivees'), active: @statut == 'archivees', badge: number_with_html_delimiter(@procedures_closed_count))
+
+.fr-container
+  - if @statut === "publiees"
+    - collection = @procedures_publiees
+  - if @statut === "brouillons"
+    - collection = @procedures_draft
+  - if @statut === "archivees"
+    - collection = @procedures_closed
+
+
+  - if collection.present?
+    .fr-h6
+      = page_entries_info collection
+    %ul.procedure-list.fr-pl-0
       = render partial: 'instructeurs/procedures/list',
-      collection: @procedures,
+        collection: collection,
         as: :p,
         locals: { dossiers_count_per_procedure: @dossiers_count_per_procedure,
           dossiers_a_suivre_count_per_procedure: @dossiers_a_suivre_count_per_procedure,
@@ -17,3 +36,5 @@
           followed_dossiers_count_per_procedure: @followed_dossiers_count_per_procedure,
           procedure_ids_en_cours_with_notifications: @procedure_ids_en_cours_with_notifications,
           procedure_ids_termines_with_notifications: @procedure_ids_termines_with_notifications }
+
+    = paginate collection, views_prefix: 'shared'

spec/views/instructeur/procedures/_synthese.html.haml_spec.rb

@@ -19,10 +19,10 @@ describe 'instructeurs/procedures/_synthese', type: :view do
     }
 
     it { is_expected.to have_text('Synthèse des dossiers') }
-    it { is_expected.to have_text('suivis') }
+    it { is_expected.not_to have_text('suivis') }
     it { is_expected.to have_text('traités') }
     it { is_expected.to have_text('dossiers') }
-    it { is_expected.to have_text('archivés') }
+    it { is_expected.not_to have_text('archivés') }
   end
 
   context 'when instructeur has 1 procedure and 1 file, table is not shown' do