webadmin: add user deletion dialog

This commit is contained in:
Johannes Zellner
2014-08-21 14:09:26 -07:00
parent e81f42f508
commit b06b8df746
6 changed files with 48 additions and 103 deletions
-1
View File
@@ -110,7 +110,6 @@
<script src="views/volumeunmount.js"></script>
<script src="views/userlist.js"></script>
<script src="views/usercreate.js"></script>
<script src="views/userdelete.js"></script>
<script src="views/userpassword.js"></script>
<script src="views/applist.js"></script>
<script src="views/appdetails.js"></script>
-3
View File
@@ -15,9 +15,6 @@ app.config(function ($routeProvider) {
}).when('/usercreate', {
controller: 'UserCreateController',
templateUrl: 'views/usercreate.html'
}).when('/userdelete', {
controller: 'UserDeleteController',
templateUrl: 'views/userdelete.html'
}).when('/userpassword', {
controller: 'UserPasswordController',
templateUrl: 'views/userpassword.html'
-46
View File
@@ -1,46 +0,0 @@
<div class="row">
<div class="col-md-3"></div>
<div class="col-md-6">
<div class="container-fluid">
<form class="form-signin" role="form" ng-submit="submit()">
<div class="row">
<div class="col-sm-12">
<h2 class="form-signin-heading pull-right">Delete User {{username}}</h2>
</div>
</div>
<div class="row">
<div class="col-sm-12">
Just to be sure you really want to delete this user, please type the user's name.
</div>
</div>
<div class="row">
<div class="col-sm-12">
<span ng-show="error.username" class="error show-animate">{{error.username}}</span>
<input type="text" class="form-control" ng-model="form.username" placeholder="Username" required autofocus>
</div>
</div>
<div class="row">
<div class="col-sm-12">
Give your password to verify that you are performing that action.
</div>
</div>
<div class="row">
<div class="col-sm-12">
<span ng-show="error.password" class="error show-animate">{{error.password}}</span>
<input type="password" class="form-control" ng-model="form.password" placeholder="Password" required>
</div>
</div>
<div class="row">
<div class="col-sm-6">
<input class="btn btn-block" ng-click="cancel()" type="button" value="Cancel"/>
</div>
<div class="col-sm-6">
<input class="btn btn-green btn-block" type="submit" ng-disabled="{{disabled}}" value="Delete User"/>
</div>
</div>
</form>
</div>
</div>
<div class="col-md-3"></div>
</div>
-47
View File
@@ -1,47 +0,0 @@
'use strict';
function UserDeleteController ($scope, $routeParams, Client) {
if (!$routeParams.username) {
console.error('No user provided.');
return window.location.replace('#/volumelist');
}
$scope.disabled = false;
$scope.username = $routeParams.username;
$scope.form = {};
$scope.form.username = '';
$scope.form.password = '';
$scope.error = {};
$scope.submit = function () {
$scope.error.username = null;
$scope.error.password = null;
if ($routeParams.username !== $scope.form.username) {
$scope.error.username = 'Username does not match';
return;
}
$scope.disabled = true;
Client.removeUser($routeParams.username, $scope.form.password, function (error, result) {
if (error) {
console.error('Unable to delete user.', error);
if (error.statusCode === 401) {
$scope.error.password = 'Wrong password';
}
$scope.disabled = false;
return;
}
console.debug('Successfully deleted user', $scope.form.username);
window.location.replace('#/volumelist');
});
};
$scope.cancel = function () {
window.history.back();
};
}
+30 -1
View File
@@ -26,7 +26,36 @@
<tr ng-repeat="user in users">
<td>{{ user.username }} <span ng-show="isMe(user)" class="badge" style="margin-left: 20px;">This is you!</span></td>
<td style="text-align: right;">
<button ng-show="!isMe(user)" ng-click="deleteUser(user.username)" class="btn btn-xs btn-danger"><i class="fa fa-trash-o"></i> Delete</button>
<button ng-show="!isMe(user)" data-toggle="modal" data-target="#userDeleteModal-{{user.username}}" class="btn btn-xs btn-danger"><i class="fa fa-trash-o"></i> Delete</button>
<!-- Modal really delete -->
<div class="modal fade" id="userDeleteModal-{{user.username}}" tabindex="-1" role="dialog" aria-labelledby="userDeleteModalLabel-{{user.username}}" aria-hidden="true" style="text-align: left;">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title" id="userDeleteModalLabel-{{user.username}}">Delete user {{ user.username }}</h4>
</div>
<div class="modal-body">
<form class="form-user-delete" role="form" ng-submit="deleteUser(user)">
<div class="form-group">
<label class="control-label" for="inputUsername">Just to be sure you really want to delete this user, please type the user's name</label>
<input type="text" class="form-control" ng-model="userDeleteForm.username" id="inputUsername" placeholder="Username" required autofocus>
</div>
<div class="form-group">
<label class="control-label" for="inputPassword">Give your password to verify that you are performing that action</label>
<input type="password" class="form-control" ng-model="userDeleteForm.password" id="inputPassword" placeholder="Password" required>
</div>
<input class="hide" type="submit"/>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-danger" ng-click="deleteUser(user)">Delete</button>
</div>
</div>
</div>
</div>
</td>
</tr>
</tbody>
+18 -5
View File
@@ -1,13 +1,31 @@
/* global $:true */
'use strict';
function UserListController ($scope, Client) {
$scope.ready = false;
$scope.users = [];
$scope.userDeleteForm = {
username: '',
password: ''
};
$scope.isMe = function (user) {
return user.username === Client.getUserInfo().username;
};
$scope.deleteUser = function (user) {
// TODO add busy indicator and block form
if ($scope.userDeleteForm.username !== user.username) return console.error('Username does not match');
Client.removeUser(user.username, $scope.userDeleteForm.password, function (error, result) {
if (error && error.statusCode === 401) return console.error('Wrong password');
if (error) return console.error('Unable to delete user.', error);
$('#userDeleteModal-' + user.username).modal('hide');
});
};
function refresh() {
Client.listUsers(function (error, result) {
if (error) return console.error('Unable to get user listing.', error);
@@ -21,10 +39,5 @@ function UserListController ($scope, Client) {
window.location.href = '#/usercreate';
};
$scope.deleteUser = function (username) {
// TODO urlencode?
window.location.href = '#/userdelete?username=' + username;
};
refresh();
}