pagination

bangumi · Aug 24, 2024 · 65698ff · 65698ff
1 parent d772301
commit 65698ff
Show file tree

Hide file tree

Showing 2 changed files with 52 additions and 39 deletions.
diff --git a/server/templates/component/pagination.html.jinja2 b/server/templates/component/pagination.html.jinja2
@@ -0,0 +1,51 @@
+{# require current_page and total_page to work #}
+
+<nav aria-label="...">
+    <ul class="pagination">
+        <li class="page-item">
+            <a class="page-link"
+               href="{{ replace_url_query(page=1) }}">&laquo;</a>
+        </li>
+
+        {% if current_page > 1 %}
+            <li class="page-item">
+                <a class="page-link"
+                   href="{{ replace_url_query(page=current_page-1) }}">&lt;</a>
+            </li>
+        {% endif %}
+
+        {% if current_page - 2 > 1 %}
+            <span class="ms-3 me-3">...</span>
+        {% endif %}
+
+        {% for index in range(max(1, current_page - 2) , min(current_page + 3, total_page + 1)) %}
+            {% if index == current_page %}
+                <li class="page-item active">
+                    <a class="page-link"
+                       href="{{ replace_url_query(page=index) }}">{{ index }}</a>
+                </li>
+            {% else %}
+                <li class="page-item">
+                    <a class="page-link"
+                       href="{{ replace_url_query(page=index) }}">{{ index }}</a>
+                </li>
+            {% endif %}
+        {% endfor %}
+
+        {% if current_page + 3 < total_page + 1 %}
+            <span class="ms-3 me-3">...</span>
+        {% endif %}
+
+        {% if current_page < total_page %}
+            <li class="page-item">
+                <a class="page-link"
+                   href="{{ replace_url_query(page=current_page + 1) }}">&gt;</a>
+            </li>
+        {% endif %}
+
+        <li class="page-item">
+            <a class="page-link"
+               href="{{ replace_url_query(page=total_page) }}">&raquo;</a>
+        </li>
+    </ul>
+</nav>
diff --git a/server/templates/list.html.jinja2 b/server/templates/list.html.jinja2
@@ -208,44 +208,6 @@
     </div>
 
     {% if total_page is defined %}
-        <div class="row">
-            <nav aria-label="...">
-                <ul class="pagination">
-                    <li class="page-item">
-                        <a class="page-link"
-                           href="{{ replace_url_query(page=1) }}">&laquo;</a>
-                    </li>
-                    {% if current_page > 1 %}
-                        <li class="page-item">
-                            <a class="page-link"
-                               href="{{ replace_url_query(page=current_page-1) }}">&lt;</a>
-                        </li>
-                    {% endif %}
-                    {% for index in range(max(1, current_page - 2) , min(current_page + 3, total_page + 1)) %}
-                        {% if index == current_page %}
-                            <li class="page-item active">
-                                <a class="page-link"
-                                   href="{{ replace_url_query(page=index) }}">{{ index }}</a>
-                            </li>
-                        {% else %}
-                            <li class="page-item">
-                                <a class="page-link"
-                                   href="{{ replace_url_query(page=index) }}">{{ index }}</a>
-                            </li>
-                        {% endif %}
-                    {% endfor %}
-                    {% if current_page < total_page %}
-                        <li class="page-item">
-                            <a class="page-link"
-                               href="{{ replace_url_query(page=current_page + 1) }}">&gt;</a>
-                        </li>
-                    {% endif %}
-                    <li class="page-item">
-                        <a class="page-link"
-                           href="{{ replace_url_query(page=total_page) }}">&raquo;</a>
-                    </li>
-                </ul>
-            </nav>
-        </div>
+        {% include "component/pagination.html.jinja2" %}
     {% endif %}
 {% endblock %}