mirror of
https://repository.entgra.net/community/device-mgt-core.git
synced 2025-10-06 02:01:45 +00:00
Adding user password change UI
This commit is contained in:
dilanua
parent
f71106d011
commit
e07991174d
@ -0,0 +1,82 @@
|
||||
/**
|
||||
* Checks if provided input is valid against RegEx input.
|
||||
*
|
||||
* @param regExp Regular expression
|
||||
* @param inputString Input string to check
|
||||
* @returns {boolean} Returns true if input matches RegEx
|
||||
*/
|
||||
function inputIsValid(regExp, inputString) {
|
||||
return regExp.test(inputString);
|
||||
}
|
||||
|
||||
$(document).ready(function () {
|
||||
var modalPopup = ".wr-modalpopup";
|
||||
// var modalPopupContainer = modalPopup + " .modalpopup-container";
|
||||
var modalPopupContent = modalPopup + " .modalpopup-content";
|
||||
|
||||
$("#change-password").click(function () {
|
||||
|
||||
$(modalPopupContent).html($('#change-password-window').html());
|
||||
showPopup();
|
||||
|
||||
$("a#change-password-yes-link").click(function () {
|
||||
var oldPassword = $("#old-password").val();
|
||||
var newPassword = $("#new-password").val();
|
||||
var confirmedPassword = $("#confirmed-password").val();
|
||||
var user = $("#user").val();
|
||||
|
||||
var errorMsgWrapper = "#notification-error-msg";
|
||||
var errorMsg = "#notification-error-msg span";
|
||||
if (!oldPassword) {
|
||||
$(errorMsg).text("Old password is a required field. It cannot be empty.");
|
||||
$(errorMsgWrapper).removeClass("hidden");
|
||||
} else if (!newPassword) {
|
||||
$(errorMsg).text("New password is a required field. It cannot be empty.");
|
||||
$(errorMsgWrapper).removeClass("hidden");
|
||||
} else if (!confirmedPassword) {
|
||||
$(errorMsg).text("Retyping the new password is required.");
|
||||
$(errorMsgWrapper).removeClass("hidden");
|
||||
} else if (confirmedPassword != newPassword) {
|
||||
$(errorMsg).text("New password doesn't match the confirmation.");
|
||||
$(errorMsgWrapper).removeClass("hidden");
|
||||
} else if (!inputIsValid(/^[\S]{5,30}$/, confirmedPassword)) {
|
||||
$(errorMsg).text("Password should be minimum 5 characters long, should not include any whitespaces.");
|
||||
$(errorMsgWrapper).removeClass("hidden");
|
||||
} else {
|
||||
var changePasswordFormData = {};
|
||||
//changePasswordFormData.username = user;
|
||||
changePasswordFormData.newPassword = unescape((confirmedPassword));
|
||||
changePasswordFormData.oldPassword = unescape((oldPassword));
|
||||
|
||||
|
||||
var changePasswordAPI = "/api/device-mgt/v1.0/users" + user + "/credentials";
|
||||
|
||||
invokerUtil.put(
|
||||
changePasswordAPI,
|
||||
changePasswordFormData,
|
||||
function (data, textStatus, jqXHR) {
|
||||
if (jqXHR.status == 200 && data) {
|
||||
$(modalPopupContent).html($('#change-password-success-content').html());
|
||||
$("#change-password-success-link").click(function () {
|
||||
hidePopup();
|
||||
});
|
||||
}
|
||||
}, function (jqXHR) {
|
||||
if (jqXHR.status == 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");
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
$("a#change-password-cancel-link").click(function () {
|
||||
hidePopup();
|
||||
});
|
||||
});
|
||||
});
|
||||
@ -17,6 +17,70 @@
|
||||
}}
|
||||
{{#zone "userMenu-items"}}
|
||||
<li>
|
||||
<a href="{{@app.context}}/logout">Logout</a>
|
||||
<a href="javascript:void(0)" id="change-password">Change password</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="{{@app.context}}/logout">Sign out</a>
|
||||
</li>
|
||||
|
||||
<div id="change-password-window" class="hide">
|
||||
<input type="hidden" id="user" value="{{username}}">
|
||||
<div class="content">
|
||||
<div class="row">
|
||||
<div class="col-lg-5 col-md-6 col-centered">
|
||||
<h4>
|
||||
<span class="fw-stack">
|
||||
<i class="fw fw-ring fw-stack-2x"></i>
|
||||
<i class="fw fw-key fw-stack-1x"></i>
|
||||
</span>
|
||||
Change Password
|
||||
<br><br>
|
||||
</h4>
|
||||
<div id="notification-error-msg" class="alert alert-danger hidden" role="alert">
|
||||
<i class="icon fw fw-error"></i><span></span>
|
||||
</div>
|
||||
<h3>
|
||||
Enter old password *
|
||||
<br><br>
|
||||
<div>
|
||||
<input type="password" class="form-control modal-input operationDataKeys" id="old-password" data-key="message"/>
|
||||
</div>
|
||||
<br>
|
||||
Enter new password *
|
||||
<br><br>
|
||||
<div>
|
||||
<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"/>
|
||||
</div>
|
||||
<br>
|
||||
</h3>
|
||||
<div class="buttons">
|
||||
<a href="#" id="change-password-yes-link" class="btn-operations">Update</a>
|
||||
<a href="#" id="change-password-cancel-link" class="btn-operations">Cancel</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="change-password-success-content" class="hide">
|
||||
<div class="content">
|
||||
<div class="row">
|
||||
<div class="col-lg-5 col-md-6 col-centered">
|
||||
<h3>Password change is successful.</h3>
|
||||
<div class="buttons">
|
||||
<a href="#" id="change-password-success-link" class="btn-operations">Ok</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{/zone}}
|
||||
{{#zone "bottomJs"}}
|
||||
<script src="{{@unit.publicUri}}/js/user-menu.js"></script>
|
||||
{{/zone}}
|
||||
@ -0,0 +1,4 @@
|
||||
function onRequest() {
|
||||
var constants = require("/app/modules/constants.js");
|
||||
return session.get(constants["USER_SESSION_KEY"]);
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user