thasleem
/
device-mgt-core
forked from community/device-mgt-core
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Refactoring user-listing page

Browse Source
revert-70aa11f8
dilanua 8 years ago
parent 177b7cf3df
commit da6ff6e7fa
4 changed files with 171 additions and 122 deletions
Show Stats Download Patch File Download Diff File

216
components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.users/public/js/listing.js
Unescape View File

@ -1,5 +1,5 @@
/* /*
* 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, * WSO2 Inc. licenses this file to you under the Apache License,
* Version 2.0 (the "License"); you may not use this file except * Version 2.0 (the "License"); you may not use this file except
@ -10,12 +10,14 @@
* *
* Unless required by applicable law or agreed to in writing, * Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an * software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND,
* KIND, either express or implied. See the License for the * either express or implied. See the License for the
* specific language governing permissions and limitations * specific language governing permissions and limitations
* under the License. * under the License.
*/ */
var deviceMgtAPIsBasePath = "/api/device-mgt/v1.0";
/** /**
* Checks if provided input is valid against RegEx input. * Checks if provided input is valid against RegEx input.
* *
@ -36,7 +38,7 @@ $(function () {
var sortableElem = '.wr-sortable'; var sortableElem = '.wr-sortable';
$(sortableElem).sortable({ $(sortableElem).sortable({
beforeStop: function () { beforeStop: function () {
var sortedIDs = $(this).sortable('toArray'); $(this).sortable('toArray');
} }
}); });
$(sortableElem).disableSelection(); $(sortableElem).disableSelection();
@ -46,11 +48,9 @@ var modalPopup = ".wr-modalpopup";
var modalPopupContainer = modalPopup + " .modalpopup-container"; var modalPopupContainer = modalPopup + " .modalpopup-container";
var modalPopupContent = modalPopup + " .modalpopup-content"; var modalPopupContent = modalPopup + " .modalpopup-content";
var body = "body"; var body = "body";
var isInit = true; //var isInit = true;
$(".icon .text").res_text(0.2); $(".icon .text").res_text(0.2);
var resetPasswordServiceURL = "/devicemgt_admin/users/reset-password";
/* /*
* set popup maximum height function. * set popup maximum height function.
*/ */
@ -80,11 +80,9 @@ function hidePopup() {
*/ */
function getSelectedUsernames() { function getSelectedUsernames() {
var usernameList = []; var usernameList = [];
var userList = $("#user-grid").find('> tbody > tr'); var userList = $("#user-grid").find('tr.DTTT_selected');
userList.each(function () { userList.each(function () {
if ($(this).hasClass('DTTT_selected')) { usernameList.push($(this).data('username'));
usernameList.push($(this).attr('data-username'));
}
}); });
return usernameList; return usernameList;
} }
@ -96,7 +94,7 @@ function getSelectedUsernames() {
*/ */
$("a.invite-user-link").click(function () { $("a.invite-user-link").click(function () {
var usernameList = getSelectedUsernames(); var usernameList = getSelectedUsernames();
var inviteUserAPI = "/devicemgt_admin/users/email-invitation"; var inviteUserAPI = deviceMgtAPIsBasePath + "/users/send-invitation";
if (usernameList.length == 0) { if (usernameList.length == 0) {
$(modalPopupContent).html($("#errorUsers").html()); $(modalPopupContent).html($("#errorUsers").html());
@ -110,13 +108,18 @@ $("a.invite-user-link").click(function () {
invokerUtil.post( invokerUtil.post(
inviteUserAPI, inviteUserAPI,
usernameList, usernameList,
function () { // The success callback
function (data, textStatus, jqXHR) {
if (jqXHR.status == 200) {
$(modalPopupContent).html($('#invite-user-success-content').html()); $(modalPopupContent).html($('#invite-user-success-content').html());
$("a#invite-user-success-link").click(function () { $("a#invite-user-success-link").click(function () {
hidePopup(); hidePopup();
}); });
}
}, },
function () { // The error callback
function (jqXHR) {
console.log("error in invite-user API, status code: " + jqXHR.status);
$(modalPopupContent).html($('#invite-user-error-content').html()); $(modalPopupContent).html($('#invite-user-error-content').html());
$("a#invite-user-error-link").click(function () { $("a#invite-user-error-link").click(function () {
hidePopup(); hidePopup();
@ -137,16 +140,17 @@ $("a.invite-user-link").click(function () {
*/ */
function removeUser(uname, uid) { function removeUser(uname, uid) {
var username = uname; var username = uname;
var userid = uid; var userId = uid;
var removeUserAPI = "/devicemgt_admin/users?username=" + username; var removeUserAPI = deviceMgtAPIsBasePath + "/users/" + username;
$(modalPopupContent).html($('#remove-user-modal-content').html()); $(modalPopupContent).html($('#remove-user-modal-content').html());
showPopup(); showPopup();
$("a#remove-user-yes-link").click(function () { $("a#remove-user-yes-link").click(function () {
invokerUtil.delete( invokerUtil.delete(
removeUserAPI, removeUserAPI,
function () { function (data, textStatus, jqXHR) {
$("#" + userid).remove(); if (jqXHR.status == 200) {
$("#" + userId).remove();
// get new user-list-count // get new user-list-count
var newUserListCount = $(".user-list > span").length; var newUserListCount = $(".user-list > span").length;
// update user-listing-status-msg with new user-count // update user-listing-status-msg with new user-count
@ -156,8 +160,11 @@ function removeUser(uname, uid) {
$("a#remove-user-success-link").click(function () { $("a#remove-user-success-link").click(function () {
hidePopup(); hidePopup();
}); });
}
}, },
function () { // The error callback
function (jqXHR) {
console.log("error in remove-user API, status code: " + jqXHR.status);
$(modalPopupContent).html($('#remove-user-error-content').html()); $(modalPopupContent).html($('#remove-user-error-content').html());
$("a#remove-user-error-link").click(function () { $("a#remove-user-error-link").click(function () {
hidePopup(); hidePopup();
@ -202,29 +209,30 @@ function resetPassword(uname) {
$(errorMsgWrapper).removeClass("hidden"); $(errorMsgWrapper).removeClass("hidden");
} else { } else {
var resetPasswordFormData = {}; var resetPasswordFormData = {};
resetPasswordFormData.username = user; //resetPasswordFormData.username = user;
resetPasswordFormData.newPassword = window.btoa(unescape(encodeURIComponent(confirmedPassword))); resetPasswordFormData.newPassword = unescape(confirmedPassword);
var resetPasswordServiceURL = deviceMgtAPIsBasePath + "/admin/users/"+ user +"/credentials";
invokerUtil.post( invokerUtil.post(
resetPasswordServiceURL, resetPasswordServiceURL,
resetPasswordFormData, resetPasswordFormData,
function (data) { // The success callback // The success callback
data = JSON.parse(data); function (data, textStatus, jqXHR) {
if (data.statusCode == 201) { if (jqXHR.status == 200) {
$(modalPopupContent).html($('#reset-password-success-content').html()); $(modalPopupContent).html($('#reset-password-success-content').html());
$("a#reset-password-success-link").click(function () { $("a#reset-password-success-link").click(function () {
hidePopup(); hidePopup();
}); });
} }
}, function (data) { // The error callback },
if (data.statusCode == 400) { // The error callback
$(errorMsg).text("Old password does not match with the provided value."); function (jqXHR) {
$(errorMsgWrapper).removeClass("hidden"); console.log("error in reset-password API, status code: " + jqXHR.status);
} else { var payload = JSON.parse(jqXHR.responseText);
$(errorMsg).text("An unexpected error occurred. Please try again later."); $(errorMsg).text(payload.message);
$(errorMsgWrapper).removeClass("hidden"); $(errorMsgWrapper).removeClass("hidden");
} }
}
); );
} }
}); });
@ -250,7 +258,7 @@ $("#search-btn").click(function () {
* when a user clicks on the list item * when a user clicks on the list item
* initial mode and with out select mode. * initial mode and with out select mode.
*/ */
function InitiateViewOption() { function initiateViewOption() {
if ($("#can-view").val()) { if ($("#can-view").val()) {
$(location).attr('href', $(this).data("url")); $(location).attr('href', $(this).data("url"));
} else { } else {
@ -259,73 +267,111 @@ function InitiateViewOption() {
} }
} }
function loadUsers(searchParam) { function loadUsers() {
$("#loading-content").show(); var loadingContentIcon = "#loading-content";
var userListing = $("#user-listing"); $(loadingContentIcon).show();
var userListingSrc = userListing.attr("src");
$.template("user-listing", userListingSrc, function (template) { var dataFilter = function (data) {
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 = JSON.parse(data);
data = data.responseContent;
var viewModel = {}; var objects = [];
viewModel.users = data;
for (var i = 0; i < viewModel.users.length; i++) { $(data.users).each(function (index) {
viewModel.users[i].userid = viewModel.users[i].username.replace(/[^\w\s]/gi, ''); objects.push({
if (canRemove) { username: data.users[index].username,
viewModel.users[i].canRemove = true; 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
};
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>';
} }
if (canEdit) { },
viewModel.users[i].canEdit = true; {
class: "fade-edge remove-padding-top",
data: null,
render: function (data, type, row, meta) {
return '<i class="fw-user"></i> ' + data.username;
} }
if (canResetPassword) { },
viewModel.users[i].canResetPassword = true; {
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>';
} }
viewModel.users[i].adminUser = $("#user-table").data("user"); },
{
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>'
} }
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.');
} }
];
$('#user-grid').datatables_extended_serverside_paging(null, '/api/device-mgt/v1.0/users', dataFilter, columns, fnCreatedRow, null);
$("#loading-content").hide(); $("#loading-content").hide();
if (isInit) {
$('#user-grid').datatables_extended();
isInit = false;
}
$(".icon .text").res_text(0.2);
};
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');
}
);
});
} }
$(document).ready(function () { $(document).ready(function () {
loadUsers(); loadUsers();
$(".viewEnabledIcon").click(function () { $(".viewEnabledIcon").click(function () {
InitiateViewOption(); initiateViewOption();
}); });
if (!$("#can-invite").val()) { if (!$("#can-invite").val()) {
$("#invite-user-button").remove(); $("#invite-user-button").remove();
} }

5
components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.users/public/templates/listing.hbs
Unescape View File

@ -52,6 +52,11 @@
<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-key fw-stack-1x"></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>
<span class="hidden-xs hidden-on-grid-view">Reset</span> <span class="hidden-xs hidden-on-grid-view">Reset</span>
</a> </a>

7
components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.users/users.hbs
Unescape View File

@ -298,15 +298,13 @@
Enter new password Enter new password
<br><br> <br><br>
<div> <div>
<input type="password" class="form-control modal-input operationDataKeys" id="new-password" <input type="password" class="form-control modal-input operationDataKeys" id="new-password" data-key="message"/>
data-key="message"/>
</div> </div>
<br> <br>
Retype new password Retype new password
<br><br> <br><br>
<div> <div>
<input type="password" class="form-control modal-input operationDataKeys" <input type="password" class="form-control modal-input operationDataKeys" id="confirmed-password" data-key="message"/>
id="confirmed-password" data-key="message"/>
</div> </div>
<br> <br>
</h4> </h4>
@ -338,6 +336,7 @@
</div> </div>
</div> </div>
</div> </div>
{{/zone}} {{/zone}}
{{#zone "common-navigation"}} {{#zone "common-navigation"}}
<!--Later add the navigation menu from here--> <!--Later add the navigation menu from here-->

7
components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.users/users.js
Unescape View File

@ -26,13 +26,13 @@ function onRequest(context) {
return options.fn(this); return options.fn(this);
} }
}); });
var page = {}; var page = {};
var userModule = require("/app/modules/user.js")["userModule"]; var userModule = require("/app/modules/user.js")["userModule"];
var deviceMgtProps = require("/app/conf/devicemgt-props.js").config(); var deviceMgtProps = require("/app/conf/devicemgt-props.js").config();
page["adminUser"] = deviceMgtProps["adminUser"];
page["permissions"] = userModule.getUIPermissions(); 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")) { if (userModule.isAuthorized("/permission/admin/device-mgt/users/remove")) {
page["removePermitted"] = true; page["removePermitted"] = true;
@ -51,6 +51,5 @@ function onRequest(context) {
page["resetPasswordPermitted"] = true; page["resetPasswordPermitted"] = true;
} }
page["adminUser"] = deviceMgtProps.adminUser;
return page; return page;
} }
Write Preview
Loading…
Cancel
Save