aucma-scada-visual-board-new/productionboard/target/classes/static/js/foamBox/index.js

$(() => {

    let fun = () => {
        //班组计划统计
        $.getJSON(`/foamBox/getTeamStatisticsJson?ids=${ids}`, function (result) {
            onDutyPlan(result.planAmount, result.actualAmount, result.planAmount - result.actualAmount)
        });

        //设备运行状态
        $.getJSON(`/foamBox/getRunStatusJson?ids=${ids}`, function (result) {
            console.log(1)
            if (htmlId === '0' || htmlId === '1') {
                deviceStatus(result);
            } else {
                deviceStatus2(result)
            }
        });


        //库存统计
        $.getJSON(`/foamBox/getMaterialStoreJson`, function (result) {
            threeDimensionalCylindrical(result, document.getElementById("inventoryStatistics"));
        });

        //按型号统计产量
        $.getJSON(`/foamBox/getMaterialProdutionJson?ids=${ids}`, function (result) {
            horizontalBarChart(result, document.getElementById("statisticalOutputByModel"));
        });

        //小时产量
        $.getJSON(`/foamBox/getHourProdutionJson?ids=${ids}`, function (result) {
            brokenLineAreaDiagram(result, document.getElementById("hourlyOutputStatistics"));
        });

        //发泡参数
        $.getJSON(`/foamBox/getParamTemperature?ids=${ids}`, function (result) {
            multipleBrokenLineAreaDiagram(result, document.getElementById("foamingParameters"));
        });

        // 模具温度1


        $.getJSON(`/foamBox/getMouldTemperature?ids=${ids}`, function (result) {
            temperature(result, document.getElementById("temperatureOne"));
        });
        $.getJSON(`/foamBox/getMouldTemperature2?ids=${ids}`, function (result) {
            temperature(result, document.getElementById("temperatureTwo"));
        });
        setTimeout(fun, 10000)
    }
    fun()

})

const temperature = (res, ids) => {
    let mycharts = echarts.init(ids);


    let option = {
        grid: {
            top: '20%',
            left: '6%',
            right: '6%',
            bottom: '3%',
            containLabel: true
        },
        tooltip: {
            // trigger: "axis",
        },
        xAxis: [
            {
                interval: 0,
                type: 'category',
                data: res.xValueList,
                axisPointer: {
                    type: 'shadow'
                },
                axisLabel: {
                    show: true,
                    rotate: 30,
                    interval: 0
                }
            }
        ],
        yAxis: [
            {
                splitLine: {
                    show: false,
                },
                type: 'value',
                name: '温度',
                min: 0,
                // max: 50,
                interval: 10,
                axisLabel: {
                    formatter: '{value} °C  '
                }
            },
        ],
        series: [
            {
                name: '内膜温度',
                type: 'bar',
                tooltip: {
                    valueFormatter: function (value) {
                        return value + ' ml';
                    }
                },
                data: res.interiorList
            },
            {
                name: '外膜温度',
                type: 'bar',
                tooltip: {
                    valueFormatter: function (value) {
                        return value + ' ml';
                    }
                },
                data: res.lateralList
            },
        ]
    };

    mycharts.setOption(option);
    $(window).resize(mycharts.resize);
}
const deviceStatus = (statusArray) => {
    let info = `
               <img src="../../img/foamBox/${statusArray[0] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="position: absolute;transform: translate(-50%,-50%);top:30%;left:34%;width: 2vw;"/>
               <img src="../../img/foamBox/${statusArray[1] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="position: absolute;transform: translate(-50%,-50%);top:30%;left:40%;width: 2vw;"/>
               <img src="../../img/foamBox/${statusArray[2] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="position: absolute;transform: translate(-50%,-50%);top:30%;left:45%;width: 2vw;"/>
               <img src="../../img/foamBox/${statusArray[3] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="position: absolute;transform: translate(-50%,-50%);top:30%;left:51%;width: 2vw;"/>
               <img src="../../img/foamBox/${statusArray[4] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="position: absolute;transform: translate(-50%,-50%);top:30%;left:60%;width: 2vw;"/>
               <img src="../../img/foamBox/${statusArray[5] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="position: absolute;transform: translate(-50%,-50%);top:30%;left:68%;width: 2vw;"/>
`;

    $(".foamingLineRunStatus table tr").html(info);

}

const deviceStatus2 = (statusArray) => {
    let info = `
               <img src="../../img/foamBox/${statusArray[0] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="position: absolute;transform: translate(-50%,-50%);top:30%;left:34%;width: 2vw;"/>
               <img src="../../img/foamBox/${statusArray[1] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="position: absolute;transform: translate(-50%,-50%);top:30%;left:45%;width: 2vw;"/>
               <img src="../../img/foamBox/${statusArray[4] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="position: absolute;transform: translate(-50%,-50%);top:30%;left:60%;width: 2vw;"/>
               <img src="../../img/foamBox/${statusArray[5] == 1 ? "deviceopen.png" : "deviceclose.png"}" style="position: absolute;transform: translate(-50%,-50%);top:30%;left:68%;width: 2vw;"/>
`;

    $(".foamingLineRunStatus table tr").html(info);

}