mirror of
https://github.com/th3r00t/pyShelf.git
synced 2026-04-28 01:59:35 -04:00
Merge pull request #84 from th3r00t/0.8.0--dev-table_refactor
Finished Pagination
This commit is contained in:
th3r00t
6
src/backend/lib/storage.py
vendored
6
src/backend/lib/storage.py
vendored
@@ -251,13 +251,15 @@ class Storage:
|
||||
.join(BookCollection)
|
||||
.where(BookCollection.collection_id == collection)
|
||||
.offset(skip or 0)
|
||||
.limit(limit or 100)
|
||||
# .limit(limit or 100)
|
||||
.limit(limit)
|
||||
).scalars().all()
|
||||
else:
|
||||
result = session.execute(
|
||||
select(Book)
|
||||
.offset(skip or 0)
|
||||
.limit(limit or 100)
|
||||
# .limit(limit or 100)
|
||||
.limit(limit)
|
||||
).scalars().all()
|
||||
return result
|
||||
|
||||
|
||||
13
src/frontend/lib/FastAPIServer.py
vendored
13
src/frontend/lib/FastAPIServer.py
vendored
@@ -3,6 +3,7 @@ import uvicorn
|
||||
import os
|
||||
import sass
|
||||
import datetime
|
||||
import math
|
||||
# import gzip
|
||||
# import brotli
|
||||
from json import dumps
|
||||
@@ -176,7 +177,15 @@ class FastAPIServer():
|
||||
books = storage.get_books(collection=None, skip=skip_num, limit=limit)
|
||||
collections = storage.get_collections()
|
||||
"""Home page responder."""
|
||||
context = {"request": request, "books": books, "collections": collections, "page": skip, "limit": limit}
|
||||
total_books = len(storage.get_books())
|
||||
context = {
|
||||
"request": request,
|
||||
"total_pages": math.ceil(total_books / limit),
|
||||
"books": books,
|
||||
"collections": collections,
|
||||
"page": skip,
|
||||
"limit": limit
|
||||
}
|
||||
return templates.TemplateResponse("index.html", context)
|
||||
|
||||
@app.get("/api/books", response_class=JSONResponse)
|
||||
@@ -222,12 +231,14 @@ class FastAPIServer():
|
||||
else:
|
||||
skip_num = skip * limit
|
||||
books = storage.get_books(collection, skip=skip_num, limit=limit)
|
||||
total_books = len(storage.get_books(collection))
|
||||
collections = storage.get_collections()
|
||||
context = {
|
||||
"request": request,
|
||||
"books": books,
|
||||
"collections": collections,
|
||||
"collection": collection,
|
||||
"total_pages": math.ceil(total_books / limit),
|
||||
"page": skip,
|
||||
"limit": limit
|
||||
}
|
||||
|
||||
37
src/frontend/static/styles/pyShelf.sass
vendored
37
src/frontend/static/styles/pyShelf.sass
vendored
@@ -108,8 +108,45 @@ $footer-background-color: $ps-color-primary-trans !important
|
||||
align-content: center;
|
||||
background-color: $ps-color-background;
|
||||
|
||||
#collection_dropdown
|
||||
margin-top: auto;
|
||||
margin-bottom: auto;
|
||||
|
||||
.footer
|
||||
display: flex;
|
||||
padding: 1rem !important;
|
||||
|
||||
|
||||
#pagination-container
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
padding: 0.5rem;
|
||||
|
||||
#pagination-left, #pagination-right
|
||||
background-color: $ps-color-secondary;
|
||||
|
||||
#pagination-left
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
|
||||
#pagination-center
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex: 1;
|
||||
|
||||
#pagination-right
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
@import "../../node_modules/bulma/bulma.scss"
|
||||
|
||||
.container-full
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
@@ -27,7 +27,7 @@
|
||||
<div class="is-dark book" id="{{book.id}}" onclick="window.location.href='/api/get_book/{{ book.id }}'">
|
||||
<div class="image book-thumbnail"
|
||||
style="
|
||||
background-image: url("{{ url_for('static', path='images/no-cover.jpg') }}");
|
||||
background-image: url({{ url_for('static', path='images/no-cover.jpg') }});
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
@@ -42,11 +42,16 @@
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div id="pagination" class="container is-dark">
|
||||
<nav class="pagination is-centered" role="navigation" aria-label="pagination">
|
||||
<a class="pagination-previous" href="/api/collection/{{collection}}?skip={{ page|int - 1 }}" id="prev-page">Previous</a>
|
||||
<a class="pagination-next" href="/api/collection/{{collection}}?skip={{ page|int + 1 }}" id="next-page">Next</a>
|
||||
</nav>
|
||||
<div id="pagination-container" class="container-full is-dark">
|
||||
<div id="pagination-left">
|
||||
<a class="pagination-previous" href="/api/collection/{{ collection }}/?skip={{ page-1 }}" id="prev-page">< Previous</a>
|
||||
</div>
|
||||
<div id="pagination-center">
|
||||
<span id="pagination-list">page {{ page }} of {{ total_pages }}</span>
|
||||
</div>
|
||||
<div id="pagination-right">
|
||||
<a class="pagination-next" href="/api/collection/{{ collection }}/?skip={{ page+1 }}" id="next-page">Next ></a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{% include 'footer.html' %}
|
||||
|
||||
@@ -1,18 +1,18 @@
|
||||
<footer class="footer is-dark" id="footer-main">
|
||||
<a href="https://python.org">
|
||||
<img
|
||||
src="{{ url_for('static', path='images/python-logo-transparent.svg') }}"
|
||||
alt="Powered by Python"
|
||||
width="128"
|
||||
height="24">
|
||||
</a>
|
||||
<a href="https://bulma.io">
|
||||
<img
|
||||
src="https://bulma.io/assets/images/made-with-bulma--dark.png"
|
||||
alt="Made with Bulma"
|
||||
width="128"
|
||||
height="24">
|
||||
</a>
|
||||
</footer>
|
||||
<!-- <footer class="footer is-dark" id="footer-main"> -->
|
||||
<!-- <a href="https://python.org"> -->
|
||||
<!-- <img -->
|
||||
<!-- src="{{ url_for('static', path='images/python-logo-transparent.svg') }}" -->
|
||||
<!-- alt="Powered by Python" -->
|
||||
<!-- width="128" -->
|
||||
<!-- height="24"> -->
|
||||
<!-- </a> -->
|
||||
<!-- <a href="https://bulma.io"> -->
|
||||
<!-- <img -->
|
||||
<!-- src="https://bulma.io/assets/images/made-with-bulma--dark.png" -->
|
||||
<!-- alt="Made with Bulma" -->
|
||||
<!-- width="128" -->
|
||||
<!-- height="24"> -->
|
||||
<!-- </a> -->
|
||||
<!-- </footer> -->
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -26,7 +26,7 @@
|
||||
<div class="is-dark book" id="{{book.id}}" onclick="window.location.href='/api/get_book/{{ book.id }}'">
|
||||
<div class="image book-thumbnail"
|
||||
style="
|
||||
background-image: url("{{ url_for('static', path='images/no-cover.jpg') }}");
|
||||
background-image: url({{ url_for('static', path='images/no-cover.jpg') }});
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
@@ -41,11 +41,16 @@
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div id="pagination" class="container is-dark">
|
||||
<nav class="pagination is-centered" role="navigation" aria-label="pagination">
|
||||
<a class="pagination-previous" href="/?skip={{ page-1 }}" id="prev-page">Previous</a>
|
||||
<a class="pagination-next" href="/?skip={{ page+1 }}" id="next-page">Next</a>
|
||||
</nav>
|
||||
<div id="pagination-container" class="container-full is-dark">
|
||||
<div id="pagination-left">
|
||||
<a class="pagination-previous" href="/?skip={{ page-1 }}" id="prev-page">< Previous</a>
|
||||
</div>
|
||||
<div id="pagination-center">
|
||||
<span id="pagination-list">page {{ page }} of {{ total_pages }}</span>
|
||||
</div>
|
||||
<div id="pagination-right">
|
||||
<a class="pagination-next" href="/?skip={{ page+1 }}" id="next-page">Next ></a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{% include 'footer.html' %}
|
||||
|
||||
@@ -49,6 +49,10 @@
|
||||
<div class="select is-small is-rounded is-link" id="collection_dropdown">
|
||||
<!-- <select id="collection_select" onchange="window.location.href='/api/collection/' + this.value"> -->
|
||||
<select id="collection_select">
|
||||
<option value="" disabled selected>Select a collection</option>
|
||||
{% if collections is not defined or collections|length == 0 %}
|
||||
<option value="" disabled>No collections available</option>
|
||||
{% endif %}
|
||||
{% for collection in collections %}
|
||||
<option value="{{collection.id}}" class="collection_selection">{{collection.name}}</option>
|
||||
{% endfor %}
|
||||
|
||||
Reference in New Issue
Block a user