From 4aa39baac48fc4dd1b8555bb776bd020bbcbe50b Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@63.com>
Date: 星期一, 22 八月 2022 16:16:19 +0800
Subject: [PATCH] #
---
src/main/webapp/views/console.html | 77 +++++++++++++++++++++++++++++++++++---
src/main/webapp/static/css/console.css | 43 ++++++++++++++++++---
2 files changed, 107 insertions(+), 13 deletions(-)
diff --git a/src/main/webapp/static/css/console.css b/src/main/webapp/static/css/console.css
index 8136289..d0e4efc 100644
--- a/src/main/webapp/static/css/console.css
+++ b/src/main/webapp/static/css/console.css
@@ -288,19 +288,16 @@
position: absolute;
top: 122px;
}
-/* 杈撻�佺嚎绗竴鍒� */
.site-row-1 {
- top: 205px;
- left: 120px;
+ top: 67px;
+ left: 392px;
}
.site-row-1 .site {
width: 80px;
}
-
-/* 杈撻�佺嚎绗簩鍒� */
.site-row-2 {
top: 67px;
- left: 400px;
+ left: 474px;
}
.site-row-2 .site {
width: 80px;
@@ -497,6 +494,40 @@
margin-right: 80px;
}
+/* ------------------ 鍙拌溅 ------------------ */
+/* 杞ㄩ亾 */
+.car-track {
+ position: absolute;
+}
+.car-track-across {
+ position: absolute;
+}
+.car-track div {
+ height: 100%;
+ display: inline-block;
+ width: 75%;
+ border-left: 5px solid #313131;
+ border-right: 5px solid #313131;
+}
+.car-track-across div {
+ height: 80%;
+ display: inline-block;
+ width: 100%;
+ border-top: 3px solid #313131;
+ border-bottom: 3px solid #313131;
+}
+#car-track-1 {
+ text-align: center;
+ width: 70px;
+ height: 605px;
+ top: 0;
+ left: 6px;
+}
+
+/* 杞� */
+.car {
+ position: absolute;
+}
/* 寮圭獥 */
diff --git a/src/main/webapp/views/console.html b/src/main/webapp/views/console.html
index 662c1e3..80838b6 100644
--- a/src/main/webapp/views/console.html
+++ b/src/main/webapp/views/console.html
@@ -16,15 +16,23 @@
<h6>AUTOMATIC WAREHOUSE WCS MONITORING DIAGRAM</h6>
</header>
<main class="main">
- <!--绗�1鍒楋紙瀹藉害 70px锛� -->
-<!-- <div class="site-row site-row-1">-->
-<!-- <div class="site-k" style="height:39px;width:70px;"></div>-->
-<!-- <div id="site-173" class="site" style="height: 18px;line-height: 18px;margin-bottom: 85px">173</div>-->
-<!-- </div>-->
+ <!--绗�1鍒� -->
+ <div class="site-row site-row-1">
+ <div id="site-102" class="site" style="height: 18px;line-height: 18px;width:80px;margin-top: 340px">102</div>
+
+ <div id="site-101" class="site" style="height: 18px;line-height: 18px;width:80px;margin-top: 20px">101</div>
+
+ <div id="site-100" class="site" style="height: 18px;line-height: 18px;width:80px;margin-top: 184px">100</div>
+ </div>
<!--绗�2鍒�-->
<div class="site-row site-row-2">
- <div id="site-1000" class="site" style="height: 18px;line-height: 18px;">1000</div>
- <div id="site-2000" class="site" style="height: 18px;line-height: 18px;">2000</div>
+ <!-- 鍙拌溅杞ㄩ亾 -->
+ <div id="car-track-1" class="car-track">
+ <div></div>
+ </div>
+ <!-- 鍙拌溅瀹炰緥 -->
+ <div id="site-1000" class="site car">1000</div>
+ <div id="site-2000" class="site car">2000</div>
</div>
<!-- 绗�3鍒� -->
<div class="site-row site-row-3">
@@ -1374,6 +1382,61 @@
$('#barcode3').append(str3)
}
}
+
+ // 灏忚溅鍋忕Щ鍔ㄧ敾
+ function carAnimate(id, target) {
+ if (id === 1000) {
+ let targetTop = 130;
+ switch (target) {
+ case 110:
+ targetTop += 0;
+ break;
+ case 109:
+ targetTop += 60;
+ break;
+ case 108:
+ targetTop += 100;
+ break;
+ case 107:
+ targetTop += 180;
+ break;
+ case 106:
+ targetTop += 220;
+ break;
+ default:
+ return;
+ }
+ $("#site-" + id).animate({top: targetTop+'px'}, 1000);
+ } else if (id === 2000) {
+ let targetTop = 130;
+ switch (target) {
+ case 226:
+ targetTop += 0;
+ break;
+ case 225:
+ targetTop += 60;
+ break;
+ case 224:
+ targetTop += 100;
+ break;
+ case 223:
+ targetTop += 180;
+ break;
+ case 222:
+ targetTop += 220;
+ break;
+ case 214:
+ targetTop += 280;
+ break;
+ case 220:
+ targetTop += 320;
+ break;
+ default:
+ return;
+ }
+ $("#site-" + id).animate({top: targetTop+'px'}, 1000);
+ }
+ }
</script>
<script type="text/javascript">
// 寮圭獥绔欑偣淇℃伅
--
Gitblit v1.9.1