EquipmentVisual.js 17.3 KB
 let action = null;
layui.config({
    base: "/js/",
    version: 1
}).use(['system'], function () {
    var form = layui.form,
        $ = layui.jquery,
        element = layui.element,
        table = layui.table,
        system = layui.system,
        sysU = new system.u(),
        sendDataWhere = null,
        paramData = {
            eqCode: null,
            eqType: null,
            otherCoce: null,
            eqImg: null,
            eqName: ""
        },

        areaName = "equipment",
        controllerName = "BaseEquipment",
        app = null;


    action = {
        //页签tabs点击事件
        tabVisualTabMethod: function (data) {
            if (data.index == 2 || data.index == 3) {
                app.methods.initEqFileAndAlarmDataList()
            }
            else if (data.index == 4) {
                app.methods.initEqMaintainDataList();
            }
        },
        //表格行点击事件
        customTableCelClick: function (obj, tableId) {
            if (tableId == app.data.tableColsEqPartElem) {
                app.methods.initEqPartMaintainDataList(obj.data.partCode);
            }
        },
    }

    app = {
        data: {
            colsFile: [[
                { field: "id", width: 100, title: "编码", hide: true },
                { field: "zizeng", width: 80, title: "序号", fixed: "left", type: "numbers" },
                { field: 'fileName', width: 300, title: '文档名称' },
                {
                    field: 'url', width: 300, title: '文件下载', templet: function (d) {
                        var target = "_blank";
                        if (d.suffix.indexOf("pdf") > -1 || d.suffix.indexOf("docx") > -1 || d.suffix.indexOf("doc") > -1 || d.suffix.indexOf("xlsx") > -1) {
                            target = "_self";
                        }
                        return `<a href="../../Document/${d.url}"  target='${target}' style="color:cornflowerblue;text-decoration: underline;cursor:pointer;">${d.fileName}</a>`;
                    }
                },
                { field: 'size', width: 100, title: '文档大小' },
                { field: 'targetId', title: '设备Code', hide: true },
                { field: 'targetTableName', width: 120, title: '适用的设备', hide: true },
                { field: 'suffix', width: 100, title: '文档类型' },
                { field: 'remark', width: 120, title: '备注' },

                { field: 'createTime', width: 150, title: '创建时间' },
                { field: 'createBy', width: 100, title: '创建人' }
            ]],
            tableColsFileObj: null,
            tableColsFileElem: "mainFile",

            colsAlarm: [[
                { field: "Id", width: 80, hide: true, title: "Id" },
                { field: "zizeng", width: 80, title: "序号", fixed: "left", type: "numbers" },
                { field: "EquipmentCode", width: 200, title: "设备编号", hide: true, },
                { field: "EquipmentName", width: 200, title: "设备名称" },
                { field: "AlarmMessage", width: 400, title: "报警信息" },
                {
                    field: "ErrorDuration", width: 140, title: "报警持续时间", templet: function (d) {
                        return app.methods.convertSecondsToTime(d.ErrorDuration)
                    }
                },
                { field: "CreateTime", width: 150, title: "创建时间" },
                { field: "Remark", width: 400, title: "备注" },
            ]],
            colsEqPart: [[
                { field: "partCode", width: 200, hide: true, title: "部件编码" },
                { field: "partName", width: 200, title: "设备部件" },
                { field: "indicator", width: 200, title: "保养周期", type: "numbers" },
                { field: "indicatorType", width: 280, title: "保养类型", hide: true },
                { field: "dictLabel", width: 150, title: "保养类型名称"  },
                { field: "price", width: 200, title: "保养费用" },
                /* { field: "price", width: 100, title: "距离下次保养(天)" },*/
            ]],
            colsEqMaintainRecord: [[
                { field: "EquipmentCode", width: 80, hide: true, title: "设备编码" },
                { field: "EquipmentTypeCode", width: 150, title: "设备类型编码", hide: true },
                { field: "PartCode", width: 80, hide: true, title: "部件编码" },
                { field: "PartName", width: 150, title: "设备部件" },
                { field: "LastMaintainTime", width: 150, title: "上次保养时间" },
                { field: "NextMaintainTime", width: 150, title: "下次保养时间" },
                { field: "MaintainTime", width: 150, title: "本次保养时间" },
                { field: "Maintainer", width: 150, title: "操作人" },
                { field: "MaintainContent", width: 150, title: "保养结果" },
                { field: "MaintainPrice", width: 150, title: "维保费用" },
                { field: "PushStatus", width: 150, title: "推送状态" },
                { field: "Attachment", width: 150, title: "附件" },
                { field: "Remark", width: 150, title: "备注" },

            ]],
            tableColsAlarmObj: null,
            tableColsAlarmElem: "mainAlarm",
            tableColsEqPartElem: "equipmentPartDt",
            tableColsEqMaintainedElem: "maintainedDt",
            tableColsEqUnMaintainElem: "unMaintainDt",
            echartOpt: {
                eqDeviceStatusEle: document.getElementById("deviceStatus"),
            },

            //下拉框配置
            selectOption: {
                //返回的数据 用于后续操作
                selectData: {

                }
            },
        },
        methods: {
            //文件列表页签
            initFileTable: function (data) {
                let options = {
                    elem: "#" + app.data.tableColsFileElem,
                    cols: app.data.colsFile,
                    data: data,
                    page: false,
                    limit: Number.MAX_VALUE,
                    height: "full-90",//如果是主明细页签,列表主体高度要设置,否则分页导航不直观展示
                    doneExtend: function (res, obj) {

                    }
                }
                app.data.tableColsFileObj = sysU.initTable(options);
            },
            //报警列表页签
            initAlarmTable: function (data) {
                let options = {
                    elem: "#" + app.data.tableColsAlarmElem,
                    cols: app.data.colsAlarm,
                    data: data,
                    page: false,
                    limit: Number.MAX_VALUE,
                    height: "full-90",//如果是主明细页签,列表主体高度要设置,否则分页导航不直观展示
                    doneExtend: function (res, obj) {

                    }
                }
                app.data.tableColsAlarmObj = sysU.initTable(options);
            },

            //设备保养页签-设备概述、设备部件
            initEqPartTable: function (val) {
                var data = val.main;

                //设备概述代码
                $('#projectInfo').text("所属项目:"+data[0].projectName);
                var bg = "layui-badge-dot layui-bg-green",
                    statusText = "在线";
                if (data[0].status == "Failure" || data[0].status == "Error") {
                    statusText = "故障";
                    bg = "layui-badge-dot layui-bg-red";
                }
                if (data[0].seconds > 300 || data[0].seconds == -1) {
                    statusText = "离线";
                    bg = "layui-badge-dot layui-bg-gray";
                }
                statusText = `ip:<span style=" display: inline-block;" >${data[0].ip}</span><span class="${bg}" style=" left: 7px;"></span> <span style="padding-left: 8px;">${statusText}</span`;
                $('#eqStatusIP').html(statusText);
                $('#maintainNumber').text(!data[0].MaintainNumber ? "0" : data[0].MaintainNumber);
                $('#toBeMaintainNumber').text(!data[0].ToBeMaintainedNumber ? "0" : data[0].ToBeMaintainedNumber);
                $('#lastMaintainTime').text(!data[0].lastMaintainTime ? "无" : data[0].lastMaintainTime);
                $('#sumAmount').text(!data[0].sumAmount ? "0" : data[0].sumAmount);

                //设备部件表格
                let options = {
                    elem: "#" + app.data.tableColsEqPartElem,
                    cols: app.data.colsEqPart,
                    data: val.eqmaintainHeadList,
                    page: true,
                    height: "full-450",//如果是主明细页签,列表主体高度要设置,否则分页导航不直观展示
                    doneExtend: function (res, obj) {
                        //设备保养、未保养
                        app.methods.initEqPartMaintainDataList();
                    }
                }
                app.data.tableColsAlarmObj = sysU.initTable(options);
            },

            //设备保养页签-已保养
            initEqMaintainedTable: function (data) {
                //设备部件表格
                let options = {
                    elem: "#" + app.data.tableColsEqMaintainedElem,
                    cols: app.data.colsEqMaintainRecord,
                    data: data,
                    page: true,
                    height: "full-440",//如果是主明细页签,列表主体高度要设置,否则分页导航不直观展示
                    doneExtend: function (res, obj) {

                    }
                }
                app.data.tableColsAlarmObj = sysU.initTable(options);
            },

            //设备保养页签-未保养
            initEqUnMaintainTable: function (data) {
                //设备部件表格
                let options = {
                    elem: "#" + app.data.tableColsEqUnMaintainElem,
                    cols: app.data.colsEqMaintainRecord,
                    data: data,
                    page: true,
                    height: "full-440",//如果是主明细页签,列表主体高度要设置,否则分页导航不直观展示
                    doneExtend: function (res, obj) {

                    }
                }
                app.data.tableColsAlarmObj = sysU.initTable(options);
            },

            //健康表现页签
            initHealthTable(data) {
                let myChart = echarts.init(app.data.echartOpt.eqDeviceStatusEle)
                window.eqHealthStatus.series[0].data = [];
                window.eqHealthStatus.series[0].data.push({ value: data.equipmentHealth.EquipmentStatus.RunProportion, name: '运行' })

                window.eqHealthStatus.series[0].data.push({ value: data.equipmentHealth.EquipmentStatus.FreeProportion, name: '空闲' })
                window.eqHealthStatus.series[0].data.push({ value: data.equipmentHealth.EquipmentStatus.AlarmProportion, name: '故障' })
                window.eqHealthStatus.series[0].data.push({ value: data.equipmentHealth.EquipmentStatus.OfflineProportion, name: '离线' })
                myChart.clear()
                myChart.setOption(window.eqHealthStatus)
                //设备信息、开机时间
                var eqInfo = data.eqInfo[0];
                var statusText = "在线",
                    bg = "layui-badge-dot layui-bg-green";
                if (eqInfo.status == "Failure" || eqInfo.status == "Error") {
                    statusText = "故障";
                    bg = "layui-badge-dot layui-bg-red";
                }
                if (eqInfo.econds > 300 || eqInfo.seconds == -1) {
                    statusText = "离线";
                    bg = "layui-badge-dot layui-bg-gray";
                    bg = "layui-badge-dot layui-bg-gray";
                }
                $("#eqInfo").html(`<span style='width: 50px;display: inline-block;'>编码:</span>${eqInfo.EquipmentCode} <br/>
                                   <span style='width: 50px;display: inline-block;'>项目:</span>${eqInfo.projectName}<br/>
                                   <span style='width: 50px;display: inline-block;'>IP:</span><span>${eqInfo.ip}</span><span class="${bg}" style=" left: 7px;"></span> <span style="padding-left: 8px;">${statusText}</span><br/>
                                   <span style='width: 50px;display: inline-block;'>SIM:</span>${!eqInfo.simNumber ? "" : eqInfo.simNumber}`) 


                
                $("#TodayPowerTime").text(parseInt(data.equipmentHealth.EquipmentStatus.TodayPowerTime) + " (小时)")
                $("#CurrentMonthPowerTime").text(parseInt(data.equipmentHealth.EquipmentStatus.CurrentMonthPowerTime) + " (小时)")

                //占比和时间明细
                $("#RunProportion").text(data.equipmentHealth.EquipmentStatus.RunProportion + "%")
                $("#RunProportionVal").text("当天" + app.methods.convertSecondsToTime(data.equipmentHealth.EquipmentStatus.RunTime))
                $("#FreeProportion").text(data.equipmentHealth.EquipmentStatus.FreeProportion + "%")
                $("#FreeProportionVal").text("当天" + app.methods.convertSecondsToTime(data.equipmentHealth.EquipmentStatus.FreeTime))

                $("#AlarmProportion").text(data.equipmentHealth.EquipmentStatus.AlarmProportion + "%")
                $("#AlarmProportionVal").text("当天" + app.methods.convertSecondsToTime(data.equipmentHealth.EquipmentStatus.AlarmTime)  )
                $("#OfflineProportion").text(data.equipmentHealth.EquipmentStatus.OfflineProportion + "%")
                $("#OfflineProportionVal").text("当天" + app.methods.convertSecondsToTime(data.equipmentHealth.EquipmentStatus.OfflineTime) )
            },

            //文件、报警、健康表现 请求数据接口
            initEqFileAndAlarmDataList() {
                var ajaxConfig = {
                    data: { equipmentCode: paramData.otherCode, equipmentTypeCode: paramData.eqType },
                    url: `/${areaName}/${controllerName}/GetEquipmentFileList`,
                    success: function (result) {
                        if (sysU.successBefore(result)) return false;
                        app.methods.initFileTable(result.Result.fileList);
                        app.methods.initAlarmTable(result.Result.alarmList);
                        app.methods.initHealthTable(result.Result);
                    }
                };
                sysU.ajax(ajaxConfig);
            },

            //读取设备概述、设备部件保养数据 请求数据接口
            initEqMaintainDataList() {
                var ajaxConfig = {
                    data: { equipmentCode: paramData.eqCode, equipmentTypeCode: paramData.eqType },
                    url: `/${areaName}/${controllerName}/GetEquipmentMaintainList`,
                    success: function (result) {
                        if (sysU.successBefore(result)) return false;
                        app.methods.initEqPartTable(result.Result);
                    }
                };
                sysU.ajax(ajaxConfig);
            },


            //设备部件保养、未保养数据 请求数据接口
            initEqPartMaintainDataList(obj) {
                var ajaxConfig = {
                    data: { eqCode: paramData.eqCode, partCode: obj },
                    url: `/${areaName}/${controllerName}/GetEquipmentMaintainRecordList`,
                    success: function (result) {
                        if (sysU.successBefore(result)) return false;

                        //加载设备部件保养、未保养 表格
                        app.methods.initEqMaintainedTable(result.Result.maintainList);
                        app.methods.initEqUnMaintainTable(result.Result.tobemaintainList);
                    }
                };
                sysU.ajax(ajaxConfig);
            },


            //秒转换小时、分钟
            convertSecondsToTime: function (seconds) {
                seconds = parseInt(seconds);
                if (typeof seconds !== 'number') return seconds;
                var hours = Math.floor(seconds / 3600);
                var minutes = Math.floor((seconds % 3600) / 60);
                var remainingSeconds = seconds % 60;

                var result = '';
                if (hours > 0) {
                    result += hours + '小时';
                }
                if (minutes > 0) {
                    result += minutes + '分';
                }
                result += remainingSeconds + '秒';
                return result;
            },

            //初始化表单
            initFrom() {
                paramData.eqCode  = "".GetUrlParam("eqCode");
                paramData.eqType = "".GetUrlParam("eqType");
                paramData.eqName = "".GetUrlParam("eqName");
                paramData.eqImg = "".GetUrlParam("eqImg");
                paramData.otherCode = "".GetUrlParam("otherCode");
                $("#bread-visual").text(`设备可视化【${paramData.eqName}】`)
                $("#eqCode").text(`${paramData.eqCode}`) //保养数据-设备名
                if (paramData.eqImg != "null") {
                    $(".eqImg").attr('src', `/images/equipment/${paramData.eqImg}`)
                }
            }
        },
        registerEvent: function () {

        },
        init: function () {
            app.methods.initFrom();
            app.registerEvent();
            app.methods.initEqFileAndAlarmDataList();
        }
    };
    app.init();
});