mirror of
https://github.com/firefly-iii/firefly-iii.git
synced 2025-10-12 15:35:15 +00:00
Allow user to set multi-currency available budget. WIP
This commit is contained in:
James Cole
300
public/v1/js/ff/budgets/index.js
vendored
300
public/v1/js/ff/budgets/index.js
vendored
@@ -18,31 +18,33 @@
|
||||
* along with Firefly III. If not, see <http://www.gnu.org/licenses/>.
|
||||
*/
|
||||
|
||||
/** global: infoIncomeUri, page, token, spent, budgeted, available, currencySymbol, budgetIndexUri, updateIncomeUri, periodStart, periodEnd, budgetAmountUri, accounting */
|
||||
/**
|
||||
*
|
||||
*/
|
||||
$(function () {
|
||||
"use strict";
|
||||
|
||||
$('.updateIncome').on('click', updateIncome);
|
||||
//$('.updateIncome').on('click', updateIncome);
|
||||
|
||||
/*
|
||||
On start, fill the "spent"-bar using the content from the page.
|
||||
*/
|
||||
drawSpentBar();
|
||||
drawBudgetedBar();
|
||||
//drawSpentBar();
|
||||
//drawBudgetedBar();
|
||||
|
||||
$('.update_ab').on('click', updateAvailableBudget)
|
||||
$('.create_ab_alt').on('click', createAltAvailableBudget)
|
||||
|
||||
/*
|
||||
When the input changes, update the percentages for the budgeted bar:
|
||||
*/
|
||||
$('input[type="number"]').on('change', updateBudgetedAmounts);
|
||||
//$('input[type="number"]').on('change', updateBudgetedAmounts);
|
||||
|
||||
//
|
||||
$('.selectPeriod').change(function (e) {
|
||||
var sel = $(e.target).val();
|
||||
if (sel !== "x") {
|
||||
var newUri = budgetIndexUri.replace("REPLACE", sel);
|
||||
var selected = $(e.currentTarget);
|
||||
if (selected.find(":selected").val() !== "x") {
|
||||
var newUri = budgetIndexUri.replace("START", selected.find(":selected").data('start')).replace('END', selected.find(":selected").data('end'));
|
||||
console.log(newUri);
|
||||
window.location.assign(newUri + "?page=" + page);
|
||||
}
|
||||
});
|
||||
@@ -91,7 +93,6 @@ var fixHelper = function (e, tr) {
|
||||
function sortStop(event, ui) {
|
||||
"use strict";
|
||||
|
||||
|
||||
//var current = $(ui.item);
|
||||
var list = $('.sortable-table tbody tr');
|
||||
var submit = [];
|
||||
@@ -109,132 +110,157 @@ function sortStop(event, ui) {
|
||||
};
|
||||
$.post('budgets/reorder', arr);
|
||||
}
|
||||
|
||||
|
||||
function drawSpentBar() {
|
||||
"use strict";
|
||||
if ($('.spentBar').length > 0) {
|
||||
var overspent = spent > budgeted;
|
||||
var pct;
|
||||
|
||||
if (overspent) {
|
||||
// draw overspent bar
|
||||
pct = (budgeted / spent) * 100;
|
||||
$('.spentBar .progress-bar-warning').css('width', pct + '%');
|
||||
$('.spentBar .progress-bar-danger').css('width', (100 - pct) + '%');
|
||||
} else {
|
||||
// draw normal bar:
|
||||
pct = (spent / budgeted) * 100;
|
||||
$('.spentBar .progress-bar-info').css('width', pct + '%');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function drawBudgetedBar() {
|
||||
"use strict";
|
||||
|
||||
if ($('.budgetedBar').length > 0) {
|
||||
var budgetedMuch = budgeted > available;
|
||||
|
||||
// recalculate percentage:
|
||||
|
||||
var pct;
|
||||
if (budgetedMuch) {
|
||||
// budgeted too much.
|
||||
pct = (available / budgeted) * 100;
|
||||
$('.budgetedBar .progress-bar-warning').css('width', pct + '%');
|
||||
$('.budgetedBar .progress-bar-danger').css('width', (100 - pct) + '%');
|
||||
$('.budgetedBar .progress-bar-info').css('width', 0);
|
||||
} else {
|
||||
pct = (budgeted / available) * 100;
|
||||
$('.budgetedBar .progress-bar-warning').css('width', 0);
|
||||
$('.budgetedBar .progress-bar-danger').css('width', 0);
|
||||
$('.budgetedBar .progress-bar-info').css('width', pct + '%');
|
||||
}
|
||||
|
||||
$('#budgetedAmount').html(currencySymbol + ' ' + budgeted.toFixed(2));
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @param e
|
||||
*/
|
||||
function updateBudgetedAmounts(e) {
|
||||
"use strict";
|
||||
var target = $(e.target);
|
||||
var id = target.data('id');
|
||||
var leftCell = $('td[class$="left"][data-id="' + id + '"]');
|
||||
var link = $('a[data-id="' + id + '"][class="budget-link"]');
|
||||
var value = target.val();
|
||||
var original = target.data('original');
|
||||
|
||||
// disable input
|
||||
target.prop('disabled', true);
|
||||
|
||||
// replace link (for now)
|
||||
link.attr('href', '#');
|
||||
|
||||
// replace "left" with spinner.
|
||||
leftCell.empty().html('<i class="fa fa-fw fa-spin fa-spinner"></i>');
|
||||
|
||||
// send a post to Firefly to update the amount:
|
||||
var newUri = budgetAmountUri.replace("REPLACE", id);
|
||||
|
||||
$.post(newUri, {amount: value, start: periodStart, end: periodEnd, _token: token}).done(function (data) {
|
||||
|
||||
// difference between new value and original value
|
||||
var difference = value - original;
|
||||
|
||||
// update budgeted value
|
||||
budgeted = budgeted + difference;
|
||||
|
||||
// fill in "left" value:
|
||||
|
||||
|
||||
if (data.left_per_day !== null) {
|
||||
leftCell.html(data.left + ' (' + data.left_per_day + ')');
|
||||
} else {
|
||||
leftCell.html(data.left);
|
||||
}
|
||||
|
||||
// update "budgeted" input:
|
||||
target.val(data.amount);
|
||||
|
||||
// enable thing again
|
||||
target.prop('disabled', false);
|
||||
|
||||
// set new original value:
|
||||
target.data('original', data.amount);
|
||||
|
||||
// run drawBudgetedBar() again:
|
||||
drawBudgetedBar();
|
||||
|
||||
// update the link if relevant:
|
||||
link.attr('href', 'budgets/show/' + id);
|
||||
if (data.limit > 0) {
|
||||
link.attr('href', 'budgets/show/' + id + '/' + data.limit);
|
||||
}
|
||||
|
||||
// update the warning if relevant:
|
||||
if (data.large_diff === true) {
|
||||
$('span[class$="budget_warning"][data-id="' + id + '"]').html(data.warn_text).show();
|
||||
console.log('Show warning for budget');
|
||||
} else {
|
||||
$('span[class$="budget_warning"][data-id="' + id + '"]').empty().hide();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @returns {boolean}
|
||||
*/
|
||||
function updateIncome() {
|
||||
"use strict";
|
||||
$('#defaultModal').empty().load(updateIncomeUri, function () {
|
||||
$('#defaultModal').modal('show');
|
||||
});
|
||||
|
||||
function createAltAvailableBudget(e) {
|
||||
var button = $(e.currentTarget);
|
||||
$('#defaultModal').empty().load(createAltAvailableBudgetUri, function () {
|
||||
$('#defaultModal').modal('show');
|
||||
});
|
||||
return false;
|
||||
}
|
||||
function updateAvailableBudget(e) {
|
||||
var button = $(e.currentTarget);
|
||||
var abId = parseInt(button.data('id'));
|
||||
if (0 === abId) {
|
||||
$('#defaultModal').empty().load(createAvailableBudgetUri, function () {
|
||||
$('#defaultModal').modal('show');
|
||||
});
|
||||
}
|
||||
if (abId > 0) {
|
||||
// edit URL.
|
||||
$('#defaultModal').empty().load(editAvailableBudgetUri.replace('REPLACEME', abId), function () {
|
||||
$('#defaultModal').modal('show');
|
||||
});
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
//
|
||||
// function drawSpentBar() {
|
||||
// "use strict";
|
||||
// if ($('.spentBar').length > 0) {
|
||||
// var overspent = spent > budgeted;
|
||||
// var pct;
|
||||
//
|
||||
// if (overspent) {
|
||||
// // draw overspent bar
|
||||
// pct = (budgeted / spent) * 100;
|
||||
// $('.spentBar .progress-bar-warning').css('width', pct + '%');
|
||||
// $('.spentBar .progress-bar-danger').css('width', (100 - pct) + '%');
|
||||
// } else {
|
||||
// // draw normal bar:
|
||||
// pct = (spent / budgeted) * 100;
|
||||
// $('.spentBar .progress-bar-info').css('width', pct + '%');
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
//
|
||||
// function drawBudgetedBar() {
|
||||
// "use strict";
|
||||
//
|
||||
// if ($('.budgetedBar').length > 0) {
|
||||
// var budgetedMuch = budgeted > available;
|
||||
//
|
||||
// // recalculate percentage:
|
||||
//
|
||||
// var pct;
|
||||
// if (budgetedMuch) {
|
||||
// // budgeted too much.
|
||||
// pct = (available / budgeted) * 100;
|
||||
// $('.budgetedBar .progress-bar-warning').css('width', pct + '%');
|
||||
// $('.budgetedBar .progress-bar-danger').css('width', (100 - pct) + '%');
|
||||
// $('.budgetedBar .progress-bar-info').css('width', 0);
|
||||
// } else {
|
||||
// pct = (budgeted / available) * 100;
|
||||
// $('.budgetedBar .progress-bar-warning').css('width', 0);
|
||||
// $('.budgetedBar .progress-bar-danger').css('width', 0);
|
||||
// $('.budgetedBar .progress-bar-info').css('width', pct + '%');
|
||||
// }
|
||||
//
|
||||
// $('#budgetedAmount').html(currencySymbol + ' ' + budgeted.toFixed(2));
|
||||
// }
|
||||
// }
|
||||
|
||||
// /**
|
||||
// *
|
||||
// * @param e
|
||||
// */
|
||||
// function updateBudgetedAmounts(e) {
|
||||
// "use strict";
|
||||
// var target = $(e.target);
|
||||
// var id = target.data('id');
|
||||
// var leftCell = $('td[class$="left"][data-id="' + id + '"]');
|
||||
// var link = $('a[data-id="' + id + '"][class="budget-link"]');
|
||||
// var value = target.val();
|
||||
// var original = target.data('original');
|
||||
//
|
||||
// // disable input
|
||||
// target.prop('disabled', true);
|
||||
//
|
||||
// // replace link (for now)
|
||||
// link.attr('href', '#');
|
||||
//
|
||||
// // replace "left" with spinner.
|
||||
// leftCell.empty().html('<i class="fa fa-fw fa-spin fa-spinner"></i>');
|
||||
//
|
||||
// // send a post to Firefly to update the amount:
|
||||
// var newUri = budgetAmountUri.replace("REPLACE", id);
|
||||
//
|
||||
// $.post(newUri, {amount: value, start: periodStart, end: periodEnd, _token: token}).done(function (data) {
|
||||
//
|
||||
// // difference between new value and original value
|
||||
// var difference = value - original;
|
||||
//
|
||||
// // update budgeted value
|
||||
// budgeted = budgeted + difference;
|
||||
//
|
||||
// // fill in "left" value:
|
||||
//
|
||||
//
|
||||
// if (data.left_per_day !== null) {
|
||||
// leftCell.html(data.left + ' (' + data.left_per_day + ')');
|
||||
// } else {
|
||||
// leftCell.html(data.left);
|
||||
// }
|
||||
//
|
||||
// // update "budgeted" input:
|
||||
// target.val(data.amount);
|
||||
//
|
||||
// // enable thing again
|
||||
// target.prop('disabled', false);
|
||||
//
|
||||
// // set new original value:
|
||||
// target.data('original', data.amount);
|
||||
//
|
||||
// // run drawBudgetedBar() again:
|
||||
// drawBudgetedBar();
|
||||
//
|
||||
// // update the link if relevant:
|
||||
// link.attr('href', 'budgets/show/' + id);
|
||||
// if (data.limit > 0) {
|
||||
// link.attr('href', 'budgets/show/' + id + '/' + data.limit);
|
||||
// }
|
||||
//
|
||||
// // update the warning if relevant:
|
||||
// if (data.large_diff === true) {
|
||||
// $('span[class$="budget_warning"][data-id="' + id + '"]').html(data.warn_text).show();
|
||||
// console.log('Show warning for budget');
|
||||
// } else {
|
||||
// $('span[class$="budget_warning"][data-id="' + id + '"]').empty().hide();
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
|
||||
// /**
|
||||
// *
|
||||
// * @returns {boolean}
|
||||
// */
|
||||
// function updateIncome() {
|
||||
// "use strict";
|
||||
// $('#defaultModal').empty().load(updateIncomeUri, function () {
|
||||
// $('#defaultModal').modal('show');
|
||||
// });
|
||||
//
|
||||
// return false;
|
||||
// }
|
||||
|
||||
Reference in New Issue
Block a user