mirror of
https://github.com/firefly-iii/firefly-iii.git
synced 2025-02-25 18:45:27 -06:00
Reversed from flot/plot back to high charts. Cleaned up the index.
This commit is contained in:
James Cole
parent
3068a8d58d
commit
5788db9f07
@ -6,9 +6,218 @@ $(function () {
|
||||
*/
|
||||
$.getJSON('chart/home/account').success(function (data) {
|
||||
var options = {
|
||||
chart: {
|
||||
renderTo: 'accounts-chart',
|
||||
type: 'line'
|
||||
},
|
||||
|
||||
series: data.series,
|
||||
title: {
|
||||
text: null
|
||||
},
|
||||
yAxis: {
|
||||
allowDecimals: false,
|
||||
alternateGridColor: true,
|
||||
labels: {
|
||||
formatter: function () {
|
||||
return '€ ' + this.value;
|
||||
}
|
||||
},
|
||||
title: {text: null}
|
||||
},
|
||||
xAxis: {
|
||||
floor: 0,
|
||||
type: 'datetime',
|
||||
dateTimeLabelFormats: {
|
||||
day: '%e %b',
|
||||
year: '%b'
|
||||
},
|
||||
title: {
|
||||
text: null
|
||||
}
|
||||
},
|
||||
legend: {enabled:false},
|
||||
tooltip: {
|
||||
|
||||
shared: false,
|
||||
crosshairs: false,
|
||||
formatter: function () {
|
||||
return this.series.name + ': \u20AC ' + Highcharts.numberFormat(this.y,2);
|
||||
}
|
||||
},
|
||||
plotOptions: {
|
||||
line: {
|
||||
shadow: true
|
||||
},
|
||||
series: {
|
||||
cursor: 'pointer',
|
||||
negativeColor: '#FF0000',
|
||||
threshold: 0,
|
||||
lineWidth: 1,
|
||||
marker: {
|
||||
radius: 2
|
||||
},
|
||||
point: {
|
||||
events: {
|
||||
click: function (e) {
|
||||
hs.htmlExpand(null, {
|
||||
src: 'chart/home/info/' + this.series.name + '/' + Highcharts.dateFormat("%d/%m/%Y", this.x),
|
||||
pageOrigin: {
|
||||
x: e.pageX,
|
||||
y: e.pageY
|
||||
},
|
||||
objectType: 'ajax',
|
||||
headingText: '<a href="accounts/show/' + this.series.id + '">' + this.series.name + '</a>',
|
||||
width: 250
|
||||
}
|
||||
)
|
||||
;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
}
|
||||
};
|
||||
$.plot("#flot-chart-accounts", data, options);
|
||||
$('#accounts-chart').highcharts(options);
|
||||
});
|
||||
|
||||
/**
|
||||
* Get chart data for categories chart:
|
||||
*/
|
||||
$.getJSON('chart/home/categories').success(function (data) {
|
||||
$('#categories').highcharts({
|
||||
chart: {
|
||||
type: 'column'
|
||||
},
|
||||
title: {
|
||||
text: null
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
labels: {
|
||||
rotation: -45,
|
||||
style: {
|
||||
fontSize: '12px',
|
||||
fontFamily: 'Verdana, sans-serif'
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Expense (€)'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
enabled: false
|
||||
},
|
||||
tooltip: {
|
||||
pointFormat: 'Total expense: <strong>€ {point.y:.2f}</strong>',
|
||||
},
|
||||
plotOptions: {
|
||||
column: {
|
||||
cursor: 'pointer'
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: 'Population',
|
||||
data: data,
|
||||
|
||||
events: {
|
||||
click: function (e) {
|
||||
alert('klik!');
|
||||
}
|
||||
},
|
||||
dataLabels: {
|
||||
enabled: false
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
});
|
||||
|
||||
/**
|
||||
* Get chart data for budget charts.
|
||||
*/
|
||||
$.getJSON('chart/home/budgets').success(function (data) {
|
||||
$('#budgets').highcharts({
|
||||
chart: {
|
||||
type: 'bar'
|
||||
},
|
||||
title: {
|
||||
text: null
|
||||
},
|
||||
subtitle: {
|
||||
text: null
|
||||
},
|
||||
xAxis: {
|
||||
categories: data.labels,
|
||||
title: {
|
||||
text: null
|
||||
},
|
||||
labels: {
|
||||
style: {
|
||||
fontSize: '11px',
|
||||
fontFamily: 'Verdana, sans-serif'
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
min: 0,
|
||||
title: {
|
||||
text: 'Amount (€)',
|
||||
align: 'high'
|
||||
},
|
||||
labels: {
|
||||
overflow: 'justify'
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
formatter: function () {
|
||||
return false;
|
||||
return '€ ' + Highcharts.numberFormat(this.y, 2);
|
||||
}
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
cursor: 'pointer',
|
||||
events: {
|
||||
click: function (e) {
|
||||
alert('klik!!');
|
||||
}
|
||||
},
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
formatter: function () {
|
||||
return '€ ' + Highcharts.numberFormat(this.y, 2);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
enabled: false,
|
||||
layout: 'vertical',
|
||||
align: 'right',
|
||||
verticalAlign: 'top',
|
||||
x: -40,
|
||||
y: 100,
|
||||
floating: true,
|
||||
borderWidth: 1,
|
||||
backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor || '#FFFFFF'),
|
||||
shadow: true
|
||||
},
|
||||
credits: {
|
||||
enabled: false
|
||||
},
|
||||
series: data.series
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
|
||||
@ -10,5 +10,7 @@
|
||||
//
|
||||
// The available directives right now are require, require_directory, and require_tree
|
||||
//
|
||||
//= require flot/jquery.flot.min
|
||||
//= require highslide/highslide-full.min
|
||||
//= require highslide/highslide.config
|
||||
//= require_tree highcharts
|
||||
//= require firefly/index
|
||||
|
||||
@ -71,14 +71,6 @@ class HomeController extends BaseController
|
||||
}
|
||||
}
|
||||
|
||||
if (count($transactions) % 2 == 0) {
|
||||
$transactions = array_chunk($transactions, 2);
|
||||
} elseif (count($transactions) == 1) {
|
||||
$transactions = array_chunk($transactions, 3);
|
||||
} else {
|
||||
$transactions = array_chunk($transactions, 3);
|
||||
}
|
||||
|
||||
// build the home screen:
|
||||
return View::make('index')->with('count', $count)->with('transactions', $transactions)->with('title', 'Firefly')
|
||||
->with('subTitle', 'What\'s playing?');
|
||||
|
||||
@ -33,7 +33,7 @@
|
||||
<div class="col-lg-8 col-md-12 col-sm-12">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<i class="fa fa-credit-card fa-fw"></i> Your accounts
|
||||
<i class="fa fa-credit-card fa-fw"></i> <a href="#">Your accounts</a>
|
||||
<div class="pull-right">
|
||||
<div class="btn-group">
|
||||
<button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown">
|
||||
@ -55,56 +55,84 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div id="flot-chart-accounts" style="height:300px;"></div>
|
||||
<div id="accounts-chart" style="height:300px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<i class="fa fa-tasks fa-fw"></i> <a href="{{route('budgets.index')}}">Budgets and spending</a>
|
||||
<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="#">Action</a>
|
||||
</li>
|
||||
<li><a href="#">Another action</a>
|
||||
</li>
|
||||
<li><a href="#">Something else here</a>
|
||||
</li>
|
||||
<li class="divider"></li>
|
||||
<li><a href="#">Separated link</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div id="budgets"></div>
|
||||
</div>
|
||||
</div>
|
||||
<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 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="#">Action</a>
|
||||
</li>
|
||||
<li><a href="#">Another action</a>
|
||||
</li>
|
||||
<li><a href="#">Something else here</a>
|
||||
</li>
|
||||
<li class="divider"></li>
|
||||
<li><a href="#">Separated link</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div id="categories"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- TRANSACTIONS -->
|
||||
@if(count($transactions) > 0)
|
||||
@foreach($transactions as $set)
|
||||
<div class="row">
|
||||
<?php $split = 12 / count($set); ?>
|
||||
@foreach($set as $data)
|
||||
<div class="col-lg-{{$split}} col-md-{{$split}}">
|
||||
<h4>
|
||||
<a href="{{route('accounts.show',$data[1]->id)}}">{{{$data[1]->name}}}</a>
|
||||
</h4>
|
||||
|
||||
@include('transactions.journals-small',['transactions' => $data[0],'account' => $data[1]])
|
||||
<div class="btn-group btn-group-xs">
|
||||
<a class="btn btn-default"
|
||||
href="{{route('transactions.create','withdrawal')}}?account_id={{$data[1]->id}}"><span
|
||||
class="glyphicon glyphicon-arrow-left" title="Withdrawal"></span> Add withdrawal</a>
|
||||
<a class="btn btn-default"
|
||||
href="{{route('transactions.create','deposit')}}?account_id={{$data[1]->id}}"><span
|
||||
class="glyphicon glyphicon-arrow-right" title="Deposit"></span> Add deposit</a>
|
||||
<a class="btn btn-default"
|
||||
href="{{route('transactions.create','transfer')}}?account_from_id={{$data[1]->id}}"><span
|
||||
class="glyphicon glyphicon-resize-full" title="Transfer"></span> Add transfer</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
@endforeach
|
||||
@endif
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12">
|
||||
<div id="budgets"></div>
|
||||
|
||||
</div>
|
||||
<div class="col-lg-4 col-md-6 col-sm-12">
|
||||
<!-- TRANSACTIONS -->
|
||||
@foreach($transactions as $data)
|
||||
<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>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
@include('transactions.journals-small-index',['transactions' => $data[0],'account' => $data[1]])
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 col-sm-12">
|
||||
<div id="categories"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@endif
|
||||
|
||||
@stop
|
||||
|
||||
27
app/views/transactions/journals-small-index.blade.php
Normal file
27
app/views/transactions/journals-small-index.blade.php
Normal file
@ -0,0 +1,27 @@
|
||||
<div class="list-group">
|
||||
@foreach($transactions as $journal)
|
||||
<a class="list-group-item" href="{{route('transactions.show',$journal->id)}}">
|
||||
|
||||
@if($journal->transactiontype->type == 'Withdrawal')
|
||||
<i class="fa fa-long-arrow-left fa-fw" title="Withdrawal"></i>
|
||||
@endif
|
||||
@if($journal->transactiontype->type == 'Deposit')
|
||||
<i class="fa fa-long-arrow-right fa-fw" title="Deposit"></i>
|
||||
@endif
|
||||
@if($journal->transactiontype->type == 'Transfer')
|
||||
<i class="fa fa-arrows-h fa-fw" title="Transfer"></i>
|
||||
@endif
|
||||
|
||||
{{{$journal->description}}}
|
||||
|
||||
<span class="pull-right small">
|
||||
@foreach($journal->transactions as $t)
|
||||
@if($t->account_id == $account->id)
|
||||
{{mf($t->amount)}}
|
||||
@endif
|
||||
@endforeach
|
||||
</span>
|
||||
|
||||
</a>
|
||||
@endforeach
|
||||
</div>
|
||||
Loading…
Reference in New Issue
Block a user