火箭军大屏html静态页面
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

239 lines
9.3 KiB

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>智能库房综合管理系统</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<link rel="shortcut icon" type="image/x-icon" href="images/logo.png">
<link rel="stylesheet" href="css/reset.css">
<link rel="stylesheet" href="iconfont/iconfont.css">
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div class="env-container">
<div class="env-top-title"></div>
<div class="current-date"></div>
<div class="env-main">
<div class="env-main-left">
<div class="env-item container-wrap">
<span class="right-top-line"></span>
<span class="left-bottom-line"></span>
<h3><i class="iconfont icon-kongqizhiliangshuju"></i>档案库空气质量数据</h3>
<ul class="screen-env-list left-top-env">
</ul>
</div>
<div class="env-item container-wrap">
<span class="right-top-line"></span>
<span class="left-bottom-line"></span>
<h3><i class="iconfont icon-loushuijiance"></i>漏水检测</h3>
<div class="leakage-detection">
<div class="state-list">
<span>正常</span>
<span>报警</span>
</div>
<ul class="leakage-list">
<li class="leakage-item001">
<p><i class="iconfont icon-weihubaojing"></i>维护报警</p>
<span class="leakage-state-tip"></span>
</li>
<li class="leakage-item002">
<p><i class="iconfont icon-loushuibaojing"></i>漏水报警</p>
<span class="leakage-state-tip"></span>
</li>
<li class="leakage-item003">
<p><i class="iconfont icon-ganyingxianduanlie"></i>感应线断裂</p>
<span class="leakage-state-tip"></span>
</li>
<li class="leakage-item004">
<p><i class="iconfont icon-loushuiweizhi"></i>漏水位置</p>
<span class="lsLocation"></span>
</li>
</ul>
</div>
</div>
<!-- 门禁记录 -->
<div class="env-item container-wrap">
<span class="right-top-line"></span>
<span class="left-bottom-line"></span>
<h3 class="table-title">
<p class="title-arrow">
<i class="iconfont icon-menjinjilu"></i>门禁记录
</p>
</h3>
<table class="table-wrapper" cellpadding="0" cellspacing="8">
<tr class="table-header">
<th>时间</th>
<th>库房</th>
<th>警情</th>
</tr>
</table>
<div id="scrollTable" class="scrollTable">
<table class="table-wrapper " cellpadding="0" cellspacing="8">
<tbody class="table-text" id="fTbody">
</tbody>
</table>
</div>
</div>
</div>
<div class="env-main-middle">
<div class="env-3d">
<img src="/images/largeScreen/screen.png" alt="" />
<ul class="screen-env-list middle-env">
</ul>
</div>
<div class="middle-bottom">
<div class="env-item container-wrap middle-bottom-l">
<span class="right-top-line"></span>
<span class="left-bottom-line"></span>
<ul>
<li>
<div class="row-item">
<i class="row-icon row-icon1"></i>
<span>馆藏总量</span>
</div>
<div class="card-panel-text">
<p class="row-num" id="archivesNum"><b class="timer" data-to="0" data-speed="800"></b></p>
</div>
</li>
<li>
<div class="row-item">
<i class="row-icon row-icon2"></i>
<span>文件数量</span>
</div>
<div class="card-panel-text">
<p id="filesNum" class="row-num"><b class="timer" data-to="0" data-speed="800"></b></p>
</div>
</li>
<li>
<div class="row-item">
<i class="row-icon row-icon3"></i>
<span>案卷数量</span>
</div>
<div class="card-panel-text">
<p id="anjuanNum" class="row-num"><b class="timer" data-to="0" data-speed="800"></b></p>
</div>
</li>
</ul>
<ul>
<li>
<div class="row-item">
<i class="row-icon row-icon4"></i>
<span>全部设备</span>
</div>
<div class="card-panel-text">
<p id="deviceTotal" class="row-num"><b class="timer" data-to="0" data-speed="800"></b></p>
</div>
</li>
<li>
<div class="row-item">
<i class="row-icon row-icon5"></i>
<span>在线设备</span>
</div>
<div class="card-panel-text">
<p id="lineDevNum" class="row-num"><b class="timer" data-to="0" data-speed="800"></b></p>
</div>
</li>
<li>
<div class="row-item">
<i class="row-icon row-icon6"></i>
<span>离线设备</span>
</div>
<div class="card-panel-text">
<p id="offlineDevice" class="row-num"><b class="timer" data-to="0" data-speed="800"></b></p>
</div>
</li>
</ul>
</div>
<div class="env-item container-wrap middle-bottom-r">
<span class="right-top-line"></span>
<span class="left-bottom-line"></span>
<ul>
<li>
<span>日借阅量</span>
<div id="tnum1" class="num"></div>
</li>
<li><span>日归还量</span>
<div id="tnum2" class="num"></div>
</li>
<li><span>月借阅量</span>
<div id="tnum3" class="num"></div>
</li>
<li><span>月归还量</span>
<div id="tnum4" class="num"></div>
</li>
</ul>
</div>
</div>
</div>
<div class="env-main-right">
<div class="env-item container-wrap">
<span class="right-top-line"></span>
<span class="left-bottom-line"></span>
<h3>
<i class="iconfont icon-danganjieyue"></i>档案借阅
</h3>
<div id="chart1" class="chart-wrapper" style="height: calc(100% - 40px);">
</div>
</div>
<div class="env-item container-wrap">
<span class="right-top-line"></span>
<span class="left-bottom-line"></span>
<h3>
<i class="iconfont icon-danganleixing"></i>档案类型
</h3>
<div id="chart2" class="chart-wrapper" style="height: calc(100% - 40px);">
</div>
<!-- <div class="empty-main">
<svg-icon icon-class="empty" class-name="empty-img" />
<i></i>
<p>暂无数据</p>
</div> -->
</div>
<!-- 报警记录 -->
<div class="env-item container-wrap">
<span class="right-top-line"></span>
<span class="left-bottom-line"></span>
<h3 class="table-title">
<p class="title-arrow">
<i class="iconfont icon-baojingjilu"></i>报警记录
</p>
</h3>
<!--表格渲染-->
<table class="table-wrapper" cellpadding="0" cellspacing="8">
<tr class="table-header">
<th>时间</th>
<th>库房</th>
<th>警情</th>
</tr>
</table>
<div id="scrollTable2" class="scrollTable">
<table class="table-wrapper" cellpadding="0" cellspacing="8">
<tbody class="table-text" id="fTbody2">
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</body>
<script type="text/javascript" src="/js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="/js/echarts.js"></script>
<script type="text/javascript" src="/js/flexible.js"></script>
<script type="text/javascript" src="/iconfont/iconfont.js"></script>
<script type="text/javascript" src="/js/jquery.countTo.js"></script>
<script type="text/javascript" src="/js/countTo.js"></script>
<script type="text/javascript" src="/js/number.js"></script>
<script type="text/javascript" src="/js/util.js"></script>
<script type="text/javascript" src="/js/lendAcross.js"></script>
<script type="text/javascript" src="/js/typePie.js"></script>
<script type="text/javascript" src="/js/index.js"></script>
</html>