Adding role creation UI

4.x.x
dilanua 8 years ago
parent 746a4d4372
commit 934c45cd95

@ -15,10 +15,10 @@
specific language governing permissions and limitations specific language governing permissions and limitations
under the License. under the License.
}} }}
<!-- content/body --> <!-- content/body -->
<div class="row"> <div class="row">
<div class="col-md-12"> <div class="col-md-12">
<!-- content --> <!-- content -->
<div id="role-create-form" class="container col-centered wr-content"> <div id="role-create-form" class="container col-centered wr-content">
<div class="wr-form"> <div class="wr-form">
@ -32,15 +32,14 @@
<div class="wiz-no">1</div> <div class="wiz-no">1</div>
<div class="wiz-lbl hidden-xs"><span>Add a role</span></div> <div class="wiz-lbl hidden-xs"><span>Add a role</span></div>
</div> </div>
<br class="c-both" />
</div> </div>
<div class="col-md-6 col-xs-6"> <div class="col-md-6 col-xs-6">
<div class="itm-wiz" data-step="policy-profile"> <div class="itm-wiz" data-step="policy-profile">
<div class="wiz-no">2</div> <div class="wiz-no">2</div>
<div class="wiz-lbl hidden-xs"><span>Assign permissions</span></div> <div class="wiz-lbl hidden-xs"><span>Assign permissions</span></div>
</div> </div>
<br class="c-both" />
</div> </div>
<br class="c-both" />
</div> </div>
<br /><br /> <br /><br />
<hr /> <hr />
@ -48,8 +47,8 @@
<i class="icon fw fw-error"></i><span></span> <i class="icon fw fw-error"></i><span></span>
</div> </div>
<label class="wr-input-label">User Store Domain</label> <label class="wr-input-label">User Store Domain</label>
<div class="wr-input-control"> <div class="wr-input-control">
<!--suppress HtmlFormInputWithoutLabel -->
<select id="domain" class="form-control select"> <select id="domain" class="form-control select">
<option>PRIMARY</option> <option>PRIMARY</option>
{{#each userStores}} {{#each userStores}}
@ -57,6 +56,7 @@
{{/each}} {{/each}}
</select> </select>
</div> </div>
<label class="wr-input-label"> <label class="wr-input-label">
Role Name * Role Name *
</label> </label>
@ -66,20 +66,21 @@
</label> </label>
<div id="roleNameField" class="form-group wr-input-control"> <div id="roleNameField" class="form-group wr-input-control">
<input type="text" id="rolename" data-regex="{{roleNameJSRegEx}}" <!--suppress HtmlFormInputWithoutLabel -->
data-errormsg="{{roleNameRegExViolationErrorMsg}}" class="form-control" /> <input type="text" id="roleName" data-regex="{{roleNameJSRegEx}}"
<span class=" rolenameError hidden glyphicon glyphicon-remove form-control-feedback"></span> data-error-msg="{{roleNameRegExViolationErrorMsg}}" class="form-control" />
<label class="error rolenameEmpty hidden" for="summary">Role name is required & Should be in <span class="roleNameError hidden glyphicon glyphicon-remove form-control-feedback"></span>
minimum 3 characters long and do not <label class="error roleNameEmpty hidden" for="summary">
include any whitespaces. </label> Role name is required, should be in minimum 3 characters long and not include any whitespaces.
</label>
</div> </div>
<label class="wr-input-label"> <label class="wr-input-label">
User list User list
</label> </label>
<div class="wr-input-control"> <div class="wr-input-control">
<select id="users" class="form-control select2" multiple="multiple"> <!--suppress HtmlFormInputWithoutLabel -->
</select> <select id="users" class="form-control select2" multiple="multiple"></select>
</div> </div>
</div> </div>
</div> </div>
@ -96,7 +97,8 @@
<button class="wr-btn" onclick="window.location.href='{{@app.context}}/roles'"> <button class="wr-btn" onclick="window.location.href='{{@app.context}}/roles'">
View Role List View Role List
</button> </button>
<a href="{{@app.context}}/roles/add-role" class="cu-btn-inner"> <!--suppress HtmlUnknownTarget -->
<a href="{{@app.context}}/role/add" class="cu-btn-inner">
<span class="fw-stack"> <span class="fw-stack">
<i class="fw fw-ring fw-stack-2x"></i> <i class="fw fw-ring fw-stack-2x"></i>
<i class="fw fw-add fw-stack-1x"></i> <i class="fw fw-add fw-stack-1x"></i>

@ -18,21 +18,18 @@
/** /**
* Returns the dynamic state to be populated by add-user page. * Returns the dynamic state to be populated by add-user page.
* *
* @param context Object that gets updated with the dynamic state of this page to be presented * @param context Object that gets updated with the dynamic state of this page to be presented
* @returns {*} A context object that returns the dynamic state of this page to be presented * @returns {*} A context object that returns the dynamic state of this page to be presented
*/ */
function onRequest(context) { function onRequest(context) {
var userModule = require("/app/modules/business-controllers/user.js")["userModule"]; var userModule = require("/app/modules/business-controllers/user.js")["userModule"];
var deviceMgtProps = require("/app/modules/conf-reader/main.js")["conf"]; var deviceMgtProps = require("/app/modules/conf-reader/main.js")["conf"];
var response = userModule.getRoles();
if (response["status"] == "success") { context["userStores"] = userModule.getSecondaryUserStores();
context["roles"] = response["content"]; context["roleNameJSRegEx"] = deviceMgtProps["roleValidationConfig"]["roleNameJSRegEx"];
} context["roleNameHelpText"] = deviceMgtProps["roleValidationConfig"]["roleNameHelpMsg"];
var userStores = userModule.getSecondaryUserStores(); context["roleNameRegExViolationErrorMsg"] = deviceMgtProps["roleValidationConfig"]["roleNameRegExViolationErrorMsg"];
context["userStores"] = userStores;
context["roleNameJSRegEx"] = deviceMgtProps.roleValidationConfig.rolenameJSRegEx;
context["roleNameHelpText"] = deviceMgtProps.roleValidationConfig.rolenameHelpMsg;
context["roleNameRegExViolationErrorMsg"] = deviceMgtProps.roleValidationConfig.rolenameRegExViolationErrorMsg;
return context; return context;
} }

@ -73,19 +73,19 @@ var disableInlineError = function (inputField, errorMsg, errorSign) {
*clear inline validation messages. *clear inline validation messages.
*/ */
clearInline["role-name"] = function () { clearInline["role-name"] = function () {
disableInlineError("roleNameField", "rolenameEmpty", "rolenameError"); disableInlineError("roleNameField", "roleNameEmpty", "roleNameError");
}; };
/** /**
* Validate if provided rolename is valid against RegEx configures. * Validate if provided role-name is valid against RegEx configures.
*/ */
validateInline["role-name"] = function () { validateInline["role-name"] = function () {
var rolenameinput = $("input#rolename"); var roleNameInput = $("input#roleName");
if (inputIsValid( rolenameinput.data("regex"), rolenameinput.val())) { if (inputIsValid( roleNameInput.data("regex"), roleNameInput.val())) {
disableInlineError("roleNameField", "rolenameEmpty", "rolenameError"); disableInlineError("roleNameField", "roleNameEmpty", "roleNameError");
} else { } else {
enableInlineError("roleNameField", "rolenameEmpty", "rolenameError"); enableInlineError("roleNameField", "roleNameEmpty", "roleNameError");
} }
}; };
@ -97,16 +97,16 @@ function formatRepo (user) {
return; return;
} }
var markup = '<div class="clearfix">' + var markup = '<div class="clearfix">' +
'<div clas="col-sm-8">' + '<div class="col-sm-8">' +
'<div class="clearfix">' + '<div class="clearfix">' +
'<div class="col-sm-3">' + user.username + '</div>'; '<div class="col-sm-3">User : ' + user.username + '</div>';
if (user.firstname) { if (user.name) {
markup += '<div class="col-sm-3"><i class="fa fa-code-fork"></i> ' + user.firstname + '</div>'; markup += '<div class="col-sm-3"> ' + user.name + '</div>';
} }
if (user.emailAddress) { if (user.emailAddress) {
markup += '<div class="col-sm-2"><i class="fa fa-star"></i> ' + user.emailAddress + '</div></div>'; markup += '<div class="col-sm-3"> ' + user.emailAddress + '</div>';
} }
markup += '</div></div>'; markup += '</div></div></div>';
return markup; return markup;
} }
@ -129,17 +129,19 @@ $(document).ready(function () {
}, },
data: function (params) { data: function (params) {
var postData = {}; var postData = {};
postData.actionMethod = "GET"; postData.requestMethod = "GET";
postData.actionUrl = apiBasePath + "/users/search/usernames?filter=" + params.term; postData.requestURL = "/api/device-mgt/v1.0/users/search/usernames?filter=" + params.term;
postData.actionPayload = null; postData.requestPayload = null;
return JSON.stringify(postData); return JSON.stringify(postData);
}, },
processResults: function (data, page) { processResults: function (data) {
var newData = []; var newData = [];
$.each(data, function (index, value) { $.each(data, function (index, value) {
var user = {}; var user = {};
user.username = value.username;
user.id = value.username; user.id = value.username;
user.username = value.username;
user.name = value.firstname + " " + value.lastname;
user.emailAddress = value.emailAddress;
newData.push(user); newData.push(user);
}); });
return { return {
@ -159,10 +161,10 @@ $(document).ready(function () {
* when a user clicks on "Add Role" button * when a user clicks on "Add Role" button
* on Add Role page in WSO2 MDM Console. * on Add Role page in WSO2 MDM Console.
*/ */
$("button#add-role-btn").click(function() { $("button#add-role-btn").click(function () {
var rolenameInput = $("input#rolename");
var roleName = rolenameInput.val();
var domain = $("#domain").val(); var domain = $("#domain").val();
var roleNameInput = $("input#roleName");
var roleName = roleNameInput.val();
var users = $("#users").val(); var users = $("#users").val();
var errorMsgWrapper = "#role-create-error-msg"; var errorMsgWrapper = "#role-create-error-msg";
@ -170,8 +172,8 @@ $(document).ready(function () {
if (!roleName) { if (!roleName) {
$(errorMsg).text("Role name is a required field. It cannot be empty."); $(errorMsg).text("Role name is a required field. It cannot be empty.");
$(errorMsgWrapper).removeClass("hidden"); $(errorMsgWrapper).removeClass("hidden");
} else if (!inputIsValid(rolenameInput.data("regex"), roleName)) { } else if (!inputIsValid(roleNameInput.data("regex"), roleName)) {
$(errorMsg).text(rolenameInput.data("errormsg")); $(errorMsg).text(roleNameInput.data("error-msg"));
$(errorMsgWrapper).removeClass("hidden"); $(errorMsgWrapper).removeClass("hidden");
} else if (!domain) { } else if (!domain) {
$(errorMsg).text("Domain is a required field. It cannot be empty."); $(errorMsg).text("Domain is a required field. It cannot be empty.");
@ -181,13 +183,11 @@ $(document).ready(function () {
$(errorMsgWrapper).removeClass("hidden"); $(errorMsgWrapper).removeClass("hidden");
} else { } else {
var addRoleFormData = {}; var addRoleFormData = {};
addRoleFormData.roleName = roleName; addRoleFormData.roleName = roleName;
if (domain != "PRIMARY"){ if (domain != "PRIMARY"){
addRoleFormData.roleName = domain + "/" + roleName; addRoleFormData.roleName = domain + "/" + roleName;
} }
if (users == null){ if (users == null) {
users = []; users = [];
} }
addRoleFormData.users = users; addRoleFormData.users = users;
@ -197,37 +197,31 @@ $(document).ready(function () {
invokerUtil.post( invokerUtil.post(
addRoleAPI, addRoleAPI,
addRoleFormData, addRoleFormData,
function (data) { function (data, textStatus, jqXHR) {
data = JSON.parse(data); if (jqXHR.status == 201) {
if (data.errorMessage) {
$(errorMsg).text("Selected user store prompted an error : " + data.errorMessage);
$(errorMsgWrapper).removeClass("hidden");
} else {
// Clearing user input fields. // Clearing user input fields.
//$("input#rolename").val(""); $("input#roleName").val("");
//$("#domain").val(""); $("#domain").val("PRIMARY");
//// Refreshing with success message $("#users").val("");
//$("#role-create-form").addClass("hidden"); window.location.href = appContext + "/role/edit-permission/" + roleName;
//$("#role-created-msg").removeClass("hidden");
window.location.href = appContext + '/role/edit-permission/' + roleName;
} }
}, function (data) { },
if (JSON.parse(data).errorMessage.indexOf("RoleExisting") > -1) { function (jqXHR) {
$(errorMsg).text("Role name : " + roleName + " already exists. Pick another role name."); if (jqXHR.status == 500) {
} else { $(errorMsg).text("Either role already exists or unexpected error.");
$(errorMsg).text(JSON.parse(data.responseText).errorMessage); $(errorMsgWrapper).removeClass("hidden");
} }
$(errorMsgWrapper).removeClass("hidden");
} }
); );
} }
}); });
$("#rolename").focus(function() { var roleNameInputElement = "#roleName";
$(roleNameInputElement).focus(function() {
clearInline["role-name"](); clearInline["role-name"]();
}); });
$("#rolename").blur(function() { $(roleNameInputElement).blur(function() {
validateInline["role-name"](); validateInline["role-name"]();
}); });
}); });
Loading…
Cancel
Save