automatic fetch of users in overview_users.js

This commit is contained in:
andrei-mihnea-cerbu
2025-02-12 19:00:22 +02:00
parent c6da9a6972
commit 73f9c6b526
2 changed files with 83 additions and 51 deletions
+82 -50
View File
@@ -2,15 +2,36 @@ let codeGetDepartments = '';
let codeGetUsers = '';
let codeDeleteUser = '';
let codeOk = '';
let fetchInterval = null; // Store interval ID
const userElementsMap = new Map(); // Track user elements by ID
document.addEventListener('DOMContentLoaded', async () => {
const backButton = document.getElementById('backButton');
backButton.addEventListener('click', async () => {
await stopFetchingUsers(); // Stop interval before leaving
await window.networkAPI.closeUcSocket();
fadeOut('main_menu');
});
await startFetchingUsers(); // Start fetching users every 5 seconds
});
async function startFetchingUsers() {
await fetchData(); // Initial fetch
// Set interval to fetch users every 5 seconds
fetchInterval = setInterval(async () => {
await fetchData();
}, 5000);
}
async function stopFetchingUsers() {
if (fetchInterval) {
clearInterval(fetchInterval); // Stop interval when leaving the page
fetchInterval = null;
}
}
async function fetchData() {
const operationCodes = await window.networkAPI.getOperationsCodes();
if (!operationCodes) {
@@ -23,13 +44,11 @@ async function fetchData() {
codeDeleteUser = operationCodes.DELETE_USER;
codeOk = operationCodes.OK;
// Open the TCP socket right after fetching the operation codes
if (!await window.networkAPI.openUcSocket()) {
alert('Failed to open socket. Internal error of the application.');
return;
}
// Fetch departments
const departmentsResponse = await fetchDepartments();
if (!departmentsResponse || departmentsResponse.operationCode !== codeOk) {
alert('Failed to fetch departments. Redirecting to main menu...');
@@ -39,7 +58,6 @@ async function fetchData() {
const departments = departmentsResponse.metaInfo.departments;
// Fetch users
const usersResponse = await fetchUsers();
if (!usersResponse || usersResponse.operationCode !== codeOk) {
alert('Failed to fetch users. Redirecting to main menu...');
@@ -48,72 +66,83 @@ async function fetchData() {
}
const users = usersResponse.metaInfo.users;
updateUsersList(users, departments);
}
function updateUsersList(users, departments) {
const usersContainer = document.getElementById('users-container');
usersContainer.innerHTML = ''; // Clear the container
// Filter out users in the CEO department
const ceoDepartment = departments.find(dept => dept.name.toLowerCase() === 'ceo');
const filteredUsers = users.filter(user => user.departmentId !== ceoDepartment.id);
// Check if there are no users after filtering
if (!filteredUsers.length) {
const noUsersMessage = document.createElement('p');
noUsersMessage.textContent = 'No users exist.';
noUsersMessage.classList.add('no-users-message'); // Add a class for styling
usersContainer.appendChild(noUsersMessage);
fadeIn(); // Fade in the container when the message is loaded
return;
}
const existingUserIds = new Set(filteredUsers.map(user => user.id));
// Render users if there are any
// Remove users that no longer exist
userElementsMap.forEach((element, userId) => {
if (!existingUserIds.has(userId)) {
element.remove();
userElementsMap.delete(userId);
}
});
// Update or add users
filteredUsers.forEach(user => {
const userDiv = document.createElement('div');
userDiv.classList.add('user-card');
if (!userElementsMap.has(user.id)) {
// Create new user element
const userDiv = document.createElement('div');
userDiv.classList.add('user-card');
// Create user info div
const userInfoDiv = document.createElement('div');
userInfoDiv.classList.add('user-info');
const userInfoDiv = document.createElement('div');
userInfoDiv.classList.add('user-info');
// Create user name paragraph
const nameP = document.createElement('p');
nameP.classList.add('user-name');
nameP.textContent = user.name;
const nameP = document.createElement('p');
nameP.classList.add('user-name');
nameP.textContent = user.name;
console.log(user)
console.log(user);
console.log(departments);
console.log(departments)
const department = departments.find(dept => dept.id === user.departmentId);
const departmentName = department ? department.name : 'Unknown';
// Find and display user's department name
const department = departments.find(dept => dept.id === user.departmentId);
const departmentName = department ? department.name : 'Unknown';
const departmentP = document.createElement('p');
departmentP.classList.add('user-department');
departmentP.textContent = `Department: ${departmentName}`;
// Create user department paragraph
const departmentP = document.createElement('p');
departmentP.classList.add('user-department');
departmentP.textContent = `Department: ${departmentName}`;
userInfoDiv.appendChild(nameP);
userInfoDiv.appendChild(departmentP);
// Append name and department to user info div
userInfoDiv.appendChild(nameP);
userInfoDiv.appendChild(departmentP);
const deleteButton = document.createElement('button');
deleteButton.textContent = 'Delete';
deleteButton.classList.add('delete-button');
deleteButton.onclick = () => deleteUser(user.id);
// Create delete button
const deleteButton = document.createElement('button');
deleteButton.textContent = 'Delete';
deleteButton.classList.add('delete-button');
deleteButton.onclick = () => deleteUser(user.id);
userDiv.appendChild(userInfoDiv);
userDiv.appendChild(deleteButton);
usersContainer.appendChild(userDiv);
// Append user info div and delete button to user card
userDiv.appendChild(userInfoDiv);
userDiv.appendChild(deleteButton);
userElementsMap.set(user.id, userDiv); // Store reference
} else {
// Update existing user info if necessary
const existingDiv = userElementsMap.get(user.id);
const nameElement = existingDiv.querySelector('.user-name');
const departmentElement = existingDiv.querySelector('.user-department');
// Append user card to the container
usersContainer.appendChild(userDiv);
if (nameElement.textContent !== user.name) {
nameElement.textContent = user.name;
}
const department = departments.find(dept => dept.id === user.departmentId);
const departmentName = department ? department.name : 'Unknown';
if (departmentElement.textContent !== `Department: ${departmentName}`) {
departmentElement.textContent = `Department: ${departmentName}`;
}
}
});
}
async function fetchDepartments() {
// Send the request to get departments
if (!await window.networkAPI.sendUcMessage(codeGetDepartments)) {
return null;
}
@@ -121,7 +150,6 @@ async function fetchDepartments() {
}
async function fetchUsers() {
// Send the request to get users
if (!await window.networkAPI.sendUcMessage(codeGetUsers)) {
return null;
}
@@ -129,8 +157,7 @@ async function fetchUsers() {
}
async function deleteUser(userId) {
// Send the request to delete the user
if (!await window.networkAPI.sendUcMessage(codeDeleteUser, {id: userId})) {
if (!await window.networkAPI.sendUcMessage(codeDeleteUser, { id: userId })) {
alert('Failed to send request to delete user.');
return;
}
@@ -141,10 +168,15 @@ async function deleteUser(userId) {
return;
}
await fetchData();
// Remove user from UI
if (userElementsMap.has(userId)) {
userElementsMap.get(userId).remove();
userElementsMap.delete(userId);
}
}
async function redirectToMainMenu() {
await stopFetchingUsers();
await window.networkAPI.closeUcSocket();
fadeOut('main_menu');
}
+1 -1
View File
@@ -102,7 +102,7 @@ app.whenReady().then(async () => {
},
})
mainWindow.removeMenu()
//mainWindow.removeMenu()
await ensureDirectoryExists(pathToClientsBackups)