堆垛机设备

Junjie

2023-07-20 cb7d148bc6c0e81b4f413b6c3ff76102cbc0648a

堆垛机设备

 src/main/java/com/zy/asrs/controller/CrnController.java

@@ -11,6 +11,7 @@
import com.zy.asrs.domain.param.CrnDemoParam;
import com.zy.asrs.domain.param.CrnOperatorParam;
import com.zy.asrs.domain.vo.CommandLogVo;
import com.zy.asrs.domain.vo.CrnListVo;
import com.zy.asrs.domain.vo.CrnMsgTableVo;
import com.zy.asrs.domain.vo.CrnStateTableVo;
import com.zy.asrs.entity.*;
@@ -247,6 +248,65 @@
        return R.ok().add(vo);
    }

    @GetMapping("/crn/list/auth")
    @ManagerAuth(memo = "堆垛机数据表")
    public R crnList(){
        List<CrnListVo> list = new ArrayList<>();
        List<BasCrnp> crnps = basCrnpService.selectList(new EntityWrapper<BasCrnp>().orderBy("crn_no"));
        for (BasCrnp basCrnp : crnps) {
            // 表格行
            CrnListVo vo = new CrnListVo();
            vo.setCrnNo(basCrnp.getCrnNo());   //  堆垛机号
            list.add(vo);
            // 获取堆垛机信息
            CrnThread crnThread = (CrnThread) SlaveConnection.get(SlaveType.Crn, basCrnp.getCrnNo());
            if (crnThread == null) {
                continue;
            }
            CrnProtocol crnProtocol = crnThread.getCrnProtocol();
            if (crnProtocol == null) {
                continue;
            }

            vo.setWorkNo(crnProtocol.getTaskNo());  //  任务号
            if (crnProtocol.getTaskNo()>0) {
                WrkMast wrkMast = wrkMastService.selectById(crnProtocol.getTaskNo());
                if (wrkMast != null) {
                    vo.setDeviceStatus(CrnStatusType.process(wrkMast.getIoType()).getDesc());   //  模式状态
                    vo.setSourceStaNo(wrkMast.getSourceStaNo$());    //  源站
                    vo.setStaNo(wrkMast.getStaNo$());   //  目标站
                    vo.setSourceLocNo(wrkMast.getSourceLocNo());    //  源库位
                    vo.setLocNo(wrkMast.getLocNo());    //  目标库位
                }
            } else {
                vo.setDeviceStatus(crnProtocol.modeType.equals(CrnModeType.AUTO)? CrnStatusType.MACHINE_AUTO.getDesc(): CrnStatusType.MACHINE_UN_AUTO.getDesc());   //  模式状态
            }
            vo.setXspeed(crnProtocol.getXSpeed());  //  走行速度（m/min)
            vo.setYspeed(crnProtocol.getYSpeed());  //  升降速度（m/min)
            vo.setZspeed(crnProtocol.getZSpeed());  //  叉牙速度（m/min)
            vo.setXdistance(crnProtocol.getXDistance());  //  走行距离(Km)
            vo.setYdistance(crnProtocol.getYDistance());  //  升降距离(Km)
            vo.setXduration(crnProtocol.getXDuration());    //  走行时长(H)
            vo.setYduration(crnProtocol.getYDuration());    //  升降时长(H)

            vo.setStatusType(crnProtocol.modeType.desc);   //  模式状态
            vo.setWrkStatus(crnProtocol.getStatusType().desc);     //  任务状态
            vo.setLoading((crnProtocol.getLoaded() != null && crnProtocol.getLoaded() == 1) ? "有物" : "无物");  //  有物
            vo.setBay(crnProtocol.getBay());    //  列
            vo.setLev(crnProtocol.getLevel());  //  层

            vo.setForkOffset(crnProtocol.getForkPosType().desc);    // 货叉位置
            vo.setLiftPos(crnProtocol.getLiftPosType().desc);
            vo.setWalkPos(crnProtocol.getWalkPos()==1?"不在定位":"在定位");
            vo.setWarnCode(String.valueOf(crnProtocol.getAlarm1()));
            if (crnProtocol.getAlarm1() > 0) {
                BasCrnError crnError = basCrnErrorMapper.selectById(crnProtocol.getAlarm1());
                vo.setAlarm(crnError==null?"未知异常":crnError.getErrName());
            }
        }
        return R.ok().add(list);
    }

    @PostMapping("/crn/output/site")
    @ManagerAuth(memo = "堆垛机报文日志输出")
    public R crnOutput(){

 src/main/java/com/zy/asrs/domain/vo/CrnListVo.java

New file
@@ -0,0 +1,136 @@
package com.zy.asrs.domain.vo;

import com.zy.asrs.utils.Utils;
import lombok.Data;

@Data
public class CrnListVo {

    // 堆垛机号
    private Integer crnNo;

    // 模式
    private String statusType = "-";

    // 有物
    private String loading = "-";

    // 列
    private Short bay;

    // 层
    private Short lev;

    // 走行原点
    private String xOrigin = "-";

    // 升降原点
    private String yOrigin = "-";

    // 货叉位置
    private String forkOffset = "-";

    // 载货台位置
    private String liftPos = "-";

    // 走行定位
    private String walkPos = "-";

    // 急停
    private String stop = "-";

    // 列坐标
    private String bayCoor = "-";

    // 层坐标
    private String levCoor = "-";

    // 完成
    private String complete = "-";

    // 任务号
    private Short workNo = 0;

    // 任务状态
    private String wrkStatus = "-";

    // 异常码
    private String warnCode = "-";

    // 垂直故障码
    private String alarm = "-";

    // 源站
    private String sourceStaNo = "-";

    // 目标站
    private String staNo = "-";

    // 源库位
    private String sourceLocNo = "-";

    // 目标库位
    private String locNo = "-";

    // 异常
    private String error = "";

    // 原点
    private String origin = "";

    // 命令
    private String command = "";

    // 走行速度（m/min)
    private Float xspeed = 0.0F;

    // 升降速度（m/min)
    private Float yspeed = 0.0F;

    // 叉牙速度（m/min)
    private Float zspeed = 0.0F;

    // 走行距离(Km)
    private Float xdistance = 0.0F;

    // 升降距离(Km)
    private Float ydistance = 0.0F;

    // 走行时长(H)
    private Float xduration = 0.0F;

    // 升降时长(H)
    private Float yduration = 0.0F;

    // 设备状态
    private String deviceStatus = "-";

    public void setXspeed(Float xspeed) {
        this.xspeed = Utils.scale(xspeed);
    }

    public void setYspeed(Float yspeed) {
        this.yspeed = Utils.scale(yspeed);
    }

    public void setZspeed(Float zspeed) {
        this.zspeed = Utils.scale(zspeed);
    }

    public void setXdistance(Float xdistance) {
        this.xdistance = Utils.scale(xdistance);
    }

    public void setYdistance(Float ydistance) {
        this.ydistance = Utils.scale(ydistance);
    }

    public void setXduration(Float xduration) {
        this.xduration = Utils.scale(xduration);
    }

    public void setYduration(Float yduration) {
        this.yduration = Utils.scale(yduration);
    }

}

 src/main/webapp/static/wms/js/realtimeWatch/crn.js

New file
@@ -0,0 +1,348 @@
var pageCurr;
var tableData;
// 定义一个变量来保存滚动条的位置
var scrollLeft = 0;
layui.config({
    base: baseUrl + "/static/wms/layui/lay/modules/"
}).use(['table','laydate', 'form', 'admin'], function(){
    var table = layui.table;
    var $ = layui.jquery;
    var layer = layui.layer;
    var layDate = layui.laydate;
    var form = layui.form;
    var admin = layui.admin;

    // 数据渲染
    tableIns = table.render({
        elem: '#crn',
        headers: {token: localStorage.getItem('token')},
        url: baseUrl+'/crn/list/auth',
        page: false,
        limit: 500,
        limits: [15, 30, 50, 100, 200, 500],
        toolbar: '#toolbar',
        cellMinWidth: 100,
        height: 'full-120',
        cols: [[
             {field: 'crnNo', align: 'center',title: '堆垛机'}
            ,{field: 'workNo', align: 'center',title: '工作号'}
            ,{field: 'statusType', align: 'center',title: '模式'}
            ,{field: 'wrkStatus', align: 'center',title: '任务状态',width: 120}
            ,{field: 'deviceStatus', align: 'center',title: '设备状态'}
            ,{field: 'loading', align: 'center',title: '有物'}
            ,{field: 'bay', align: 'center',title: '列'}
            ,{field: 'lev', align: 'center',title: '层'}
            ,{field: 'warnCode', align: 'center',title: '故障代码'}
            ,{field: 'alarm', align: 'center',title: '故障描述'}
            ,{field: 'sourceStaNo', align: 'center',title: '源站'}
            ,{field: 'staNo', align: 'center',title: '目标站'}
            ,{field: 'sourceLocNo', align: 'center',title: '源库位'}
            ,{field: 'locNo', align: 'center',title: '目标库位'}
            ,{field: 'forkOffset', align: 'center',title: '货叉定位'}
            ,{field: 'liftPos', align: 'center',title: '载货台定位'}
            ,{field: 'walkPos', align: 'center',title: '走行在定位'}
            ,{field: 'xspeed', align: 'center',title: '走行速度（m/min)'}
            ,{field: 'yspeed', align: 'center',title: '升降速度（m/min)'}
            ,{field: 'zspeed', align: 'center',title: '叉牙速度（m/min)'}
            ,{field: 'xdistance', align: 'center',title: '走行距离(Km)'}
            ,{field: 'ydistance', align: 'center',title: '升降距离(Km)'}
            ,{field: 'xduration', align: 'center',title: '走行时长(H)'}
            ,{field: 'yduration', align: 'center',title: '升降时长(H)'}

            // ,{fixed: 'right', title:'操作', align: 'center', toolbar: '#operate', width:120}
        ]],
        request: {
            pageName: 'curr',
            pageSize: 'limit'
        },
        parseData: function (res) {
            return {
                'code': res.code,
                'msg': res.msg,
                'count': res.count,
                'data': res.data
            }
        },
        response: {
            statusCode: 200
        },
        done: function(res, curr, count) {
            if (res.code === 403) {
                top.location.href = baseUrl+"/";
            }
            pageCurr=curr;
            limit();
            tableData = table.cache.crn;

            $(".layui-table-tool").hide()
        }
    });

    // 监听排序事件
    table.on('sort(crn)', function (obj) {
        var searchData = {};
        $.each($('#search-box [name]').serializeArray(), function() {
            searchData[this.name] = this.value;
        });
        searchData['orderByField'] = obj.field;
        searchData['orderByType'] = obj.type;
        tableIns.reload({
            where: searchData,
            page: {curr: 1}
        });
    });

    // 监听头工具栏事件
    table.on('toolbar(crn)', function (obj) {
        var checkStatus = table.checkStatus(obj.config.id).data;
        switch(obj.event) {
            case 'addData':
                showEditModel();
                break;
            case 'exportData':
                admin.confirm('确定导出Excel吗', {shadeClose: true}, function(){
                    var titles=[];
                    var fields=[];
                    obj.config.cols[0].map(function (col) {
                        if (col.type === 'normal' && col.hide === false && col.toolbar == null) {
                            titles.push(col.title);
                            fields.push(col.field);
                        }
                    });
                    var exportData = {};
                    $.each($('#search-box [name]').serializeArray(), function() {
                        exportData[this.name] = this.value;
                    });
                    var param = {
                        'apiConfig': exportData,
                        'fields': fields
                    };
                    $.ajax({
                        url: baseUrl+"/apiConfig/export/auth",
                        headers: {'token': localStorage.getItem('token')},
                        data: JSON.stringify(param),
                        dataType:'json',
                        contentType:'application/json;charset=UTF-8',
                        method: 'POST',
                        success: function (res) {
                            layer.closeAll();
                            if (res.code === 200) {
                                table.exportFile(titles,res.data,'xls');
                            } else if (res.code === 403) {
                                top.location.href = baseUrl+"/";
                            } else {
                                layer.msg(res.msg, {icon: 2})
                            }
                        }
                    });
                });
                break;
        }
    });

    // 监听行工具事件
    table.on('tool(crn)', function(obj){
        var data = obj.data;
        switch (obj.event) {
            case 'edit':
                showEditModel(data);
                break;
        }
    });

    /* 弹窗 - 新增、修改 */
    function showEditModel(mData) {
        admin.open({
            type: 1,
            area: '600px',
            title: (mData ? '修改' : '添加') + '接口配置',
            content: $('#editDialog').html(),
            success: function (layero, dIndex) {
                layDateRender(mData);
                form.val('detail', mData);
                form.on('submit(editSubmit)', function (data) {
                    var loadIndex = layer.load(2);
                    $.ajax({
                        url: baseUrl+"/apiConfig/"+(mData?'update':'add')+"/auth",
                        headers: {'token': localStorage.getItem('token')},
                        data: data.field,
                        method: 'POST',
                        success: function (res) {
                            layer.close(loadIndex);
                            if (res.code === 200){
                                layer.close(dIndex);
                                layer.msg(res.msg, {icon: 1});
                                tableReload();
                            } else if (res.code === 403){
                                top.location.href = baseUrl+"/";
                            }else {
                                layer.msg(res.msg, {icon: 2});
                            }
                        }
                    })
                    return false;
                });
                $(layero).children('.layui-layer-content').css('overflow', 'visible');
                layui.form.render('select');
            }
        });
    }

    /* 删除 */
    function del(ids) {
        layer.confirm('确定要删除选中数据吗？', {
            skin: 'layui-layer-admin',
            shade: .1
        }, function (i) {
            layer.close(i);
            var loadIndex = layer.load(2);
            $.ajax({
                url: baseUrl+"/apiConfig/delete/auth",
                headers: {'token': localStorage.getItem('token')},
                data: {ids: ids},
                method: 'POST',
                success: function (res) {
                    layer.close(loadIndex);
                    if (res.code === 200){
                        layer.msg(res.msg, {icon: 1});
                        tableReload();
                    } else if (res.code === 403){
                        top.location.href = baseUrl+"/";
                    } else {
                        layer.msg(res.msg, {icon: 2});
                    }
                }
            })
        });
    }

    // 搜索
    form.on('submit(search)', function (data) {
        pageCurr = 1;
        tableReload(false);
    });

    // 重置
    form.on('submit(reset)', function (data) {
        pageCurr = 1;
        clearFormVal($('#search-box'));
        tableReload(false);
    });

    // 时间选择器
    function layDateRender(data) {
        setTimeout(function () {
            layDate.render({
                elem: '#createTime\\$',
                type: 'datetime',
                value: data!==undefined?data['createTime\\$']:null
            });
            layDate.render({
                elem: '#updateTime\\$',
                type: 'datetime',
                value: data!==undefined?data['updateTime\\$']:null
            });

        }, 300);
    }
    layDateRender();

    setInterval(() => {
        // 获取当前滚动条位置
        scrollLeft = $("#crn").next('.layui-table-view').find('.layui-table-body').scrollLeft();
        $.ajax({
            url: baseUrl+"/crn/list/auth",
            headers: {'token': localStorage.getItem('token')},
            data: {},
            dataType:'json',
            contentType:'application/json;charset=UTF-8',
            method: 'GET',
            success: function (res) {
                console.log(res)
                table.render({
                    elem: '#crn',
                    headers: {token: localStorage.getItem('token')},
                    data: res.data,
                    page: false,
                    limit: 500,
                    limits: [15, 30, 50, 100, 200, 500],
                    toolbar: '#toolbar',
                    cellMinWidth: 100,
                    height: 'full-120',
                    cols: [[
                        {field: 'crnNo', align: 'center',title: '堆垛机'}
                        ,{field: 'workNo', align: 'center',title: '工作号'}
                        ,{field: 'statusType', align: 'center',title: '模式'}
                        ,{field: 'wrkStatus', align: 'center',title: '任务状态',width: 120}
                        ,{field: 'deviceStatus', align: 'center',title: '设备状态'}
                        ,{field: 'loading', align: 'center',title: '有物'}
                        ,{field: 'bay', align: 'center',title: '列'}
                        ,{field: 'lev', align: 'center',title: '层'}
                        ,{field: 'warnCode', align: 'center',title: '故障代码'}
                        ,{field: 'alarm', align: 'center',title: '故障描述'}
                        ,{field: 'sourceStaNo', align: 'center',title: '源站'}
                        ,{field: 'staNo', align: 'center',title: '目标站'}
                        ,{field: 'sourceLocNo', align: 'center',title: '源库位'}
                        ,{field: 'locNo', align: 'center',title: '目标库位'}
                        ,{field: 'forkOffset', align: 'center',title: '货叉定位'}
                        ,{field: 'liftPos', align: 'center',title: '载货台定位'}
                        ,{field: 'walkPos', align: 'center',title: '走行在定位'}
                        ,{field: 'xspeed', align: 'center',title: '走行速度（m/min)'}
                        ,{field: 'yspeed', align: 'center',title: '升降速度（m/min)'}
                        ,{field: 'zspeed', align: 'center',title: '叉牙速度（m/min)'}
                        ,{field: 'xdistance', align: 'center',title: '走行距离(Km)'}
                        ,{field: 'ydistance', align: 'center',title: '升降距离(Km)'}
                        ,{field: 'xduration', align: 'center',title: '走行时长(H)'}
                        ,{field: 'yduration', align: 'center',title: '升降时长(H)'}

                        // ,{fixed: 'right', title:'操作', align: 'center', toolbar: '#operate', width:120}
                    ]],
                    request: {
                        pageName: 'curr',
                        pageSize: 'limit'
                    },
                    parseData: function (res) {
                        return {
                            'code': res.code,
                            'msg': res.msg,
                            'count': res.count,
                            'data': res.data
                        }
                    },
                    response: {
                        statusCode: 200
                    },
                    done: function(res, curr, count) {
                        if (res.code === 403) {
                            top.location.href = baseUrl+"/";
                        }
                        pageCurr=curr;
                        limit();
                        tableData = table.cache.crn;
                        // 恢复滚动条位置
                        $("#crn").next('.layui-table-view').find('.layui-table-body').scrollLeft(scrollLeft);

                        $(".layui-table-tool").hide()
                    }
                });
            }
        });
    }, 1000);

});

// 关闭动作
$(document).on('click','#data-detail-close', function () {
    parent.layer.closeAll();
});

function tableReload(child) {
    var searchData = {};
    $.each($('#search-box [name]').serializeArray(), function() {
        searchData[this.name] = this.value;
    });
    tableIns.reload({
        where: searchData,
        page: {curr: pageCurr}
    });
}

 src/main/webapp/views/realtimeWatch/crn.html

@@ -1,535 +1,98 @@
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta charset="utf-8">
    <title>堆垛机监控管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" type="text/css" href="../../static/wcs/css/normalize.css">
    <link rel="stylesheet" type="text/css" href="../../static/wcs/css/common.css">
    <link rel="stylesheet" type="text/css" href="../../static/wcs/css/crn.css">
    <script type="text/javascript" src="../../static/wcs/js/jquery/jquery-3.3.1.min.js"></script>
    <script type="text/javascript" src="../../static/wcs/js/common.js"></script>
    <script type="text/javascript" src="../../static/wcs/js/layer/layer.js"></script>
    <style>
        .demoBtn {
            vertical-align: middle;
            width: 20%;
            height: 25px;
            left: 0;
            top: 0;
            text-shadow: inherit;
            font-size: 15px;
            margin-left: 5px;
            margin-right: 5px;
            display: inline-block;
            background-color: #FF5722;
            border: none;
            color: #FFF;
            box-shadow: 1px 1px 5px #B6B6B6;
            border-radius: 3px;
            cursor: pointer;
        }

        .demoBtn:hover {
            opacity: 0.8
        }
        .demoBtn:focus {
            outline: 0;
        }
    </style>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../../static/wms/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="../../static/wms/css/admin.css?v=318" media="all">
    <link rel="stylesheet" href="../../static/wms/css/cool.css" media="all">
</head>
<body>
<div style="padding: 10px;height: 100%;float: left;width: 6%">
    <div class="button-window"></div>
</div>
<div style="height: 100%;padding-left: 6%">
    <div style="padding: 10px;height: 100%">
        <!-- 日志监控板 -->
        <div class="log-board">
            <!-- 执行命令 -->

            <!-- 执行命令 -->
            <div class="command-log">
                <h3>执行中的命令</h3>
                <div class="crn-command-item">
                    <label>1#</label>
                    <button id="demoBtn-1" class="demoBtn" onclick="demoSwitch(this.id)"> - </button>
                    <!--            <span>&nbsp;</span>-->
                    <input id="crn1" disabled="disabled">
                </div>
                <div class="crn-command-item">
                    <label>2#</label>
                    <button id="demoBtn-2" class="demoBtn" onclick="demoSwitch(this.id)"> - </button>
                    <!--            <span>&nbsp;</span>-->
                    <input id="crn2" disabled="disabled">
                </div>
            </div>
            <!-- 堆垛机状态位信息 -->
            <div class="crn-state">
                <table id="crn-state-table">
                    <thead>
                    <tr>
                        <th>堆垛机</th>
                        <th>模式</th>
                        <th>状态</th>
                        <th>有物</th>
                        <th>列</th>
                        <th>层</th>
                        <th>货叉定位</th>
                        <th>载货台定位</th>
                        <th>走行在定位</th>
                        <th>故障代码</th>
                        <th>故障描述</th>
                    </tr>
                    </thead>
                    <tbody>
                    </tbody>
                </table>
            </div>
        </div>
        <!-- 堆垛机状态 -->
        <div class="crn-msg">
            <table id="crn-msg-table">
                <thead>
                <tr>
                    <th>堆垛机</th>
                    <th>工作号</th>
                    <th>状态</th>
                    <th>源站</th>
                    <th>目标站</th>
                    <th>源库位</th>
                    <th>目标库位</th>
                    <th>走行速度（m/min)</th>
                    <th>升降速度（m/min)</th>
                    <th>叉牙速度（m/min)</th>
                    <th>走行距离(Km)</th>
                    <th>升降距离(Km)</th>
                    <th>走行时长(H)</th>
                    <th>升降时长(H)</th>
                </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
        <!-- 堆垛机日志输出 -->
        <div class="crn-output-board">
            <textarea id="crn-output"></textarea>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
<!--            <div class="layui-form toolbar" id="search-box">-->
<!--                <div class="layui-form-item">-->
<!--                    <div class="layui-inline">-->
<!--                        <div class="layui-input-inline">-->
<!--                            <input class="layui-input" type="text" name="id" placeholder="编号" autocomplete="off">-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div class="layui-inline">&emsp;-->
<!--                        <button class="layui-btn icon-btn" lay-filter="search" lay-submit>-->
<!--                            <i class="layui-icon">&#xe615;</i>刷新-->
<!--                        </button>-->
<!--                        <button class="layui-btn icon-btn" lay-filter="reset" lay-submit>-->
<!--                            <i class="layui-icon">&#xe666;</i>重置-->
<!--                        </button>-->
<!--                    </div>-->
<!--                </div>-->
<!--            </div>-->
            <table class="layui-hide" id="crn" lay-filter="crn"></table>
        </div>
    </div>
</div>

<script type="text/html" id="toolbar">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" id="btn-add" lay-event="addData" style="visibility: hidden">新增</button>
        <button class="layui-btn layui-btn-sm layui-btn-danger" id="btn-delete" lay-event="deleteData" style="visibility: hidden">删除</button>
        <button class="layui-btn layui-btn-primary layui-btn-sm" id="btn-export" lay-event="exportData" style="float: right;visibility: hidden">导出</button>
    </div>
</script>

<script type="text/html" id="operate">
    <a class="layui-btn layui-btn-primary layui-btn-xs btn-edit" lay-event="edit">修改</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs btn-edit" lay-event="del">删除</a>
</script>

<script type="text/javascript" src="../../static/wms/js/jquery/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="../../static/wms/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../../static/wms/js/common.js" charset="utf-8"></script>
<script type="text/javascript" src="../../static/wms/js/cool.js" charset="utf-8"></script>
<script type="text/javascript" src="../../static/wms/js/realtimeWatch/crn.js" charset="utf-8"></script>
</body>
<script>
    // 空白行数
    var crnStateTableBlankRows = 0;
    var crnMsgTableBlankRows = 0;
    // 实际行数
    var crnStateTableFullRows = 0;
    var crnMsgTableFullRows = 0;
    // 初始化
    var crnOutputDom = document.getElementById("crn-output");
    $(document).ready(function() {
        getCommandLog();
        initCrnStateTable();
        getCrnStateInfo();
        initCrnMsgTable();
        getCrnMsgInfo();
        operatorBlockShow();
    });
    // 数据更新
    setInterval(function () {
        getCrnStateInfo();
        getCrnMsgInfo();
        getCommandLog();
    },1000);
    setInterval(function () {
        getCrnOutput();
        operatorBlockShow();
        initDemo();
    },500);
<!-- 表单弹窗 -->
<script type="text/html" id="editDialog">
    <form id="detail" lay-filter="detail" class="layui-form admin-form model-form">
        <input name="id" type="hidden">
        <div class="layui-row">
            <div class="layui-col-md12">
                <div class="layui-form-item">
                    <label class="layui-form-label">api地址: </label>
                    <div class="layui-input-block">
                        <input class="layui-input" name="url" placeholder="请输入api地址">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">状态: </label>
                    <div class="layui-input-block">
                        <select name="status">
                            <option value="">请选择状态</option>
                            <option value="0">正常</option>
                            <option value="1">禁用</option>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">备注: </label>
                    <div class="layui-input-block">
                        <input class="layui-input" name="memo" placeholder="请输入备注">
                    </div>
                </div>

    // 判断手动操作模块是否可用
    function operatorBlockShow() {
        if (parent.systemRunning) {
            $('.crn-operation').css("opacity", "0.5");
            $('.crn-operation-shade').show();
            $('.crn-operation-shade-span').show();
        }  else {
            $('.crn-operation').css("opacity", "1");
            $('.crn-operation-shade').hide();
            $('.crn-operation-shade-span').hide();
        }
    }

    // 获取堆垛机执行中的命令
    function getCommandLog() {
        $.ajax({
            url: baseUrl + "/crn/command/ongoing",
            headers: {'token': localStorage.getItem('token')},
            method: 'POST',
            success: function (res) {
                if (res.code === 200) {
                    var commands = res.data;
                    for (var i=0; i<commands.length;i++){
                        $("#crn"+commands[i].crnNo).val(commands[i].command);
                    }
                } else if (res.code === 403) {
                    window.location.href = baseUrl + "/login";
                } else {
                    console.log(res.msg);
                }
            }
        })
    }

    // 堆垛机信息表获取 ---- 表一
    function getCrnStateInfo() {
        var tableEl = $('#crn-state-table');
        $.ajax({
            url: baseUrl+ "/crn/table/crn/state",
            headers: {'token': localStorage.getItem('token')},
            method: 'POST',
            success: function (res) {
                if (res.code === 200){
                    var table = res.data;
                    if (table.length > crnStateTableBlankRows && table.length !== crnStateTableFullRows) {
                        initCrnStateTable(table.length-crnStateTableBlankRows);
                        crnStateTableFullRows = table.length;
                    }
                    for (var i=1;i<=table.length;i++){
                        var tr = tableEl.find("tr").eq(i);
                        setVal(tr.children("td").eq(0), table[i-1].crnNo);
                        setVal(tr.children("td").eq(1), table[i-1].statusType);
                        setVal(tr.children("td").eq(2), table[i-1].status);
                        setVal(tr.children("td").eq(3), table[i-1].loading);
                        setVal(tr.children("td").eq(4), table[i-1].bay);
                        setVal(tr.children("td").eq(5), table[i-1].lev);
                        setVal(tr.children("td").eq(6), table[i-1].forkOffset);
                        setVal(tr.children("td").eq(7), table[i-1].liftPos);
                        setVal(tr.children("td").eq(8), table[i-1].walkPos);
                        setVal(tr.children("td").eq(9), table[i-1].warnCode);
                        setVal(tr.children("td").eq(10), table[i-1].alarm);
                    }
                } else if (res.code === 403){
                    window.location.href = baseUrl+"/login";
                }  else {
                    console.log(res.msg);
                }
            }
        });
    }

    // 堆垛机数据表获取 ---- 表二
    function getCrnMsgInfo() {
        var tableEl = $('#crn-msg-table');
        $.ajax({
            url: baseUrl+ "/crn/table/crn/msg",
            headers: {'token': localStorage.getItem('token')},
            method: 'POST',
            success: function (res) {
                if (res.code === 200){
                    var table = res.data;
                    if (table.length > crnStateTableBlankRows && table.length !== crnMsgTableFullRows) {
                        initCrnStateTable(table.length-crnStateTableBlankRows);
                        crnMsgTableFullRows = table.length;
                    }
                    for (var i=1;i<=table.length;i++){
                        var tr = tableEl.find("tr").eq(i);
                        setVal(tr.children("td").eq(0), table[i-1].crnNo);
                        setVal(tr.children("td").eq(1), table[i-1].workNo);
                        setVal(tr.children("td").eq(2), table[i-1].status);
                        setVal(tr.children("td").eq(3), table[i-1].sourceStaNo);
                        setVal(tr.children("td").eq(4), table[i-1].staNo);
                        setVal(tr.children("td").eq(5), table[i-1].sourceLocNo);
                        setVal(tr.children("td").eq(6), table[i-1].locNo);
                        setVal(tr.children("td").eq(7), table[i-1].xspeed);
                        setVal(tr.children("td").eq(8), table[i-1].yspeed);
                        setVal(tr.children("td").eq(9), table[i-1].zspeed);
                        setVal(tr.children("td").eq(10), table[i-1].xdistance);
                        setVal(tr.children("td").eq(11), table[i-1].ydistance);
                        setVal(tr.children("td").eq(12), table[i-1].xduration);
                        setVal(tr.children("td").eq(13), table[i-1].yduration);
                    }
                } else if (res.code === 403){
                    window.location.href = baseUrl+"/login";
                }  else {
                    console.log(res.msg);
                }
            }
        });
    }

    // 堆垛机手动操作区 -----------------------------------------------------------------------

    function getReqParam() {
        var crnNo = $('input[name="crnSelect"]:checked').val();
        var sourceStaNo = $('#sourceStaNo').val();
        var sourceRow = $('#sourceRow').val();
        var sourceBay = $('#sourceBay').val();
        var sourceLev = $('#sourceLev').val();
        var staNo = $('#staNo').val();
        var row = $('#row').val();
        var bay = $('#bay').val();
        var lev = $('#lev').val();
        return {
            crnNo: crnNo,
            sourceStaNo: sourceStaNo,
            sourceRow: sourceRow,
            sourceBay: sourceBay,
            sourceLev: sourceLev,
            staNo: staNo,
            row: row,
            bay: bay,
            lev: lev
        };
    }

    // 入库
    function put() {
        http.post(baseUrl+"/crn/operator/put", getReqParam(), function (res) {
            layer.msg(res.msg);
        });
    }

    // 出库
    function take() {
        http.post(baseUrl+"/crn/operator/take", getReqParam(), function (res) {
            layer.msg(res.msg);
        });
    }

    // 库位转移
    function stockMove() {
        http.post(baseUrl+"/crn/operator/stockMove", getReqParam(), function (res) {
            layer.msg(res.msg);
        });
    }

    // 站到站
    function siteMove() {
        http.post(baseUrl+"/crn/operator/siteMove", getReqParam(), function (res) {
            layer.msg(res.msg);
        });
    }

    // 坐标移动
    function coorMove() {
        http.post(baseUrl+"/crn/operator/coorMove", getReqParam(), function (res) {
            layer.msg(res.msg);
        });
    }

    // 回原点
    function bacOrigin() {
        http.post(baseUrl+"/crn/operator/bacOrigin", getReqParam(), function (res) {
            layer.msg(res.msg);
        });
    }

    // 回原点
    function reverseOrigin() {
        http.post(baseUrl+"/crn/operator/reverseOrigin", getReqParam(), function (res) {
            layer.msg(res.msg);
        });
    }

    // 任务完成
    function taskComplete() {
        http.post(baseUrl+"/crn/operator/taskComplete", getReqParam(), function (res) {
            layer.msg(res.msg);
        });
    }

    // 暂停
    function pause() {
        http.post(baseUrl+"/crn/operator/pause", getReqParam(), function (res) {
            layer.msg(res.msg);
        });
    }

    // 启动
    function boot() {
        http.post(baseUrl+"/crn/operator/boot", getReqParam(), function (res) {
            layer.msg(res.msg);
        });
    }

    // 清除命令
    function clearCommand() {
        http.post(baseUrl+"/crn/operator/clearCommand", getReqParam(), function (res) {
            layer.msg(res.msg);
        });
    }

    // 手动复位
    function handleReset() {
        http.post(baseUrl+"/crn/operator/handleReset", getReqParam(), function (res) {
            layer.msg(res.msg);
        });
    }

    // 输送设备日志输出 -----------------------------------------------------------------------
    function getCrnOutput() {
        $.ajax({
            url: baseUrl + "/crn/output/site",
            headers: {'token': localStorage.getItem('token')},
            method: 'POST',
            success: function (res) {
                console.log(res)
                if (res.code === 200) {
                    crnOutput(res.data);
                } else if (res.code === 403) {
                    window.location.href = baseUrl + "/login";
                } else {
                    console.log(res.msg);
                }
            }
        })
    }

    // ------------------------------------------------------------------------------------------------

    // 堆垛机信息表获取  ----- 表一
    function initCrnStateTable(row) {
        var line;
        if (row === undefined){
            var one = $('#crn-state-table thead').height();
            var total = $('.crn-state').height();
            var count = total / one;
            count = parseInt(count) - 1;
            crnStateTableBlankRows = count;
            line = count;
        } else {
            line = row;
        }
        var html = "";
        for (var i = 0; i < line; i ++){
            html += " <tr>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "     </tr>\n";
        }
        $('#crn-state-table tbody').after(html);
    }

    // 堆垛机数据表获取  ----- 表二
    function initCrnMsgTable(row) {
        var line;
        if (row === undefined){
            var one = $('#crn-msg-table thead').height();
            var total = $('.crn-msg').height();
            var count = total / one;
            count = parseInt(count) - 1;
            crnMsgTableBlankRows = count;
            line = count;
        } else {
            line = row;
        }
        var html = "";
        for (var i = 0; i < line; i ++){
            html += " <tr>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "       <td></td>\n" +
                "     </tr>\n";
        }
        $('#crn-msg-table tbody').after(html);
    }

    // 日志输出框
    function crnOutput(content){
        crnOutputDom.value += content;
        crnOutputDom.scrollTop = crnOutputDom.scrollHeight;
    }


    var crnDemoData;
    function initDemo() {
        $.ajax({
            url: baseUrl+"/crn/demo/status",
            async: false,
            method: 'GET',
            success: function (res) {
                if (res.code === 200) {
                    crnDemoData = res.data;
                    crnDemoData.forEach(function (e) {
                        $("#demoBtn-"+e.crnNo).html(e.demo?'停止':'演示');
                    })
                } else if (res.code === 403){
                    parent.location.href = baseUrl+"/login";
                }  else {
                    layer.msg(res.msg, {icon: 2});
                }
            }
        })
    }

    function demoSwitch(el) {
        var crnId = el.split("-")[1];
        var opt;
        if (crnDemoData == null) {
            initDemo();
        }
        for (var i = 0; i<crnDemoData.length; i++) {
            if (Number(crnDemoData[i].crnNo) === Number(crnId)) {
                opt = !crnDemoData[i].demo;
            }
        }
        layer.confirm(crnId + ' 号堆垛机确定'+ (opt?'开始':'停止') + '演示吗？', function(){
            doDemo(crnId, 'root', opt); // 停止wcs系统
        });
    }

    function doDemo(crnId, password, opt) {
        // 加载tips
        var index = layer.load(1, {
            shade: [0.1,'#fff']
        });
        $.ajax({
            url: baseUrl+ "/crn/demo/switch",
            headers: {'token': localStorage.getItem('token')},
            // async: false,
            data: {
                crnId: Number(crnId),
                password: password,
                opt: opt
            },
            method: 'POST',
            success: function (res) {
                layer.close(index);
                if (res.code === 200){
                    layer.msg(res.msg, {icon: 1});
                } else if (res.code === 403){
                    window.location.href = baseUrl+"/login";
                }  else {
                    layer.msg(res.msg, {icon: 2});
                }
            }
        });

    }

            </div>
        </div>
        <hr class="layui-bg-gray">
        <div class="layui-form-item text-right">
            <button class="layui-btn" lay-filter="editSubmit" lay-submit="">保存</button>
            <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
        </div>
    </form>
</script>
</html>


 src/main/webapp/views/realtimeWatch/crn2.html

New file
@@ -0,0 +1,535 @@
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>堆垛机监控管理</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="stylesheet" type="text/css" href="../../static/wcs/css/normalize.css">
  <link rel="stylesheet" type="text/css" href="../../static/wcs/css/common.css">
  <link rel="stylesheet" type="text/css" href="../../static/wcs/css/crn.css">
  <script type="text/javascript" src="../../static/wcs/js/jquery/jquery-3.3.1.min.js"></script>
  <script type="text/javascript" src="../../static/wcs/js/common.js"></script>
  <script type="text/javascript" src="../../static/wcs/js/layer/layer.js"></script>
  <style>
    .demoBtn {
      vertical-align: middle;
      width: 20%;
      height: 25px;
      left: 0;
      top: 0;
      text-shadow: inherit;
      font-size: 15px;
      margin-left: 5px;
      margin-right: 5px;
      display: inline-block;
      background-color: #FF5722;
      border: none;
      color: #FFF;
      box-shadow: 1px 1px 5px #B6B6B6;
      border-radius: 3px;
      cursor: pointer;
    }

    .demoBtn:hover {
      opacity: 0.8
    }
    .demoBtn:focus {
      outline: 0;
    }
  </style>
</head>
<body>
<div style="padding: 10px;height: 100%;float: left;width: 6%">
  <div class="button-window"></div>
</div>
<div style="height: 100%;padding-left: 6%">
  <div style="padding: 10px;height: 100%">
    <!-- 日志监控板 -->
    <div class="log-board">
      <!-- 执行命令 -->

      <!-- 执行命令 -->
      <div class="command-log">
        <h3>执行中的命令</h3>
        <div class="crn-command-item">
          <label>1#</label>
          <button id="demoBtn-1" class="demoBtn" onclick="demoSwitch(this.id)"> - </button>
          <!--            <span>&nbsp;</span>-->
          <input id="crn1" disabled="disabled">
        </div>
        <div class="crn-command-item">
          <label>2#</label>
          <button id="demoBtn-2" class="demoBtn" onclick="demoSwitch(this.id)"> - </button>
          <!--            <span>&nbsp;</span>-->
          <input id="crn2" disabled="disabled">
        </div>
      </div>
      <!-- 堆垛机状态位信息 -->
      <div class="crn-state">
        <table id="crn-state-table">
          <thead>
          <tr>
            <th>堆垛机</th>
            <th>模式</th>
            <th>状态</th>
            <th>有物</th>
            <th>列</th>
            <th>层</th>
            <th>货叉定位</th>
            <th>载货台定位</th>
            <th>走行在定位</th>
            <th>故障代码</th>
            <th>故障描述</th>
          </tr>
          </thead>
          <tbody>
          </tbody>
        </table>
      </div>
    </div>
    <!-- 堆垛机状态 -->
    <div class="crn-msg">
      <table id="crn-msg-table">
        <thead>
        <tr>
          <th>堆垛机</th>
          <th>工作号</th>
          <th>状态</th>
          <th>源站</th>
          <th>目标站</th>
          <th>源库位</th>
          <th>目标库位</th>
          <th>走行速度（m/min)</th>
          <th>升降速度（m/min)</th>
          <th>叉牙速度（m/min)</th>
          <th>走行距离(Km)</th>
          <th>升降距离(Km)</th>
          <th>走行时长(H)</th>
          <th>升降时长(H)</th>
        </tr>
        </thead>
        <tbody>
        </tbody>
      </table>
    </div>
    <!-- 堆垛机日志输出 -->
    <div class="crn-output-board">
      <textarea id="crn-output"></textarea>
    </div>
  </div>
</div>
</body>
<script>
  // 空白行数
  var crnStateTableBlankRows = 0;
  var crnMsgTableBlankRows = 0;
  // 实际行数
  var crnStateTableFullRows = 0;
  var crnMsgTableFullRows = 0;
  // 初始化
  var crnOutputDom = document.getElementById("crn-output");
  $(document).ready(function() {
    getCommandLog();
    initCrnStateTable();
    getCrnStateInfo();
    initCrnMsgTable();
    getCrnMsgInfo();
    operatorBlockShow();
  });
  // 数据更新
  setInterval(function () {
    getCrnStateInfo();
    getCrnMsgInfo();
    getCommandLog();
  },1000);
  setInterval(function () {
    getCrnOutput();
    operatorBlockShow();
    initDemo();
  },500);

  // 判断手动操作模块是否可用
  function operatorBlockShow() {
    if (parent.systemRunning) {
      $('.crn-operation').css("opacity", "0.5");
      $('.crn-operation-shade').show();
      $('.crn-operation-shade-span').show();
    }  else {
      $('.crn-operation').css("opacity", "1");
      $('.crn-operation-shade').hide();
      $('.crn-operation-shade-span').hide();
    }
  }

  // 获取堆垛机执行中的命令
  function getCommandLog() {
    $.ajax({
      url: baseUrl + "/crn/command/ongoing",
      headers: {'token': localStorage.getItem('token')},
      method: 'POST',
      success: function (res) {
        if (res.code === 200) {
          var commands = res.data;
          for (var i=0; i<commands.length;i++){
            $("#crn"+commands[i].crnNo).val(commands[i].command);
          }
        } else if (res.code === 403) {
          window.location.href = baseUrl + "/login";
        } else {
          console.log(res.msg);
        }
      }
    })
  }

  // 堆垛机信息表获取 ---- 表一
  function getCrnStateInfo() {
    var tableEl = $('#crn-state-table');
    $.ajax({
      url: baseUrl+ "/crn/table/crn/state",
      headers: {'token': localStorage.getItem('token')},
      method: 'POST',
      success: function (res) {
        if (res.code === 200){
          var table = res.data;
          if (table.length > crnStateTableBlankRows && table.length !== crnStateTableFullRows) {
            initCrnStateTable(table.length-crnStateTableBlankRows);
            crnStateTableFullRows = table.length;
          }
          for (var i=1;i<=table.length;i++){
            var tr = tableEl.find("tr").eq(i);
            setVal(tr.children("td").eq(0), table[i-1].crnNo);
            setVal(tr.children("td").eq(1), table[i-1].statusType);
            setVal(tr.children("td").eq(2), table[i-1].status);
            setVal(tr.children("td").eq(3), table[i-1].loading);
            setVal(tr.children("td").eq(4), table[i-1].bay);
            setVal(tr.children("td").eq(5), table[i-1].lev);
            setVal(tr.children("td").eq(6), table[i-1].forkOffset);
            setVal(tr.children("td").eq(7), table[i-1].liftPos);
            setVal(tr.children("td").eq(8), table[i-1].walkPos);
            setVal(tr.children("td").eq(9), table[i-1].warnCode);
            setVal(tr.children("td").eq(10), table[i-1].alarm);
          }
        } else if (res.code === 403){
          window.location.href = baseUrl+"/login";
        }  else {
          console.log(res.msg);
        }
      }
    });
  }

  // 堆垛机数据表获取 ---- 表二
  function getCrnMsgInfo() {
    var tableEl = $('#crn-msg-table');
    $.ajax({
      url: baseUrl+ "/crn/table/crn/msg",
      headers: {'token': localStorage.getItem('token')},
      method: 'POST',
      success: function (res) {
        if (res.code === 200){
          var table = res.data;
          if (table.length > crnStateTableBlankRows && table.length !== crnMsgTableFullRows) {
            initCrnStateTable(table.length-crnStateTableBlankRows);
            crnMsgTableFullRows = table.length;
          }
          for (var i=1;i<=table.length;i++){
            var tr = tableEl.find("tr").eq(i);
            setVal(tr.children("td").eq(0), table[i-1].crnNo);
            setVal(tr.children("td").eq(1), table[i-1].workNo);
            setVal(tr.children("td").eq(2), table[i-1].status);
            setVal(tr.children("td").eq(3), table[i-1].sourceStaNo);
            setVal(tr.children("td").eq(4), table[i-1].staNo);
            setVal(tr.children("td").eq(5), table[i-1].sourceLocNo);
            setVal(tr.children("td").eq(6), table[i-1].locNo);
            setVal(tr.children("td").eq(7), table[i-1].xspeed);
            setVal(tr.children("td").eq(8), table[i-1].yspeed);
            setVal(tr.children("td").eq(9), table[i-1].zspeed);
            setVal(tr.children("td").eq(10), table[i-1].xdistance);
            setVal(tr.children("td").eq(11), table[i-1].ydistance);
            setVal(tr.children("td").eq(12), table[i-1].xduration);
            setVal(tr.children("td").eq(13), table[i-1].yduration);
          }
        } else if (res.code === 403){
          window.location.href = baseUrl+"/login";
        }  else {
          console.log(res.msg);
        }
      }
    });
  }

  // 堆垛机手动操作区 -----------------------------------------------------------------------

  function getReqParam() {
    var crnNo = $('input[name="crnSelect"]:checked').val();
    var sourceStaNo = $('#sourceStaNo').val();
    var sourceRow = $('#sourceRow').val();
    var sourceBay = $('#sourceBay').val();
    var sourceLev = $('#sourceLev').val();
    var staNo = $('#staNo').val();
    var row = $('#row').val();
    var bay = $('#bay').val();
    var lev = $('#lev').val();
    return {
      crnNo: crnNo,
      sourceStaNo: sourceStaNo,
      sourceRow: sourceRow,
      sourceBay: sourceBay,
      sourceLev: sourceLev,
      staNo: staNo,
      row: row,
      bay: bay,
      lev: lev
    };
  }

  // 入库
  function put() {
    http.post(baseUrl+"/crn/operator/put", getReqParam(), function (res) {
      layer.msg(res.msg);
    });
  }

  // 出库
  function take() {
    http.post(baseUrl+"/crn/operator/take", getReqParam(), function (res) {
      layer.msg(res.msg);
    });
  }

  // 库位转移
  function stockMove() {
    http.post(baseUrl+"/crn/operator/stockMove", getReqParam(), function (res) {
      layer.msg(res.msg);
    });
  }

  // 站到站
  function siteMove() {
    http.post(baseUrl+"/crn/operator/siteMove", getReqParam(), function (res) {
      layer.msg(res.msg);
    });
  }

  // 坐标移动
  function coorMove() {
    http.post(baseUrl+"/crn/operator/coorMove", getReqParam(), function (res) {
      layer.msg(res.msg);
    });
  }

  // 回原点
  function bacOrigin() {
    http.post(baseUrl+"/crn/operator/bacOrigin", getReqParam(), function (res) {
      layer.msg(res.msg);
    });
  }

  // 回原点
  function reverseOrigin() {
    http.post(baseUrl+"/crn/operator/reverseOrigin", getReqParam(), function (res) {
      layer.msg(res.msg);
    });
  }

  // 任务完成
  function taskComplete() {
    http.post(baseUrl+"/crn/operator/taskComplete", getReqParam(), function (res) {
      layer.msg(res.msg);
    });
  }

  // 暂停
  function pause() {
    http.post(baseUrl+"/crn/operator/pause", getReqParam(), function (res) {
      layer.msg(res.msg);
    });
  }

  // 启动
  function boot() {
    http.post(baseUrl+"/crn/operator/boot", getReqParam(), function (res) {
      layer.msg(res.msg);
    });
  }

  // 清除命令
  function clearCommand() {
    http.post(baseUrl+"/crn/operator/clearCommand", getReqParam(), function (res) {
      layer.msg(res.msg);
    });
  }

  // 手动复位
  function handleReset() {
    http.post(baseUrl+"/crn/operator/handleReset", getReqParam(), function (res) {
      layer.msg(res.msg);
    });
  }

  // 输送设备日志输出 -----------------------------------------------------------------------
  function getCrnOutput() {
    $.ajax({
      url: baseUrl + "/crn/output/site",
      headers: {'token': localStorage.getItem('token')},
      method: 'POST',
      success: function (res) {
        console.log(res)
        if (res.code === 200) {
          crnOutput(res.data);
        } else if (res.code === 403) {
          window.location.href = baseUrl + "/login";
        } else {
          console.log(res.msg);
        }
      }
    })
  }

  // ------------------------------------------------------------------------------------------------

  // 堆垛机信息表获取  ----- 表一
  function initCrnStateTable(row) {
    var line;
    if (row === undefined){
      var one = $('#crn-state-table thead').height();
      var total = $('.crn-state').height();
      var count = total / one;
      count = parseInt(count) - 1;
      crnStateTableBlankRows = count;
      line = count;
    } else {
      line = row;
    }
    var html = "";
    for (var i = 0; i < line; i ++){
      html += " <tr>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "     </tr>\n";
    }
    $('#crn-state-table tbody').after(html);
  }

  // 堆垛机数据表获取  ----- 表二
  function initCrnMsgTable(row) {
    var line;
    if (row === undefined){
      var one = $('#crn-msg-table thead').height();
      var total = $('.crn-msg').height();
      var count = total / one;
      count = parseInt(count) - 1;
      crnMsgTableBlankRows = count;
      line = count;
    } else {
      line = row;
    }
    var html = "";
    for (var i = 0; i < line; i ++){
      html += " <tr>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "       <td></td>\n" +
              "     </tr>\n";
    }
    $('#crn-msg-table tbody').after(html);
  }

  // 日志输出框
  function crnOutput(content){
    crnOutputDom.value += content;
    crnOutputDom.scrollTop = crnOutputDom.scrollHeight;
  }


  var crnDemoData;
  function initDemo() {
    $.ajax({
      url: baseUrl+"/crn/demo/status",
      async: false,
      method: 'GET',
      success: function (res) {
        if (res.code === 200) {
          crnDemoData = res.data;
          crnDemoData.forEach(function (e) {
            $("#demoBtn-"+e.crnNo).html(e.demo?'停止':'演示');
          })
        } else if (res.code === 403){
          parent.location.href = baseUrl+"/login";
        }  else {
          layer.msg(res.msg, {icon: 2});
        }
      }
    })
  }

  function demoSwitch(el) {
    var crnId = el.split("-")[1];
    var opt;
    if (crnDemoData == null) {
      initDemo();
    }
    for (var i = 0; i<crnDemoData.length; i++) {
      if (Number(crnDemoData[i].crnNo) === Number(crnId)) {
        opt = !crnDemoData[i].demo;
      }
    }
    layer.confirm(crnId + ' 号堆垛机确定'+ (opt?'开始':'停止') + '演示吗？', function(){
      doDemo(crnId, 'root', opt); // 停止wcs系统
    });
  }

  function doDemo(crnId, password, opt) {
    // 加载tips
    var index = layer.load(1, {
      shade: [0.1,'#fff']
    });
    $.ajax({
      url: baseUrl+ "/crn/demo/switch",
      headers: {'token': localStorage.getItem('token')},
      // async: false,
      data: {
        crnId: Number(crnId),
        password: password,
        opt: opt
      },
      method: 'POST',
      success: function (res) {
        layer.close(index);
        if (res.code === 200){
          layer.msg(res.msg, {icon: 1});
        } else if (res.code === 403){
          window.location.href = baseUrl+"/login";
        }  else {
          layer.msg(res.msg, {icon: 2});
        }
      }
    });

  }

</script>
</html>