calcDetailMonthly.html 15.6 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;
        text-align: center; }
    .table-bordered > thead > tr > th,
    .table-bordered > thead > tr > td {
        border-bottom-width: 2px; }

    .table > tbody + tbody {
        border-top: 1px solid; }


    #analy_body   tr> td >span{
        word-break: keep-all;white-space:nowrap;
    }

    #analy_body td{
        min-width: 100px;
        max-width: 100px;
        width: 100px;
    }

    #analy_body{
        margin-top: 20px;
        height: 620px;
        width: 100%
    }


    .table_head::-webkit-scrollbar {
        display:none
    }

    .table_head{
        min-width: 906px;
        width: 100%;
        overflow: hidden;
    }

    .table_body{
        width:101%;
        height:580px;
        overflow: auto;
        margin-top: -20px;
    }
</style>
<div class="page-head">
    <div class="page-title">
        <h1>路单线路明细月报表</h1>
    </div>
</div>

<!--<div class="row">-->
<div class=" row col-md-12 portlet light  bordered" style="height:calc(100% - 38px)">
    <div class="">
        <form class="form-inline" >
            <div style="display: inline-block; margin-left: 13px;" id="gsdmDiv_daily">
                <span class="item-label" style="width: 80px;">&#12288;&#12288;公司: </span>
                <select class="form-control" name="company" id="gsdm" style="width: 150px;"></select>
            </div>
            <div style="display: inline-block; margin-left: 13px;" id="fgsdmDiv_daily">
                <span class="item-label" style="width: 80px;">&#12288;分公司: </span>
                <select class="form-control" name="fgsdm" id="fgsdm" style="width: 150px;"></select>
            </div>
            <!--<div style="display: inline-block;margin-left: 33px;">
                <span class="item-label" style="width: 80px;">&#12288;&#12288;线路: </span>
                <select class="form-control" name="line" id="line" style="width: 180px;"></select>
            </div>-->
            <div style="display: inline-block;margin-left: 13px;" class="date-picker">
                <span class="item-label" style="width: 80px;">&#12288;&#12288;时间: </span>
                <input class="form-control" type="text" id="startDate" style="width: 150px;" /> -
                <input class="form-control" type="text" id="endDate" style="width: 150px;" />
                <!--<input class="form-control" type="text" id="startDate" style="width: 180px;" value="2020-10-01"/> - -->
                <!--<input class="form-control" type="text" id="endDate" style="width: 180px;" value="2020-10-10"/>-->
            </div>
            
            <div style="margin-top: 2px"></div>
            
            <div style="display: inline-block; margin-left: 13px;">
                <span class="item-label" style="width: 80px;">线路性质: </span>
                <select class="form-control" name="destroy" id="destroy" style="width: 150px;">
                    <option value="0,1">全部线路</option>
                    <option value="0">营运线路</option>
                    <option value="1">非营运线路</option>
                </select>
            </div>
            <div style="display: inline-block;margin-left: 13px;">
                <span class="item-label" style="width: 80px;">统计对象: </span>
                <select class="form-control" name="statisticalObj" id="statisticalObj" style="width: 150px;">
                    <option value="cl">车辆</option>
                    <option value="jsy">驾驶员</option>
                    <option value="cwy">乘务员</option>
                    <option value="xl">线路</option>
                </select>
            </div>

            <div style="display: inline-block; margin-left: 13px;" >
                <span class="item-label" style="width: 80px;">统计项目: </span>
                <select class="form-control" name="statisticalItem" id="statisticalItem" style="width: 150px;">
                    <option value="yh">油耗</option>
                    <option value="dh">电耗</option>
                    <option value="gl">公里</option>
                    <option value="bc">班次</option>
                </select>
            </div>
            <div style="display: inline-block; margin-left: 13px;" >
                <span class="item-label" style="width: 80px;">项目明细: </span>
                <select class="form-control" name="itemDetails" id="itemDetails" style="width: 150px;"></select>
            </div>
            <div class="form-group" style="display: inline-block;margin-left: 22px;">
                <input class="btn btn-default" type="button" id="query" value="筛选"/>
                <input class="btn btn-default" type="button" id="export" value="导出"/>
            </div>
        </form>
    </div>

    <div id="analy_body">
        <div class="table_head" id="table_head">
            <table class="table table-bordered table-hover table-checkable " id="forms_head">
                <thead>
                </thead>
            </table>
        </div>
        <div class="table_body" id="table_body">
            <table class="table table-bordered table-hover table-checkable" id="forms_body" style="background-color: white;">
                <tbody>
                </tbody>
            </table>
        </div>
    </div>
</div>
<script >
    $(function(){
        $('#export').attr('disabled', "true");
        // 关闭左侧栏
        if (!$('body').hasClass('page-sidebar-closed'))
            $('.menu-toggler.sidebar-toggler').click();

        var table_body1 = document.getElementById("table_body");
        table_body1.onscroll = function(){
            var table_body1_left = this.scrollLeft;
            document.getElementById("table_head").scrollLeft = table_body1_left;
        };

        var d = new Date();
        d.setTime(d.getTime() - 4*1000*60*60*24);//只能查4天以前的数据
        var year = d.getFullYear();
        var month = d.getMonth() + 1;
        var day = d.getDate();
        if(month < 10)
            month = "0" + month;
        if(day < 10)
            day = "0" + day;
        //时间
        var dateTime=year + "-" + month + "-" + day;
        $("#startDate").val(dateTime);
        $("#endDate").val(dateTime);

        $("#endDate").datetimepicker({
            format : 'YYYY-MM-DD',
            locale : 'zh-cn',
            maxDate : dateTime
        });
        $("#startDate").datetimepicker({
            format : 'YYYY-MM-DD',
            locale : 'zh-cn',
            maxDate : dateTime
        });

        var lineAll="";
        var datas = {}; //查询条件

        /**用户分配的线路*/
        $.get('/realControAuthority/findByCurrentUser', function (userAuthor) {
            lineAll = userAuthor.lineCodeStr.substring(0,userAuthor.lineCodeStr.length-1);
        });

        var tempData = {};

        $.get('/user/companyData', function(result){
			var obj = result;
			var options = '';
			for(var i = 0; i < obj.length; i++){
				options += '<option value="'+obj[i].companyCode+'">'+obj[i].companyName+'</option>';
			}
			
			if(obj.length ==0){
				 $("#gsdmDiv_daily").css('display','none');
			}else if(obj.length ==1){
				 $("#gsdmDiv_daily").css('display','none');
				if(obj[0].children.length == 1  || obj[0].children.length == 0){
					fage=false;
					$('#gsdmDiv_daily').css('display','none');
				}
			}
			$('#gsdm').html(options);
			updateCompany();
		});
		$("#gsdm").on("change",updateCompany);
		
		function updateCompany(){
			var company = $('#gsdm').val();
	        $.get('/user/companyData', function(obj) {
	            var option = '';
	            var allC = "";
	            for (var i = 0; i < obj.length; i++) {
	                if (obj[i].companyCode == company) {
	                    var children = obj[i].children;
	                    for (var j = 0; j < children.length; j++) {
	                        allC += children[j].code+",";
	                        option += '<option value="' + children[j].code + '">' + children[j].name + '</option>';
	                    }
	                }
	            }
	
	            var options = '<option value="'+allC.substring(0,allC.length-1)+'">所有分公司</option>'+option;
	            $('#fgsdm').html(options);
	        });
		}

        // 项目明细选项列
        // 触发默认选项
        updateItem();
        $("#statisticalItem").on("change",updateItem);
        function updateItem() {
            var item = $('#statisticalItem').val();
            var options = '';
            if(item == "yh"){
                options += '<option value="jzlAll">加注量[全部]</option>' +
                    '<option value="jzl0">加注量[0#]</option>'+
                    '<option value="jzl-10">加注量[-10#]</option>'+
                    '<option value="yhl">油耗量</option>'+
                    '<option value="cccy">出场存油</option>'+
                    '<option value="jccy">进场存油</option>'+
                    '<option value="bglyh">百公里油耗</option>';
            } else if(item == "gl"){
                options += '<option value="zgl">总公里</option>' +
                    '<option value="jhgl">计划公里</option>';
                /*'<option value="jclm">进场路码</option>'+
                '<option value="cclm">出场路码</option>'*/
            } else if(item == "bc"){
                options += '<option value="sjbc">实际班次</option>' +
                    '<option value="jhbc">计划班次</option>';
            } else if(item == "dh"){
                options += '<option value="dh">耗电量</option>';
                options += '<option value="cdl">充电量</option>';
                options += '<option value="cccd">出场存电</option>';
                options += '<option value="jccd">进场存电</option>';
                options += '<option value="bgldh">百公里电耗</option>';
            }
            $('#itemDetails').html(options);
        }

        //线路名称
        var lineName = '';
        $("#query").on("click",function(){
            var gsdm = $("#gsdm").val();
            var fgsdm = $("#fgsdm").val();
            var startDate = $("#startDate").val();
            var endDate = $("#endDate").val();
            var statisticalObj = $("#statisticalObj").val();
            //开始和结束时间
            var startTime = Date.parse(new Date(startDate));
            var endTime = Date.parse(new Date(endDate));

            datas = {}; // 清空之前数据
            datas.gsdm = gsdm;
            datas.fgsdm = fgsdm;
            datas.lineCode = lineAll;
            datas.timeType = "m";
            datas.startDate = startDate;
            datas.endDate = endDate;
            datas.destroy = $("#destroy").val();
            datas.statisticalObj = $("#statisticalObj").val();
            datas.itemDetails = $("#itemDetails").val();
            var itemDetails = datas.itemDetails,
                type = "加注量[全部]";
            if(itemDetails=="jzl0"){
                type = "加注量[0#]"
            } else if(itemDetails=="jzl-10"){
                type = "加注量[-10#]"
            } else if(itemDetails=="yhl"){
                type = "油耗量"
            } else if(itemDetails=="cccy"){
                type = "出场存油"
            } else if(itemDetails=="jccy"){
                type = "进场存油"
            } else if(itemDetails=="bglyh"){
                type = "百公里油耗"
            } else if(itemDetails=="zgl"){
                type = "总公里"
            } else if(itemDetails=="jhgl"){
                type = "计划公里"
            } else if(itemDetails=="jclm"){
                type = "进场路码"
            } else if(itemDetails=="cclm"){
                type = "出场路码"
            } else if(itemDetails=="sjbc"){
                type = "实际班次"
            } else if(itemDetails=="jhbc"){
                type = "计划班次"
            } else if(itemDetails=="dh"){
                type = "耗电量"
            } else if(itemDetails=="cdl"){
                type = "充电量"
            } else if(itemDetails=="cccd"){
                type = "出场存电"
            } else if(itemDetails=="jccd"){
                type = "进场存电"
            } else if(itemDetails=="bgldh"){
                type = "百公里电耗"
            }
            datas.name = datas.startDate+"-"+datas.endDate+"-路单线路明细月报表("+type+")";
            if(startDate==null || startDate =="" ||endDate==null || endDate ==""){
                layer.msg('请选择时间段!');
            }else if(endTime<startTime){
                layer.msg('结束日期不能小于开始日期!');
            }else {
                if (endDate.substring(0, 7) != startDate.substring(0, 7)) {
                    layer.msg("请查询同月份数据!");
                    return;
                } else {
                    var lodingI = layer.load(2);
                    $get('/calcWaybill/calcDetailMonthly', datas, function (rs) {
                        if (rs.length <=0) {
                            layer.close(lodingI);
                            layer.open({
                                title: '提示'
                                , content: '没有您要查询的数据,请重新选择参数!'
                            });
                            $("#export").attr('disabled',"true");
                            return;
                        }else
                            $("#export").removeAttr("disabled");
                        var htmlHead = "<tr><td colspan='"+rs[0].length+"'>"+datas.name+"</td></tr>", htmlBody = "";
                        var rsLength = rs.length;
                        rs.forEach(function (o, i) {
                            var html = "<tr>"
                            o.forEach(function (td, j) {
                                var colspan;
                                if (i == rsLength - 1 && j == 0) {
                                    colspan = (statisticalObj == "xl" ?  "colspan='3'" : "colspan='5'");
                                    if(statisticalObj == "cl")
                                        colspan = "colspan='6'";
                                }
                                html += "<td " + colspan + ">" + td + "</td>"
                            });
                            html += "</tr>"
                            if (i == 0) {
                                htmlHead += html;
                            } else
                                htmlBody += html;
                        });
                        $('#forms_head thead').html(htmlHead);
                        $('#forms_body tbody').html(htmlBody);
                        layer.close(lodingI);
                    });
                }
            }
        });

        $("#export").on("click",function(){
            $post("/report/calcDetailMonthlyE",datas,function(result){
                window.open("/downloadFile/download?fileName="+datas.name);
            });
        });
    });
</script>
<!--<script type="application/javascript" src="/pages/forms/calc/calcDetailMonthly.js"></script>-->