<style>
    .form-group .control-label {
        font-weight: 500;
        color: #555;
    }
    
    #rt-report-header th {
        vertical-align: inherit;
        border: 1px solid #f0f0f0;
        color: #555;
        font-weight: 500;
    }
    
    #rt-report-header tr,
    td {
        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.startDate" rt-type="date" rt-title="开始年月" rt-required="true" rt-col="3" rt-label-col="2"></rt-datetime>
        <rt-datetime ng-model="vm.endDate" rt-type="date" 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.showReport()">查询</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.MdlSelected">
                <ui-select-match>{{$item.MdlDesc}}</ui-select-match>
                <ui-select-choices repeat="item in vm.TblMdlList | filter: {MdlDesc: $select.search}">
                    <span ng-bind-html="item.MdlDesc | highlight: $select.search"></span>
                </ui-select-choices>
            </ui-select>
        </div>
        <div class="col-sm-1">
            <button class="btn btn-primary" ng-click='vm.actions.export({
                        },"OperatingExport","系统使用统计分析")'>
                   导出
                </button>
        </div>
    </div>
    <div class="form-group">
        <label class="col-sm-2 control-label"><span style="color:red;"></span>来源</label>
        <div class="col-sm-3">
            <ui-select allow-clear ng-model="vm.clientSelected" theme="bootstrap">
                <ui-select-match>{{$select.selected.Name}}</ui-select-match>
                <ui-select-choices repeat="item in vm.clientList | filter:{Name:$select.search}">
                    <span ng-bind-html="item.Name| highlight: $select.search"></span>
                </ui-select-choices>
            </ui-select>
        </div>
    </div>
</form>

<div class="tab-content">
    <div style="border-top: 1px dotted #d5c4c4; padding-top: 20px;">
        <rt-data-grid rt-page-record-count="vm.TotalRecords" rt-page-index="vm.pageIndex" rt-page-size="vm.pageSize" rt-get-data="vm.showReport()" rt-rows="vm.data"
            rt-auto-height="{{tableMaxHeight}} ">
            <table class="table table-condensed table-hover ng-scope" style="white-space:nowrap;" id="rt-report-header">
                <thead>
                    <tr>
                        <th rowspan="2" align="left">模块</th>
                        <th rowspan="2" align="left">来源</th>
                        <td style="border-top:solid 1px #f0f0f0;" colspan="2" align="right" ng-repeat="item in vm.DayDataList">{{item}} </td>
                    </tr>
                    <tr>
                        <td align="left" ng-repeat="Mtext in vm.DayDataListName track by $index">{{Mtext}}</td>
                    </tr>
                </thead>
                <tbody>
                    <tr ng-repeat="row in vm.RepoteData  track by $index ">
                        <td align="left" ng-if="row.TblMdlIdName!='登录'">{{row.TblMdlIdName}}</td>
                        <td colspan="2" align="left" ng-if="row.TblMdlIdName=='登录'">{{row.TblMdlIdName}}</td>
                        <td ng-if="row.is_pc==1&&row.TblMdlIdName!='登录'">PC端</td>
                        <td ng-if="row.is_pc==0&&row.TblMdlIdName!='登录'">Mobile端</td>
                        <td ng-repeat="Items in row.monthList track by $index" align="right">{{Items}}</td>
                    </tr>
                </tbody>
            </table>
        </rt-data-grid>
    </div>
</div>