mirror of
https://github.com/firefly-iii/firefly-iii.git
synced 2025-10-31 02:36:28 +00:00
214 lines
10 KiB
Twig
214 lines
10 KiB
Twig
{% extends "./layout/default.twig" %}
|
|
{% block content %}
|
|
{{ Breadcrumbs.renderIfExists }}
|
|
|
|
{% if count == 0 %}
|
|
<div class="row">
|
|
<div class="col-lg-12 col-md-12 col-sm-12">
|
|
<p class="lead">{{ 'welcome'|_ }}</p>
|
|
|
|
<p>
|
|
{{ 'createNewAsset'|_ }}
|
|
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-lg-6 col-md-6 col-sm-12">
|
|
<h2><a href="{{route('accounts.create','asset')}}">{{ 'createNewAssetButton'|_ }}</a></h2>
|
|
</div>
|
|
{% else %}
|
|
<!-- Language test: {{ 'test'|_ }} -->
|
|
<!-- fancy new boxes -->
|
|
{% include 'partials/boxes.twig' %}
|
|
|
|
<div class="row">
|
|
<div class="col-lg-8 col-md-12 col-sm-12">
|
|
<!-- ACCOUNTS -->
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<i class="fa fa-credit-card fa-fw"></i> <a href="#">{{ 'yourAccounts'|_ }}</a>
|
|
</div>
|
|
<div class="panel-body">
|
|
<div id="accounts-chart"></div>
|
|
</div>
|
|
</div>
|
|
<!-- BUDGETS -->
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<i class="fa fa-tasks fa-fw"></i> <a href="{{route('budgets.index')}}">{{ 'budgetsAndSpending'|_ }}</a>
|
|
</div>
|
|
<div class="panel-body">
|
|
<div id="budgets-chart"></div>
|
|
</div>
|
|
</div>
|
|
<!-- CATEGORIES -->
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<i class="fa fa-bar-chart fa-fw"></i> <a href="{{route('categories.index')}}">{{ 'categories'|_ }}</a>
|
|
</div>
|
|
<div class="panel-body">
|
|
<div id="categories-chart"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- SAVINGS -->
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<i class="fa fa-line-chart"></i> {{ 'savings'|_ }}
|
|
<span class="pull-right">{{ savingsTotal|formatAmount }}</span>
|
|
</div>
|
|
<div class="panel-body">
|
|
{% if savings|length == 0 %}
|
|
<p class="small"><em>{{ 'markAsSavingsToContinue'|_ }}</em></p>
|
|
{% else %}
|
|
{% for account in savings %}
|
|
<div class="row">
|
|
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12"><h5><a href="{{ route('accounts.show') }}">{{ account.name }}</a></h5></div>
|
|
</div>
|
|
<div class="row">
|
|
<!-- start -->
|
|
<div class="col-lg-2 col-md-2 col-sm-3 col-xs-4">{{ account.startBalance|formatAmount }}</div>
|
|
<!-- bar -->
|
|
<div class="col-lg-8 col-md-8 col-sm-6 col-xs-4">
|
|
{% if account.difference < 0 %}
|
|
<!-- green (100-pct), then red (pct) -->
|
|
<div class="progress">
|
|
<div class="progress-bar progress-bar-success progress-bar-striped" style="width: {{ 100 - account.percentage }}%">
|
|
{% if account.percentage <= 50 %}
|
|
{{account.difference|formatAmountPlain}}
|
|
{% endif %}
|
|
</div>
|
|
<div class="progress-bar progress-bar-danger progress-bar-striped" style="width: {{ account.percentage }}%">
|
|
{% if account.percentage > 50 %}
|
|
{{account.difference|formatAmountPlain}}
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% else %}
|
|
<!-- green (pct), then blue (100-pct) -->
|
|
<div class="progress">
|
|
<div class="progress-bar progress-bar-success progress-bar-striped" style="width: {{account.percentage}}%">
|
|
{% if account.percentage <= 50 %}
|
|
{{account.difference|formatAmountPlain}}
|
|
{{account.difference|formatAmountPlain}}
|
|
{% endif %}
|
|
</div>
|
|
<div class="progress-bar progress-bar-info progress-bar-striped" style="width: {{100 - account.percentage}}%">
|
|
{% if account.percentage > 50 %}
|
|
{{account.difference|formatAmountPlain}}
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
</div>
|
|
<!-- end -->
|
|
<div class="col-lg-2 col-md-2 col-sm-3 col-xs-4">{{ account.endBalance|formatAmount }}</div>
|
|
</div>
|
|
{% endfor %}
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<!-- PIGGY BANKS -->
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<i class="fa fa-sort-amount-asc fa-fw"></i> {{ 'piggyBanks'|_ }}
|
|
</div>
|
|
<div class="panel-body">
|
|
{% if piggyBankAccounts|length == 0%}
|
|
<p class="small"><em>{{ 'createPiggyToContinue'|_ }}</em></p>
|
|
{% else %}
|
|
{% for account in piggyBankAccounts %}
|
|
<div class="row">
|
|
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12"><h5><a href="{{route('accounts.show')}}">{{account.name}}</a></h5></div>
|
|
</div>
|
|
<div class="row">
|
|
<!-- start -->
|
|
<div class="col-lg-2 col-md-2 col-sm-3 col-xs-4">{{ account.startBalance|formatAmount }}</div>
|
|
<!-- bar -->
|
|
<div class="col-lg-8 col-md-8 col-sm-6 col-xs-4">
|
|
|
|
<div class="progress">
|
|
<div class="progress-bar progress-bar-info progress-bar-striped" style="width: {{100 - account.percentage}}%">
|
|
{% if account.percentage <= 50 %}
|
|
{{account.piggyBalance|formatAmountPlain}} {{ 'divided'|_}}
|
|
{% endif %}
|
|
</div>
|
|
<div class="progress-bar progress-bar-success progress-bar-striped" style="width: {{account.percentage}}%">
|
|
{% if account.percentage > 50 %}
|
|
{{account.difference|formatAmountPlain}} {{ 'toDivide'|_}}
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- end -->
|
|
<div class="col-lg-2 col-md-2 col-sm-3 col-xs-4">{{ account.piggyBalance|formatAmount }}</div>
|
|
</div>
|
|
{% endfor %}
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
<div class="col-lg-4 col-md-6 col-sm-12">
|
|
|
|
<!-- REMINDERS -->
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<i class="fa fa-calendar-o"></i> <a href="{{route('bills.index')}}">{{ 'bills'|_ }}</a>
|
|
</div>
|
|
<div class="panel-body">
|
|
<div id="bills-chart"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- TRANSACTIONS -->
|
|
{% for data in transactions %}
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<i class="fa fa-money fa-fw"></i>
|
|
<a href="{{route('accounts.show',data[1].id)}}">{{data[1].name}}</a> ({{ (data[1]|balance)|formatAmount }})
|
|
|
|
|
|
<!-- ACTIONS MENU -->
|
|
<div class="pull-right">
|
|
<div class="btn-group">
|
|
<button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown">
|
|
{{ 'actions'|_ }}
|
|
<span class="caret"></span>
|
|
</button>
|
|
<ul class="dropdown-menu pull-right" role="menu">
|
|
<li><a href="{{route('transactions.create','withdrawal')}}?account_id={{data[1].id}}"><i class="fa fa-long-arrow-left fa-fw"></i> {{ 'newWithdrawal'|_ }}</a></li>
|
|
<li><a href="{{route('transactions.create','deposit')}}?account_id={{data[1].id}}"><i class="fa fa-long-arrow-right fa-fw"></i> {{ 'newDeposit'|_ }}</a></li>
|
|
<li><a href="{{route('transactions.create','transfer')}}?account_from_id={{data[1].id}}"><i class="fa fa-fw fa-exchange"></i> {{ 'newTransfer'|_ }}</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
<div class="panel-body">
|
|
|
|
{% include 'list/journals-tiny.twig' with {'transactions': data[0],'account': data[1]} %}
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
|
|
{% endif %}
|
|
|
|
|
|
{% endblock %}
|
|
{% block scripts %}
|
|
<!-- load the libraries and scripts necessary for Google Charts: -->
|
|
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
|
|
<script type="text/javascript" src="js/gcharts.options.js"></script>
|
|
<script type="text/javascript" src="js/gcharts.js"></script>
|
|
<script type="text/javascript" src="js/index.js"></script>
|
|
{% endblock %}
|