<ol class="breadcrumb">
	<li><a href="#/">Dashboard</a></li>
	<li><a href="#/customers">Customers</a></li>
	<li class="active">Reports</li>
</ol>

<div class="container-fluid">
	<div class="row">
		<div class="col-md-12">
			<div class="panel panel-midnightblue">
				<div class="panel-heading">
					<h2>Reports</h2>
					<div class="panel-ctrls">
						<a class="button-icon" ng-click="vm._downloadCSV()" title="Download CSV"><i class="ti ti-save"></i></a>
					</div>
				</div>
				<div class="panel-body">
					<div class="row" style="margin-bottom: 25px;">
						<div class="col-sm-12">
							<form name="form" class="form-inline" ng-submit="vm._filterReport()">
								<div class="form-group">
									<div class="input-group">
										<span class="input-group-addon">
											<i class="ti ti-calendar"></i>
										</span>
										<input type="number" class="form-control" name="year" id="year" ng-model="vm.year" ng-required="true" placeholder="Year">
									</div>
								</div>
								<div class="form-group">
									<button type="submit" ng-disabled="!form.$valid" class="btn btn-primary">Filter</button>
								</div>
							</form>
						</div>
					</div>
					<div class="row" style="margin-bottom: 25px;">
						<div class="col-sm-12">
							<flot dataset="vm._sourceChartBar.dataset" options="vm._sourceChartBar.options" height="250px"></flot>
						</div>
					</div>
					<div class="row">
						<div class="col-sm-12">
							<div class="table-responsive">
								<table class="table">
									<thead>
										<tr>
											<th>Status</th>
											<th>JAN</th>
											<th>FEB</th>
											<th>MAR</th>
											<th>APR</th>
											<th>MAY</th>
											<th>JUN</th>
											<th>JUL</th>
											<th>AGO</th>
											<th>SEP</th>
											<th>OCT</th>
											<th>NOV</th>
											<th>DEC</th>
										</tr>
										<tbody>
											<tr ng-repeat="report in vm._sourceChartBar.dataset">
												<td>{{report.label}}</td>
												<td ng-repeat="data in report.data">{{data[1]}}</td>
											</tr>
										</tbody>
									</thead>
								</table>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
