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

    #rt-report-header th {
        text-align: center;
        vertical-align: inherit;
        border: 1px solid #f0f0f0;
        color: #555;
        font-weight: 500;
    }

    #rt-report-header tr, td {
        text-align: center;
        vertical-align: inherit;
        border: 1px solid #f0f0f0;
        color: #555;
        font-weight: 500;
    }
</style>
<form class="form-horizontal">
    <div class="form-group">
        <rt-datetime ng-model="vm.startYM"
                     rt-type="datetime"
                     rt-title="开始时间" rt-required="true" rt-col="3" rt-label-col="2">
        </rt-datetime>
        <rt-datetime ng-model="vm.endYM"
                     rt-type="datetime"
                     rt-title="结束时间" rt-required="true" rt-col="3" rt-label-col="2">
        </rt-datetime>
        <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":"用户",
                        "name":"考试名称",
                        "exam_Score":"考试总分",
                        "MyScore":"考试得分",
                        "Qustion_Count":"总题目数",
                        "Right_Count":"正确数",
                        "Exam_time_required":"考试时长"
                        },"ExamOnlineReportExport","在线考试统计")'>导出
            </button>
        </div>
    </div>

    <div class="form-group">
        <label class="col-sm-2 control-label">考试名称</label>
        <div class="col-sm-8">
           <input type="text"
                       placeholder="请输入考试名称"
                       class="form-control"
                       ng-model="vm.searchText" />
            </ui-select>
        </div>
        <div class="col-sm-1">
                <button class="btn btn-clear btn-small" ng-click="vm.isShowMoreSearch=!vm.isShowMoreSearch;complateTableheight();">
                    <i ng-if="!vm.isShowMoreSearch" class="fa fa-angle-double-down" style="color:#0099ff;" title="更多查询条件"></i>
                    <i ng-if="vm.isShowMoreSearch" class="fa fa-angle-double-up" style="color:#0099ff;"  title="隐藏"></i>
                </button>
            </div>
    </div>
    <div class="form-group"  ng-hide="!vm.isShowMoreSearch">
        <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>
    <div class="form-group"  ng-hide="!vm.isShowMoreSearch">
        <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>
</form>
<div class="row" style="border-top: 1px dotted #d5c4c4; padding-top: 20px">

    <div class="col-sm-30">
        <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-hover" style="white-space:nowrap;" id="rt-report-header">
                <thead>
                <tr id="rt-report-header">
                    <th style="text-align: left">事业部</th>
                    <th style="text-align: left">大区</th>
                    <th style="text-align: left">省区/地区</th>
                    <th style="text-align: left">用户</th>
                    <th style="text-align: left">考试名称</th>
                    <th style="text-align: right">总分数</th>
                    <th style="text-align: right">得分</th>
                    <th style="text-align: right">总题目数</th>
                    <th style="text-align: right">正确数</th>
                    <th style="text-align: right">考试时长</th>
                </tr>
                </thead>
                <tbody>
                <tr ng-repeat="row in vm.reportData">
                    <!-- 判断数据为空时，将数据设置为“-” 使用：== null ? "-" : -->
                    <td style="text-align: left">
                        {{row.buidName == null ? "-" : row.buidName}}
                    </td>
                    <td style="text-align: left">
                        {{row.bigdeptidName == null ? "-" : row.bigdeptidName}}
                    </td>
                    <td style="text-align: left">
                        {{row.BusinessUnitIdName == null ? "-" : row.BusinessUnitIdName}}
                    </td>
                    <td style="text-align: left">
                        {{row.OwnerIdName == null ? "-" : row.OwnerIdName}}
                    </td>
                    <td style="text-align: left">
                        {{row.name == null ? "-" : row.name}}
                    </td>
                    <td style="text-align: right">
                        {{row.exam_Score == null ? "-" : row.exam_Score }}
                    </td>
                    <td style="text-align: right">
                        {{row.MyScore == null ? "-" : row.MyScore}}
                    </td>
                    <td style="text-align: right">
                        {{row.Qustion_Count == null ? "-" : row.Qustion_Count}}
                    </td>
                    <td style="text-align: right">
                        {{row.Right_Count == null ? "-" : row.Right_Count}}
                    </td>
                    <td style="text-align: right">
                        {{row.Exam_time_required == null ? "-" : row.Exam_time_required}}
                    </td>
                </tr>
                </tbody>
            </table>
        </rt-data-grid>
    </div>
</div>