Refactoring.

This commit is contained in:
Alexis Lahouze 2015-08-18 17:15:56 +02:00
parent cf657c1ad7
commit a23d653738
2 changed files with 146 additions and 209 deletions

View File

@ -26,23 +26,21 @@ accountantApp
.controller( .controller(
"SchedulerController", [ "SchedulerController", [
"$scope", "$rootScope", "$routeParams", "ScheduledOperations", "$scope", "$rootScope", "$routeParams", "notificationService", "ScheduledOperations",
function($scope, $rootScope, $routeParams, ScheduledOperations) { function($scope, $rootScope, $routeParams, notificationService, ScheduledOperations) {
// Operations store and selection // Operations store and selection
$scope.operations = []; $scope.operations = [];
$scope.selectedOperation = null;
// Placeholder for saved value to cancel entry edition
$scope.savedOperation = null;
$scope.categories = []; $scope.categories = [];
$scope.resetNewOperation = function() { $scope.addOperation = function() {
$scope.newOperation = new ScheduledOperations({}); if(! $scope.inserted) {
$scope.inserted = new ScheduledOperations({});
$scope.inserted.account_id = $routeParams.accountId;
$scope.operations.splice(0, 0, $scope.inserted);
}
}; };
$scope.resetNewOperation();
$scope.loadOperations = function(accountId) { $scope.loadOperations = function(accountId) {
// Clean up selected entry. // Clean up selected entry.
$scope.selectedOperation = null; $scope.selectedOperation = null;
@ -50,95 +48,44 @@ accountantApp
$scope.operations = ScheduledOperations.query({ $scope.operations = ScheduledOperations.query({
account: $routeParams.accountId account: $routeParams.accountId
}, function(data) {
$scope.$emit("operationsLoadedEvent", {operations: data});
}); });
}; };
// Returns true if the entry is in editing state.
$scope.isEditing = function(operation) {
return operation.state === 'edit';
};
$scope.isDisplaying = function(operation) {
return !operation.state;
};
$scope.createOperation = function(operation) {
operation.account_id = $routeParams.accountId;
operation.$save(function(data) {
$scope.resetNewOperation();
$scope.$emit("operationCreatedEvent", data);
});
};
// Notify on success.
$scope.$on("operationCreatedEvent", function(e, operation) {
new PNotify({
type: "success",
title: "Save",
text: "Operation #" + operation.id + " created."
});
});
// Save operation. // Save operation.
$scope.saveOperation = function(operation) { $scope.saveOperation = function($data, $index) {
operation.$save(function(data) { var operation;
$scope.$emit("operationSavedEvent", operation);
});
};
// Notify on success. if($data.$save) {
$scope.$on("operationSavedEvent", function(e, operation) { operation = $data;
new PNotify({ } else {
type: "success", operation = $scope.operations[$index];
title: "Save", operation = angular.merge(operation, $data);
text: "Operation #" + operation.id + " saved." }
});
});
$scope.editOperation = function(operation) { var promise = operation.$save()
// Enter edit state.
operation.state='edit'; if(operation == $scope.inserted) {
promise = promise.then(function(data) {
$scope.inserted = false;
return data;
});
}
return promise.then(function(data) {
notificationService.success("Operation #" + data.id + " saved.");
return data;
});
}; };
// Reload operation from server to cancel edition. // Reload operation from server to cancel edition.
$scope.cancelEditOperation = function(operation) { $scope.cancelEditOperation = function(operation, rowform) {
operation.$get(); if(operation == $scope.inserted) {
}; $scope.entries.splice(0, 1);
} else {
// Remove an operation. rowform.$cancel();
$scope.removeOperation = function(operation, modalScope) {
operation.$delete(function(data) {
new PNotify({
type: "success",
title: "Delete",
text: "Operation #" + operation.id + " deleted."
});
// Send the "entry removed" event.
$scope.$emit("operationRemovedEvent", operation);
$scope.closeModal(modalScope);
});
};
// Close modal.
$scope.closeModal = function(modalScope) {
// Close the modal dialog
if(modalScope && modalScope.dismiss) {
modalScope.dismiss();
} }
}; };
// Load operations on account selection.
// FIXME Alexis Lahouze 2015-07-15 Deprecated.
$rootScope.$on("accountSelectedEvent", function(event, args){
$scope.loadOperations(args.account.id);
});
// Load operations on controller initialization. // Load operations on controller initialization.
$scope.loadOperations($routeParams.accountId); $scope.loadOperations($routeParams.accountId);
}]); }]);

View File

@ -16,139 +16,129 @@
--> -->
<!-- vim: set tw=80 ts=2 sw=2 sts=2: --> <!-- vim: set tw=80 ts=2 sw=2 sts=2: -->
<!-- Row with entry table --> <!-- Row with entry table -->
<div class="row"> <div>
<div class="row">
<div class="col-md-3 col-md-offset-1">
<button class="btn btn-success" ng-click="addOperation()">Ajouter</button>
</div>
</div>
<div class="row">
<table class="table table-striped table-condensed table-hover"> <table class="table table-striped table-condensed table-hover">
<!-- Head of the table containing column headers and size --> <!-- Head of the table containing column headers and size -->
<thead> <thead>
<tr> <tr>
<th style="width: 120px">Date de d&eacute;but</th> <th class="col-md-1">Date de d&eacute;but</th>
<th style="width: 120px">Date de fin</th> <th class="col-md-1">Date de fin</th>
<th style="width: 20px">Jour</th> <th class="col-md-1">Jour</th>
<th style="width: 20px">Fr&eacute;q.</th> <th class="col-md-1">Fr&eacute;q.</th>
<th>Libell&eacute; de l'op&eacute;ration</th> <th>Libell&eacute; de l'op&eacute;ration</th>
<th style="width: 50px">Montant</th> <th class="col-md-1">Montant</th>
<th style="width: 100px">Cat&eacute;gorie</th> <th class="col-md-2">Cat&eacute;gorie</th>
<th style="width: 60px">Actions</th> <th class="col-md-1">Actions</th>
</tr> </tr>
</thead> </thead>
<!-- Body of the table containing the entries --> <!-- Body of the table containing the entries -->
<tbody> <tbody>
<tr class="form-inline"> <tr id="{{ operation.id }}" class="form-inline"
<td> ng-repeat="operation in operations">
<input type="text" class="form-control input-sm" ng-model="newOperation.start_date" data-date-format="yyyy-MM-dd" bs-datepicker/> <td class="col-md-1">
<span editable-text="operation.start_date"
e-style="width: 100%"
e-bs-datepicker e-data-date-format="yyyy-MM-dd"
e-name="start_date" e-form="rowform" e-required>
{{ operation.start_date | date: "yyyy-MM-dd" }}
</span>
</td> </td>
<td> <td>
<input type="text" class="form-control input-sm" ng-model="newOperation.stop_date" data-date-format="yyyy-MM-dd" bs-datepicker/> <span editable-text="operation.stop_date"
e-style="width: 100%"
e-bs-datepicker e-data-date-format="yyyy-MM-dd"
e-name="stop_date" e-form="rowform" e-required>
{{ operation.stop_date | date: "yyyy-MM-dd" }}
</span>
</td> </td>
<td> <td>
<input type="text" class="form-control input-sm" ng-model="newOperation.day"/> <span editable-number="operation.day"
e-style="width: 100%"
e-name="day" e-form="rowform" e-required>
{{ operation.day }}
</span>
</td> </td>
<td> <td>
<input type="text" class="form-control input-sm" ng-model="newOperation.frequency"/> <span editable-number="operation.frequency"
e-style="width: 100%"
e-name="frequency" e-form="rowform" e-required>
{{ operation.frequency }}
</span>
</td> </td>
<td> <td>
<input type="text" class="form-control input-sm" ng-model="newOperation.label"/> <span editable-text="operation.label"
e-style="width: 100%"
e-placeholder="Libellé de l'opération"
e-name="label" e-form="rowform" e-required>
{{ operation.label }}
</span>
</td> </td>
<td> <td>
<input type="text" class="form-control input-sm" ng-model="newOperation.value"/> <span editable-number="operation.value"
e-style="width: 100%"
e-name="value" e-form="rowform" e-required>
{{ operation.value }}
</span>
</td> </td>
<td> <td>
<input type="text" class="form-control input-sm" ng-model="newOperation.category" bs-typeahead="categories"/> <span editable-text="operation.category"
e-style="width: 100%"
e-name="category" e-form="rowform">
{{ operation.category }}
</span>
</td> </td>
<td> <td>
<form editable-form name="rowform"
onbeforesave="saveOperation($data, $index)"
shown="operation == inserted">
<div class="btn-group"> <div class="btn-group">
<button class="btn btn-xs btn-success" ng-click="createOperation(newOperation)" title="Save"> <!-- Save current operation -->
<span class="fa fa-plus"></span> <button type="submit" class="btn btn-xs btn-success"
</button> ng-if="rowform.$visible" title="Save">
<button class="btn btn-xs btn-default" ng-click="resetNewOperation()" title="Cancel">
<span class="fa fa-times"></span>
</button>
</div>
</td>
</tr>
<tr id="operation_{{operation.id}}" class="form-inline"
ng-repeat-start="operation in operations"
ng-if="isDisplaying(operation)">
<td>{{operation.start_date}}</td>
<td>{{operation.stop_date}}</td>
<td>{{operation.day}}</td>
<td>{{operation.frequency}}</td>
<td>{{operation.label}}</td>
<td>{{operation.value}}</td>
<td>{{operation.category}}</td>
<td>
<div class="btn-group">
<button class="btn btn-xs btn-default" ng-click="editOperation(operation)" title="edit">
<span class="fa fa-pencil-square-o"></span>
</button>
<button class="btn btn-xs btn-default" bs-modal="static/templates/operation_remove.html" title="remove">
<span class="fa fa-trash"></span>
</button>
</div>
</td>
</tr>
<tr id="operation_{{operation.id}}" class="form-inline"
ng-repeat-end
ng-if="isEditing(operation)">
<td>
<input type="text" class="form-control input-sm" ng-model="operation.start_date" data-date-format="yyyy-MM-dd" bs-datepicker/>
</td>
<td>
<input type="text" class="form-control input-sm" ng-model="operation.stop_date" data-date-format="yyyy-MM-dd" bs-datepicker/>
</td>
<td>
<input type="text" class="form-control input-sm" ng-model="operation.day"/>
</td>
<td>
<input type="text" class="form-control input-sm" ng-model="operation.frequency"/>
</td>
<td>
<input type="text" class="form-control input-sm" ng-model="operation.label"/>
</td>
<td>
<input type="text" class="form-control input-sm" ng-model="operation.value"/>
</td>
<td>
<input type="text" class="form-control input-sm" ng-model="operation.category" bs-typeahead="categories"/>
</td>
<td>
<div class="btn-group">
<button class="btn btn-xs btn-success" ng-click="saveOperation(operation)" title="Save">
<span class="fa fa-floppy-o"></span> <span class="fa fa-floppy-o"></span>
</button> </button>
<button class="btn btn-xs btn-default" ng-click="cancelEditOperation(operation)" title="Cancel"> <!-- Edit operation. -->
<button type="button" class="btn btn-xs btn-default"
ng-if="!rowform.$visible"
ng-click="rowform.$show()" title="edit">
<span class="fa fa-pencil-square-o"></span>
</button>
<!-- Cancel edit. -->
<button type="button" class="btn btn-xs btn-default"
ng-if="rowform.$visible"
ng-click="cancelEditOperation(operations, rowform)"
title="Cancel">
<span class="fa fa-times"></span> <span class="fa fa-times"></span>
</button> </button>
<!-- Remove operation. -->
<button type="button" class="btn btn-xs btn-default"
bs-modal="static/templates/operation_remove.html"
title="remove">
<span class="fa fa-trash"></span>
</button>
</div> </div>
</form>
</td> </td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div>
</div> </div>