zy-wcs.git - Gitblit

parent: 0aa7e5ed | 补丁 | 提交 | ignore whitespace

vincent

2020-06-01 7beb05d90c35c4cffbf171e3cdf7784a6861ecea

2个文件已修改

1个文件已添加

	src/main/webapp/static/css/crn.css	123 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/main/webapp/views/crn.html	136 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/main/webapp/views/index.html	2 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史

 src/main/webapp/static/css/crn.css

New file
@@ -0,0 +1,123 @@
body {
    padding: 10px;
    background-color: #f1f1f1;
}

/* 第一模块 */
.log-board {
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 3px rgba(0,0,0,.3);
    height: 25%;
}

/* 左 */
.command-log {
    float: left;
    height: 100%;
    width: 20%;
    text-align: center;
}
.command-log h2 {
    padding: 10px;
}
.crn-command-item {
    padding: 20px 0;
}
.crn-command-item label {
    font-size: 20px;
    font-weight: bold;
    vertical-align: middle;
}
.crn-command-item span {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-color: #2e9926;
    border-radius: 5px;
    vertical-align: middle;
}
.crn-command-item input {
    vertical-align: middle;
    outline: none;
    width: 70%;
}

/* 右 */
.crn-state {
    float: left;
    height: 100%;
    width: 80%;
    overflow: hidden;
}
/* 堆垛机状态表 */
#crn-state-table {
    font-size: 12px;
    border-collapse: collapse;
    margin: 0 auto;
    text-align: center;
}
#crn-state-table td, #crn-state-table th {
    border: 1px solid #cad9ea;
    color: #666;
    height: 25px;
}
#crn-state-table thead th {
    background-color: #CCE8EB;
    width: 300px;
}
#crn-state-table tr:nth-child(odd) {
    background: #fff;
}
#crn-state-table tr:nth-child(even) {
    background: #F5FAFA;
}

/* 第二模块 */
.crn-msg {
    overflow: hidden;
    margin-top: 10px;
    height: 20%;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 3px rgba(0,0,0,.3);
}
/* 堆垛机状态信息表 */
#crn-msg-table {
    font-size: 12px;
    border-collapse: collapse;
    margin: 0 auto;
    text-align: center;
}
#crn-msg-table td, #crn-msg-table th {
    border: 1px solid #cad9ea;
    color: #666;
    height: 25px;
}
#crn-msg-table thead th {
    background-color: #CCE8EB;
    width: 400px;
}
#crn-msg-table tr:nth-child(odd) {
    background: #fff;
}
#crn-msg-table tr:nth-child(even) {
    background: #F5FAFA;
}

/* 第三模块 */
.crn-operation {
    margin-top: 10px;
    height: 25%;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 3px rgba(0,0,0,.3);
}

.crn-output {
    margin-top: 10px;
    height: 23%;
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 3px rgba(0,0,0,.3);
}

 src/main/webapp/views/crn.html

@@ -2,9 +2,141 @@
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <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/css/normalize.css">
    <link rel="stylesheet" type="text/css" href="../static/css/common.css">
    <link rel="stylesheet" type="text/css" href="../static/css/crn.css">
    <script type="text/javascript" src="../static/js/jquery/jquery-3.3.1.min.js"></script>
    <style>

    </style>
</head>
<body>
<h1>LED</h1>
<!-- 日志监控板 -->
<div class="log-board">
    <!-- 执行命令 -->
    <div class="command-log">
        <h2>执行中的命令</h2>
        <div class="crn-command-item">
            <label>1#</label>
            <span>&nbsp;</span>
            <input id="crn1" disabled="disabled">
        </div>
        <div class="crn-command-item">
            <label>2#</label>
            <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>
                    <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>异常</th>
                <th>原点</th>
                <th>命令</th>
            </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
</div>
<!-- 手动操作 -->
<div class="crn-operation">

</div>
<!-- 堆垛机日志输出 -->
<div class="crn-output">

</div>
</body>
<script>

    // 空白表格渲染
    $(document).ready(function() {
        // 表一
        var one1 = $('#crn-state-table thead').height();
        var total1 = $('.crn-state').height();
        var count1 = total1 / one1;
        count1 = parseInt(count1);
        var html1 = "";
        for (var i = 0; i < count1; i ++){
            html1 += " <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" +
                "     </tr>\n";
        }
        $('#crn-state-table tbody').after(html1);

        // 表二
        var one2 = $('#crn-msg-table thead').height();
        var total2 = $('.crn-msg').height();
        var count2 = total2 / one2;
        count2 = parseInt(count2);
        var html2 = "";
        for (var i = 0; i < count2; i ++){
            html2 += " <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" +
                "     </tr>\n";
        }
        $('#crn-msg-table tbody').after(html2);
    });

</script>
</html>

 src/main/webapp/views/index.html

@@ -30,7 +30,7 @@
  </ul>

  <!-- 主体内容 -->
  <iframe id="content" src="pipeline.html"></iframe>
  <iframe id="content" src="crn.html"></iframe>

  <footer class="footer">
    Copyright © 2015 All Rights Reserved. <a href="http://www.zoneyung.com" target="_blank">浙江中扬物流装备有限公司</a>  保留所有权利

New file
			@@ -0,0 +1,123 @@
			body {
			padding: 10px;
			background-color: #f1f1f1;
			}

			/* 第一模块 */
			.log-board {
			background-color: #fff;
			border-radius: 5px;
			box-shadow: 0 0 3px rgba(0,0,0,.3);
			height: 25%;
			}

			/* 左 */
			.command-log {
			float: left;
			height: 100%;
			width: 20%;
			text-align: center;
			}
			.command-log h2 {
			padding: 10px;
			}
			.crn-command-item {
			padding: 20px 0;
			}
			.crn-command-item label {
			font-size: 20px;
			font-weight: bold;
			vertical-align: middle;
			}
			.crn-command-item span {
			display: inline-block;
			width: 20px;
			height: 20px;
			background-color: #2e9926;
			border-radius: 5px;
			vertical-align: middle;
			}
			.crn-command-item input {
			vertical-align: middle;
			outline: none;
			width: 70%;
			}

			/* 右 */
			.crn-state {
			float: left;
			height: 100%;
			width: 80%;
			overflow: hidden;
			}
			/* 堆垛机状态表 */
			#crn-state-table {
			font-size: 12px;
			border-collapse: collapse;
			margin: 0 auto;
			text-align: center;
			}
			#crn-state-table td, #crn-state-table th {
			border: 1px solid #cad9ea;
			color: #666;
			height: 25px;
			}
			#crn-state-table thead th {
			background-color: #CCE8EB;
			width: 300px;
			}
			#crn-state-table tr:nth-child(odd) {
			background: #fff;
			}
			#crn-state-table tr:nth-child(even) {
			background: #F5FAFA;
			}

			/* 第二模块 */
			.crn-msg {
			overflow: hidden;
			margin-top: 10px;
			height: 20%;
			background-color: #fff;
			border-radius: 5px;
			box-shadow: 0 0 3px rgba(0,0,0,.3);
			}
			/* 堆垛机状态信息表 */
			#crn-msg-table {
			font-size: 12px;
			border-collapse: collapse;
			margin: 0 auto;
			text-align: center;
			}
			#crn-msg-table td, #crn-msg-table th {
			border: 1px solid #cad9ea;
			color: #666;
			height: 25px;
			}
			#crn-msg-table thead th {
			background-color: #CCE8EB;
			width: 400px;
			}
			#crn-msg-table tr:nth-child(odd) {
			background: #fff;
			}
			#crn-msg-table tr:nth-child(even) {
			background: #F5FAFA;
			}

			/* 第三模块 */
			.crn-operation {
			margin-top: 10px;
			height: 25%;
			background-color: #fff;
			border-radius: 5px;
			box-shadow: 0 0 3px rgba(0,0,0,.3);
			}

			.crn-output {
			margin-top: 10px;
			height: 23%;
			background-color: #fff;
			border-radius: 5px;
			box-shadow: 0 0 3px rgba(0,0,0,.3);
			}

			@@ -2,9 +2,141 @@
			<html lang="en">
			<head>
			<meta charset="UTF-8">
			<title>Title</title>
			<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/css/normalize.css">
			<link rel="stylesheet" type="text/css" href="../static/css/common.css">
			<link rel="stylesheet" type="text/css" href="../static/css/crn.css">
			<script type="text/javascript" src="../static/js/jquery/jquery-3.3.1.min.js"></script>
			<style>

			</style>
			</head>
			<body>
			<h1>LED</h1>
			<!-- 日志监控板 -->
			<div class="log-board">
			<!-- 执行命令 -->
			<div class="command-log">
			<h2>执行中的命令</h2>
			<div class="crn-command-item">
			<label>1#</label>
			<span> </span>
			<input id="crn1" disabled="disabled">
			</div>
			<div class="crn-command-item">
			<label>2#</label>
			<span> </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>
			<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>异常</th>
			<th>原点</th>
			<th>命令</th>
			</tr>
			</thead>
			<tbody>
			</tbody>
			</table>
			</div>
			<!-- 手动操作 -->
			<div class="crn-operation">

			</div>
			<!-- 堆垛机日志输出 -->
			<div class="crn-output">

			</div>
			</body>
			<script>

			// 空白表格渲染
			$(document).ready(function() {
			// 表一
			var one1 = $('#crn-state-table thead').height();
			var total1 = $('.crn-state').height();
			var count1 = total1 / one1;
			count1 = parseInt(count1);
			var html1 = "";
			for (var i = 0; i < count1; i ++){
			html1 += " <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" +
			" </tr>\n";
			}
			$('#crn-state-table tbody').after(html1);

			// 表二
			var one2 = $('#crn-msg-table thead').height();
			var total2 = $('.crn-msg').height();
			var count2 = total2 / one2;
			count2 = parseInt(count2);
			var html2 = "";
			for (var i = 0; i < count2; i ++){
			html2 += " <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" +
			" </tr>\n";
			}
			$('#crn-msg-table tbody').after(html2);
			});

			</script>
			</html>

			@@ -30,7 +30,7 @@
			</ul>

			<!-- 主体内容 -->
			<iframe id="content" src="pipeline.html"></iframe>
			<iframe id="content" src="crn.html"></iframe>

			<footer class="footer">
			Copyright © 2015 All Rights Reserved. <a href="http://www.zoneyung.com" target="_blank">浙江中扬物流装备有限公司</a> 保留所有权利