wowlikon/LibraryAPI
1
0
Fork 0
mirror of https://github.com/wowlikon/LiB.git synced 2026-02-04 04:31:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

Доабвлеие страниц на фронтэнде

Browse Source
This commit is contained in:
wowlikon
2025-12-20 09:25:00 +03:00
parent 961bf95af7
commit a3203d713d
18 changed files with 1435 additions and 107 deletions
Download Patch File Download Diff File Expand all files Collapse all files
library_service/templates/author.html
+16
View File
@@ -0,0 +1,16 @@
{% extends "base.html" %} {% block title %}LiB - Автор{% endblock %} {% block
content %}
<div class="flex flex-1 mt-4 p-4">
<main class="flex-1 max-w-4xl mx-auto">
<div id="author-card" class="bg-white p-6 rounded-lg shadow-md mb-6">
</div>
<div id="books-section" class="bg-white p-6 rounded-lg shadow-md">
<h2 class="text-xl font-semibold mb-4">Книги автора</h2>
<div id="books-container">
</div>
</div>
</main>
</div>
{% endblock %} {% block scripts %}
<script type="text/javascript" src="/static/author.js"></script>
{% endblock %}
library_service/templates/authors.html
+72
View File
@@ -0,0 +1,72 @@
{% extends "base.html" %} {% block title %}LiB - Авторы{% endblock %} {% block
content %}
<div class="flex flex-1 mt-4 p-4">
<aside
class="w-1/4 bg-white p-4 rounded-lg shadow-md mr-4 h-fit resize-x overflow-auto min-w-64 max-w-96"
>
<h2 class="text-xl font-semibold mb-4">Поиск</h2>
<div class="relative mb-4">
<input
type="text"
id="author-search-input"
class="w-full pl-10 pr-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:border-gray-500"
placeholder="Поиск авторов..."
maxlength="50"
/>
<svg
class="absolute left-3 top-1/2 transform -translate-y-1/2 w-5 h-5 text-gray-400"
fill="none"
stroke="currentColor"
viewBox="0 0 24 24"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"
/>
</svg>
</div>
<h2 class="text-xl font-semibold mb-4">Сортировка</h2>
<div class="mb-4">
<div class="space-y-2">
<label class="flex items-center cursor-pointer">
<input
type="radio"
name="sort"
value="name_asc"
checked
class="w-4 h-4 text-gray-500 focus:ring-gray-500"
/>
<span class="ml-2 text-gray-700">По имени (А-Я)</span>
</label>
<label class="flex items-center cursor-pointer">
<input
type="radio"
name="sort"
value="name_desc"
class="w-4 h-4 text-gray-500 focus:ring-gray-500"
/>
<span class="ml-2 text-gray-700">По имени (Я-А)</span>
</label>
</div>
</div>
<button
id="reset-filters-btn"
class="w-full bg-white text-gray-500 py-2 px-4 rounded-lg border border-gray-300 hover:bg-gray-50 transition duration-200"
>
Сбросить
</button>
<div
id="results-counter"
class="mt-4 text-center text-sm text-gray-500"
></div>
</aside>
<main class="flex-1">
<div id="authors-container"></div>
<div id="pagination-container"></div>
</main>
</div>
{% endblock %} {% block scripts %}
<script type="text/javascript" src="/static/authors.js"></script>
{% endblock %}
library_service/templates/base.html
+1
View File
@@ -21,6 +21,7 @@
<ul class="flex space-x-4">
<li><a href="/" class="hover:text-gray-200">Главная</a></li>
<li><a href="/books" class="hover:text-gray-200">Книги</a></li>
<li><a href="/authors" class="hover:text-gray-200">Авторы</a></li>
<li><a href="/about" class="hover:text-gray-200">О нас</a></li>
<li><a href="/api" class="hover:text-gray-200">API</a></li>
</ul>
library_service/templates/book.html
+21
View File
@@ -0,0 +1,21 @@
{% extends "base.html" %} {% block title %}LiB - Книга{% endblock %} {% block
content %}
<div class="flex flex-1 mt-4 p-4">
<main class="flex-1 max-w-4xl mx-auto">
<div id="book-card" class="bg-white p-6 rounded-lg shadow-md mb-6">
</div>
<div id="authors-section" class="bg-white p-6 rounded-lg shadow-md mb-6">
<h2 class="text-xl font-semibold mb-4">Авторы</h2>
<div id="authors-container">
</div>
</div>
<div id="genres-section" class="bg-white p-6 rounded-lg shadow-md">
<h2 class="text-xl font-semibold mb-4">Жанры</h2>
<div id="genres-container">
</div>
</div>
</main>
</div>
{% endblock %} {% block scripts %}
<script type="text/javascript" src="/static/book.js"></script>
{% endblock %}