list.html.j2 2.92 KB
Newer Older
Nicolas Joyard's avatar
Nicolas Joyard committed
1 2 3 4 5
{% extends "_base.html.j2" %}

{% block content %}
  <section class="panel panel-default">
    <header class="panel-heading">
6
      <b>Liste des {{ parlementaires|length }} parlementaires</b>
Nicolas Joyard's avatar
Nicolas Joyard committed
7 8
    </header>

9 10 11 12 13 14 15 16
    <article class="panel-body">
      <div class="input-group">
        <span class="input-group-addon" id="search-header">Filtrer les parlementaires</span>
        <input type="search" autocomplete="off" class="form-control" id="search" placeholder="Nom, groupe, circonscription..." aria-describedby="search-header">
      </div>
    </article>

    <table class="table table-condensed table-striped sortable searchable">
17
      <thead>
Nicolas Joyard's avatar
Nicolas Joyard committed
18
        <tr>
19 20 21 22
          <th colspan="2" data-defaultsort="asc" data-mainsort="1">Parlementaire</th>
          <th>Groupe</th>
          <th>Circonscription</th>
          <th>Etape</th>
Nicolas Joyard's avatar
Nicolas Joyard committed
23
        </tr>
24 25 26
      </thead>
      <tbody>
        {% for parl in parlementaires %}
Nicolas Joyard's avatar
Nicolas Joyard committed
27

28 29 30
          <tr>
            <td>
              <img class="chamber-icon" src="{{ url_for('static', filename=parl.chambre|lower+'.png') }}">
31
              <span class="search-vector">{{ parl.nom }} {{ parl.prenom }} {{ parl.nom_circo }} {{ parl.num_deptmt }} {{ parl.groupe.sigle }} {{ parl.groupe.nom }}</span>
32 33
            </td>
            <td data-value="{{ parl.nom }} {{ parl.prenom }}">{{ parl.prenom }} {{ parl.nom }}</td>
34
            <td><span title="{{ parl.groupe.nom }}" class="label" style="background-color: {{ parl.groupe.couleur }};">{{ parl.groupe.sigle }}</span></td>
35
            <td data-value="{{ parl.num_deptmt }} {{ parl.num_circo }}">{{ parl.nom_circo }} n°{{ parl.num_circo }}</td>
Nicolas Joyard's avatar
Nicolas Joyard committed
36
            <td><span class="label" style="background-color: {{ parl.etape.couleur }};">{{ parl.etape.label }}</span></td>
37
          </tr>
Nicolas Joyard's avatar
Nicolas Joyard committed
38

39
        {% else %}
Nicolas Joyard's avatar
Nicolas Joyard committed
40

41 42 43 44 45 46 47 48
          <tr>
            <td class="warning" colspan="5">
              <em>Aucun parlementaire trouvé :(</em>
            </td>
          </tr>

        {% endfor %}
      </tbody>
Nicolas Joyard's avatar
Nicolas Joyard committed
49 50 51
    </table>
  </section>
{% endblock %}
52 53 54

{% block header %}
  <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='bootstrap-sortable.css') }}">
55 56 57 58

  <style>
    .search-vector { display: none; }
  </style>
59 60 61
{% endblock %}

{% block scripts %}
Nicolas Joyard's avatar
Nicolas Joyard committed
62
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
63 64
  <script src="{{ url_for('static', filename='moment.min.js') }}"></script>
  <script src="{{ url_for('static', filename='bootstrap-sortable.js') }}"></script>
65 66 67 68 69 70 71 72 73 74 75 76 77 78

  <script>
    $(document).ready(function () {
      (function ($) {
        $('#search').keyup(function () {
          var rex = new RegExp($(this).val(), 'i');
          $('.searchable tbody tr').hide();
          $('.searchable tbody tr').filter(function () {
            return rex.test($(this).find('.search-vector').text());
          }).show();
        });
      }(jQuery));
    });
  </script>
79
{% endblock %}