update added jwt tokens

web/js/login.js

@@ -0,0 +1,95 @@
+const loginform = document.querySelector("#loginform");
+const loginformbody = document.querySelector("#loginformbody");
+const loginforminputusername = document.querySelector(
+  "#loginforminputusername",
+);
+const loginforminputpassword = document.querySelector(
+  "#loginforminputpassword",
+);
+const exitbutton = document.querySelector("#exitbutton");
+const usernameheader = document.querySelector(".usernameheader");
+
+if (localStorage.getItem("token") === null) {
+  loginform.classList.add("active");
+}
+
+loginformbody.addEventListener("submit", (e) => {
+  e.preventDefault();
+  hashPassword(loginforminputpassword.value).then((hashedpassword) => {
+    login(loginforminputusername.value, hashedpassword);
+  });
+});
+
+const login = async (username, password) => {
+  const response = await fetch(routes.login(), {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+    },
+    body: `{"username":"${username}","password":"${password}"}`,
+  })
+    .then((data) => data.json())
+    .then((jsondata) => jsondata)
+    .catch((error) => {
+      if (error.message === "Unexpected end of JSON input") {
+        notification(
+          `Ошибка на сервере: Создайте файл users.json и запишите в него первого пользователя`,
+          "error",
+        );
+      } else {
+        notification(`Ошибка на сервере: ${error}`, "error");
+      }
+    });
+  if (response.error) {
+    loginforminputusername.classList.add("is-invalid");
+    loginforminputpassword.classList.add("is-invalid");
+    notification("Неправильный логин или пароль", "error");
+  }
+  if (response.token) {
+    notification("Успешно", "success");
+    loginform.classList.remove("active");
+    localStorage.setItem("token", response.token);
+    await get_user_data();
+    loginforminputusername.value = "";
+    loginforminputpassword.value = "";
+    loginforminputusername.classList.remove("is-invalid");
+    loginforminputpassword.classList.remove("is-invalid");
+  }
+};
+
+const get_user_data = async () => {
+  const response = await fetch(routes.user(), {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+    },
+    body: `{"token":"${localStorage.getItem("token")}"}`,
+  })
+    .then((data) => data.json())
+    .then((jsondata) => jsondata)
+    .catch((error) => {
+      notification(`Ошибка на сервере: ${error}`, "error");
+    });
+  if (response.is_superuser) {
+    await get_all_users();
+    usernameheader.innerHTML = response.username;
+  } else {
+    document.querySelector("#alluserstablebody").innerHTML = "";
+    loginform.classList.add("active");
+    notification(
+      "Вы не можете войти потому что не являетесь администратором",
+      "error",
+    );
+    localStorage.clear();
+  }
+  if (response.id) {
+    localStorage.setItem("userdata", JSON.stringify(response));
+  }
+};
+
+exitbutton.addEventListener("click", () => {
+  localStorage.removeItem("token");
+  localStorage.removeItem("userdata");
+  loginform.classList.add("active");
+  notification("Вы вышли", "success");
+});