jhpbonsjpb.html 3.62 KB
<!-- 统计数据 -->
<div class="modal fade" id="jhpbonsjpb_mobal" tabindex="-1" role="basic" aria-hidden="true">
    <div class="modal-dialog"  style="width: 1400px;justify-content: center; /* 水平居中 */
  align-items: center;  height: 90%; overflow-y: auto;/* 垂直居中 */">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
                <h4 class="modal-title">计划排班与实际班次统计数据 </h4>
            </div>
            <div class="modal-body">
                <div class="portlet-body">
                    <div class="table-container" style="margin-top: 10px">
                        <table class="table table-striped table-bordered table-hover table-checkable" id="datatable_jhpbOnsjpd">
                            <thead>
                            <tr role="row" class="heading">
                                <th>序号</th>
                                <th>路牌</th>
                                <th>班次数(实际)</th>
                                <th>班次数</th>
                                <th>营运里程(km)(实际)</th>
                                <th>营运里程(km)</th>
                                <th>进场时间(分)(实际)</th>
                                <th>进场时间(分)</th>
                                <th>出场时间(分)(实际)</th>
                                <th>出场时间(分)</th>
                                <th>开始营运时间(实际)</th>
                                <th>开始营运时间</th>
                                <th>结束营运时间(实际)</th>
                                <th>结束营运时间</th>
                            </tr>
                            </thead>
                            <tbody></tbody>
                        </table>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn default" data-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>
<script type="text/html" id="jhpbOnsjpd_temp">
    {{each list as obj i }}
    <tr role="row" class="filter">
        <td>{{i+1}}</td>
        <td>{{obj.lp}}</td>
        <td>{{obj.bcs_s}}</td>
        <td>{{obj.bcs}}</td>
        <td>{{obj.yylc_s}}</td>
        <td>{{obj.yylc}}</td>
        <td>{{obj.jclc_s}}</td>
        <td>{{obj.jclc}}</td>
        <td>{{obj.cllc_s}}</td>
        <td>{{obj.cllc}}
        <td>{{obj.ksyysj_s}}</td>
        <td>{{obj.ksyysj}}
        <td>{{obj.jsyysj_s}}</td>
        <td>{{obj.jsyysj}}


    </tr>
    {{/each}}
    {{if list.length == 0}}
    <tr>
        <td colspan=3><h6 class="muted">没有找到相关数据</h6></td>
    </tr>
    {{/if}}
</script>
<script type="text/javascript">
    $('#jhpbonsjpb_mobal').on('jhpbOnsjpdMobal.show', function(e,countDate){
        debugger
        // 加载延迟200毫秒显示mobal
        setTimeout(function(){$('#jhpbonsjpb_mobal').modal({show : true,backdrop: 'static', keyboard: false});},200);
        // 当模态框对用户可见时触发(将等待 CSS 过渡效果完成)。
        $('#jhpbonsjpb_mobal').on('show.bs.modal', function () {
            debugger
            // 把数据填充到模版中
            var tbodyHtml = template('jhpbOnsjpd_temp',{list:countDate});
            // 把渲染好的模版html文本追加到表格中
            $('#datatable_jhpbOnsjpd tbody').html(tbodyHtml);
            $('#star').raty({ readOnly: true,score: 4.5 });
        });
    });
</script>