From 4d767348e1c46630edbc8faf4c90a77795dbc399 Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@63.com>
Date: 星期二, 21 十二月 2021 13:30:17 +0800
Subject: [PATCH] #

---
 views/index.html |  533 ++++++++++++----------------------------------------------
 1 files changed, 115 insertions(+), 418 deletions(-)

diff --git a/views/index.html b/views/index.html
index 6418e92..a806627 100644
--- a/views/index.html
+++ b/views/index.html
@@ -1,432 +1,129 @@
 <!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/lib/echarts.min.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/data/Asrs.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/StoreGoods.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/lib/btnHide.js"></script>
-	</head>
-	<body style="position: relative">
-	<!--鍒濆鍖栧姞杞藉眰-->
-	<div class="layuimini-loader">
-		<div class="layuimini-loader-inner"></div>
-	</div>
+<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/lib/echarts.min.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/data/Asrs.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/StoreGoods.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/lib/btnHide.js"></script>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+        }
+        html {
+            height: 100%;
+        }
+        body {
+            height: 100%;
+        }
 
-	<div class="sidebar">
-			<img id="fps" class="buttonClass" title="鎬ц兘璋冭瘯" src="../static/img/icon/fps.svg">
-			<img id="skyBox" class="buttonClass" title="鏇存敼鑳屾櫙" src="../static/img/icon/skyBox.svg">
-<!--			<img id="store" class="buttonClass" title="鏄剧ず浠撳簱" src="../static/img/icon/store.svg">-->
-<!--			<img id="group" class="buttonClass" title="鏄剧ず宸烽亾" src="../static/img/icon/group.svg">-->
-<!--			<img id="shelf" class="buttonClass" title="鏄剧ず鏋跺瓙" src="../static/img/icon/shelf.svg">-->
-<!--			<img id="reset" class="buttonClass" title="澶嶄綅鍦烘櫙" src="../static/img/icon/reset.svg">-->
-			<img id="tour" class="buttonClass" title="娓歌鍘傚尯&#10;鍓嶈繘锛歐&#10;鍚庨��锛歋&#10;宸︼細A&#10;鍙筹細D&#10;璺宠穬锛歋pace" src="../static/img/icon/tour.svg">
-<!--			<img id="temperature" class="buttonClass" title="杞﹂棿娓╁害" src="../static/img/icon/temperature.svg">-->
-<!--			<img id="roomRate" class="buttonClass" title="搴撴埧鍒╃敤鐜�" src="../static/img/icon/roomRate.svg">-->
-		</div>
-		<div id="groundglass"></div>
-		<div id="sidebar">
-			<p1>涓壃-鏅鸿兘绔嬩綋浠撳簱</p1>
-			<p2>ZhongYang Intelligent Three-Dimensional Warehouse</p2>
-			<div id="Histogram"></div>
-			<div id="baobiao2"></div>
-			<div id="btnhide_m"></div>
-			<button id="btnhide" onclick="btnHide()">闅愯棌</button>
-			<div class="tablebox">
-				<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 id="container"></div>
-		<script type="module">
+    </style>
+</head>
+<body>
 
-			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("fps").addEventListener('click', function () {
-				player.changeStats();
-			}, false);
-			document.getElementById("skyBox").addEventListener('click', function () {
-				player.changeBackGround();
-			}, false);
-			document.getElementById("tour").addEventListener('click', function () {
-				player.lockControl();
-			}, false)
-
-			$('.layuimini-loader').fadeOut();
-
-		</script>
-		<script type="text/javascript">
-			var dom1 = document.getElementById("Histogram");
-			var myChart1 = echarts.init(dom1);
-			window.addEventListener('resize',function () {
-				myChart1.resize();
-			})
-			var app1 = {};
-
-			var dom = document.getElementById("baobiao2");
-			var myChart = echarts.init(dom);
-			window.addEventListener('resize',function () {
-				myChart.resize();
-			})
-			var app = {};
+<div id="mask" class="mask"></div>
+<div id="title-box" class="title-box">
+    <div id="title" class="title"><i>A</i><i>&nbsp;</i><i>S</i><i>&nbsp;</i><i>/</i><i>&nbsp;</i><i>R</i><i>&nbsp;</i><i>S</i><i>&nbsp;</i><i>-</i><i>&nbsp;</i><i>W</i><i>&nbsp;</i><i>C</i><i>&nbsp;</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>
 
 
-			var option1;
+<div id="container"></div>
+</body>
+<script type="module">
 
-			option1 = {
-				title: {
-					text: '骞村害杩�/鍑鸿揣閲�',
-					x:'5px',
-					y:'15px',
-					textStyle:{
-						color:'#ffffff',
-						fontWeight:400,
-						fontSize: 10,
-					},
-					subtext: 'Data',
-					subtextStyle:{
-						align:'center',
-						color:'#ffffff',
-						fontSize: 7,
-					},
-					show: true,
+    import * as THREE from '../static/js/three.module.js';
+    import { APP } from '../static/js/app.js';
 
-				},
-				tooltip: {
-					trigger: 'axis'
-				},
-				textStyle:{
-					color:'#f5f4f4',
-				},
-				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:'#975a5a',
-						type: 'category',
-						axisTick:{
-							show:false,
-							lineStyle:{
-								color:'#000'
-							}
-						},
-						axisLabel: { //  濡傛灉杩欎釜瀛楁涓嶈缃紝echarts浼氭牴鎹睆瀹藉強妯潗鏍囨暟鎹嚜鍔ㄧ粰鍑洪棿闅�
-							fontSize:9,
-							interval: 1, // 闂撮殧闀垮害锛屽彲鑷畾涔夛紙濡傛灉鏄椂闂存牸寮忥紝echarts浼氳嚜鍔ㄥ鐞嗭級
-							rotate: 0 ,// 妯潗鏍囦笂label鐨勫�炬枩搴�
-							textStyle: {
-								color:'#fff'
-							}
-						},
-						axisLine:{
-							lineStyle: {
-								color: '#e2e1e1',// x杞村埢搴︾嚎鐨勯鑹�
-							}},
-						data: ['1鏈�', '2鏈�', '3鏈�', '4鏈�', '5鏈�', '6鏈�', '7鏈�', '8鏈�', '9鏈�', '10鏈�', '11鏈�', '12鏈�']
-					}
-				],
-				yAxis: [
-					{
-						type: 'value',
-						offset: -4,
-						axisTick:{
-							show:false,
-						},
-						axisLabel: {
-							fontSize:9,
-						},
-						splitLine:{
-							lineStyle:{
-								color:'#cdcdcd'// y杞村垎鍓茬嚎棰滆壊
-							}
-						}
+    window.THREE = THREE;
 
-					}
-				],
-				series: [
-					{
-						color:['#88b0e2'],
-						name: '杩涜揣',
-						type: 'bar',
-						data: [
-							204.5, 50.5, 15.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3
-						],
-					},
-					{
-						color:['#f8f7f7'],
-						name: '鍑鸿揣',
-						type: 'bar',
-						data: [
-							100, 75.2, 33.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
-						],
-					}
-				],
+    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);
 
-			if (option1 && typeof option1 === 'object') {
-				myChart1.setOption(option1);
-			}
+</script>
+<script>
+    var percent = 0;
+    var shipInfoBtn = document.getElementById("ship-info-btn");
+    var speedDom = document.getElementById("speed");
+    var timer = setInterval(function () {
+        if (percent < 99.95) {
+            percent += 0.05;
+            speedDom.innerText = percent.toFixed(2);
+        } else {
+            if (!hasClass(shipInfoBtn, "show")) {
+                addClass(shipInfoBtn, "show")
+                clearInterval(timer);
+            }
+        }
+    }, 1);
 
-			let base = +new Date(1988, 9, 3);
-			let oneDay = 24 * 3600 * 1000;
-			let data = [[base, Math.random() * 300]];
-			for (let i = 1; i < 20000; i++) {
-				let now = new Date((base += oneDay));
-				data.push([+now, Math.round((Math.random() - 0.5) * 20 + data[i - 1][1])]);
-			}
-			option = {
-				tooltip: {
-					trigger: 'axis',
-					position: function (pt) {
-						return [pt[0], '10%'];
-					}
-				},
-				title: {
-					x:'5px',
-					y:'15px',
-					text: '閿�鍞欢鏁�',
-					textStyle:{
-						color:'#ffffff',
-						fontWeight:400,
-						fontSize: 10,
-					},
-				},
-				toolbox: {
-					show:false,
-					feature: {
-						dataZoom: {
-							yAxisIndex: 'none'
-						},
-						restore: {},
-						saveAsImage: {}
-					}
-				},
-				textStyle:{
-					color:'#f5f4f4',
-				},
-				xAxis: {
-					type: 'time',
-					boundaryGap: false,
-					axisTick:{
-						show:false,
-					},
-					axisLabel: { //  濡傛灉杩欎釜瀛楁涓嶈缃紝echarts浼氭牴鎹睆瀹藉強妯潗鏍囨暟鎹嚜鍔ㄧ粰鍑洪棿闅�
-						fontSize:9,
-						interval: 1, // 闂撮殧闀垮害锛屽彲鑷畾涔夛紙濡傛灉鏄椂闂存牸寮忥紝echarts浼氳嚜鍔ㄥ鐞嗭級
-						rotate: 0 ,// 妯潗鏍囦笂label鐨勫�炬枩搴�
-						textStyle: {
-							color:'#fff'
-						}
-					},
-					axisLine:{
-						lineStyle: {
-							color: '#e2e1e1',// x杞村埢搴︾嚎鐨勯鑹�
-						}},
+    $(document).on('click','.btn-word', function () {
+        fullScreen()
+        $("#mask").fadeOut(3000, function () {
+            setTimeout(function () {
+                $("#ship-type-ul").css("transform", "translateY(-40px)");
+                $("#ship-info-btn .btn-word").text("浣撻獙璋冨害涓栫晫");
+                $("#ship-info-btn").data("type", 2).addClass("show");
+                $("#ship-info-btn #btn-lock").css("z-index", "10");
+            }, 1000);
+            setTimeout(function () {
+                $("#title-box").removeClass("show");
+            }, 5000);
+        });
+        $("#title-box, #logo").addClass("show");
+        $("#ship-info-btn").removeClass("show");
+        $('.speed.pointernone').addClass("hide");
+        $("#ship-type-ul").css("transform", "translateY(-20px)");
+    });
 
-				},
-
-				yAxis: {
-					type: 'value',
-					boundaryGap: [0, '100%'],
-					axisLabel: {
-						fontSize:9,
-					},
-					splitLine:{
-						lineStyle:{
-							color:'#cdcdcd'// y杞村垎鍓茬嚎棰滆壊
-						}
-					}
-				},
-				dataZoom: [
-					{
-						type: 'inside',
-						start: 0,
-						end: 20
-					},
-					{
-						start: 0,
-						end: 20
-					}
-				],
-				series: [
-					{
-						name: 'Fake Data',
-						type: 'line',
-						smooth: true,
-						symbol: 'none',
-						areaStyle: {
-							normal: {
-								color: '#88b0e2' //鏀瑰彉鍖哄煙棰滆壊
-							}
-						},
-						itemStyle : {
-							normal : {
-								color:'#dddede', //鏀瑰彉鎶樼嚎鐐圭殑棰滆壊
-								lineStyle:{
-									// color:'#8cd5c2' //鏀瑰彉鎶樼嚎棰滆壊
-									width:0.5,
-								}
-							}
-						},
-						data: data
-					}
-				]
-			};
-
-			if (option && typeof option === 'object') {
-				myChart.setOption(option);
-			}
-		</script>
-		<script type="text/javascript">
-			var MyMarhq = '';
-			clearInterval(MyMarhq);
-			$('.tbl-body tbody').empty();
-			$('.tbl-header tbody').empty();
-			var Items = [{"Ranking":"1","City":"淇濆畾","SaleIncome":"2506734.43","An":"53.00",},
-				{"Ranking":"2","City":"娌у窞","SaleIncome":"1425935.58","An":"65.00",},
-				{"Ranking":"3","City":"绉︾殗宀�","SaleIncome":"1372207.38","An":"34.00",},
-				{"Ranking":"4","City":"琛℃按","SaleIncome":"972451.15","An":"15.00",},
-				{"Ranking":"5","City":"鐭冲搴�","SaleIncome":"939010.52","An":"-57.00",},
-				{"Ranking":"6","City":"閭㈠彴","SaleIncome":"774274.70","An":"-20.00",},
-				{"Ranking":"7","City":"鍞愬北","SaleIncome":"680456.79","An":"-29.00",},
-				{"Ranking":"8","City":"寮犲鍙�","SaleIncome":"613319.87","An":"2.00",},
-				{"Ranking":"9","City":"涓补鍗庡ゥ","SaleIncome":"596575.25","An":"35.00",},
-				{"Ranking":"10","City":"鎵垮痉","SaleIncome":"589048.12","An":"30.00",},
-				{"Ranking":"11","City":"寤婂潑","SaleIncome":"515448.14","An":"-48.00",},
-				{"Ranking":"12","City":"鐟炲窞","SaleIncome":"399875.26","An":"128.00",},
-				{"Ranking":"13","City":"鐭冲搴勪腑娌�","SaleIncome":"90543.62","An":"-24.00",},
-				{"Ranking":"14","City":"杈涢泦涓补","SaleIncome":"49255.52","An":"19.00",},
-				{"Ranking":"15","City":"浜曢檳涓补","SaleIncome":"29682.60","An":"-74.00",},
-				{"Ranking":"16","City":"淇濆畾涓补","SaleIncome":"11887.73","An":"-64.00",}]
-			$.each(Items,function (i, item) {
-				str = '<tr>'+
-						'<td>'+item.Ranking+'</td>'+
-						'<td>'+item.City+'</td>'+
-						'<td>'+(+item.SaleIncome/10000).toFixed(2)+'</td>'+
-						'<td>'+(+item.An).toFixed(2)+'</td>'
-				// '<td>'+(+item.Mom).toFixed(2)+'</td>'+
-				// '<td>'+(item.SalePlan/10000).toFixed(2)+'</td>'+
-				// '<td>'+(+item.PlanFinish).toFixed(2)+'</td>'+
-				'</tr>'
-
-				$('.tbl-body tbody').append(str);
-				$('.tbl-header tbody').append(str);
-			});
-			if(Items.length > 10){
-				$('.tbl-body tbody').html($('.tbl-body tbody').html()+$('.tbl-body tbody').html());
-				$('.tbl-body').css('top', '0');
-				var tblTop = 0;
-				var speedhq = 50; // 鏁板�艰秺澶ц秺鎱�
-				var outerHeight = $('.tbl-body tbody').find("tr").outerHeight();
-				function Marqueehq(){
-					if(tblTop <= -outerHeight*Items.length){
-						tblTop = 0;
-					} else {
-						tblTop -= 1;
-					}
-					$('.tbl-body').css('top', tblTop+'px');
-				}
-
-				MyMarhq = setInterval(Marqueehq,speedhq);
-
-				// 榧犳爣绉讳笂鍘诲彇娑堜簨浠�
-				$(".tbl-header tbody").hover(function (){
-					clearInterval(MyMarhq);
-				},function (){
-					clearInterval(MyMarhq);
-					MyMarhq = setInterval(Marqueehq,speedhq);
-				})
-
-			}
-			$.each(Items,function (i, item) {
-				str = '<tr>'+
-						'<td>'+item.Ranking+'</td>'+
-						'<td>'+item.City+'</td>'+
-						'<td>'+(+item.SaleIncome/10000).toFixed(2)+'</td>'+
-						'<td>'+(+item.An).toFixed(2)+'</td>'+
-						'</tr>'
-
-				$('.tbl-body tbody').append(str);
-				$('.tbl-header tbody').append(str);
-			});
-			if(Items.length > 10){
-				$('.tbl-body tbody').html($('.tbl-body tbody').html()+$('.tbl-body tbody').html());
-				$('.tbl-body').css('top', '0');
-				var tblTop = 0;
-				var speedhq = 50; // 鏁板�艰秺澶ц秺鎱�
-				var outerHeight = $('.tbl-body tbody').find("tr").outerHeight();
-				function Marqueehq(){
-					if(tblTop <= -outerHeight*Items.length){
-						tblTop = 0;
-					} else {
-						tblTop -= 1;
-					}
-					$('.tbl-body').css('top', tblTop+'px');
-				}
-
-				MyMarhq = setInterval(Marqueehq,speedhq);
-			}
-
-		</script>
-
-	</body>
+</script>
 </html>

--
Gitblit v1.9.1