mirror of
https://github.com/gwenhael-le-moine/credger.git
synced 2024-12-26 09:58:36 +01:00
simplify
This commit is contained in:
parent
1f06a12fe4
commit
107ed1c093
2 changed files with 83 additions and 90 deletions
|
@ -38,26 +38,27 @@ app.component('bucket',
|
||||||
.then(function success(response) {
|
.then(function success(response) {
|
||||||
let format_transaction = (transaction) => {
|
let format_transaction = (transaction) => {
|
||||||
return `
|
return `
|
||||||
<tr>
|
<tr>
|
||||||
<td>${transaction.date}</td>
|
<td>${transaction.date}</td>
|
||||||
<td>${transaction.payee}</td>
|
<td>${transaction.payee}</td>
|
||||||
<td style="text-align: right;">${transaction.amount} ${transaction.currency}</td>
|
<td style="text-align: right;">${transaction.amount} ${transaction.currency}</td>
|
||||||
</tr>`;
|
</tr>`;
|
||||||
};
|
};
|
||||||
|
|
||||||
swal({
|
swal({
|
||||||
title: response.data.key,
|
title: response.data.key,
|
||||||
html: `<table style="width: 100%;">
|
html: `
|
||||||
<thead>
|
<table style="width: 100%;">
|
||||||
<tr>
|
<thead>
|
||||||
<td>Date</td><td>Payee</td><td>Amount</td>
|
<tr>
|
||||||
</tr>
|
<td>Date</td><td>Payee</td><td>Amount</td>
|
||||||
</thead>
|
</tr>
|
||||||
<tbody>
|
</thead>
|
||||||
${response.data.values.map(function(transaction) { return format_transaction(transaction); }).join("")}
|
<tbody>
|
||||||
</tbody>
|
${response.data.values.map(function(transaction) { return format_transaction(transaction); }).join("")}
|
||||||
<tfoot><td></td><td>Total</td><td style="text-align: right;">${event.data.amount} €</td></tfoot>
|
</tbody>
|
||||||
</table>`});
|
<tfoot><td></td><td>Total</td><td style="text-align: right;">${event.data.amount} €</td></tfoot>
|
||||||
|
</table>`});
|
||||||
}, function error(response) { alert("error!"); });
|
}, function error(response) { alert("error!"); });
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -88,14 +89,14 @@ ${response.data.values.map(function(transaction) { return format_transaction(tra
|
||||||
],
|
],
|
||||||
|
|
||||||
template: `
|
template: `
|
||||||
<div class="bucket">
|
<div class="bucket">
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<div class="graph">
|
<div class="graph">
|
||||||
<nvd3 data="$ctrl.data"
|
<nvd3 data="$ctrl.data"
|
||||||
options="$ctrl.graph_options">
|
options="$ctrl.graph_options">
|
||||||
</nvd3>
|
</nvd3>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
`
|
`
|
||||||
});
|
});
|
||||||
|
|
|
@ -10,9 +10,8 @@ app.component('dashboard',
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
ctrl.periods = [];
|
ctrl.periods = [];
|
||||||
|
|
||||||
let largest_cat = _(response.data).reduce((memo, cat) => { return cat.length > memo.length ? cat : memo; }, []);
|
_.chain(response.data)
|
||||||
|
.reduce((memo, cat) => { return cat.length > memo.length ? cat : memo; }, [])
|
||||||
_.chain(largest_cat)
|
|
||||||
.pluck('date')
|
.pluck('date')
|
||||||
.each((date) => {
|
.each((date) => {
|
||||||
_(response.data).each((cat) => {
|
_(response.data).each((cat) => {
|
||||||
|
@ -33,8 +32,7 @@ app.component('dashboard',
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
ctrl.graphiques = {
|
ctrl.graphique = {
|
||||||
monthly_values: {
|
|
||||||
options: {
|
options: {
|
||||||
chart: {
|
chart: {
|
||||||
type: 'multiBarChart',
|
type: 'multiBarChart',
|
||||||
|
@ -62,13 +60,8 @@ app.component('dashboard',
|
||||||
useInteractiveGuideline: true,
|
useInteractiveGuideline: true,
|
||||||
multibar: {
|
multibar: {
|
||||||
dispatch: {
|
dispatch: {
|
||||||
elementClick: (event) => {
|
elementClick: function(event) {
|
||||||
console.log('change period')
|
ctrl.period = event.data.x; // FIXME: doesn't trigger data-binding
|
||||||
console.log(ctrl.period)
|
|
||||||
|
|
||||||
ctrl.period = event.data.x;
|
|
||||||
|
|
||||||
console.log(ctrl.period)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -97,7 +90,6 @@ app.component('dashboard',
|
||||||
};
|
};
|
||||||
})
|
})
|
||||||
.value()
|
.value()
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
ctrl.periods = _.chain(ctrl.periods).uniq().sort().reverse().value();
|
ctrl.periods = _.chain(ctrl.periods).uniq().sort().reverse().value();
|
||||||
|
@ -124,9 +116,9 @@ app.component('dashboard',
|
||||||
</select>
|
</select>
|
||||||
</div>
|
</div>
|
||||||
<div class="graph" style="width: 80%; float: left;">
|
<div class="graph" style="width: 80%; float: left;">
|
||||||
<nvd3 data="$ctrl.graphiques.monthly_values.data"
|
<nvd3 data="$ctrl.graphique.data"
|
||||||
options="$ctrl.graphiques.monthly_values.options">
|
options="$ctrl.graphique.options">
|
||||||
</nvd3>
|
</nvd3>{{$ctrl.period}}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -134,7 +126,7 @@ app.component('dashboard',
|
||||||
<select ng:options="p as p | amDateFormat:'MMMM YYYY' for p in $ctrl.periods" ng:model="$ctrl.period"></select>
|
<select ng:options="p as p | amDateFormat:'MMMM YYYY' for p in $ctrl.periods" ng:model="$ctrl.period"></select>
|
||||||
</h1>
|
</h1>
|
||||||
|
|
||||||
<bucket categories="'Expenses Income Equity Liabilities'" period="$ctrl.period"></bucket>
|
<bucket categories="'Expenses Income Equity Liabilities'" period="$ctrl.period"></bucket>
|
||||||
</div>
|
</div>
|
||||||
`
|
`
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in a new issue