Updated Login and User Management with new materialize and controls

client/Accounts/UserMgmt/userInfoModal.html

@@ -1,8 +1,9 @@
 <template name="userInfoModal">
     <div id="userInfoModal" class="modal modal-fixed-footer">
         <div class="modal-content">
+            <h4>User Info for: {{userInfo.profile.fullname}}</h4>
             <div>
-                <h4>Password Reset</h4>
+                <p class="flow-text">Password Reset</p>
             </div>
             <form class="row" style="gap: 1em;">
                 <div class="col s12 m6 l6 input-field outlined">
@@ -14,11 +15,31 @@
                     <label for="newPassConf">Enter New Password</label>
                     {{#if $eq passMatch false}}<p class="red-text">Passwords do not match!</p>{{/if}}
                 </div>
+                <div class="col s12 m6 l6 input-field outlined">
+                    <select name="userRole" id="userRole" class="userRole {{#if $eq roleEmpty true}}red lighten-2 white-text{{/if}}">
+                        <option value="{{userRole}}" selected>{{userRole}}</option>
+                        <option value="admin">Admin</option>
+                        <option value="systemadmin">System Admin</option>
+                        <option value="user">User</option>
+                    </select>
+                    <label for="userRole">User Role</label>
+                    {{#if $eq roleEmpty true}}
+                    <p class="red-text">This field is required.</p>
+                    {{/if}}
+                </div>
+                <div class="col s12 m6 l6 input-field outlined">
+                    <input type="text" class="usersEmail" id="usersEmail" value="{{userInfo.emails.[0].address}}"/>
+                    <label for="usersEmail">Email</label>
+                    {{#if $eq emailEmpty true}}
+                    <p class="red-text">This field is required.</p>
+                    {{/if}}
+                </div>
             </form>
         </div>
         <div class="modal-footer">
             <a class="modal-close btn waves-effect waves-light filled orange white-text">Cancel</a>
-            <a id="chPass" class="btn waves-effect waves-light filled green white-text modal-close">Change Password</a>
+            <a id="saveChanges" class="btn waves-effect waves-light filled green white-text">Save Changes</a>
         </div>
     </div>
+    {{> snackbar}}
 </template>

client/Accounts/UserMgmt/userInfoModal.js

@@ -1,39 +1,105 @@
 import { M } from '../../lib/assets/materialize.js';
 
 Template.userInfoModal.onCreated(function() {
-
+    this.subscribe("rolesAvailable");
 });
 
 Template.userInfoModal.onRendered(function() {
     Session.set("passMatch", true);
     Session.set("passErr", false);
-    var elems = document.querySelectorAll('.modal');
-    var instances = M.Modal.init(elems, {});
+    Session.set("userEmailErr", false);
+    Session.set("userRoleErr", false);
+
+    Meteor.setTimeout(() => {
+        var elems = document.querySelectorAll('.modal');
+        var instances = M.Modal.init(elems, {});
+
+        var elemse = document.querySelectorAll('select');
+        var instancese = M.FormSelect.init(elemse, {});
+    }, 350);
 });
 
 Template.userInfoModal.helpers({
     passMatch: function() {
         return Session.get("passMatch");
+    },
+    emailEmpty: function() {
+        return Session.get("userEmailErr");
+    },
+    roleEmpty: function() {
+        return Session.get("userRoleErr");
+    },
+    userInfo: function() {
+        let usersId = Session.get("usersId");
+        if (usersId != "" && usersId != null) {
+            let usersInfo = Meteor.users.findOne({ _id: usersId });
+            // console.dir(usersInfo);
+            Session.set("usersInfo", usersInfo);
+            return usersInfo;
+        } else {
+            return;
+        }
+    },
+    userRole: function() {
+        let userRole = Roles.getRolesForUser( Session.get("usersId"));
+        Session.set("usersRole", userRole);
+        console.log(userRole);
+        return userRole;
+    },
+    rolesOptions: function() {
+        return Roles.find();
     }
 });
 
 Template.userInfoModal.events({
-    "click #chPass" (event) {
+    "click #saveChanges" (event) {
         event.preventDefault();
         let usersId = Session.get("usersId");
         let passwd = $("#newPass").val();
+        let usersEmail = $("#usersEmail").val();
+        let userRole = $("#userRole").val();
+        let userInfo = Session.get("usersInfo");
+
+        let currEmail = userInfo.emails[0].address;
+        let userDbRole = Session.get("usersRole");
+
+        let currRole = userDbRole[0];
+
         let passMatch = Session.get("passMatch");
-        if (passwd == null || passwd == "" || passMatch == false) {
+        if (passMatch == false) {
             Session.set("passErr", true);
             return;
         } else {
-            Meteor.call('change.userPass', usersId, passwd, function(err, result) {
-                if (err) {
-                    console.log("    ERROR changing user passwrod:" + err);
-                } else {
-                    console.log("    Password changed successfully!");
-                }
-            });
+            Session.set("passErr", false);
+        }
+        
+        if (usersEmail == null || usersEmail == "") {
+            Session.set("userEmailErr", true);
+            return;
+        } else {
+            Session.set("userEmailErr", false);
+        }
+        
+        if (userRole == null || userRole == "") {
+            Session.set("userRoleErr", true);
+            return;
+        } else {
+            Session.set("userRoleErr", false);
+        }
+        
+        if (passMatch == true || passMatch == "NA") {
+            if (passwd != "" && passwd != null) {
+                // need to account for the admin changing passwords and userRole or Email
+                changePassword(usersId, passwd);
+            }
+            
+            if (usersEmail != null && usersEmail != "" && usersEmail != currEmail) {
+                changeUserEmail(usersId, usersEmail);
+            }
+
+            if (userRole != null && userRole != "" && userRole != currRole) {
+                changeUserRole(usersId, userRole);
+            }
         }
     },
     "click #closePass" (event) {;
@@ -50,4 +116,38 @@ Template.userInfoModal.events({
             }
         }
     }
-});
+});
+
+changePassword = function(userId, passwd) {
+    console.log("would change password.");
+    Meteor.call('edit.userPass', userId, passwd, function(err, result) {
+        if (err) {
+            console.log("    ERROR changing user passwrod:" + err);
+        } else {
+            showSnackbar("Successfully Saved Changes!", "green");
+            console.log("    Password changed successfully!");
+        }
+    });
+}
+
+changeUserEmail = function(usersId, usersEmail) {
+    console.log("Would change user email");
+    Meteor.call('update.userEmail', usersId, usersEmail, function(err, result) {
+        if (err) {
+            console.log("    ERROR updating user email: " + err);
+        } else {
+            showSnackbar("Email updated successfully!", "green");
+        }
+    });
+}
+
+changeUserRole = function(userId, role) {
+    console.log("Would change user Role.");
+    Meteor.call('edit.userRole', userId, role, function(err, result) {
+        if (err) {
+            console.log("    ERROR updating user role: " + err);
+        } else {
+            showSnackbar("Role Successfully Updated!", "green");
+        }
+    });
+}

client/Accounts/UserMgmt/userMgmt.js

@@ -30,16 +30,12 @@ Template.userMgmt.helpers({
 Template.userMgmt.events({
     "click .editUser" (event) {
         event.preventDefault();
-
         let userId = this._id;
-        // take action
         Session.set("usersId", userId);
     },
     "click .deleteUser" (event) {
         event.preventDefault();
-        
         let userId = this._id;
-        // take action
         console.log("Delete called on : " + userId);
         Session.set("deleteId", userId);
         Session.set("item", "User");