$("#Chart_ChangeTime").hide();

let Chart_ChangeTime = Cookies.get('Chart_ChangeTime') || 1;
$("#Chart_ChangeTime").val(Chart_ChangeTime);


// 点击收起之后 选择的时间 是否改变   选择的时间改变 =》 图也要改变
// 相对指定图是否改变
let showchangelist = [false, false, false, false, false, false, false];

// 通讯包数统计
let chart = null;
// 通讯字节流量统计收起

let chart1 = null;
// 端口数据使用情况

let chart2 = null;

// 处理耗时

let chart3 = null;
// 接收延迟
let chart4 = null;
// TX命令饼图
let chart5 = null;
// rX命令饼图
let chart6 = null;
// tX重发饼图
let chart7 = null;
// rX重发饼图

let chart8 = null;



// 时间 起始 结束
let startDate, endDate;
//TX RX复选框默认值
let defauust = { RX: [1, 2, 3, 4], TX: [1, 2, 3, 4] };
//TX RX复选框当前选择值
let checkeddata = { RX: [1, 2, 3, 4], TX: [1, 2, 3, 4] };
//TX RX复选框事件
function checkbox_change(type_name, val) {
    var event = window.e || window.event;
    let checked = $(event.target).prop("checked");
    if (val == 0) {
        //全选/取消全选
        $("." + type_name).prop("checked", checked);
        checkeddata[type_name] = checked ? defauust[type_name] : [];
    }
    else {
        if (checked == true) {
            checkeddata[type_name].push(Number.parseInt(val));
            if ($("." + type_name + ":checked").length == $("." + type_name).length - 1 && !$("." + type_name).eq(0).prop("checked")) {
                $("." + type_name).eq(0).prop("checked", true);
            }
            return;
        }
        $("." + type_name).eq(0).prop("checked", false);
        // 过滤 
        checkeddata[type_name] = checkeddata[type_name].filter((x) => {
            return x != Number.parseInt(val);
        });
    }
}

//渲染全部  或者渲染指定绘图 前提是元素没有隐藏 
function search_result(index = -1) {
    console.log("index"+index);
    let data = { RX: checkeddata.RX, TX: checkeddata.TX, startDate, endDate };

    let newdata = JSON.parse(JSON.stringify(data));
    if (endDate == null) {
        let new_Chart_ChangeTime = Number.parseInt($("#Chart_ChangeTime").val());
        if (new_Chart_ChangeTime != Chart_ChangeTime) {
            Chart_ChangeTime = new_Chart_ChangeTime;

            Cookies.set('Chart_ChangeTime', Chart_ChangeTime, { expires: 7, path: window.location.pathname });
        }
        newdata.startDate = moment().subtract(Chart_ChangeTime, 'minute').format('YYYY-MM-DD HH:mm:ss');
        newdata.endDate = moment().format('YYYY-MM-DD HH:mm:ss');
    }
    Cookies.set('UDPINFO_GetCHARTS', data, { expires: 7, path: window.location.pathname });

    if (!$('#lineChart').is(':hidden') && (index == -1 || index == 0)) {
        MyPost("/API/GetCHARTS", { data, isSwal: endDate != null }, (RES) => {
            barChartdatashow(chart, RES, 'lineChart');
        });
    }
    if (!$('#barChart').is(':hidden') && (index == -1 || index == 1)) {
        MyPost("/API/GetErrorSucess", { data, isSwal: endDate != null }, (RES) => {
            barChartdatashow(chart1,RES,'barChart');
        }
        );
    }
    if (!$('#Chart2').is(':hidden') && (index == -1 || index == 2)) {
        

        MyPost("/API/GetProt", { data: newdata, isSwal: endDate != null }, (RES) => {
            barChartdatashow(chart2, RES,"Chart2");
        }
        );
    }
    if (!$('#Chart3').is(':hidden') && (index == -1 || index == 3)) {
        MyPost("/API/GetPROCESSINGTIME", { data, isSwal: endDate != null }, (RES) => {
            barChartdatashow(chart3, RES, 'Chart3');
        }
        );
    }

    if (!$('#Chart4').is(':hidden') && (index == -1 || index == 4)) {
        MyPost("/API/GetRevDelayDateTime", { data, isSwal: endDate != null }, (RES) => {
            barChartdatashow(chart4, RES, 'Chart4');
        }
        );
    }

    if (!$('#Chart5').is(':hidden') && (index == -1 || index == 5)) {
        newdata.type = "TX";
        MyPost("/API/GetCMDpie", { data:newdata, isSwal: endDate != null }, (RES) => {
            barChartdatashow(chart5, RES, 'Chart5');
        }
        );
        newdata.type = "RX";
        MyPost("/API/GetCMDpie", { data: newdata, isSwal: endDate != null }, (RES) => {
            barChartdatashow(chart6, RES, 'Chart6');
        }
        );
    }
    if (!$('#Chart7').is(':hidden') && (index == -1 || index == 5)) {
        newdata.type = "TX";
        MyPost("/API/GetRETRY_COUNT", { data: newdata, isSwal: endDate != null }, (RES) => {
            barChartdatashow(chart7, RES, 'Chart7');
        }
        );
        newdata.type = "RX";
        MyPost("/API/GetRETRY_COUNT", { data: newdata, isSwal: endDate != null }, (RES) => {
            barChartdatashow(chart8, RES, 'Chart8');
        }
        );
    }
}




$(function () {

    // 写入历史 历史只是隐藏的值
    let btnshow_item = Cookies.get('btnshow_item') || null;
    btnshow_item = btnshow_item == null ? [] : JSON.parse(btnshow_item);

    btnshow_item.forEach((item, index) => {
        $(".btnshow").eq(item.index).click();
     })

    let data = Cookies.get('UDPINFO_GetCHARTS') || null;
    let UDPINFO_ChangeTime = Cookies.get('UDPINFO_ChangeTime') || 1
    UDPINFO_ChangeTime = Number.parseInt(UDPINFO_ChangeTime);
    // 默认当天
    $("#UDPINFO_ChangeTime").val(UDPINFO_ChangeTime);
    data = data != null ? JSON.parse(Cookies.get('UDPINFO_GetCHARTS')) : [];
    checkeddata.RX = data["RX"] || defauust["RX"];
    checkeddata.TX = data["TX"] || defauust["TX"];
    //// 如果TX 不等于 .TX 长度减去1 那么久取消全选
    if ($(".TX").length != (checkeddata.TX.length + 1)) {
        $(".TX").prop("checked", false);
        for (var i of checkeddata.TX) {
            $(".TX").eq(i).prop("checked", true);
        }
    }
    //// 如果RX 不等于 .RX 长度减去1 那么久取消全选
    if ($(".RX").length != (checkeddata.RX.length + 1)) {
        $(".RX").prop("checked", false);
        for (var i of checkeddata.RX) {
            $(".RX").eq(i).prop("checked", true);
        }
    }

    // 时间选择  默认值
    startDate = data["startDate"] || moment().startOf("days").format('YYYY-MM-DD HH:mm:ss');
    endDate = data["endDate"] || moment().format('YYYY-MM-DD HH:mm:ss');
 
   
    // 带有时间选择的日期范围选择器
    $('#reservationtime').daterangepicker({
        startDate: startDate,
        endDate: endDate,
        timePicker: true,
        maxDate: new Date(),
        minDate: "2022-3-25 00:00:00",
        timePicker24Hour: true,
        timePickerSeconds: true,
        locale: {
            cancelLabel: 'Clear',
            format: 'YYYY-MM-DD HH:mm:SS'
        }
    }).on('apply.daterangepicker', function (ev, picker) {
        startDate = picker.startDate.format('YYYY-MM-DD HH:mm:ss');
        endDate = picker.endDate.format('YYYY-MM-DD HH:mm:ss');
        $('#UDPINFO_ChangeTime').val(8);
        ChangeTime()
    }).on('cancel.daterangepicker', function (ev, picker) {
        $('UDPINFO_ChangeTime').val(8);
        $(this).val('');
        startDate = null;
        endDate = null;
        ChangeTime()
    });
    // 更改时间  触发 加载
    ChangeTime();
});


//显示数据 
function barChartdatashow(chartinfo, RES, element) {
    try {
    // 取消正刷新标识
        is_NOW_SX--;
        console.log(element +"--"+is_NOW_SX)
        if (chartinfo != null ) {
            chartinfo.dispose();
        }
        chartinfo = echarts.init(document.getElementById(element));
    if (RES == null) {
        return;
    }
        chartinfo.setOption(RES);
    } catch (e) {
        console.log(e)
    }
}
// 实时数据的刷新器
let NOW_SX = null;

// 是否正在刷新
let is_NOW_SX = 0;


/// 时间选择
function ChangeTime() {
    let sel = Number.parseInt($("#UDPINFO_ChangeTime").val().replace(/\s*/g, ""));
    try {
        switch (sel) {
            case 1:
                startDate = moment().startOf("days").format('YYYY-MM-DD HH:mm:ss');
                endDate = moment().format('YYYY-MM-DD HH:mm:ss');
                break;
            case 2:
                startDate = moment().subtract(1, 'days').startOf("days").format('YYYY-MM-DD HH:mm:ss');
                endDate = moment().subtract(1, 'days').endOf("days").format('YYYY-MM-DD HH:mm:ss');
                break;
            case 3:
                startDate = moment().subtract(6, 'days').format('YYYY-MM-DD HH:mm:ss');
                endDate = moment().format('YYYY-MM-DD HH:mm:ss');
                break;
            case 4:
                startDate = moment().subtract(29, 'days').format('YYYY-MM-DD HH:mm:ss');
                endDate = moment().format('YYYY-MM-DD HH:mm:ss');
                break;
            case 5:
                startDate = moment().startOf('month').format('YYYY-MM-DD HH:mm:ss');
                endDate = moment().format('YYYY-MM-DD HH:mm:ss');
                break;
            case 6:
                startDate = moment().subtract(1, 'month').startOf('month').format('YYYY-MM-DD HH:mm:ss');
                endDate = moment().subtract(1, 'month').endOf('month').format('YYYY-MM-DD HH:mm:ss');
                break;
            case 7:
                startDate = moment().format('YYYY-MM-DD HH:mm:ss');
                endDate = null;
                break;
        }
    } catch (e) {
        console.log(e)
    }
   
    Cookies.set('UDPINFO_ChangeTime', sel, { expires: 7, path: window.location.pathname });


    $('#reservationtime').val(startDate + ' - ' + (endDate == null ? "" : endDate));

    //时间选择改变所有的度改变
    showchangelist = [true, true, true, true, true, true, true];

    if (endDate == null) {
        //显示 选择分钟事件
        $("#Chart_ChangeTime").show();

        // 第一次显示读取缓存
        if (Chart_ChangeTime == -1) {
            Chart_ChangeTime = Cookies.get('Chart_ChangeTime') || 1;
            Chart_ChangeTime = Number.parseInt(Chart_ChangeTime);
            $("#Chart_ChangeTime").val(Chart_ChangeTime);
        }

        if (NOW_SX != null) {
            clearInterval(NOW_SX);
            NOW_SX = null;
            is_NOW_SX = 0;
        }

        ////  定时器

        NOW_SX = setInterval(function () {
            if (endDate != null) {
                if (NOW_SX != null) {
                    clearInterval(NOW_SX);
                    NOW_SX = null;
                    is_NOW_SX = 0;
                }
                return;
            }
            if (is_NOW_SX <= 0) {
                // 没有隐藏的画布执行刷新  刷新成功后 is_NOW_SX -- 
                // is_NOW_SX == 0 表示所有画布没有隐藏度已经刷新
                let lengthnum = 0;

                var difftime = (new Date() - new Date(startDate)) / 1000; //计算时间差,并把毫秒转换成秒

                console.log("实时的ms" + difftime);

                if (difftime > 60 * 5) {
                    ChangeTime();
                }
                for (let tump of $('.Chart')) {
                    if (!$(tump).is(':hidden')) {
                        lengthnum++;
                    }
                }
                console.log(lengthnum)
                is_NOW_SX = lengthnum;
                search_result();
            } else {
                console.log("等待之前的未加载：" + is_NOW_SX)
            }
        }, 5000);
    }
    else {
        clearInterval(NOW_SX);
        $("#Chart_ChangeTime").hide();
    }
    search_result();
    return;
}


// 显示隐藏 面板
function btnshow(that, index) { 
    
    let btntext = $(that).find("button").eq(0).text();
    let isshow = btntext.indexOf("收起") >= 0; //TRUE 标识 隐藏  
    $(that).find("button").eq(0).text(isshow ? btntext.replace("收起", "展开") : btntext.replace("展开", "收起"));
    $(that).next().toggle();
    // 重新显示并且 之前选择的时间范围数值已经改变
    if (!isshow && showchangelist[index]) {
        search_result(index);
    }

    showchangelist[index] = false;

    // 写入历史 历史只是隐藏的值
    let btnshow_item = Cookies.get('btnshow_item') || null;
    btnshow_item = btnshow_item == null ? [] : JSON.parse(btnshow_item);
    if (!isshow) {
        //移除原有的 隐藏的值
        btnshow_item = btnshow_item.filter(x => {
            return x.index != index;
        })
    } else {
        let onok = true;
        btnshow_item.filter(x => {
            if (x.index == index) {
                onok = false;
            }
            return true;
        })
        //添加 隐藏的值
        if (onok) {
            btnshow_item.push({ index });
        }
    }
    // 写入缓存
    Cookies.set('btnshow_item', btnshow_item, { expires: 7, path: window.location.pathname });

    Cookies.set('Chart_ChangeTime', Chart_ChangeTime, { expires: 7, path: window.location.pathname });

}
// 重启服务等操作
function Changerserver(type)
{
    $(".serverbtn").addClass('disabled');
    MyPost("/API/Changerserver", { data: { type }, isSwal: false }, (RES) => {
        toastr.success('操作成功~')
    }, () => {
        toastr.error('操作失败~')
    });
}


// 检测服务是否有效
function udpinfo_RUCSSTATUS(x) {
    // tcp 是否能连接 x[0]  0 未  1 ok 
    //   服务状态  x[1]  0 不存在  1 ok  2 未运行
    $("#serverstatus").removeClass("bg-red");
    $("#serverstatus").removeClass("bg-green");
    $("#serverstatus").removeClass("bg-yellow");
    $("#serverstatus").addClass( x[1] == 0 ? "bg-yellow" : (x[1] == 1 ? "bg-green" : "bg-red"));
    $(".serverbtn").removeClass('disabled');
    switch (x[1]) {
        case 0:
            $(".serverbtn").addClass('disabled');
            break;
        case 1:
            $(".serverbtn").eq(0).addClass('disabled');
            break;
        case 2:
            $(".serverbtn").eq(1).addClass('disabled');
            break;
    }
    //tcpstatus
    $("#tcpstatus").removeClass("bg-red");
    $("#tcpstatus").removeClass("bg-green"); 
    $("#tcpstatus").addClass(x[0] != 0 ? "bg-green" : "bg-red");

}

RUCSSTATUS_BACK.push(udpinfo_RUCSSTATUS);

// 第一次主动读取 其余推送 udpinfo_RUCSSTATUS 方法
udpinfo_RUCSSTATUS(RUCSSTATUS_Val);