ASRS-3D.git - Gitblit

			@@ -1,196 +1,274 @@
			<!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/data/Asrs.js"></script>
			<script type="text/javascript" src="../static/js/utils.js"></script>
			<script type="text/javascript" src="../static/js/common.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>
			</head>
			<body>

			<!-- 控制面板 -->
			<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>自动化仓库控制系统，是介于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>
			<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';

			option = {
			xAxis: {
			type: 'category',
			data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
			},
			yAxis: {
			type: 'value'
			},
			series: [
			{
			data: [120, 200, 150, 80, 70, 110, 130],
			type: 'bar'
			}
			]
			};
			window.THREE = THREE;

			option && myChart.setOption(option);
			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);

			// option = {
			// title: {
			// text: '年度进/出货量',
			// textStyle:{
			// color:'#F8F8FF',
			// },
			// subtext: 'Data',
			// subtextStyle:{
			// color:'#F8F8FF',
			// },
			// show: true,
			//
			// },
			// 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: [
			// {
			// type: 'category',
			// // prettier-ignore
			// data: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月']
			// }
			// ],
			// yAxis: [
			// {
			// // show:false,
			// type: 'value'
			// }
			// ],
			// series: [
			// {
			// 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' }]
			// }
			// },
			// {
			// 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' }]
			// }
			// }
			// ],
			//
			// };
			//
			// if (option && typeof option === 'object') {
			// myChart.setOption(option);
			// }
			document.getElementById("menu-w").addEventListener('click', function () {
			player.mainView();
			}, 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-m").addEventListener('click', function () {
			player.leftView();
			}, false);

			import * as THREE from '../static/js/three.module.js';
			import { APP } from '../static/js/app.js';
			document.getElementById("menu-t").addEventListener('click', function () {
			player.verticalView();
			}, false);

			window.THREE = THREE;
			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);

			var player = new APP.Player();
			player.start();
			$(document).on('click','.btn-word', function () {
			fullScreen();
			$("#mask").fadeOut(3000, 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);
			}, 1000); // 1000
			});
			$("#title-box, #logo").addClass("show");
			$("#ship-info-btn").removeClass("show");
			$('.speed.pointernone').addClass("hide");
			$("#ship-type-ul").css("transform", "translateY(-20px)");
			});

			// document.body.appendChild( player.dom );
			// window.addEventListener( 'resize', function () {
			// player.setSize( window.innerWidth, window.innerHeight );
			// } );


			</script>
			</body>
			</script>
			</html>