diff --git a/data/test.db b/data/test.db index 6632317d0cb45ca56b798a9830c7a18f68b98d9d..7be481e590a39fba8ed2fbafb68d5dce01950b3c 100644 Binary files a/data/test.db and b/data/test.db differ diff --git a/web/components/navbar/navbar.js b/web/components/navbar/navbar.js index f558982cea37e2e1147542e68a73b938cca22e53..98229b691b1afff8b361c05d332afd86864c620d 100644 --- a/web/components/navbar/navbar.js +++ b/web/components/navbar/navbar.js @@ -52,11 +52,8 @@ export async function CreateMenu() { ? `` : /* HTML */ ` <a class="navbar-item" href="#home"><i class="navbar-menu-icon fas fa-home"></i>Accueil</a> - ${user.role == "CLIENT" ? /* HTML */ ` <a class="navbar-item" href="#client"><i class="navbar-menu-icon fas fa-money-check"></i>Mes comptes</a> ` : ""} - ${user.role == "BANKER" ? /* HTML */ ` <a class="navbar-item" href="#banker"><i class="navbar-menu-icon fas fa-university"></i>Mes Clients</a> ` : ""} ${user.role == "ADMIN" ? /* HTML */ ` - <a class="navbar-item" href="#banker"><i class="navbar-menu-icon fas fa-university"></i>Mes Clients</a> <a class="navbar-item" href="#users"><i class="navbar-menu-icon fas fa-users"></i>Utilisateurs</a> ` : ""} diff --git a/web/components/users/handleBanker.js b/web/components/users/handleBanker.js deleted file mode 100644 index cb3a0ec438693ff6af1ef0f64ae7887833cfa8c7..0000000000000000000000000000000000000000 --- a/web/components/users/handleBanker.js +++ /dev/null @@ -1,134 +0,0 @@ -// Imports -import * as Messages from "/services/messages/messages.js"; -import * as Auth from "/services/auth/auth.js"; -import * as Users from "/components/users/users.js"; - -// DOM elements -let name_field; -let banker_name_field; -let banker_id_field; - -// local variables -let current_user; -let update_banker; -let user_id; - -export async function mount(where, parent) { - const handleBanker = new HandleBanker(parent); - await handleBanker.mount(where); - handleBanker.handleDom(); - return handleBanker; -} - -class HandleBanker { - constructor(parent) { - this.parent = parent; - } - - async mount(where) { - document.getElementById(where).innerHTML = /* HTML */ ` - <div class="modal-background"></div> - <div class="modal-card" id="banker-modal-card"> - <header class="modal-card-head"> - <p class="modal-card-title">Ajout/Supression d'un banquier</p> - <button class="delete" aria-label="close" id="banker-modal-close"></button> - </header> - <section class="modal-card-body"> - <div class="field"> - <label>Id</label> - <div class="control"> - <input class="input" type="number" id="banker-modal-id" disabled /> - </div> - </div> - <div class="field"> - <label>Nom</label> - <div class="control"> - <input class="input" type="text" id="banker-modal-name" /> - </div> - </div> - </section> - <footer class="modal-card-foot"> - <button id="banker-modal-save" class="button is-success">Sauvegarder</button> - <button id="banker-modal-cancel" class="button">Annuler</button> - </footer> - </div> - `; - current_user = await Auth.GetUser(); - } - - handleDom() { - name_field = document.getElementById("users-modal-name"); - banker_id_field = document.getElementById("banker-modal-id"); - banker_name_field = document.getElementById("banker-modal-name"); - - document.getElementById(`banker-modal-close`).addEventListener("click", function () { - Users.toggleModal("banker-modal", "banker-modal-card"); - }); - document.getElementById(`banker-modal-cancel`).addEventListener("click", function () { - Users.toggleModal("banker-modal", "banker-modal-card"); - }); - let bankerHandler = this - document.getElementById(`banker-modal-save`).addEventListener("click", function () { - bankerHandler.postBanker(); - }); - } - - async editBanker(banker) { - update_banker = true; - banker_id_field.value = banker.ID; - banker_name_field.value = banker.Name; - Users.toggleModal("banker-modal", "banker-modal-card"); - } - - async newBanker(userID) { - update_banker = false; - user_id = userID; - banker_name_field.value = name_field.value; - Users.toggleModal("banker-modal", "banker-modal-card"); - } - - async deleteBanker(banker) { - try { - const response = await fetch("/api/UserBankers/" + banker.ID, { - method: "delete", - headers: new Headers({ - "XSRF-Token": current_user.xsrftoken, - }), - }); - if (response.status !== 200) { - throw new Error(`Banker could not be deleted (status ${response.status})`); - } - } catch (e) { - Messages.Show("is-warning", e.message); - console.error(e); - } - } - - async postBanker() { - let method; - if (update_banker) method = "PUT"; - else method = "POST"; - - try { - const response = await fetch("/api/UserBankers/" + banker_id_field.value, { - method: method, - headers: new Headers({ - "XSRF-Token": current_user.xsrftoken, - }), - body: JSON.stringify({ - ID: parseInt(banker_id_field.value), - Name: banker_name_field.value, - UserID: parseInt(user_id), - }), - }); - if (response.status !== 200) { - throw new Error(`Banker could not be updated (status ${response.status})`); - } - this.parent.displayUsers(); - } catch (e) { - Messages.Show("is-warning", e.message); - console.error(e); - } - Users.toggleModal("banker-modal", "banker-modal-card"); - } -} diff --git a/web/components/users/handleClient.js b/web/components/users/handleClient.js deleted file mode 100644 index 9a125f9e7a77df31df2d03416f2ba1769cb2a283..0000000000000000000000000000000000000000 --- a/web/components/users/handleClient.js +++ /dev/null @@ -1,177 +0,0 @@ -// Imports -import * as Messages from "/services/messages/messages.js"; -import * as Auth from "/services/auth/auth.js"; -import * as Users from "/components/users/users.js"; - -// DOM elements -let name_field; -let client_id_field; -let client_name_field; -let client_bankerID_field; - -// local variables -let current_user; -let bankers = []; -let update_client; -let user_id; - -export async function mount(where, parent) { - const handleClient = new HandleClient(parent); - await handleClient.mount(where); - handleClient.handleDom(); - return handleClient; -} - -class HandleClient { - constructor(parent) { - this.parent = parent; - } - - async mount(where) { - document.getElementById(where).innerHTML = /* HTML */ ` - <div class="modal-background"></div> - <div class="modal-card" id="client-modal-card"> - <header class="modal-card-head"> - <p class="modal-card-title">Ajout/Édition d'un client</p> - <button class="delete" aria-label="close" id="client-modal-close"></button> - </header> - <section class="modal-card-body"> - <div class="field"> - <label>Id</label> - <div class="control"> - <input class="input" type="number" id="client-modal-id" disabled /> - </div> - </div> - <div class="field"> - <label>Nom</label> - <div class="control"> - <input class="input" type="text" id="client-modal-name" /> - </div> - </div> - <div class="field" id="users-modal-role-container"> - <label>Banquier</label><br /> - <div class="control select"> - <select name="banker" id="client-modal-banker-id"> </select> - </div> - </div> - </section> - <footer class="modal-card-foot"> - <button id="client-modal-save" class="button is-success">Sauvegarder</button> - <button id="client-modal-cancel" class="button">Annuler</button> - </footer> - </div> - `; - current_user = await Auth.GetUser(); - } - - handleDom() { - name_field = document.getElementById("users-modal-name"); - client_id_field = document.getElementById("client-modal-id"); - client_name_field = document.getElementById("client-modal-name"); - client_bankerID_field = document.getElementById("client-modal-banker-id"); - - document.getElementById(`client-modal-close`).addEventListener("click", function () { - Users.toggleModal("client-modal", "client-modal-card"); - }); - document.getElementById(`client-modal-cancel`).addEventListener("click", function () { - Users.toggleModal("client-modal", "client-modal-card"); - }); - let clientHandler = this; - document.getElementById(`client-modal-save`).addEventListener("click", function () { - clientHandler.postClient(); - }); - } - - async editClient(client) { - await this.refreshBankers(); - update_client = true; - client_id_field.value = client.ID; - client_name_field.value = client.Name; - client_bankerID_field.value = client.UserBankerID; - Users.toggleModal("client-modal", "client-modal-card"); - } - - async newClient(userID) { - await this.refreshBankers(); - update_client = false; - user_id = userID; - console.log(user_id) - client_name_field.value = name_field.value; - client_bankerID_field.value = 0; - Users.toggleModal("client-modal", "client-modal-card"); - } - - async deleteClient(client) { - try { - const response = await fetch("/api/UserClients/" + client.ID, { - method: "delete", - headers: new Headers({ - "XSRF-Token": current_user.xsrftoken, - }), - }); - if (response.status !== 200) { - throw new Error(`Client could not be deleted (status ${response.status})`); - } - } catch (e) { - Messages.Show("is-warning", e.message); - console.error(e); - } - } - - async refreshBankers() { - const response = await fetch("/api/UserBankers/", { - method: "GET", - headers: new Headers({ - "XSRF-Token": current_user.xsrftoken, - }), - }); - if (response.status !== 200) { - throw new Error(`Users could not be updated (status ${response.status})`); - } - bankers = await response.json(); - - for (let i = client_bankerID_field.options.length - 1; i >= 0; i--) { - client_bankerID_field.remove(i); - } - - let el = document.createElement("option"); - el.textContent = "Veuillez sélectionner un banquier"; - el.value = 0; - client_bankerID_field.appendChild(el); - bankers.forEach((banker) => { - el = document.createElement("option"); - el.textContent = banker.Name; - el.value = banker.ID; - client_bankerID_field.appendChild(el); - }); - } - - async postClient() { - let method; - if (update_client) method = "PUT"; - else method = "POST"; - - try { - const response = await fetch("/api/UserClients/" + client_id_field.value, { - method: method, - headers: new Headers({ - "XSRF-Token": current_user.xsrftoken, - }), - body: JSON.stringify({ - ID: parseInt(client_id_field.value), - UserID: parseInt(user_id), - Name: client_name_field.value, - UserBankerID: parseInt(client_bankerID_field.value), - }), - }); - if (response.status !== 200) { - throw new Error(`Client could not be updated (status ${response.status})`); - } - this.parent.displayUsers(); - } catch (e) { - Messages.Show("is-warning", e.message); - console.error(e); - } - Users.toggleModal("client-modal", "client-modal-card"); - } -} diff --git a/web/components/users/handleUser.js b/web/components/users/handleUser.js index 712cd8c8b5179afc88f07fec0f63eb68c1d9e21d..3626f1ace1f08a224b4d5304b3a8f4abb35a342a 100644 --- a/web/components/users/handleUser.js +++ b/web/components/users/handleUser.js @@ -8,10 +8,8 @@ import * as Users from "/components/users/users.js"; let id_field; let idOAuth_field; let login_field; -let displayName_field; let password_field; let name_field; -let surname_field; let role_field; // local variables @@ -36,7 +34,11 @@ class HandleUser { <div class="modal-card" id="users-modal-card"> <header class="modal-card-head"> <p class="modal-card-title">Ajout/modification d'un utilisateur</p> - <button class="delete" aria-label="close" id="users-modal-close"></button> + <button + class="delete" + aria-label="close" + id="users-modal-close" + ></button> </header> <section class="modal-card-body"> <div class="field"> @@ -69,31 +71,21 @@ class HandleUser { <input class="input" type="text" id="users-modal-name" /> </div> </div> - <div class="field" id="users-modal-name-container"> - <label>Nom complet</label> - <div class="control"> - <input class="input" type="text" id="users-modal-displayName" /> - </div> - </div> - <div class="field" id="users-modal-surname-container"> - <label>Surnom</label> - <div class="control"> - <input class="input" type="text" id="users-modal-surname" /> - </div> - </div> <div class="field" id="users-modal-role-container"> <label>Rôle</label><br /> <div class="control select"> <select name="role" id="users-modal-role"> - <option value="CLIENT">Client</option> - <option value="BANKER">Banquier</option> + <option value="VISUALIZER">Visualiseur</option> + <option value="CAPTURER">Saisisseur</option> <option value="ADMIN">Administrateur</option> </select> </div> </div> </section> <footer class="modal-card-foot"> - <button id="users-modal-save" class="button is-success">Sauvegarder</button> + <button id="users-modal-save" class="button is-success"> + Sauvegarder + </button> <button id="users-modal-cancel" class="button">Annuler</button> </footer> </div> @@ -106,21 +98,25 @@ class HandleUser { idOAuth_field = document.getElementById("users-modal-idoauth"); login_field = document.getElementById("users-modal-login"); password_field = document.getElementById("users-modal-password"); - displayName_field = document.getElementById("users-modal-displayName"); name_field = document.getElementById("users-modal-name"); - surname_field = document.getElementById("users-modal-surname"); role_field = document.getElementById("users-modal-role"); - document.getElementById(`users-modal-close`).addEventListener("click", function () { - Users.toggleModal("users-modal", "users-modal-card"); - }); - document.getElementById(`users-modal-cancel`).addEventListener("click", function () { - Users.toggleModal("users-modal", "users-modal-card"); - }); + document + .getElementById(`users-modal-close`) + .addEventListener("click", function () { + Users.toggleModal("users-modal", "users-modal-card"); + }); + document + .getElementById(`users-modal-cancel`) + .addEventListener("click", function () { + Users.toggleModal("users-modal", "users-modal-card"); + }); let userHandler = this; - document.getElementById(`users-modal-save`).addEventListener("click", function () { - userHandler.postUser(); - }); + document + .getElementById(`users-modal-save`) + .addEventListener("click", function () { + userHandler.postUser(); + }); document.getElementById(`users-new`).addEventListener("click", function () { userHandler.newUser(); }); @@ -132,8 +128,6 @@ class HandleUser { login_field.value = ""; password_field.value = RandomString(48); name_field.value = ""; - displayName_field.value = ""; - surname_field.value = ""; role_field.value = ""; Users.toggleModal("users-modal", "users-modal-card"); } @@ -147,19 +141,18 @@ class HandleUser { }), }); if (response.status !== 200) { - throw new Error(`User could not be deleted (status ${response.status})`); + throw new Error( + `User could not be deleted (status ${response.status})` + ); } document.getElementById(`users-user-${user.id}`).remove(); } catch (e) { Messages.Show("is-warning", e.message); console.error(e); } - if (user.role == "BANKER") { - let banker = await this.getBankerByUserID(user.id); - if (banker != undefined) this.parent.HandleBanker.deleteBanker(banker); - } else if (user.role == "CLIENT") { - let client = await Auth.getClientByUserID(user.id, current_user); - if (client != undefined) this.parent.HandleClient.deleteClient(client); + if (user.role == "CAPTURER") { + let capturer = await Auth.getCapturerByUserID(user.id, current_user); + if (capturer != undefined) await this.deleteCapturer(capturer); } } @@ -171,8 +164,6 @@ class HandleUser { login_field.value = user.login; password_field.value = ""; name_field.value = user.name; - displayName_field.value = user.displayName; - surname_field.value = user.surname; role_field.value = user.role; Users.toggleModal("users-modal", "users-modal-card"); } @@ -186,7 +177,9 @@ class HandleUser { }), }); if (response.status !== 200) { - throw new Error(`Users could not be fetched (status ${response.status})`); + throw new Error( + `Users could not be fetched (status ${response.status})` + ); } return await response.json(); } catch (e) { @@ -195,26 +188,6 @@ class HandleUser { } } - async getBankerByUserID(userID) { - let bankerToSend = undefined; - const response = await fetch("/api/UserBankers/", { - method: "GET", - headers: new Headers({ - "XSRF-Token": current_user.xsrftoken, - }), - }); - if (response.status !== 200) { - throw new Error(`Could not get bankers (status ${response.status})`); - } - let bankers = await response.json(); - bankers.forEach((banker) => { - if (banker.UserID == userID) { - bankerToSend = banker; - } - }); - return bankerToSend; - } - async postUser() { let method; if (update_user) method = "PUT"; @@ -222,7 +195,10 @@ class HandleUser { try { if (role_field.value == "") { - Messages.Show("is-warning", "Veuillez choisir un rôle pour l'utilisateur"); + Messages.Show( + "is-warning", + "Veuillez choisir un rôle pour l'utilisateur" + ); return; } const response = await fetch("/api/admin/users/" + id_field.value, { @@ -235,27 +211,69 @@ class HandleUser { login: login_field.value, password: password_field.value, name: name_field.value, - surname: surname_field.value, role: role_field.value, }), }); if (response.status !== 200) { - throw new Error(`User could not be updated or created (status ${response.status})`); + throw new Error( + `User could not be updated or created (status ${response.status})` + ); } let user = await response.json(); - if (user.role == "BANKER") { - let banker = await this.getBankerByUserID(user.id); - if (banker != undefined) this.parent.HandleBanker.editBanker(banker); - else this.parent.HandleBanker.newBanker(user.id); - } else if (user.role == "CLIENT") { - let client = await Auth.getClientByUserID(user.id, current_user); - if (client != undefined) this.parent.HandleClient.editClient(client); - else this.parent.HandleClient.newClient(user.id); - } else this.parent.displayUsers(); + if (user != undefined && user.role == "CAPTURER") + await this.postCapturer(user, method); + this.parent.displayUsers(); } catch (e) { Messages.Show("is-warning", e.message); console.error(e); } Users.toggleModal("users-modal", "users-modal-card"); } + + async postCapturer(user, method) { + let capturer; + if (method === "PUT") capturer = await Auth.getCapturerByUserID(user.id, current_user); + else capturer = {}; + console.log(capturer) + try { + const response = await fetch("/api/Capturer/" + capturer.ID, { + method: method, + headers: new Headers({ + "XSRF-Token": current_user.xsrftoken, + }), + body: JSON.stringify({ + ID: capturer.ID, + UserID: user.id, + Name: user.name, + }), + }); + if (response.status !== 200) { + throw new Error( + `Capturer could not be deleted (status ${response.status})` + ); + } + } catch (e) { + Messages.Show("is-warning", e.message); + console.error(e); + } + } + + async deleteCapturer(capturer) { + try { + const response = await fetch("/api/Capturer/" + capturer.ID, { + method: "delete", + headers: new Headers({ + "XSRF-Token": current_user.xsrftoken, + }), + }); + if (response.status !== 200) { + throw new Error( + `Capturer could not be deleted (status ${response.status})` + ); + } + } catch (e) { + Messages.Show("is-warning", e.message); + console.error(e); + } + } } diff --git a/web/components/users/users.js b/web/components/users/users.js index d48a913c189cdc180bf77424ba56bca61053a710..7be58a02d5f22dd40fe6a7d0b5be277089763436 100644 --- a/web/components/users/users.js +++ b/web/components/users/users.js @@ -3,8 +3,6 @@ import { AnimateCSS } from "/services/common/common.js"; import * as Auth from "/services/auth/auth.js"; import { Delete } from "/services/common/delete.js"; import * as HandleUser from "/components/users/handleUser.js"; -import * as HandleBanker from "/components/users/handleBanker.js"; -import * as HandleClient from "/components/users/handleClient.js"; // DOM elements @@ -30,9 +28,7 @@ class Users { <th>Id</th> <th>IdOAuth</th> <th>Identifiant</th> - <th>Nom complet</th> <th>Nom</th> - <th>Surnom</th> <th>Rôle</th> <th>Actions</th> </tr> @@ -47,15 +43,9 @@ class Users { </button> <div class="modal" id="users-modal"></div> - - <div class="modal" id="banker-modal"></div> - - <div class="modal" id="client-modal"></div> `; current_user = await Auth.GetUser(); this.HandleUser = await HandleUser.mount("users-modal", this); - this.HandleBanker = await HandleBanker.mount("banker-modal", this); - this.HandleClient = await HandleClient.mount("client-modal", this); await this.displayUsers(); } @@ -77,7 +67,7 @@ class Users { } cleanUser(user) { - let props = ["password", "name", "surname", "memberOf", "displayName"]; + let props = ["password", "name", "role"]; for (const prop of props) { user[prop] = user[prop] === undefined ? "" : user[prop]; } @@ -90,9 +80,7 @@ class Users { <td>${user.id}</td> <td>${user.idOAuth}</td> <td>${user.login}</td> - <td>${user.displayName == undefined ? "" : user.displayName}</td> <td>${user.name}</td> - <td>${user.surname}</td> <td>${user.role}</td> <td> <a id="users-user-edit-${user.id}" class="button is-link is-small"> diff --git a/web/main.js b/web/main.js index 947158044d8dd777ec93c9afede7882edbcd1d96..552aa2f30d1eec6aa2076cdfcc5cc35c639226fb 100644 --- a/web/main.js +++ b/web/main.js @@ -1,7 +1,5 @@ import * as Home from "/components/home/home.js"; import * as Users from "/components/users/users.js"; -import * as Client from "/components/clientPage/clientPage.js"; -import * as Banker from "/components/bankerPage/bankerPage.js"; import * as Login from "/components/login/login.js"; import * as Navbar from "/components/navbar/navbar.js"; import { AnimateCSS } from "/services/common/common.js"; @@ -10,7 +8,7 @@ const mountPoint = document.getElementById("main"); const spinner = document.getElementById("spinner"); let sysInfoInterval; -document.addEventListener("DOMContentLoaded", function() { +document.addEventListener("DOMContentLoaded", function () { Navbar.mount("navbar"); window.addEventListener("hashchange", navigate); navigate(); @@ -20,27 +18,17 @@ async function navigate() { clearInterval(sysInfoInterval); switch (location.hash) { case "#home": - load(mountPoint, async function() { + load(mountPoint, async function () { await Home.mount("main"); }); break; case "#users": - load(mountPoint, async function() { + load(mountPoint, async function () { await Users.mount("main"); }); break; - case "#client": - load(mountPoint, async function() { - await Client.mount("main"); - }); - break; - case "#banker": - load(mountPoint, async function() { - await Banker.mount("main"); - }); - break; case "#login": - load(mountPoint, async function() { + load(mountPoint, async function () { await Login.mount("main"); }); break; @@ -51,13 +39,13 @@ async function navigate() { } async function load(element, domAlteration) { - AnimateCSS(element, "fadeOut", async function() { + AnimateCSS(element, "fadeOut", async function () { element.classList.add("is-hidden"); spinner.classList.remove("is-hidden"); AnimateCSS(spinner, "fadeIn"); if (typeof domAlteration === "function") { await domAlteration(); - AnimateCSS(spinner, "fadeOut", function() { + AnimateCSS(spinner, "fadeOut", function () { spinner.classList.add("is-hidden"); }); element.classList.remove("is-hidden"); diff --git a/web/services/auth/auth.js b/web/services/auth/auth.js index ffe80d77a498377593309322506fcb0346faf28a..543e1c05332d2eb888b0490dee3104577e948ccb 100644 --- a/web/services/auth/auth.js +++ b/web/services/auth/auth.js @@ -22,22 +22,22 @@ export async function GetUser() { } } -export async function getClientByUserID(userID, current_user) { - let clientToSend = undefined; - const response = await fetch("/api/UserClients/", { +export async function getCapturerByUserID(userID, current_user) { + let capturerToSend = undefined; + const response = await fetch("/api/Capturer/", { method: "GET", headers: new Headers({ "XSRF-Token": current_user.xsrftoken, }), }); if (response.status !== 200) { - throw new Error(`Could not get clients (status ${response.status})`); + throw new Error(`Could not get capturer (status ${response.status})`); } - let clients = await response.json(); - clients.forEach((client) => { - if (client.UserID == userID) { - clientToSend = client; + let capturers = await response.json(); + capturers.forEach((capturer) => { + if (capturer.UserID == userID) { + capturerToSend = capturer; } }); - return clientToSend; + return capturerToSend; } diff --git a/web/services/common/delete.js b/web/services/common/delete.js index a8a3cdf0e14f79c9bacd53db91e6f7d9f4de5dd0..6896ece87907a5470c1e07ac03297f4454a5e443 100644 --- a/web/services/common/delete.js +++ b/web/services/common/delete.js @@ -10,17 +10,17 @@ export class Delete { <div class="modal-content"> <div class="box" style="margin: 2rem;"> <div class="field"> - <label class="label">Confirm</label> + <label class="label">Confirmation</label> </div> <div class="field is-grouped"> <div class="control"> <button id="delete-ok" class="button is-danger"> - <span class="icon"><i class="fas fa-check"></i></span><span>Delete</span> + <span class="icon"><i class="fas fa-check"></i></span><span>Supprimer</span> </button> </div> <div class="control"> <button id="delete-cancel" class="button"> - <span class="icon"><i class="fas fa-times-circle"></i></span><span>Cancel</span> + <span class="icon"><i class="fas fa-times-circle"></i></span><span>Annuler</span> </button> </div> </div>