mirror of
https://github.com/firefly-iii/firefly-iii.git
synced 2026-01-06 22:21:42 +00:00
Allow user to set multi-currency available budget. WIP
This commit is contained in:
James Cole
@@ -0,0 +1,38 @@
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal"><span>×</span><span class="sr-only">{{ 'close'|_ }}</span>
|
||||
</button>
|
||||
<h4 class="modal-title">
|
||||
{{ trans('firefly.update_budget_amount_range',
|
||||
{start: start.formatLocalized(monthAndDayFormat), end: end.formatLocalized(monthAndDayFormat)}) }}
|
||||
</h4>
|
||||
</div>
|
||||
|
||||
<form style="display: inline;" id="income" action="{{ route('available-budgets.store') }}" method="POST">
|
||||
<div class="modal-body">
|
||||
<input type="hidden" name="_token" value="{{ csrf_token() }}"/>
|
||||
<input type="hidden" name="start" value="{{ start.format('Y-m-d') }}"/>
|
||||
<input type="hidden" name="end" value="{{ end.format('Y-m-d') }}"/>
|
||||
<input type="hidden" name="page" value="{{ page }}"/>
|
||||
<input type="hidden" name="currency_id" value="{{ currency.id }}"/>
|
||||
|
||||
<div class="form-group">
|
||||
<select class="form-control" name="currency_id">
|
||||
{% for currency in currencies %}
|
||||
<option label="{{ currency.name }}" value="{{ currency.id }}">{{ currency.name }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input step="any" class="form-control" id="amount" value="" autocomplete="off" name="amount" type="number"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-default" data-dismiss="modal">{{ 'close'|_ }}</button>
|
||||
<button type="submit" class="btn btn-primary">{{ 'set_available_amount'|_ }}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
37
resources/views/v1/budgets/available-budgets/create.twig
Normal file
37
resources/views/v1/budgets/available-budgets/create.twig
Normal file
@@ -0,0 +1,37 @@
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal"><span>×</span><span class="sr-only">{{ 'close'|_ }}</span>
|
||||
</button>
|
||||
<h4 class="modal-title">
|
||||
{{ trans('firefly.update_budget_amount_range',
|
||||
{start: start.formatLocalized(monthAndDayFormat), end: end.formatLocalized(monthAndDayFormat)}) }}
|
||||
</h4>
|
||||
</div>
|
||||
|
||||
<form style="display: inline;" id="income" action="{{ route('available-budgets.store') }}" method="POST">
|
||||
<div class="modal-body">
|
||||
<input type="hidden" name="_token" value="{{ csrf_token() }}"/>
|
||||
<input type="hidden" name="start" value="{{ start.format('Y-m-d') }}"/>
|
||||
<input type="hidden" name="end" value="{{ end.format('Y-m-d') }}"/>
|
||||
<input type="hidden" name="page" value="{{ page }}"/>
|
||||
<input type="hidden" name="currency_id" value="{{ currency.id }}"/>
|
||||
|
||||
<div class="form-group">
|
||||
<p class="form-control-static">{{ trans('firefly.ab_basic_modal_explain', {currency: currency.name}) }}</p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon">{{ currency.symbol|raw }}</div>
|
||||
<input step="any" class="form-control" id="amount" value="" autocomplete="off" name="amount" type="number"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-default" data-dismiss="modal">{{ 'close'|_ }}</button>
|
||||
<button type="submit" class="btn btn-primary">{{ 'set_available_amount'|_ }}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
33
resources/views/v1/budgets/available-budgets/edit.twig
Normal file
33
resources/views/v1/budgets/available-budgets/edit.twig
Normal file
@@ -0,0 +1,33 @@
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal"><span>×</span><span class="sr-only">{{ 'close'|_ }}</span>
|
||||
</button>
|
||||
<h4 class="modal-title">
|
||||
{{ trans('firefly.update_budget_amount_range',
|
||||
{start: availableBudget.start_date.formatLocalized(monthAndDayFormat), end: availableBudget.end_date.formatLocalized(monthAndDayFormat)}) }}
|
||||
</h4>
|
||||
</div>
|
||||
|
||||
<form style="display: inline;" id="income" action="{{ route('available-budgets.update', [availableBudget.id]) }}" method="POST">
|
||||
<div class="modal-body">
|
||||
<input type="hidden" name="_token" value="{{ csrf_token() }}"/>
|
||||
<input type="hidden" name="page" value="{{ page }}"/>
|
||||
<div class="form-group">
|
||||
<p class="form-control-static">{{ trans('firefly.ab_basic_modal_explain', {currency: availableBudget.transactionCurrency.name}) }}</p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon">{{ availableBudget.transactionCurrency.symbol|raw }}</div>
|
||||
<input step="any" class="form-control" id="amount" value="{{ availableBudget.amount }}" autocomplete="off" name="amount" type="number"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-default" data-dismiss="modal">{{ 'close'|_ }}</button>
|
||||
<button type="submit" class="btn btn-primary">{{ 'update_available_amount'|_ }}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -5,92 +5,7 @@
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="row">
|
||||
<div class="col-lg-9 col-md-8 col-sm-12 col-xs-12">
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">{{ start.formatLocalized(monthAndDayFormat) }} — {{ end.formatLocalized(monthAndDayFormat) }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<div class="row">
|
||||
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-3">
|
||||
<small>{{ 'budgeted'|_ }}: <span id="budgetedAmount" class="text-success">{{ budgeted|formatAmountPlain }}</span></small>
|
||||
</div>
|
||||
<div class="col-lg-9 col-md-9 col-sm-9 col-xs-9" style="text-align:right;margin-bottom:3px;">
|
||||
<small id="availableBar">{{ trans('firefly.available_between',{start: start.formatLocalized(monthAndDayFormat), end: end.formatLocalized(monthAndDayFormat) }) }}
|
||||
:
|
||||
<span id="available" data-value="{{ available }}">{{ available|formatAmountPlain }}</span>
|
||||
<a href="#" class="updateIncome btn btn-default btn-xs"><i class="fa fa-pencil"></i></a>
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
<div class="progress budgetedBar">
|
||||
<div class="progress-bar progress-bar-danger" id="progress-bar-danger" role="progressbar" aria-valuenow="0" aria-valuemin="0"
|
||||
aria-valuemax="100" style="width: 0;"></div>
|
||||
<div class="progress-bar progress-bar-warning" id="progress-bar-warning" role="progressbar" aria-valuenow="10" aria-valuemin="0"
|
||||
aria-valuemax="100" style="width: 0;"></div>
|
||||
<div class="progress-bar progress-bar-info" id="progress-bar-default" role="progressbar" aria-valuenow="0" aria-valuemin="0"
|
||||
aria-valuemax="100" style="width: 0;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" id="spentBar">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
<small>{{ trans('firefly.spent_between', {start: start.formatLocalized(monthAndDayFormat), end: end.formatLocalized(monthAndDayFormat)}) }}
|
||||
: {{ spent|formatAmount }}</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
<div class="progress spentBar">
|
||||
<div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"
|
||||
style="width: 0;"></div>
|
||||
<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"
|
||||
style="width: 0;"></div>
|
||||
<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"
|
||||
style="width: 0;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-3 col-md-4 col-sm-12 col-xs-12">
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">{{ 'transactionsWithoutBudget'|_ }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<p>
|
||||
<a href="{{ route('budgets.no-budget', [start.format('Y-m-d'), end.format('Y-m-d')]) }}">
|
||||
{{ trans('firefly.transactions_no_budget', {start: start.formatLocalized(monthAndDayFormat), end: end.formatLocalized(monthAndDayFormat)}) }}
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
{% if paginator.count > 0 and inactive.count > 0 %}
|
||||
<div class="box" id="createBudgetBox">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">{{ 'createBudget'|_ }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<a href="{{ route('budgets.create') }}" class="btn btn-success pull-right">{{ 'createBudget'|_ }}</a>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% if paginator.count == 0 and inactive.count == 0 and page == 1 %}
|
||||
{% include 'partials.empty' with {objectType: 'default', type: 'budgets',route: route('budgets.create')} %}
|
||||
{# make FF ignore demo for now. #}
|
||||
{% set shownDemo = true %}
|
||||
{% endif %}
|
||||
|
||||
{# date thing #}
|
||||
<!-- date selector -->
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
<div class="box">
|
||||
@@ -102,23 +17,29 @@
|
||||
<div class="col-lg-2 col-md-4 col-sm-12 col-xs-12">
|
||||
<select class="form-control selectPeriod" name="previous">
|
||||
<option label="{{ 'select_date'|_ }}" value="x">{{ 'select_date'|_ }}</option>
|
||||
{% for format, previousLabel in previousLoop %}
|
||||
<option label="{{ previousLabel }}" value="{{ format }}">{{ previousLabel }}</option>
|
||||
{% for array in prevLoop %}
|
||||
<option label="{{ array.title }}" value="{{ array.label }}" data-start="{{ array.start.format('Y-m-d') }}"
|
||||
data-end="{{ array.end.format('Y-m-d') }}">{{ array.title }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-lg-8 col-md-4 col-sm-12 col-xs-12 text-center">
|
||||
<div class="btn btn-group btn-group-lg" style="padding-top:0;">
|
||||
<a href="{{ route('budgets.index', [prev.format('Y-m-d')]) }}?page={{ page }}" class="btn btn-default" title="{{ prevText }}">←</a>
|
||||
<a href="{{ route('budgets.index', [start.format('Y-m-d')]) }}?page={{ page }}" class="btn btn-default">{{ currentMonth }}</a>
|
||||
<a href="{{ route('budgets.index', [next.format('Y-m-d')]) }}?page={{ page }}" class="btn btn-default" title="{{ nextText }}">→</a>
|
||||
<a href="{{ route('budgets.index', [prevLoop[0].start.format('Y-m-d'), prevLoop[0].end.format('Y-m-d')]) }}?page={{ page }}"
|
||||
class="btn btn-default" title="{{ prevLoop[0].title }}">←</a>
|
||||
<a title="{{ start.formatLocalized(monthAndDayFormat) }} - {{ end.formatLocalized(monthAndDayFormat) }}"
|
||||
href="{{ route('budgets.index', [start.format('Y-m-d'), end.format('Y-m-d')]) }}?page={{ page }}"
|
||||
class="btn btn-default">{{ periodTitle }}</a>
|
||||
<a href="{{ route('budgets.index', [nextLoop[0].start.format('Y-m-d'), nextLoop[0].end.format('Y-m-d')]) }}?page={{ page }}"
|
||||
class="btn btn-default" title="{{ nextLoop[0].title }}">→</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-2 col-md-4 col-sm-12 col-xs-12 text-right">
|
||||
<select class="form-control selectPeriod" name="next">
|
||||
<option label="{{ 'select_date'|_ }}" value="x">{{ 'select_date'|_ }}</option>
|
||||
{% for format, nextLabel in nextLoop %}
|
||||
<option label="{{ nextLabel }}" value="{{ format }}">{{ nextLabel }}</option>
|
||||
{% for array in nextLoop %}
|
||||
<option label="{{ array.title }}" value="{{ array.label }}" data-start="{{ array.start.format('Y-m-d') }}"
|
||||
data-end="{{ array.end.format('Y-m-d') }}">{{ array.title }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
@@ -127,6 +48,209 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- available budget configurator. -->
|
||||
{% if availableBudgets|length == 0 %}
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">
|
||||
{{ trans('firefly.total_available_budget_in_currency', {currency: defaultCurrency.name}) }}
|
||||
<br>
|
||||
<small>{{ trans('firefly.between_dates_breadcrumb', {start: start.formatLocalized(monthAndDayFormat), end: end.formatLocalized(monthAndDayFormat)}) }}</small>
|
||||
</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<div class="row">
|
||||
{# info about the amount budgeted #}
|
||||
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-3">
|
||||
<small>{{ 'budgeted'|_ }} ({{ 'see_below'|_ }}):
|
||||
<span class="budgeted_amount" data-value="{{ budgeted }}" data-id="0">
|
||||
{{ formatAmountBySymbol(budgeted, defaultCurrency.symbol, defaultCurrency.decimal_places) }}
|
||||
</span>
|
||||
</small>
|
||||
</div>
|
||||
{# info about the amount spent #}
|
||||
<div class="col-lg-9 col-md-9 col-sm-9 col-xs-9" style="text-align:right;margin-bottom:3px;">
|
||||
<small class="available_bar"
|
||||
data-id="0">{{ trans('firefly.available_between', {start: start.formatLocalized(monthAndDayFormat), end: end.formatLocalized(monthAndDayFormat) }) }}
|
||||
:
|
||||
<span class="available_amount" data-id="0" data-value="0"
|
||||
data-value="0">{{ formatAmountBySymbol(0, defaultCurrency.symbol, defaultCurrency.decimal_places, true) }}</span>
|
||||
<a href="#" data-id="0" class="update_ab btn btn-default btn-xs"><i class="fa fa-pencil"></i></a>
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
{# info text to show how much is spent (in currency). #}
|
||||
<div class="row spentInfo" data-id="0" data-value="{{ spent }}">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
<small>{{ trans('firefly.spent_between', {start: start.formatLocalized(monthAndDayFormat), end: end.formatLocalized(monthAndDayFormat)}) }}
|
||||
: {{ formatAmountBySymbol(spent, defaultCurrency.symbol, defaultCurrency.decimal_places) }} </small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% if enableAddButton %}
|
||||
<div class="col-lg-12">
|
||||
<p class="pull-right">
|
||||
<a href="#" class="btn btn-success btn-xs create_ab_alt">
|
||||
<i class="fa fa-plus-circle"></i>
|
||||
{{ 'alt_currency_ab_create'|_ }}</a>
|
||||
</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% set boxSize = 12 %}
|
||||
{% if availableBudgets|length > 1 %}
|
||||
{% set boxSize = 6 %}
|
||||
{% endif %}
|
||||
{% if availableBudgets|length > 0 %}
|
||||
<div class="row">
|
||||
{% for budget in availableBudgets %}
|
||||
<div class="col-lg-{{ boxSize }} col-md-12 col-sm-12 col-xs-12">
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">
|
||||
{{ trans('firefly.total_available_budget_in_currency', {currency: budget.transaction_currency.name}) }}
|
||||
<br>
|
||||
<small>{{ trans('firefly.between_dates_breadcrumb', {start: budget.start_date.formatLocalized(monthAndDayFormat), end: budget.end_date.formatLocalized(monthAndDayFormat)}) }}</small>
|
||||
</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<div class="row">
|
||||
{# info about the amount budgeted #}
|
||||
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-3">
|
||||
<small>{{ 'budgeted'|_ }}:
|
||||
<span class="text-success budgeted_amount" data-id="{{ budget.id }}">
|
||||
{{ formatAmountBySymbol(budget.budgeted, budget.transaction_currency.symbol, budget.transaction_currency.decimal_places, false) }}
|
||||
</span>
|
||||
</small>
|
||||
</div>
|
||||
{# info about the amount spent #}
|
||||
<div class="col-lg-9 col-md-9 col-sm-9 col-xs-9" style="text-align:right;margin-bottom:3px;">
|
||||
<small class="available_bar"
|
||||
data-id="{{ budget.id }}">{{ trans('firefly.available_between', {start: budget.start_date.formatLocalized(monthAndDayFormat), end: budget.end_date.formatLocalized(monthAndDayFormat) }) }}
|
||||
:
|
||||
<span class="available_amount" data-id="{{ budget.id }}"
|
||||
data-value="{{ budget.amount }}">{{ formatAmountBySymbol(budget.amount, budget.transaction_currency.symbol, budget.transaction_currency.decimal_places, true) }}</span>
|
||||
<a href="#" data-id="{{ budget.id }}" class="update_ab btn btn-default btn-xs"><i class="fa fa-pencil"></i></a>
|
||||
<a href="{{ route('available-budgets.delete', [budget.id]) }}" data-id="{{ budget.id }}"
|
||||
class="delete_ab btn btn-danger btn-xs"><i class="fa fa-trash"></i></a>
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
{# progresss bar to visualise available vs budgeted. #}
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
<div class="progress budgetedBar" data-id="{{ budget.id }}">
|
||||
<div class="progress-bar progress-bar-danger" data-id="{{ budget.id }}" role="progressbar" aria-valuenow="0"
|
||||
aria-valuemin="0"
|
||||
aria-valuemax="100" style="width: 0;"></div>
|
||||
<div class="progress-bar progress-bar-warning" data-id="{{ budget.id }}" role="progressbar" aria-valuenow="10"
|
||||
aria-valuemin="0"
|
||||
aria-valuemax="100" style="width: 0;"></div>
|
||||
<div class="progress-bar progress-bar-info" data-id="{{ budget.id }}" role="progressbar" aria-valuenow="0"
|
||||
aria-valuemin="0"
|
||||
aria-valuemax="100" style="width: 0;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{# info text to show how much is spent (in currency). #}
|
||||
<div class="row spentInfo" data-id="{{ budget.id }}">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
<small>{{ trans('firefly.spent_between', {start: budget.start_date.formatLocalized(monthAndDayFormat), end: budget.start_date.formatLocalized(monthAndDayFormat)}) }}
|
||||
: {{ formatAmountBySymbol(budget.spent, budget.transaction_currency.symbol, budget.transaction_currency.decimal_places) }} </small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{# bar to visualise spending in budget .#}
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
<div class="progress spentBar" data-id="{{ budget.id }}">
|
||||
<div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="0" aria-valuemin="0"
|
||||
aria-valuemax="100"
|
||||
style="width: 0;"></div>
|
||||
<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"
|
||||
style="width: 0;"></div>
|
||||
<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"
|
||||
style="width: 0;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% if enableAddButton %}
|
||||
<div class="col-lg-12">
|
||||
<p class="pull-right">
|
||||
<a href="#" class="btn btn-success btn-xs create_ab_alt">
|
||||
<i class="fa fa-plus-circle"></i>
|
||||
{{ 'alt_currency_ab_create'|_ }}</a>
|
||||
</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{#
|
||||
<div class="row">
|
||||
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-3">
|
||||
<small>{{ 'budgeted'|_ }}: <span id="budgetedAmount"
|
||||
class="text-success">{{ "-1"|formatAmountPlain }}{{ budgeted|formatAmountPlain }}</span></small>
|
||||
</div>
|
||||
<div class="col-lg-9 col-md-9 col-sm-9 col-xs-9" style="text-align:right;margin-bottom:3px;">
|
||||
<small id="availableBar">{{ trans('firefly.available_between',{start: start.formatLocalized(monthAndDayFormat), end: end.formatLocalized(monthAndDayFormat) }) }}
|
||||
:
|
||||
<span id="available" data-value="{{ available }}">{{ "-1"|formatAmountPlain }}{{ available|formatAmountPlain }}</span>
|
||||
<a href="#" class="updateIncome btn btn-default btn-xs"><i class="fa fa-pencil"></i></a>
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
<div class="progress budgetedBar">
|
||||
<div class="progress-bar progress-bar-danger" id="progress-bar-danger" role="progressbar" aria-valuenow="0" aria-valuemin="0"
|
||||
aria-valuemax="100" style="width: 0;"></div>
|
||||
<div class="progress-bar progress-bar-warning" id="progress-bar-warning" role="progressbar" aria-valuenow="10" aria-valuemin="0"
|
||||
aria-valuemax="100" style="width: 0;"></div>
|
||||
<div class="progress-bar progress-bar-info" id="progress-bar-default" role="progressbar" aria-valuenow="0" aria-valuemin="0"
|
||||
aria-valuemax="100" style="width: 0;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" id="spentBar">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
<small>{{ trans('firefly.spent_between', {start: start.formatLocalized(monthAndDayFormat), end: end.formatLocalized(monthAndDayFormat)}) }}
|
||||
: {{ "-1"|formatAmount }}{{ spent|formatAmount }}</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
<div class="progress spentBar">
|
||||
<div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"
|
||||
style="width: 0;"></div>
|
||||
<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"
|
||||
style="width: 0;"></div>
|
||||
<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"
|
||||
style="width: 0;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>#}
|
||||
{% if paginator.count == 0 and inactive.count == 0 and page == 1 %}
|
||||
{% include 'partials.empty' with {objectType: 'default', type: 'budgets',route: route('budgets.create')} %}
|
||||
{# make FF ignore demo for now. #}
|
||||
{% set shownDemo = true %}
|
||||
{% endif %}
|
||||
|
||||
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||||
@@ -162,6 +286,7 @@
|
||||
</div>
|
||||
</td>
|
||||
<td data-value="{{ budget.name }}">
|
||||
|
||||
{% if budgetInformation[budget.id]['currentLimit'] %}
|
||||
<a href="{{ route('budgets.show.limit', [budget.id, budgetInformation[budget.id]['currentLimit'].id]) }}"
|
||||
class="budget-link"
|
||||
@@ -188,14 +313,18 @@
|
||||
</td>
|
||||
<td class="hidden-sm hidden-xs spent" data-id="{{ budget.id }}" data-spent="{{ budgetInformation[budget.id]['spent'] }}"
|
||||
data-value="{{ budgetInformation[budget.id]['spent'] }}">
|
||||
{{ budgetInformation[budget.id]['spent']|formatAmount }}
|
||||
({{ (budgetInformation[budget.id]['spent'] / activeDaysPassed)|formatAmount }})
|
||||
{{ "-1"|formatAmount }}
|
||||
{#{{ budgetInformation[budget.id]['spent']|formatAmount }}#}
|
||||
({{ "-1"|formatAmount }})
|
||||
{#({{ (budgetInformation[budget.id]['spent'] / activeDaysPassed)|formatAmount }})#}
|
||||
</td>
|
||||
<td class="left" data-id="{{ budget.id }}"
|
||||
data-value="{{ (repAmount + budgetInformation[budget.id]['spent']) }}">
|
||||
{{ (repAmount + budgetInformation[budget.id]['spent'])|formatAmount }}
|
||||
{{ "-1"|formatAmount }}
|
||||
{#{{ (repAmount + budgetInformation[budget.id]['spent'])|formatAmount }}#}
|
||||
{% if repAmount + budgetInformation[budget.id]['spent'] > 0 %}
|
||||
({{ ((repAmount + budgetInformation[budget.id]['spent']) / activeDaysLeft)|formatAmount }})
|
||||
({{ "-1"|formatAmount }})
|
||||
{#({{ ((repAmount + budgetInformation[budget.id]['spent']) / activeDaysLeft)|formatAmount }})#}
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
@@ -213,8 +342,35 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% if inactive|length > 0 %}
|
||||
<div class="row">
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-3 col-md-4 col-sm-12 col-xs-12">
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">{{ 'transactionsWithoutBudget'|_ }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<p>
|
||||
<a href="{{ route('budgets.no-budget', [start.format('Y-m-d'), end.format('Y-m-d')]) }}">
|
||||
{{ trans('firefly.transactions_no_budget', {start: start.formatLocalized(monthAndDayFormat), end: end.formatLocalized(monthAndDayFormat)}) }}
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% if paginator.count > 0 and inactive.count > 0 %}
|
||||
<div class="col-lg-3 col-md-4 col-sm-12 col-xs-12">
|
||||
<div class="box" id="createBudgetBox">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">{{ 'createBudget'|_ }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<a href="{{ route('budgets.create') }}" class="btn btn-success pull-right">{{ 'createBudget'|_ }}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if inactive|length > 0 %}
|
||||
<div class="col-lg-3 col-sm-4 col-md-6">
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
@@ -231,8 +387,9 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block styles %}
|
||||
@@ -243,14 +400,17 @@
|
||||
<script src="v1/js/lib/jquery-ui.min.js?v={{ FF_VERSION }}" type="text/javascript"></script>
|
||||
<script type="text/javascript">
|
||||
// actually spent bar data:
|
||||
var spent = {{ spent * -1 }}; // must be positive for the calculation to work.
|
||||
var spent = 0;
|
||||
var page = {{ page }};
|
||||
// budgeted data:
|
||||
var budgeted = {{ budgeted }};
|
||||
var available = {{ available }};
|
||||
var budgetIndexUri = "{{ route('budgets.index','REPLACE') }}";
|
||||
var budgetAmountUri = "{{ route('budgets.amount','REPLACE') }}";
|
||||
var updateIncomeUri = "{{ route('budgets.income',[start.format('Y-m-d'),end.format('Y-m-d')]) }}?page={{ page }}";
|
||||
var budgeted = 0;
|
||||
var available = 0;
|
||||
var budgetIndexUri = "{{ route('budgets.index',['START','END']) }}";
|
||||
var createAvailableBudgetUri = "{{ route('available-budgets.create', [start.format('Y-m-d'), end.format('Y-m-d')]) }}";
|
||||
var createAltAvailableBudgetUri = "{{ route('available-budgets.create-alternative', [start.format('Y-m-d'), end.format('Y-m-d')]) }}";
|
||||
var editAvailableBudgetUri = "{{ route('available-budgets.edit', ['REPLACEME']) }}";
|
||||
{#var budgetAmountUri = "{{ route('budgets.amount','REPLACE') }}";#}
|
||||
{#var updateIncomeUri = "{{ route('budgets.income',[start.format('Y-m-d'),end.format('Y-m-d')]) }}?page={{ page }}";#}
|
||||
var periodStart = "{{ start.format('Y-m-d') }}";
|
||||
var periodEnd = "{{ end.format('Y-m-d') }}";
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user