changetochange.html 9.02 KB
<style type="text/css">
	.table-bordered {
	  border: 1px solid; }
	  .table-bordered > thead > tr > th,
	  .table-bordered > thead > tr > td,
	  .table-bordered > tbody > tr > th,
	  .table-bordered > tbody > tr > td,
	  .table-bordered > tfoot > tr > th,
	  .table-bordered > tfoot > tr > td {
	    border: 1px solid; }
	  .table-bordered > thead > tr > th,
	  .table-bordered > thead > tr > td {
	    border-bottom-width: 2px; }
	 
	 .table > tbody + tbody {
	   border-top: 1px solid; }
</style>

<div class="page-head">
	<div class="page-title">
		<h1>换人换车情况统计表</h1>
	</div>
</div>

<div class="row">
	<div class="col-md-12">
		<div class="portlet light porttlet-fit bordered">
			<div class="portlet-body">
				<div class="table-container" style="margin-top: 10px;overflow:auto;min-width: 906px">
					<table class="table table-bordered table-hover table-checkable" id="forms">
						<thead>
							<tr>
								<th colspan="13">换人换车情况统计表</th>
							</tr>
							<!-- <tr>
								<td colspan="12">车队     站     <span id="sDate"></span>至<span id="eDate"></span></td>
							</tr> -->
							<tr>
								<td rowspan="3">日期</td>
								<td rowspan="3">公司</td>
								<td rowspan="3">分公司</td>
								<td rowspan="3">线路</td>
								<td rowspan="3">路牌</td>
								<td rowspan="3">发生时间</td>
								<td rowspan="3">修改时间</td>
								<td colspan="3">配车</td>
								<td colspan="3">人员</td>
								<td rowspan="3">原因</td>
								<td rowspan="3">修改人</td>
							</tr>
							<tr>
								<td>计划</td>
								<td>实际</td>
								<td>计划</td>
								<td>实际</td>
							</tr>
							<tr>
								<td>计划</td>
								<td>实际</td>
								<td>计划</td>
								<td>实际</td>
							</tr>
						</thead>
						<tbody class="list_correctForm">
							
						</tbody>
						<tbody class="list_correctForm_statistics">
						    
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</div>
</div>

<script>
	$(function(){
		// 关闭左侧栏
		if (!$('body').hasClass('page-sidebar-closed'))
			$('.menu-toggler.sidebar-toggler').click();
		
		$("#startDate,#endDate").datetimepicker({
			format : 'YYYY-MM-DD',
			locale : 'zh-cn'
		});
		
		$('#line').select2({
            ajax: {
                url: '/realSchedule/findLine',
                type: 'post',
                dataType: 'json',
                delay: 150,
                data: function(params){
                    return{line: params.term};
                },
                processResults: function (data) {
                  return {
                    results: data
                  };
                },
                cache: true
            },
            templateResult: function(repo){
                if (repo.loading) return repo.text;
                var h = '<span>'+repo.text+'</span>';
                return h;
            },
            escapeMarkup: function (markup) { return markup; },
            minimumInputLength: 1,
            templateSelection: function(repo){
                return repo.text;
            },
            language: {
               noResults: function(){
                   return '<span style="color:red;font-size: 12px;">没有搜索到线路!</span>';
               },
               inputTooShort : function(e) {
                    return '<span style="color:gray;font-size: 12px;"><i class="fa fa-search"></i> 输入线路搜索线路</span>';
               },
               searching : function() {
                    return '<span style="color:gray;font-size: 12px;"> 正在搜索线路...</span>';
               }
            }
        });
        $('#lpName').select2({
            ajax: {
                url: '/realSchedule/findLpName',
                type: 'post',
                dataType: 'json',
                delay: 150,
                data: function(params){
                    return{lpName: params.term};
                },
                processResults: function (data) {
                  return {
                    results: data
                  };
                },
                cache: true
            },
            templateResult: function(repo){
                if (repo.loading) return repo.text;
                var h = '<span>'+repo.text+'</span>';
                return h;
            },
            escapeMarkup: function (markup) { return markup; },
            minimumInputLength: 1,
            templateSelection: function(repo){
                return repo.text;
            },
            language: {
               noResults: function(){
                   return '<span style="color:red;font-size: 12px;">没有搜索到路牌!</span>';
               },
               inputTooShort : function(e) {
                    return '<span style="color:gray;font-size: 12px;"><i class="fa fa-search"></i> 输入路牌搜索路牌</span>';
               },
               searching : function() {
                    return '<span style="color:gray;font-size: 12px;"> 正在搜索路牌...</span>';
               }
            }
        });
        $('#code').select2({
            ajax: {
                url: '/realSchedule/sreachVehic',
                dataType: 'json',
                delay: 150,
                data: function(params){
                    return{nbbm: params.term};
                },
                processResults: function (data) {
                  return {
                    results: data
                  };
                },
                cache: true
            },
            templateResult: function(repo){
                if (repo.loading) return repo.text;
                var h = '<span>'+repo.text+'</span>';
                h += (repo.lineName?'&nbsp;<span class="select2-desc">'+repo.lineName+'</span>':'');
                return h;
            },
            escapeMarkup: function (markup) { return markup; },
            minimumInputLength: 1,
            templateSelection: function(repo){
                return repo.text;
            },
            language: {
               noResults: function(){
                   return '<span style="color:red;font-size: 12px;">没有搜索到车辆!</span>';
               },
               inputTooShort : function(e) {
                    return '<span style="color:gray;font-size: 12px;"><i class="fa fa-search"></i> 输入自编号搜索车辆</span>';
               },
               searching : function() {
                    return '<span style="color:gray;font-size: 12px;"> 正在搜索车辆...</span>';
               }
            }
        });
		
		$("#query").on("click",function(){
		    var line = $("#line").val();
		    var startDate = $("#startDate").val();
		    var endDate = $("#endDate").val();
		    var lpName = $("#lpName").val();
		    var code = $("#code").val();
		    $post("/realSchedule/correctForm",{line:line,startDate:startDate,endDate:endDate,lpName:lpName,code:code},function(result){
		        $("#sDate").text(startDate);
		        $("#eDate").text(endDate);
		        var temp = {};
		        var today_account = 0;
		        temp["line"] = $("#line").text() ;
		        temp["totalAdjustment"] = result.length;  
		        
		        $.each(result, function(i, obj) {
		            if(moment(obj.scheduleDate).format("YYYY-MM-DD") == moment(obj.updateDate).format("YYYY-MM-DD")){
		                today_account++;
		            } 
                    obj.updateDate = moment(obj.updateDate).format("YYYY-MM-DD HH:mm:ss");
                });
                
                temp["todayAdjustment"] = today_account;
                temp["beforeAdjustment"] = result.length-today_account;
                temp["historyAdjustment"] = 0;
		        
		        var list_correctForm = template('list_correctForm',{list:result});
                // 把渲染好的模版html文本追加到表格中
                $('#forms .list_correctForm').html(list_correctForm);
                
                var list_correctForm_statistics = template('list_correctForm_statistics',temp);
                $('#forms .list_correctForm_statistics').html(list_correctForm_statistics);
		    });
		});
	});
</script>
<script type="text/html" id="list_correctForm">
	{{each list as obj i}}
		<tr>
			<td>{{obj.xlName}}</td>
			<td>{{obj.lpName}}</td>
			<td>{{obj.clZbh}}</td>
			<td>{{obj.jName}}</td>
			<td>{{obj.sName}}</td>
			<td>{{obj.fcsj}}</td>
			<td>{{obj.fcsjActual}}</td>
			<td>{{obj.zdsj}}</td>
			<td>{{obj.zdsjActual}}</td>
			<td>{{obj.updateBy}}</td>
			<td>{{obj.updateDate}}</td>
			<td>{{obj.remarks}}</td>
		</tr>
	{{/each}}
	{{if list.length == 0}}
		<tr>
			<td colspan="12"><h6 class="muted">没有找到相关数据</h6></td>
		</tr>
	{{/if}}
</script>
<script type="text/html" id="list_correctForm_statistics">
    <tr>
        <td colspan="2">线路:</td>
        <td>{{line}}</td>
        <td>调整总数</td>
        <td>{{totalAdjustment}}</td>
        <td>事先调整</td>
        <td>{{beforeAdjustment}}</td>
        <td>当日调整</td>
        <td>{{todayAdjustment}}</td>
        <td>历史调整</td>
        <td colspan="2">{{historyAdjustment}}</td>
    </tr>
</script>