BJ_web_developers / hsparkingcloud

var timer;
var feefun = {
    init: function () {

        commSelect.area_Pl_LinkedSelect("#fee-transSelecarea", "#fee-transSelectPark");
        //初始化

        /**日 时间初始化*/
        $('#parkingfee-daydaterange-btnsta').val(moment().subtract('days', 7).format('YYYY-MM-DD'));
        $('#parkingfee-daydaterange-btnend').val(moment().subtract('days', 1).format('YYYY-MM-DD'));
        //开始日期
        $("#parkingfee-daydaterange-btnsta").datetimepicker({
            endDate: moment().subtract('days', 1).format('YYYY-MM-DD'),
            format: 'yyyy-mm-dd',
            autoclose: true,
            startView: 2,
            //maxDate:moment().subtract('months', 3),
            minView: 2,
            forceParse: false,
            locale: "zh-CN",
            language: 'zh-CN',
            pickerPosition: "bottom-right"
        })
        //结束日期
        $("#parkingfee-daydaterange-btnend").datetimepicker({
            endDate: moment().subtract('days', 1).format('YYYY-MM-DD'),
            format: 'yyyy-mm-dd',
            autoclose: true,
            startView: 2,
            //maxDate:moment().subtract('months', 3),
            minView: 2,
            forceParse: false,
            locale: "zh-CN",
            language: 'zh-CN',
            pickerPosition: "bottom-right"
        })

        /** 小时 时间初始化 **/
        $('#fee-monthdaterange-btnsta').val(moment().subtract('days', 1).format('YYYY-MM-DD'));
        $('#fee-monthdaterange-btnend').val(moment().subtract('days', 1).format('YYYY-MM-DD'));
        //开始日期
        $("#fee-monthdaterange-btnsta").datetimepicker({
            endDate: moment().subtract('days', 1).format('YYYY-MM-DD'),
            format: 'yyyy-mm-dd',
            autoclose: true,
            startView: 2,
            //maxDate:moment().subtract('months', 3),
            minView: 2,
            forceParse: false,
            locale: "zh-CN",
            language: 'zh-CN',
            pickerPosition: "bottom-right"
        });
        //结束日期
        $("#fee-monthdaterange-btnend").datetimepicker({
            endDate: moment().subtract('days', 1).format('YYYY-MM-DD'),
            format: 'yyyy-mm-dd',
            autoclose: true,
            startView: 2,
            //maxDate:moment().subtract('months', 3),
            minView: 2,
            forceParse: false,
            locale: "zh-CN",
            language: 'zh-CN',
            pickerPosition: "bottom-right"
        })

        /** 函数 表格数据 **/
        feefun.feecreateTableData();
        chartsInit();
    },
    //默认生成表格数据
    feecreateTableData: function () {
        $('#fee-billtable').bootstrapTable('destroy').bootstrapTable({
            striped: true,//表格显示条纹
            pagination: true, //启动分页
            pageNumber: 1, //当前第几页
            pageSize: 10,  //每页显示的记录数
            pageList: [10, 15, 20],  //记录数可选列表
            sidePagination: 'server',//表示服务端分页
            queryParamsType: 'limit',
            sortable: true,                     //是否启用排序
            sortOrder: "asc",
            method: 'POST',//请求方法
            paginationPreText: '<',
            paginationNextText: '>',
            ajax: feetableLoadRequest,//自定义ajax加载数据
            // uniqueId:'id',
            columns: [
                {
                    field: 'staticTimeStr',
                    title: '<span class=" time-icon"></span>统计时间',
                    width: '20%',
                    align: "left",
                    formatter: commonObj.replacenull
                    // formatter: function (value, row, index) {
                    //     if (feefun.isDayPage()) {
                    //         //按照天
                    //         var date = new Date(parseInt(row.statisticEndTime));
                    //         return date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate();
                    //     }
                    //     return value;
                    //
                    // }
                },
                {
                    field: 'plName',
                    title: '<span class="parking-icon"></span>车场名称',
                    width: '20%',
                    align: "left",
                    formatter: commonObj.replacenull
                },
                {
                    field: 'totalBerths',
                    title: '<span class=" information-icon"></span>泊位数',
                    width: '20%',
                    align: "left",
                    sortable: true,
                    formatter: commonObj.replacenull
                },
                {
                    field: 'vehicleFlow',
                    title: '<span class="parkingin-icon"></span>进场车辆数',
                    width: '10%',
                    align: "left",
                    formatter: commonObj.replacenull,
                    sortable: true
                },
                {
                    field: 'outParkCount',
                    title: '<span class="parkingout-icon"></span>出场车辆数',
                    width: '10%',
                    align: "left",
                    formatter: commonObj.replacenull,
                    sortable: true
                },
                {
                    field: 'freeRatio',
                    title: '<span class=" zyl-icon"></span>占用率',
                    width: '15%',
                    align: "left",
                    sortable: true,
                    formatter: function (value) {
                        return ((1 - value) * 100).toFixed(2);
                    }

                },
                {
                    field: 'unitTurnoverRatio',
                    title: '<span class=" zzl-icon"></span>周转次数',
                    width: '15%',
                    align: "left",
                    // sortable: true,
                    formatter:function (value) {
                        if(value==null || value ==undefined){
                            return '-';
                        }else{
                            return value.toFixed(2);
                        }
                    }
                },

            ]
        });
    },
    /*获取查询参数*/
    feegetQueryParam: function () {
        var plNos = JSON.parse($("#fee-transSelectPark").val());
        var req = {
            plNos: plNos,
            sysCode: sysComm.sysCode
        }

        if (feefun.isDayPage()) {
            //按天的页面
            var dates1 = $("#parkingfee-daydaterange-btnsta").val();
            var dates2 = $("#parkingfee-daydaterange-btnend").val();

            req.beginTime = dates1;
            req.endTime = dates2;
            req.timeType = 1;

        } else {
            //按小时的页面
            var dates1 = $("#fee-monthdaterange-btnsta").val();
            var dates2 = $("#fee-monthdaterange-btnend").val();

            req.beginTime = dates1;
            req.endTime = dates2;
            req.timeType = 4;
        }

        //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
        // var temp = {
        //     rows: params.limit,                         //页面大小
        //     page: (params.offset / params.limit) + 1,   //页码
        //     sort: params.sort,      //排序列名
        //     sortOrder: params.order //排位命令（desc，asc）
        // };
        return req;
    },
    //是否日报页面
    isDayPage: function () {
        return $('#queryType').attr('data-value')=='1';
    }

};

//默认页面初始执行函数
feefun.init();
/**
 * 默认table 函数
 * 自定义table AJAX请求
 * @param {Object} params
 */
function feetableLoadRequest(params) {
    var req = feefun.feegetQueryParam();

    //设置请求参数
    var pageNum = (params.data.offset / params.data.limit) + 1;

    //条件查询
    req.baseRequest = {
        pageNum: pageNum,
        pageSize: params.data.limit,
        sortOrder:params.data.order,//排序
        sortName:params.data.sort,//排序字段
    };
    var urlStr = dataUrl.util.queryCarFlowByDayForListForPage();
    // if(req.queryKind==4){
    //     urlStr = dataUrl.util.queryCarFlowByMonthForListForPage();
    // }
    var opt = {
        method: 'post',
        url: urlStr,
        data: JSON.stringify(req),
        contentType: 'application/json; charset=utf-8',
        dataType: 'json',
        success: function (res) {
            if (res.code == '8888') {
                params.success(res.data);
                console.log(res.data)
            }
        }
    };
    sysAjax(opt);
}

//隐藏显示 查询条件 搜索框 hide-common-style
documentBindFunc.on('click', ".ITD-search-morebtn", function () {
    $(".hide-common-style").toggleClass("display-none");
});

//日月切换 点击事件
//日 点击
documentBindFunc.on('click', '#parkingfee-checkStyle1', function () {
    $('.parkingfee-choosedateday').removeClass('display-none');
    $('.parkingfee-choosedatemonth').addClass('display-none');
    $('#queryType').attr('data-value', '1');
});
//月 点击
documentBindFunc.on('click', '#parkingfee-checkStyle0', function () {
    $('.parkingfee-choosedatemonth').removeClass('display-none');
    $('.parkingfee-choosedateday').addClass('display-none');
    $('#queryType').attr('data-value', '2');
});


//点击查询事件
documentBindFunc.on('click', '#fee-billQueryBnt', function () {
    window.clearTimeout(timer);
    feefun.feecreateTableData();
    chartsInit();
});

//导出
var InterValObj; //timer变量，控制时间
var count = 8; //间隔函数，1秒执行
var curCount;//当前剩余秒数

function sendMessage() {
    curCount = count;
    //设置button效果，开始计时
    $("#reportBtn").attr("disabled", "true");
    $(".ITD-export-btn").css("width", "138px");
    $("#reportBtn").val(curCount + "秒后可再次导出");
    InterValObj = window.setInterval(SetRemainTime, 1000); //启动计时器，1秒执行一次
}

//timer处理函数
function SetRemainTime() {
    if (curCount == 0) {
        window.clearInterval(InterValObj);//停止计时器
        $("#reportBtn").removeAttr("disabled");//启用按钮
        $(".ITD-export-btn").css("width", "72px");
        $("#reportBtn").val("导出");
    }
    else {
        curCount--;
        $("#reportBtn").val(curCount + "秒后可再次导出");
    }
}
//导出excle
documentBindFunc.on('click','#reportBtn',function (){
    //获取table所有行数据
    var parkLot = $("#fee-billtable").bootstrapTable('getData');
    //获取table总条数
    var numTotal = $("#fee-billtable").bootstrapTable('getOptions').totalRows;
    //提示 无数据不导出
    if(parkLot.length<1){
        $('.ITD-alertmodel-contentmsg').text('无数据可导出!');
        $('#ITD-tipsmodel').modal('show');
        setTimeout(function () {
            $('.ITD-alertmodel-contentmsg').text('');
            $('#ITD-tipsmodel').modal('hide');
        },3000);
        return false;
    }
    //超1万条 缩短查询范围
    if(numTotal>10000){
        $('.ITD-alertmodel-contentmsg').text('数据量过大,请缩小查询范围!');
        $('#ITD-tipsmodel').modal('show');
        setTimeout(function () {
            $('.ITD-alertmodel-contentmsg').text('');
            $('#ITD-tipsmodel').modal('hide');
        },3000);
        return false;
    }

    //执行倒计时函数
    sendMessage();

    //导出函数
    exportTabel();
});


/**
 * 图表数据
 */
function chartsInit() {

    var dataSizeArray = [];
    var req = feefun.feegetQueryParam();
    var beginTime = new Date(req.beginTime.replace(/-/g, "/"));
    var endTimeArray = new Date(req.endTime.replace(/-/g, "/"));

    var beginTimeArray = req.beginTime.split("-");

    var endTimeArray = req.endTime.split("-");

    if (req.timeType == 1) {
        dataSizeArray.push(req.beginTime)
        //按天的页面
        var length = getDayNumber(beginTimeArray[0] + beginTimeArray[1] + beginTimeArray[2], endTimeArray[0] + endTimeArray[1] + endTimeArray[2]) + 1
        for (var i = 1; i < length; i++) {
            dataSizeArray.push(addDate(beginTime, 1));
        }


    } else {
        for(var i = 0 ; i<24;i++){
            if(i<10){
                dataSizeArray.push("0"+i+":00")
            }else{
                dataSizeArray.push(i+":00")
            }

        }



    }

    //查询数据
    var opt = {
        method: 'post',
        url: dataUrl.util.queryCarFlowChartByDayOrMonth(),
        data: JSON.stringify(req),
        contentType: 'application/json; charset=utf-8',
        dataType: 'json',
        success: function (res) {
            if (res.code == '8888') {
                var data = res.data;
                var result = [];
                $.each(dataSizeArray, function (index, staticTimeStr) {
                    var flag = false;
                    $.each(data, function (index, ajaxData) {
                        if (staticTimeStr == ajaxData.staticTimeStr) {
                            flag = true;
                            result.push(ajaxData);
                        }
                    })
                    if (!flag) {
                        var tempData = {
                            "staticTimeStr": staticTimeStr,
                            "vehicleFlow": 0,
                            "outParkCount": 0,
                            "freeRatio": 1,
                            "turnoverRatio": 0
                        };

                        result.push(tempData);
                    }
                })

                chartHandel(result);
            }
        }
    };
    sysAjax(opt);

}


// 日期，在原有日期基础上，增加days天数，默认增加1天
function addDate(date, days) {
    if (days == undefined || days == '') {
        days = 1;
    }

    date.setDate(date.getDate() + days);
    var month = date.getMonth() + 1;
    var day = date.getDate();
    return date.getFullYear() + '-' + getFormatDate(month) + '-' + getFormatDate(day);
}

// 日期，在原有日期基础上，增加days天数，默认增加1天
function addMonth(date, months) {
    if (months == undefined || months == '') {
        months = 1;
    }

    date.setMonth(date.getMonth() + months);
    var month = date.getMonth() + 1;
    var day = date.getDate();
    return date.getFullYear() + '-' + getFormatDate(month) + '-' + getFormatDate(day);
}

// 日期月份/天的显示，如果是1位数，则在前面加上'0'
function getFormatDate(arg) {
    if (arg == undefined || arg == '') {
        return '';
    }

    var re = arg + '';
    if (re.length < 2) {
        re = '0' + re;
    }

    return re;
}

//计算月数差
function getMonthNumber(date1, date2) {
    //默认格式为"20030303",根据自己需要改格式和方法
    var year1 = date1.substr(0, 4);
    var year2 = date2.substr(0, 4);
    var month1 = date1.substr(4, 2);
    var month2 = date2.substr(4, 2);

    var len = (year2 - year1) * 12 + (month2 - month1);

    return len;

}

//计算天数差
function getDayNumber(date1, date2) {
    //默认格式为"20030303",根据自己需要改格式和方法

    var year1 = date1.substr(0, 4);
    var year2 = date2.substr(0, 4);
    var month1 = date1.substr(4, 2);
    var month2 = date2.substr(4, 2);
    // www.jquerycn.cn
    var day1 = date1.substr(6, 2);
    var day2 = date2.substr(6, 2);

    temp1 = year1 + "/" + month1 + "/" + day1;
    temp2 = year2 + "/" + month2 + "/" + day2;

    var dateaa = new Date(temp1);
    var datebb = new Date(temp2);
    var date = datebb.getTime() - dateaa.getTime();
    var time = Math.floor(date / (1000 * 60 * 60 * 24));
    return time;
}


function chartHandel(resData) {
    var xData = [];
    var inCarData = [];
    var outCarData = [];

    $.each(resData, function (index, item) {
        xData.push(item.staticTimeStr);
        inCarData.push(item.vehicleFlow);
        outCarData.push(item.outParkCount);

    })


    //车流量及占用率变化趋势 echarts
    var myChart = echarts.init(document.getElementById('cll-echarts'));
    var option = {
        // color:['#1E95CD','#fedb33','#3fc2a5'],
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                label: {
                    // backgroundColor: 'rgba(0,0,0,0.5)'
                }
            }
        },
        legend: {
            right: '2%',
            top: '0',
            textStyle: {
                color: '#888990',
            },
            itemWidth: 18,
            itemHeight: 10,
            data: ['进场', '出场']
        },

        grid: {
            top: '13%',
            left: '1%',
            right: '2%',
            bottom: '2%',
            containLabel: true
        },
        xAxis: [

            {
                type: 'category',
                axisLabel: {
                    show: true,
                    textStyle: {
                        color: 'rgba(0,0,0,0.5)',
                        fontSize:'12px',
                        fontFamily:'微软雅黑'
                    }
                },

                splitLine:{
                    lineStyle:{
                        color:'rgba(0,0,0,0.1)',
                    }
                },

                axisLine: {
                    show: true,
                    lineStyle: {
                        color: 'rgba(0,0,0,0.1)',
                        // width: 1,//这里是为了突出显示加上的
                    }
                },
                axisTick: {
                    show: false
                },
                data: xData
                // data: [3,3,4,6,6,3]
            },

        ],
        yAxis: [
            {
                type: 'value',
                scale: true,
                axisLabel: {
                    formatter: '{value} %',
                    textStyle: {
                        color: 'rgba(0,0,0,0.5)',
                        fontSize:'12px',
                        fontFamily:'微软雅黑'
                    }
                },
                axisLabel: { //调整y轴的lable
                    textStyle: {
                        color: 'rgba(0,0,0,0.5)',
                    }
                },
                axisTick: {
                    show: false
                },

                axisLine: {
                    lineStyle: {
                        color: 'rgba(0,0,0,0.1)',
                        width: 1,//这里是为了突出显示加上的
                    }
                },
                splitLine:{
                    lineStyle:{
                        // type:'dashed',
                        color:'rgba(0,0,0,0.1)',
                    }
                }
            },
            // {
            //     type: 'value',
            //     scale: true,
            //     axisLabel: { //调整y轴的lable
            //         textStyle: {
            //             color: '#888990',
            //         }
            //     },
            //     axisTick: {
            //         show: false
            //     },
            //
            //     axisLine: {
            //         show: false
            //     },
            // },


        ],
        series: [
            {
                name: '进场',
                type: 'line',

                lineStyle: {
                    normal: {
                        color: '#50c0f5'
                    }
                },
                itemStyle: {
                    normal: {
                        color: '#50c0f5'
                    }
                },
                data: inCarData
                // data: [3,32,2,3,24,33]
            },
            {
                name: '出场',
                type: 'line',

                lineStyle: {
                    normal: {
                        color: '#5fe890'
                    }
                },
                itemStyle: {
                    normal: {
                        color: '#5fe890'
                    }
                },
                data: outCarData
                // data: [3,5,7,8,23,43]
            },


        ]
    };
    myChart.setOption(option);
    //浏览器滚动 echart自适应
    window.onresize = function () {
        myChart.resize();
    };


}

function exportTabel() {

    var req = feefun.feegetQueryParam();
    console.log(req)
    var form = document.createElement("form");
    form.style.display = 'none';

    form.action = dataUrl.util.exportCarFlowForList();
    form.method = "post";
    document.body.appendChild(form);

    var input = document.createElement("input");

    input.name = "plNosStr";
    input.value = JSON.stringify(req.plNos);
    form.appendChild(input);

    var input1 = document.createElement("input");
    input1.name = "startTimeStr";
    input1.value = req.beginTime;
    form.appendChild(input1);

    var input2 = document.createElement("input");
    input2.name = "endTimeStr";
    input2.value = req.endTime;
    form.appendChild(input2);

    var input3 = document.createElement("input");
    input3.name = "timeType";
    input3.value = req.timeType;
    form.appendChild(input3);
    form.submit();

}