From f240886676a7fdcf50c11db965797903b952482c Mon Sep 17 00:00:00 2001
From: zhangc <zc@123>
Date: 星期一, 19 一月 2026 10:10:48 +0800
Subject: [PATCH] 1
---
src/main/webapp/views/pipeline.html | 614 +++++++++++++++++++++++++++++++++++--------------------
1 files changed, 385 insertions(+), 229 deletions(-)
diff --git a/src/main/webapp/views/pipeline.html b/src/main/webapp/views/pipeline.html
index 384f97d..857a6f7 100644
--- a/src/main/webapp/views/pipeline.html
+++ b/src/main/webapp/views/pipeline.html
@@ -1,259 +1,415 @@
<!DOCTYPE html>
-<html lang="en">
+<html lang="zh-CN">
<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/common.js"></script>
+ <title>WCS杈撻�佽澶囩鐞�</title>
+ <link rel="stylesheet" href="../static/css/normalize.css">
+ <link rel="stylesheet" href="../static/css/common.css">
+ <link rel="stylesheet" href="../static/css/pipeline.css">
<style>
-
+ .io-mode-box {
+ float: left;
+ width: 16%;
+ text-align: center;
+ }
+
+ .io-mode-box label {
+ font-weight: bolder;
+ }
+
+ .ioModeBtn {
+ vertical-align: middle;
+ width: 50%;
+ height: 30px;
+ text-shadow: inherit;
+ font-size: 15px;
+ margin: 0 5px;
+ display: inline-block;
+ background-color: #FF5722;
+ border: none;
+ color: #FFF;
+ box-shadow: 1px 1px 5px #B6B6B6;
+ border-radius: 3px;
+ cursor: pointer;
+ }
</style>
+ <script src="../static/js/jquery/jquery-3.3.1.min.js"></script>
+ <script src="../static/js/common.js"></script>
+ <script src="../static/js/layer/layer.js"></script>
</head>
<body>
-<main>
- <!-- plc寮傚父鏃ュ織鐩戞帶鐗� -->
- <div id="plc-error" class="main-board" style="padding-left: 10px">
- <!-- 澶撮儴 -->
- <div class="plc-log-header">
- <div style="height: 40%">
- <span>涓滀晶PLC鎵ц鎸囦护</span>
- </div>
- <div style="height: 40%">
- <span>瑗夸晶PLC鎵ц鎸囦护</span>
- </div>
- <div>
- <span style="color: #1E9FFF">PLC寮傚父淇℃伅琛�:</span>
+ <!-- 宸︿晶鎸夐挳鍖哄煙 -->
+ <aside class="sidebar" style="padding: 10px; height: 100%; float: left; width: 6%;">
+ <div class="button-window"></div>
+ </aside>
+
+ <!-- 涓诲唴瀹瑰尯鍩� -->
+ <div class="main-content" style="height: 100%; padding-left: 6%;">
+ <div class="container" style="padding: 10px; height: 100%;">
+ <!-- 涓昏鍐呭 -->
+ <main>
+ <!-- 绔欑偣鐘舵�佹暟鎹洃鎺х増 -->
+ <section id="site-monitor" class="main-board">
+ <!-- 琛ㄦ牸 -->
+ <!-- 鍥哄畾琛ㄥご锛歵able鍔爐able-layout: fixed; th鍔爌osition:sticky;top: 0; -->
+ <table id="site-table" class="status-table" style="table-layout: fixed;">
+ <!-- 琛ㄥご -->
+ <thead class="table-header" style="position:sticky;top: 0;">
+ <tr>
+ <th>绔欏彿</th>
+ <th>宸ヤ綔鍙�</th>
+ <th>鑷姩</th>
+ <th>鏈夌墿</th>
+ <th>鍙叆</th>
+ <th>鍙嚭</th>
+ <th>鍏ュ簱鏍囪</th>
+ <th>绌烘澘淇″彿</th>
+ <th>鐩爣绔�</th>
+ <th>楂樹綆搴撲綅</th>
+ </tr>
+ </thead>
+ <!-- 琛ㄦ牸鍐呭 -->
+ <tbody class="table-body"></tbody>
+ </table>
+ </section>
+ </main>
+
+ <!-- 椤佃剼鍖哄煙 -->
+ <footer>
+ <textarea id="output" class="output-log"></textarea>
+ </footer>
+
+ <!-- 绔欑偣璇︽儏寮圭獥 -->
+ <div id="site-detl" class="site-detail-form" style="display: none;">
+ <form class="detail-form">
+ <div class="form-item">
+ <label class="form-label" for="siteId">绔欏彿:</label>
+ <div class="form-input">
+ <input id="siteId" name="siteId" class="layui-input" type="number" lay-verify="required|number" autocomplete="off" disabled="disabled">
+ </div>
+ </div>
+ <div class="form-item">
+ <label class="form-label" for="workNo">宸ヤ綔鍙�:</label>
+ <div class="form-input">
+ <input id="workNo" name="workNo" type="number" class="layui-input" lay-verify="number" autocomplete="off">
+ </div>
+ </div>
+ <div class="form-item">
+ <label class="form-label" for="staNo">鐩爣绔�:</label>
+ <div class="form-input">
+ <input id="staNo" name="staNo" type="number" class="layui-input" lay-verify="number" autocomplete="off">
+ </div>
+ </div>
+ <div class="form-item">
+ <label class="form-label" for="pakMk">鍏ュ簱鏍囪:</label>
+ <div class="form-input">
+ <input id="pakMk" name="pakMk" type="text" class="layui-input" autocomplete="off">
+ </div>
+ </div>
+ <div class="form-item form-button-container">
+ <button type="button" class="form-button" id="save">淇濆瓨</button>
+ <button type="button" class="form-button" id="cancel" style="background-color: #D0D0D0;">鍙栨秷</button>
+ </div>
+ </form>
</div>
</div>
- <!-- 涓讳綋 -->
- <div class="plc-log-body">
- <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>
-
- </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></tbody>
- </table>
- </div>
-</main>
-<footer>
- <textarea id="output"></textarea>
-</footer>
</body>
<script>
- // 鍒濆鍖�
- // 绌虹櫧琛屾暟
- var plcErrorTableBlankRows = 0;
- var siteTableBlankRows = 0;
- // 瀹為檯琛屾暟
- var plcErrorTableFullRows = 0;
- var siteTableFullRows = 0;
- var outputDom = document.getElementById("output");
- $(document).ready(function() {
- initPlcErrorTable();
- getPlcError();
- initSiteTable();
- getSite();
- });
- // 瀹炴椂璁块棶
- setInterval(function () {
- getPlcError();
- getSite();
- }, 1000);
- setInterval(function () {
- getSiteOutput();
- },500);
+ // 鑷墽琛屽嚱鏁拌〃杈惧紡锛岄伩鍏嶅叏灞�鍙橀噺姹℃煋
+ (function() {
+ // 鍒濆鍖栧彉閲�
+ let isSiteUpdatePaused = false;
+ let plcErrorTableBlankRows = 0;
+ let siteTableBlankRows = 0;
+ let plcErrorTableFullRows = 0;
+ let siteTableFullRows = 0;
+ const outputDom = document.getElementById("output");
+ let ioModeData = [];
+ let layerDetl = null;
+ let timers = [];
+
+ // DOM鍔犺浇瀹屾垚鍚庡垵濮嬪寲
+ $(document).ready(function() {
+ // 鍒濆鍖栬〃鏍�
+ initPlcErrorTable();
+ initSiteTable();
+
+ // 鍔犺浇鍒濆鏁版嵁
+ getPlcError();
+ getSite();
+
+ // 鍒濆鍖栧畾鏃跺櫒
+ initTimers();
+ });
+
+ // 鍒濆鍖栧畾鏃跺櫒
+ function initTimers() {
+ // 姣忕鏇存柊PLC閿欒銆佺珯鐐逛俊鎭拰IO妯″紡
+ timers.push(setInterval(() => {
+ getPlcError();
+ if (!isSiteUpdatePaused) {
+ getSite();
+ }
+ getIoModeInfo();
+ }, 1000));
+
+ // 姣�500姣鏇存柊绔欑偣杈撳嚭鏃ュ織
+ timers.push(setInterval(() => {
+ getSiteOutput();
+ }, 500));
+ }
- // plc寮傚父淇℃伅琛ㄨ幏鍙�
- function getPlcError() {
- var tableEl = $('#plc-error-table');
- tableEl.children("tr").children("td").html("");
- $.ajax({
- url: baseUrl+ "/site/table/plc/errors",
- headers: {'token': localStorage.getItem('token')},
- method: 'POST',
- success: function (res) {
- if (res.code === 200){
- var table = res.data;
- for (var i=1;i<=table.length;i++){
- var tr = tableEl.find("tr").eq(i);
- tr.children("td").eq(0).html(table[i-1].no);
- tr.children("td").eq(1).html(table[i-1].plcDesc);
- tr.children("td").eq(2).html(table[i-1].error);
+
+ /**
+ * 寮哄埗鍒囨崲鍏ュ嚭搴撴ā寮�
+ * @param {string} el - 鍏冪礌ID
+ */
+ function ioModeSwitch(el) {
+ const floor = el.split("-")[2];
+ const targetFloor = ioModeData.find(e => e.floor === Number(floor));
+
+ if (targetFloor && (targetFloor.modeVal === 3 || targetFloor.modeVal === 4)) {
+ layer.confirm('纭畾鍒囨崲涓哄叆搴撴ā寮忓悧锛�', () => {
+ ajaxRequest({
+ url: `${baseUrl}/site/io/mode/action/site`,
+ method: 'POST',
+ data: { floor: targetFloor.floor },
+ success: (res) => {
+ layer.msg("鏆傛椂涓嶈兘鍒囨崲锛�", { icon: 1 });
+ }
+ });
+ layer.closeAll();
+ });
+ }
+ }
+
+ // 鑾峰彇PLC寮傚父淇℃伅琛�
+ function getPlcError() {
+ const tableEl = $('#plc-error-table');
+ tableEl.children("tr").children("td").html("");
+
+ ajaxRequest({
+ url: `${baseUrl}/site/table/plc/errors`,
+ method: 'POST',
+ success: (res) => {
+ if (res.data) {
+ const tableData = res.data;
+ for (let i = 0; i < tableData.length; i++) {
+ const tr = tableEl.find("tr").eq(i + 1);
+ tr.children("td").eq(0).html(tableData[i].no);
+ tr.children("td").eq(1).html(tableData[i].plcDesc);
+ tr.children("td").eq(2).html(tableData[i].error);
+ }
}
- } else if (res.code === 403){
- top.location.href = baseUrl+"/login";
- } else {
+ }
+ });
+ }
+
+ // 鑾峰彇绔欑偣淇℃伅琛�
+ function getSite() {
+ const tableEl = $('#site-table');
+
+ ajaxRequest({
+ url: `${baseUrl}/site/table/site`,
+ method: 'POST',
+ success: (res) => {
+ if (res.data) {
+ const tableData = res.data;
+ if (tableData.length > siteTableBlankRows && tableData.length !== siteTableFullRows) {
+ initSiteTable(tableData.length - siteTableBlankRows);
+ siteTableFullRows = tableData.length;
+ }
+
+ for (let i = 0; i < tableData.length; i++) {
+ const tr = tableEl.find("tr").eq(i + 1);
+ setVal(tr.children("td").eq(0), tableData[i].devNo);
+ setVal(tr.children("td").eq(1), tableData[i].workNo);
+ setVal(tr.children("td").eq(2), tableData[i].autoing);
+ setVal(tr.children("td").eq(3), tableData[i].loading);
+ setVal(tr.children("td").eq(4), tableData[i].inEnable);
+ setVal(tr.children("td").eq(5), tableData[i].outEnable);
+ setVal(tr.children("td").eq(6), tableData[i].pakMk);
+ setVal(tr.children("td").eq(7), tableData[i].emptyMk);
+ setVal(tr.children("td").eq(8), tableData[i].staNo);
+ setVal(tr.children("td").eq(9), tableData[i].locType1);
+ }
+ }
+ }
+ });
+ }
+
+ // 鑾峰彇杈撻�佽澶囨棩蹇楄緭鍑�
+ function getSiteOutput() {
+ ajaxRequest({
+ url: `${baseUrl}/site/output/site`,
+ method: 'POST',
+ success: (res) => {
+ if (res.data) {
+ output(res.data);
+ }
+ },
+ error: (res) => {
alert(res.msg);
}
+ });
+ }
+
+ // 鏃ュ織杈撳嚭妗�
+ function output(content) {
+ outputDom.value += content;
+ outputDom.scrollTop = outputDom.scrollHeight;
+ }
+
+ // PLC寮傚父绌虹櫧琛ㄦ牸娓叉煋
+ function initPlcErrorTable(row) {
+ let line;
+ if (row === undefined) {
+ const one = $('#plc-error-table thead').height();
+ const total = $('.plc-log-body').height();
+ const count = parseInt(total / one) - 1;
+ plcErrorTableBlankRows = count;
+ line = count;
+ } else {
+ line = row;
+ }
+
+ let html = "";
+ for (let i = 0; i < line; i++) {
+ html += ` <tr>
+ <td></td>
+ <td></td>
+ <td></td>
+ </tr>`;
+ }
+ $('#plc-error-table tbody').after(html);
+ }
+
+ // 绔欑偣绌虹櫧琛ㄦ牸娓叉煋
+ function initSiteTable(row) {
+ let line;
+ if (row === undefined) {
+ const one = $('#site-table thead').height();
+ const total = $('#site-monitor').height();
+ const count = parseInt(total / one) - 1;
+ siteTableBlankRows = count;
+ line = count;
+ } else {
+ line = row;
+ }
+
+ let html = "";
+ for (let i = 0; i < line; i++) {
+ html += ` <tr>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ <td></td>
+ </tr>`;
+ }
+ $('#site-table tbody').after(html);
+ }
+
+ // 璇︽儏鎿嶄綔
+ $(document).on('dblclick', '#site-table tr', function() {
+ isSiteUpdatePaused = true;
+ const siteId = $(this).children("td").eq(0).html();
+
+ if (siteId) {
+ layerDetl = layer.open({
+ type: 1,
+ title: false,
+ shadeClose: true,
+ offset: 'rt',
+ anim: 5,
+ shade: [0],
+ area: ['340px', '255px'],
+ closeBtn: 0,
+ content: $("#site-detl"),
+ success: (layero, index) => {
+ http.get(`${baseUrl}/site/detl/${siteId}`, null, (res) => {
+ if (res.data) {
+ $('#siteId').val(siteId);
+ $('#workNo').val(res.data.workNo);
+ $('#staNo').val(res.data.staNo);
+ $('#pakMk').val(res.data.pakMk);
+ }
+ });
+ },
+ end: () => {
+ $('#siteId').val("");
+ $('#workNo').val("");
+ $('#staNo').val("");
+ $('#pakMk').val("");
+ isSiteUpdatePaused = false;
+ }
+ });
}
});
- }
- // 绔欑偣淇℃伅琛ㄨ幏鍙�
- function getSite() {
- var tableEl = $('#site-table');
- $.ajax({
- url: baseUrl+ "/site/table/site",
- headers: {'token': localStorage.getItem('token')},
- method: 'POST',
- success: function (res) {
- if (res.code === 200){
- var table = res.data;
- if (table.length > siteTableBlankRows && table.length !== siteTableFullRows) {
- initSiteTable(table.length-siteTableBlankRows);
- siteTableFullRows = 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].devNo);
- setVal(tr.children("td").eq(1), table[i-1].workNo);
- setVal(tr.children("td").eq(2), table[i-1].autoing);
- setVal(tr.children("td").eq(3), table[i-1].loading);
- setVal(tr.children("td").eq(4), table[i-1].canining);
- setVal(tr.children("td").eq(5), table[i-1].canouting);
- setVal(tr.children("td").eq(6), table[i-1].inreqIn);
- setVal(tr.children("td").eq(7), table[i-1].inreqOut);
- setVal(tr.children("td").eq(8), table[i-1].highLow);
- setVal(tr.children("td").eq(9), table[i-1].staNo);
-
- // tr.children("td").eq(0).html(table[i-1].devNo);
- // tr.children("td").eq(1).html(table[i-1].workNo);
- // tr.children("td").eq(2).html(table[i-1].autoing);
- // tr.children("td").eq(3).html(table[i-1].loading);
- // tr.children("td").eq(4).html(table[i-1].canining);
- // tr.children("td").eq(5).html(table[i-1].canouting);
- // tr.children("td").eq(6).html(table[i-1].inreqIn);
- // tr.children("td").eq(7).html(table[i-1].inreqOut);
- // tr.children("td").eq(8).html(table[i-1].highLow);
- // tr.children("td").eq(9).html(table[i-1].staNo);
- }
- } else if (res.code === 403){
- top.location.href = baseUrl+"/login";
- } else {
- alert(res.msg);
- }
- }
+ // 淇濆瓨绔欑偣淇℃伅
+ $(document).on('click', '#save', function() {
+ http.post(`${baseUrl}/site/detl/update`, {
+ siteId: $('#siteId').val(),
+ workNo: $('#workNo').val(),
+ staNo: $('#staNo').val(),
+ pakMk: $('#pakMk').val()
+ }, (res) => {
+ layer.msg("淇敼鎴愬姛", { icon: 1 });
+ });
});
- }
- // 杈撻�佽澶囨棩蹇楄緭鍑�
- function getSiteOutput() {
- $.ajax({
- url: baseUrl + "/site/output/site",
- headers: {'token': localStorage.getItem('token')},
- method: 'POST',
- success: function (res) {
- if (res.code === 200) {
- output(res.data);
- } else if (res.code === 403) {
- top.location.href = baseUrl + "/login";
- } else {
- alert(res.msg);
+ // 鍙栨秷绔欑偣淇℃伅淇敼
+ $(document).on('click', '#cancel', function() {
+ $('#siteId').val("");
+ $('#workNo').val("");
+ $('#staNo').val("");
+ $('#pakMk').val("");
+ layer.close(layerDetl);
+ });
+
+ // 閫氱敤AJAX璇锋眰鍑芥暟
+ function ajaxRequest(options) {
+ const defaultOptions = {
+ headers: { 'token': localStorage.getItem('token') },
+ success: () => {},
+ error: () => {}
+ };
+
+ const opts = { ...defaultOptions, ...options };
+
+ $.ajax({
+ url: opts.url,
+ headers: opts.headers,
+ method: opts.method,
+ data: opts.data,
+ success: (res) => {
+ if (res.code === 200) {
+ opts.success(res);
+ } else if (res.code === 403) {
+ window.location.href = `${baseUrl}/login`;
+ } else {
+ console.log(res.msg);
+ //opts.error(res);
+ }
+ },
+ error: (jqXHR, textStatus, errorThrown) => {
+ console.error('AJAX Error:', textStatus, errorThrown);
+ //opts.error({ msg: '璇锋眰澶辫触锛岃绋嶅悗閲嶈瘯' });
}
- }
- })
- }
-
- // 鏃ュ織杈撳嚭妗�
- function output(content){
- outputDom.value += content;
- outputDom.scrollTop = outputDom.scrollHeight;
- }
-
- // ------------------------------------------------------------------------------------------------
-
- // plc寮傚父绌虹櫧琛ㄦ牸娓叉煋
- function initPlcErrorTable(row) {
- var line;
- if (row === undefined){
- var one = $('#plc-error-table thead').height();
- var total = $('.plc-log-body').height();
- var count = total / one;
- count = parseInt(count) - 1;
- plcErrorTableBlankRows = 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" +
- " </tr>\n";
- }
- $('#plc-error-table tbody').after(html);
- }
-
- // 绔欑偣绌虹櫧琛ㄦ牸娓叉煋
- function initSiteTable(row) {
- var line;
- if (row === undefined){
- var one = $('#site-table thead').height();
- var total = $('#site-monitor').height();
- var count = total / one;
- count = parseInt(count) - 1;
- siteTableBlankRows = 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" +
- " </tr>\n";
- }
- $('#site-table tbody').after(html);
- }
+ })();
</script>
</html>
\ No newline at end of file
--
Gitblit v1.9.1