demarches-normaliennes/app/views/shared/procedures/_stats.html.haml

.statistiques
  -# Load Chartkick lazily, by using our React lazy-loader.
  -# (Chartkick itself doesn't use React though)
  = react_component('Chartkick')

  %h1.new-h1= title
  .stat-cards
    - if @usual_traitement_time.present?
      .stat-card.big-number-card
        %span.big-number-card-title TEMPS DE TRAITEMENT USUEL
        %span.big-number-card-number
          = distance_of_time_in_words(@usual_traitement_time)
        %span.big-number-card-detail
          #{ProcedureStatsConcern::USUAL_TRAITEMENT_TIME_PERCENTILE}% des demandes des #{ProcedureStatsConcern::NB_DAYS_RECENT_DOSSIERS} derniers jours ont été traitées en moins de #{distance_of_time_in_words(@usual_traitement_time)}.

  .stat-cards
    .stat-card.stat-card-half.pull-left
      %span.stat-card-title TEMPS DE TRAITEMENT
      .stat-card-details depuis le lancement de la procédure
      .chart-container
        .chart
          - colors = %w(#C3D9FF #0069CC #1C7EC9) # from _colors.scss
          = column_chart @usual_traitement_time_by_month, ytitle: "Nb Jours", legend: "bottom", label: "Temps de traitement entre le passage en instruction et la réponse (accepté, refusé, ou classé sans suite) pour 90% des dossiers"

    .stat-card.stat-card-half.pull-left
      %span.stat-card-title AVANCÉE DES DOSSIERS
      .stat-card-details depuis le lancement de la procédure
      .chart-container
        .chart
          = area_chart @dossiers_funnel, ytitle: 'Nb dossiers', label: 'Nb dossiers'

  .stat-cards
    .stat-card.stat-card-half.pull-left
      %span.stat-card-title TAUX D’ACCEPTATION
      .stat-card-details depuis le lancement de la procédure
      .chart-container
        .chart
          = pie_chart @termines_states,
            code: true,
            colors: %w(#387EC3 #AE2C2B #FAD859),
            label: 'Taux',
            suffix: '%',
            library: { plotOptions: { pie: {  dataLabels: { enabled: true, format: '{point.name} : {point.percentage: .1f}%' } } } }


    .stat-card.stat-card-half.pull-left
      %span.stat-card-title RÉPARTITION PAR SEMAINE
      .stat-card-details au cours des 6 derniers mois
      .chart-container
        .chart
          = line_chart @termines_by_week, colors: ["#387EC3", "#AE2C2B", "#FAD859"], ytitle: 'Nb dossiers'