YQ-August
/
oldRuico


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217
							<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>智能航行安全管理</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="Cache" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache, must-revalidate">
		<meta http-equiv="expires" content="0">
		<meta name="viewport"
			content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
		<link rel="stylesheet" href="../css/element.css">
		<link rel="stylesheet" href="../css/style.css">
		<link rel="stylesheet" href="../css/base.css">
		<script src="../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/yz/init.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			document.write('<script src="../js/yz/init.js?id='+(new Date().getTime())+'" type="text/javascript" charset="utf-8"><\/script>');
			document.write('<script src="../js/yz/shipLi.js?id='+(new Date().getTime())+'" type="text/javascript" charset="utf-8"><\/script>');
			document.write('<script src="../js/yz/ajax.js?id='+(new Date().getTime())+'" type="text/javascript" charset="utf-8"><\/script>');
			document.write('<script src="../js/yz/caht.js?id='+(new Date().getTime())+'" type="text/javascript" charset="utf-8"><\/script>');
		</script>
		<script>
			checkLogin();
		</script>
		<style type="text/css">
			body {
				height: 100vh;
				background-color: #103151;
			}
			.yz-fluid,iframe{
				width: 100%;
				height: 100%;
				padding: 0;
			}
			.footer_yz {
				position: fixed;
				bottom: 0;
				left: 0;
				height: 50px;
				width: 100%;
				z-index: 444;
				font-size: 12px;
				color: #dddddd;
				text-align: center;
				background-color: #173862;
			}
			.yzkj_sider{
				position: absolute;
				left: -150px;
				top: 40px;
				bottom:50px;
				z-index: 444;
				width: 150px;
				padding: 6px;
				background-color: #103151;
			}
			.yzkj_sider .icon-chuanbo{
				margin-right: 6px;
			}
			.search_ input{
				height: 30px;
				line-height: 30px;
			}
			.search_ .icon-sousuo{
				top: 7px;
			}
			.iboatLi li{
				padding:6px 0;
			}
			.iboatLi li .text-sm.act{
				color:#0081ff;
			}
			.drog{
				position: absolute;
				right: -2px;
				top: -7px;
				font-size: 16px;
				color: #00dd00;
				display: none;
			}
		</style>
	</head>
	<body>
		<div class="yz-fluid" style="position: relative;">
			<div class="layui-body" style="height: calc(100% - 50px);">
				<iframe src="./Phone/Home.html" id="isem-iframe" frameborder="0" class="isem-iframe"></iframe>
			</div> 
			<div class="footer_yz flex justify-around align-center">
				<div class="tabli0" onclick="changeInd(0)">
					<div><img src="../imgs/home_active.png" alt="" style="width: 20px;height: 20px;"></div>
					<div>首页</div>
				</div>
				<div class="tabli3" onclick="changeInd(3)">
					<div><img src="../imgs/home_active.png" alt="" style="width: 20px;height: 20px;"></div>
					<div>AI监控</div>
				</div>
				<div class="tabli2" style="position: relative;" onclick="changeInd(2)">
					<i class="drog">●</i>
					<div><img src="../imgs/chat.png" alt="" style="width: 20px;height: 20px;"></div>
					<div>易聊</div>
				</div>
				<div class="tabli1" onclick="changeInd(1)">
					<div><img src="../imgs/user.png" alt="" style="width: 20px;height: 20px;"></div>
					<div>我的</div>
				</div>
			</div>
			<div class="yzkj_sider">
				<div class="search_">
					<i class="iconfont icon-sousuo"></i>
					<input class="layui-input search" autocomplete="off" placeholder="">
				</div>
				<div style="height: calc(100% - 40px);">
					<ul class="padding-xs iboatLi">
			
					</ul>
				</div> 
			</div>
		</div>
	</body>
	<script src="../js/yz/mqttws31.js" type="text/javascript" charset="utf-8"></script>
	<script src="../js/yz/sendMag.js" type="text/javascript" charset="utf-8"></script>
	<script>
		var tabLi = [{
			"src": "home",
			"url": "./Phone/Home.html"
		}, {
			"src": "user",
			"url": "./Phone/User.html"
		}, {
			"src": "chat",
			"url": "./Phone/ChatLi.html"
		}, {
			"src": "chat",
			"url": "./Phone/VideoPh.html"
		}];
		var selectLi = [];
		var nowSn= null;
		window.addEventListener('message',(data)=>{
			nowSn = data.data.sn;
			$(".iboatLi li .text-sm").removeClass("act");
			$(".iboatLi li[data-id='"+nowSn+"'] .text-sm").addClass("act");
			$(".yzkj_sider").css({"left":"-150px","transition":"left 300ms linear"});
		})
		$(document).ready(function() {
			var url_id2 = window.location.search;
			var Pid = url_id2.split("=")[1];
			
			changeInd(Pid);
			checkTU();
			sendMsg("mainPh");
		});
		function checkTU(){
			var accTok = JSON.parse(localStorage.getItem("_yz_TU"));
			if(accTok!=null&&accTok!="null"){
				getNoReady("mainPh");
				firstList()
			}else{
				getUser();
			}
		}
		function changeInd(tabCur) {
			$(".yzkj_sider").css({"left":"-150px","transition":"left 300ms linear"});
			for (var i = 0; i < tabLi.length; i++) {
				if (tabCur == i) {
					$(".tabli" + i).css("color", "#F19600");
					$(".tabli" + i + " img").attr("src", "../imgs/" + tabLi[i].src + "_active.png");
				} else {
					$(".tabli" + i).css("color", "#ddd");
					$(".tabli" + i + " img").attr("src", "../imgs/" + tabLi[i].src + ".png");
				}
			}
			document.getElementById("isem-iframe").src = tabLi[tabCur].url;
		}

		function changeProd() {
			let _src = document.getElementById("isem-iframe").src.split("view/")[1];
			document.getElementById("isem-iframe").src = "./" + _src;
		}
		function firstList(){
			// deviceList(function acb(_data){
				shipLi = ShipData();
				nowSn = localStorage.getItem("shipSn");
				if(nowSn != null&&nowSn != "null"){
					
				}else{
					nowSn = shipLi[0].sn;
				}
				let _dd="";
				for(var i=0;i<shipLi.length;i++){
					_dd+=`<li class="flex align-start ${shipLi[i].state==0?'text-rgb':'text-blue'}" 
						data-id="${shipLi[i].sn}">
						<div class="iconfont icon-chuanbo"></div>
						<div class="text-sm ${shipLi[i].state==0?'text-rgb':'text-white'}">${shipLi[i].prod}</div>
					</li>`
				}
				$(".iboatLi").html(_dd);
				$(".iboatLi li[data-id='"+nowSn+"'] .text-sm").addClass("act");
			// })
		}
		$(document).on("click",".iboatLi li",function(){
			nowSn = $(this).data("id");
			let _src=document.getElementById("isem-iframe");
			_src.contentWindow.postMessage(nowSn,"*");
			localStorage.setItem("shipSn",nowSn);
			$(".iboatLi li .text-sm").removeClass("act");
			$(".iboatLi li[data-id='"+nowSn+"'] .text-sm").addClass("act");
			$(".yzkj_sider").css({"left":"-150px","transition":"left 300ms linear"});
		})
		function changeShow(_px){
			$(".yzkj_sider").css({"left":_px,"transition":"left 300ms linear"});
		}
	</script>
</html>