add change user data endpoint and in web

src/web/css/userstable.css

@@ -27,7 +27,7 @@ th {
     position: relative;
     border-radius: 10px;
     padding: 10px;
-    width: 16%;
+    width: 14%;
     text-overflow: auto;
     overflow-x: auto;
 }

src/web/index.html

@@ -60,6 +60,32 @@
         </form>
     </div>
 
+    <div class="form changeuserform">
+        <form class="formbody changeuserformbody">
+            <h1 class="loginformheader">Change User Data</h1>
+            <div class="loginforminputbody">
+                <div class="loginformlabel">Username</div>
+                <input type="text" required id="changeuserformusername" class="loginforminput">
+            </div>
+            <div class="loginforminputbody">
+                <div class="loginformlabel">Password</div>
+                <input type="password" id="changeuserformpassword" class="loginforminput">
+            </div>
+            <div class="loginforminputbody">
+                <div class="loginformlabel">Group</div>
+                <input type="text" required id="changeuserformgroup" class="loginforminput">
+            </div>
+            <div class="loginforminputbody">
+                <div class="loginformlabel">Is Superuser</div>
+                <input type="checkbox" id="changeuserformissuperuser" class="loginforminput">
+            </div>
+            <div class="loginforminputbody">
+                <button class="loginformbutton">Change</button>
+                <button class="cancelchangeuser loginformbutton">Cancel</button>
+            </div>
+        </form>
+    </div>
+
     <div class="form confirmform">
         <div class="formbody confirmformbody">
             <h1>Are you sure?</h1>
@@ -98,6 +124,7 @@
                 <th>is_superuser</th>
                 <th>delete</th>
                 <th>change password</th>
+                <th>change user data</th>
             </tr>
         </thead>
     </table>
@@ -114,5 +141,6 @@
     <script src="js/add_user.js"></script>
     <script src="js/del_user.js"></script>
     <script src="js/change_password.js"></script>
+    <script src="js/change_user.js"></script>
 </body>
 </html>

src/web/js/change_user.js

@@ -0,0 +1,57 @@
+const changeuserform = document.querySelector('.changeuserform')
+const changeuserformbody = document.querySelector('.changeuserformbody')
+const changeuserformusername = document.querySelector('#changeuserformusername')
+const changeuserformpassword = document.querySelector('#changeuserformpassword')
+const changeuserformgroup = document.querySelector('#changeuserformgroup')
+const changeuserformissuperuser = document.querySelector('#changeuserformissuperuser')
+const cancelchangeuser = document.querySelector(".cancelchangeuser")
+
+var changedatauserid = ""
+var userdata = ""
+
+const change_user_data = async (userid) => {
+    changeuserform.classList.add('active')
+    changedatauserid = userid
+    console.log(userid)
+    const all_users = await fetch(routes.all_users(), {
+        method: 'POST',
+        body: `{"token":"${localStorage.getItem('token')}"}`
+    }).then(data => data.json()).then(jsondata => jsondata).catch((error) => {
+        notification(`Ошибка на сервере: ${error}`, "error")
+    })
+    userdata = all_users.find(usr => usr.id === userid)
+    console.log(userdata)
+    changeuserformusername.value = userdata.username
+    changeuserformgroup.value = userdata.group
+    console.log(changeuserformissuperuser.checked)
+    changeuserformissuperuser.checked = userdata.is_superuser === "1"?true:false
+}
+
+cancelchangeuser.addEventListener('click', (e) => {
+    e.preventDefault()
+    changeuserform.classList.remove('active')
+})
+
+changeuserformbody.addEventListener('submit', async (e) => {
+    e.preventDefault()
+    var request = {
+        token: localStorage.getItem('token'),
+        userid: changedatauserid,
+        username: changeuserformusername.value,
+        is_superuser: changeuserformissuperuser.checked?"1":"0",
+        group: changeuserformgroup.value
+    }
+    if (changeuserformpassword.value !== "") {request = {...request, "password": changeuserformpassword.value}}
+    const status = await fetch(routes.change_user(), {
+        method: 'POST',
+        body: JSON.stringify(request)
+    }).then(data => data.json()).then(jsondata => jsondata).catch((error) => {
+        notification(`Ошибка на сервере: ${error}`, "error")
+    })
+    console.log(status)
+    if (status.status === "ok") {
+        notification("Данные пользователя успешно изменены", "success")
+        changeuserform.classList.remove('active')
+        get_all_users()
+    }
+})

src/web/js/del_user.js

@@ -13,6 +13,9 @@ userstablebody.addEventListener('click', e => {
     if (e.target.classList.contains('changepassword')) {
         change_password(e.target.id)
     }
+    if (e.target.classList.contains('changeuser')) {
+        change_user_data(e.target.id)
+    }
 })
 
 confirmformcancel.addEventListener('click', () => {

src/web/js/get_all_users.js

@@ -16,6 +16,7 @@ const get_all_users = async () => {
                 <th>${user.is_superuser}</th>
                 <th><button class="deleteuser thbutton" id="${user.id}">Delete</button></th>
                 <th><button class="changepassword thbutton" id="${user.id}">Change password</button></th>
+                <th><button class="changeuser thbutton" id="${user.id}">Change user data</button></th>
             </tr>    
         `
     }

src/web/js/routes.js

@@ -8,5 +8,6 @@ const routes = {
     access: () => [host, prefix, 'access'].join('/'),
     adduser: () => [host, prefix, 'users', 'add'].join('/'),
     deluser: () => [host, prefix, 'users', 'del'].join('/'),
-    change_password_url: () => [host, prefix, 'users', 'user', 'password', 'change'].join('/')
+    change_password_url: () => [host, prefix, 'users', 'user', 'password', 'change'].join('/'),
+    change_user: () => [host, prefix, 'users', 'user', 'change'].join('/')
 }