Updating Role Listing UI

4.x.x
dilanua 8 years ago
parent eedb66ec45
commit 687efa97b1

@ -15,6 +15,7 @@
specific language governing permissions and limitations
under the License.
}}
<div id="loading-content" class="col-centered">
{{#if removePermitted}}
<input type="hidden" id="can-remove" value="true" />
@ -27,36 +28,20 @@
<br>
</div>
<div id="role-listing-status" class="raw">
<ul style="list-style-type: none;">
<li class="message message-info">
<h4>
<i class="icon fw fw-info"></i>
<a id="role-listing-status-msg"></a>
</h4>
</li>
</ul>
</div>
<div id="role-table" data-role={{adminRole}}>
<table class="table table-striped table-hover list-table display responsive nowrap data-table row-view"
id="role-grid">
<table class="table table-striped table-hover list-table display responsive nowrap data-table grid-view" id="role-grid">
<thead>
<tr class="sort-row">
<th class="no-sort"></th>
<th>By Role Name</th>
<th class="no-sort"></th>
</tr>
<tr class="bulk-action-row">
<th colspan="3"></th>
</tr>
</thead>
<tbody id="ast-container" data-app-context="{{appContext}}">
<br class="c-both" />
</tbody>
<tbody id="ast-container"></tbody>
</table>
</div>
<br class="c-both" />
<div id="content-filter-types" style="display: none">
<div class="sort-title">Sort By</div>
<div class="sort-options">
@ -120,6 +105,7 @@
{{/zone}}
{{#zone "bottomJs"}}
<!--suppress HtmlUnknownTarget -->
<script id="role-listing" data-current-user="{{currentUser.username}}"
src="{{@unit.publicUri}}/templates/role-listing.hbs" type="text/x-handlebars-template"></script>
{{js "js/role-listing.js"}}

@ -21,7 +21,47 @@ var loadRoleBasedActionURL = function (action, rolename) {
$(location).attr('href', href);
};
$(function () {
var sortableElem = '.wr-sortable';
$(sortableElem).sortable({
beforeStop: function () {
$(this).sortable('toArray');
}
});
$(sortableElem).disableSelection();
});
var apiBasePath = "/api/device-mgt/v1.0";
var modalPopup = ".wr-modalpopup";
var modalPopupContainer = modalPopup + " .modalpopup-container";
var modalPopupContent = modalPopup + " .modalpopup-content";
var body = "body";
$(".icon .text").res_text(0.2);
/*
* set popup maximum height function.
*/
function setPopupMaxHeight() {
$(modalPopupContent).css('max-height', ($(body).height() - ($(body).height() / 100 * 30)));
$(modalPopupContainer).css('margin-top', (-($(modalPopupContainer).height() / 2)));
}
/*
* show popup function.
*/
function showPopup() {
$(modalPopup).show();
setPopupMaxHeight();
}
/*
* hide popup function.
*/
function hidePopup() {
$(modalPopupContent).html('');
$(modalPopup).hide();
}
/**
* Following function would execute
@ -32,47 +72,6 @@ function InitiateViewOption() {
$(location).attr('href', $(this).data("url"));
}
/**
* Sorting function of roles
* listed on Role Management page in WSO2 Devicemgt Console.
*/
//var loadPaginatedObjects = function (objectGridId, objectGridContainer, objectGridTemplateSrc, serviceURL, callback) {
// var templateSrc = $(objectGridTemplateSrc).attr("src");
// $.template(objectGridId, templateSrc, function (template) {
// invokerUtil.get(serviceURL,
// function (data) {
// data = callback(data);
// if (data.length > 0 && data != null) {
// $('#ast-container').removeClass('hidden');
// $('#role-listing-status').hide();
// for (var i = 0; i < data.viewModel.roles.length; i++) {
// data.viewModel.roles[i].adminRole = $("#role-table").data("role");
// }
// var content = template(data.viewModel);
// $(objectGridContainer).html(content);
// if (isInit) {
// $('#role-grid').datatables_extended_serverside_paging();
// isInit = false;
// }
// $("#dt-select-all").addClass("hidden");
// $(".icon .text").res_text(0.2);
// } else {
// $('#ast-container').addClass('hidden');
// $('#role-listing-status-msg').text('No roles are available to be displayed.');
// $('#role-listing-status').show();
// }
//
// //$(objectGridId).datatables_extended();
// }, function (message) {
// $('#ast-container').addClass('hidden');
// $('#role-listing-status-msg').text('Invalid search query. Try again with a valid search ' +
// 'query');
// $('#role-listing-status').show();
// });
// });
//};
function loadRoles() {
var loadingContent = $("#loading-content");
loadingContent.show();
@ -83,7 +82,12 @@ function loadRoles() {
var objects = [];
$(data.roles).each(function( index ) {
objects.push({name: data.roles[index], DT_RowId : "role-" + data.roles[index]})
objects.push(
{
name: data.roles[index],
DT_RowId: "role-" + data.roles[index]
}
)
});
var json = {
@ -105,24 +109,29 @@ function loadRoles() {
{
class: "remove-padding icon-only content-fill",
data: null,
defaultContent: '<div class="thumbnail icon"> <i class="square-element text fw fw-user" style="font-size: 30px;"></i></div>'
defaultContent: "<div class='thumbnail icon'>" +
"<i class='square-element text fw fw-bookmark' style='font-size: 30px;'></i>" +
"</div>"
},
{
class: "fade-edge remove-padding-top",
class: "fade-edge",
data: "name",
defaultContent: ''
render: function (name, type, row, meta) {
return '<h4>&nbsp;&nbsp;' + name + '&nbsp;role</h4>';
}
},
{
class: "text-right content-fill text-left-on-grid-view no-wrap",
data: null,
render: function (data, type, row, meta) {
return '<a onclick="javascript:loadRoleBasedActionURL(\'edit\', \'' + data.name + '\')" ' +
return '&nbsp;' +
'<a onclick="javascript:loadRoleBasedActionURL(\'edit\', \'' + data.name + '\')" ' +
'data-role="' + data.name + '" ' +
'data-click-event="edit-form" ' +
'class="btn padding-reduce-on-grid-view edit-role-link">' +
'<span class="fw-stack fw-lg">' +
'<span class="fw-stack">' +
'<i class="fw fw-ring fw-stack-2x"></i>' +
'<i class="fw fw-user fw-stack-1x"></i>' +
'<i class="fw fw-bookmark fw-stack-1x"></i>' +
'<span class="fw-stack fw-move-right fw-move-bottom">' +
'<i class="fw fw-circle fw-stack-2x fw-stroke fw-inverse"></i>' +
'<i class="fw fw-circle fw-stack-2x"></i><i class="fw fw-edit fw-stack-1x fw-inverse"></i>' +
@ -130,11 +139,11 @@ function loadRoles() {
'</span>' +
'<span class="hidden-xs hidden-on-grid-view">&nbsp;&nbsp;Edit</span>' +
'</a>' +
'<a onclick="javascript:loadRoleBasedActionURL(\'edit-permission\', \'' + data.name + '\')" ' +
'&nbsp;<a onclick="javascript:loadRoleBasedActionURL(\'edit-permission\', \'' + data.name + '\')" ' +
'data-role="' + data.name + '" ' +
'data-click-event="edit-form" ' +
'class="btn padding-reduce-on-grid-view edit-permission-link">' +
'<span class="fw-stack fw-lg">' +
'<span class="fw-stack">' +
'<i class="fw fw-ring fw-stack-2x"></i>' +
'<i class="fw fw-security-policy fw-stack-1x"></i>' +
'<span class="fw-stack fw-move-right fw-move-bottom">' +
@ -144,7 +153,7 @@ function loadRoles() {
'</span>' +
'<span class="hidden-xs hidden-on-grid-view">&nbsp;&nbsp;Edit Permission</span>' +
'</a>' +
'<a data-role="' + data.name + '" ' +
'&nbsp;<a data-role="' + data.name + '" ' +
'data-click-event="remove-form" ' +
'class="btn padding-reduce-on-grid-view remove-role-link">' +
'<span class="fw-stack">' +
@ -163,42 +172,10 @@ function loadRoles() {
};
$('#role-grid').datatables_extended_serverside_paging(null, '/api/device-mgt/v1.0/roles', dataFilter, columns, fnCreatedRow, null, options);
loadingContent.hide();
}
var modalPopup = ".wr-modalpopup";
var modalPopupContainer = modalPopup + " .modalpopup-container";
var modalPopupContent = modalPopup + " .modalpopup-content";
var body = "body";
var isInit = true;
/*
* set popup maximum height function.
*/
function setPopupMaxHeight() {
$(modalPopupContent).css('max-height', ($(body).height() - ($(body).height() / 100 * 30)));
$(modalPopupContainer).css('margin-top', (-($(modalPopupContainer).height() / 2)));
}
/*
* show popup function.
*/
function showPopup() {
$(modalPopup).show();
setPopupMaxHeight();
}
/*
* hide popup function.
*/
function hidePopup() {
$(modalPopupContent).html('');
$(modalPopup).hide();
}
/**
* Following click function would execute
* when a user clicks on "Remove" link
@ -235,17 +212,6 @@ $("#role-grid").on("click", ".remove-role-link", function () {
});
});
//$("#search-btn").click(function () {
// var searchQuery = $("#search-by-name").val();
// if (searchQuery.trim() != "") {
// loadRoles(searchQuery);
// } else {
// loadRoles();
// }
//});
$(document).ready(function () {
$('#role-listing-status').hide();
loadRoles();
isInit = true;
});
Loading…
Cancel
Save