Improved usability/implementation of adding/editing groups and campaigns.

pull/24/head
Jordan 2014-02-08 15:16:36 -06:00
parent 6cbc47e80c
commit 79ba4fadb6
4 changed files with 96 additions and 52 deletions

View File

@ -100,3 +100,8 @@
padding: 3px 6px; padding: 3px 6px;
font-size:9px; font-size:9px;
} }
.remove-row {
float:right;
cursor:pointer;
}

View File

@ -1,32 +1,42 @@
var app = angular.module('gophish', ['ngTable', 'ngResource']); var app = angular.module('gophish', ['ngTable', 'ngResource']);
app.factory('CampaignService', function($resource) { app.factory('CampaignService', function($resource) {
return $resource('/api/campaigns/:id?api_key=' + API_KEY); return $resource('/api/campaigns/:id?api_key=' + API_KEY, {
id: "@id"
}, {
update: {
method: 'PUT'
}
});
}); });
app.factory('GroupService', function($resource) { app.factory('GroupService', function($resource) {
return $resource('/api/groups/:id?api_key=' + API_KEY); return $resource('/api/groups/:id?api_key=' + API_KEY, {
id: "@id"
}, {
update: {
method: 'PUT'
}
});
}); });
app.controller('CampaignCtrl', function($scope, CampaignService) { app.controller('CampaignCtrl', function($scope, CampaignService) {
CampaignService.query(function(campaigns){ CampaignService.query(function(campaigns) {
$scope.campaigns = campaigns $scope.campaigns = campaigns
}) })
}); });
app.controller('GroupCtrl', function($scope, GroupService) { app.controller('GroupCtrl', function($scope, GroupService) {
GroupService.query(function(groups) { GroupService.query(function(groups) {
$scope.groups = groups $scope.groups = groups
}) })
$scope.editGroup = function(group) { $scope.editGroup = function(group) {
if (group === 'new') { if (group === 'new') {
$scope.newGroup = true; $scope.newGroup = true;
$scope.group = { $scope.group = {
name: '', name: '',
targets: [{ targets: [],
email: ''
}],
id: 0 id: 0
}; };
@ -35,4 +45,16 @@ app.controller('GroupCtrl', function($scope, GroupService) {
$scope.group = group; $scope.group = group;
} }
}; };
$scope.addTarget = function() {
if ($scope.newTarget.email != "") {
$scope.group.targets.push({
email: $scope.newTarget.email
});
$scope.newTarget.email = ""
}
};
$scope.removeTarget = function(target) {
$scope.group.targets.splice($scope.group.targets.indexOf(target), 1);
};
}) })

View File

@ -58,30 +58,31 @@
</tbody> </tbody>
</table> </table>
</div> </div>
</div> <!-- New Campaign Modal -->
</div> <div class="modal" id="newCampaignModal" tabindex="-1" role="dialog" aria-labelledby="campaignModalLabel" aria-hidden="true">
<!-- New Campaign Modal --> <div class="modal-dialog">
<div class="modal" id="newCampaignModal" tabindex="-1" role="dialog" aria-labelledby="campaignModalLabel" aria-hidden="true"> <div class="modal-content">
<div class="modal-dialog"> <div class="modal-header">
<div class="modal-content"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<div class="modal-header"> <h4 class="modal-title" id="campaignModalLabel">New Campaign</h4>
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title" id="campaignModalLabel">New Campaign</h4>
</div>
<form action="/">
<div class="modal-body">
<div class="form-group">
<label for="name">Name:</label>
<input type="text" class="form-control" id="name">
<label for="users">Users &amp; Groups:</label>
<input type="text" class="form-control" id="users">
</div> </div>
<form action="/">
<div class="modal-body">
<div class="form-group">
<label for="name">Name:</label>
<input type="text" class="form-control" id="name" placeholder="Campaign name">
<br />
<label for="users">Users &amp; Groups:</label>
<input type="text" class="form-control" placeholder="Group Name or email address" id="users">
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-primary" type="submit">Launch Campaign</button>
</div>
</form>
</div> </div>
<div class="modal-footer"> </div>
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-primary" type="submit">Launch Campaign</button>
</div>
</form>
</div> </div>
</div> </div>
</div> </div>

View File

@ -63,7 +63,7 @@
</div> </div>
</div> </div>
<!-- New Campaign Modal --> <!-- New Campaign Modal -->
<div class="modal" id="newGroupModal" tabindex="-1" role="dialog" aria-labelledby="groupModalLabel" aria-hidden="true" ng-controller="GroupCtrl"> <div class="modal" id="newGroupModal" tabindex="-1" role="dialog" aria-labelledby="groupModalLabel" aria-hidden="true" >
<div class="modal-dialog"> <div class="modal-dialog">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
@ -71,28 +71,44 @@
<h4 class="modal-title" ng-hide="newGroup" id="groupModalLabel">Edit Group: {{group.name}}</h4> <h4 class="modal-title" ng-hide="newGroup" id="groupModalLabel">Edit Group: {{group.name}}</h4>
<h4 class="modal-title" ng-show="newGroup" id="groupModalLabel">New Group</h4> <h4 class="modal-title" ng-show="newGroup" id="groupModalLabel">New Group</h4>
</div> </div>
<form action="/"> <div class="modal-body">
<div class="modal-body"> <label class="control-label" for="name">Name:</label>
<label class="control-label" for="name">Name:</label> <div class="form-group">
<div class="form-group"> <input type="text" class="form-control" ng-model="group.name" placeholder="Group name" id="name" />
<input type="text" class="form-control" placeholder="Group name" id="name" value={{group.name}} />
</div>
<div class="form-group">
<button class="btn btn-danger"><i class="fa fa-plus"></i> Bulk Import Users</button>
</div>
<label class="control-label" for="users">Users:</label>
<div class="input-group">
<input type="email" class="form-control" placeholder="test@example.com" id="users" />
<span class="input-group-btn">
<button class="btn btn-primary"><i class="fa fa-plus"></i> Add</button>
</span>
</div>
</div> </div>
<div class="modal-footer"> <div class="form-group">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button> <button class="btn btn-danger"><i class="fa fa-plus"></i> Bulk Import Users</button>
<button type="button" class="btn btn-primary" type="submit">Save Group</button>
</div> </div>
</form> <label class="control-label" for="users">Users:</label>
<form ng:submit="addTarget()">
<div class="input-group">
<input type="email" class="form-control" placeholder="test@example.com" id="users" ng-model="newTarget.email" />
<span class="input-group-btn">
<button class="btn btn-primary"><i class="fa fa-plus"></i> Add</button>
</span>
</div>
</form>
<br />
<table ng-table class="table table-hover table-striped table-condensed">
<thead>
<tr>
<th style="padding-left:0px; border:0;" class="col-sm-2">Members</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="target in group.targets" class="editable-row">
<td>{{target.email}}
<span ng-click="removeTarget(target)" class="remove-row"><i class="fa fa-trash-o"></i>
</span>
</td>
</tr>
</tbody>
</table>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-primary" type="submit">Save Group</button>
</div>
</div> </div>
</div> </div>
</div> </div>