From 059270c12f452fcc3344b826f35295fd7c20906e Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@163.com>
Date: 星期二, 21 三月 2023 08:31:37 +0800
Subject: [PATCH] #
---
views/index.html | 442 ++++++++++++++++++++++++++++++++++---------------------
1 files changed, 274 insertions(+), 168 deletions(-)
diff --git a/views/index.html b/views/index.html
index 9685af0..0d2268f 100644
--- a/views/index.html
+++ b/views/index.html
@@ -1,185 +1,291 @@
<!DOCTYPE html>
<html lang="en">
- <head>
- <title></title>
- <meta charset="utf-8">
- <meta name="generator" content="Three.js Editor">
- <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
- <style>
- body {
- font-family: sans-serif;
- font-size: 11px;
- background-color: #000;
- margin: 0;
- }
- canvas {
- display: block;
- }
- #sidebar{
- /*瀹氫綅*/
- position: absolute;
- top: 50%;
- left: 1%;
- transform: translateY(-50%);
- width: 20%;
- height: 95%;
- /*鐗规晥*/
- background: rgba(255,255,255,0.3);
- border-radius: 5px;
- color: #f0f8ff;
- }
- #sidebar h1{
- font-family: Fantasy;
- font-size: 36px;
- text-indent: 5%;
- }
- #baobiao1{
- width: 400px;
- height: 300px;
- }
+<head>
+ <title></title>
+ <meta charset="utf-8">
+ <meta name="generator" content="Three.js Editor">
+ <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
+ <link rel="stylesheet" href="../static/css/main.css">
+ <link rel="stylesheet" href="../static/css/index.css">
+ <link rel="stylesheet" href="../static/css/loader.css" media="all">
+ <script type="text/javascript" src="../static/js/lib/jquery-3.3.1.min.js"></script>
+ <script type="text/javascript" src="../static/js/common.js"></script>
+ <script type="text/javascript" src="../static/js/data/Asrs.js"></script>
+ <script type="text/javascript" src="../static/js/utils.js"></script>
+ <script type="text/javascript" src="../static/js/lib/echarts.min.js"></script>
+ <script type="text/javascript" src="../static/js/data/BuildingData.js"></script>
+ <script type="text/javascript" src="../static/js/data/ConveyData.js"></script>
+ <script type="text/javascript" src="../static/js/object/Cube.js"></script>
+ <script type="text/javascript" src="../static/js/object/StoreArea.js"></script>
+ <script type="text/javascript" src="../static/js/object/Store.js"></script>
+ <script type="text/javascript" src="../static/js/object/StoreGroup.js"></script>
+ <script type="text/javascript" src="../static/js/object/Route.js"></script>
+ <script type="text/javascript" src="../static/js/object/CrnTask.js"></script>
+ <script type="text/javascript" src="../static/js/object/Floor.js"></script>
+ <script type="text/javascript" src="../static/js/object/ObjectSelect.js"></script>
+ <script type="text/javascript" src="../static/js/utils/DataShow.js"></script>
+</head>
+<body>
+
+<div id="label"></div>
+
+<!-- 鎺у埗闈㈡澘 -->
+<div id="sidebar">
+ <button id="sidebar-btn" onclick="sidebar()">灞曠ず</button>
+ <div class="sidebar-contain" >
+ <div class="sidebar-header">
+ <div class="t">涓壃绔嬪簱</div>
+ <div class="i">Zoneyung Intelligent Three-Dimensional Warehouse</div>
+ </div>
+ <div class="sidebar-main">
+ <!-- 浠诲姟 -->
+ <div class="task-box">
+ <div class="task-title">
+ 鍑哄簱浣滀笟
+ </div>
+ <div class="task-rbl">
+ <select class="task-select">
+ <option value="1">1</option>
+ <option value="2">2</option>
+ <option value="2">3</option>
+ <option value="2">4</option>
+ <option value="2">5</option>
+ <option value="2">6</option>
+ <option value="2">7</option>
+ <option value="2">8</option>
+ <option value="2">9</option>
+ <option value="1">10</option>
+ <option value="1">11</option>
+ <option value="2">12</option>
+ <option value="2">13</option>
+ <option value="2">14</option>
+ <option value="2">15</option>
+ <option value="2">16</option>
+ <option value="2">17</option>
+ <option value="2">18</option>
+ <option value="2">19</option>
+ </select>
+ <select class="task-select">
+ <option value="1">1</option>
+ <option value="2">2</option>
+ <option value="2">3</option>
+ <option value="2">4</option>
+ <option value="2">5</option>
+ <option value="2">6</option>
+ <option value="2">7</option>
+ <option value="2">8</option>
+ <option value="2">9</option>
+ <option value="1">10</option>
+ <option value="1">11</option>
+ <option value="2">12</option>
+ <option value="2">13</option>
+ <option value="2">14</option>
+ <option value="2">15</option>
+ <option value="2">16</option>
+ <option value="2">17</option>
+ <option value="2">18</option>
+ <option value="2">19</option>
+ </select>
+ <select class="task-select">
+ <option value="1">1</option>
+ <option value="2">2</option>
+ <option value="2">3</option>
+ <option value="2">4</option>
+ <option value="2">5</option>
+ <option value="2">6</option>
+ <option value="2">7</option>
+ <option value="2">8</option>
+ <option value="2">9</option>
+ <option value="1">10</option>
+ <option value="1">11</option>
+ <option value="2">12</option>
+ <option value="2">13</option>
+ <option value="2">14</option>
+ <option value="2">15</option>
+ <option value="2">16</option>
+ <option value="2">17</option>
+ <option value="2">18</option>
+ <option value="2">19</option>
+ </select>
+ </div>
+ <div class="task-confirm">
+ </div>
+ </div>
+ <!-- 鎶ヨ〃 -->
+ <div class="charts-box">
+ <!-- 琛� 1 -->
+ <div id="io-chart"></div>
+ <!-- 琛� 2 -->
+ <div class="io-msg">
+ <div class="tbl-header">
+ <table border="0" cellspacing="0" cellpadding="0" >
+ <thead>
+ <tr>
+ <th>璁惧绫诲瀷</th>
+ <th>缂栧彿</th>
+ <th>鎶ユ枃鏁版嵁</th>
+ <th>鏃堕棿</th>
+ </tr>
+ </thead>
+ <tbody style="opacity:0;" ></tbody>
+ </table>
+ </div>
+ <div class="tbl-body">
+ <table border="0" cellspacing="0" cellpadding="0">
+ <thead>
+ <tr>
+ <th>璁惧绫诲瀷</th>
+ <th>缂栧彿</th>
+ <th>鎶ユ枃鏁版嵁</th>
+ <th>鏃堕棿</th>
+ </tr>
+ </thead>
+ <tbody></tbody>
+ </table>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
- </style>
- </head>
- <body style="position: relative">
- <div id="sidebar">
- <h1>涓壃-绔嬩綋浠撳簱</h1>
- <div id="baobiao1"></div>
+<div id="mask" class="mask"></div>
+<div id="title-box" class="title-box">
+ <div id="title" class="title"><i>A</i><i>S</i><i> </i><i>/</i><i> </i><i>R</i><i>S</i><i> </i><i>-</i><i> </i><i>W</i><i> </i><i>C</i><i> </i><i>S</i></div>
+ <div class="say">
+ <p>鑷姩鍖栦粨搴撴帶鍒剁郴缁燂紝鏄粙浜嶹MS鍜孭LC涔嬮棿鐨勪竴灞傜鐞嗘帶鍒剁郴缁�</p>
+ <p>鍙互鍗忚皟鍚勭鐗╂祦璁惧濡傝緭閫佹満銆佸爢鍨涙満銆佺┛姊溅浠ュ強鏈哄櫒浜恒�佽嚜鍔ㄥ寮曞皬杞︾瓑鐗╂祦璁惧涔嬮棿鐨勮繍琛�</p>
+ <p>"WAREHOUSE CONTROL SYSTEM"</p>
+ </div>
+ <div class="use">
+ <div></div>
+ 銆婁腑鎵珛搴撱��
+ </div>
+</div>
+<img id="logo" class="logo" src="../static/img/logo0.png" alt=""/>
+<div id="ship-info-box" class="ship-info-box">
+ <div class="ship-type pointernone">
+ <ul id="ship-type-ul">
+ <li>鍒濆鍖�</li>
+ <li>寰呮満鈥�</li>
+ <li>鎮ㄧ幇鍦ㄥ彲浠ヨ嚜鐢辩Щ鍔ㄨ瑙�</li>
+ </ul>
+ </div>
+ <div class="speed pointernone"><span id="speed">0</span> <i id="speed-unit">%</i></div>
+ <div id="ship-info-btn" class="btn" data-type="1">
+ <div id="btn-lock"></div>
+ <div class="btn-word">鍚姩</div>
+ <div class="line line1"></div>
+ <div class="line line2"></div>
+ </div>
+ <div id="control-remind" class="remind">鎮ㄧ幇鍦ㄥ彲浠ヨ嚜鐢辩Щ鍔ㄨ瑙�</div>
+</div>
+<ul class="menu" id="menu">
+ <li id="menu-w">
+ <div><div>涓�</div></div>
+ </li>
+ <li id="menu-m">
+ <div><div>宸�</div></div>
+ </li>
+ <li id="menu-t">
+ <div><div>淇�</div></div>
+ </li>
+ <li id="menu-b">
+ <div><div>杩�</div></div>
+ </li>
+</ul>
- </div>
- <div id="container"></div>
- <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts@5.2.2/dist/echarts.min.js"></script>
- <script type="text/javascript">
- var dom = document.getElementById("baobiao1");
- var myChart = echarts.init(dom);
- var app = {};
+<div id="container"></div>
+<script type="text/javascript" src="../static/js/data/sidebar.js"></script>
+</body>
+<script type="module">
- var option;
+ import * as THREE from '../static/js/three.module.js';
+ import { APP } from '../static/js/app.js';
+ window.THREE = THREE;
+ var player = new APP.Player();
+ player.start();
- option = {
- title: {
- text: '骞村害杩�/鍑鸿揣閲�',
- textStyle:{
- color:'#F8F8FF',
- },
- subtext: 'Data',
- subtextStyle:{
- color:'#F8F8FF',
- },
- show: true,
+ document.getElementById("btn-lock").addEventListener('click', function () {
+ player.lockControl();
+ removeClass(document.getElementById("ship-info-btn"), "show");
+ document.getElementById("ship-type-ul").style.transform = 'translateY(-60px)';
+ }, false);
- },
- tooltip: {
- trigger: 'axis'
- },
- textStyle:{
- color:'#F8F8FF',
- },
- // subtextStyle:{
- // color:'#F8F8FF',
- // },
- // tooltip: {
- // trigger: 'axis'
- // },
- legend: {
- show:false,
- data: ['杩涜揣', '鍑鸿揣']
- },
- toolbox: {
- show: false,
- feature: {
- dataView: { show: true, readOnly: false },
- magicType: { show: true, type: ['line', 'bar'] },
- restore: { show: true },
- saveAsImage: { show: true }
- }
- },
- calculable: true,
- xAxis: [
- {
- color:'#ffffff',
- type: 'category',
- // prettier-ignore
- data: ['涓�鏈�', '浜屾湀', '涓夋湀', '鍥涙湀', '浜旀湀', '鍏湀', '涓冩湀', '鍏湀', '涔濇湀', '鍗佹湀', '鍗佷竴鏈�', '鍗佷簩鏈�']
- }
- ],
- yAxis: [
- {
- // show:false,
- type: 'value'
- }
- ],
- series: [
- {
- color:['#F8F8FF'],
- name: '杩涜揣',
- type: 'bar',
- data: [
- 2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3
- ],
- // markPoint: {
- // data: [
- // { type: 'max', name: 'Max' },
- // { type: 'min', name: 'Min' }
- // ]
- // },
- // markLine: {
- // data: [{ type: 'average', name: 'Avg' }]
- // }
- },
- {
- color:['#C0C0C0'],
- name: '鍑鸿揣',
- type: 'bar',
- data: [
- 2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
- ],
- // markPoint: {
- // data: [
- // { name: 'Max', value: 182.2, xAxis: 7, yAxis: 183 },
- // { name: 'Min', value: 2.3, xAxis: 11, yAxis: 3 }
- // ]
- // },
- // markLine: {
- // data: [{ type: 'average', name: 'Avg' }]
- // }
- }
- ],
+ document.getElementById("menu-w").addEventListener('click', function () {
+ player.mainView();
+ }, false);
- };
+ document.getElementById("menu-m").addEventListener('click', function () {
+ player.leftView();
+ }, false);
- if (option && typeof option === 'object') {
- myChart.setOption(option);
- }
+ document.getElementById("menu-t").addEventListener('click', function () {
+ player.verticalView();
+ }, false);
- </script>
- <script type="text/javascript" src="../static/js/lib/jquery-3.3.1.min.js"></script>
- <script type="text/javascript" src="../static/js/common.js"></script>
- <script type="text/javascript" src="../static/js/data/Warehouse.js"></script>
- <script type="text/javascript" src="../static/js/object/Cube.js"></script>
- <script type="text/javascript" src="../static/js/object/StoreArea.js"></script>
- <script type="text/javascript" src="../static/js/object/Store.js"></script>
- <script type="text/javascript" src="../static/js/object/StoreGroup.js"></script>
- <script type="text/javascript" src="../static/js/object/StoreShelf.js"></script>
- <script type="text/javascript" src="../static/js/object/StoreGoods.js"></script>
- <script type="module">
+ document.getElementById("menu-b").addEventListener('click', function () {
+ player.backlView();
+ }, false);
+</script>
+<script type="text/javascript">
+ var percent = 0;
+ var shipInfoBtn = document.getElementById("ship-info-btn");
+ var speedDom = document.getElementById("speed");
+ var timer = setInterval(function () {
+ if (percent < 100.00) {
+ // percent += 0.04;
+ percent += 1;
+ speedDom.innerText = percent.toFixed(2);
+ } else {
+ speedDom.innerText = '100.00';
+ if (!hasClass(shipInfoBtn, "show")) {
+ addClass(shipInfoBtn, "show")
+ clearInterval(timer);
+ }
+ }
+ }, 1);
- import * as THREE from '../static/js/three.module.js';
- import { APP } from '../static/js/app.js';
+ $(document).on('click','.btn-word', function () {
+ fullScreen();
+ $("#mask").fadeOut(1, function () { // 3000
+ $("#menu").addClass("show");
+ setTimeout(function () {
+ $("#ship-type-ul").css("transform", "translateY(-40px)");
+ if (window.screen.width > 600) {
+ $("#ship-info-btn .btn-word").text("浣撻獙璋冨害涓栫晫");
+ $("#ship-info-btn").data("type", 2).addClass("show");
+ $("#ship-info-btn #btn-lock").css("z-index", "10");
+ $('#sidebar-btn').show();
+ }
+ $("#menu li").css("transition", "all 200ms !important");
+ setTimeout(function () {
+ removeClass(document.getElementById("title-box"), "show");
+ }, 5000);
+ }, 1); // 1000
+ });
+ $("#title-box, #logo").addClass("show");
+ $("#ship-info-btn").removeClass("show");
+ $('.speed.pointernone').addClass("hide");
+ $("#ship-type-ul").css("transform", "translateY(-20px)");
+ });
- window.THREE = THREE;
+ // 寮�濮嬫ā鎷�
+ $(document).on('click','.task-confirm', function () {
+ $.ajax({
+ url: 'http://localhost:9090/jkwcs/three/start',
+ type: "GET",
+ data: {},
+ success: function (res) {
+ if (res.code !== 200) {
+ alert(res.msg);
+ }
+ }
+ })
+ })
- var player = new APP.Player();
- player.start();
-
- // document.body.appendChild( player.dom );
- // window.addEventListener( 'resize', function () {
- // player.setSize( window.innerWidth, window.innerHeight );
- // } );
-
-
- </script>
- </body>
+</script>
</html>
--
Gitblit v1.9.1