accountant/frontend/static/js/entries.js

452 lines
13 KiB
JavaScript
Raw Normal View History

2013-02-08 13:07:27 +01:00
/*
This file is part of Accountant.
Accountant is free software: you can redistribute it and/or modify
it under the terms of the GNU Affero General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
Foobar is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Accountant. If not, see <http://www.gnu.org/licenses/>.
*/
var EntryController = function($scope, $http, $rootScope, $filter) {
2013-01-13 10:14:43 +01:00
// Entry store and selection
$scope.entries = [];
2013-12-06 20:36:26 +01:00
$scope.categories = [];
$scope.chartValues = [];
$scope.pieChartValues = [];
$scope.selectedItem = null;
$scope.account = null;
// Placeholder for saved value to cancel entry edition
$scope.savedItem = null;
$scope.entriesLoaded = function(entries) {
var entriesReversed = entries.slice().reverse();
var categories = [];
var chartValues = [];
var pieChartValuesTmp = {};
var pieChartValues = [];
angular.forEach(entriesReversed, function(entry) {
var category = entry.category;
var value = entry.value ? Number(entry.value) : null;
var sold = entry.sold ? Number(entry.sold) : null;
var operation_date = entry.operation_date;
if(operation_date && sold) {
chartValues.push([entry.operation_date, sold]);
}
2013-01-13 13:32:23 +01:00
if(category && category != '') {
if(categories.indexOf(category) == -1) {
categories.push(category);
}
if(value && value < 0.0) {
var oldValue = 0.0;
if(pieChartValuesTmp[category]) {
oldValue = pieChartValuesTmp[category];
}
pieChartValuesTmp[category] = oldValue - value;
}
}
});
2013-12-06 20:36:26 +01:00
$scope.chartValues = chartValues;
2013-01-13 10:14:43 +01:00
// Second pass: transform to an array readable by jqplot.
2013-12-06 20:36:26 +01:00
var pieChartValues = [];
angular.forEach(pieChartValuesTmp, function(value, key) {
pieChartValues.push([key, value]);
});
2013-12-06 20:36:26 +01:00
$scope.pieChartValues = pieChartValues;
//$scope.categories.length = 0;
//$scope.categories.concat(categories);
$scope.categories = categories;
2013-12-06 20:36:26 +01:00
nv.addGraph($scope.drawChart);
nv.addGraph($scope.drawPieChart);
//$scope.drawPieChart(pieChartValues, "#expense-categories-chart-placeholder");
//$scope.drawPieChart();
};
2013-12-03 20:23:37 +01:00
$scope.getAccountStatus = function(account, month) {
if(account != null && month != null) {
$http.get("/api/accounts/" + account.id + "/" + month.year + "/" + month.month).
success($scope.getAccountStatus_success);
}
};
$scope.getAccountStatus_success = function(status) {
$scope.accountStatus = status;
};
2013-01-13 10:14:43 +01:00
// Function to load entries from server for a specific account and month.
$scope.loadEntries = function(account, month) {
if(account) {
$scope.account = account;
}
// Clean up selected entry.
$scope.selectedItem = null;
$scope.savedItem = null;
2013-01-24 21:19:07 +01:00
if(account && month) {
2013-03-20 17:03:25 +01:00
$http.get("/api/entries/" + account.id + "/" + month.year + "/" + month.month).success($scope.loadEntries_success);
} else {
$scope.loadEntries_success(null);
}
};
// Load entries success callback
$scope.loadEntries_success = function(data) {
var entries = [{
id: null,
pointed: false,
operation_date: null,
label: null,
value: null,
sold: null,
pointedsold: null,
category: null,
account_id: null,
state: 'new',
canceled: false,
scheduled_operation_id: null
}];
if(data) {
entries = entries.concat(angular.fromJson(data));
}
$scope.entries = entries;
$scope.$emit("entriesLoadedEvent", {entries: entries});
};
2013-01-24 20:44:09 +01:00
// Returns the CSS class for a pointed entry.
$scope.pointedEntryClass = function(entry) {
if(entry.pointed) {
return "active";
}
};
2013-01-07 18:42:02 +01:00
// Returns the CSS class for an entry row.
$scope.entryRowClass = function(entry) {
if($scope.isSaved(entry)) {
cssclass="";
} else {
cssclass="italic";
}
if(entry.canceled) {
cssclass += " stroke";
}
if(entry.sold < $scope.account.authorized_overdraft) {
2015-06-05 18:08:34 +02:00
cssclass += " danger";
} else if (entry.sold < 0) {
cssclass += " warning";
}
return cssclass;
};
2013-01-24 20:44:09 +01:00
// Returns the CSS class for an entry sold.
$scope.entryValueClass = function(sold) {
2013-12-03 20:23:37 +01:00
if(sold && sold < $scope.account.authorized_overdraft) {
2015-06-05 18:08:34 +02:00
return 'text-danger';
2013-12-03 20:23:37 +01:00
} else if (sold && sold < 0) {
return 'text-warning';
}
};
// Starts editing an entry
$scope.editEntry = function(entry) {
// Cancel previous editing.
if($scope.selectedItem) {
$scope.cancelEditEntry($scope.selectedItem);
}
// Save current entry values.
$scope.savedItem = angular.copy(entry);
$scope.selectedItem = entry;
2013-01-24 20:44:09 +01:00
// Enter edit state.
entry.state='edit';
2013-01-07 18:42:02 +01:00
};
// Returns true if the entry is a new one.
$scope.isNew = function(entry) {
return !$scope.isSaved(entry) && (entry.state === 'edit' || entry.state === 'new');
2013-01-07 18:42:02 +01:00
};
// Returns true if the entry is in editing state.
$scope.isEditing = function(entry) {
return entry.state === 'edit' || entry.state === 'new';
2013-01-07 18:42:02 +01:00
};
// Returns true if the entry is in displaying state.
$scope.isDisplaying = function(entry) {
return !entry.state || entry.state === 'display';
2013-01-24 19:31:37 +01:00
};
// Returns true if the entry is a scheduled one.
$scope.isSaved = function(entry) {
return entry.id != null;
}
$scope.iconSaveClass = function(entry) {
if(!$scope.isSaved(entry)) {
2013-12-06 20:36:26 +01:00
return "fa fa-plus";
} else if ($scope.isEditing(entry)) {
2013-12-06 20:36:26 +01:00
return "fa fa-floppy-o";
2013-01-07 18:42:02 +01:00
}
};
2013-01-07 18:42:02 +01:00
$scope.iconCancelClass = function(entry) {
if($scope.isNew(entry)) {
2013-12-06 20:36:26 +01:00
return "fa fa-times";
} else if ($scope.isEditing(entry)) {
2013-12-06 20:36:26 +01:00
return "fa fa-ban";
2013-01-07 18:42:02 +01:00
}
};
2013-01-07 18:42:02 +01:00
// Cancel current editing entry or clears field if a new one.
$scope.cancelEditEntry = function(entry) {
if ($scope.savedItem == null) {
// We are cancelling the new entry, just reset it.
entry.id = null; // id should not change, but just in case...
entry.pointed = false;
entry.operation_date = null;
entry.label = null;
entry.value = null;
entry.account_id = $scope.account.id; // account_id should not change, but just in case...
entry.category = null;
entry.canceled = false;
entry.scheduled_operation_id = null;
// Reset state to new.
entry.state = 'new';
} else {
// Reset selected item fields to saved item ones.
entry.id = $scope.savedItem.id; // id should not change, but just in case...
entry.pointed = $scope.savedItem.pointed;
entry.operation_date = $scope.savedItem.operation_date;
entry.label = $scope.savedItem.label;
entry.value = $scope.savedItem.value;
entry.account_id = $scope.savedItem.account_id; // account_id should not change, but just in case...
entry.category = $scope.savedItem.category;
entry.canceled = $scope.savedItem.canceled;
entry.scheduled_operation_id = $scope.savedItem.scheduled_operation_id;
// Reset saved and selected items to null.
$scope.savedItem = null;
$scope.selectedItem = null;
// Enter display state.
entry.state = 'display';
}
2013-01-07 18:42:02 +01:00
};
// Points an entry.
$scope.pointEntry = function(entry) {
if(entry.pointed) {
entry.pointed = false;
} else {
entry.pointed = true;
}
// Save the entry if not new.
if(!$scope.isNew(entry)) {
$scope.saveEntry(entry);
}
};
// Saves an entry.
$scope.saveEntry = function(entry) {
// Affects the account ID if not (should never happen)
if(!entry.account_id) {
entry.account_id = $scope.account.id;
2013-01-24 19:31:37 +01:00
}
2013-01-07 18:42:02 +01:00
// Prepare the Ajax call to save the entry.
2013-01-13 20:57:48 +01:00
var type;
2013-03-20 17:03:25 +01:00
var url = "/api/entries";
2013-01-13 20:57:48 +01:00
if($scope.isSaved(entry)) {
url += "/" + entry.id;
2013-01-13 20:57:48 +01:00
}
// Ajax call to save an entry
$http.put(url, angular.toJson(entry)).success(function(data) {
$.pnotify({
type: "success",
title: "Save",
text: data
});
2013-01-07 18:42:02 +01:00
// $scope.savedItem = null;
2013-01-13 13:32:23 +01:00
// Send the "entry saved" event.
$scope.$emit("entrySavedEvent", entry);
2013-01-07 18:42:02 +01:00
});
};
2013-12-09 10:38:17 +01:00
$scope.removeEntry = function(entry) {
$scope.removingEntry = entry;
$("#remove_entry").modal({
keyboard: false,
});
};
$scope.hideRemoveEntryPopup = function() {
$scope.removingEntry = null;
$("#remove_entry").modal("hide");
};
// Removes an entry.
2013-12-09 10:38:17 +01:00
$scope.confirmRemoveEntry = function() {
2013-01-13 13:32:23 +01:00
// Cancel current editing.
2013-12-09 10:38:17 +01:00
if ($scope.removingEntry) {
$http.delete("/api/entries/" + $scope.removingEntry.id).success(function (result) {
$.pnotify({
type: "success",
title: "Delete",
text: result
});
// Send the "entry removed" event.
2013-12-09 10:38:17 +01:00
$scope.$emit("entryRemovedEvent", $scope.removingEntry);
2013-12-09 10:38:17 +01:00
$scope.hideRemoveEntryPopup();
});
2013-01-07 18:42:02 +01:00
}
};
$scope.closeModal = function(modalScope) {
// Close the modal dialog
if(modalScope && modalScope.dismiss) {
modalScope.dismiss();
}
};
// Function to draw the sold evolution chart.
2013-12-06 20:36:26 +01:00
$scope.drawChart = function() {
// Clear previous chart
2013-12-06 20:36:26 +01:00
var entries = $scope.chartValues;
console.debug("drawChart", entries);
var width = 700;
var height = 300;
2013-03-08 14:31:35 +01:00
//if(entries && entries.length > 1) {
// Prepare for today vertical line.
var today = new Date();
today.setHours(0);
today.setMinutes(0);
// Find first and last days to set limits of the x axis.
var day = 24 * 60 * 60 * 1000;
2013-12-06 20:36:26 +01:00
var firstDate = $filter('date')(new Date(Date.parse(entries[0][0]).valueOf() - day), 'yyyy-MM-dd');
var lastDate = $filter('date')(new Date(Date.parse(entries[entries.length -1][0]).valueOf() + day), 'yyyy-MM-dd');
2013-12-06 20:36:26 +01:00
var chart = nv.models.lineChart().options({
x: function(d) { return d3.time.format("%Y-%m-%d").parse(d[0]); },
y: function(d) { return new Number(d[1]); },
transitionDuration: 250,
showXAxis: true,
showYAxis: true,
width: width,
height: height,
});
2013-03-08 14:31:35 +01:00
chart.lines.interpolate("monotone");
2013-12-06 20:36:26 +01:00
chart.xAxis
.axisLabel("Date")
.tickFormat(function(d) {
return d3.time.format("%Y-%m-%d")(new Date(d));
});
//chart.xAxis.scale().range([firstDate, lastDate]);
2013-03-08 14:31:35 +01:00
2013-12-06 20:36:26 +01:00
chart.yAxis
.axisLabel("Solde")
.tickFormat(d3.format('.02f'));
2013-03-08 14:31:35 +01:00
// FIXME add vertical line for today
2013-12-06 20:36:26 +01:00
graph = d3.select("#entries-chart-placeholder").datum([
2013-03-08 14:31:35 +01:00
{ color: "orange", key: "Zero", values:[
[firstDate, "0"],
[lastDate, "0"]
]},
{ color: "red", key: "Authorized overdraft", values : [
[firstDate, new Number($scope.account.authorized_overdraft)],
[lastDate, new Number($scope.account.authorized_overdraft)]
]},
{ color: "darkblue", key: "Sold evolution", values: entries},
2013-12-06 20:36:26 +01:00
])
.transition().duration(1200)
.attr("width", width)
.attr("height", height)
.call(chart);
2013-03-08 14:31:35 +01:00
nv.utils.windowResize(chart.update);
2013-12-06 20:36:26 +01:00
return chart;
2013-01-08 18:50:47 +01:00
};
2013-03-08 14:31:35 +01:00
// Function to draw the expense category pie chart.
2013-12-06 20:36:26 +01:00
$scope.drawPieChart = function() {
// FIXME retrieve width and height from DOM
var width = 300;
var height = 300;
2013-03-08 14:31:35 +01:00
var chart = nv.models.pieChart()
2013-12-06 20:36:26 +01:00
.x(function(d) { console.debug(d); return d[0]; })
2013-03-08 14:31:35 +01:00
.y(function(d) { return d[1]; })
2013-12-06 20:36:26 +01:00
.width(width)
.height(height)
2013-03-08 14:31:35 +01:00
.showLabels(true);
2013-12-06 20:36:26 +01:00
d3.select("#expense-categories-chart-placeholder")
.datum($scope.pieChartValues)
.transition().duration(1200)
.attr('width', width)
.attr('height', height)
.call(chart);
2013-03-08 14:31:35 +01:00
nv.utils.windowResize(chart.update);
2013-12-06 20:36:26 +01:00
return chart
2013-01-07 18:42:02 +01:00
};
$rootScope.$on("monthsLoadedEvent", function(event, args){
$scope.loadEntries(args.account, args.month);
});
2013-12-03 20:23:37 +01:00
$rootScope.$on("monthsLoadedEvent", function(event, args){
$scope.getAccountStatus(args.account, args.month);
});
$scope.$on("entriesLoadedEvent", function(event, args) {
$scope.entriesLoaded(args.entries);
});
};