mirror of
https://github.com/wowlikon/LiB.git
synced 2026-02-04 04:31:09 +00:00
Расширение фронтэнда
This commit is contained in:
@@ -1,25 +1,47 @@
|
||||
{% extends "base.html" %} {% block content %}
|
||||
<div class="container mx-auto p-4 max-w-4xl">
|
||||
<div id="author-card" class="bg-white rounded-lg shadow-md p-6 mb-6">
|
||||
<a
|
||||
href="/authors"
|
||||
class="inline-flex items-center text-gray-500 hover:text-gray-700 transition-colors mb-4"
|
||||
>
|
||||
<svg
|
||||
class="w-4 h-4 mr-1"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
<div class="flex items-center justify-between mb-4">
|
||||
<a
|
||||
href="/authors"
|
||||
class="inline-flex items-center text-gray-500 hover:text-gray-700 transition-colors"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M15 19l-7-7 7-7"
|
||||
></path>
|
||||
</svg>
|
||||
Вернуться к списку авторов
|
||||
</a>
|
||||
<svg
|
||||
class="w-4 h-4 mr-1"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M15 19l-7-7 7-7"
|
||||
></path>
|
||||
</svg>
|
||||
Вернуться к списку авторов
|
||||
</a>
|
||||
<a
|
||||
id="edit-author-btn"
|
||||
href="#"
|
||||
class="hidden p-2 text-gray-500 hover:text-gray-700 hover:bg-gray-100 rounded-lg transition-colors"
|
||||
title="Редактировать автора"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"
|
||||
></path>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
<div id="author-loader" class="flex items-start animate-pulse">
|
||||
<div class="w-24 h-24 bg-gray-200 rounded-full mr-6"></div>
|
||||
<div class="flex-1">
|
||||
|
||||
@@ -159,6 +159,29 @@
|
||||
</svg>
|
||||
Мои книги
|
||||
</a>
|
||||
<template
|
||||
x-if="user.roles && user.roles.includes('admin')"
|
||||
>
|
||||
<a
|
||||
href="/users"
|
||||
class="flex items-center px-4 py-2 text-sm hover:bg-gray-100 text-gray-700"
|
||||
>
|
||||
<svg
|
||||
class="w-4 h-4 mr-3 text-gray-400"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z"
|
||||
></path>
|
||||
</svg>
|
||||
Пользователи
|
||||
</a>
|
||||
</template>
|
||||
<div class="border-t border-gray-200">
|
||||
<button
|
||||
@click="Auth.logout()"
|
||||
|
||||
@@ -1,25 +1,47 @@
|
||||
{% extends "base.html" %} {% block content %}
|
||||
<div class="container mx-auto p-4 max-w-4xl">
|
||||
<div id="book-card" class="bg-white rounded-lg shadow-md p-6">
|
||||
<a
|
||||
href="/books"
|
||||
class="inline-flex items-center text-gray-500 hover:text-gray-700 transition-colors mb-4"
|
||||
>
|
||||
<svg
|
||||
class="w-4 h-4 mr-1"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
<div class="flex items-center justify-between mb-4">
|
||||
<a
|
||||
href="/books"
|
||||
class="inline-flex items-center text-gray-500 hover:text-gray-700 transition-colors"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M15 19l-7-7 7-7"
|
||||
></path>
|
||||
</svg>
|
||||
Вернуться к списку книг
|
||||
</a>
|
||||
<svg
|
||||
class="w-4 h-4 mr-1"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M15 19l-7-7 7-7"
|
||||
></path>
|
||||
</svg>
|
||||
Вернуться к списку книг
|
||||
</a>
|
||||
<a
|
||||
id="edit-book-btn"
|
||||
href="#"
|
||||
class="hidden p-2 text-gray-500 hover:text-gray-700 hover:bg-gray-100 rounded-lg transition-colors"
|
||||
title="Редактировать книгу"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"
|
||||
></path>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
<div
|
||||
id="book-loader"
|
||||
class="flex flex-col md:flex-row items-start animate-pulse"
|
||||
@@ -41,13 +63,13 @@
|
||||
class="hidden flex flex-col md:flex-row items-start"
|
||||
>
|
||||
<div
|
||||
class="flex flex-col items-center mb-4 md:mb-0 md:mr-6 flex-shrink-0"
|
||||
class="flex flex-col items-center mb-6 md:mb-0 md:mr-8 flex-shrink-0 w-full md:w-auto"
|
||||
>
|
||||
<div
|
||||
class="w-32 h-40 bg-gradient-to-br from-gray-400 to-gray-600 rounded-lg flex items-center justify-center shadow-md"
|
||||
class="w-40 h-56 bg-gradient-to-br from-gray-400 to-gray-600 rounded-lg flex items-center justify-center shadow-md mb-4"
|
||||
>
|
||||
<svg
|
||||
class="w-16 h-16 text-white"
|
||||
class="w-20 h-20 text-white opacity-80"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
@@ -60,37 +82,45 @@
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<div id="book-status-container" class="mt-3">
|
||||
<span
|
||||
id="book-status"
|
||||
class="inline-flex items-center px-3 py-1 rounded-full text-sm font-medium"
|
||||
></span>
|
||||
</div>
|
||||
<div
|
||||
id="book-status-container"
|
||||
class="relative w-full flex justify-center z-10"
|
||||
></div>
|
||||
<div id="book-actions-container" class="mt-4 w-full"></div>
|
||||
</div>
|
||||
<div class="flex-1">
|
||||
<div class="flex items-start justify-between mb-2">
|
||||
<div class="flex-1 w-full">
|
||||
<div
|
||||
class="flex flex-col md:flex-row md:items-start md:justify-between mb-2"
|
||||
>
|
||||
<h1
|
||||
id="book-title"
|
||||
class="text-3xl font-bold text-gray-900"
|
||||
class="text-3xl font-bold text-gray-900 leading-tight"
|
||||
></h1>
|
||||
<span
|
||||
id="book-id"
|
||||
class="text-sm text-gray-500 ml-4 px-2 py-1 border border-gray-300 rounded-lg"
|
||||
class="hidden md:inline-block text-xs font-mono text-gray-400 mt-2 md:mt-0 md:ml-4"
|
||||
></span>
|
||||
</div>
|
||||
<p
|
||||
id="book-authors-text"
|
||||
class="text-lg text-gray-600 mb-4"
|
||||
class="text-lg text-gray-600 font-medium mb-6"
|
||||
></p>
|
||||
<div class="prose prose-gray max-w-none mb-6">
|
||||
|
||||
<div class="prose prose-gray max-w-none mb-8">
|
||||
<h3
|
||||
class="text-sm font-bold text-gray-400 uppercase tracking-wider mb-2"
|
||||
>
|
||||
Описание
|
||||
</h3>
|
||||
<p
|
||||
id="book-description"
|
||||
class="text-gray-700 leading-relaxed"
|
||||
></p>
|
||||
</div>
|
||||
|
||||
<div id="genres-section" class="mb-6 hidden">
|
||||
<h3
|
||||
class="text-sm font-bold text-gray-500 uppercase tracking-wider mb-2"
|
||||
class="text-sm font-bold text-gray-400 uppercase tracking-wider mb-2"
|
||||
>
|
||||
Жанры
|
||||
</h3>
|
||||
@@ -99,11 +129,12 @@
|
||||
class="flex flex-wrap gap-2"
|
||||
></div>
|
||||
</div>
|
||||
|
||||
<div id="authors-section" class="mb-6 hidden">
|
||||
<h3
|
||||
class="text-sm font-bold text-gray-500 uppercase tracking-wider mb-2"
|
||||
class="text-sm font-bold text-gray-400 uppercase tracking-wider mb-2"
|
||||
>
|
||||
Авторы
|
||||
Авторы (детально)
|
||||
</h3>
|
||||
<div
|
||||
id="authors-container"
|
||||
|
||||
@@ -1,6 +1,68 @@
|
||||
{% extends "base.html" %} {% block content %}
|
||||
<div class="container mx-auto p-4 flex flex-col md:flex-row gap-6">
|
||||
<aside class="w-full md:w-1/4">
|
||||
<div
|
||||
id="admin-actions"
|
||||
class="hidden bg-white px-4 py-2 rounded-lg shadow-md mb-6"
|
||||
>
|
||||
<a
|
||||
href="/author/create"
|
||||
class="w-full flex justify-center items-center px-4 py-2 my-2 bg-green-600 text-white font-medium rounded-lg hover:bg-green-700 transition"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5 mr-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 4v16m8-8H4"
|
||||
/>
|
||||
</svg>
|
||||
Добавить автора
|
||||
</a>
|
||||
<a
|
||||
href="/genre/create"
|
||||
class="w-full flex justify-center items-center px-4 py-2 my-2 bg-green-600 text-white font-medium rounded-lg hover:bg-green-700 transition"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5 mr-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 4v16m8-8H4"
|
||||
/>
|
||||
</svg>
|
||||
Добавить жанр
|
||||
</a>
|
||||
<a
|
||||
href="/book/create"
|
||||
class="w-full flex justify-center items-center px-4 py-2 my-2 bg-green-600 text-white font-medium rounded-lg hover:bg-green-700 transition"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5 mr-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 4v16m8-8H4"
|
||||
/>
|
||||
</svg>
|
||||
Добавить книгу
|
||||
</a>
|
||||
</div>
|
||||
<div class="bg-white p-4 rounded-lg shadow-md mb-6">
|
||||
<h2 class="text-xl font-bold mb-4">Поиск</h2>
|
||||
<div class="relative">
|
||||
@@ -27,7 +89,6 @@
|
||||
</div>
|
||||
<div class="bg-white p-4 rounded-lg shadow-md mb-6">
|
||||
<h2 class="text-xl font-bold mb-4">Авторы</h2>
|
||||
|
||||
<div
|
||||
id="selected-authors-container"
|
||||
class="flex flex-wrap gap-2 mb-2 min-h-[0px]"
|
||||
|
||||
@@ -0,0 +1,162 @@
|
||||
{% extends "base.html" %} {% block title %}Создание автора | LiB{% endblock %}
|
||||
{% block content %}
|
||||
<div class="container mx-auto p-4 max-w-xl">
|
||||
<div class="bg-white rounded-lg shadow-md p-6 md:p-8">
|
||||
<div class="mb-8 border-b border-gray-100 pb-4">
|
||||
<h1
|
||||
class="text-2xl font-bold text-gray-800 flex items-center gap-3"
|
||||
>
|
||||
<svg
|
||||
class="w-8 h-8 text-gray-600"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"
|
||||
/>
|
||||
</svg>
|
||||
Добавить автора
|
||||
</h1>
|
||||
<p class="text-gray-500 mt-2 text-sm ml-11">
|
||||
Укажите имя нового автора для каталога.
|
||||
</p>
|
||||
</div>
|
||||
<form id="create-author-form" class="space-y-6">
|
||||
<div>
|
||||
<label
|
||||
for="author-name"
|
||||
class="block text-sm font-semibold text-gray-700 mb-2"
|
||||
>
|
||||
Имя автора <span class="text-red-500">*</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="author-name"
|
||||
name="name"
|
||||
required
|
||||
maxlength="255"
|
||||
class="w-full border border-gray-300 rounded-lg px-4 py-3 focus:outline-none focus:ring-2 focus:ring-gray-400 transition"
|
||||
placeholder="Имя или псевдоним автора"
|
||||
/>
|
||||
<div class="flex justify-end mt-1">
|
||||
<span id="name-counter" class="text-xs text-gray-400"
|
||||
>0/255</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex flex-col sm:flex-row gap-3 pt-6 border-t border-gray-100"
|
||||
>
|
||||
<button
|
||||
type="submit"
|
||||
id="submit-btn"
|
||||
class="flex-1 flex justify-center items-center px-6 py-3 bg-green-600 text-white font-bold rounded-lg hover:bg-green-700 focus:outline-none focus:ring-4 focus:ring-green-300 transition disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5 mr-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 4v16m8-8H4"
|
||||
/>
|
||||
</svg>
|
||||
<span id="submit-text">Создать автора</span>
|
||||
<svg
|
||||
id="loading-spinner"
|
||||
class="hidden animate-spin ml-2 h-5 w-5 text-white"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<circle
|
||||
class="opacity-25"
|
||||
cx="12"
|
||||
cy="12"
|
||||
r="10"
|
||||
stroke="currentColor"
|
||||
stroke-width="4"
|
||||
></circle>
|
||||
<path
|
||||
class="opacity-75"
|
||||
fill="currentColor"
|
||||
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
||||
></path>
|
||||
</svg>
|
||||
</button>
|
||||
<a
|
||||
href="/authors"
|
||||
class="flex-1 flex justify-center items-center px-6 py-3 bg-white border border-gray-300 text-gray-700 font-medium rounded-lg hover:bg-gray-50 transition text-center"
|
||||
>
|
||||
Отмена
|
||||
</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
id="success-modal"
|
||||
class="hidden fixed inset-0 bg-gray-900 bg-opacity-60 overflow-y-auto h-full w-full z-50 flex items-center justify-center"
|
||||
>
|
||||
<div
|
||||
class="relative p-5 border w-full max-w-md shadow-lg rounded-lg bg-white"
|
||||
>
|
||||
<div class="mt-3 text-center">
|
||||
<div
|
||||
class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-green-100 mb-4"
|
||||
>
|
||||
<svg
|
||||
class="h-6 w-6 text-green-600"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M5 13l4 4L19 7"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
Автор успешно добавлен!
|
||||
</h3>
|
||||
<div class="mt-2 px-7 py-3">
|
||||
<p class="text-sm text-gray-500">
|
||||
Автор
|
||||
<span
|
||||
id="modal-author-name"
|
||||
class="font-bold text-gray-800"
|
||||
></span>
|
||||
сохранён в каталоге.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex gap-3 mt-4 justify-center">
|
||||
<a
|
||||
id="modal-link-btn"
|
||||
href="/authors"
|
||||
class="px-4 py-2 bg-gray-600 text-white text-base font-medium rounded-lg hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-gray-500"
|
||||
>
|
||||
К списку авторов
|
||||
</a>
|
||||
<button
|
||||
id="modal-close-btn"
|
||||
class="px-4 py-2 bg-white text-gray-700 border border-gray-300 text-base font-medium rounded-lg hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-gray-200"
|
||||
>
|
||||
Создать ещё
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %} {% block scripts %}
|
||||
<script src="/static/create_author.js"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,229 @@
|
||||
{% extends "base.html" %} {% block title %}Создание книги | LiB{% endblock %} {%
|
||||
block content %}
|
||||
<div class="container mx-auto p-4 max-w-3xl">
|
||||
<div class="bg-white rounded-lg shadow-md p-6 md:p-8">
|
||||
<div class="mb-8 border-b border-gray-100 pb-4">
|
||||
<h1
|
||||
class="text-2xl font-bold text-gray-800 flex items-center gap-3"
|
||||
>
|
||||
<svg
|
||||
class="w-8 h-8 text-gray-600"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"
|
||||
/>
|
||||
</svg>
|
||||
Добавить новую книгу
|
||||
</h1>
|
||||
<p class="text-gray-500 mt-2 text-sm ml-11">
|
||||
Заполните информацию о книге, укажите авторов и жанры.
|
||||
</p>
|
||||
</div>
|
||||
<form id="create-book-form" class="space-y-6">
|
||||
<div>
|
||||
<label
|
||||
for="book-title"
|
||||
class="block text-sm font-semibold text-gray-700 mb-2"
|
||||
>
|
||||
Название книги <span class="text-red-500">*</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="book-title"
|
||||
name="title"
|
||||
required
|
||||
maxlength="255"
|
||||
class="w-full border border-gray-300 rounded-lg px-4 py-3 focus:outline-none focus:ring-2 focus:ring-gray-400 transition"
|
||||
placeholder="Название книги..."
|
||||
/>
|
||||
<div class="flex justify-end mt-1">
|
||||
<span id="title-counter" class="text-xs text-gray-400"
|
||||
>0/255</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label
|
||||
for="book-description"
|
||||
class="block text-sm font-semibold text-gray-700 mb-2"
|
||||
>
|
||||
Описание
|
||||
</label>
|
||||
<textarea
|
||||
id="book-description"
|
||||
name="description"
|
||||
rows="5"
|
||||
maxlength="2000"
|
||||
class="w-full border border-gray-300 rounded-lg px-4 py-3 focus:outline-none focus:ring-2 focus:ring-gray-400 resize-none transition"
|
||||
placeholder="Краткое описание сюжета..."
|
||||
></textarea>
|
||||
<div class="flex justify-end mt-1">
|
||||
<span id="desc-counter" class="text-xs text-gray-400"
|
||||
>0/2000</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div class="bg-white p-4 rounded-lg border border-gray-200">
|
||||
<h2 class="text-sm font-semibold text-gray-700 mb-3">
|
||||
Авторы
|
||||
</h2>
|
||||
<div
|
||||
id="selected-authors-container"
|
||||
class="flex flex-wrap gap-2 mb-3 min-h-[0px]"
|
||||
></div>
|
||||
<div class="relative">
|
||||
<input
|
||||
type="text"
|
||||
id="author-search-input"
|
||||
placeholder="Поиск автора..."
|
||||
class="w-full border rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-1 focus:ring-gray-400"
|
||||
autocomplete="off"
|
||||
/>
|
||||
<div
|
||||
id="author-dropdown"
|
||||
class="hidden absolute z-50 w-full bg-white border border-gray-200 rounded-lg shadow-lg max-h-48 overflow-y-auto mt-1"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-white p-4 rounded-lg border border-gray-200">
|
||||
<h2 class="text-sm font-semibold text-gray-700 mb-3">
|
||||
Жанры
|
||||
</h2>
|
||||
<div
|
||||
id="selected-genres-container"
|
||||
class="flex flex-wrap gap-2 mb-3 min-h-[0px]"
|
||||
></div>
|
||||
<div class="relative">
|
||||
<input
|
||||
type="text"
|
||||
id="genre-search-input"
|
||||
placeholder="Поиск жанра..."
|
||||
class="w-full border rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-1 focus:ring-gray-400"
|
||||
autocomplete="off"
|
||||
/>
|
||||
<div
|
||||
id="genre-dropdown"
|
||||
class="hidden absolute z-50 w-full bg-white border border-gray-200 rounded-lg shadow-lg max-h-48 overflow-y-auto mt-1"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex flex-col sm:flex-row gap-3 pt-6 border-t border-gray-100"
|
||||
>
|
||||
<button
|
||||
type="submit"
|
||||
id="submit-btn"
|
||||
class="flex-1 flex justify-center items-center px-6 py-3 bg-green-600 text-white font-bold rounded-lg hover:bg-green-700 focus:outline-none focus:ring-4 focus:ring-green-300 transition disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5 mr-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 4v16m8-8H4"
|
||||
/>
|
||||
</svg>
|
||||
<span id="submit-text">Создать книгу</span>
|
||||
<svg
|
||||
id="loading-spinner"
|
||||
class="hidden animate-spin ml-2 h-5 w-5 text-white"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<circle
|
||||
class="opacity-25"
|
||||
cx="12"
|
||||
cy="12"
|
||||
r="10"
|
||||
stroke="currentColor"
|
||||
stroke-width="4"
|
||||
></circle>
|
||||
<path
|
||||
class="opacity-75"
|
||||
fill="currentColor"
|
||||
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
||||
></path>
|
||||
</svg>
|
||||
</button>
|
||||
<a
|
||||
href="/books"
|
||||
class="flex-1 flex justify-center items-center px-6 py-3 bg-white border border-gray-300 text-gray-700 font-medium rounded-lg hover:bg-gray-50 transition text-center"
|
||||
>
|
||||
Отмена
|
||||
</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
id="success-modal"
|
||||
class="hidden fixed inset-0 bg-gray-900 bg-opacity-60 overflow-y-auto h-full w-full z-50 flex items-center justify-center"
|
||||
>
|
||||
<div
|
||||
class="relative p-5 border w-full max-w-md shadow-lg rounded-lg bg-white"
|
||||
>
|
||||
<div class="mt-3 text-center">
|
||||
<div
|
||||
class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-green-100 mb-4"
|
||||
>
|
||||
<svg
|
||||
class="h-6 w-6 text-green-600"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M5 13l4 4L19 7"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
Книга успешно добавлена!
|
||||
</h3>
|
||||
<div class="mt-2 px-7 py-3">
|
||||
<p class="text-sm text-gray-500">
|
||||
Книга
|
||||
<span
|
||||
id="modal-book-title"
|
||||
class="font-bold text-gray-800"
|
||||
></span>
|
||||
сохранена в каталоге.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex gap-3 mt-4 justify-center">
|
||||
<a
|
||||
id="modal-link-btn"
|
||||
href="#"
|
||||
class="px-4 py-2 bg-gray-600 text-white text-base font-medium rounded-lg hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-gray-500"
|
||||
>
|
||||
Перейти к книге
|
||||
</a>
|
||||
<button
|
||||
id="modal-close-btn"
|
||||
class="px-4 py-2 bg-white text-gray-700 border border-gray-300 text-base font-medium rounded-lg hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-gray-200"
|
||||
>
|
||||
Создать ещё
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %} {% block scripts %}
|
||||
<script src="/static/create_book.js"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,162 @@
|
||||
{% extends "base.html" %} {% block title %}Создание жанра | LiB{% endblock %} {%
|
||||
block content %}
|
||||
<div class="container mx-auto p-4 max-w-xl">
|
||||
<div class="bg-white rounded-lg shadow-md p-6 md:p-8">
|
||||
<div class="mb-8 border-b border-gray-100 pb-4">
|
||||
<h1
|
||||
class="text-2xl font-bold text-gray-800 flex items-center gap-3"
|
||||
>
|
||||
<svg
|
||||
class="w-8 h-8 text-gray-600"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M7 7h.01M7 3h5c.512 0 1.024.195 1.414.586l7 7a2 2 0 010 2.828l-7 7a2 2 0 01-2.828 0l-7-7A1.994 1.994 0 013 12V7a4 4 0 014-4z"
|
||||
/>
|
||||
</svg>
|
||||
Добавить жанр
|
||||
</h1>
|
||||
<p class="text-gray-500 mt-2 text-sm ml-11">
|
||||
Укажите название нового жанра для каталога.
|
||||
</p>
|
||||
</div>
|
||||
<form id="create-genre-form" class="space-y-6">
|
||||
<div>
|
||||
<label
|
||||
for="genre-name"
|
||||
class="block text-sm font-semibold text-gray-700 mb-2"
|
||||
>
|
||||
Название жанра <span class="text-red-500">*</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="genre-name"
|
||||
name="name"
|
||||
required
|
||||
maxlength="100"
|
||||
class="w-full border border-gray-300 rounded-lg px-4 py-3 focus:outline-none focus:ring-2 focus:ring-gray-400 transition"
|
||||
placeholder="Например: Научная фантастика"
|
||||
/>
|
||||
<div class="flex justify-end mt-1">
|
||||
<span id="name-counter" class="text-xs text-gray-400"
|
||||
>0/100</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex flex-col sm:flex-row gap-3 pt-6 border-t border-gray-100"
|
||||
>
|
||||
<button
|
||||
type="submit"
|
||||
id="submit-btn"
|
||||
class="flex-1 flex justify-center items-center px-6 py-3 bg-green-600 text-white font-bold rounded-lg hover:bg-green-700 focus:outline-none focus:ring-4 focus:ring-green-300 transition disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5 mr-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 4v16m8-8H4"
|
||||
/>
|
||||
</svg>
|
||||
<span id="submit-text">Создать жанр</span>
|
||||
<svg
|
||||
id="loading-spinner"
|
||||
class="hidden animate-spin ml-2 h-5 w-5 text-white"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<circle
|
||||
class="opacity-25"
|
||||
cx="12"
|
||||
cy="12"
|
||||
r="10"
|
||||
stroke="currentColor"
|
||||
stroke-width="4"
|
||||
></circle>
|
||||
<path
|
||||
class="opacity-75"
|
||||
fill="currentColor"
|
||||
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
||||
></path>
|
||||
</svg>
|
||||
</button>
|
||||
<a
|
||||
href="/books"
|
||||
class="flex-1 flex justify-center items-center px-6 py-3 bg-white border border-gray-300 text-gray-700 font-medium rounded-lg hover:bg-gray-50 transition text-center"
|
||||
>
|
||||
Отмена
|
||||
</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
id="success-modal"
|
||||
class="hidden fixed inset-0 bg-gray-900 bg-opacity-60 overflow-y-auto h-full w-full z-50 flex items-center justify-center"
|
||||
>
|
||||
<div
|
||||
class="relative p-5 border w-full max-w-md shadow-lg rounded-lg bg-white"
|
||||
>
|
||||
<div class="mt-3 text-center">
|
||||
<div
|
||||
class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-green-100 mb-4"
|
||||
>
|
||||
<svg
|
||||
class="h-6 w-6 text-green-600"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M5 13l4 4L19 7"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
Жанр успешно добавлен!
|
||||
</h3>
|
||||
<div class="mt-2 px-7 py-3">
|
||||
<p class="text-sm text-gray-500">
|
||||
Жанр
|
||||
<span
|
||||
id="modal-genre-name"
|
||||
class="font-bold text-gray-800"
|
||||
></span>
|
||||
сохранён в каталоге.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex gap-3 mt-4 justify-center">
|
||||
<a
|
||||
id="modal-link-btn"
|
||||
href="/books"
|
||||
class="px-4 py-2 bg-gray-600 text-white text-base font-medium rounded-lg hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-gray-500"
|
||||
>
|
||||
К списку книг
|
||||
</a>
|
||||
<button
|
||||
id="modal-close-btn"
|
||||
class="px-4 py-2 bg-white text-gray-700 border border-gray-300 text-base font-medium rounded-lg hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-gray-200"
|
||||
>
|
||||
Создать ещё
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %} {% block scripts %}
|
||||
<script src="/static/create_genre.js"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,316 @@
|
||||
{% extends "base.html" %} {% block title %}Редактирование автора | LiB{%
|
||||
endblock %} {% block content %}
|
||||
<div class="container mx-auto p-4 max-w-2xl">
|
||||
<div class="bg-white rounded-lg shadow-md p-6 md:p-8">
|
||||
<div class="mb-8 border-b border-gray-100 pb-4">
|
||||
<h1
|
||||
class="text-2xl font-bold text-gray-800 flex items-center gap-3"
|
||||
>
|
||||
<svg
|
||||
class="w-8 h-8 text-gray-600"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"
|
||||
></path>
|
||||
</svg>
|
||||
<span>Редактирование автора</span>
|
||||
</h1>
|
||||
<p class="text-gray-500 mt-2 text-sm ml-11">
|
||||
Измените данные автора или удалите его из каталога.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div id="loader" class="animate-pulse space-y-4">
|
||||
<div class="h-12 bg-gray-200 rounded w-full"></div>
|
||||
<div class="h-24 bg-gray-200 rounded w-full"></div>
|
||||
</div>
|
||||
|
||||
<form id="edit-author-form" class="hidden space-y-6">
|
||||
<div>
|
||||
<label
|
||||
for="author-name"
|
||||
class="block text-sm font-semibold text-gray-700 mb-2"
|
||||
>
|
||||
Имя автора <span class="text-red-500">*</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="author-name"
|
||||
name="name"
|
||||
required
|
||||
maxlength="255"
|
||||
class="w-full border border-gray-300 rounded-lg px-4 py-3 focus:outline-none focus:ring-2 focus:ring-gray-400 transition"
|
||||
placeholder="Имя автора..."
|
||||
/>
|
||||
<div class="flex justify-end mt-1">
|
||||
<span id="name-counter" class="text-xs text-gray-400"
|
||||
>0/255</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white p-4 rounded-lg border border-gray-200">
|
||||
<h2
|
||||
class="text-sm font-semibold text-gray-700 mb-3 flex items-center justify-between"
|
||||
>
|
||||
<span>Книги автора</span>
|
||||
<span
|
||||
id="books-count"
|
||||
class="text-xs text-gray-400 font-normal"
|
||||
></span>
|
||||
</h2>
|
||||
<div
|
||||
id="author-books-container"
|
||||
class="space-y-2 max-h-64 overflow-y-auto"
|
||||
>
|
||||
<div class="text-sm text-gray-500 text-center py-4">
|
||||
Загрузка...
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="flex flex-col sm:flex-row gap-3 pt-6 border-t border-gray-100"
|
||||
>
|
||||
<button
|
||||
type="submit"
|
||||
id="submit-btn"
|
||||
class="flex-1 flex justify-center items-center px-6 py-3 bg-green-600 text-white font-bold rounded-lg hover:bg-green-700 focus:outline-none focus:ring-4 focus:ring-green-300 transition disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5 mr-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M5 13l4 4L19 7"
|
||||
></path>
|
||||
</svg>
|
||||
<span id="submit-text">Сохранить изменения</span>
|
||||
<svg
|
||||
id="loading-spinner"
|
||||
class="hidden animate-spin ml-2 h-5 w-5 text-white"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<circle
|
||||
class="opacity-25"
|
||||
cx="12"
|
||||
cy="12"
|
||||
r="10"
|
||||
stroke="currentColor"
|
||||
stroke-width="4"
|
||||
></circle>
|
||||
<path
|
||||
class="opacity-75"
|
||||
fill="currentColor"
|
||||
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
||||
></path>
|
||||
</svg>
|
||||
</button>
|
||||
<a
|
||||
id="cancel-btn"
|
||||
href="/authors"
|
||||
class="flex-1 flex justify-center items-center px-6 py-3 bg-white border border-gray-300 text-gray-700 font-medium rounded-lg hover:bg-gray-50 transition text-center"
|
||||
>
|
||||
Отмена
|
||||
</a>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div id="danger-zone" class="hidden mt-8 pt-6 border-t border-red-200">
|
||||
<h3
|
||||
class="text-lg font-bold text-red-600 mb-2 flex items-center gap-2"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
|
||||
></path>
|
||||
</svg>
|
||||
Опасная зона
|
||||
</h3>
|
||||
<p class="text-sm text-gray-600 mb-4">
|
||||
Удаление автора необратимо. Связи с книгами будут удалены, но
|
||||
сами книги сохранятся.
|
||||
</p>
|
||||
<button
|
||||
id="delete-btn"
|
||||
class="inline-flex items-center px-4 py-2 bg-white border border-red-300 text-red-600 font-medium rounded-lg hover:bg-red-50 focus:outline-none focus:ring-2 focus:ring-red-300 transition"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5 mr-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
|
||||
></path>
|
||||
</svg>
|
||||
Удалить автора
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
id="delete-modal"
|
||||
class="hidden fixed inset-0 bg-gray-900 bg-opacity-60 overflow-y-auto h-full w-full z-50 flex items-center justify-center"
|
||||
>
|
||||
<div
|
||||
class="relative p-5 border w-full max-w-md shadow-lg rounded-lg bg-white"
|
||||
>
|
||||
<div class="mt-3 text-center">
|
||||
<div
|
||||
class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-red-100 mb-4"
|
||||
>
|
||||
<svg
|
||||
class="h-6 w-6 text-red-600"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
Удалить автора?
|
||||
</h3>
|
||||
<div class="mt-2 px-7 py-3">
|
||||
<p class="text-sm text-gray-500">
|
||||
Вы уверены, что хотите удалить автора
|
||||
<span
|
||||
id="modal-author-name"
|
||||
class="font-bold text-gray-800"
|
||||
></span
|
||||
>? Это действие нельзя отменить.
|
||||
</p>
|
||||
<p
|
||||
id="modal-books-warning"
|
||||
class="hidden text-sm text-orange-600 mt-2"
|
||||
>
|
||||
У автора есть связанные книги. Связи будут удалены.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex gap-3 mt-4 justify-center">
|
||||
<button
|
||||
id="confirm-delete-btn"
|
||||
class="px-4 py-2 bg-red-600 text-white text-base font-medium rounded-lg hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-red-500 flex items-center"
|
||||
>
|
||||
<span>Удалить</span>
|
||||
<svg
|
||||
id="delete-spinner"
|
||||
class="hidden animate-spin ml-2 h-4 w-4 text-white"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<circle
|
||||
class="opacity-25"
|
||||
cx="12"
|
||||
cy="12"
|
||||
r="10"
|
||||
stroke="currentColor"
|
||||
stroke-width="4"
|
||||
></circle>
|
||||
<path
|
||||
class="opacity-75"
|
||||
fill="currentColor"
|
||||
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
||||
></path>
|
||||
</svg>
|
||||
</button>
|
||||
<button
|
||||
id="cancel-delete-btn"
|
||||
class="px-4 py-2 bg-white text-gray-700 border border-gray-300 text-base font-medium rounded-lg hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-gray-200"
|
||||
>
|
||||
Отмена
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
id="success-modal"
|
||||
class="hidden fixed inset-0 bg-gray-900 bg-opacity-60 overflow-y-auto h-full w-full z-50 flex items-center justify-center"
|
||||
>
|
||||
<div
|
||||
class="relative p-5 border w-full max-w-md shadow-lg rounded-lg bg-white"
|
||||
>
|
||||
<div class="mt-3 text-center">
|
||||
<div
|
||||
class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-green-100 mb-4"
|
||||
>
|
||||
<svg
|
||||
class="h-6 w-6 text-green-600"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M5 13l4 4L19 7"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
Изменения сохранены!
|
||||
</h3>
|
||||
<div class="mt-2 px-7 py-3">
|
||||
<p class="text-sm text-gray-500">
|
||||
Автор
|
||||
<span
|
||||
id="success-author-name"
|
||||
class="font-bold text-gray-800"
|
||||
></span>
|
||||
успешно обновлён.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex gap-3 mt-4 justify-center">
|
||||
<a
|
||||
id="success-link-btn"
|
||||
href="/authors"
|
||||
class="px-4 py-2 bg-gray-600 text-white text-base font-medium rounded-lg hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-gray-500"
|
||||
>
|
||||
К списку авторов
|
||||
</a>
|
||||
<button
|
||||
id="success-close-btn"
|
||||
class="px-4 py-2 bg-white text-gray-700 border border-gray-300 text-base font-medium rounded-lg hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-gray-200"
|
||||
>
|
||||
Продолжить
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %} {% block scripts %}
|
||||
<script src="/static/edit_author.js"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,394 @@
|
||||
{% extends "base.html" %} {% block title %}Редактирование книги | LiB{% endblock
|
||||
%} {% block content %}
|
||||
<div class="container mx-auto p-4 max-w-3xl">
|
||||
<div class="bg-white rounded-lg shadow-md p-6 md:p-8">
|
||||
<div class="mb-8 border-b border-gray-100 pb-4">
|
||||
<h1
|
||||
class="text-2xl font-bold text-gray-800 flex items-center gap-3"
|
||||
>
|
||||
<svg
|
||||
class="w-8 h-8 text-gray-600"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"
|
||||
></path>
|
||||
</svg>
|
||||
<span>Редактирование книги</span>
|
||||
</h1>
|
||||
<p class="text-gray-500 mt-2 text-sm ml-11">
|
||||
Измените информацию о книге, управляйте авторами и жанрами.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div id="loader" class="animate-pulse space-y-4">
|
||||
<div class="h-12 bg-gray-200 rounded w-full"></div>
|
||||
<div class="h-32 bg-gray-200 rounded w-full"></div>
|
||||
<div class="h-12 bg-gray-200 rounded w-1/3"></div>
|
||||
</div>
|
||||
|
||||
<form id="edit-book-form" class="hidden space-y-6">
|
||||
<div>
|
||||
<label
|
||||
for="book-title"
|
||||
class="block text-sm font-semibold text-gray-700 mb-2"
|
||||
>
|
||||
Название книги <span class="text-red-500">*</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="book-title"
|
||||
name="title"
|
||||
required
|
||||
maxlength="255"
|
||||
class="w-full border border-gray-300 rounded-lg px-4 py-3 focus:outline-none focus:ring-2 focus:ring-gray-400 transition"
|
||||
placeholder="Название книги..."
|
||||
/>
|
||||
<div class="flex justify-end mt-1">
|
||||
<span id="title-counter" class="text-xs text-gray-400"
|
||||
>0/255</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label
|
||||
for="book-description"
|
||||
class="block text-sm font-semibold text-gray-700 mb-2"
|
||||
>
|
||||
Описание
|
||||
</label>
|
||||
<textarea
|
||||
id="book-description"
|
||||
name="description"
|
||||
rows="5"
|
||||
maxlength="2000"
|
||||
class="w-full border border-gray-300 rounded-lg px-4 py-3 focus:outline-none focus:ring-2 focus:ring-gray-400 resize-none transition"
|
||||
placeholder="Краткое описание сюжета..."
|
||||
></textarea>
|
||||
<div class="flex justify-end mt-1">
|
||||
<span id="desc-counter" class="text-xs text-gray-400"
|
||||
>0/2000</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label
|
||||
for="book-status"
|
||||
class="block text-sm font-semibold text-gray-700 mb-2"
|
||||
>
|
||||
Статус
|
||||
</label>
|
||||
<select
|
||||
id="book-status"
|
||||
name="status"
|
||||
class="w-full border border-gray-300 rounded-lg px-4 py-3 focus:outline-none focus:ring-2 focus:ring-gray-400 transition bg-white"
|
||||
>
|
||||
<option value="active">Доступна</option>
|
||||
<option value="borrowed">Выдана</option>
|
||||
<option value="reserved">Забронирована</option>
|
||||
<option value="restoration">На реставрации</option>
|
||||
<option value="written_off">Списана</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
<div class="bg-white p-4 rounded-lg border border-gray-200">
|
||||
<h2
|
||||
class="text-sm font-semibold text-gray-700 mb-3 flex items-center justify-between"
|
||||
>
|
||||
<span>Авторы</span>
|
||||
<span
|
||||
id="authors-count"
|
||||
class="text-xs text-gray-400 font-normal"
|
||||
></span>
|
||||
</h2>
|
||||
<div
|
||||
id="current-authors-container"
|
||||
class="flex flex-wrap gap-2 mb-3 min-h-[32px]"
|
||||
></div>
|
||||
<div class="relative">
|
||||
<input
|
||||
type="text"
|
||||
id="author-search-input"
|
||||
placeholder="Добавить автора..."
|
||||
class="w-full border rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-1 focus:ring-gray-400"
|
||||
autocomplete="off"
|
||||
/>
|
||||
<div
|
||||
id="author-dropdown"
|
||||
class="hidden absolute z-50 w-full bg-white border border-gray-200 rounded-lg shadow-lg max-h-48 overflow-y-auto mt-1"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white p-4 rounded-lg border border-gray-200">
|
||||
<h2
|
||||
class="text-sm font-semibold text-gray-700 mb-3 flex items-center justify-between"
|
||||
>
|
||||
<span>Жанры</span>
|
||||
<span
|
||||
id="genres-count"
|
||||
class="text-xs text-gray-400 font-normal"
|
||||
></span>
|
||||
</h2>
|
||||
<div
|
||||
id="current-genres-container"
|
||||
class="flex flex-wrap gap-2 mb-3 min-h-[32px]"
|
||||
></div>
|
||||
<div class="relative">
|
||||
<input
|
||||
type="text"
|
||||
id="genre-search-input"
|
||||
placeholder="Добавить жанр..."
|
||||
class="w-full border rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-1 focus:ring-gray-400"
|
||||
autocomplete="off"
|
||||
/>
|
||||
<div
|
||||
id="genre-dropdown"
|
||||
class="hidden absolute z-50 w-full bg-white border border-gray-200 rounded-lg shadow-lg max-h-48 overflow-y-auto mt-1"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="flex flex-col sm:flex-row gap-3 pt-6 border-t border-gray-100"
|
||||
>
|
||||
<button
|
||||
type="submit"
|
||||
id="submit-btn"
|
||||
class="flex-1 flex justify-center items-center px-6 py-3 bg-green-600 text-white font-bold rounded-lg hover:bg-green-700 focus:outline-none focus:ring-4 focus:ring-green-300 transition disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5 mr-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M5 13l4 4L19 7"
|
||||
></path>
|
||||
</svg>
|
||||
<span id="submit-text">Сохранить изменения</span>
|
||||
<svg
|
||||
id="loading-spinner"
|
||||
class="hidden animate-spin ml-2 h-5 w-5 text-white"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<circle
|
||||
class="opacity-25"
|
||||
cx="12"
|
||||
cy="12"
|
||||
r="10"
|
||||
stroke="currentColor"
|
||||
stroke-width="4"
|
||||
></circle>
|
||||
<path
|
||||
class="opacity-75"
|
||||
fill="currentColor"
|
||||
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
||||
></path>
|
||||
</svg>
|
||||
</button>
|
||||
<a
|
||||
id="cancel-btn"
|
||||
href="#"
|
||||
class="flex-1 flex justify-center items-center px-6 py-3 bg-white border border-gray-300 text-gray-700 font-medium rounded-lg hover:bg-gray-50 transition text-center"
|
||||
>
|
||||
Отмена
|
||||
</a>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div id="danger-zone" class="hidden mt-8 pt-6 border-t border-red-200">
|
||||
<h3
|
||||
class="text-lg font-bold text-red-600 mb-2 flex items-center gap-2"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
|
||||
></path>
|
||||
</svg>
|
||||
Опасная зона
|
||||
</h3>
|
||||
<p class="text-sm text-gray-600 mb-4">
|
||||
Удаление книги необратимо. Все связи с авторами и жанрами будут
|
||||
удалены.
|
||||
</p>
|
||||
<button
|
||||
id="delete-btn"
|
||||
class="inline-flex items-center px-4 py-2 bg-white border border-red-300 text-red-600 font-medium rounded-lg hover:bg-red-50 focus:outline-none focus:ring-2 focus:ring-red-300 transition"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5 mr-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
|
||||
></path>
|
||||
</svg>
|
||||
Удалить книгу
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
id="delete-modal"
|
||||
class="hidden fixed inset-0 bg-gray-900 bg-opacity-60 overflow-y-auto h-full w-full z-50 flex items-center justify-center"
|
||||
>
|
||||
<div
|
||||
class="relative p-5 border w-full max-w-md shadow-lg rounded-lg bg-white"
|
||||
>
|
||||
<div class="mt-3 text-center">
|
||||
<div
|
||||
class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-red-100 mb-4"
|
||||
>
|
||||
<svg
|
||||
class="h-6 w-6 text-red-600"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
Удалить книгу?
|
||||
</h3>
|
||||
<div class="mt-2 px-7 py-3">
|
||||
<p class="text-sm text-gray-500">
|
||||
Вы уверены, что хотите удалить книгу
|
||||
<span
|
||||
id="modal-book-title"
|
||||
class="font-bold text-gray-800"
|
||||
></span
|
||||
>? Это действие нельзя отменить.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex gap-3 mt-4 justify-center">
|
||||
<button
|
||||
id="confirm-delete-btn"
|
||||
class="px-4 py-2 bg-red-600 text-white text-base font-medium rounded-lg hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-red-500 flex items-center"
|
||||
>
|
||||
<span>Удалить</span>
|
||||
<svg
|
||||
id="delete-spinner"
|
||||
class="hidden animate-spin ml-2 h-4 w-4 text-white"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<circle
|
||||
class="opacity-25"
|
||||
cx="12"
|
||||
cy="12"
|
||||
r="10"
|
||||
stroke="currentColor"
|
||||
stroke-width="4"
|
||||
></circle>
|
||||
<path
|
||||
class="opacity-75"
|
||||
fill="currentColor"
|
||||
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
||||
></path>
|
||||
</svg>
|
||||
</button>
|
||||
<button
|
||||
id="cancel-delete-btn"
|
||||
class="px-4 py-2 bg-white text-gray-700 border border-gray-300 text-base font-medium rounded-lg hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-gray-200"
|
||||
>
|
||||
Отмена
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
id="success-modal"
|
||||
class="hidden fixed inset-0 bg-gray-900 bg-opacity-60 overflow-y-auto h-full w-full z-50 flex items-center justify-center"
|
||||
>
|
||||
<div
|
||||
class="relative p-5 border w-full max-w-md shadow-lg rounded-lg bg-white"
|
||||
>
|
||||
<div class="mt-3 text-center">
|
||||
<div
|
||||
class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-green-100 mb-4"
|
||||
>
|
||||
<svg
|
||||
class="h-6 w-6 text-green-600"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M5 13l4 4L19 7"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
Изменения сохранены!
|
||||
</h3>
|
||||
<div class="mt-2 px-7 py-3">
|
||||
<p class="text-sm text-gray-500">
|
||||
Книга
|
||||
<span
|
||||
id="success-book-title"
|
||||
class="font-bold text-gray-800"
|
||||
></span>
|
||||
успешно обновлена.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex gap-3 mt-4 justify-center">
|
||||
<a
|
||||
id="success-link-btn"
|
||||
href="#"
|
||||
class="px-4 py-2 bg-gray-600 text-white text-base font-medium rounded-lg hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-gray-500"
|
||||
>
|
||||
Перейти к книге
|
||||
</a>
|
||||
<button
|
||||
id="success-close-btn"
|
||||
class="px-4 py-2 bg-white text-gray-700 border border-gray-300 text-base font-medium rounded-lg hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-gray-200"
|
||||
>
|
||||
Продолжить
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %} {% block scripts %}
|
||||
<script src="/static/edit_book.js"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,317 @@
|
||||
{% extends "base.html" %} {% block title %}Редактирование жанра | LiB{% endblock
|
||||
%} {% block content %}
|
||||
<div class="container mx-auto p-4 max-w-2xl">
|
||||
<div class="bg-white rounded-lg shadow-md p-6 md:p-8">
|
||||
<div class="mb-8 border-b border-gray-100 pb-4">
|
||||
<h1
|
||||
class="text-2xl font-bold text-gray-800 flex items-center gap-3"
|
||||
>
|
||||
<svg
|
||||
class="w-8 h-8 text-gray-600"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"
|
||||
></path>
|
||||
</svg>
|
||||
<span>Редактирование жанра</span>
|
||||
</h1>
|
||||
<p class="text-gray-500 mt-2 text-sm ml-11">
|
||||
Измените данные жанра или удалите его из каталога.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div id="loader" class="animate-pulse space-y-4">
|
||||
<div class="h-12 bg-gray-200 rounded w-full"></div>
|
||||
<div class="h-24 bg-gray-200 rounded w-full"></div>
|
||||
</div>
|
||||
|
||||
<form id="edit-genre-form" class="hidden space-y-6">
|
||||
<div>
|
||||
<label
|
||||
for="genre-name"
|
||||
class="block text-sm font-semibold text-gray-700 mb-2"
|
||||
>
|
||||
Название жанра <span class="text-red-500">*</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="genre-name"
|
||||
name="name"
|
||||
required
|
||||
maxlength="100"
|
||||
class="w-full border border-gray-300 rounded-lg px-4 py-3 focus:outline-none focus:ring-2 focus:ring-gray-400 transition"
|
||||
placeholder="Название жанра..."
|
||||
/>
|
||||
<div class="flex justify-end mt-1">
|
||||
<span id="name-counter" class="text-xs text-gray-400"
|
||||
>0/100</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white p-4 rounded-lg border border-gray-200">
|
||||
<h2
|
||||
class="text-sm font-semibold text-gray-700 mb-3 flex items-center justify-between"
|
||||
>
|
||||
<span>Книги в жанре</span>
|
||||
<span
|
||||
id="books-count"
|
||||
class="text-xs text-gray-400 font-normal"
|
||||
></span>
|
||||
</h2>
|
||||
<div
|
||||
id="genre-books-container"
|
||||
class="space-y-2 max-h-64 overflow-y-auto"
|
||||
>
|
||||
<div class="text-sm text-gray-500 text-center py-4">
|
||||
Загрузка...
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="flex flex-col sm:flex-row gap-3 pt-6 border-t border-gray-100"
|
||||
>
|
||||
<button
|
||||
type="submit"
|
||||
id="submit-btn"
|
||||
class="flex-1 flex justify-center items-center px-6 py-3 bg-green-600 text-white font-bold rounded-lg hover:bg-green-700 focus:outline-none focus:ring-4 focus:ring-green-300 transition disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5 mr-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M5 13l4 4L19 7"
|
||||
></path>
|
||||
</svg>
|
||||
<span id="submit-text">Сохранить изменения</span>
|
||||
<svg
|
||||
id="loading-spinner"
|
||||
class="hidden animate-spin ml-2 h-5 w-5 text-white"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<circle
|
||||
class="opacity-25"
|
||||
cx="12"
|
||||
cy="12"
|
||||
r="10"
|
||||
stroke="currentColor"
|
||||
stroke-width="4"
|
||||
></circle>
|
||||
<path
|
||||
class="opacity-75"
|
||||
fill="currentColor"
|
||||
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
||||
></path>
|
||||
</svg>
|
||||
</button>
|
||||
<a
|
||||
id="cancel-btn"
|
||||
href="/"
|
||||
class="flex-1 flex justify-center items-center px-6 py-3 bg-white border border-gray-300 text-gray-700 font-medium rounded-lg hover:bg-gray-50 transition text-center"
|
||||
>
|
||||
Отмена
|
||||
</a>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div id="danger-zone" class="hidden mt-8 pt-6 border-t border-red-200">
|
||||
<h3
|
||||
class="text-lg font-bold text-red-600 mb-2 flex items-center gap-2"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
|
||||
></path>
|
||||
</svg>
|
||||
Опасная зона
|
||||
</h3>
|
||||
<p class="text-sm text-gray-600 mb-4">
|
||||
Удаление жанра необратимо. Связи с книгами будут удалены, но
|
||||
сами книги сохранятся.
|
||||
</p>
|
||||
<button
|
||||
id="delete-btn"
|
||||
class="inline-flex items-center px-4 py-2 bg-white border border-red-300 text-red-600 font-medium rounded-lg hover:bg-red-50 focus:outline-none focus:ring-2 focus:ring-red-300 transition"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5 mr-2"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
|
||||
></path>
|
||||
</svg>
|
||||
Удалить жанр
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
id="delete-modal"
|
||||
class="hidden fixed inset-0 bg-gray-900 bg-opacity-60 overflow-y-auto h-full w-full z-50 flex items-center justify-center"
|
||||
>
|
||||
<div
|
||||
class="relative p-5 border w-full max-w-md shadow-lg rounded-lg bg-white"
|
||||
>
|
||||
<div class="mt-3 text-center">
|
||||
<div
|
||||
class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-red-100 mb-4"
|
||||
>
|
||||
<svg
|
||||
class="h-6 w-6 text-red-600"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
Удалить жанр?
|
||||
</h3>
|
||||
<div class="mt-2 px-7 py-3">
|
||||
<p class="text-sm text-gray-500">
|
||||
Вы уверены, что хотите удалить жанр
|
||||
<span
|
||||
id="modal-genre-name"
|
||||
class="font-bold text-gray-800"
|
||||
></span
|
||||
>? Это действие нельзя отменить.
|
||||
</p>
|
||||
<p
|
||||
id="modal-books-warning"
|
||||
class="hidden text-sm text-orange-600 mt-2"
|
||||
>
|
||||
В этом жанре есть книги. Связи будут удалены.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex gap-3 mt-4 justify-center">
|
||||
<button
|
||||
id="confirm-delete-btn"
|
||||
class="px-4 py-2 bg-red-600 text-white text-base font-medium rounded-lg hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-red-500 flex items-center"
|
||||
>
|
||||
<span>Удалить</span>
|
||||
<svg
|
||||
id="delete-spinner"
|
||||
class="hidden animate-spin ml-2 h-4 w-4 text-white"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<circle
|
||||
class="opacity-25"
|
||||
cx="12"
|
||||
cy="12"
|
||||
r="10"
|
||||
stroke="currentColor"
|
||||
stroke-width="4"
|
||||
></circle>
|
||||
<path
|
||||
class="opacity-75"
|
||||
fill="currentColor"
|
||||
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
||||
></path>
|
||||
</svg>
|
||||
</button>
|
||||
<button
|
||||
id="cancel-delete-btn"
|
||||
class="px-4 py-2 bg-white text-gray-700 border border-gray-300 text-base font-medium rounded-lg hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-gray-200"
|
||||
>
|
||||
Отмена
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
id="success-modal"
|
||||
class="hidden fixed inset-0 bg-gray-900 bg-opacity-60 overflow-y-auto h-full w-full z-50 flex items-center justify-center"
|
||||
>
|
||||
<div
|
||||
class="relative p-5 border w-full max-w-md shadow-lg rounded-lg bg-white"
|
||||
>
|
||||
<div class="mt-3 text-center">
|
||||
<div
|
||||
class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-green-100 mb-4"
|
||||
>
|
||||
<svg
|
||||
class="h-6 w-6 text-green-600"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M5 13l4 4L19 7"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<h3 class="text-lg leading-6 font-medium text-gray-900">
|
||||
Изменения сохранены!
|
||||
</h3>
|
||||
<div class="mt-2 px-7 py-3">
|
||||
<p class="text-sm text-gray-500">
|
||||
Жанр
|
||||
<span
|
||||
id="success-genre-name"
|
||||
class="font-bold text-gray-800"
|
||||
></span>
|
||||
успешно обновлён.
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex gap-3 mt-4 justify-center">
|
||||
<a
|
||||
id="success-link-btn"
|
||||
href="/"
|
||||
class="px-4 py-2 bg-gray-600 text-white text-base font-medium rounded-lg hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-gray-500"
|
||||
>
|
||||
На главную
|
||||
</a>
|
||||
<button
|
||||
id="success-close-btn"
|
||||
class="px-4 py-2 bg-white text-gray-700 border border-gray-300 text-base font-medium rounded-lg hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-gray-200"
|
||||
>
|
||||
Продолжить
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %} {% block scripts %}
|
||||
<script src="/static/edit_genre.js"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,433 @@
|
||||
{% extends "base.html" %} {% block title %}Пользователи - LiB{% endblock %} {%
|
||||
block content %}
|
||||
<div class="container mx-auto p-4">
|
||||
<div class="flex justify-between items-center mb-6">
|
||||
<h1 class="text-2xl font-bold text-gray-800">
|
||||
Управление пользователями
|
||||
</h1>
|
||||
<div class="text-sm text-gray-500">
|
||||
Всего: <span id="total-users-count">0</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white p-4 rounded-lg shadow-md mb-6">
|
||||
<div class="flex flex-col md:flex-row gap-4">
|
||||
<div class="flex-1 relative">
|
||||
<input
|
||||
type="text"
|
||||
id="user-search-input"
|
||||
placeholder="Поиск по имени, username или email..."
|
||||
class="w-full border rounded-lg pl-10 pr-4 py-2 focus:outline-none focus:ring-2 focus:ring-gray-400 transition"
|
||||
/>
|
||||
<svg
|
||||
class="absolute left-3 top-2.5 h-5 w-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"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="relative">
|
||||
<input
|
||||
type="text"
|
||||
id="role-filter-input"
|
||||
placeholder="Фильтр по роли..."
|
||||
class="w-full md:w-56 border rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-1 focus:ring-gray-400"
|
||||
autocomplete="off"
|
||||
/>
|
||||
<div
|
||||
id="role-filter-dropdown"
|
||||
class="hidden absolute z-50 w-full bg-white border border-gray-200 rounded-lg shadow-lg max-h-48 overflow-y-auto mt-1"
|
||||
></div>
|
||||
</div>
|
||||
<button
|
||||
id="reset-filters-btn"
|
||||
class="px-4 py-2 bg-white text-gray-600 border border-gray-300 rounded-lg hover:bg-gray-50 transition"
|
||||
>
|
||||
Сбросить
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="users-container" class="space-y-4"></div>
|
||||
|
||||
<div id="pagination-container"></div>
|
||||
</div>
|
||||
|
||||
<template id="user-card-template">
|
||||
<div
|
||||
class="bg-white p-4 rounded-lg shadow-md hover:shadow-lg transition-shadow duration-200 user-card"
|
||||
>
|
||||
<div class="flex items-start gap-4">
|
||||
<img
|
||||
class="user-avatar w-14 h-14 rounded-full border-2 border-gray-200 object-cover bg-gray-100"
|
||||
src=""
|
||||
alt=""
|
||||
/>
|
||||
<div class="flex-1 min-w-0">
|
||||
<div
|
||||
class="flex flex-col sm:flex-row sm:justify-between sm:items-start gap-2"
|
||||
>
|
||||
<div class="min-w-0 flex-1">
|
||||
<div class="flex items-center gap-2">
|
||||
<h3
|
||||
class="user-fullname text-lg font-bold text-gray-900 truncate"
|
||||
></h3>
|
||||
<span
|
||||
class="user-verified-badge hidden inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800"
|
||||
>
|
||||
<svg
|
||||
class="w-3 h-3 mr-1"
|
||||
fill="currentColor"
|
||||
viewBox="0 0 20 20"
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
d="M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z"
|
||||
clip-rule="evenodd"
|
||||
></path>
|
||||
</svg>
|
||||
Подтвержден
|
||||
</span>
|
||||
</div>
|
||||
<p class="user-username text-sm text-gray-500"></p>
|
||||
<p
|
||||
class="user-email text-sm text-gray-600 truncate"
|
||||
></p>
|
||||
</div>
|
||||
<div class="flex items-center gap-2">
|
||||
<span
|
||||
class="user-active-badge hidden inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800"
|
||||
>
|
||||
Активен
|
||||
</span>
|
||||
<span
|
||||
class="user-inactive-badge hidden inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-red-100 text-red-800"
|
||||
>
|
||||
Неактивен
|
||||
</span>
|
||||
<button
|
||||
class="edit-user-btn p-2 text-gray-400 hover:text-blue-600 hover:bg-blue-50 rounded-lg transition-colors"
|
||||
title="Редактировать"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"
|
||||
></path>
|
||||
</svg>
|
||||
</button>
|
||||
<button
|
||||
class="delete-user-btn p-2 text-gray-400 hover:text-red-600 hover:bg-red-50 rounded-lg transition-colors"
|
||||
title="Удалить"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
|
||||
></path>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-3">
|
||||
<div class="flex items-center flex-wrap gap-2">
|
||||
<span class="text-sm font-medium text-gray-700"
|
||||
>Роли:</span
|
||||
>
|
||||
<div class="user-roles flex flex-wrap gap-1"></div>
|
||||
<div class="relative inline-block">
|
||||
<button
|
||||
class="add-role-btn p-1 text-gray-400 hover:text-green-600 hover:bg-green-50 rounded transition-colors"
|
||||
title="Добавить роль"
|
||||
>
|
||||
<svg
|
||||
class="w-5 h-5"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 4v16m8-8H4"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template id="role-badge-template">
|
||||
<span
|
||||
class="role-badge inline-flex items-center bg-gray-600 text-white text-xs font-medium px-2.5 py-1 rounded-full"
|
||||
>
|
||||
<span class="role-name"></span>
|
||||
<button
|
||||
type="button"
|
||||
class="remove-role-btn ml-1.5 inline-flex items-center justify-center text-gray-300 hover:text-white hover:bg-red-500 rounded-full w-4 h-4 transition-colors"
|
||||
title="Удалить роль"
|
||||
>
|
||||
<svg
|
||||
class="w-3 h-3"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M6 18L18 6M6 6l12 12"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<template id="empty-state-template">
|
||||
<div class="bg-white p-8 rounded-lg shadow-md text-center">
|
||||
<svg
|
||||
class="mx-auto h-12 w-12 text-gray-400 mb-4"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z"
|
||||
></path>
|
||||
</svg>
|
||||
<h3 class="text-lg font-medium text-gray-900 mb-2">
|
||||
Пользователи не найдены
|
||||
</h3>
|
||||
<p class="text-gray-500">Попробуйте изменить параметры поиска</p>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template id="access-denied-template">
|
||||
<div class="bg-white p-8 rounded-lg shadow-md text-center">
|
||||
<svg
|
||||
class="mx-auto h-12 w-12 text-red-400 mb-4"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"
|
||||
></path>
|
||||
</svg>
|
||||
<h3 class="text-lg font-medium text-gray-900 mb-2">Доступ запрещён</h3>
|
||||
<p class="text-gray-500">У вас нет прав для просмотра этой страницы</p>
|
||||
<a
|
||||
href="/"
|
||||
class="inline-block mt-4 px-4 py-2 bg-gray-600 text-white rounded-lg hover:bg-gray-700 transition"
|
||||
>
|
||||
На главную
|
||||
</a>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div id="edit-user-modal" class="hidden fixed inset-0 z-50 overflow-y-auto">
|
||||
<div
|
||||
class="flex items-center justify-center min-h-screen px-4 pt-4 pb-20 text-center sm:p-0"
|
||||
>
|
||||
<div
|
||||
class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity"
|
||||
id="modal-backdrop"
|
||||
></div>
|
||||
<div
|
||||
class="relative inline-block bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:max-w-lg sm:w-full"
|
||||
>
|
||||
<form id="edit-user-form">
|
||||
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
|
||||
<h3 class="text-lg font-medium text-gray-900 mb-4">
|
||||
Редактирование пользователя
|
||||
</h3>
|
||||
<input type="hidden" id="edit-user-id" />
|
||||
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<label
|
||||
class="block text-sm font-medium text-gray-700 mb-1"
|
||||
>Email</label
|
||||
>
|
||||
<input
|
||||
type="email"
|
||||
id="edit-user-email"
|
||||
class="w-full border rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-gray-400"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label
|
||||
class="block text-sm font-medium text-gray-700 mb-1"
|
||||
>Полное имя</label
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
id="edit-user-fullname"
|
||||
class="w-full border rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-gray-400"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label
|
||||
class="block text-sm font-medium text-gray-700 mb-1"
|
||||
>Новый пароль (оставьте пустым, чтобы не
|
||||
менять)</label
|
||||
>
|
||||
<input
|
||||
type="password"
|
||||
id="edit-user-password"
|
||||
class="w-full border rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-gray-400"
|
||||
placeholder="••••••••"
|
||||
/>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
<label
|
||||
class="flex items-center gap-2 cursor-pointer"
|
||||
>
|
||||
<input
|
||||
type="checkbox"
|
||||
id="edit-user-active"
|
||||
class="w-4 h-4 text-blue-600 rounded focus:ring-blue-500"
|
||||
/>
|
||||
<span class="text-sm text-gray-700"
|
||||
>Активен</span
|
||||
>
|
||||
</label>
|
||||
<label
|
||||
class="flex items-center gap-2 cursor-pointer"
|
||||
>
|
||||
<input
|
||||
type="checkbox"
|
||||
id="edit-user-verified"
|
||||
class="w-4 h-4 text-green-600 rounded focus:ring-green-500"
|
||||
/>
|
||||
<span class="text-sm text-gray-700"
|
||||
>Подтверждён</span
|
||||
>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse gap-2"
|
||||
>
|
||||
<button
|
||||
type="submit"
|
||||
class="w-full sm:w-auto inline-flex justify-center rounded-lg border border-transparent shadow-sm px-4 py-2 bg-gray-600 text-white font-medium hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 transition"
|
||||
>
|
||||
Сохранить
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
id="cancel-edit-btn"
|
||||
class="mt-3 sm:mt-0 w-full sm:w-auto inline-flex justify-center rounded-lg border border-gray-300 shadow-sm px-4 py-2 bg-white text-gray-700 font-medium hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 transition"
|
||||
>
|
||||
Отмена
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="delete-user-modal" class="hidden fixed inset-0 z-50 overflow-y-auto">
|
||||
<div
|
||||
class="flex items-center justify-center min-h-screen px-4 pt-4 pb-20 text-center sm:p-0"
|
||||
>
|
||||
<div
|
||||
class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity"
|
||||
id="delete-modal-backdrop"
|
||||
></div>
|
||||
<div
|
||||
class="relative inline-block bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:max-w-lg sm:w-full"
|
||||
>
|
||||
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
|
||||
<div class="sm:flex sm:items-start">
|
||||
<div
|
||||
class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-red-100 sm:mx-0 sm:h-10 sm:w-10"
|
||||
>
|
||||
<svg
|
||||
class="h-6 w-6 text-red-600"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
|
||||
<h3 class="text-lg font-medium text-gray-900">
|
||||
Удаление пользователя
|
||||
</h3>
|
||||
<div class="mt-2">
|
||||
<p class="text-sm text-gray-500">
|
||||
Вы уверены, что хотите удалить пользователя
|
||||
<strong id="delete-user-name"></strong>? Это
|
||||
действие необратимо.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="bg-gray-50 px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse gap-2"
|
||||
>
|
||||
<button
|
||||
type="button"
|
||||
id="confirm-delete-btn"
|
||||
class="w-full sm:w-auto inline-flex justify-center rounded-lg border border-transparent shadow-sm px-4 py-2 bg-red-600 text-white font-medium hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500 transition"
|
||||
>
|
||||
Удалить
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
id="cancel-delete-btn"
|
||||
class="mt-3 sm:mt-0 w-full sm:w-auto inline-flex justify-center rounded-lg border border-gray-300 shadow-sm px-4 py-2 bg-white text-gray-700 font-medium hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-500 transition"
|
||||
>
|
||||
Отмена
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% endblock %} {% block scripts %}
|
||||
<script src="/static/users.js"></script>
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user