let form, layer, laydate;
let user = getUser();
let myChart12 = echarts.init(document.getElementById('echarts-one'));

layui.use(['form', 'layer', 'laydate'], function () {
    layer = layui.layer;
    form = layui.form;
    laydate = layui.laydate;
    // 渲染
    /* laydate.render({
        elem: '#currentDay',
        btns: ['confirm']
    }); */
    laydate.render({
        elem: '#currentDay', //指定元素  元素选择器
        type: 'date', //选择时间类型 可选值:year(年) month(年月)  date(年月日)  time(时分秒)  datetime(年月日时分秒)
        trigger: 'click',
        range: true,
        format: 'yyyy-MM-dd', //时间格式  常用时间格式:yyyy-MM-dd HH:mm:ss
        max: Date.parse(new Date()),
        btns: ['now', 'confirm'], //选择框右下角显示的按钮 清除-现在-确定
    });
    // $('#currentDay').val(getNowTime());
    const currentDate = new Date();
    const thirtyDaysAgo = new Date();
    thirtyDaysAgo.setDate(currentDate.getDate() - 30);

    console.log('当前日期:', formatDate(currentDate));
    console.log('30天前日期:', formatDate(thirtyDaysAgo));
    $('#currentDay').val(formatDate(thirtyDaysAgo) + " - " + formatDate(currentDate));
    form.render();
    statisticalChart();
});

// 查询
function query() {
    const startTime = $("#currentDay").val().split(' - ')[0],
        endTime = $("#currentDay").val().split(' - ')[1];
    let flag = isOver31Days(startTime, endTime);
    if (flag) {
        return layer.msg('查询的时间间隔不能超过30天', {icon: 2, time: 2000});
    }
    myChart12.dispose();
    myChart12 = echarts.init(document.getElementById('echarts-one'));
    statisticalChart();
}

function isOver31Days(dateStr1, dateStr2) {
    // 将字符串日期转换为Date对象
    const date1 = new Date(dateStr1);
    const date2 = new Date(dateStr2);

    // 计算两个日期的时间差（毫秒）
    const timeDiff = Math.abs(date2.getTime() - date1.getTime());

    // 将毫秒转换为天数（1天 = 24 * 60 * 60 * 1000毫秒）
    const dayDiff = timeDiff / (1000 * 60 * 60 * 24);

    // 判断是否超过31天
    return dayDiff > 30;
}

// 领导动态
function statisticalChart() {
    let param = {
        currentDay:$('#currentDay').val(),
    };
    $.ajax({
        headers: {
            "encrypt": sm3(JSON.stringify(param))
        },
        url: dataUrl + 'proteam/pot/cityDailyDutyReport/getLeaderDynamicByEcharts?token=' + token,
        data: param,
        type: 'POST',
        async: true,
        success: function (result) {
            if (result.code === 200) {
                initEchartsOne(result.data);
            } else if (result.code === 401) {
                logout(1)
            }
        }, error: function () {
        }
    });
}

/*按违章等级统计-echarts*/
function initEchartsOne(data) {
    console.error(data);
    let nameList = data.nameList,valueList = data.valueList;
    let fontSize = '12', fontFamily = 'Alibaba PuHuiTi R',fontColor = '#000';
    let option = {
        backgroundColor: 'transparent',
        tooltip: {
            show: true,
            trigger: 'axis',
            axisPointer: {
                type: 'shadow'
            },
            // backgroundColor: 'rgba(0, 0, 0, 0.63)', //设置背景颜色
            textStyle: {
                color: fontColor,
                fontFamily: fontFamily
            },
            // borderColor: "rgba(255,255,255, .5)",
        },
        legend: {
            icon: 'circle',
            data: ['领导动态数量'],
            right: 20,
            textStyle: {
                color: fontColor,
                fontSize: fontSize,
                fontFamily: fontFamily
            },
            itemWidth: 15,
            itemHeight: 15,
            itemGap: 35
        },
        grid: {
            left: '0%',
            right: '0%',
            bottom: '3%',
            containLabel: true
        },
        xAxis: [{
            type: 'category',
            data: nameList,
            axisLine: {
                show: true,
                lineStyle: {
                    color: "#063374",
                    width: 1,
                    type: "solid"
                }
            },
            axisTick: {
                show: false,
            },
            axisLabel: {
                show: true,
                interval: 0, // 强制显示所有标签
                textStyle: {
                    color: fontColor,
                    fontFamily: fontFamily,
                    fontSize: fontSize
                },
                // 核心换行配置
                formatter: function(params) {
                    // 自定义换行逻辑：超过5个字符换行（可根据需求调整）
                    const maxLength = 8;
                    if (params.length > maxLength) {
                        return params.substring(0, maxLength) + '\n' + params.substring(maxLength);
                    }
                    return params;
                },
                // 文本样式与宽度相关设置
                textStyle: {
                    color: fontColor,
                    fontFamily: fontFamily,
                    fontSize: fontSize,
                    // 允许文本换行
                    whiteSpace: 'normal',
                    // 文本容器宽度（控制每行显示长度）
                    width: 100
                },
                // 标签间距与对齐方式
                margin: 15, // 标签与轴的间距
                align: 'center'
            },
        }],
        yAxis: [{
            type: 'value',
            axisTick: {
                show: false,
            },
            axisLine: {
                show: false,
                lineStyle: {
                    color: fontColor,
                    width: 1,
                    type: "solid",
                },
            },
            splitLine: {
                lineStyle: {
                    color: '#063374',
                    type: 'dashed'
                }
            }
        }],
        series: [{
            name: '领导动态数量',
            type: 'bar',
            data: valueList,
            barWidth: 10, //柱子宽度
            barGap: 0.5, //柱子之间间距
            itemStyle: {
                normal: {
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                        offset: 0,
                        color: '#FF5D5D'
                    }, {
                        offset: 1,
                        color: '#FF5D5D'
                    }]),
                    opacity: 1,
                }
            },
            label: {
                normal: {
                    show: true,
                    position: 'top',
                    formatter: '{c}',
                    textStyle: {
                        color: fontColor,
                        fontSize: '14px',
                        fontFamily: fontFamily
                    }
                }
            },
        }]
    };
    myChart12.setOption(option, true);
    window.addEventListener("resize", function () {
        myChart12.resize();
    });
}

function formatDate(date) {
    const year = date.getFullYear();
    const month = String(date.getMonth() + 1).padStart(2, '0');
    const day = String(date.getDate()).padStart(2, '0');
    return `${year}-${month}-${day}`;
}