jjkiers/cloudron-box
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Rework invite/password reset UI

Browse Source
This commit is contained in:
Johannes Zellner
2021-04-15 17:16:15 +02:00
parent 737b9fb73e
commit 11cc074a09
2 changed files with 30 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/users.html
+20 -10
View File
@@ -325,19 +325,29 @@
<h4 class="modal-title">{{ 'users.passwordResetDialog.title' | tr:{ username: (invitation.user.username || invitation.user.email) } }}</h4>
</div>
<div class="modal-body">
<p>{{ 'users.passwordResetDialog.description' | tr:{ username: (invitation.user.username || invitation.user.email) } }}</p>
<div class="input-group">
<input type="text" id="setupLinkInput" class="form-control" ng-value="invitation.setupLink" readonly/>
<span class="input-group-btn">
<button class="btn btn-default" id="setupLinkButton" type="button" data-clipboard-target="#setupLinkInput"><i class="fa fa-clipboard"></i></button>
</span>
<div ng-hide="invitation.setupLink">
<p>If the password rest or invite link is expired or lost, a new one can be generated. A new reset and invite link, will invalidate the old link immediately.</p>
<button type="button" class="btn btn-primary" ng-click="invitation.generateNewLink()" ng-disabled="invitation.busyNew"><i class="fa fa-circle-notch fa-spin" ng-show="invitation.busyNew"></i> Generate new link</button>
</div>
<div ng-show="invitation.setupLink">
<p>{{ 'users.passwordResetDialog.description' | tr:{ username: (invitation.user.username || invitation.user.email) } }}</p>
<div class="input-group" style="margin-bottom: 10px">
<input type="text" id="setupLinkInput" class="form-control" ng-value="invitation.setupLink" readonly/>
<span class="input-group-btn">
<button class="btn btn-default" id="setupLinkButton" type="button" data-clipboard-target="#setupLinkInput"><i class="fa fa-clipboard"></i></button>
</span>
</div>
<button type="button" class="btn btn-primary" ng-click="invitation.email()" ng-disabled="invitation.busySend"><i class="fa fa-circle-notch fa-spin" ng-show="invitation.busySend"></i> {{ 'users.passwordResetDialog.sendEmailLinkAction' | tr }}</button>
</div>
<hr/>
<div>
<p ng-hide="invitation.user.twoFactorAuthenticationEnabled">This user has no 2FA set up.</p>
<p ng-show="invitation.user.twoFactorAuthenticationEnabled">This user has 2FA enabled. If the user has problems to log in, the 2FA setup can be disabled here until the user enables it again</p>
<button type="button" class="btn btn-danger" ng-click="invitation.reset2FA()" ng-show="invitation.user.twoFactorAuthenticationEnabled" ng-disabled="invitation.reset2FABusy"><i class="fa fa-circle-notch fa-spin" ng-show="invitation.reset2FABusy"></i> {{ 'users.passwordResetDialog.disable2FAAction' | tr }}</button>
</div>
<br/>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger pull-left" ng-click="invitation.reset2FA()" ng-disabled="!invitation.user.twoFactorAuthenticationEnabled || invitation.reset2FABusy"><i class="fa fa-circle-notch fa-spin" ng-show="invitation.reset2FABusy"></i> {{ 'users.passwordResetDialog.disable2FAAction' | tr }}</button>
<button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.cancel' | tr }}</button>
<button type="button" class="btn btn-success" ng-click="invitation.email()" ng-disabled="invitation.busy"><i class="fa fa-circle-notch fa-spin" ng-show="invitation.busy"></i> {{ 'users.passwordResetDialog.sendEmailLinkAction' | tr }}</button>
<button type="button" class="btn btn-default" data-dismiss="modal">{{ 'main.dialog.close' | tr }}</button>
</div>
</div>
</div>
src/views/users.js
+10 -9
View File
@@ -535,22 +535,25 @@ angular.module('Application').controller('UsersController', ['$scope', '$locatio
$scope.invitation.busy = false;
$scope.invitation.reset2FABusy = false;
Client.createInvite(user.id, function (error, result) {
$('#invitationModal').modal('show');
},
generateNewLink: function () {
$scope.invitation.busyNew = true;
Client.createInvite($scope.invitation.user.id, function (error, result) {
$scope.invitation.busyNew = false;
if (error) return console.error(error);
$scope.invitation.setupLink = result.inviteLink;
$('#invitationModal').modal('show');
});
},
email: function () {
$scope.invitation.busy = true;
$scope.invitation.busySend = true;
Client.sendInvite($scope.invitation.user.id, function (error) {
$scope.invitation.busy = false;
$scope.invitation.busySend = false;
if (error) return console.error(error);
$('#invitationModal').modal('hide');
});
},
@@ -563,8 +566,6 @@ angular.module('Application').controller('UsersController', ['$scope', '$locatio
// ensure to update changed user state
refreshUsers();
$('#invitationModal').modal('hide');
});
}
};