<!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">
|
<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>
|
|
|
<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>自动化仓库控制系统，是介于WMS和PLC之间的一层管理控制系统</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 id="container"></div>
|
<script type="text/javascript" src="../static/js/data/sidebar.js"></script>
|
</body>
|
<script type="module">
|
|
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();
|
|
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);
|
|
document.getElementById("menu-w").addEventListener('click', function () {
|
player.mainView();
|
}, false);
|
|
document.getElementById("menu-m").addEventListener('click', function () {
|
player.leftView();
|
}, false);
|
|
document.getElementById("menu-t").addEventListener('click', function () {
|
player.verticalView();
|
}, false);
|
|
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);
|
|
$(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)");
|
});
|
|
// 开始模拟
|
$(document).on('click','.task-confirm', function () {
|
$.ajax({
|
// url: 'http://47.97.1.152:58080/jkwcs/three/start',
|
url: 'http://localhost:9090/jkwcs/three/start',
|
type: "GET",
|
data: {},
|
success: function (res) {
|
if (res.code !== 200) {
|
alert(res.msg);
|
}
|
}
|
})
|
})
|
|
</script>
|
</html>
|
