<style>
    .form-group .control-label {
        font-weight: 500;
        color: #555;
    }

    #rt-report-header > thead > tr >th{
        text-align: center;
        vertical-align: inherit;
        border: 1px solid #f0f0f0;
        color:#555;
        font-weight: 500;
        white-space: nowrap;
    }
    
    #rt-report-header > tbody > tr >td{
        text-align: center;
        vertical-align: inherit;
        border: 1px solid #f0f0f0;
        color:#555;
        font-weight: 500;
        white-space: nowrap;
    }

    .rt-align-left {
        text-align: left !important;
    }

    .rt-align-right {
        text-align: right !important;
    }

    #misstarget .col-sm-2 input {
		width: 30%;
		border: 1px solid #ccc;
		height: 34px;
	}
</style>
<div class="row">
<form class="form-horizontal">
    <div class="form-group">
        <rt-datetime ng-model="vm.yM" rt-type="month" rt-title="时间段筛选" rt-required="true" rt-col="3" rt-label-col="2">
        </rt-datetime>
    </div>
    <div class="form-group">
        <label class="col-sm-2 control-label">事业部</label>
        <div class="col-sm-3">
            <ui-select allow-clear ng-model="vm.buidSelected" theme="bootstrap">
                <ui-select-match>{{ $select.selected.name }}</ui-select-match>
                <ui-select-choices repeat="item in vm.buidList|filter:$select.search">
                    <span ng-bind-html="item.name | highlight: $select.search"></span>
                </ui-select-choices>
            </ui-select>
        </div>
        <label class="col-sm-2 control-label">业务线/大区</label>
        <div class="col-sm-3">
            <ui-select allow-clear ng-model="vm.bigDepSelected" theme="bootstrap">
                <ui-select-match>{{ $select.selected.name }}</ui-select-match>
                <ui-select-choices repeat="item in vm.bigDepList |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.showReportButton()">查询</button>
        </div>
        <div class="col-sm-1">
            <button class="btn btn-primary" ng-click='vm.actions.export({
                        "BuIdName":"事业部",
                        "BigDeptIdName":"业务线/大区",
                        "BusinessUnitIdName":"地区",
                        "OwnerIdName":"代表",
                        "Account_LevelName":"客户分级",
                        "accountQty":"客户数",
                        "visitQty":"拜访次数",
                        "frequency":"拜访频率",
                        "achievingate":"达成率",
                        },"VisitownercountExport","代表拜访频率分析")'>导出
            </button>
        </div>
    </div>
    <div class="form-group">
        <label class="col-sm-2 control-label">省区/地区</label>
        <div class="col-sm-8">
            <ui-select class="form" multiple allow-clear sortable="true" theme="bootstrap" close-on-select="false" ng-model="vm.businessUnitSelected">
                <ui-select-match>{{$item.name}}</ui-select-match>
                <ui-select-choices repeat="item in vm.businessUnitList | filter: {name: $select.search}">
                    <span ng-bind-html="item.name | highlight: $select.search"></span>
                </ui-select-choices>
            </ui-select>
        </div>
    </div>
    <div class="form-group" id="misstarget">
        <label class="col-sm-2 control-label">指标</label>
        <div class="col-sm-2" ng-repeat="tar in vm.account_grade_levelPickList">
			<span>{{tar.Name}}:</span>
			<input type="text" placeholder="4" ng-model="tar.content" />
			<span>次/月</span>
		</div>
    </div>
</form>
</div>
<div class="row">
        <rt-data-grid rt-page-record-count="vm.recordCount" rt-get-data="vm.showReport()" rt-page-index="vm.index" rt-page-size="vm.pageSize" rt-rows="vm.reportData">
            <table class="table table-condensed table-hover ng-scope" style="white-space: nowrap;" id="rt-report-header">
                <thead>
                    <tr>
                        <th class="rt-text-align">事业部</th>
                        <th class="rt-text-align">大区</th>
                        <th class="rt-text-align">地区</th>
                        <th class="rt-text-align">代表</th>
                        <th class="rt-text-align">客户分级</th>
                        <th class="rt-number-align">客户数</th>
                        <th class="rt-number-align">拜访次数</th>
                        <th class="rt-number-align">拜访频率</th>
                        <th class="rt-number-align">达成率</th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="row in vm.reportData">
                        <td class="rt-text-align">
                            {{row.BuIdName == null ? "-" : row.BuIdName}}
                        </td>
                        <td class="rt-text-align">
                            {{row.BigDeptIdName == null ? "-" : row.BigDeptIdName}}
                        </td>
                        <td class="rt-text-align">
                            {{row.BusinessUnitIdName == null ? "-" : row.BusinessUnitIdName}}
                        </td>
                        <td class="rt-text-align">
                            {{row.OwnerIdName == null ? "-" : row.OwnerIdName}}
                        </td>
                        <td class="rt-text-align">
                            {{row.Account_LevelName== null ? "-" : row.Account_LevelName}}
                        </td>
                        <td class="rt-number-align">{{row.accountQty}}</td>
                        <td class="rt-number-align">{{row.visitQty}}</td>
                        <td class="rt-number-align">{{row.accountQty == 0 ? 0 : row.visitQty*1.0/row.accountQty | number : 1}}</td>
                        <td class="rt-number-align">{{row.donePercent | number : 1}}%</td>
                    </tr>
                </tbody>
            </table>
        </rt-data-grid>
</div>
