ading role filtering and ui fixes

4.x.x
Kamidu Punchihewa 8 years ago
parent 968913f135
commit e6333438b9

@ -39,14 +39,15 @@
{{#zone "content"}} {{#zone "content"}}
{{#if canManage}} {{#if canManage}}
<!-- 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" data-cloud={{isCloud}} class="container col-centered wr-content
">
<div class="wr-form"> <div class="wr-form">
<p class="page-sub-title">Add Role</p> <p class="page-sub-title">Add Role</p>
<hr /> <hr/>
<div class="row"> <div class="row">
<div class="col-lg-8"> <div class="col-lg-8">
<div class="wr-steps"> <div class="wr-steps">
@ -62,10 +63,10 @@
<div class="wiz-lbl hidden-xs"><span>Assign permissions</span></div> <div class="wiz-lbl hidden-xs"><span>Assign permissions</span></div>
</div> </div>
</div> </div>
<br class="c-both" /> <br class="c-both"/>
</div> </div>
<br /><br /> <br/><br/>
<hr /> <hr/>
<div id="role-create-error-msg" class="alert alert-danger hidden" role="alert"> <div id="role-create-error-msg" class="alert alert-danger hidden" role="alert">
<i class="icon fw fw-error"></i><span></span> <i class="icon fw fw-error"></i><span></span>
</div> </div>
@ -91,7 +92,7 @@
<div id="roleNameField" class="form-group wr-input-control"> <div id="roleNameField" class="form-group wr-input-control">
<!--suppress HtmlFormInputWithoutLabel --> <!--suppress HtmlFormInputWithoutLabel -->
<input type="text" id="roleName" data-regex="{{roleNameJSRegEx}}" <input type="text" id="roleName" data-regex="{{roleNameJSRegEx}}"
data-error-msg="{{roleNameRegExViolationErrorMsg}}" class="form-control" /> data-error-msg="{{roleNameRegExViolationErrorMsg}}" class="form-control"/>
<span class="roleNameError hidden glyphicon glyphicon-remove form-control-feedback"></span> <span class="roleNameError hidden glyphicon glyphicon-remove form-control-feedback"></span>
<label class="error roleNameEmpty hidden" for="summary"> <label class="error roleNameEmpty hidden" for="summary">
Role name is required, should be in minimum 3 characters long and not include any Role name is required, should be in minimum 3 characters long and not include any
@ -99,14 +100,14 @@
</label> </label>
</div> </div>
{{#if canViewUsers}} {{#if canViewUsers}}
<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">
<!--suppress HtmlFormInputWithoutLabel --> <!--suppress HtmlFormInputWithoutLabel -->
<select id="users" class="form-control select2" multiple="multiple"></select> <select id="users" class="form-control select2" multiple="multiple"></select>
</div> </div>
{{/if}} {{/if}}
</div> </div>
</div> </div>
@ -119,7 +120,7 @@
<p class="page-sub-title">Role was added successfully.</p> <p class="page-sub-title">Role was added successfully.</p>
<br>Please click <b>"Add Another Role"</b>, if you wish to add another role or click <br>Please click <b>"Add Another Role"</b>, if you wish to add another role or click
<b>"View Role List"</b> to complete the process and go back to the role list. <b>"View Role List"</b> to complete the process and go back to the role list.
<hr /> <hr/>
<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>
@ -136,8 +137,8 @@
<!-- /content --> <!-- /content -->
<div id="app-context" data-app-context="{{@app.context}}" class="hidden"></div> <div id="app-context" data-app-context="{{@app.context}}" class="hidden"></div>
</div> </div>
</div> </div>
<!-- /content/body --> <!-- /content/body -->
{{else}} {{else}}
<h1 class="page-sub-title"> <h1 class="page-sub-title">
Permission Denied Permission Denied

@ -38,6 +38,7 @@ function onRequest(context) {
if (userModule.isAuthorized("/permission/admin/device-mgt/users/view")) { if (userModule.isAuthorized("/permission/admin/device-mgt/users/view")) {
displayData.canViewUsers = true; displayData.canViewUsers = true;
} }
displayData.isCloud = deviceMgtProps.isCloud;
return displayData; return displayData;
} }

@ -33,6 +33,8 @@ var clearInline = {};
var apiBasePath = "/api/device-mgt/v1.0"; var apiBasePath = "/api/device-mgt/v1.0";
var domain = $("#domain").val(); var domain = $("#domain").val();
var isCloud = $("#role-create-form").data("cloud");
var enableInlineError = function (inputField, errorMsg, errorSign) { var enableInlineError = function (inputField, errorMsg, errorSign) {
var fieldIdentifier = "#" + inputField; var fieldIdentifier = "#" + inputField;
@ -84,18 +86,18 @@ clearInline["role-name"] = function () {
validateInline["role-name"] = function () { validateInline["role-name"] = function () {
var roleNameInput = $("input#roleName"); var roleNameInput = $("input#roleName");
var roleName = roleNameInput.val(); var roleName = roleNameInput.val();
if (inputIsValid( roleNameInput.data("regex"), roleName) && roleName.indexOf("@") < 0 && roleName.indexOf("/") < 0) { if (inputIsValid(roleNameInput.data("regex"), roleName) && roleName.indexOf("@") < 0 && roleName.indexOf("/") < 0) {
disableInlineError("roleNameField", "roleNameEmpty", "roleNameError"); disableInlineError("roleNameField", "roleNameEmpty", "roleNameError");
} else { } else {
enableInlineError("roleNameField", "roleNameEmpty", "roleNameError"); enableInlineError("roleNameField", "roleNameEmpty", "roleNameError");
} }
}; };
function formatRepo (user) { function formatRepo(user) {
if (user.loading) { if (user.loading) {
return user.text return user.text
} }
if (!user.username){ if (!user.username) {
return; return;
} }
var markup = '<div class="clearfix">' + var markup = '<div class="clearfix">' +
@ -103,20 +105,22 @@ function formatRepo (user) {
'<div class="clearfix">' + '<div class="clearfix">' +
'<div class="col-sm-4">' + user.username + '</div>'; '<div class="col-sm-4">' + user.username + '</div>';
if (user.name || user.name != undefined) { if (user.name || user.name != undefined) {
markup += '<div class="col-sm-8"> ( ' + user.name + ' )</div>'; markup += '<div class="col-sm-8"> ( ' + user.name + ' )</div>';
} }
markup += '</div></div></div>'; markup += '</div></div></div>';
return markup; return markup;
} }
function formatRepoSelection (user) { function formatRepoSelection(user) {
return user.username || user.text; return user.username || user.text;
} }
$(document).ready(function () { $(document).ready(function () {
isCloud = $("#role-create-form").data("cloud");
var appContext = $("#app-context").data("app-context"); var appContext = $("#app-context").data("app-context");
$("#users").select2({ $("#users").select2({
multiple:true, multiple: true,
tags: false, tags: false,
ajax: { ajax: {
url: appContext + "/api/invoker/execute/", url: appContext + "/api/invoker/execute/",
@ -140,7 +144,7 @@ $(document).ready(function () {
var user = {}; var user = {};
user.id = value.username; user.id = value.username;
user.username = value.username; user.username = value.username;
if(value.firstname && value.lastname) { if (value.firstname && value.lastname) {
user.name = value.firstname + " " + value.lastname; user.name = value.firstname + " " + value.lastname;
} }
newData.push(user); newData.push(user);
@ -151,7 +155,9 @@ $(document).ready(function () {
}, },
cache: true cache: true
}, },
escapeMarkup: function (markup) { return markup; }, // let our custom formatter work escapeMarkup: function (markup) {
return markup;
}, // let our custom formatter work
minimumInputLength: 1, minimumInputLength: 1,
templateResult: formatRepo, // omitted for brevity, see the source of this page templateResult: formatRepo, // omitted for brevity, see the source of this page
templateSelection: formatRepoSelection // omitted for brevity, see the source of this page templateSelection: formatRepoSelection // omitted for brevity, see the source of this page
@ -163,6 +169,7 @@ $(document).ready(function () {
* 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 domain = $("#domain").val(); var domain = $("#domain").val();
var roleNameInput = $("input#roleName"); var roleNameInput = $("input#roleName");
var roleName = roleNameInput.val(); var roleName = roleNameInput.val();
@ -185,8 +192,12 @@ $(document).ready(function () {
$(errorMsgWrapper).removeClass("hidden"); $(errorMsgWrapper).removeClass("hidden");
} else { } else {
var addRoleFormData = {}; var addRoleFormData = {};
addRoleFormData.roleName = roleName; if (isCloud) {
if (domain != "PRIMARY"){ addRoleFormData.roleName = "devicemgt" + roleName;
} else {
addRoleFormData.roleName = roleName;
}
if (domain != "PRIMARY") {
addRoleFormData.roleName = domain + "/" + roleName; addRoleFormData.roleName = domain + "/" + roleName;
} }
if (users == null) { if (users == null) {
@ -220,16 +231,16 @@ $(document).ready(function () {
}); });
var roleNameInputElement = "#roleName"; var roleNameInputElement = "#roleName";
$(roleNameInputElement).focus(function() { $(roleNameInputElement).focus(function () {
clearInline["role-name"](); clearInline["role-name"]();
}); });
$(roleNameInputElement).blur(function() { $(roleNameInputElement).blur(function () {
validateInline["role-name"](); validateInline["role-name"]();
}); });
/* When the user store domain value is changed, the users who are assigned to that role should be removed, as /* When the user store domain value is changed, the users who are assigned to that role should be removed, as
user and role can be mapped only if both are in same user store user and role can be mapped only if both are in same user store
*/ */
$("#domain").change(function () { $("#domain").change(function () {
$("#users").select2("val", ""); $("#users").select2("val", "");

@ -37,6 +37,7 @@ var modalPopupContainer = modalPopup + " .modal-content";
var modalPopupContent = modalPopup + " .modal-content"; var modalPopupContent = modalPopup + " .modal-content";
var body = "body"; var body = "body";
var isInit = true; var isInit = true;
var isCloud = false;
/** /**
@ -72,7 +73,7 @@ function showPopup() {
function hidePopup() { function hidePopup() {
$(modalPopupContent).html(''); $(modalPopupContent).html('');
$(modalPopup).modal('hide'); $(modalPopup).modal('hide');
$('body').removeClass('modal-open').css('padding-right','0px'); $('body').removeClass('modal-open').css('padding-right', '0px');
$('.modal-backdrop').remove(); $('.modal-backdrop').remove();
} }
@ -86,11 +87,12 @@ function InitiateViewOption() {
// $(location).attr('href', $(this).data("url")); // $(location).attr('href', $(this).data("url"));
} }
function htmlspecialchars(text){ function htmlspecialchars(text) {
return jQuery('<div/>').text(text).html(); return jQuery('<div/>').text(text).html();
} }
function loadRoles() { function loadRoles() {
isCloud = $("#role-table").data("cloud");
var loadingContent = $("#loading-content"); var loadingContent = $("#loading-content");
loadingContent.show(); loadingContent.show();
@ -98,21 +100,40 @@ function loadRoles() {
data = JSON.parse(data); data = JSON.parse(data);
var objects = []; var objects = [];
var count = 0;
$(data.roles).each(function (index) { $(data.roles).each(function (index) {
objects.push( if (isCloud && data.roles[index].startsWith("devicemgt")) {
{ count++;
name: htmlspecialchars(data.roles[index]), objects.push(
DT_RowId: "role-" + htmlspecialchars(data.roles[index]) {
} name: htmlspecialchars(data.roles[index]),
) DT_RowId: "role-" + htmlspecialchars(data.roles[index])
}
)
} else if (!isCloud) {
objects.push(
{
name: htmlspecialchars(data.roles[index]),
DT_RowId: "role-" + htmlspecialchars(data.roles[index])
}
)
}
}); });
var json = { var json = {};
"recordsTotal": data.count, if (isCloud) {
"recordsFiltered": data.count, json = {
"data": objects "recordsTotal": count,
}; "recordsFiltered": count,
"data": objects
};
} else {
json = {
"recordsTotal": data.count,
"recordsFiltered": data.count,
"data": objects
};
}
return JSON.stringify(json); return JSON.stringify(json);
}; };
@ -143,13 +164,13 @@ function loadRoles() {
data: null, data: null,
render: function (data, type, row, meta) { render: function (data, type, row, meta) {
var isCloud = false; var isCloud = false;
if ($('#is-cloud').length > 0){ if ($('#is-cloud').length > 0) {
isCloud = true; isCloud = true;
} }
var innerhtml = ''; var innerhtml = '';
var editLink = '<a onclick="javascript:loadRoleBasedActionURL(\'edit\', \'' + data.name + '\')" ' + var editLink = '<a onclick="javascript:loadRoleBasedActionURL(\'edit\', \'' + data.name + '\')" ' +
'data-role="' + data.name + '" ' + 'data-role="' + data.name + '" ' +
'data-click-event="edit-form" ' + 'data-click-event="edit-form" ' +
'class="btn padding-reduce-on-grid-view edit-role-link">' + 'class="btn padding-reduce-on-grid-view edit-role-link">' +
@ -179,7 +200,7 @@ function loadRoles() {
'<span class="hidden-xs hidden-on-grid-view">Edit Permission</span>' + '<span class="hidden-xs hidden-on-grid-view">Edit Permission</span>' +
'</a>'; '</a>';
var removeLink = '<a data-role="' + data.name + '" ' + var removeLink = '<a data-role="' + data.name + '" ' +
'data-click-event="remove-form" ' + 'data-click-event="remove-form" ' +
'class="btn padding-reduce-on-grid-view remove-role-link">' + 'class="btn padding-reduce-on-grid-view remove-role-link">' +
'<span class="fw-stack">' + '<span class="fw-stack">' +

@ -36,39 +36,40 @@
{{#zone "navbarActions"}} {{#zone "navbarActions"}}
{{#unless isCloud}} {{#unless isCloud}}
<li> <li>
<!--suppress HtmlUnknownTarget --> <!--suppress HtmlUnknownTarget -->
<a href="{{@app.context}}/role/add" class="cu-btn"> <a href="{{@app.context}}/role/add" class="cu-btn">
<span class="icon fw-stack"> <span class="icon fw-stack">
<i class="fw fw-add fw-stack-1x"></i> <i class="fw fw-add fw-stack-1x"></i>
<i class="fw fw-circle-outline fw-stack-2x"></i> <i class="fw fw-circle-outline fw-stack-2x"></i>
</span> </span>
Add Role Add Role
</a> </a>
</li> </li>
{{/unless}} {{/unless}}
{{/zone}} {{/zone}}
{{#zone "content"}} {{#zone "content"}}
<div id="loading-content" class="col-centered"> <div id="loading-content" class="col-centered">
{{#unless isCloud}} {{#unless isCloud}}
{{#if removePermitted}} {{#if removePermitted}}
<input type="hidden" id="can-remove" value="true" /> <input type="hidden" id="can-remove" value="true"/>
{{/if}} {{/if}}
{{#if editPermitted}} {{#if editPermitted}}
<input type="hidden" id="can-edit" value="true" /> <input type="hidden" id="can-edit" value="true"/>
{{/if}} {{/if}}
{{/unless}} {{/unless}}
{{#if isCloud}} {{#if isCloud}}
<input type="hidden" id="is-cloud" value="true" /> <input type="hidden" id="is-cloud" value="true"/>
{{/if}} {{/if}}
<i class="fw fw-settings fw-spin fw-2x"></i> <i class="fw fw-settings fw-spin fw-2x"></i>
Loading roles . . . Loading roles . . .
<br> <br>
</div> </div>
<div id="role-table" data-role={{adminRole}}> <div id="role-table" data-cloud={{isCloud}} data-role={{adminRole}}>
<table class="table table-striped table-hover list-table display responsive nowrap data-table grid-view" id="role-grid"> <table class="table table-striped table-hover list-table display responsive nowrap data-table grid-view"
id="role-grid">
<thead> <thead>
<tr class="sort-row"> <tr class="sort-row">
<th>By Role Name</th> <th>By Role Name</th>

Loading…
Cancel
Save