Complete JavaScript for Invite function

modules/public/users.py

@@ -20,6 +20,15 @@ class users:
         user_validation = procedure_validation.validation().account(APIADDR, allowed_roles)
         user            = user_validation['data']
 
+        allowed_grant 	= globalvar.allowed_grant
+        allow		= list({
+            row
+            for role in user["profile"]["roles"]
+            for grant in allowed_grant
+            if grant["roles"] == role
+            for row in grant["allowed"]
+        })
+
         return Template(params["mako"]["website"]['index']).render(
             title	= globalvar.title,
             header	= globalvar.header,
@@ -32,6 +41,7 @@ class users:
                 copyright	= globalvar.copyright,
             ),
             container	= Template(params["mako"]["website"]['container']).render(
-                token       = user['token']
+                token       = user['token'],
+                allow       = allow
             )
         )

pages/public/users.html

@@ -1,4 +1,5 @@
 <input type="hidden" id="form-token" value="${token}">
+<input type="hidden" id="form-allow" value="${allow}">
 
 <h2>Invitation</h2>
 

static/js/users.js

@@ -1,4 +1,30 @@
+function flushResponse() {
+  document.getElementById("alert-response"  ).style.display = 'none';
+  document.getElementById("alert-response"  ).classList.remove('alert-success'  );
+  document.getElementById("alert-response"  ).classList.remove('alert-danger'   );
+  document.getElementById("alert-response"  ).classList.remove('alert-primary'  );
+}
+
+function loadingResponse() {
+  flushResponse();
+  document.getElementById("alert-status"  ).innerHTML = "Loading...";
+  document.getElementById("alert-desc"    ).innerHTML = "Please wait...";
+  document.getElementById("alert-response").classList.add('alert-primary');
+  document.getElementById("alert-response").style.display = 'block';
+}
+
+function responseAlert(response) {
+  flushResponse();
+  const obj = JSON.parse(response);
+  if (obj.status == "success" ) document.getElementById("alert-response").classList.add('alert-success' );
+  if (obj.status == "failed"  ) document.getElementById("alert-response").classList.add('alert-danger'  );
+  document.getElementById("alert-status"  ).innerHTML     = obj.status;
+  document.getElementById("alert-desc"    ).innerHTML     = obj.desc;
+  document.getElementById("alert-response").style.display = 'block';
+}
+
 var token    		= document.getElementById("form-token"      ).value;
+var allow    		= document.getElementById("form-allow"      ).value;
 const listerUser	= document.getElementById("lister-user"		);
 const listerRoles	= document.getElementById("lister-roles"	);
 
@@ -43,28 +69,39 @@ sendHttpRequest("/api/auth/roles/list", "POST", null,
 
             ls.data.forEach(row => {
                 const itemElement = document.createElement("div");
+                if (allow.includes(row.id)) {
                     itemElement.innerHTML = `<label><input type="checkbox" name="roles" value="${row.id}">${row.name}</label>`;
                     listerRoles.appendChild(itemElement);
+                } else {}
             });
         }
     }, "application/json", `Bearer ${token}`
 );
 
 function invite() {
-    const checkedRoles = Array
+    const 	roles 		= Array
           .from(document.querySelectorAll('input[name="roles"]:checked'))
-          .map(cb => Number(cb.value)); // Convert into number
+          .map(row => Number(row.value)); // Convert into number. Output example: [2, 3]
     const 	email    	= document.getElementById('form-email').value;
     const 	username	= document.getElementById('form-username').value;
     const 	password	= document.getElementById('form-password').value;
-
+    var 	url     	= "/api/auth/invite";
-    console.log({
+    var 	payload 	= {
-        email,
+        "roles"		: roles,
-        username,
+        "email"		: email,
-        password,
+        "username"	: username,
-        roles: checkedRoles // Example: [2, 3]
+        "password"	: password
-    });
+    };
-
+    // console.log(payload);
-    // Next command here
+    sendHttpRequest(url, "POST", payload, function (error, response) {
+        if (error) {
+            // console.error("Error:", error);
+            responseAlert({"status" : "failed", "desc" : error});
+        }
+        else {
+            // console.log("JSON Response:", response);
+            responseAlert(response);
+        }
+    }, "application/json", `Bearer ${token}`);
 }