hb_zhgd_screen/js/pages/dataAnalysisOctober/engineeringSafetyAnalysis.js

let table, layer, form, laydate;
let temperatureHumidityChart = null;
let windSpeedChart = null;
let airQualityChart = null;
let currentPage = 1;
let pageSize = 10;
let bidCode = parent.parent.$('#bidPro').val();
let keyword = ''; // 监测点关键字

// 获取当天日期
function getTodayDate() {
    const now = new Date();
    const year = now.getFullYear();
    const month = String(now.getMonth() + 1).padStart(2, '0');
    const day = String(now.getDate()).padStart(2, '0');
    return year + '-' + month + '-' + day;
}

// 获取当月第一天和最后一天（保留用于其他功能）
function getCurrentMonthRange() {
    const now = new Date();
    const year = now.getFullYear();
    const month = now.getMonth();

    // 当月第一天
    const firstDay = new Date(year, month, 1);
    const startDate = year + '-' + String(month + 1).padStart(2, '0') + '-' + String(firstDay.getDate()).padStart(2, '0');

    // 当月最后一天
    const lastDay = new Date(year, month + 1, 0);
    const endDate = year + '-' + String(month + 1).padStart(2, '0') + '-' + String(lastDay.getDate()).padStart(2, '0');

    return { startDate, endDate };
}

const today = getTodayDate();
let queryParams = {
    projectId: bidCode,
    startTestDay: today,
    endTestDay: today,
}

layui.use(["layer", "table", "form", "laydate"], function () {
    layer = layui.layer;
    table = layui.table;
    form = layui.form;
    laydate = layui.laydate;

    // 响应成功后的拦截器
    $.ajaxSetup({
        beforeSend: function (xhr, options) {
            var originalSuccess = options.success;
            options.success = function (data, textStatus, jqXhr) {
                data = modifyResponseData(data);
                originalSuccess.apply(this, arguments);
            };
        },
    });

    // 初始化页面
    initPage();

    // 初始化日期范围选择器
    initDateRangePicker();
});

// 初始化页面
function initPage() {
    initTemperatureHumidityChart();
    initWindSpeedChart();
    initAirQualityChart();
    initEnvironmentRecordTable();

    // 页面初始化时，按默认当天日期加载一次接口数据
    refreshAllModules();
}


// 初始化日期范围选择器（逻辑与工程质量分析模块保持一致）
function initDateRangePicker() {
    // 设置初始显示值为当天范围
    const initialValue = queryParams.startTestDay + ' ~ ' + queryParams.endTestDay;
    $('#dateRange').val(initialValue);

    // 使用范围选择器，单个输入框显示日期范围
    laydate.render({
        elem: '#dateRange',
        type: 'date',
        range: true, // 启用范围选择
        format: 'yyyy-MM-dd',
        theme: 'dark',
        // 默认值使用当天范围
        value: queryParams.startTestDay + ' - ' + queryParams.endTestDay,
        done: function (value, date, endDate) {
            // 重置为当天日期的函数
            const resetToToday = function () {
                const today = getTodayDate();
                queryParams.startTestDay = today;
                queryParams.endTestDay = today;
                $('#dateRange').val(today + ' ~ ' + today);
                refreshAllModules();
            };

            if (value && value.trim() !== '') {
                const dates = value.split(' - ');
                if (dates.length === 2) {
                    const startDate = dates[0].trim();
                    const endDateStr = dates[1].trim();

                    // 在单个输入框中显示日期范围（格式：2026-01-15 ~ 2026-01-15）
                    $('#dateRange').val(startDate + ' ~ ' + endDateStr);

                    // 更新查询参数
                    queryParams.startTestDay = startDate;
                    queryParams.endTestDay = endDateStr;

                    // 日期变化后，重新调用所有模块接口
                    refreshAllModules();
                } else {
                    // 如果格式不正确，重置为当天日期
                    resetToToday();
                }
            } else {
                // 清空时，重置为当天日期
                resetToToday();
            }
        }
    });
}

// 刷新所有模块数据
function refreshAllModules() {
    // 重新调用接口获取数据
    getTemperatureHumidityData();
    getQualityDetectionRecord();

    // 重新加载表格
    if (table) {
        table.reload('environmentRecordTable', {
            where: {
                projectId: bidCode,
                startTestDay: queryParams.startTestDay,
                endTestDay: queryParams.endTestDay,
                monitoringPointName: keyword || ''
            },
            page: {
                curr: 1
            }
        });
    }
}

// 查询数据（统一刷新所有模块）
function queryData() {
    refreshAllModules();
}

// 初始化温湿度图表（柱状图+折线图，双Y轴）
function initTemperatureHumidityChart() {
    const chartDom = document.getElementById('temperatureHumidityChart');
    if (!chartDom) return;

    if (temperatureHumidityChart) {
        temperatureHumidityChart.dispose();
    }

    temperatureHumidityChart = echarts.init(chartDom);

    // 模拟数据 - 后续替换为真实接口数据
    const times = ['8:00', '9:00', '10:00', '11:00', '12:00', '13:00', '14:00'];
    const temperatures = [25, 28, 30, 32, 30, 28, 26]; // 温度（°C）
    const humidities = [60, 65, 70, 75, 72, 68, 65]; // 湿度（%）

    const option = {
        backgroundColor: 'transparent',
        tooltip: {
            trigger: 'axis',
            backgroundColor: 'rgba(13, 34, 37, 0.95)',
            borderColor: 'rgba(6, 189, 221, 0.8)',
            borderWidth: 1,
            borderRadius: 4,
            padding: [12, 16],
            textStyle: {
                color: '#FFFFFF',
                fontSize: 12
            }
        },
        legend: {
            data: ['温度', '湿度'],
            top: '5%',
            right: '5%',
            textStyle: {
                color: '#FFFFFF',
                fontSize: 12
            },
            itemWidth: 12,
            itemHeight: 12,
            icon: 'rect'
        },
        grid: {
            left: '10%',
            right: '10%',
            bottom: '15%',
            top: '20%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            data: times,
            axisLabel: {
                color: '#FFFFFF',
                fontSize: 12
            },
            axisLine: {
                lineStyle: {
                    color: 'rgba(255, 255, 255, 0.3)',
                    width: 1
                }
            },
            axisTick: {
                show: false
            }
        },
        yAxis: [
            {
                type: 'value',
                name: '°C',
                nameTextStyle: {
                    color: '#FFFFFF',
                    fontSize: 12
                },
                axisLabel: {
                    color: '#FFFFFF',
                    fontSize: 12
                },
                axisLine: {
                    lineStyle: {
                        color: 'rgba(255, 255, 255, 0.3)',
                        width: 1
                    }
                },
                splitLine: {
                    lineStyle: {
                        color: 'rgba(255, 255, 255, 0.15)',
                        type: 'dashed',
                        width: 1
                    }
                }
            },
            {
                type: 'value',
                name: '%',
                nameTextStyle: {
                    color: '#FFFFFF',
                    fontSize: 12
                },
                axisLabel: {
                    color: '#FFFFFF',
                    fontSize: 12
                },
                axisLine: {
                    lineStyle: {
                        color: 'rgba(255, 255, 255, 0.3)',
                        width: 1
                    }
                },
                splitLine: {
                    show: false
                }
            }
        ],
        series: [
            {
                name: '温度',
                type: 'bar',
                yAxisIndex: 0,
                data: temperatures,
                barWidth: '40%',
                itemStyle: {
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                        offset: 0,
                        color: '#4A90E2'
                    }, {
                        offset: 1,
                        color: '#2E5C8A'
                    }]),
                    borderRadius: [2, 2, 0, 0]
                },
                label: {
                    show: false
                }
            },
            {
                name: '湿度',
                type: 'line',
                yAxisIndex: 1,
                data: humidities,
                itemStyle: {
                    color: '#50E3C2'
                },
                lineStyle: {
                    width: 2,
                    color: '#50E3C2'
                },
                symbol: 'circle',
                symbolSize: 6,
                label: {
                    show: false
                }
            }
        ]
    };

    temperatureHumidityChart.setOption(option);

    // 响应式调整
    window.addEventListener('resize', function () {
        if (temperatureHumidityChart) {
            temperatureHumidityChart.resize();
        }
    });
}

// 初始化风速图表（折线图）
function initWindSpeedChart() {
    const chartDom = document.getElementById('windSpeedChart');
    if (!chartDom) return;

    if (windSpeedChart) {
        windSpeedChart.dispose();
    }

    windSpeedChart = echarts.init(chartDom);

    // 模拟数据 - 后续替换为真实接口数据
    const times = ['8:00', '9:00', '10:00', '11:00', '12:00', '13:00', '14:00'];
    const windSpeeds = [5.2, 6.1, 5.8, 4.5, 5.0, 6.2, 5.5]; // 风速（m/s）

    const option = {
        backgroundColor: 'transparent',
        tooltip: {
            trigger: 'axis',
            backgroundColor: 'rgba(13, 34, 37, 0.95)',
            borderColor: 'rgba(6, 189, 221, 0.8)',
            borderWidth: 1,
            borderRadius: 4,
            padding: [12, 16],
            textStyle: {
                color: '#FFFFFF',
                fontSize: 12
            }
        },
        legend: {
            data: ['风速'],
            top: '5%',
            right: '5%',
            textStyle: {
                color: '#FFFFFF',
                fontSize: 12
            },
            itemWidth: 12,
            itemHeight: 12,
            icon: 'rect'
        },
        grid: {
            left: '10%',
            right: '10%',
            bottom: '15%',
            top: '20%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            data: times,
            axisLabel: {
                color: '#FFFFFF',
                fontSize: 12
            },
            axisLine: {
                lineStyle: {
                    color: 'rgba(255, 255, 255, 0.3)',
                    width: 1
                }
            },
            axisTick: {
                show: false
            }
        },
        yAxis: {
            type: 'value',
            name: 'm/s',
            nameTextStyle: {
                color: '#FFFFFF',
                fontSize: 12
            },
            axisLabel: {
                color: '#FFFFFF',
                fontSize: 12
            },
            axisLine: {
                lineStyle: {
                    color: 'rgba(255, 255, 255, 0.3)',
                    width: 1
                }
            },
            splitLine: {
                lineStyle: {
                    color: 'rgba(255, 255, 255, 0.15)',
                    type: 'dashed',
                    width: 1
                }
            }
        },
        series: [
            {
                name: '风速',
                type: 'line',
                data: windSpeeds,
                itemStyle: {
                    color: '#50E3C2'
                },
                lineStyle: {
                    width: 2,
                    color: '#50E3C2'
                },
                symbol: 'circle',
                symbolSize: 6,
                areaStyle: {
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                        offset: 0,
                        color: 'rgba(80, 227, 194, 0.3)'
                    }, {
                        offset: 1,
                        color: 'rgba(80, 227, 194, 0.05)'
                    }])
                },
                label: {
                    show: false
                }
            }
        ]
    };

    windSpeedChart.setOption(option);

    // 响应式调整
    window.addEventListener('resize', function () {
        if (windSpeedChart) {
            windSpeedChart.resize();
        }
    });
}

// 初始化空气质量图表（单折线图，只显示PM2.5）
function initAirQualityChart() {
    const chartDom = document.getElementById('airQualityChart');
    if (!chartDom) return;

    if (airQualityChart) {
        airQualityChart.dispose();
    }

    airQualityChart = echarts.init(chartDom);

    // 默认空数据
    const times = [];
    const pm25 = [];

    const option = {
        backgroundColor: 'transparent',
        tooltip: {
            trigger: 'axis',
            backgroundColor: 'rgba(13, 34, 37, 0.95)',
            borderColor: 'rgba(6, 189, 221, 0.8)',
            borderWidth: 1,
            borderRadius: 4,
            padding: [12, 16],
            textStyle: {
                color: '#FFFFFF',
                fontSize: 12
            }
        },
        legend: {
            data: ['PM2.5'],
            top: '5%',
            right: '5%',
            textStyle: {
                color: '#FFFFFF',
                fontSize: 12
            },
            itemWidth: 12,
            itemHeight: 12,
            icon: 'rect'
        },
        grid: {
            left: '10%',
            right: '10%',
            bottom: '15%',
            top: '20%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            data: times,
            axisLabel: {
                color: '#FFFFFF',
                fontSize: 12
            },
            axisLine: {
                lineStyle: {
                    color: 'rgba(255, 255, 255, 0.3)',
                    width: 1
                }
            },
            axisTick: {
                show: false
            }
        },
        yAxis: {
            type: 'value',
            name: 'µg/m³',
            nameTextStyle: {
                color: '#FFFFFF',
                fontSize: 12
            },
            axisLabel: {
                color: '#FFFFFF',
                fontSize: 12
            },
            axisLine: {
                lineStyle: {
                    color: 'rgba(255, 255, 255, 0.3)',
                    width: 1
                }
            },
            splitLine: {
                lineStyle: {
                    color: 'rgba(255, 255, 255, 0.15)',
                    type: 'dashed',
                    width: 1
                }
            }
        },
        series: [
            {
                name: 'PM2.5',
                type: 'line',
                data: pm25,
                itemStyle: {
                    color: '#87CEEB'
                },
                lineStyle: {
                    width: 2,
                    color: '#87CEEB'
                },
                symbol: 'circle',
                symbolSize: 6,
                areaStyle: {
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                        offset: 0,
                        color: 'rgba(135, 206, 235, 0.3)'
                    }, {
                        offset: 1,
                        color: 'rgba(135, 206, 235, 0.05)'
                    }])
                },
                label: {
                    show: false
                }
            }
        ]
    };

    airQualityChart.setOption(option);

    // 响应式调整
    window.addEventListener('resize', function () {
        if (airQualityChart) {
            airQualityChart.resize();
        }
    });
}


// 初始化环境监测记录表格
function initEnvironmentRecordTable() {
    table.render({
        elem: '#environmentRecordTable',
        url: commonUrl + 'screen/project/projectSafety/list',
        headers: {
            decrypt: 'decrypt',
            Authorization: token
        },
        method: 'GET',
        where: {
            projectId: bidCode,
            startTestDay: queryParams.startTestDay,
            endTestDay: queryParams.endTestDay,
            monitoringPointName: keyword || ''
        },
        skin: 'line',
        page: {
            layout: ['prev', 'page', 'next', 'count', 'skip'],
            groups: 5,
            limit: pageSize,
            limits: [10, 20, 30, 50]
        },
        height: 'full',
        request: {
            pageName: 'pageNum',
            limitName: 'pageSize'
        },
        response: {
            statusName: 'code',
            statusCode: 200,
            msgName: 'msg',
            countName: 'total',
            dataName: 'rows'
        },
        cols: [[
            { type: 'numbers', title: '序号', width: '8%', align: 'center' },
            { field: 'proName', title: '工程名称', width: '15%', align: 'center' },
            { field: 'planNum', title: '作业计划编号', width: '10%', align: 'center' },
            { field: 'workLocation', title: '作业地点', width: '10%', align: 'center' },
            { field: 'monitorCode', title: '监测点编号', width: '10%', align: 'center' },
            { field: 'monitorName', title: '监测点名称', width: '15%', align: 'center' },
            { field: 'detectionTime', title: '监测时间', width: '12%', align: 'center' },
            { field: 'wd', title: '温度', width: '6%', align: 'center' },
            { field: 'sd', title: '湿度', width: '6%', align: 'center' },
            { field: 'speed', title: '风速', width: '6%', align: 'center' },
            { field: 'airQuality', title: '空气质量', width: '6%', align: 'center' },
            {
                title: '视频查看', width: '6%', align: 'center', templet: function (d) {
                    return '<a href="javascript:void(0)" style="color: #00FFB8;" onclick="viewVideo()">查看</a>';
                }
            },
            { field: 'analysis', title: '分析改进', width: '6%', align: 'center' },
            // {
            //     title: '分析改进', width: '8%', align: 'center', templet: function (d) {
            //         return '<a href="javascript:void(0)" style="color: #00FFB8;" onclick="analyzeImprove(\'' + (d.monitoringPointNumber || '') + '\')">分析与改进</a>';
            //     }
            // }
        ]]
    });
}

// 查询记录（监测点输入框查询）
function queryRecords() {
    keyword = $('#keywordInput').val() || '';

    // 重新加载表格
    table.reload('environmentRecordTable', {
        where: {
            projectId: bidCode,
            startTestDay: queryParams.startTestDay,
            endTestDay: queryParams.endTestDay,
            monitorName: keyword
        },
        page: {
            curr: 1
        }
    });
}

// 查看视频
function viewVideo() {
    // 清空视频源（占位）
    const videoPlayer = document.getElementById('videoPlayer');
    if (videoPlayer) {
        videoPlayer.src = '';
    }

    // 显示弹框
    $('#videoModal').addClass('show');
}

// 关闭视频查看弹框
function closeVideoModal() {
    const videoPlayer = document.getElementById('videoPlayer');
    if (videoPlayer) {
        // 暂停视频并清空源
        videoPlayer.pause();
        videoPlayer.src = '';
    }

    // 隐藏弹框
    $('#videoModal').removeClass('show');
}

// 分析与改进
function analyzeImprove(monitoringPointNumber) {
    layer.msg('分析与改进: ' + monitoringPointNumber, { icon: 1 });
    // 后续实现分析改进功能
}

// 从detectionTime字段提取时:分格式
function extractTime(detectionTime) {
    if (!detectionTime) return '';

    // 如果包含时间部分（格式：2026-01-24 07:08:00）
    if (detectionTime.includes(' ')) {
        const timePart = detectionTime.split(' ')[1];
        if (timePart) {
            // 提取时:分（前5个字符，例如 "07:08"）
            return timePart.substring(0, 5);
        }
    }

    // 如果只有日期，返回空字符串或默认值
    return '';
}

// 获取温湿度 风速 空气质量 3个图表数据（只调用一次接口，渲染3个图表）
function getTemperatureHumidityData() {
    const url = commonUrl +
        'screen/project/projectSafety/hjlist?projectId=' + bidCode +
        '&startTestDay=' + queryParams.startTestDay +
        '&endTestDay=' + queryParams.endTestDay;

    ajaxRequestGet(
        url,
        'GET',
        true,
        function () { },
        function (result) {
            console.log(result, '温湿度/风速/空气质量 3个图表数据');

            if (result && result.rows && Array.isArray(result.rows)) {
                const data = result.rows;

                // 处理数据：提取时间和各字段值，只保留有完整时间的数据
                const processedData = data
                    .map(item => {
                        const time = extractTime(item.detectionTime);
                        if (time === '') return null; // 过滤掉没有时间的数据

                        return {
                            time: time,
                            temperature: parseFloat(item.wd) || 0,
                            humidity: parseFloat(item.sd) || 0,
                            windSpeed: parseFloat(item.speed) || 0,
                            airQuality: parseFloat(item.airQuality) || 0
                        };
                    })
                    .filter(item => item !== null); // 过滤掉null值

                // 提取各字段数组
                const times = processedData.map(item => item.time);
                const temperatures = processedData.map(item => item.temperature);
                const humidities = processedData.map(item => item.humidity);
                const windSpeeds = processedData.map(item => item.windSpeed);
                const airQualities = processedData.map(item => item.airQuality);

                // 更新3个图表
                updateTemperatureHumidityChart(times, temperatures, humidities);
                updateWindSpeedChart(times, windSpeeds);
                updateAirQualityChart(times, airQualities);
            }
        },
        aqEnnable
    );
}

// 获取质量检测记录（完善查询逻辑）
function getQualityDetectionRecord() {
    const url = commonUrl +
        'screen/project/projectSafety/list?projectId=' + bidCode +
        '&startTestDay=' + queryParams.startTestDay +
        '&endTestDay=' + queryParams.endTestDay;

    ajaxRequestGet(
        url,
        'GET',
        true,
        function () { },
        function (result) {
            console.log(result, '环境监测记录（工程安全分析）');

            // 表格数据通过layui table的url自动加载，这里只打印返回数据
        },
        aqEnnable
    );
}

// 更新温湿度图表
function updateTemperatureHumidityChart(times, temperatures, humidities) {
    if (!temperatureHumidityChart) return;

    temperatureHumidityChart.setOption({
        xAxis: {
            data: times
        },
        series: [
            {
                name: '温度',
                data: temperatures
            },
            {
                name: '湿度',
                data: humidities
            }
        ]
    });
}


// 更新风速图表
function updateWindSpeedChart(times, windSpeeds) {
    if (!windSpeedChart) return;

    windSpeedChart.setOption({
        xAxis: {
            data: times
        },
        series: [{
            name: '风速',
            data: windSpeeds
        }]
    });
}

// 更新空气质量图表（单折线，只显示PM2.5）
function updateAirQualityChart(times, airQualities) {
    if (!airQualityChart) return;

    airQualityChart.setOption({
        xAxis: {
            data: times
        },
        series: [
            {
                name: 'PM2.5',
                data: airQualities
            }
        ]
    });
}