<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.sYm" rt-type="month" rt-title="开始年月" rt-required="true" rt-col="3" rt-label-col="2"></rt-datetime>
        <rt-datetime ng-model="vm.eYm" rt-type="month" 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.pageIndex = 1;vm.search()">查询</button>
        </div>
        <div class="col-sm-1">
            <button class="btn btn-primary" ng-if="tabindex=='tab1'" ng-click='vm.actions.export({},"RedPackByBusinessExport","按部门月度汇总报表")'>
                        导出
            </button>
            <button class="btn btn-primary" ng-if="tabindex=='tab2'" ng-click='vm.actions.export({},"RedPackByOwnerExport","按代表月度汇总报表")'>
                        导出
            </button>
            <button class="btn btn-primary" ng-if="tabindex=='tab3'" ng-click='vm.actions.export({},"RedPackByDetailExport","红包发放明细报表")'>
                        导出
            </button>
        </div>
    </div>
</form>
<ul class="nav nav-tabs">
    <li class="active" ng-click="selectTab('tab1')">
        <a href="#c1" onclick="return false;" data-toggle="tab">按部门月度汇总</a>
    </li>
    <li ng-click="selectTab('tab2')">
        <a href="#c2" onclick="return false;" data-toggle="tab">按代表月度汇总</a>
    </li>
    <li ng-click="selectTab('tab3')">
        <a href="#c3" onclick="return false;" data-toggle="tab">红包发放明细</a>
    </li>
</ul>

<div class="tab-content">
    <div class="tab-pane active" id="c1">
         <rt-data-grid rt-page-record-count="vm.totalRecord1" rt-page-index="vm.pageIndex" rt-page-size="vm.pageSize" rt-get-data="vm.search()"
                      rt-rows="vm.data1" rt-auto-height=" {{tableMaxHeight}}">
            <table class="table table-condensed table-hover ng-scope" border="1" style="white-space: nowrap;" id="rt-report-header">
                <thead>
                    <tr>
                        <th>部门</th>
                        <th>月度</th>
                        <th>红包领取金额(元)</th>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="row in vm.data1">
                        <td>{{ row.BusinessUnitIdName }}</td>
                        <td>{{ row.send_year_month}}</td>
                        <td>{{ row.total_amount | toFixNumber:2  }}</td>
                    </tr>
                </tbody>
            </table>
        </rt-data-grid>
    </div>
    <div class="tab-pane" id="c2">
        <rt-data-grid rt-page-record-count="vm.totalRecord2" rt-page-index="vm.pageIndex" rt-page-size="vm.pageSize" rt-get-data="vm.search()"
                      rt-rows="vm.data2" rt-auto-height=" {{tableMaxHeight}}">
            <table class="table table-condensed table-hover ng-scope" border="1" style="white-space: nowrap;" id="rt-report-header">
                <thead>
                <tr>
                    <th>部门</th>
                    <th>代表</th>
                    <th>月度</th>
                    <th>红包领取金额(元)</th>
                </tr>
                </thead>
                <tbody>
                <tr ng-repeat="row in vm.data2">
                    <td class="rt-text-align" >{{ row.BusinessUnitIdName }}</td>
                    <td class="rt-text-align" >{{ row.OwnerIdName }}</td>
                    <td class="rt-text-align" >{{ row.send_year_month}}</td>
                    <td class="rt-number-align" >{{ row.total_amount | toFixNumber:2 }}</td>
                </tr>
                </tbody>
            </table>
        </rt-data-grid>
    </div>
    <div class="tab-pane" id="c3">
        <rt-data-grid rt-page-record-count="vm.totalRecord3" rt-page-index="vm.pageIndex" rt-page-size="vm.pageSize" rt-get-data="vm.search()"
                      rt-rows="vm.data3" rt-auto-height=" {{tableMaxHeight}}">
            <table class="table table-condensed table-hover ng-scope" border="1" style="white-space: nowrap;" id="rt-report-header">
                <thead>
                <tr>
                    <th>部门</th>
                    <th>代表</th>
                    <th>发送时间</th>
                    <th>微信名</th>
                    <th>红包发送金额(元)</th>
                    <th>红包状态</th>
                </tr>
                </thead>
                <tbody>
                <tr ng-repeat="row in vm.data3">
                    <td class="rt-text-align">{{ row.BusinessUnitIdName }}</td>
                    <td class="rt-text-align">{{ row.OwnerIdName }}</td>
                    <td class="rt-text-align">{{ row.send_time }}</td>
                    <td class="rt-text-align">{{ row.weixin_nickname }}</td>
                    <td class="rt-number-align">{{ row.total_amount | toFixNumber:2 }}</td>
                    <td class="rt-text-align">{{ row.weinxin_redpack_statusName }}</td>            
                </tr>
                </tbody>
            </table>
        </rt-data-grid>
    </div>
</div>