pagination of list view

[qcg-portal.git] / qcg / templates / qcg / jobs.html

diff --git a/qcg/templates/qcg/jobs.html b/qcg/templates/qcg/jobs.html
index 78e3dd2..3bb81a0 100644 (file)
--- a/qcg/templates/qcg/jobs.html
+++ b/qcg/templates/qcg/jobs.html
@@ -75,6 +75,36 @@
 
     <hr />
 
+
+    <nav class="text-center" style="margin-bottom: 15px">
+        <form action="{{ request.path }}" method="get" class="form-inline" role="form" style="display: inline-block">
+            <div class="input-group input-group-sm">
+                <span class="input-group-btn">
+                    {% if page.has_previous %}
+                        <a href="{{ request.path }}?page={{ page.previous_page_number }}" class="btn btn-default">
+                    {% else %}
+                        <a href="#" class="btn btn-default disabled">
+                    {% endif %}
+                        <span class="glyphicon glyphicon-chevron-left"></span>
+                    </a>
+                </span>
+                <label class="sr-only" for="page">Strona</label>
+                <input type="text" class="form-control text-center" id="page" name="page" value="{{ page.number }}" style="width: 50px">
+                <span class="input-group-btn">
+                    {% if page.has_next %}
+                        <a href="{{ request.path }}?page={{ page.next_page_number }}" class="btn btn-default">
+                    {% else %}
+                        <a href="#" class="btn btn-default disabled">
+                    {% endif %}
+                        <span class="glyphicon glyphicon-chevron-right"></span>
+                    </a>
+                </span>
+            </div>
+        </form>
+        &nbsp;z&nbsp;
+        <a href="{{ request.path }}?page={{ num_pages }}">{{ num_pages }}</a>
+    </nav>
+
     <table class="table table-hover tree">
         <thead>
             <tr>
@@ -89,7 +119,7 @@
             </tr>
         </thead>
         <tbody>
-            {% regroup tasks by job as jobs %}
+            {% regroup page by job as jobs %}
 
             {% for job in jobs %}
                 {% ifequal job.list|length 1 %}
@@ -148,20 +178,37 @@
 
     <nav class="text-center">
         <ul class="pagination">
-            <li>
-                <a href="#" aria-label="Previous">
-                    <span aria-hidden="true">&laquo;</span>
+            {% if page.has_previous %}
+                <li>
+                    <a href="{{ request.path }}?page={{ page.previous_page_number }}" aria-label="Previous">
+                    <span aria-hidden="true"><span class="glyphicon glyphicon-chevron-left"></span>&nbsp;poprzednia</span>
                 </a>
+            {% endif %}
+            </li>
+
+            <li{% ifequal page.number 1 %} class="active"{% endifequal %}>
+                <a href="{{ request.path }}?page=1">1</a>
             </li>
-            <li><a href="#">1</a></li>
-            <li><a href="#">2</a></li>
-            <li><a href="#">3</a></li>
-            <li><a href="#">4</a></li>
-            <li><a href="#">5</a></li>
-            <li>
-                <a href="#" aria-label="Next">
-                    <span aria-hidden="true">&raquo;</span>
+
+            {% if pages_range.0 > 2 %}
+                <li class="disabled"><span aria-hidden="true"><strong>&hellip;</strong></span></li>
+            {% endif %}
+
+            {% for num in pages_range %}
+                <li{% ifequal page.number num %} class="active"{% endifequal %}>
+                    <a href="{{ request.path }}?page={{ num }}">{{ num }}</a>
+                </li>
+            {% endfor %}
+
+            <li class="disabled"><span aria-hidden="true"><strong>z</strong></span></li>
+            <li><a href="{{ request.path }}?page={{ num_pages }}">{{ num_pages }}</a></li>
+
+            {% if page.has_next %}
+                <li>
+                    <a href="{{ request.path }}?page={{ page.next_page_number }}" aria-label="Next">
+                    <span aria-hidden="true">następna&nbsp;<span class="glyphicon glyphicon-chevron-right"></span></span>
                 </a>
+            {% endif %}
             </li>
         </ul>
     </nav>