mirror of
https://repository.entgra.net/community/device-mgt-core.git
synced 2025-10-06 02:01:45 +00:00
Refactoring user-listing page
This commit is contained in:
dilanua
parent
177b7cf3df
commit
da6ff6e7fa
@ -1,21 +1,23 @@
|
||||
/*
|
||||
* Copyright (c) 2016, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||
* Copyright (c) 2015, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||
*
|
||||
* WSO2 Inc. licenses this file to you under the Apache License,
|
||||
* Version 2.0 (the "License"); you may not use this file except
|
||||
* in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing,
|
||||
* software distributed under the License is distributed on an
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||
* KIND, either express or implied. See the License for the
|
||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND,
|
||||
* either express or implied. See the License for the
|
||||
* specific language governing permissions and limitations
|
||||
* under the License.
|
||||
*/
|
||||
|
||||
var deviceMgtAPIsBasePath = "/api/device-mgt/v1.0";
|
||||
|
||||
/**
|
||||
* Checks if provided input is valid against RegEx input.
|
||||
*
|
||||
@ -35,10 +37,10 @@ function inputIsValid(regExp, inputString) {
|
||||
$(function () {
|
||||
var sortableElem = '.wr-sortable';
|
||||
$(sortableElem).sortable({
|
||||
beforeStop: function () {
|
||||
var sortedIDs = $(this).sortable('toArray');
|
||||
}
|
||||
});
|
||||
beforeStop: function () {
|
||||
$(this).sortable('toArray');
|
||||
}
|
||||
});
|
||||
$(sortableElem).disableSelection();
|
||||
});
|
||||
|
||||
@ -46,11 +48,9 @@ var modalPopup = ".wr-modalpopup";
|
||||
var modalPopupContainer = modalPopup + " .modalpopup-container";
|
||||
var modalPopupContent = modalPopup + " .modalpopup-content";
|
||||
var body = "body";
|
||||
var isInit = true;
|
||||
//var isInit = true;
|
||||
$(".icon .text").res_text(0.2);
|
||||
|
||||
var resetPasswordServiceURL = "/devicemgt_admin/users/reset-password";
|
||||
|
||||
/*
|
||||
* set popup maximum height function.
|
||||
*/
|
||||
@ -80,11 +80,9 @@ function hidePopup() {
|
||||
*/
|
||||
function getSelectedUsernames() {
|
||||
var usernameList = [];
|
||||
var userList = $("#user-grid").find('> tbody > tr');
|
||||
var userList = $("#user-grid").find('tr.DTTT_selected');
|
||||
userList.each(function () {
|
||||
if ($(this).hasClass('DTTT_selected')) {
|
||||
usernameList.push($(this).attr('data-username'));
|
||||
}
|
||||
usernameList.push($(this).data('username'));
|
||||
});
|
||||
return usernameList;
|
||||
}
|
||||
@ -96,7 +94,7 @@ function getSelectedUsernames() {
|
||||
*/
|
||||
$("a.invite-user-link").click(function () {
|
||||
var usernameList = getSelectedUsernames();
|
||||
var inviteUserAPI = "/devicemgt_admin/users/email-invitation";
|
||||
var inviteUserAPI = deviceMgtAPIsBasePath + "/users/send-invitation";
|
||||
|
||||
if (usernameList.length == 0) {
|
||||
$(modalPopupContent).html($("#errorUsers").html());
|
||||
@ -108,20 +106,25 @@ $("a.invite-user-link").click(function () {
|
||||
|
||||
$("a#invite-user-yes-link").click(function () {
|
||||
invokerUtil.post(
|
||||
inviteUserAPI,
|
||||
usernameList,
|
||||
function () {
|
||||
inviteUserAPI,
|
||||
usernameList,
|
||||
// The success callback
|
||||
function (data, textStatus, jqXHR) {
|
||||
if (jqXHR.status == 200) {
|
||||
$(modalPopupContent).html($('#invite-user-success-content').html());
|
||||
$("a#invite-user-success-link").click(function () {
|
||||
hidePopup();
|
||||
});
|
||||
},
|
||||
function () {
|
||||
$(modalPopupContent).html($('#invite-user-error-content').html());
|
||||
$("a#invite-user-error-link").click(function () {
|
||||
hidePopup();
|
||||
});
|
||||
}
|
||||
},
|
||||
// The error callback
|
||||
function (jqXHR) {
|
||||
console.log("error in invite-user API, status code: " + jqXHR.status);
|
||||
$(modalPopupContent).html($('#invite-user-error-content').html());
|
||||
$("a#invite-user-error-link").click(function () {
|
||||
hidePopup();
|
||||
});
|
||||
}
|
||||
);
|
||||
});
|
||||
|
||||
@ -137,16 +140,17 @@ $("a.invite-user-link").click(function () {
|
||||
*/
|
||||
function removeUser(uname, uid) {
|
||||
var username = uname;
|
||||
var userid = uid;
|
||||
var removeUserAPI = "/devicemgt_admin/users?username=" + username;
|
||||
var userId = uid;
|
||||
var removeUserAPI = deviceMgtAPIsBasePath + "/users/" + username;
|
||||
$(modalPopupContent).html($('#remove-user-modal-content').html());
|
||||
showPopup();
|
||||
|
||||
$("a#remove-user-yes-link").click(function () {
|
||||
invokerUtil.delete(
|
||||
removeUserAPI,
|
||||
function () {
|
||||
$("#" + userid).remove();
|
||||
removeUserAPI,
|
||||
function (data, textStatus, jqXHR) {
|
||||
if (jqXHR.status == 200) {
|
||||
$("#" + userId).remove();
|
||||
// get new user-list-count
|
||||
var newUserListCount = $(".user-list > span").length;
|
||||
// update user-listing-status-msg with new user-count
|
||||
@ -156,13 +160,16 @@ function removeUser(uname, uid) {
|
||||
$("a#remove-user-success-link").click(function () {
|
||||
hidePopup();
|
||||
});
|
||||
},
|
||||
function () {
|
||||
$(modalPopupContent).html($('#remove-user-error-content').html());
|
||||
$("a#remove-user-error-link").click(function () {
|
||||
hidePopup();
|
||||
});
|
||||
}
|
||||
},
|
||||
// The error callback
|
||||
function (jqXHR) {
|
||||
console.log("error in remove-user API, status code: " + jqXHR.status);
|
||||
$(modalPopupContent).html($('#remove-user-error-content').html());
|
||||
$("a#remove-user-error-link").click(function () {
|
||||
hidePopup();
|
||||
});
|
||||
}
|
||||
);
|
||||
});
|
||||
|
||||
@ -202,29 +209,30 @@ function resetPassword(uname) {
|
||||
$(errorMsgWrapper).removeClass("hidden");
|
||||
} else {
|
||||
var resetPasswordFormData = {};
|
||||
resetPasswordFormData.username = user;
|
||||
resetPasswordFormData.newPassword = window.btoa(unescape(encodeURIComponent(confirmedPassword)));
|
||||
//resetPasswordFormData.username = user;
|
||||
resetPasswordFormData.newPassword = unescape(confirmedPassword);
|
||||
|
||||
var resetPasswordServiceURL = deviceMgtAPIsBasePath + "/admin/users/"+ user +"/credentials";
|
||||
|
||||
invokerUtil.post(
|
||||
resetPasswordServiceURL,
|
||||
resetPasswordFormData,
|
||||
function (data) { // The success callback
|
||||
data = JSON.parse(data);
|
||||
if (data.statusCode == 201) {
|
||||
$(modalPopupContent).html($('#reset-password-success-content').html());
|
||||
$("a#reset-password-success-link").click(function () {
|
||||
hidePopup();
|
||||
});
|
||||
}
|
||||
}, function (data) { // The error callback
|
||||
if (data.statusCode == 400) {
|
||||
$(errorMsg).text("Old password does not match with the provided value.");
|
||||
$(errorMsgWrapper).removeClass("hidden");
|
||||
} else {
|
||||
$(errorMsg).text("An unexpected error occurred. Please try again later.");
|
||||
$(errorMsgWrapper).removeClass("hidden");
|
||||
}
|
||||
resetPasswordServiceURL,
|
||||
resetPasswordFormData,
|
||||
// The success callback
|
||||
function (data, textStatus, jqXHR) {
|
||||
if (jqXHR.status == 200) {
|
||||
$(modalPopupContent).html($('#reset-password-success-content').html());
|
||||
$("a#reset-password-success-link").click(function () {
|
||||
hidePopup();
|
||||
});
|
||||
}
|
||||
},
|
||||
// The error callback
|
||||
function (jqXHR) {
|
||||
console.log("error in reset-password API, status code: " + jqXHR.status);
|
||||
var payload = JSON.parse(jqXHR.responseText);
|
||||
$(errorMsg).text(payload.message);
|
||||
$(errorMsgWrapper).removeClass("hidden");
|
||||
}
|
||||
);
|
||||
}
|
||||
});
|
||||
@ -250,7 +258,7 @@ $("#search-btn").click(function () {
|
||||
* when a user clicks on the list item
|
||||
* initial mode and with out select mode.
|
||||
*/
|
||||
function InitiateViewOption() {
|
||||
function initiateViewOption() {
|
||||
if ($("#can-view").val()) {
|
||||
$(location).attr('href', $(this).data("url"));
|
||||
} else {
|
||||
@ -259,74 +267,112 @@ function InitiateViewOption() {
|
||||
}
|
||||
}
|
||||
|
||||
function loadUsers(searchParam) {
|
||||
$("#loading-content").show();
|
||||
var userListing = $("#user-listing");
|
||||
var userListingSrc = userListing.attr("src");
|
||||
$.template("user-listing", userListingSrc, function (template) {
|
||||
var serviceURL = "/devicemgt_admin/users";
|
||||
if (searchParam) {
|
||||
serviceURL = serviceURL + "/view-users?username=" + searchParam;
|
||||
}
|
||||
var successCallback = function (data) {
|
||||
if (!data) {
|
||||
$('#ast-container').addClass('hidden');
|
||||
$('#user-listing-status-msg').text('No users are available to be displayed.');
|
||||
return;
|
||||
}
|
||||
var canRemove = $("#can-remove").val();
|
||||
var canEdit = $("#can-edit").val();
|
||||
var canResetPassword = $("#can-reset-password").val();
|
||||
data = JSON.parse(data);
|
||||
data = data.responseContent;
|
||||
var viewModel = {};
|
||||
viewModel.users = data;
|
||||
for (var i = 0; i < viewModel.users.length; i++) {
|
||||
viewModel.users[i].userid = viewModel.users[i].username.replace(/[^\w\s]/gi, '');
|
||||
if (canRemove) {
|
||||
viewModel.users[i].canRemove = true;
|
||||
}
|
||||
if (canEdit) {
|
||||
viewModel.users[i].canEdit = true;
|
||||
}
|
||||
if (canResetPassword) {
|
||||
viewModel.users[i].canResetPassword = true;
|
||||
}
|
||||
viewModel.users[i].adminUser = $("#user-table").data("user");
|
||||
}
|
||||
if (data.length > 0) {
|
||||
$('#ast-container').removeClass('hidden');
|
||||
$('#user-listing-status-msg').text("");
|
||||
var content = template(viewModel);
|
||||
$("#ast-container").html(content);
|
||||
} else {
|
||||
$('#ast-container').addClass('hidden');
|
||||
$('#user-listing-status-msg').text('No users are available to be displayed.');
|
||||
}
|
||||
$("#loading-content").hide();
|
||||
if (isInit) {
|
||||
$('#user-grid').datatables_extended();
|
||||
isInit = false;
|
||||
}
|
||||
$(".icon .text").res_text(0.2);
|
||||
function loadUsers() {
|
||||
var loadingContentIcon = "#loading-content";
|
||||
$(loadingContentIcon).show();
|
||||
|
||||
var dataFilter = function (data) {
|
||||
data = JSON.parse(data);
|
||||
|
||||
var objects = [];
|
||||
|
||||
$(data.users).each(function (index) {
|
||||
objects.push({
|
||||
username: data.users[index].username,
|
||||
firstname: data.users[index].firstname ? data.users[index].firstname: '' ,
|
||||
lastname: data.users[index].lastname ? data.users[index].lastname : '',
|
||||
emailAddress : data.users[index].emailAddress ? data.users[index].emailAddress: '',
|
||||
DT_RowId : "role-" + data.users[index].username})
|
||||
});
|
||||
|
||||
var json = {
|
||||
"recordsTotal": data.count,
|
||||
"recordsFiltered": data.count,
|
||||
"data": objects
|
||||
};
|
||||
invokerUtil.get(serviceURL,
|
||||
successCallback,
|
||||
function (message) {
|
||||
$('#ast-container').addClass('hidden');
|
||||
$('#user-listing-status-msg').text('Invalid search query. Try again with a valid search query');
|
||||
}
|
||||
);
|
||||
});
|
||||
|
||||
return JSON.stringify(json);
|
||||
};
|
||||
|
||||
var fnCreatedRow = function(nRow, aData, iDataIndex) {
|
||||
console.log(JSON.stringify(aData));
|
||||
$(nRow).attr('data-type', 'selectable');
|
||||
$(nRow).attr('data-username', aData["username"]);
|
||||
};
|
||||
|
||||
var columns = [
|
||||
{
|
||||
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>'
|
||||
},
|
||||
{
|
||||
class: "fade-edge",
|
||||
data: null,
|
||||
render: function (data, type, row, meta) {
|
||||
return '<h4>' + data.firstname + ' ' + data.lastname + '</h4>';
|
||||
}
|
||||
},
|
||||
{
|
||||
class: "fade-edge remove-padding-top",
|
||||
data: null,
|
||||
render: function (data, type, row, meta) {
|
||||
return '<i class="fw-user"></i> ' + data.username;
|
||||
}
|
||||
},
|
||||
{
|
||||
class: "fade-edge remove-padding-top",
|
||||
data: null,
|
||||
render: function (data, type, row, meta) {
|
||||
return '<a href="mailto:' + data.emailAddress + ' " class="wr-list-email"><i class="fw-mail"></i> ' +
|
||||
data.emailAddress + ' </a>';
|
||||
}
|
||||
},
|
||||
{
|
||||
class: "text-right content-fill text-left-on-grid-view no-wrap",
|
||||
data: null,
|
||||
render: function (data, type, row, meta) {
|
||||
return '<a href="/emm/users/edit-user?username=' + data.username + '" data-username="' + data.username +
|
||||
'" data-click-event="edit-form" class="btn padding-reduce-on-grid-view edit-user-link"> ' +
|
||||
'<span class="fw-stack"><i class="fw fw-ring fw-stack-2x"></i>' +
|
||||
'<i class="fw fw-edit fw-stack-1x"></i>' +
|
||||
' </span> <span class="hidden-xs hidden-on-grid-view">Edit</span> </a>' +
|
||||
|
||||
'<a href="#" data-username="' + data.username + '" data-user-id=' + data.username +
|
||||
' data-click-event="remove-form" onclick="javascript:removeUser(\'' + data.username + '\', \'' +
|
||||
data.username + '\')" class="btn padding-reduce-on-grid-view remove-user-link">' +
|
||||
'<span class="fw-stack"> <i class="fw fw-ring fw-stack-2x"></i><i class="fw fw-delete fw-stack-1x">' +
|
||||
'</i> </span> <span class="hidden-xs hidden-on-grid-view">Remove</span> </a>' +
|
||||
|
||||
'<a href="#" data-username="' + data.username + '" data-user-id="' + data.username +
|
||||
'" data-click-event="edit-form" onclick="javascript:resetPassword(\'' + data.username +
|
||||
'\')" class="btn padding-reduce-on-grid-view remove-user-link"> <span class="fw-stack">' +
|
||||
'<i class="fw fw-ring fw-stack-2x">' +
|
||||
'</i> <i class="fw fw-key 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-refresh fw-stack-1x fw-inverse">' +
|
||||
'</i> </span> </span> <span class="hidden-xs hidden-on-grid-view">Reset</span> </a>'
|
||||
}
|
||||
}
|
||||
|
||||
];
|
||||
|
||||
$('#user-grid').datatables_extended_serverside_paging(null, '/api/device-mgt/v1.0/users', dataFilter, columns, fnCreatedRow, null);
|
||||
|
||||
$("#loading-content").hide();
|
||||
}
|
||||
|
||||
$(document).ready(function () {
|
||||
loadUsers();
|
||||
|
||||
$(".viewEnabledIcon").click(function () {
|
||||
InitiateViewOption();
|
||||
initiateViewOption();
|
||||
});
|
||||
|
||||
if (!$("#can-invite").val()) {
|
||||
$("#invite-user-button").remove();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
@ -52,6 +52,11 @@
|
||||
<span class="fw-stack">
|
||||
<i class="fw fw-ring fw-stack-2x"></i>
|
||||
<i class="fw fw-key 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-refresh fw-stack-1x fw-inverse"></i>
|
||||
</span>
|
||||
</span>
|
||||
<span class="hidden-xs hidden-on-grid-view">Reset</span>
|
||||
</a>
|
||||
|
||||
@ -298,15 +298,13 @@
|
||||
Enter new password
|
||||
<br><br>
|
||||
<div>
|
||||
<input type="password" class="form-control modal-input operationDataKeys" id="new-password"
|
||||
data-key="message"/>
|
||||
<input type="password" class="form-control modal-input operationDataKeys" id="new-password" data-key="message"/>
|
||||
</div>
|
||||
<br>
|
||||
Retype new password
|
||||
<br><br>
|
||||
<div>
|
||||
<input type="password" class="form-control modal-input operationDataKeys"
|
||||
id="confirmed-password" data-key="message"/>
|
||||
<input type="password" class="form-control modal-input operationDataKeys" id="confirmed-password" data-key="message"/>
|
||||
</div>
|
||||
<br>
|
||||
</h4>
|
||||
@ -338,6 +336,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{/zone}}
|
||||
{{#zone "common-navigation"}}
|
||||
<!--Later add the navigation menu from here-->
|
||||
|
||||
@ -26,13 +26,13 @@ function onRequest(context) {
|
||||
return options.fn(this);
|
||||
}
|
||||
});
|
||||
|
||||
var page = {};
|
||||
var userModule = require("/app/modules/user.js")["userModule"];
|
||||
var deviceMgtProps = require("/app/conf/devicemgt-props.js").config();
|
||||
|
||||
page["adminUser"] = deviceMgtProps["adminUser"];
|
||||
page["permissions"] = userModule.getUIPermissions();
|
||||
if (userModule.isAuthorized("/permission/admin/device-mgt/users/delete")) {
|
||||
page["removePermitted"] = true;
|
||||
}
|
||||
|
||||
if (userModule.isAuthorized("/permission/admin/device-mgt/users/remove")) {
|
||||
page["removePermitted"] = true;
|
||||
@ -51,6 +51,5 @@ function onRequest(context) {
|
||||
page["resetPasswordPermitted"] = true;
|
||||
}
|
||||
|
||||
page["adminUser"] = deviceMgtProps.adminUser;
|
||||
return page;
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user