mirror of
https://github.com/firefly-iii/firefly-iii.git
synced 2025-12-12 01:42:32 +00:00
Move v1 views
This commit is contained in:
James Cole
@@ -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 }}"/>
|
||||
|
||||
<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" required 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/budgets/available-budgets/create.twig
Normal file
37
resources/views/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" required 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/budgets/available-budgets/edit.twig
Normal file
33
resources/views/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, start.format('Y-m-d'), end.format('Y-m-d')]) }}" 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" required 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>
|
||||
|
||||
36
resources/views/budgets/budget-limits/create.twig
Normal file
36
resources/views/budgets/budget-limits/create.twig
Normal file
@@ -0,0 +1,36 @@
|
||||
<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.set_budget_limit_title',
|
||||
{start: start.formatLocalized(monthAndDayFormat), end: end.formatLocalized(monthAndDayFormat), budget: budget.name}) }}
|
||||
</h4>
|
||||
</div>
|
||||
|
||||
<form style="display: inline;" id="income" action="{{ route('budget-limits.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="budget_id" value="{{ budget.id }}"/>
|
||||
<div class="form-group">
|
||||
<select class="form-control" name="transaction_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_budget_limit'|_ }}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
64
resources/views/budgets/create.twig
Normal file
64
resources/views/budgets/create.twig
Normal file
@@ -0,0 +1,64 @@
|
||||
{% extends './v1/layout/default' %}
|
||||
|
||||
{% block breadcrumbs %}
|
||||
{{ Breadcrumbs.render(Route.getCurrentRoute.getName) }}
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
||||
<form method="POST" action="{{ route('budgets.store') }}" accept-charset="UTF-8" class="form-horizontal" id="store" enctype="multipart/form-data">
|
||||
<input name="_token" type="hidden" value="{{ csrf_token() }}">
|
||||
<input name="active" type="hidden" value="1">
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
|
||||
<div class="box box-primary">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">{{ 'mandatoryFields'|_ }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
{{ ExpandedForm.text('name') }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
|
||||
{# panel for auto-budget#}
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">{{ 'optionalFields'|_ }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
{{ ExpandedForm.select('auto_budget_type', autoBudgetTypes,null, {helpText: trans('firefly.auto_budget_help')}) }}
|
||||
{{ CurrencyForm.currencyList('auto_budget_currency_id') }}
|
||||
{{ ExpandedForm.amountNoCurrency('auto_budget_amount') }}
|
||||
{{ ExpandedForm.select('auto_budget_period', autoBudgetPeriods, null) }}
|
||||
{{ ExpandedForm.file('attachments[]', {'multiple': 'multiple','helpText': trans('firefly.upload_max_file_size', {'size': uploadSize|filesize}) }) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
|
||||
{# panel for options #}
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">{{ 'options'|_ }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
{{ ExpandedForm.optionsList('create','budget') }}
|
||||
</div>
|
||||
<div class="box-footer">
|
||||
<button type="submit" class="btn pull-right btn-success">{{ 'store_new_budget'|_ }}</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
{% endblock %}
|
||||
{% block scripts %}
|
||||
<script type="text/javascript" src="v1/js/ff/budgets/create.js?v={{ FF_VERSION }}" nonce="{{ JS_NONCE }}"></script>
|
||||
{% endblock %}
|
||||
44
resources/views/budgets/delete.twig
Normal file
44
resources/views/budgets/delete.twig
Normal file
@@ -0,0 +1,44 @@
|
||||
{% extends './v1/layout/default' %}
|
||||
|
||||
{% block breadcrumbs %}
|
||||
{{ Breadcrumbs.render(Route.getCurrentRoute.getName, budget) }}
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
||||
<form method="POST" action="{{ route('budgets.destroy',budget.id) }}" accept-charset="UTF-8" class="form-horizontal" id="destroy">
|
||||
<input name="_token" type="hidden" value="{{ csrf_token() }}">
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-6 col-lg-offset-3 col-md-12 col-sm-12">
|
||||
<div class="box box-danger">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">{{ trans('form.delete_budget', {'name': budget.name}) }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<p class="text-danger">
|
||||
{{ trans('form.permDeleteWarning') }}
|
||||
</p>
|
||||
|
||||
<p>
|
||||
{{ trans('form.budget_areYouSure', {'name': budget.name}) }}
|
||||
</p>
|
||||
|
||||
<p>
|
||||
{% if budget.transactionjournals.count() > 0 %}
|
||||
{{ Lang.choice('form.budget_keep_transactions', budget.transactionjournals.count(), {count: budget.transactionjournals.count() }) }}
|
||||
{% endif %}
|
||||
</p>
|
||||
|
||||
</div>
|
||||
<div class="box-footer">
|
||||
<input type="submit" name="submit" value="{{ trans('form.deletePermanently') }}" class="btn btn-danger pull-right"/>
|
||||
<a href="{{ URL.previous() }}" class="btn-default btn">{{ trans('form.cancel') }}</a>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
{% endblock %}
|
||||
62
resources/views/budgets/edit.twig
Normal file
62
resources/views/budgets/edit.twig
Normal file
@@ -0,0 +1,62 @@
|
||||
{% extends './v1/layout/default' %}
|
||||
|
||||
{% block breadcrumbs %}
|
||||
{{ Breadcrumbs.render(Route.getCurrentRoute.getName, budget) }}
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
{{ Form.model(budget, {'class' : 'form-horizontal','enctype': 'multipart/form-data','id' : 'update','url' : route('budgets.update',budget.id) } ) }}
|
||||
<input type="hidden" name="id" value="{{ budget.id }}"/>
|
||||
<div class="row">
|
||||
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
|
||||
<div class="box box-primary">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">{{ 'mandatoryFields'|_ }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
{# only correct way to do active checkbox #}
|
||||
{{ ExpandedForm.checkbox('active', 1) }}
|
||||
{{ ExpandedForm.text('name') }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
|
||||
{# panel for auto-budget #}
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">{{ 'optionalFields'|_ }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
{{ ExpandedForm.select('auto_budget_type', autoBudgetTypes, autoBudget.auto_budget_type) }}
|
||||
{{ CurrencyForm.currencyList('auto_budget_currency_id', autoBudget.transaction_currency_id) }}
|
||||
{{ ExpandedForm.amountNoCurrency('auto_budget_amount', preFilled.auto_budget_amount) }}
|
||||
{{ ExpandedForm.select('auto_budget_period', autoBudgetPeriods, autoBudget.period) }}
|
||||
{{ ExpandedForm.file('attachments[]', {'multiple': 'multiple','helpText': trans('firefly.upload_max_file_size', {'size': uploadSize|filesize}) }) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
|
||||
{# panel for options #}
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">{{ 'options'|_ }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
{{ ExpandedForm.optionsList('update','budget') }}
|
||||
</div>
|
||||
<div class="box-footer">
|
||||
<button type="submit" class="btn pull-right btn-success">{{ 'update_budget'|_ }}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
|
||||
{% endblock %}
|
||||
{% block scripts %}
|
||||
<script type="text/javascript" src="v1/js/ff/budgets/edit.js?v={{ FF_VERSION }}" nonce="{{ JS_NONCE }}"></script>
|
||||
{% endblock %}
|
||||
482
resources/views/budgets/index.twig
Normal file
482
resources/views/budgets/index.twig
Normal file
@@ -0,0 +1,482 @@
|
||||
{% extends './v1/layout/default' %}
|
||||
|
||||
{% block breadcrumbs %}
|
||||
{{ Breadcrumbs.render(Route.getCurrentRoute.getName) }}
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<!-- date selector -->
|
||||
<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">{{ 'budget_period_navigator'|_ }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<div class="row" id="periodNavigator">
|
||||
<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 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', [prevLoop[0].start.format('Y-m-d'), prevLoop[0].end.format('Y-m-d')]) }}"
|
||||
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')]) }}"
|
||||
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')]) }}"
|
||||
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 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>
|
||||
</div>
|
||||
</div>
|
||||
</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" data-currency="{{ defaultCurrency.id }}">
|
||||
{{ 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-currency="{{ defaultCurrency.id }}"
|
||||
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"><span class="fa fa-pencil"></span></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-light btn-xs create_ab_alt">
|
||||
<span class="fa fa-plus-circle"></span>
|
||||
{{ '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 }}" data-currency="{{ budget.transaction_currency.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"><span class="fa fa-pencil"></span></a>
|
||||
<a href="#" data-id="{{ budget.id }}" class="delete_ab btn btn-danger btn-xs"><span class="fa fa-trash"></span></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 budgeted_bar" data-id="{{ budget.id }}" data-budgeted="{{ budget.budgeted }}"
|
||||
data-available="{{ budget.amount }}" data-currency="{{ budget.transaction_currency.id }}">
|
||||
{# red: the exact amount of the available budget, if more has budgeted. #}
|
||||
<div class="progress-bar progress-bar-danger" data-id="{{ budget.id }}" role="progressbar" aria-valuenow="10"
|
||||
aria-valuemin="0"
|
||||
aria-valuemax="100" style="width: 0;"></div>
|
||||
|
||||
{# orange: overbudgeted amount #}
|
||||
<div class="progress-bar progress-bar-warning" data-id="{{ budget.id }}" role="progressbar" aria-valuenow="0"
|
||||
aria-valuemin="0"
|
||||
aria-valuemax="100" style="width: 0;"></div>
|
||||
|
||||
{# budgeted amount if enough or les #}
|
||||
<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.end_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 spent_bar" data-id="{{ budget.id }}" data-budgeted="{{ budget.budgeted }}"
|
||||
data-spent="{{ budget.spent }}">
|
||||
<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-light btn-xs create_ab_alt">
|
||||
<span class="fa fa-plus-circle"></span>
|
||||
{{ 'alt_currency_ab_create'|_ }}</a>
|
||||
</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if budgets|length == 0 and inactive.count() == 0 %}
|
||||
{% include 'partials.empty' with {objectType: 'default', type: 'budgets',route: route('budgets.create')} %}
|
||||
{# make FF ignore demo for now. #}
|
||||
{% set shownDemo = true %}
|
||||
{% else %}
|
||||
|
||||
<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">{{ 'budgets'|_ }}</h3>
|
||||
</div>
|
||||
<div class="box-body no-padding">
|
||||
<div style="padding:8px;">
|
||||
<a href="{{ route('budgets.create') }}" class="btn btn-success"><span class="fa fa-plus fa-fw"></span> {{ 'createBudget'|_ }}</a>
|
||||
</div>
|
||||
<table class="table table-bordered sortable-table table-striped sortable" id="budgetList">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="hidden-sm hidden-xs" style="width:10%;"> </th>
|
||||
<th>{{ 'budget'|_ }}</th>
|
||||
<th style="width:25%;">{{ 'budgeted'|_ }}</th>
|
||||
<th class="hidden-sm hidden-xs">{{ 'spent'|_ }} ({{ 'per_day'|_|lower }})</th>
|
||||
<th>{{ 'left'|_ }} ({{ 'per_day'|_|lower }})</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for budget in budgets %}
|
||||
<tr data-id="{{ budget.id }}">
|
||||
<td class="hidden-sm hidden-xs">
|
||||
<div class="btn-group btn-group-xs">
|
||||
<a href="#" class="handle object-handle btn btn-default"><span class="fa fa-fw fa-bars"></span></a>
|
||||
<a href="{{ route('budgets.edit', budget.id) }}" class="btn btn-xs btn-default"><span class="fa fa-fw fa-pencil"></span></a>
|
||||
<a href="{{ route('budgets.delete', budget.id) }}" class="btn btn-xs btn-danger"><span class="fa fa-fw fa-trash-o"></span></a>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
{% if 0 == budget.budgeted|length %}
|
||||
<a href="{{ route('budgets.show', budget.id) }}" data-id="{{ budget.id }}">{{ budget.name }}</a>
|
||||
{% endif %}
|
||||
{% if 1 == budget.budgeted|length %}
|
||||
{% for budgetLimit in budget.budgeted %}
|
||||
<a href="{{ route('budgets.show.limit', [budget.id, budgetLimit.id]) }}" data-id="{{ budget.id }}">{{ budget.name }}</a>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
{% if budget.budgeted|length > 1 %}
|
||||
{% for budgetLimit in budget.budgeted %}
|
||||
<a href="{{ route('budgets.show.limit', [budget.id, budgetLimit.id]) }}" data-id="{{ budget.id }}">{{ budget.name }} ({{ budgetLimit.currency_name }})</a><br>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
{% if budget.auto_budget %}
|
||||
{% if 1 == budget.auto_budget.auto_budget_type %}
|
||||
<span class="fa fa-fw fa-calendar-check-o" title="{{ 'auto_budget_reset_icon'|_ }}"></span>
|
||||
{% endif %}
|
||||
{% if 2 == budget.auto_budget.auto_budget_type %}
|
||||
<span class="fa fa-fw fa-calendar-plus-o" title="{{ 'auto_budget_rollover_icon'|_ }}"></span>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% if budget.attachments.count() > 0 %}
|
||||
<span class="fa fa-paperclip"></span>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td>
|
||||
{% if 0==budget.budgeted|length %}
|
||||
<div class="input-group">
|
||||
<div class="input-group-addon">{{ defaultCurrency.symbol }}</div>
|
||||
<input type="hidden" name="balance_currency_id" value="{{ defaultCurrency.id }}"/>
|
||||
<input class="form-control budget_amount" data-original="0" data-id="{{ budget.id }}"
|
||||
data-currency="{{ defaultCurrency.id }}" data-limit="0" value="0" autocomplete="off" min="0" name="amount"
|
||||
type="number">
|
||||
</div>
|
||||
<span class="text-danger budget_warning" data-id="{{ budget.id }}" data-budgetLimit="{{ budgetLimit.id }}"
|
||||
style="display:none;"></span>
|
||||
{% endif %}
|
||||
{% if budget.budgeted|length > 0 %}
|
||||
{% for budgetLimit in budget.budgeted %}
|
||||
{% if not budgetLimit.in_range %}
|
||||
<small class="text-muted">
|
||||
{{ trans('firefly.budget_limit_not_in_range', {start: budgetLimit.start_date, end: budgetLimit.end_date}) }}
|
||||
</small><br>
|
||||
{% endif %}
|
||||
<div class="input-group bl_entry" data-budget-limit-id="{{ budgetLimit.id }}">
|
||||
<div class="input-group-addon">{{ budgetLimit.currency_symbol }}</div>
|
||||
<input class="form-control budget_amount" data-original="{{ budgetLimit.amount }}"
|
||||
data-id="{{ budget.id }}" data-limit="{{ budgetLimit.id }}" value="{{ budgetLimit.amount }}"
|
||||
autocomplete="off"
|
||||
min="0" name="amount" type="number">
|
||||
<div class="input-group-btn">
|
||||
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true"
|
||||
aria-expanded="false"><span class="caret"></span></button>
|
||||
<ul class="dropdown-menu">
|
||||
<li>
|
||||
<a class="delete_bl" href="#" data-budget-limit-id="{{ budgetLimit.id }}">{{ trans('firefly.remove_budgeted_amount', {currency: budgetLimit.currency_name }) }}</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<span class="text-danger budget_warning" data-id="{{ budget.id }}" data-budgetLimit="{{ budgetLimit.id }}"
|
||||
style="display:none;"></span>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% if budget.budgeted|length < currencies.count() %}
|
||||
<a href="#" class="btn btn-light btn-xs create_bl" data-id="{{ budget.id }}">
|
||||
<span class="fa fa-plus-circle"></span>
|
||||
</a>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td class="hidden-sm hidden-xs spent" data-id="{{ budget.id }}" style="text-align:right;">
|
||||
{% for spentInfo in budget.spent %}
|
||||
{{ formatAmountBySymbol(spentInfo.spent, spentInfo.currency_symbol, spentInfo.currency_decimal_places) }}
|
||||
({{ formatAmountBySymbol(spentInfo.spent / activeDaysPassed, spentInfo.currency_symbol, spentInfo.currency_decimal_places) }})
|
||||
<br/>
|
||||
{% endfor %}
|
||||
{% for budgetLimit in budget.budgeted %}
|
||||
{% if null == budget.spent[budgetLimit.currency_id] %}
|
||||
{{ formatAmountBySymbol(0, budgetLimit.currency_symbol, budgetLimit.currency_decimal_places) }}<br/>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</td>
|
||||
<td class="left" data-id="{{ budget.id }}" style="text-align: right;">
|
||||
{% for spentInfo in budget.spent %}
|
||||
{% set countLimit = 0 %}
|
||||
{% for budgetLimit in budget.budgeted %}
|
||||
{% if spentInfo.currency_id == budgetLimit.currency_id and budgetLimit.in_range %}
|
||||
{% set countLimit = countLimit + 1 %}
|
||||
<span class="left_span" data-currency="{{ spentInfo.currency_id }}" data-limit="{{ budgetLimit.id }}"
|
||||
data-value="{{ spentInfo.spent + budgetLimit.amount }}" class="amount_left">
|
||||
{{ formatAmountBySymbol(spentInfo.spent + budgetLimit.amount, spentInfo.currency_symbol, spentInfo.currency_decimal_places) }}
|
||||
{% if spentInfo.spent + budgetLimit.amount > 0 %}
|
||||
({{ formatAmountBySymbol((spentInfo.spent + budgetLimit.amount) / activeDaysLeft, spentInfo.currency_symbol, spentInfo.currency_decimal_places) }})
|
||||
{% else %}
|
||||
({{ formatAmountBySymbol(0, spentInfo.currency_symbol, spentInfo.currency_decimal_places) }})
|
||||
{% endif %}
|
||||
</span>
|
||||
<br/>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% if countLimit == 0 %}
|
||||
<span class="left_span" data-id="{{ budget.id }}" data-currency="{{ spentInfo.currency_id }}" data-limit="0"
|
||||
class="amount_left" data-value="{{ spentInfo.spent }}">
|
||||
{{ formatAmountBySymbol(spentInfo.spent, spentInfo.currency_symbol, spentInfo.currency_decimal_places) }}
|
||||
</span>
|
||||
<br/>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% for budgetLimit in budget.budgeted %}
|
||||
{% if null == budget.spent[budgetLimit.currency_id] %}
|
||||
<span class="left_span" data-currency="{{ spentInfo.currency_id }}" data-limit="{{ budgetLimit.id }}"
|
||||
data-value="{{ spentInfo.spent + budgetLimit.amount }}" class="amount_left">
|
||||
{{ formatAmountBySymbol(budgetLimit.amount, budgetLimit.currency_symbol, budgetLimit.currency_decimal_places) }}
|
||||
{% if budgetLimit.in_range %}
|
||||
({{ formatAmountBySymbol(budgetLimit.amount / activeDaysLeft, budgetLimit.currency_symbol, budgetLimit.currency_decimal_places) }})
|
||||
{% endif %}
|
||||
</span>
|
||||
<br/>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<td> </td>
|
||||
<td><em>{{ 'sum'|_ }}</em></td>
|
||||
<td class="hidden-sm hidden-xs" style="text-align:right;">
|
||||
{% for arr in sums.budgeted %}
|
||||
{{ formatAmountBySymbol(arr.amount, arr.currency_symbol, arr.currency_decimal_places) }}<br/>
|
||||
{% endfor %}
|
||||
</td>
|
||||
<td class="hidden-sm hidden-xs" style="text-align:right;">
|
||||
{% for arr in sums.spent %}
|
||||
{{ formatAmountBySymbol(arr.amount, arr.currency_symbol, arr.currency_decimal_places) }}
|
||||
({{ formatAmountBySymbol(arr.amount / activeDaysPassed, arr.currency_symbol, arr.currency_decimal_places) }})
|
||||
<br/>
|
||||
{% endfor %}
|
||||
</td>
|
||||
<td style="text-align: right;">
|
||||
{% for arr in sums.left %}
|
||||
{{ formatAmountBySymbol(arr.amount, arr.currency_symbol, arr.currency_decimal_places) }}
|
||||
({{ formatAmountBySymbol(arr.amount / activeDaysLeft, arr.currency_symbol, arr.currency_decimal_places) }})
|
||||
<br/>
|
||||
{% endfor %}
|
||||
</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
</div>
|
||||
<div class="box-footer">
|
||||
<a href="{{ route('budgets.create') }}" class="btn btn-success"><span class="fa fa-plus fa-fw"></span> {{ 'createBudget'|_ }}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<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">
|
||||
<h3 class="box-title">{{ 'inactiveBudgets'|_ }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
{% for budget in inactive %}
|
||||
{% if loop.index == inactive.count() %}
|
||||
<a href="{{ route('budgets.show',budget.id) }}">{{ budget.name }}</a>
|
||||
{% else %}
|
||||
<a href="{{ route('budgets.show',budget.id) }}">{{ budget.name }}</a>,
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block styles %}
|
||||
<link href="v1/css/bootstrap-sortable.css?v={{ FF_VERSION }}" type="text/css" rel="stylesheet" media="all" nonce="{{ JS_NONCE }}">
|
||||
{% endblock %}
|
||||
|
||||
{% block scripts %}
|
||||
<script src="v1/js/lib/jquery-ui.min.js?v={{ FF_VERSION }}" type="text/javascript" nonce="{{ JS_NONCE }}"></script>
|
||||
<script type="text/javascript" nonce="{{ JS_NONCE }}">
|
||||
|
||||
// index route.
|
||||
var budgetIndexUri = "{{ route('budgets.index',['START','END']) }}";
|
||||
|
||||
// create available budgets / edit
|
||||
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', start.format('Y-m-d'), end.format('Y-m-d')]) }}";
|
||||
var deleteABUrl = "{{ route('available-budgets.delete') }}";
|
||||
|
||||
// budget limit create form.
|
||||
var createBudgetLimitUri = "{{ route('budget-limits.create', ['REPLACEME', start.format('Y-m-d'), end.format('Y-m-d')]) }}";
|
||||
var storeBudgetLimitUri = "{{ route('budget-limits.store') }}";
|
||||
var updateBudgetLimitUri = "{{ route('budget-limits.update', ['REPLACEME']) }}";
|
||||
var deleteBudgetLimitUrl = "{{ route('budget-limits.delete', ['REPLACEME']) }}";
|
||||
var totalBudgetedUri = "{{ route('json.budget.total-budgeted', ['REPLACEME', start.format('Y-m-d'), end.format('Y-m-d')]) }}";
|
||||
|
||||
// period thing:
|
||||
var periodStart = "{{ start.format('Y-m-d') }}";
|
||||
var periodEnd = "{{ end.format('Y-m-d') }}";
|
||||
</script>
|
||||
<script type="text/javascript" src="v1/js/lib/bootstrap-sortable.js?v={{ FF_VERSION }}" nonce="{{ JS_NONCE }}"></script>
|
||||
<script type="text/javascript" src="v1/js/ff/budgets/index.js?v={{ FF_VERSION }}" nonce="{{ JS_NONCE }}"></script>
|
||||
{% endblock %}
|
||||
64
resources/views/budgets/no-budget.twig
Normal file
64
resources/views/budgets/no-budget.twig
Normal file
@@ -0,0 +1,64 @@
|
||||
{% extends './v1/layout/default' %}
|
||||
|
||||
{% block breadcrumbs %}
|
||||
{{ Breadcrumbs.render(Route.getCurrentRoute.getName, start, end) }}
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
||||
{# upper show-all instruction #}
|
||||
{% if periods|length > 0 %}
|
||||
<div class="row">
|
||||
<div class="col-lg-offset-9 col-lg-3 col-md-offset-9 col-md-3 col-sm-12 col-xs-12">
|
||||
<p class="small text-center"><a href="{{ route('budgets.no-budget',['all']) }}">{{ 'showEverything'|_ }}</a></p>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<div class="row">
|
||||
<div class="{% if periods|length > 0 %}col-lg-9 col-md-9 col-sm-12{% else %}col-lg-12 col-md-12 col-sm-12{% endif %}">
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">{{ subTitle }}</h3>
|
||||
</div>
|
||||
<div class="box-body ">
|
||||
|
||||
{% if periods|length > 0 %}
|
||||
{% include 'list.groups' %}
|
||||
<p>
|
||||
<span class="fa fa-calendar"></span>
|
||||
<a href="{{ route('budgets.no-budget-all') }}">{{ 'show_all_no_filter'|_ }}</a>
|
||||
</p>
|
||||
{% else %}
|
||||
{% include 'list.groups' %}
|
||||
<p>
|
||||
<span class="fa fa-calendar"></span>
|
||||
<a href="{{ route('budgets.no-budget') }}">{{ 'show_the_current_period_and_overview'|_ }}</a>
|
||||
</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% if periods|length > 0 %}
|
||||
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
|
||||
{% include 'list.periods' %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
|
||||
{# lower show-all instruction #}
|
||||
{% if periods|length > 0 %}
|
||||
<div class="row">
|
||||
<div class="col-lg-offset-9 col-lg-3 col-md-offset-9 col-md-3 col-sm-12 col-xs-12">
|
||||
<p class="small text-center"><a href="{{ route('budgets.no-budget-all') }}">{{ 'showEverything'|_ }}</a></p>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% endblock %}
|
||||
{% block scripts %}
|
||||
{# required for groups.twig #}
|
||||
<script type="text/javascript" src="v1/js/ff/list/groups.js?v={{ FF_VERSION }}" nonce="{{ JS_NONCE }}"></script>
|
||||
{% endblock %}
|
||||
229
resources/views/budgets/show.twig
Normal file
229
resources/views/budgets/show.twig
Normal file
@@ -0,0 +1,229 @@
|
||||
{% extends './v1/layout/default' %}
|
||||
|
||||
{% block breadcrumbs %}
|
||||
{{ Breadcrumbs.render(Route.getCurrentRoute.getName, budget, budgetLimit) }}
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="row">
|
||||
<div class="{% if attachments.count() == 0 %}col-lg-12 col-md-12 col-sm-12 col-xs-12{% else %}col-lg-8 col-md-6 col-sm-12 col-xs-12{% endif %}">
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">
|
||||
{% if budgetLimit %}
|
||||
{{ trans('firefly.chart_budget_in_period', {name: budget.name, start: budgetLimit.start_date.formatLocalized(monthAndDayFormat), end: budgetLimit.end_date.formatLocalized(monthAndDayFormat),currency: budgetLimit.transactionCurrency.name }) }}
|
||||
{% else %}
|
||||
{{ trans('firefly.chart_all_journals_for_budget', {name:budget.name}) }}
|
||||
{% endif %}
|
||||
</h3>
|
||||
<div class="box-tools pull-right">
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-box-tool dropdown-toggle" data-toggle="dropdown"><span class="fa fa-ellipsis-v"></span></button>
|
||||
<ul class="dropdown-menu" role="menu">
|
||||
<li><a href="{{ route('budgets.edit',budget.id) }}"><span class="fa fa-pencil fa-fw"></span> {{ 'edit'|_ }}</a></li>
|
||||
<li><a href="{{ route('budgets.delete',budget.id) }}"><span class="fa fa-trash fa-fw"></span> {{ 'delete'|_ }}</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<canvas id="budgetOverview" style="width:100%;height:400px;" height="400" width="100%"></canvas>
|
||||
</div>
|
||||
{% if budgetLimit %}
|
||||
<div class="box-footer">
|
||||
<p class="text-muted">
|
||||
{{ trans('firefly.chart_budget_in_period_only_currency', {currency: budgetLimit.transactionCurrency.name}) }}
|
||||
</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% if attachments.count() > 0 %}
|
||||
<div class="col-lg-4 col-md-6 col-sm-12 col-xs-12">
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">
|
||||
{{ 'attachments'|_ }}
|
||||
</h3>
|
||||
</div>
|
||||
<div class="box-body no-padding">
|
||||
{% include 'list.attachments' %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-4 col-md-6 col-sm-12 col-xs-12">
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">{{ 'expenses_by_category'|_ }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<div style="width:100%;margin:0 auto;">
|
||||
<canvas id="budget-cat-out" style="width:100%;height:250px;" height="250"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
{% if budgetLimit %}
|
||||
<div class="box-footer">
|
||||
<p class="text-muted">
|
||||
{{ trans('firefly.chart_budget_in_period_only_currency', {currency: budgetLimit.transactionCurrency.name}) }}
|
||||
</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-sm-12 col-xs-12">
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">{{ 'expenses_by_asset_account'|_ }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<div style="width:100%;margin:0 auto;">
|
||||
<canvas id="budget-asset-out" style="width:100%;height:250px;" height="250"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
{% if budgetLimit %}
|
||||
<div class="box-footer">
|
||||
<p class="text-muted">
|
||||
{{ trans('firefly.chart_budget_in_period_only_currency', {currency: budgetLimit.transactionCurrency.name}) }}
|
||||
</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-sm-12 col-xs-12">
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">{{ 'expenses_by_expense_account'|_ }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
<div style="width:100%;margin:0 auto;">
|
||||
<canvas id="budget-expense-out" style="width:100%;height:250px;" height="250"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
{% if budgetLimit %}
|
||||
<div class="box-footer">
|
||||
<p class="text-muted">
|
||||
{{ trans('firefly.chart_budget_in_period_only_currency', {currency: budgetLimit.transactionCurrency.name}) }}
|
||||
</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% if limits|length > 0 %}
|
||||
<div class="row">
|
||||
<div class="col-lg-offset-9 col-lg-3 col-md-offset-9 col-md-3 col-sm-12 col-xs-12">
|
||||
<p class="small text-center"><a href="{{ route('budgets.show',budget.id) }}">{{ 'showEverything'|_ }}</a></p>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<div class="row">
|
||||
<div class="{% if limits|length > 0 %}col-lg-9 col-md-9 col-sm-12 col-xs-12{% else %}col-lg-12 col-md-12 col-sm-12 col-xs-12{% endif %}">
|
||||
|
||||
<div class="box">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title">{{ 'transactions'|_ }}</h3>
|
||||
</div>
|
||||
<div class="box-body">
|
||||
{% include 'list.groups' %}
|
||||
{% if budgetLimit %}
|
||||
<p>
|
||||
<span class="fa fa-calendar"></span>
|
||||
<a href="{{ route('budgets.show', [budget.id]) }}">
|
||||
{{ 'show_all_no_filter'|_ }}
|
||||
</a>
|
||||
</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% if limits|length > 0 %}
|
||||
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
|
||||
{% for limit in limits %}
|
||||
<div class="box {% if limit.start_date == budgetLimit.start_date %}box-primary box-solid{% endif %}">
|
||||
<div class="box-header with-border">
|
||||
<h3 class="box-title"><a
|
||||
href="{{ route('budgets.show.limit',[budget.id,limit.id]) }}">
|
||||
{{ limit.start_date.formatLocalized(monthAndDayFormat) }} —
|
||||
{{ limit.end_date.formatLocalized(monthAndDayFormat) }}
|
||||
</a>
|
||||
</h3>
|
||||
</div>
|
||||
<div class="box-body no-padding">
|
||||
<table class="table table-hover">
|
||||
<tr>
|
||||
<td style="width:33%;">{{ 'amount'|_ }}</td>
|
||||
<td>
|
||||
{{ formatAmountBySymbol(limit.amount, limit.transactionCurrency.symbol, limit.transactionCurrency.decimal_places) }}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width:33%;">{{ 'spent'|_ }}</td>
|
||||
<td>
|
||||
{{ formatAmountBySymbol(limit.spent, limit.transactionCurrency.symbol, limit.transactionCurrency.decimal_places) }}
|
||||
</td>
|
||||
</tr>
|
||||
{% if limit.spent > 0 %}
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
{% set overspent = limit.amount + limit.spent < 0 %}
|
||||
|
||||
{% if overspent %}
|
||||
{% set pct = (limit.spent != 0 ? (limit.amount / (limit.spent*-1))*100 : 0) %} {# must have -1 here #}
|
||||
<div class="progress progress-striped">
|
||||
<div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="{{ pct|round }}"
|
||||
aria-valuemin="0"
|
||||
aria-valuemax="100" style="width: {{ pct|round }}%;"></div>
|
||||
<div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="{{ (100-pct)|round }}"
|
||||
aria-valuemin="0" aria-valuemax="100" style="width: {{ (100-pct)|round }}%;"></div>
|
||||
</div>
|
||||
{% else %}
|
||||
{% set pct = (limit.amount != 0 ? (((limit.spent*-1) / limit.amount)*100) : 0) %} {# must have -1 here #}
|
||||
<div class="progress progress-striped">
|
||||
<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="{{ pct|round }}"
|
||||
aria-valuemin="0"
|
||||
aria-valuemax="100" style="width: {{ pct|round }}%;"></div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</td>
|
||||
</tr>
|
||||
{% endif %}
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
<p class="small text-center"><a href="{{ route('budgets.show',budget.id) }}">{{ 'showEverything'|_ }}</a></p>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
{% block scripts %}
|
||||
<script type="text/javascript" nonce="{{ JS_NONCE }}">
|
||||
var budgetID = {{ budget.id }};
|
||||
var budgetLimitID = 0;
|
||||
{% if budgetLimit.id %}
|
||||
budgetLimitID = {{ budgetLimit.id }};
|
||||
var budgetChartUri = '{{ route('chart.budget.budget-limit', [budget.id, budgetLimit.id] ) }}';
|
||||
var currencySymbol = '{{ budgetLimit.transactionCurrency.symbol }}';
|
||||
var expenseCategoryUri = '{{ route('chart.budget.expense-category', [budget.id, budgetLimit.id]) }}';
|
||||
var expenseAssetUri = '{{ route('chart.budget.expense-asset', [budget.id, budgetLimit.id]) }}';
|
||||
var expenseExpenseUri = '{{ route('chart.budget.expense-expense', [budget.id, budgetLimit.id]) }}';
|
||||
{% else %}
|
||||
var budgetChartUri = '{{ route('chart.budget.budget', [budget.id] ) }}';
|
||||
var expenseCategoryUri = '{{ route('chart.budget.expense-category', [budget.id]) }}';
|
||||
var expenseAssetUri = '{{ route('chart.budget.expense-asset', [budget.id]) }}';
|
||||
var expenseExpenseUri = '{{ route('chart.budget.expense-expense', [budget.id]) }}';
|
||||
{% endif %}
|
||||
</script>
|
||||
|
||||
<script type="text/javascript" src="v1/js/lib/Chart.bundle.min.js?v={{ FF_VERSION }}" nonce="{{ JS_NONCE }}"></script>
|
||||
<script type="text/javascript" src="v1/js/ff/charts.defaults.js?v={{ FF_VERSION }}" nonce="{{ JS_NONCE }}"></script>
|
||||
<script type="text/javascript" src="v1/js/ff/charts.js?v={{ FF_VERSION }}" nonce="{{ JS_NONCE }}"></script>
|
||||
<script type="text/javascript" src="v1/js/ff/budgets/show.js?v={{ FF_VERSION }}" nonce="{{ JS_NONCE }}"></script>
|
||||
{# required for groups.twig #}
|
||||
<script type="text/javascript" src="v1/js/ff/list/groups.js?v={{ FF_VERSION }}" nonce="{{ JS_NONCE }}"></script>
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user