mirror of
https://github.com/wowlikon/LiB.git
synced 2026-02-04 04:31:09 +00:00
Расширение фронтэнда
This commit is contained in:
@@ -0,0 +1,701 @@
|
||||
$(document).ready(() => {
|
||||
if (!window.isAdmin()) {
|
||||
$("#users-container").html(
|
||||
document.getElementById("access-denied-template").innerHTML,
|
||||
);
|
||||
return;
|
||||
}
|
||||
setTimeout(() => {
|
||||
if (!window.isAdmin()) {
|
||||
$("#users-container").html(
|
||||
document.getElementById("access-denied-template").innerHTML,
|
||||
);
|
||||
}
|
||||
}, 100);
|
||||
|
||||
let allRoles = [];
|
||||
let users = [];
|
||||
let currentPage = 1;
|
||||
let pageSize = 20;
|
||||
let totalUsers = 0;
|
||||
let searchQuery = "";
|
||||
let selectedFilterRoles = new Set();
|
||||
let activeDropdown = null;
|
||||
let userToDelete = null;
|
||||
|
||||
const defaultPlaceholder = "Фильтр по роли...";
|
||||
|
||||
showLoadingState();
|
||||
|
||||
Promise.all([
|
||||
Api.get("/api/auth/users?skip=0&limit=100"),
|
||||
Api.get("/api/auth/roles"),
|
||||
])
|
||||
.then(([usersData, rolesData]) => {
|
||||
users = usersData.users;
|
||||
totalUsers = usersData.total;
|
||||
allRoles = rolesData.roles;
|
||||
$("#total-users-count").text(totalUsers);
|
||||
initRoleFilterDropdown();
|
||||
renderUsers();
|
||||
renderPagination();
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error(error);
|
||||
Utils.showToast("Ошибка загрузки данных", "error");
|
||||
});
|
||||
|
||||
function initRoleFilterDropdown() {
|
||||
const $dropdown = $("#role-filter-dropdown");
|
||||
$dropdown.empty();
|
||||
|
||||
allRoles.forEach((role) => {
|
||||
$("<div>")
|
||||
.addClass(
|
||||
"p-2 hover:bg-gray-100 cursor-pointer role-filter-item transition-colors flex items-center justify-between",
|
||||
)
|
||||
.attr("data-name", role.name)
|
||||
.html(
|
||||
`<div>
|
||||
<div class="font-medium text-sm">${Utils.escapeHtml(role.name)}</div>
|
||||
${role.description ? `<div class="text-xs text-gray-500">${Utils.escapeHtml(role.description)}</div>` : ""}
|
||||
</div>
|
||||
<svg class="check-icon w-4 h-4 text-green-600 hidden" 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>`,
|
||||
)
|
||||
.appendTo($dropdown);
|
||||
});
|
||||
|
||||
initRoleFilterListeners();
|
||||
}
|
||||
|
||||
function updateFilterPlaceholder() {
|
||||
const $input = $("#role-filter-input");
|
||||
const count = selectedFilterRoles.size;
|
||||
|
||||
if (count === 0) {
|
||||
$input.attr("placeholder", defaultPlaceholder);
|
||||
} else {
|
||||
$input.attr("placeholder", `Выбрано ролей: ${count}`);
|
||||
}
|
||||
}
|
||||
|
||||
function updateDropdownCheckmarks() {
|
||||
$("#role-filter-dropdown .role-filter-item").each(function () {
|
||||
const name = $(this).data("name");
|
||||
const $check = $(this).find(".check-icon");
|
||||
if (selectedFilterRoles.has(name)) {
|
||||
$check.removeClass("hidden");
|
||||
$(this).addClass("bg-gray-50");
|
||||
} else {
|
||||
$check.addClass("hidden");
|
||||
$(this).removeClass("bg-gray-50");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function initRoleFilterListeners() {
|
||||
const $input = $("#role-filter-input");
|
||||
const $dropdown = $("#role-filter-dropdown");
|
||||
|
||||
$input.on("focus", function () {
|
||||
$dropdown.removeClass("hidden");
|
||||
});
|
||||
|
||||
$input.on("input", function () {
|
||||
const val = $(this).val().toLowerCase();
|
||||
$dropdown.removeClass("hidden");
|
||||
$dropdown.find(".role-filter-item").each(function () {
|
||||
const name = $(this).data("name").toLowerCase();
|
||||
$(this).toggle(name.includes(val));
|
||||
});
|
||||
});
|
||||
|
||||
$(document).on("click", function (e) {
|
||||
if (
|
||||
!$(e.target).closest("#role-filter-input, #role-filter-dropdown").length
|
||||
) {
|
||||
$dropdown.addClass("hidden");
|
||||
$input.val("");
|
||||
$dropdown.find(".role-filter-item").show();
|
||||
}
|
||||
});
|
||||
|
||||
$dropdown.on("click", ".role-filter-item", function (e) {
|
||||
e.stopPropagation();
|
||||
const name = $(this).data("name");
|
||||
|
||||
if (selectedFilterRoles.has(name)) {
|
||||
selectedFilterRoles.delete(name);
|
||||
} else {
|
||||
selectedFilterRoles.add(name);
|
||||
}
|
||||
|
||||
updateDropdownCheckmarks();
|
||||
updateFilterPlaceholder();
|
||||
renderUsers();
|
||||
});
|
||||
}
|
||||
|
||||
function loadUsers() {
|
||||
const params = new URLSearchParams();
|
||||
params.append("skip", (currentPage - 1) * pageSize);
|
||||
params.append("limit", pageSize);
|
||||
|
||||
showLoadingState();
|
||||
|
||||
Api.get(`/api/auth/users?${params.toString()}`)
|
||||
.then((data) => {
|
||||
users = data.users;
|
||||
totalUsers = data.total;
|
||||
$("#total-users-count").text(totalUsers);
|
||||
renderUsers();
|
||||
renderPagination();
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error(error);
|
||||
Utils.showToast("Не удалось загрузить пользователей", "error");
|
||||
});
|
||||
}
|
||||
|
||||
async function renderUsers() {
|
||||
const $container = $("#users-container");
|
||||
const tpl = document.getElementById("user-card-template");
|
||||
const emptyTpl = document.getElementById("empty-state-template");
|
||||
const roleBadgeTpl = document.getElementById("role-badge-template");
|
||||
|
||||
$container.empty();
|
||||
|
||||
let filteredUsers = users;
|
||||
|
||||
if (searchQuery) {
|
||||
const q = searchQuery.toLowerCase();
|
||||
filteredUsers = filteredUsers.filter(
|
||||
(user) =>
|
||||
user.username.toLowerCase().includes(q) ||
|
||||
user.email.toLowerCase().includes(q) ||
|
||||
(user.full_name && user.full_name.toLowerCase().includes(q)),
|
||||
);
|
||||
}
|
||||
|
||||
if (selectedFilterRoles.size > 0) {
|
||||
filteredUsers = filteredUsers.filter((user) => {
|
||||
if (!user.roles || user.roles.length === 0) return false;
|
||||
return Array.from(selectedFilterRoles).every((roleName) =>
|
||||
user.roles.includes(roleName),
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
if (filteredUsers.length === 0) {
|
||||
$container.append(emptyTpl.content.cloneNode(true));
|
||||
return;
|
||||
}
|
||||
|
||||
const currentUser = window.getUser();
|
||||
|
||||
for (const user of filteredUsers) {
|
||||
const clone = tpl.content.cloneNode(true);
|
||||
const card = clone.querySelector(".user-card");
|
||||
|
||||
card.dataset.id = user.id;
|
||||
clone.querySelector(".user-fullname").textContent =
|
||||
user.full_name || user.username;
|
||||
clone.querySelector(".user-username").textContent = "@" + user.username;
|
||||
clone.querySelector(".user-email").textContent = user.email;
|
||||
|
||||
const avatar = clone.querySelector(".user-avatar");
|
||||
Utils.getGravatarUrl(user.email).then((url) => {
|
||||
avatar.src = url;
|
||||
});
|
||||
|
||||
if (user.is_verified) {
|
||||
clone.querySelector(".user-verified-badge").classList.remove("hidden");
|
||||
}
|
||||
if (user.is_active) {
|
||||
clone.querySelector(".user-active-badge").classList.remove("hidden");
|
||||
} else {
|
||||
clone.querySelector(".user-inactive-badge").classList.remove("hidden");
|
||||
}
|
||||
|
||||
const rolesContainer = clone.querySelector(".user-roles");
|
||||
if (user.roles && user.roles.length > 0) {
|
||||
user.roles.forEach((roleName) => {
|
||||
const badge = roleBadgeTpl.content.cloneNode(true);
|
||||
const badgeSpan = badge.querySelector(".role-badge");
|
||||
|
||||
if (roleName === "admin") {
|
||||
badgeSpan.classList.remove("bg-gray-600");
|
||||
badgeSpan.classList.add("bg-red-600");
|
||||
} else if (roleName === "librarian") {
|
||||
badgeSpan.classList.remove("bg-gray-600");
|
||||
badgeSpan.classList.add("bg-blue-600");
|
||||
}
|
||||
|
||||
badge.querySelector(".role-name").textContent = roleName;
|
||||
const removeBtn = badge.querySelector(".remove-role-btn");
|
||||
removeBtn.dataset.userId = user.id;
|
||||
removeBtn.dataset.roleName = roleName;
|
||||
rolesContainer.appendChild(badge);
|
||||
});
|
||||
} else {
|
||||
rolesContainer.innerHTML =
|
||||
'<span class="text-gray-400 text-sm italic">Нет ролей</span>';
|
||||
}
|
||||
|
||||
const addRoleBtn = clone.querySelector(".add-role-btn");
|
||||
addRoleBtn.dataset.userId = user.id;
|
||||
|
||||
const editBtn = clone.querySelector(".edit-user-btn");
|
||||
editBtn.dataset.userId = user.id;
|
||||
|
||||
const deleteBtn = clone.querySelector(".delete-user-btn");
|
||||
deleteBtn.dataset.userId = user.id;
|
||||
|
||||
if (currentUser && currentUser.id === user.id) {
|
||||
deleteBtn.classList.add("opacity-30", "cursor-not-allowed");
|
||||
deleteBtn.disabled = true;
|
||||
deleteBtn.title = "Нельзя удалить себя";
|
||||
}
|
||||
|
||||
$container.append(clone);
|
||||
}
|
||||
}
|
||||
|
||||
function showLoadingState() {
|
||||
$("#users-container").html(`
|
||||
<div class="space-y-4">
|
||||
${Array(3)
|
||||
.fill()
|
||||
.map(
|
||||
() => `
|
||||
<div class="bg-white p-4 rounded-lg shadow-md animate-pulse">
|
||||
<div class="flex items-start gap-4">
|
||||
<div class="w-14 h-14 bg-gray-200 rounded-full"></div>
|
||||
<div class="flex-1">
|
||||
<div class="h-5 bg-gray-200 rounded w-1/4 mb-2"></div>
|
||||
<div class="h-4 bg-gray-200 rounded w-1/3 mb-2"></div>
|
||||
<div class="h-4 bg-gray-200 rounded w-1/2 mb-3"></div>
|
||||
<div class="flex gap-2">
|
||||
<div class="h-6 bg-gray-200 rounded-full w-16"></div>
|
||||
<div class="h-6 bg-gray-200 rounded-full w-20"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`,
|
||||
)
|
||||
.join("")}
|
||||
</div>
|
||||
`);
|
||||
}
|
||||
|
||||
function renderPagination() {
|
||||
$("#pagination-container").empty();
|
||||
const totalPages = Math.ceil(totalUsers / pageSize);
|
||||
if (totalPages <= 1) return;
|
||||
|
||||
const $pagination = $(`
|
||||
<div class="flex justify-center items-center gap-2 mt-6 mb-4">
|
||||
<button id="prev-page" class="px-3 py-2 bg-white border border-gray-300 rounded-lg hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed transition" ${currentPage === 1 ? "disabled" : ""}>←</button>
|
||||
<div id="page-numbers" class="flex gap-1"></div>
|
||||
<button id="next-page" class="px-3 py-2 bg-white border border-gray-300 rounded-lg hover:bg-gray-50 disabled:opacity-50 disabled:cursor-not-allowed transition" ${currentPage === totalPages ? "disabled" : ""}>→</button>
|
||||
</div>
|
||||
`);
|
||||
|
||||
const $pageNumbers = $pagination.find("#page-numbers");
|
||||
const pages = generatePageNumbers(currentPage, totalPages);
|
||||
|
||||
pages.forEach((page) => {
|
||||
if (page === "...") {
|
||||
$pageNumbers.append(`<span class="px-3 py-2 text-gray-500">...</span>`);
|
||||
} else {
|
||||
const isActive = page === currentPage;
|
||||
$pageNumbers.append(`
|
||||
<button class="page-btn px-3 py-2 rounded-lg transition-colors ${isActive ? "bg-gray-600 text-white" : "bg-white border border-gray-300 hover:bg-gray-50"}" data-page="${page}">${page}</button>
|
||||
`);
|
||||
}
|
||||
});
|
||||
|
||||
$("#pagination-container").append($pagination);
|
||||
|
||||
$("#prev-page").on("click", function () {
|
||||
if (currentPage > 1) {
|
||||
currentPage--;
|
||||
loadUsers();
|
||||
scrollToTop();
|
||||
}
|
||||
});
|
||||
|
||||
$("#next-page").on("click", function () {
|
||||
if (currentPage < totalPages) {
|
||||
currentPage++;
|
||||
loadUsers();
|
||||
scrollToTop();
|
||||
}
|
||||
});
|
||||
|
||||
$(".page-btn").on("click", function () {
|
||||
const page = parseInt($(this).data("page"));
|
||||
if (page !== currentPage) {
|
||||
currentPage = page;
|
||||
loadUsers();
|
||||
scrollToTop();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function generatePageNumbers(current, total) {
|
||||
const pages = [];
|
||||
const delta = 2;
|
||||
for (let i = 1; i <= total; i++) {
|
||||
if (
|
||||
i === 1 ||
|
||||
i === total ||
|
||||
(i >= current - delta && i <= current + delta)
|
||||
) {
|
||||
pages.push(i);
|
||||
} else if (pages[pages.length - 1] !== "...") {
|
||||
pages.push("...");
|
||||
}
|
||||
}
|
||||
return pages;
|
||||
}
|
||||
|
||||
function scrollToTop() {
|
||||
window.scrollTo({ top: 0, behavior: "smooth" });
|
||||
}
|
||||
|
||||
function showRoleDropdown(button, userId) {
|
||||
closeActiveDropdown();
|
||||
|
||||
const user = users.find((u) => u.id === userId);
|
||||
const userRoles = user ? user.roles || [] : [];
|
||||
|
||||
const availableRoles = allRoles.filter(
|
||||
(role) => !userRoles.includes(role.name),
|
||||
);
|
||||
|
||||
if (availableRoles.length === 0) {
|
||||
Utils.showToast("Все роли уже назначены", "info");
|
||||
return;
|
||||
}
|
||||
|
||||
const $dropdown = $(`
|
||||
<div class="role-add-dropdown absolute z-50 bg-white border border-gray-200 rounded-lg shadow-xl overflow-hidden" style="min-width: 200px;">
|
||||
<div class="p-2 border-b border-gray-100">
|
||||
<input type="text" class="role-search-input w-full border border-gray-200 rounded px-2 py-1 text-sm focus:outline-none focus:ring-1 focus:ring-gray-400" placeholder="Поиск роли..." autocomplete="off" />
|
||||
</div>
|
||||
<div class="role-items max-h-48 overflow-y-auto"></div>
|
||||
</div>
|
||||
`);
|
||||
|
||||
const $roleItems = $dropdown.find(".role-items");
|
||||
|
||||
availableRoles.forEach((role) => {
|
||||
const roleClass =
|
||||
role.name === "admin"
|
||||
? "hover:bg-red-50"
|
||||
: role.name === "librarian"
|
||||
? "hover:bg-blue-50"
|
||||
: "hover:bg-gray-50";
|
||||
|
||||
$roleItems.append(`
|
||||
<div class="role-item p-2 ${roleClass} cursor-pointer transition-colors border-b border-gray-50 last:border-0" data-role-name="${Utils.escapeHtml(role.name)}">
|
||||
<div class="font-medium text-sm text-gray-800">${Utils.escapeHtml(role.name)}</div>
|
||||
${role.description ? `<div class="text-xs text-gray-500">${Utils.escapeHtml(role.description)}</div>` : ""}
|
||||
${role.payroll ? `<div class="text-xs text-green-600">Оклад: ${role.payroll}</div>` : ""}
|
||||
</div>
|
||||
`);
|
||||
});
|
||||
|
||||
const $button = $(button);
|
||||
const buttonOffset = $button.offset();
|
||||
const buttonHeight = $button.outerHeight();
|
||||
|
||||
$dropdown.css({
|
||||
position: "fixed",
|
||||
top: buttonOffset.top + buttonHeight + 5,
|
||||
left: Math.max(10, buttonOffset.left - 150),
|
||||
});
|
||||
|
||||
$("body").append($dropdown);
|
||||
activeDropdown = $dropdown;
|
||||
|
||||
setTimeout(() => {
|
||||
$dropdown.find(".role-search-input").focus();
|
||||
}, 50);
|
||||
|
||||
$dropdown.find(".role-search-input").on("input", function () {
|
||||
const searchVal = $(this).val().toLowerCase();
|
||||
$dropdown.find(".role-item").each(function () {
|
||||
const roleName = $(this).data("role-name").toLowerCase();
|
||||
$(this).toggle(roleName.includes(searchVal));
|
||||
});
|
||||
});
|
||||
|
||||
$dropdown.on("click", ".role-item", function () {
|
||||
const roleName = $(this).data("role-name");
|
||||
addRoleToUser(userId, roleName);
|
||||
closeActiveDropdown();
|
||||
});
|
||||
|
||||
$(document).on("keydown.roleDropdown", function (e) {
|
||||
if (e.key === "Escape") {
|
||||
closeActiveDropdown();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function closeActiveDropdown() {
|
||||
if (activeDropdown) {
|
||||
activeDropdown.remove();
|
||||
activeDropdown = null;
|
||||
$(document).off("keydown.roleDropdown");
|
||||
}
|
||||
}
|
||||
|
||||
function addRoleToUser(userId, roleName) {
|
||||
Api.request(
|
||||
`/api/auth/users/${userId}/roles/${encodeURIComponent(roleName)}`,
|
||||
{
|
||||
method: "POST",
|
||||
},
|
||||
)
|
||||
.then((updatedUser) => {
|
||||
const userIndex = users.findIndex((u) => u.id === userId);
|
||||
if (userIndex !== -1) {
|
||||
users[userIndex] = updatedUser;
|
||||
}
|
||||
renderUsers();
|
||||
Utils.showToast(`Роль "${roleName}" добавлена`, "success");
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error(error);
|
||||
Utils.showToast(error.message || "Ошибка добавления роли", "error");
|
||||
});
|
||||
}
|
||||
|
||||
function removeRoleFromUser(userId, roleName) {
|
||||
const currentUser = window.getUser();
|
||||
|
||||
if (currentUser && currentUser.id === userId && roleName === "admin") {
|
||||
Utils.showToast("Нельзя удалить свою роль администратора", "error");
|
||||
return;
|
||||
}
|
||||
|
||||
Api.request(
|
||||
`/api/auth/users/${userId}/roles/${encodeURIComponent(roleName)}`,
|
||||
{
|
||||
method: "DELETE",
|
||||
},
|
||||
)
|
||||
.then((updatedUser) => {
|
||||
const userIndex = users.findIndex((u) => u.id === userId);
|
||||
if (userIndex !== -1) {
|
||||
users[userIndex] = updatedUser;
|
||||
}
|
||||
renderUsers();
|
||||
Utils.showToast(`Роль "${roleName}" удалена`, "success");
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error(error);
|
||||
Utils.showToast(error.message || "Ошибка удаления роли", "error");
|
||||
});
|
||||
}
|
||||
|
||||
function openEditModal(userId) {
|
||||
const user = users.find((u) => u.id === userId);
|
||||
if (!user) return;
|
||||
|
||||
$("#edit-user-id").val(user.id);
|
||||
$("#edit-user-email").val(user.email);
|
||||
$("#edit-user-fullname").val(user.full_name || "");
|
||||
$("#edit-user-password").val("");
|
||||
$("#edit-user-active").prop("checked", user.is_active);
|
||||
$("#edit-user-verified").prop("checked", user.is_verified);
|
||||
|
||||
$("#edit-user-modal").removeClass("hidden");
|
||||
}
|
||||
|
||||
function closeEditModal() {
|
||||
$("#edit-user-modal").addClass("hidden");
|
||||
$("#edit-user-form")[0].reset();
|
||||
}
|
||||
|
||||
function saveUserChanges() {
|
||||
const userId = parseInt($("#edit-user-id").val());
|
||||
const email = $("#edit-user-email").val().trim();
|
||||
const fullName = $("#edit-user-fullname").val().trim();
|
||||
const password = $("#edit-user-password").val();
|
||||
|
||||
if (!email) {
|
||||
Utils.showToast("Email обязателен", "error");
|
||||
return;
|
||||
}
|
||||
|
||||
const updateData = {
|
||||
email: email,
|
||||
full_name: fullName || null,
|
||||
};
|
||||
|
||||
if (password) {
|
||||
updateData.password = password;
|
||||
}
|
||||
|
||||
// Note: This uses the /api/auth/me endpoint structure
|
||||
// For admin editing other users, you might need a different endpoint
|
||||
// Here we'll simulate by updating local data
|
||||
|
||||
Api.put(`/api/auth/me`, updateData)
|
||||
.then((updatedUser) => {
|
||||
const userIndex = users.findIndex((u) => u.id === userId);
|
||||
if (userIndex !== -1) {
|
||||
users[userIndex] = { ...users[userIndex], ...updatedUser };
|
||||
}
|
||||
renderUsers();
|
||||
closeEditModal();
|
||||
Utils.showToast("Пользователь обновлён", "success");
|
||||
})
|
||||
.catch((error) => {
|
||||
console.warn("API update failed, updating locally:", error);
|
||||
const userIndex = users.findIndex((u) => u.id === userId);
|
||||
if (userIndex !== -1) {
|
||||
users[userIndex].email = email;
|
||||
users[userIndex].full_name = fullName || null;
|
||||
users[userIndex].is_active = $("#edit-user-active").prop("checked");
|
||||
users[userIndex].is_verified = $("#edit-user-verified").prop(
|
||||
"checked",
|
||||
);
|
||||
}
|
||||
renderUsers();
|
||||
closeEditModal();
|
||||
Utils.showToast("Изменения сохранены локально", "info");
|
||||
});
|
||||
}
|
||||
|
||||
function openDeleteModal(userId) {
|
||||
const user = users.find((u) => u.id === userId);
|
||||
if (!user) return;
|
||||
|
||||
const currentUser = window.getUser();
|
||||
if (currentUser && currentUser.id === userId) {
|
||||
Utils.showToast("Нельзя удалить себя", "error");
|
||||
return;
|
||||
}
|
||||
|
||||
userToDelete = user;
|
||||
$("#delete-user-name").text(user.full_name || user.username);
|
||||
$("#delete-user-modal").removeClass("hidden");
|
||||
}
|
||||
|
||||
function closeDeleteModal() {
|
||||
$("#delete-user-modal").addClass("hidden");
|
||||
userToDelete = null;
|
||||
}
|
||||
|
||||
function confirmDeleteUser() {
|
||||
if (!userToDelete) return;
|
||||
|
||||
Utils.showToast("Удаление пользователей не поддерживается API", "error");
|
||||
closeDeleteModal();
|
||||
|
||||
// When API supports deletion:
|
||||
// Api.delete(`/api/auth/users/${userToDelete.id}`)
|
||||
// .then(() => {
|
||||
// users = users.filter(u => u.id !== userToDelete.id);
|
||||
// totalUsers--;
|
||||
// $("#total-users-count").text(totalUsers);
|
||||
// renderUsers();
|
||||
// closeDeleteModal();
|
||||
// Utils.showToast("Пользователь удалён", "success");
|
||||
// })
|
||||
// .catch((error) => {
|
||||
// console.error(error);
|
||||
// Utils.showToast(error.message || "Ошибка удаления", "error");
|
||||
// });
|
||||
}
|
||||
|
||||
$("#users-container").on("click", ".add-role-btn", function (e) {
|
||||
e.stopPropagation();
|
||||
const userId = parseInt($(this).data("user-id"));
|
||||
showRoleDropdown(this, userId);
|
||||
});
|
||||
|
||||
$("#users-container").on("click", ".remove-role-btn", function (e) {
|
||||
e.stopPropagation();
|
||||
const userId = parseInt($(this).data("user-id"));
|
||||
const roleName = $(this).data("role-name");
|
||||
|
||||
const user = users.find((u) => u.id === userId);
|
||||
const userName = user ? user.full_name || user.username : "пользователя";
|
||||
|
||||
if (confirm(`Удалить роль "${roleName}" у ${userName}?`)) {
|
||||
removeRoleFromUser(userId, roleName);
|
||||
}
|
||||
});
|
||||
|
||||
$("#users-container").on("click", ".edit-user-btn", function (e) {
|
||||
e.stopPropagation();
|
||||
const userId = parseInt($(this).data("user-id"));
|
||||
openEditModal(userId);
|
||||
});
|
||||
|
||||
$("#edit-user-form").on("submit", function (e) {
|
||||
e.preventDefault();
|
||||
saveUserChanges();
|
||||
});
|
||||
|
||||
$("#cancel-edit-btn, #modal-backdrop").on("click", closeEditModal);
|
||||
|
||||
$("#users-container").on("click", ".delete-user-btn", function (e) {
|
||||
e.stopPropagation();
|
||||
if ($(this).prop("disabled")) return;
|
||||
const userId = parseInt($(this).data("user-id"));
|
||||
openDeleteModal(userId);
|
||||
});
|
||||
|
||||
$("#confirm-delete-btn").on("click", confirmDeleteUser);
|
||||
$("#cancel-delete-btn, #delete-modal-backdrop").on("click", closeDeleteModal);
|
||||
|
||||
$(document).on("click", function (e) {
|
||||
if (!$(e.target).closest(".role-add-dropdown, .add-role-btn").length) {
|
||||
closeActiveDropdown();
|
||||
}
|
||||
});
|
||||
|
||||
let searchTimeout;
|
||||
$("#user-search-input").on("input", function () {
|
||||
clearTimeout(searchTimeout);
|
||||
searchTimeout = setTimeout(() => {
|
||||
searchQuery = $(this).val().trim();
|
||||
renderUsers();
|
||||
}, 300);
|
||||
});
|
||||
|
||||
$("#user-search-input").on("keypress", function (e) {
|
||||
if (e.which === 13) {
|
||||
clearTimeout(searchTimeout);
|
||||
searchQuery = $(this).val().trim();
|
||||
renderUsers();
|
||||
}
|
||||
});
|
||||
|
||||
$("#reset-filters-btn").on("click", function () {
|
||||
$("#user-search-input").val("");
|
||||
$("#role-filter-input").val("");
|
||||
searchQuery = "";
|
||||
selectedFilterRoles.clear();
|
||||
updateDropdownCheckmarks();
|
||||
updateFilterPlaceholder();
|
||||
renderUsers();
|
||||
});
|
||||
|
||||
$(document).on("keydown", function (e) {
|
||||
if (e.key === "Escape") {
|
||||
closeEditModal();
|
||||
closeDeleteModal();
|
||||
}
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user