alahouze/accountant
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Rewrote entry management.

Browse Source
This commit is contained in:
Alexis Lahouze 2015-08-16 00:40:51 +02:00
parent caa68a7385
commit 913b39076e
2 changed files with 167 additions and 233 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

133
accountant/frontend/static/js/entries.js
View File

@ -26,8 +26,8 @@ accountantApp
.controller( .controller(
"EntryController", [ "EntryController", [
"$scope", "$http", "$rootScope", "$filter", "$routeParams", "Entries", "$scope", "$http", "$rootScope", "$filter", "$routeParams", "notificationService", "Entries",
function($scope, $http, $rootScope, $filter, $routeParams, Entries) { function($scope, $http, $rootScope, $filter, $routeParams, notificationService, Entries) {
// Range for entries. // Range for entries.
$scope.begin = moment.utc().startOf('month'); $scope.begin = moment.utc().startOf('month');
$scope.end = moment.utc().endOf('month'); $scope.end = moment.utc().endOf('month');
@ -39,15 +39,15 @@ accountantApp
$scope.account = null; $scope.account = null;
// Function to reset the new entry. // Function to reset the new entry.
$scope.resetNewEntry = function() { $scope.addEntry = function() {
// The new entry. if(!$scope.inserted) {
$scope.newEntry = new Entries({}); $scope.inserted = new Entries();
$scope.inserted.account_id = $routeParams.accountId;
$scope.entries.splice(0, 0, $scope.inserted);
}
}; };
$scope.resetNewEntry();
$scope.setExtremes = function(e) { $scope.setExtremes = function(e) {
begin = moment.utc(e.min); begin = moment.utc(e.min);
end = moment.utc(e.max); end = moment.utc(e.max);
@ -279,6 +279,9 @@ accountantApp
$scope.getAccountStatus($routeParams.accountId); $scope.getAccountStatus($routeParams.accountId);
}); });
/*
* Get account status.
*/
$scope.getAccountStatus = function(accountId) { $scope.getAccountStatus = function(accountId) {
$scope.categoriesChartConfig.loading = true; $scope.categoriesChartConfig.loading = true;
@ -335,94 +338,72 @@ accountantApp
}); });
}; };
// Starts editing an entry
$scope.editEntry = function(entry) {
// Enter edit state.
entry.confirmed=true;
entry.editing=true;
};
// Cancel current editing entry or clears field if a new one. // Cancel current editing entry or clears field if a new one.
$scope.cancelEditEntry = function(entry) { $scope.cancelEditEntry = function(entry, rowform) {
sold = entry.sold; if(entry == $scope.inserted) {
entry.$get(function(entry) { $scope.entries.splice(0, 1);
entry.sold = sold; } else {
}); rowform.$cancel();
}
}; };
// Points an entry. /*
$scope.togglePointedEntry = function(entry) { * Toggle pointed indicator for an entry.
entry.confirmed = true; */
$scope.togglePointedEntry = function(entry, rowform) {
entry.pointed = !entry.pointed; entry.pointed = !entry.pointed;
$scope.saveEntry(entry); // Save entry if not editing it.
if(!rowform.$visible) {
$scope.saveEntry(entry);
}
}; };
// Confirm an entry. /*
$scope.confirmEntry = function(entry) { * Toggle cancel indicator for an entry.
entry.confirmed = true; */
$scope.saveEntry(entry);
};
// Confirm an entry.
$scope.toggleCanceledEntry = function(entry) { $scope.toggleCanceledEntry = function(entry) {
entry.canceled = !entry.canceled; entry.canceled = !entry.canceled;
$scope.saveEntry(entry); $scope.saveEntry(entry);
}; };
// Create an new entry. /*
$scope.createEntry = function(entry) { * Save an entry and emit entrySavedEvent, or entryCreatedEvent.
entry.account_id = $scope.account.id; */
$scope.saveEntry = function($data, $index) {
// Check if $data is already a resource.
var entry;
// Ajax call to create an entry if($data.$save) {
$scope.newEntry.$save(function(data) { entry = $data;
$scope.resetNewEntry(); } else {
entry = $scope.entries[$index];
// Send the "entry saved" event. entry = angular.merge(entry, $data);
$scope.$emit("entryCreatedEvent", entry);
});
};
$rootScope.$on("entryCreatedEvent", function(e, entry) {
new PNotify({
type: "success",
title: "Save",
text: "Entry #" + entry.id + " created."
});
});
// Saves an existing entry.
$scope.saveEntry = function(entry) {
if(!entry.account_id) {
entry.account_id = $scope.account.id;
} }
sold = entry.sold; entry.confirmed = true;
// Ajax call to save an entry var promise = entry.$save();
entry.$save(function(data) {
data.sold = sold;
// Send the "entry saved" event. if(entry == $scope.inserted) {
$scope.$emit("entrySavedEvent", entry); promise = promise.then(function(data) {
}); $scope.inserted = false;
};
$rootScope.$on("entrySavedEvent", function(e, entry) { notificationService.success("Entry #" + data.id + " created.");
$scope.getAccountStatus($routeParams.accountId);
});
$rootScope.$on("entrySavedEvent", function(e, entry) {
new PNotify({
type: "success",
title: "Save",
text: "Entry #" + entry.id + " saved."
}); });
}); } else {
promise = promise.then(function(data) {
notificationService.success("Entry #" + data.id + " saved.");
});
}
promise = promise.then(function(data) {
$scope.getAccountStatus($routeParams.accountId);
});
return promise;
};
$scope.removeEntry = function(entry) { $scope.removeEntry = function(entry) {
$scope.removingEntry = entry; $scope.removingEntry = entry;

267
accountant/frontend/static/templates/entries.html
View File

@ -16,162 +16,115 @@
--> -->
<!-- vim: set tw=80 ts=2 sw=2 sts=2: --> <!-- vim: set tw=80 ts=2 sw=2 sts=2: -->
<!-- Chart row --> <!-- Chart row -->
<div class="row"> <div>
<!-- Sold evolution chart placeholder --> <div class="row">
<highchart id="sold-chart" config="soldChartConfig" class="col-md-8"></highchart> <!-- Sold evolution chart placeholder -->
<highchart id="sold-chart" config="soldChartConfig" class="col-md-8"></highchart>
<!-- Category piechart --> <!-- Category piechart -->
<highchart id="categories-chart" config="categoriesChartConfig" class="col-md-4"></highchart> <highchart id="categories-chart" config="categoriesChartConfig" class="col-md-4"></highchart>
</div> </div>
<!-- Row with entry table --> <div class="row">
<div class="row"> <div class="col-md-3 col-md-offset-1">
<table class="table table-condensed table-hover"> <button class="btn btn-success" ng-click="addEntry()">Ajouter</button>
<!-- Head of the table containing column headers and size --> </div>
<thead> </div>
<tr>
<th class="col-md-1">Date d'op.</th> <!-- Row with entry table -->
<th>Libell&eacute; de l'op&eacute;ration</th> <div class="row">
<th class="col-md-1">Montant</th> <table class="table table-condensed table-hover">
<th class="col-md-1">Solde</th> <!-- Head of the table containing column headers and size -->
<th class="col-md-3">Cat&eacute;gorie</th> <thead>
<th class="col-md-2">Actions</th> <tr>
</tr> <th class="col-md-1">Date d'op.</th>
</thead> <th>Libell&eacute; de l'op&eacute;ration</th>
<th class="col-md-1">Montant</th>
<!-- Body of the table containing the entries --> <th class="col-md-1">Solde</th>
<tbody> <th class="col-md-3">Cat&eacute;gorie</th>
<!-- The new entry row. --> <th class="col-md-2">Actions</th>
<tr class="form-inline"> </tr>
<td class="col-md-1"> </thead>
<input type="text" class="form-control input-sm" ng-model="newEntry.operation_date" data-date-format="yyyy-MM-dd" bs-datepicker/>
</td> <!-- Body of the table containing the entries -->
<tbody>
<td> <!-- Row for an editing entry. -->
<input type="text" class="form-control input-sm" ng-model="newEntry.label"/> <tr id="{{entry.id}}" class="form-inline"
</td> ng-class="{stroke: entry.canceled, italic: !entry.confirmed, warning: entry.sold < 0, danger: entry.sold < account.authorized_overdraft}"
ng-repeat="entry in entries">
<td class="col-md-1"> <td>
<input type="text" class="form-control input-sm" ng-model="newEntry.value"/> <span editable-text="entry.operation_date" e-data-date-format="yyyy-MM-dd" e-bs-datepicker e-class="input-sm" e-form="rowform" e-required>
</td> <small>{{ entry.operation_date | date:"yyyy-MM-dd" }}</small>
</span>
<td class="col-md-1"> </td>
<!-- The new entry has no sold. -->
</td> <td>
<span editable-text="entry.label" e-class="input-sm" e-placeholder="Libélé de l'opération" e-name="label" e-form="rowform" e-required>
<td class="col-md-3"> <small>{{ entry.label }}</small>
<input type="text" class="form-control input-sm" ng-model="newEntry.category"/> </span>
</td> </td>
<td class="col-md-2"> <td>
<div class="btn-group"> <span editable-number="entry.value" e-class="input-sm" e-name="value" e-form="rowform" e-required>
<button type="button" class="btn btn-xs btn-success" <small>{{ entry.value }}</small>
ng-click="createEntry(newEntry)" title="Save"> </span>
<span class="fa fa-plus"></span> </td>
</button>
<td ng-class="{'text-warning': entry.sold < 0, 'text-danger': entry.sold < account.authorized_overdraft}">
<button type="button" class="btn btn-xs btn-default" <small>{{ entry.sold }}</small>
ng-click="newEntry.pointed=!newEntry.pointed" </td>
ng-class="{active: newEntry.pointed}" title="point">
<span ng-class="{'fa fa-check-square-o': newEntry.pointed, 'fa fa-square-o': !newEntry.pointed}"></span> <td>
</button> <span editable-text="entry.category" e-class="input-sm" e-placeholder="Catégorie" e-form="rowform" e-required>
<small>{{ entry.category }}</small>
<button type="button" class="btn btn-xs btn-default" </span>
ng-click="resetNewEntry()" title="Cancel"> </td>
<span class="fa fa-times"></span>
</button> <td>
</div> <form editable-form name="rowform" onbeforesave="saveEntry($data, $index)" shown="entry == inserted">
</td> <!-- new row buttons -->
</tr> <div class="btn-group">
<!-- Save current entry, for editing and non-confirmed non-canceled entries -->
<!-- Row for an editing entry. --> <button type="submit" class="btn btn-xs btn-success"
<tr id="entry_{{entry.id}}" class="form-inline" ng-if="!entry.canceled && (!entry.confirmed || rowform.$visible)"
ng-class="{stroke: entry.canceled, italic: !entry.confirmed, warning: entry.sold < 0, danger: entry.sold < account.authorized_overdraft}" title="Save">
ng-repeat-start="entry in entries" ng-if="entry.editing"> <span class="fa fa-floppy-o"></span>
<td class="col-md-1"> </button>
<input type="text" class="form-control input-sm" ng-model="entry.operation_date" data-date-format="yyyy-MM-dd" bs-datepicker/>
</td> <!-- Edit entry, for non-canceled and non-editing entries-->
<button type="button" class="btn btn-xs btn-default"
<td> ng-if="!entry.canceled && !rowform.$visible"
<input type="text" class="form-control input-sm" ng-model="entry.label"/> ng-click="rowform.$show()" title="edit">
</td> <span class="fa fa-pencil-square-o"></span>
</button>
<td class="col-md-1 col-xs-1">
<input type="text" class="form-control input-sm" ng-model="entry.value"/> <!-- Cancel edition, for editing entries. -->
</td> <button type="button" class="btn btn-xs btn-default"
ng-if="rowform.$visible"
<td class="col-md-1" ng-class="{'text-warning': entry.sold < 0, 'text-danger': entry.sold < account.authorized_overdraft}"> ng-click="cancelEditEntry(entry, rowform)">
<small>{{entry.sold}}</small> <span class="fa fa-times"></span>
</td> </button>
<td class="col-md-3"> <!-- Toggle pointed entry, for non-canceled entries. -->
<input type="text" class="form-control input-sm" ng-model="entry.category"/> <button type="button" class="btn btn-xs btn-default"
</td> ng-if="!entry.canceled"
ng-click="togglePointedEntry(entry, rowform)"
<td class="col-md-2"> ng-class="{active: entry.pointed}" title="point">
<div class="btn-group"> <span ng-class="{'fa fa-check-square-o': entry.pointed, 'fa fa-square-o': !entry.pointed}"></span>
<button type="button" class="btn btn-xs btn-success" ng-click="saveEntry(entry)" title="Save"> </button>
<span class="fa fa-floppy-o"></span>
</button> <!-- Toggle canceled entry, for non-editing entries. -->
<button type="button" class="btn btn-xs btn-default"
<button type="button" class="btn btn-xs btn-default" ng-click="cancelEditEntry(entry)" title="Cancel"> ng-click="toggleCanceledEntry(entry)"
<span class="fa fa-times"></span> ng-if="!rowform.$visible"
</button> ng-class="{active: entry.canceled}" title="cancel">
<span class="fa fa-remove"></span>
<button type="button" class="btn btn-xs btn-default" </button>
ng-click="entry.pointed = !entry.pointed" </div>
ng-class="{active: entry.pointed}" title="point"> </form>
<span ng-class="{'fa fa-check-square-o': entry.pointed, 'fa fa-square-o': !entry.pointed}"></span> </td>
</button> </tr>
</div> </tbody>
</td> </table>
</tr> </div>
<!-- Row for a displayed entry. -->
<tr id="entry_{{entry.id}}"
ng-class="{stroke: entry.canceled, italic: !entry.confirmed, warning: entry.sold < 0, danger: entry.sold < account.authorized_overdraft}"
ng-repeat-end ng-if="!entry.editing">
<td class="col-md-1">
<small><span>{{entry.operation_date | date:"yyyy-MM-dd"}}</span></small>
</td>
<td>
<small><span>{{entry.label}}</span></small>
</td>
<td class="col-md-1">
<small><span>{{entry.value}}</span></small>
</td>
<td class="col-md-1" ng-class="{'text-warning': entry.sold < 0, 'text-danger': entry.sold < account.authorized_overdraft}">
<small>{{entry.sold}}</small>
</td>
<td class="col-md-3">
<small><span>{{entry.category}}</span></small>
</td>
<td class="col-md-2">
<!-- Button group for a saved entry. -->
<div class="btn-group">
<button class="btn btn-xs btn-success" ng-if="!entry.confirmed && !entry.canceled" ng-click="confirmEntry(entry)" title="Save">
<span class="fa fa-plus"></span>
</button>
<button class="btn btn-xs btn-default" ng-if="!entry.canceled" ng-click="editEntry(entry)" title="edit">
<span class="fa fa-pencil-square-o"></span>
</button>
<button class="btn btn-xs btn-default" ng-if="!entry.canceled" ng-click="togglePointedEntry(entry)" ng-class="{active: entry.pointed}" title="point">
<span ng-class="{'fa fa-check-square-o': entry.pointed, 'fa fa-square-o': !entry.pointed}"></span>
</button>
<button class="btn btn-xs btn-default" ng-click="toggleCanceledEntry(entry)" ng-class="{active: entry.canceled}" title="cancel">
<span class="fa fa-remove"></span>
</button>
</div>
</td>
</tr>
</tbody>
</table>
</div> </div>