mirror of
https://github.com/aclindsa/moneygo.git
synced 2024-10-30 15:50:04 -04:00
95 lines
2.6 KiB
JavaScript
95 lines
2.6 KiB
JavaScript
var React = require('react');
|
|
|
|
var ReactBootstrap = require('react-bootstrap');
|
|
|
|
var Button = ReactBootstrap.Button;
|
|
var Panel = ReactBootstrap.Panel;
|
|
|
|
var StackedBarChart = require('../components/StackedBarChart');
|
|
|
|
var models = require('../models')
|
|
var Report = models.Report;
|
|
|
|
class ReportsTab extends React.Component {
|
|
constructor() {
|
|
super();
|
|
this.onSelectSeries = this.handleSelectSeries.bind(this);
|
|
}
|
|
componentWillMount() {
|
|
this.props.onFetchReport("monthly_expenses");
|
|
}
|
|
componentWillReceiveProps(nextProps) {
|
|
if (nextProps.reports['monthly_expenses'] && !nextProps.selectedReport.report) {
|
|
this.props.onSelectReport(nextProps.reports['monthly_expenses'], []);
|
|
}
|
|
}
|
|
handleSelectSeries(series) {
|
|
if (series == Report.topLevelAccountName())
|
|
return;
|
|
var seriesTraversal = this.props.selectedReport.seriesTraversal.slice();
|
|
seriesTraversal.push(series);
|
|
this.props.onSelectReport(this.props.reports[this.props.selectedReport.report.ReportId], seriesTraversal);
|
|
}
|
|
render() {
|
|
var report = [];
|
|
if (this.props.selectedReport.report) {
|
|
var titleTracks = [];
|
|
var seriesTraversal = [];
|
|
|
|
for (var i = 0; i < this.props.selectedReport.seriesTraversal.length; i++) {
|
|
var name = this.props.selectedReport.report.Title;
|
|
if (i > 0)
|
|
name = this.props.selectedReport.seriesTraversal[i-1];
|
|
|
|
// Make a closure for going up the food chain
|
|
var self = this;
|
|
var navOnClick = function() {
|
|
var onSelectReport = self.props.onSelectReport;
|
|
var report = self.props.reports[self.props.selectedReport.report.ReportId];
|
|
var mySeriesTraversal = seriesTraversal.slice();
|
|
return function() {
|
|
onSelectReport(report, mySeriesTraversal);
|
|
};
|
|
}();
|
|
titleTracks.push((
|
|
<Button key={i*2} bsStyle="link"
|
|
onClick={navOnClick}>
|
|
{name}
|
|
</Button>
|
|
));
|
|
titleTracks.push((<span key={i*2+1}>/</span>));
|
|
seriesTraversal.push(this.props.selectedReport.seriesTraversal[i]);
|
|
}
|
|
if (titleTracks.length == 0) {
|
|
titleTracks.push((
|
|
<Button key={0} bsStyle="link">
|
|
{this.props.selectedReport.report.Title}
|
|
</Button>
|
|
));
|
|
} else {
|
|
var i = this.props.selectedReport.seriesTraversal.length-1;
|
|
titleTracks.push((
|
|
<Button key={i*2+2} bsStyle="link">
|
|
{this.props.selectedReport.seriesTraversal[i]}
|
|
</Button>
|
|
));
|
|
}
|
|
|
|
report = (<Panel header={titleTracks}>
|
|
<StackedBarChart
|
|
report={this.props.selectedReport.report}
|
|
onSelectSeries={this.onSelectSeries}
|
|
seriesTraversal={this.props.selectedReport.seriesTraversal} />
|
|
</Panel>
|
|
);
|
|
}
|
|
return (
|
|
<div>
|
|
{report}
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
module.exports = ReportsTab;
|