From d35752fd91d6f0703231c576b69e66c0f0ff41a5 Mon Sep 17 00:00:00 2001 From: vincent <1341870251@qq.com> Date: 星期六, 30 五月 2020 16:15:27 +0800 Subject: [PATCH] # --- src/main/webapp/views/index.html | 11 src/main/webapp/static/css/pipeline.css | 35 +++ src/main/webapp/views/pipeline.html | 547 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 588 insertions(+), 5 deletions(-) diff --git a/src/main/webapp/static/css/pipeline.css b/src/main/webapp/static/css/pipeline.css new file mode 100644 index 0000000..87346ad --- /dev/null +++ b/src/main/webapp/static/css/pipeline.css @@ -0,0 +1,35 @@ +body { + padding: 10px; + background-color: #f1f1f1; +} +main { + background-color: #fff; + height: 85%; + border-radius: 5px; + box-shadow: 0 0 3px rgba(0,0,0,.3); + margin-bottom: 8px; +} +.main-board { + float: left; + width: 50%; + height: 100%; + overflow: auto; +} +.main-board:first-child { + border-right: 1px solid #cad9ea; +} + +/* 灏鹃儴 */ +footer { + height: 11%; + background-color: #fff; + border-radius: 5px; + box-shadow: 0 0 3px rgba(0,0,0,.3); +} +#output { + width: 100%; + height: 100%; + overflow: auto; + onpropertychange: "this.scrollTop = this.scrollHeight"; + 慰nf慰cus: "this.scrollTop = this.scrollHeight " +} \ No newline at end of file diff --git a/src/main/webapp/views/index.html b/src/main/webapp/views/index.html index ea07837..3597ce9 100644 --- a/src/main/webapp/views/index.html +++ b/src/main/webapp/views/index.html @@ -23,25 +23,26 @@ <body> <!-- 瀵艰埅鏍� --> <ul class="nav"> - <li><a id="stock" onclick="nav(this.id)" class="nav-select" href="#">涓绘帶鍥�</a></li> - <li><a id="crn" onclick="nav(this.id)" class="nav-unselect" href="#">杈撻�佽澶�</a></li> - <li><a id="led" onclick="nav(this.id)" class="nav-unselect" href="#">鍫嗗灈鏈�</a></li> + <li><a id="console" onclick="nav(this.id)" class="nav-select" href="#">涓绘帶鍥�</a></li> + <li><a id="pipeline" onclick="nav(this.id)" class="nav-unselect" href="#">杈撻�佽澶�</a></li> + <li><a id="crn" onclick="nav(this.id)" class="nav-unselect" href="#">鍫嗗灈鏈�</a></li> <li class="right"><a id="about" class="nav-unselect" onclick="nav(this.id)" href="#">鍏充簬</a></li> </ul> <!-- 涓讳綋鍐呭 --> - <iframe id="content" src="console.html"></iframe> + <iframe id="content" src="pipeline.html"></iframe> <footer class="footer"> Copyright 漏 2015 All Rights Reserved. <a href="http://www.zoneyung.com" target="_blank">娴欐睙涓壃鐗╂祦瑁呭鏈夐檺鍏徃</a> 淇濈暀鎵�鏈夋潈鍒� </footer> </body> <script> + // 瀵艰埅鏍� function nav(id) { $('.nav-select').attr("class", "nav-unselect"); $('#'+id).attr("class", "nav-select"); + $('#content').attr("src", id+".html"); } - </script> </html> diff --git a/src/main/webapp/views/pipeline.html b/src/main/webapp/views/pipeline.html new file mode 100644 index 0000000..7a3fd2f --- /dev/null +++ b/src/main/webapp/views/pipeline.html @@ -0,0 +1,547 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8"> + <title>WCS杈撻�佽澶囩鐞�</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/pipeline.css"> + <script type="text/javascript" src="../static/js/jquery/jquery-3.3.1.min.js"></script> + <script type="text/javascript" src="../static/js/layer/layer.js"></script> + <style> + .plc-log-header { + height: 15%; + } + .plc-log-body { + height: 85%; + overflow: auto; + } + + + /* 绔欑偣琛ㄦ牸 */ + #site-table { + font-size: 12px; + border-collapse: collapse; + margin: 0 auto; + text-align: center; + } + #site-table td, #site-table th { + border: 1px solid #cad9ea; + color: #666; + height: 25px; + } + #site-table thead th { + background-color: #CCE8EB; + width: 100px; + } + #site-table tr:nth-child(odd) { + background: #fff; + } + #site-table tr:nth-child(even) { + background: #F5FAFA; + } + + + + /* plc寮傚父琛ㄦ牸 */ + #plc-error-table { + font-size: 12px; + border-collapse: collapse; + margin: 0 auto; + } + #plc-error-table td, #plc-error-table th { + border: 1px solid #cad9ea; + color: #666; + height: 25px; + text-align: left; + padding-left: 5px; + } + #plc-error-table thead th { + background-color: #CCE8EB; + width: 100px; + } + #plc-error-table tr:nth-child(odd) { + background: #fff; + } + #plc-error-table tr:nth-child(even) { + background: #F5FAFA; + } + + </style> +</head> +<body> +<main> + <!-- plc寮傚父鏃ュ織鐩戞帶鐗� --> + <div id="plc-error" class="main-board" style="padding-left: 10px"> + <!-- 澶撮儴 --> + <div class="plc-log-header"> + <div style="height: 50%"> + <span>涓滀晶PLC鎵ц鎸囦护</span> + </div> + <div style="height: 50%"> + <span>瑗夸晶PLC鎵ц鎸囦护</span> + </div> + </div> + <!-- 涓讳綋 --> + <div class="plc-log-body"> + <span>PLC寮傚父淇℃伅</span> + <table id="plc-error-table"> + <thead> + <tr> + <th style="width: 200px">搴忓彿</th> + <th style="width: 400px">PLC閿欒鎻忚堪</th> + <th style="width: 400px">寮傚父</th> + </tr> + </thead> + <tbody> + <tr> + <td>23532</td> + <td>PLC閿欒鎻忚堪PLC閿欒鎻忚堪1</td> + <td>寮傚父寮傚父寮傚父寮傚父寮傚父寮傚父寮傚父</td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + </tr> + </tbody> + </table> + </div> + </div> + + <!-- 绔欑偣鐘舵�佹暟鎹洃鎺х増 --> + <div id="site-monitor" class="main-board"> + <!-- 琛ㄦ牸 --> + <table id="site-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> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + <tr> + <td>12</td> + <td>2223</td> + <td>Y</td> + <td>Y</td> + <td>Y</td> + <td>N</td> + <td>Y</td> + <td>N</td> + <td>1</td> + <td>1204</td> + </tr> + </tbody> + </table> + </div> +</main> +<footer> + <textarea id="output"></textarea> +</footer> +</body> +<script> + var outputDom = document.getElementById("output"); + function output(content){ + outputDom.value += content; + outputDom.scrollTop = outputDom.scrollHeight; + } + setInterval(function () { + output("\n" +new Date().toLocaleString() + "銆�2020-5-29 13:14:22銆戞壂鎻弍lcA 鐩爣绔�--27328372372832763643234323432342"); + },500); + + +</script> +</html> \ No newline at end of file -- Gitblit v1.9.1