sgj
3 天以前 241d327e57cbfe504aa806c61aa22e6205706098
fzzy-igdss-web/src/main/resources/static/security/quantity.js
@@ -1,6 +1,12 @@
var layer;
var form;
var curCamera;
var firstQuantity;
var hisChart = null;   //曲线图
var listRecord;
var fileRecord;
var names = ['12-01', '12-02', '12-03', '12-04', '12-05', '12-06', '12-07'];
var data = [2560000, 2510000, 2540000, 2530000, 2490000, 2610000, 2570000];
layui.use(['layer'], function () {
    form = layui.form;
@@ -8,7 +14,7 @@
    // 调色板切换事件
    document.querySelectorAll('.palette-item').forEach(item => {
        item.addEventListener('click', function() {
        item.addEventListener('click', function () {
            document.querySelectorAll('.palette-item').forEach(i => {
                i.classList.remove('active');
            });
@@ -21,18 +27,14 @@
    //选择摄像头后触发的事件
    const cameraSelect = document.getElementById('select-camera');
    cameraSelect.addEventListener('change', function() {
        const selectedCamera = this.value;
        //console.log("--------------"+selectedCamera);
        video(selectedCamera);
    cameraSelect.addEventListener('change', function () {
        const selectId = this.value;
        // 更新温度走势图
        // updateEchartsTemp(selectedCamera);
        ajaxData(selectId);
    });
    // 初始化ECharts温度走势图
    initEchartsTemp();
    // 初始化走势图
    initEcharts(names, data);
});
@@ -40,39 +42,352 @@
 * 视频播放
 * @param selectId
 */
function video(selectId) {
function ajaxData(selectId) {
    curCamera = null;
    //从列表中获取摄像头信息
    curCamera = listCamera.find(camera => camera.id === selectId);
    if (!curCamera) { layer.msg('没有获取到当前摄像头信息……', {icon: 1, time: 1200});}
    curCamera = listCamera.find(camera => camera.depotId === selectId);
    if (!curCamera) {
        layer.msg('没有获取到当前摄像头信息……', {icon: 1, time: 1200});
        return;
    }
    //获取视频
    video();
    //渲染走势图
    ajaxEcharts();
    //渲染记录
    ajaxListRecord();
}
/**
 * 更新温度走势图
 * @param selectId
 * 请求图表信息
 */
function updateEchartsTemp(selectId) {
function ajaxSnapImg() {
    if(!firstQuantity){
        renderSnapImg();
        return;
    }
    fileRecord = null;
    var data = {
        cameraId: selectId
        key: firstQuantity.batchId
    };
    $.ajax({
        type: 'POST',
        url: "/security/infrared/chart-data",
        url: "/security/quantity-files",
        dataType: 'JSON',
        contentType: "application/json;charset=UTF-8",
        data: JSON.stringify(data),
        success: function (result) {
            //layer.msg("信息更新完成!!");
            if (result.code != "0000") {
                renderSnapImg();
            } else {
                fileRecord = result.data;
                renderSnapImg();
            }
        },
        error: function (result) {
           // layer.msg(result.msg);
            renderSnapImg();
        }
    });
}
/**
 * 渲染抓图
 * @returns {null}
 */
function renderSnapImg() {
    if (!fileRecord) return null;
    if (fileRecord.length === 0) return null;
    var record = fileRecord[0];
    if (record) {
        $("#file-time1").text(record.createTime);
        $("#file-img1").attr("src", record.filePath);
    } else {
        $("#file-time1").text("----");
        $("#file-img1").attr("src", "/img/web/security/p-snap.jpg");
    }
    record = fileRecord[1];
    if (record) {
        $("#file-time2").text(record.createTime);
        $("#file-img2").attr("src", record.filePath);
    } else {
        $("#file-time2").text("----");
        $("#file-img2").attr("src", "/img/web/security/p-snap.jpg");
    }
    record = fileRecord[2];
    if (record) {
        $("#file-time3").text(record.createTime);
        $("#file-img3").attr("src", record.filePath);
    } else {
        $("#file-time3").text("----");
        $("#file-img3").attr("src", "/img/web/security/p-snap.jpg");
    }
    record = fileRecord[3];
    if (record) {
        $("#file-time4").text(record.createTime);
        $("#file-img4").attr("src", record.filePath);
    } else {
        $("#file-time4").text("----");
        $("#file-img4").attr("src", "/img/web/security/p-snap.jpg");
    }
}
/**
 * 请求图表信息
 */
function ajaxEcharts() {
    var data = {
        depotId: curCamera.depotId
    };
    $.ajax({
        type: 'POST',
        url: "/security/quantity-chart",
        dataType: 'JSON',
        contentType: "application/json;charset=UTF-8",
        data: JSON.stringify(data),
        success: function (result) {
            if (result.code != "0000") {
                renderEcharts(null);
            } else {
                renderEcharts(result.data);
            }
        },
        error: function (result) {
            renderEcharts(null);
        }
    });
}
/**
 * 渲染图表
 * @param chartData
 */
function renderEcharts(chartData) {
    var chart = hisChart;
    if (chartData && chartData.xaxis.length > 0 && chartData.seriesData.length > 0) {
        chart.option.xAxis[0].data = chartData.xaxis;
        chart.option.series[0].data = chartData.seriesData;
        chart.chart.setOption(chart.option, true);
    } else {
        chart.option.xAxis[0].data = names;
        chart.option.series[0].data = data;
        chart.chart.setOption(chart.option, true);
    }
    hisChart = chart;
}
/**
 * 请求记录
 */
function ajaxListRecord() {
    firstQuantity = null;
    listRecord = null;
    var data = {
        depotId: curCamera.depotId
    };
    $.ajax({
        type: 'POST',
        url: "/security/quantity-list",
        dataType: 'JSON',
        contentType: "application/json;charset=UTF-8",
        data: JSON.stringify(data),
        success: function (result) {
            if (result.code != "0000") {
                renderListRecord();
            } else {
                listRecord = result.data;
                renderListRecord();
            }
        },
        error: function (result) {
            renderListRecord();
        }
    });
}
/**
 * 渲染记录
 * @returns {null}
 */
function renderListRecord() {
    if (!listRecord) {
        //渲染抓拍图
        ajaxSnapImg();
        return null;
    }
    if (listRecord.length === 0) {
        //渲染抓拍图
        ajaxSnapImg();
        return null;
    }
    var record = listRecord[0];
    if (record) {
        firstQuantity = record;
        $("#record_title1").text("检测重量:" + record.weight + " KG");
        $("#record_time1").text(record.receiveDate);
        $("#record_content1").text(record.remark);
    } else {
        $("#record_title1").text("检测重量:---- KG");
        $("#record_time1").text("----");
        $("#record_content1").text("检测重量为---- KG,实际重量为---- KG,误差小于-%。");
    }
    record = listRecord[1];
    if (record) {
        $("#record_title2").text("检测重量:" + record.weight + " KG");
        $("#record_time2").text(record.receiveDate);
        $("#record_content2").text(record.remark);
    } else {
        $("#record_title2").text("检测重量:---- KG");
        $("#record_time2").text("----");
        $("#record_content2").text("检测重量为---- KG,实际重量为---- KG,误差小于-%。");
    }
    record = listRecord[2];
    if (record) {
        $("#record_title3").text("检测重量:" + record.weight + " KG");
        $("#record_time3").text(record.receiveDate);
        $("#record_content3").text(record.remark);
    } else {
        $("#record_title3").text("检测重量:---- KG");
        $("#record_time3").text("----");
        $("#record_content3").text("检测重量为---- KG,实际重量为---- KG,误差小于-%。");
    }
    record = listRecord[3];
    if (record) {
        $("#record_title4").text("检测重量:" + record.weight + " KG");
        $("#record_time4").text(record.receiveDate);
        $("#record_content4").text(record.remark);
    } else {
        $("#record_title4").text("检测重量:---- KG");
        $("#record_time4").text("----");
        $("#record_content4").text("检测重量为---- KG,实际重量为---- KG,误差小于-%。");
    }
    //渲染抓拍图
    ajaxSnapImg();
}
/**
 * 视频播放
 * @param
 */
function video() {
    var data = {
        id: curCamera.cameraSn,
        playType: curCamera.playType
    };
    $.ajax({
        type: 'POST',
        url: "/security/get-media",
        dataType: 'JSON',
        contentType: "application/json;charset=UTF-8",
        data: JSON.stringify(data),
        success: function (result) {
            if (result.code != "SUCCESS") {
                layer.msg(result.msg, {icon: 1, time: 1200});
            } else {
                toPlay(result.playUrl);
            }
        },
        error: function (result) {
            layer.msg("未获取到播放信息!!", {icon: 1, time: 1200});
        }
    });
}
/**
 * 播放视频
 * @param url
 */
function toPlay(url) {
    var html = '';
    if (url) {
        html += '<iframe src="' + url + '" width="100%" height="100%" frameborder="0" allowfullscreen></iframe>';
    } else {
        html += '<img src="/img/web/security/p-snap.jpg">';
    }
    $("#divPlugin2").html(html);
}
/**
 * 启动开始检测
 */
function checkStart() {
    if (!curCamera) {
        shoTips("请先选择设备!");
        return;
    }
    layer.msg("开始执行……");
    var data = {
        'depotId': curCamera.depotId
    };
    $.ajax({
        type: "POST",
        url: "/security/check-single",
        dataType: "json",
        contentType: "application/json;charset=UTF-8",
        data: JSON.stringify(data),
        success: function (result) {
            if (result.code == "ORDER_SUCCESS") {
                shoTips("命令发生成功,请等待终端返回结果……");
            } else {
                shoTips("命令发送失败:" + result.msg);
            }
        },
        error: function () {
            shoTips("检测出现异常,执行失败!");
        }
    });
}
/**
 * 停止检测
 */
function checkStop() {
    if (!curCamera) {
        shoTips("请先选择仓库!");
        return;
    }
    layer.msg("开始执行……");
    var data = {
        'depotId': curCamera.depotId
    };
    $.ajax({
        type: "POST",
        url: "/security/check-stop",
        dataType: "json",
        contentType: "application/json;charset=UTF-8",
        data: JSON.stringify(data),
        success: function (result) {
            if (result.code == "ORDER_SUCCESS") {
                shoTips("命令发生成功……");
            } else {
                shoTips("命令发送失败:" + result.msg);
            }
        },
        error: function () {
            shoTips("检测出现异常,执行失败!");
        }
    });
}
// 初始化ECharts温度走势图
function initEchartsTemp() {
function initEcharts(names, data) {
    // 初始化ECharts温度走势图
    var temperatureChartDom = document.getElementById('temperatureChart');
    var temperatureChart = echarts.init(temperatureChartDom);
@@ -102,7 +417,7 @@
            {
                type: 'category',
                boundaryGap: false,
                data: ['12-01', '12-02', '12-03', '12-04', '12-05', '12-06', '12-07']
                data: names
            }
        ],
        yAxis: [
@@ -110,7 +425,7 @@
                type: 'value',
                name: '数量 (KG)',
                min: 0,
                max: 3000000,
                // max: 3000000,
                axisLabel: {
                    formatter: '{value} KG'
                }
@@ -127,18 +442,27 @@
                },
                areaStyle: {
                    color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                        { offset: 0, color: 'rgba(15, 52, 96, 0.3)' },
                        { offset: 1, color: 'rgba(15, 52, 96, 0.05)' }
                        {offset: 0, color: 'rgba(15, 52, 96, 0.3)'},
                        {offset: 1, color: 'rgba(15, 52, 96, 0.05)'}
                    ])
                },
                data: [2560000, 2510000, 2540000, 2530000, 2490000, 2610000, 2570000]
                data: data
            }
        ]
    };
    // 渲染图表
    option && temperatureChart.setOption(option);
    hisChart = {"chart": temperatureChart, "option": option};
    // 窗口大小变化时调整图表大小
    window.addEventListener('resize', function() {
    window.addEventListener('resize', function () {
        temperatureChart.resize();
    });
}
function shoTips(msg) {
    layer.msg(msg,
        {time: 3000, shift: 5, offset: "rb"},
        function () {
        });
}