<form class="form-horizontal">

	<div class="form-group">
		<label class="col-sm-1 control-label"><span style="color:red;">*</span>药品名称</label>
		<div class="col-sm-3">
			<ui-select allow-clear ng-model="vm.productSelected" theme="bootstrap">
				<ui-select-match>{{ $select.selected.Name }}</ui-select-match>
				<ui-select-choices repeat="item in vm.productList|filter:$select.search">
					<span ng-bind-html="item.Name | highlight: $select.search"></span>
				</ui-select-choices>
			</ui-select>
		</div>
		<label class="col-sm-1 control-label"><span style="color:red;">*</span>省名称</label>
		<div class="col-sm-3">
			<ui-select allow-clear ng-model="vm.provinceSelected" theme="bootstrap">
				<ui-select-match>{{ $select.selected.NAME }}</ui-select-match>
				<ui-select-choices repeat="item in vm.provinceList | filter:$select.search">
					<span ng-bind-html="item.NAME | highlight: $select.search"></span>
				</ui-select-choices>
			</ui-select>
		</div>
		<div class="col-sm-1">
			<button class="btn btn-primary" ng-click="vm.showReport()">查询</button>
		</div>
	</div>
	<div class="form-group">
		<label class="col-sm-1 control-label"><span style="color:red;">*</span>年份</label>
		<div class="col-sm-3">
			<ui-select allow-clear ng-model="vm.yearsSelected" theme="bootstrap">
				<ui-select-match>{{$select.selected }}</ui-select-match>
				<ui-select-choices repeat="item in vm.years | filter: $select.search">
					<span ng-bind-html="item | highlight: $select.search"></span>
				</ui-select-choices>
			</ui-select>
		</div>
		<label class="col-sm-1 control-label"><span style="color:red;">*</span>年度阶段</label>
		<div class="col-sm-3">
			<ui-select allow-clear ng-model="vm.periodSelected" theme="bootstrap">
				<ui-select-match>{{ $select.selected.Name  }}</ui-select-match>
				<ui-select-choices repeat="item in vm.period|filter:$select.search">
					<span ng-bind-html="item.Name | highlight: $select.search"></span>
				</ui-select-choices>
			</ui-select>
		</div>
	</div>

</form>

<div class="row" style="border-top: 1px dotted #d5c4c4; padding-top: 20px">
	<div class="col-sm-8">
		<div id="report" style="height:800px;" />
	</div>
	<div class="col-sm-4">
		<table class="table table-hover">
			<thead>
				<tr>
					<th>#</th>
					<th>流通时间</th>
					<th>销量比例</th>
				</tr>
			</thead>
			<tbody>
				<tr ng-repeat="row in vm.reportData">
					<td>
						{{$index+1}}
					</td>
					<td>
						{{row.circ_days_name}}天
					</td>
					<td>
						{{row.terminal_per|number:2}}%
					</td>

				</tr>
			</tbody>
		</table>
	</div>
</div>