master

分支 (1)

管理

管理

master

jiujiu
/
车辆苫盖.html

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>车辆苫盖</title>
	<link rel="stylesheet" href="assets/layui/css/layui.css">
	<link rel="stylesheet" href="assets/css/reset-layui-style.css?v=33">
	<link rel="stylesheet" href="assets/css/common.css">
	<link rel="stylesheet" href="assets/css/thatch.css">
	<link rel="stylesheet" href="assets/css/viewer.css">
</head>
<body>
	<div class="main-page">
		<div class="page-body flex">
			<div class="sub-page-container">

				<div class="right-content-wrapper">
					<div class="right-content-box">
						<ul class="tags">
							<!-- <li class="to-back" onclick="javascript:history.back()">返回</li> -->
							<li>清洁运输</li>
							<li>&gt;</li>
							<li>车辆苫盖</li>
						</ul>
						<div class="content-section flex page-thatch">
							<div class="table-section">
								<p class="card-title">车辆出入记录</p>
								<div class="card-content pd-all-20">
									<div class="video-box flex">
										视频区域
										<div class="circle-play-btn"></div>
									</div>
								</div>
							</div>
							<div class="left-box ">
								<p class="card-title">苫盖识别</p>
								<div class="card-content">
									<ul class="flex params">
										<li class="item tab active grow" id="one">苫盖情况</li>
										<li class="state flex flex-sb">
											<span class="icon-radio checked" id="1">打开</span>
											<span class="icon-radio" id="0">关闭</span>
										</li>
									</ul>
									<div class="vehicle-list">
										<ul id="viewerBox">
											<li>
												<div class="flex flex-sb vehicle-config">
													<span class="vehicle-idcard">湘B043241</span>
													<span>进厂时间<span class="mgl-10">03-21 09:02:16</span></span>
												</div>
												<div class="flex flex-sa">
													<div class="img-box flex">
														<img src="assets/img/vehicle.jpeg">
														<i class="icon-enlarge"></i>
													</div>
													<div class="img-box flex">
														<img src="assets/img/vehicle.jpeg">
														<i class="icon-enlarge"></i>
													</div>
												</div>
											</li>
											<li>
												<div class="flex flex-sb vehicle-config">
													<span class="vehicle-idcard">湘B043241</span>
													<span>进厂时间<span class="mgl-10">03-21 09:02:16</span></span>
												</div>
												<div class="flex flex-sa">
													<div class="img-box flex">
														<img src="assets/img/vehicle.jpeg">
														<i class="icon-enlarge"></i>
													</div>
													<div class="img-box flex">
														<img src="assets/img/vehicle.jpeg">
														<i class="icon-enlarge"></i>
													</div>
												</div>
											</li>
											<li>
												<div class="flex flex-sb vehicle-config">
													<span class="vehicle-idcard">湘B043241</span>
													<span>进厂时间<span class="mgl-10">03-21 09:02:16</span></span>
												</div>
												<div class="flex flex-sa">
													<div class="img-box flex">
														<img src="assets/img/vehicle.jpeg">
														<i class="icon-enlarge"></i>
													</div>
													<div class="img-box flex">
														<img src="assets/img/vehicle.jpeg">
														<i class="icon-enlarge"></i>
													</div>
												</div>
											</li>
										</ul>
									</div>
									<div class="pagination-section flex">
										<div id="pagination"></div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
	<script src="assets/js/jquery.SuperSlide.2.1.3.js"></script>
	<script src="assets/js/viewer.js?v=2"></script>
	<script src="assets/layui/layui.js"></script>
	<script src="assets/js/select.js"></script>
	<script src="assets/js/page.js"></script>
	<script>
		var pageObj = function(){
			this.init()

		    // 渲染左侧菜单树
		    new LeftSiderMenu({
		        el:".sub-page-container",
		        size:10,
		        curMenu:"车辆苫盖",
		        menus:[
		        	{ href:"概览.html",text:"概览" },
		            { href:"车辆出入.html",text:"车辆出入" },
		            { href:"车辆清洗.html",text:"车辆清洗" },
		            { href:"车辆苫盖.html",text:"车辆苫盖" },
		            { href:"车辆排放.html",text:"车辆排放" },
		            { href:"GPS轨迹.html",text:"GPS轨迹" }
		        ]
		    });


			new Footer({
		        el:".main-page",
		        curMenu:"清洁运输",
		        size:4,
		        menus:[
		            { href:"有组织.html",text:"有组织" },
		            { href:"无组织",text:"无组织" },
		            { href:"车辆出入.html",text:"清洁运输" },
		            { href:"视频.html",text:"视频大厅" }
		        ]
		    });
		}

		pageObj.prototype.init = function(){
			this.bindEvent();
		}
		pageObj.prototype.bindEvent = function(){
			let self = this;

			// 打开关闭
			$("body").on("click",".params .icon-radio",function(e){
				$(this).addClass("checked").siblings("span.icon-radio").removeClass("checked");
				alert(this.id);
			})

			let viewer = new Viewer(document.getElementById("viewerBox"), {});

			layui.use(['laypage'], function(){
				let laypage = layui.laypage;
				let laydate = layui.laydate;

				laypage.render({
				    elem: 'pagination'
				    ,count: 20
				    ,layout: ['prev', 'page', 'next']
				    ,jump: function(obj){
				      	console.log(obj)
				    }
			  	});
			})

		}

		new pageObj();

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