jylList.html 13.6 KB
<style>
.blue{
	background-color: #87CEFF
}
</style>
<div class="page-head">
    <div class="page-title">
        <h1>车辆加油量</h1>
    </div>
</div>
<ul class="page-breadcrumb breadcrumb">
    <li><a href="/pages/home.html" data-pjax>首页</a> <i class="fa fa-circle"></i></li>
    <li><span class="active">油量信息查询</span> <i class="fa fa-circle"></i></li>
    <li><span class="active">车辆加油量</span></li>
</ul>

<div class="row" id="ll_oil_list">
    <div class="col-md-12">
        <!-- Begin: life time stats -->
        <div class="portlet light portlet-fit portlet-datatable bordered">
            <div class="portlet-title">
                <div class="caption">
                    <i class="fa fa-fire-extinguisher"></i> <span
                        class="caption-subject font-dark sbold uppercase">车辆加油量</span>
                </div>
                <div class="actions">
					<button type="button" class="btn btn-circle blue" id="upload"><i class="fa fa-file-excel-o"></i>
						导入Excel
					</button>
					<!--<button type="button" class="btn btn-circle blue" id="export"><i class="fa fa-file-excel-o"></i>
						导出Excel
					</button>-->
                </div>
            </div>
            <div class="portlet-body">
                <div class="table-container" style="margin-top: 0px">
                    <table
                            class="table table-striped table-bordered table-hover table-checkable"
                            id="datatable_dlb">
                        <thead>

                        <tr role="row" class="heading">
                            <th width="5%">#</th>
                            <th width="15%">日期</th>
                            <th width="15%">内部编码</th>
                            <th width="15%">加油量</th>
                            <th width="15%">加油站</th>
                            <th width="15%">油号</th>
                            <th width="20%">备注</th>
                        </tr>
                        <tr role="row" class="filter">
                            <td></td>
                            <td>
                                <input type="text" style="width: 100px" name="rq" id="rq"/>
                            </td>
                            <!--<td>
                                <select class="form-control" name="nbbm" id="nbbm" style="width: 120px;"></select>
                            </td>-->
                            <td></td>
                            <td></td>
                            <td></td>
                            <td></td>
                            <td>
                                <button class="btn btn-sm green btn-outline filter-submit margin-bottom" style="margin-right:0px">
                                    <i class="fa fa-search"></i> 搜索
                                </button>
                                <button class="btn btn-sm red btn-outline filter-cancel" style="margin-right:0px">
                                    <i class="fa fa-times"></i> 重置
                                </button>
                                <!--                                 <button class="btn btn-danger btn-sm red" id="del" style="margin-right:0px"> -->
                                <!--                                     <i class="fa fa-times"></i> 删除 -->
                                <!--                                 </button> -->
                            </td>
                        </tr>
                        </thead>
                        <tbody></tbody>
                    </table>
                    <div style="text-align: right;">
                        <ul id="pagination" class="pagination"></ul>
                    </div>
                </div>
            </div>
			<div class="portlet-body">
				<div id="modules_tree"></div>
			</div>
        </div>
    </div>
</div>


<script src="/assets/js/ajaxfileupload/ajaxfileupload.js"></script>
<script>
    $(function () {

		// 关闭左侧栏
		if (!$('body').hasClass('page-sidebar-closed'))
			$('.menu-toggler.sidebar-toggler').click();

        $("#rq").datetimepicker({
            format: 'YYYY-MM-DD',
            locale: 'zh-cn'
        });
        var d = new Date();
        d.setTime(d.getTime() - 1*1000*60*60*24);
        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;
        $("#rq").val(year + "-" + month + "-" + day);
        var page = 0, initPagination;
        var icheckOptions = {
            radioClass: 'iradio_square-blue icheck',
            increaseArea: '20%'
        }

        //重置
        $('tr.filter .filter-cancel').on('click', function () {
            $('tr.filter input, select').val('').change();
        });

        //提交
        $('tr.filter .filter-submit').on('click', function () {
            if ($("#rq").val() == "" || $("#rq").val() ==null){
            	  layer.msg('请选择日期.');
            }else {

                var params = getParams();

                page = 0;
                jsDoQuery(params, true);
            }
        });


    	$.get('/user/companyData', function(result){
    		obj = result;
    		var options="";
// 			= '<option value="">请选择</option>';
    		for(var i = 0; i < obj.length; i++){
    			options += '<option value="'+obj[i].companyCode+'">'+obj[i].companyName+'</option>';
//     			setFgsqx(obj[i].companyCode);
    		}
    		$('#gsbm').html(options);
    		updateCompany();
    	});

    	$("#gsbm").on("change",updateCompany);
    	function updateCompany(){
    		var company = $('#gsbm').val();
    		var options ="";
//     		= '<option value="">请选择</option>';
    		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++){
    					options += '<option value="'+children[j].code+'">'+children[j].name+'</option>';
    				}
    			}
    		}
    		$('#fgsbm').html(options);
    	}
        /*
         * 获取数据 p: 要提交的参数, pagination: 是否重新分页
         */
        function jsDoQuery(p, pagination) {
            var params = {};
            if (p)
                params = p;
            params['order'] = 'nbbm';
            params['page'] = page;
            params['rq'] = $("#rq").val();

            var j = layer.load(2);
            $get('/ylxxb/query', params, function (data) {
                $.each(data.dataList, function (i, obj) {
                    obj.rq = moment(obj.rq).format("YYYY-MM-DD");
                });
                var bodyHtm = template('jyl_list', {list:data.dataList});

                $('#datatable_dlb tbody').html(bodyHtm)
                        .find('.icheck').iCheck(icheckOptions)
                        .on('ifChanged', iCheckChange);
                if (pagination && data.dataList.length > 0) {
                    //重新分页
                    initPagination = true;
                    showPagination(data);
                	$('#pagination').show();
                } else if(data.dataList.length == 0){
                	$('#pagination').hide();
                }

                layer.close(j);

                startOptJzylLink($('#ll_oil_list .in_carpark_jzyl'));
            });
        }

        //改变状态
        function startOptJzylLink(es) {
            es.editable({
                type: 'text',
                placement: 'right',
                width: 100,
                display: false,
                validate: function (value) {
                    if (!value)
                        return '值不能为空!';
                    if (isNaN(value))
                        return '只能为数字!';
                    if (value < 0)
                        return '值不能小于0!';
                },
                inputclass: 'form-control input-medium input-edtable-sm'
            }).on('save', function (e, params) {
				$(this).text(params.newValue);
			});
        }

        function iCheckChange() {
            var tr = $(this).parents('tr');
            if (this.checked)
                tr.addClass('row-active');
            else
                tr.removeClass('row-active');

            /* if($('#datatable_resource input.icheck:checked').length == 1)
             $('#removeButton').removeAttr('disabled');
             else
             $('#removeButton').attr('disabled', 'disabled');  */
        }

        function showPagination(data) {
            //分页
            $('#pagination').jqPaginator({
                totalPages: data.totalPages,
                visiblePages: 6,
                currentPage: page + 1,
                first: '<li class="first"><a href="javascript:void(0);">首页<\/a><\/li>',
                prev: '<li class="prev"><a href="javascript:void(0);">上一页<\/a><\/li>',
                next: '<li class="next"><a href="javascript:void(0);">下一页<\/a><\/li>',
                last: '<li class="last"><a href="javascript:void(0);">尾页<\/a><\/li>',
                page: '<li class="page"><a href="javascript:void(0);">{{page}}<\/a><\/li>',
                onPageChange: function (num, type) {
                    if (initPagination) {
                        initPagination = false;
                        return;
                    }
                    
                    var params = getParams();
                    
                    page = num - 1;
                    jsDoQuery(params, true);
                }
            });
        }


        //删除
        $('#del').on('click', function () {
            if ($(this).attr('disabled'))
                return;

            var id = $('input.icheck:checked').data('id');
            removeConfirm('确定要删除选中的数据?', '/resource/' + id, function () {
                $('tr.filter .filter-submit').click();
            });
        });

        //搜索线路
       	$.get('/basic/lineCode2Name',function(result){
			var data=[];
			
			for(var code in result){
				data.push({id: code, text: result[code]});
			}
			initPinYinSelect2('#xlbm',data,'');
			
		});

        $('#nbbm').select2({
            placeholder: '搜索车辆...',
            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>';
                }
            }
        })

        //导入
        $("#upload").on("click", function(){
        	$.get('upload.html', function(m){$(pjaxContainer).append(m);});
        });

		//导出
        $("#export").on("click", function () {
            if ($("#rq").val() != "") {
            	var gsbm=$("#gsbm").val();
         		var fgsbm=$("#fgsbm").val();
            	if(gsbm=="" || gsbm==null || fgsbm=="" ||fgsbm==null){
					layer.msg('请选择公司和分公司.');
					return;
				}
				var params = getParams();
                
				params["type"] = "export";
				$get('/jdl/query', params, function (result) {
					window.open("/downloadFile/download?fileName=车辆充电量" + moment($("#rq").val()).format("YYYYMMDD"));
				});
            } else {
                layer.msg('请选择日期.');
            }
        });
		
		function getParams(){
            var cells = $('tr.filter')[0].cells
                    , params = {}
                    , name;
            $.each(cells, function (i, cell) {
                var items = $('input,select', cell);
                for (var j = 0, item; item = items[j++];) {
                    name = $(item).attr('name');
                    if (name) {
                        params[name] = $(item).val();
                    }
                }
            });
			return params;
		};

    });

</script>

<script id="jyl_list" type="text/html">
    {{each list as obj i}}
    <tr>
        <td style="vertical-align: middle;">
            <!-- <input type="radio" name="id" class="group-checkable icheck" data-id="{{obj.id}}"> -->
			{{i + 1}}
        </td>
        <td>{{obj.rq}}</td>
        <td>{{obj.nbbm}}</td>
        <td>{{obj.jzl}}</td>
		<td>{{obj.stationid}}</td>
        <td>{{obj.yh}}</td>
        <td>{{obj.bz}}</td>
    </tr>
    {{/each}}
    {{if list.length == 0}}
    <tr>
        <td colspan=9><h6 class="muted">没有找到相关数据</h6></td>
    </tr>
    {{/if}}
</script>