Rewrote entry management.
This commit is contained in:
Alexis Lahouze
parent
caa68a7385
commit
913b39076e
@ -26,8 +26,8 @@ accountantApp
|
||||
|
||||
.controller(
|
||||
"EntryController", [
|
||||
"$scope", "$http", "$rootScope", "$filter", "$routeParams", "Entries",
|
||||
function($scope, $http, $rootScope, $filter, $routeParams, Entries) {
|
||||
"$scope", "$http", "$rootScope", "$filter", "$routeParams", "notificationService", "Entries",
|
||||
function($scope, $http, $rootScope, $filter, $routeParams, notificationService, Entries) {
|
||||
// Range for entries.
|
||||
$scope.begin = moment.utc().startOf('month');
|
||||
$scope.end = moment.utc().endOf('month');
|
||||
@ -39,15 +39,15 @@ accountantApp
|
||||
|
||||
$scope.account = null;
|
||||
|
||||
|
||||
// Function to reset the new entry.
|
||||
$scope.resetNewEntry = function() {
|
||||
// The new entry.
|
||||
$scope.newEntry = new Entries({});
|
||||
$scope.addEntry = function() {
|
||||
if(!$scope.inserted) {
|
||||
$scope.inserted = new Entries();
|
||||
$scope.inserted.account_id = $routeParams.accountId;
|
||||
$scope.entries.splice(0, 0, $scope.inserted);
|
||||
}
|
||||
};
|
||||
|
||||
$scope.resetNewEntry();
|
||||
|
||||
$scope.setExtremes = function(e) {
|
||||
begin = moment.utc(e.min);
|
||||
end = moment.utc(e.max);
|
||||
@ -279,6 +279,9 @@ accountantApp
|
||||
$scope.getAccountStatus($routeParams.accountId);
|
||||
});
|
||||
|
||||
/*
|
||||
* Get account status.
|
||||
*/
|
||||
$scope.getAccountStatus = function(accountId) {
|
||||
$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.
|
||||
$scope.cancelEditEntry = function(entry) {
|
||||
sold = entry.sold;
|
||||
entry.$get(function(entry) {
|
||||
entry.sold = sold;
|
||||
});
|
||||
$scope.cancelEditEntry = function(entry, rowform) {
|
||||
if(entry == $scope.inserted) {
|
||||
$scope.entries.splice(0, 1);
|
||||
} else {
|
||||
rowform.$cancel();
|
||||
}
|
||||
};
|
||||
|
||||
// Points an entry.
|
||||
$scope.togglePointedEntry = function(entry) {
|
||||
entry.confirmed = true;
|
||||
/*
|
||||
* Toggle pointed indicator for an entry.
|
||||
*/
|
||||
$scope.togglePointedEntry = function(entry, rowform) {
|
||||
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) {
|
||||
entry.confirmed = true;
|
||||
|
||||
$scope.saveEntry(entry);
|
||||
};
|
||||
|
||||
// Confirm an entry.
|
||||
/*
|
||||
* Toggle cancel indicator for an entry.
|
||||
*/
|
||||
$scope.toggleCanceledEntry = function(entry) {
|
||||
entry.canceled = !entry.canceled;
|
||||
|
||||
$scope.saveEntry(entry);
|
||||
};
|
||||
|
||||
// Create an new entry.
|
||||
$scope.createEntry = function(entry) {
|
||||
entry.account_id = $scope.account.id;
|
||||
/*
|
||||
* Save an entry and emit entrySavedEvent, or entryCreatedEvent.
|
||||
*/
|
||||
$scope.saveEntry = function($data, $index) {
|
||||
// Check if $data is already a resource.
|
||||
var entry;
|
||||
|
||||
// Ajax call to create an entry
|
||||
$scope.newEntry.$save(function(data) {
|
||||
$scope.resetNewEntry();
|
||||
|
||||
// Send the "entry saved" event.
|
||||
$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;
|
||||
if($data.$save) {
|
||||
entry = $data;
|
||||
} else {
|
||||
entry = $scope.entries[$index];
|
||||
entry = angular.merge(entry, $data);
|
||||
}
|
||||
|
||||
sold = entry.sold;
|
||||
entry.confirmed = true;
|
||||
|
||||
// Ajax call to save an entry
|
||||
entry.$save(function(data) {
|
||||
data.sold = sold;
|
||||
var promise = entry.$save();
|
||||
|
||||
// Send the "entry saved" event.
|
||||
$scope.$emit("entrySavedEvent", entry);
|
||||
});
|
||||
};
|
||||
if(entry == $scope.inserted) {
|
||||
promise = promise.then(function(data) {
|
||||
$scope.inserted = false;
|
||||
|
||||
$rootScope.$on("entrySavedEvent", function(e, entry) {
|
||||
$scope.getAccountStatus($routeParams.accountId);
|
||||
});
|
||||
|
||||
$rootScope.$on("entrySavedEvent", function(e, entry) {
|
||||
new PNotify({
|
||||
type: "success",
|
||||
title: "Save",
|
||||
text: "Entry #" + entry.id + " saved."
|
||||
notificationService.success("Entry #" + data.id + " created.");
|
||||
});
|
||||
});
|
||||
} 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.removingEntry = entry;
|
||||
|
||||
@ -16,162 +16,115 @@
|
||||
-->
|
||||
<!-- vim: set tw=80 ts=2 sw=2 sts=2: -->
|
||||
<!-- Chart row -->
|
||||
<div class="row">
|
||||
<!-- Sold evolution chart placeholder -->
|
||||
<highchart id="sold-chart" config="soldChartConfig" class="col-md-8"></highchart>
|
||||
<div>
|
||||
<div class="row">
|
||||
<!-- Sold evolution chart placeholder -->
|
||||
<highchart id="sold-chart" config="soldChartConfig" class="col-md-8"></highchart>
|
||||
|
||||
<!-- Category piechart -->
|
||||
<highchart id="categories-chart" config="categoriesChartConfig" class="col-md-4"></highchart>
|
||||
</div>
|
||||
|
||||
<!-- Row with entry table -->
|
||||
<div class="row">
|
||||
<table class="table table-condensed table-hover">
|
||||
<!-- Head of the table containing column headers and size -->
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="col-md-1">Date d'op.</th>
|
||||
<th>Libellé de l'opération</th>
|
||||
<th class="col-md-1">Montant</th>
|
||||
<th class="col-md-1">Solde</th>
|
||||
<th class="col-md-3">Catégorie</th>
|
||||
<th class="col-md-2">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<!-- Body of the table containing the entries -->
|
||||
<tbody>
|
||||
<!-- The new entry row. -->
|
||||
<tr class="form-inline">
|
||||
<td class="col-md-1">
|
||||
<input type="text" class="form-control input-sm" ng-model="newEntry.operation_date" data-date-format="yyyy-MM-dd" bs-datepicker/>
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<input type="text" class="form-control input-sm" ng-model="newEntry.label"/>
|
||||
</td>
|
||||
|
||||
<td class="col-md-1">
|
||||
<input type="text" class="form-control input-sm" ng-model="newEntry.value"/>
|
||||
</td>
|
||||
|
||||
<td class="col-md-1">
|
||||
<!-- The new entry has no sold. -->
|
||||
</td>
|
||||
|
||||
<td class="col-md-3">
|
||||
<input type="text" class="form-control input-sm" ng-model="newEntry.category"/>
|
||||
</td>
|
||||
|
||||
<td class="col-md-2">
|
||||
<div class="btn-group">
|
||||
<button type="button" class="btn btn-xs btn-success"
|
||||
ng-click="createEntry(newEntry)" title="Save">
|
||||
<span class="fa fa-plus"></span>
|
||||
</button>
|
||||
|
||||
<button type="button" class="btn btn-xs btn-default"
|
||||
ng-click="newEntry.pointed=!newEntry.pointed"
|
||||
ng-class="{active: newEntry.pointed}" title="point">
|
||||
<span ng-class="{'fa fa-check-square-o': newEntry.pointed, 'fa fa-square-o': !newEntry.pointed}"></span>
|
||||
</button>
|
||||
|
||||
<button type="button" class="btn btn-xs btn-default"
|
||||
ng-click="resetNewEntry()" title="Cancel">
|
||||
<span class="fa fa-times"></span>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- Row for an editing entry. -->
|
||||
<tr id="entry_{{entry.id}}" class="form-inline"
|
||||
ng-class="{stroke: entry.canceled, italic: !entry.confirmed, warning: entry.sold < 0, danger: entry.sold < account.authorized_overdraft}"
|
||||
ng-repeat-start="entry in entries" ng-if="entry.editing">
|
||||
<td class="col-md-1">
|
||||
<input type="text" class="form-control input-sm" ng-model="entry.operation_date" data-date-format="yyyy-MM-dd" bs-datepicker/>
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<input type="text" class="form-control input-sm" ng-model="entry.label"/>
|
||||
</td>
|
||||
|
||||
<td class="col-md-1 col-xs-1">
|
||||
<input type="text" class="form-control input-sm" ng-model="entry.value"/>
|
||||
</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">
|
||||
<input type="text" class="form-control input-sm" ng-model="entry.category"/>
|
||||
</td>
|
||||
|
||||
<td class="col-md-2">
|
||||
<div class="btn-group">
|
||||
<button type="button" class="btn btn-xs btn-success" ng-click="saveEntry(entry)" title="Save">
|
||||
<span class="fa fa-floppy-o"></span>
|
||||
</button>
|
||||
|
||||
<button type="button" class="btn btn-xs btn-default" ng-click="cancelEditEntry(entry)" title="Cancel">
|
||||
<span class="fa fa-times"></span>
|
||||
</button>
|
||||
|
||||
<button type="button" class="btn btn-xs btn-default"
|
||||
ng-click="entry.pointed = !entry.pointed"
|
||||
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>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<!-- 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>
|
||||
<!-- Category piechart -->
|
||||
<highchart id="categories-chart" config="categoriesChartConfig" class="col-md-4"></highchart>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-md-3 col-md-offset-1">
|
||||
<button class="btn btn-success" ng-click="addEntry()">Ajouter</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Row with entry table -->
|
||||
<div class="row">
|
||||
<table class="table table-condensed table-hover">
|
||||
<!-- Head of the table containing column headers and size -->
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="col-md-1">Date d'op.</th>
|
||||
<th>Libellé de l'opération</th>
|
||||
<th class="col-md-1">Montant</th>
|
||||
<th class="col-md-1">Solde</th>
|
||||
<th class="col-md-3">Catégorie</th>
|
||||
<th class="col-md-2">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<!-- Body of the table containing the entries -->
|
||||
<tbody>
|
||||
<!-- Row for an editing entry. -->
|
||||
<tr id="{{entry.id}}" class="form-inline"
|
||||
ng-class="{stroke: entry.canceled, italic: !entry.confirmed, warning: entry.sold < 0, danger: entry.sold < account.authorized_overdraft}"
|
||||
ng-repeat="entry in entries">
|
||||
<td>
|
||||
<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>
|
||||
<small>{{ entry.operation_date | date:"yyyy-MM-dd" }}</small>
|
||||
</span>
|
||||
</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>
|
||||
<small>{{ entry.label }}</small>
|
||||
</span>
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<span editable-number="entry.value" e-class="input-sm" e-name="value" e-form="rowform" e-required>
|
||||
<small>{{ entry.value }}</small>
|
||||
</span>
|
||||
</td>
|
||||
|
||||
<td ng-class="{'text-warning': entry.sold < 0, 'text-danger': entry.sold < account.authorized_overdraft}">
|
||||
<small>{{ entry.sold }}</small>
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<span editable-text="entry.category" e-class="input-sm" e-placeholder="Catégorie" e-form="rowform" e-required>
|
||||
<small>{{ entry.category }}</small>
|
||||
</span>
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<form editable-form name="rowform" onbeforesave="saveEntry($data, $index)" shown="entry == inserted">
|
||||
<!-- new row buttons -->
|
||||
<div class="btn-group">
|
||||
<!-- Save current entry, for editing and non-confirmed non-canceled entries -->
|
||||
<button type="submit" class="btn btn-xs btn-success"
|
||||
ng-if="!entry.canceled && (!entry.confirmed || rowform.$visible)"
|
||||
title="Save">
|
||||
<span class="fa fa-floppy-o"></span>
|
||||
</button>
|
||||
|
||||
<!-- Edit entry, for non-canceled and non-editing entries-->
|
||||
<button type="button" class="btn btn-xs btn-default"
|
||||
ng-if="!entry.canceled && !rowform.$visible"
|
||||
ng-click="rowform.$show()" title="edit">
|
||||
<span class="fa fa-pencil-square-o"></span>
|
||||
</button>
|
||||
|
||||
<!-- Cancel edition, for editing entries. -->
|
||||
<button type="button" class="btn btn-xs btn-default"
|
||||
ng-if="rowform.$visible"
|
||||
ng-click="cancelEditEntry(entry, rowform)">
|
||||
<span class="fa fa-times"></span>
|
||||
</button>
|
||||
|
||||
<!-- Toggle pointed entry, for non-canceled entries. -->
|
||||
<button type="button" class="btn btn-xs btn-default"
|
||||
ng-if="!entry.canceled"
|
||||
ng-click="togglePointedEntry(entry, rowform)"
|
||||
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>
|
||||
|
||||
<!-- Toggle canceled entry, for non-editing entries. -->
|
||||
<button type="button" class="btn btn-xs btn-default"
|
||||
ng-click="toggleCanceledEntry(entry)"
|
||||
ng-if="!rowform.$visible"
|
||||
ng-class="{active: entry.canceled}" title="cancel">
|
||||
<span class="fa fa-remove"></span>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user