Skip to content

Commit

Permalink
更新web057html
Browse files Browse the repository at this point in the history
  • Loading branch information
@iGaoWei
iGaoWei committed Aug 13, 2021
1 parent 888b55a commit 5a281ff
Show file tree
Hide file tree
Showing 11 changed files with 1,633 additions and 0 deletions.
45 changes: 45 additions & 0 deletions web/057 大屏数据统计/css/jianlisw.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
/*项目概览*/
.none{ display:none}
.xmglan{ width:100%;color:#fff; padding:20px 0;}
.xmgl_heard{ width:100%; display:block; overflow:hidden}
.xmgl_heard li{ float:left; list-style:none; font-size:12px; height:24px; line-height:24px; text-align:center;background:#0068b7; width:50%; cursor:pointer; border-top:1px #032d60 solid;border-bottom:1px #032d60 solid}
.xmgl_heard li.hove{ background:#000c3b}

/*项目概览 */
.xm_cszs{ font-size:12px; padding:10px 10px 0 10px; }
.xm_cszs li { line-height:22px;overflow:hidden}
.xm_cszs li span{ color:#00ff00; padding:0 5px 0 10px}
.xm_cszs li p{ float:left;width:33%}
.xm_cszs li p span{ color:#00ffff; padding:0}
.xm_cszs li p cite{ color:#00ffff;}
/*项目人员信息状态 */
.lytj {width:100%;float: left;height:100px;}
.wgrytj_bt{ padding:10px; clear:both; display:block;border-top:1px #032d60 solid; color:#fff}
.wgrytj_tb{ padding-left:10px;}
/*仪表盘等展示*/
.center_zs{ width:30%;}
.box1-back{height:763px;background-image:-webkit-radial-gradient(250px 250px at 50% 50%,hsla(209,99%,32%,28),hsla(228,100%,0%,0));background-image:radial-gradient(250px 250px at 50% 50%,hsla(209,99%,32%,28),hsla(228,100%,0%,0))}
/*问题等级*/
.wenti_dj{ width:40%; float:left}
.wenti_bg{ float:left; padding-top:10px; width:60%;}
.wenti_bg table{border-collapse:collapse;border: 1px solid #00a0e9; color:#fff; width:95%}
.wenti_bg td{border-collapse:collapse; border: 1px solid #00a0e9; padding:2px 4px; }
.wenti_bg td.green{ color:#05d60f; text-align:center}
.wenti_bg td.orange{ color:#d75a07; text-align:center}

















22 changes: 22 additions & 0 deletions web/057 大屏数据统计/css/jianlixt.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
/*人力资源基本信息*/
.none{ display:none}
.rlzy_xx{ width:95%;color:#fff; padding:10px;}
.rlzy_heard{ width:100%; display:block;}
.rlzy_heard li{ float:left; list-style:none; font-size:12px;background:#999; padding:2px 4px; margin:0 2px;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px; -o-border-radius:5px;border-radius:5px; cursor:pointer}
.rlzy_heard li.hove{background:#ffc834; }
#rlzy_cen{ clear:both}
.xueli_tb{width:354px;height:340px;}
/*人员能力提升*/
.ryclts{ padding:10px;}
.ryclts_tb {width:304px;float: left;height:300px; }

/*仪表盘等展示*/
.center_zs{ width:30%;}
.box1-back{height:749px;background-image:-webkit-radial-gradient(250px 250px at 50% 50%,hsla(209,99%,32%,28),hsla(228,100%,0%,0));background-image:radial-gradient(250px 250px at 50% 50%,hsla(209,99%,32%,28),hsla(228,100%,0%,0))}

/*右侧项目管理展示 */
.xmcggl{width:480px;height:325px;}
/*右侧项目管理展示 */
.xmgl_zs{ width:100%; clear:both}
.xmgl{width:1200px;height:325px;}

34 changes: 34 additions & 0 deletions web/057 大屏数据统计/css/public.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
*{padding:0px;margin:0px;font-family:"微软雅黑";font-size:12px; font-style:normal}
dd,dl,dt,em,i,p,textarea,a,div{padding:0px;margin:0px;}
a{text-decoration:none;}
img{border:0px;}
ul,li{padding:0px;margin:0px;list-style:none;}
.fl{ float:left}
.fr{ float:right}
body{margin:0px; padding:0px; color:#000; background:#000c3b;}
.clearfix:after,.clearfix:before{content:"";display:table}
.clearfix:after{clear:both;overflow:hidden}

/*头部*/
.caption-title{font-size:22px; font-family:"黑体"; color:#fff;max-width:900px;margin:0 auto; height:48px; margin-top:10px;}
.biaoti{ line-height:48px; display:inline-block;margin:0px; padding:0px; width:276px; text-align:center;font-size:28px;}
.data-box1{border:2px solid #032d60;-webkit-box-shadow:#07417a 0 0 10px;-moz-box-shadow:#07417a 0 0 10px;box-shadow:inset 0 0 30px #07417a;position:relative}

.zhenwen{ width:96%; margin:0 auto;overflow:hidden; padding-top:30px;}
.left_zs{ width:30%;}
.left_tb{ width:95%}
.mtop40{ margin-top:40px;}
.h30{ height:40px;}
.right_zs{ width:40%;}
.right_tb{ width:95%;float:right}

/*四个角*/
.topL{width:20px;height:20px;border-top-width:2px;border-top-color:#26c6f0;border-top-style:solid;border-left-width:2px;border-left-color:#26c6f0;border-left-style:solid;position:absolute;top:-2px;left:-2px}
.topR{width:20px;height:20px;border-top-width:2px;border-top-color:#26c6f0;border-top-style:solid;border-right-width:2px;border-right-color:#26c6f0;border-right-style:solid;position:absolute;top:-2px;right:-2px}
.bottomL{width:20px;height:20px;border-bottom-width:2px;border-bottom-color:#26c6f0;border-bottom-style:solid;border-left-width:2px;border-left-color:#26c6f0;border-left-style:solid;position:absolute;bottom:-2px;left:-2px}
.bottomR{width:20px;height:20px;border-bottom-width:2px;border-bottom-color:#26c6f0;border-bottom-style:solid;border-right-width:2px;border-right-color:#26c6f0;border-right-style:solid;position:absolute;bottom:-2px;right:-2px}

/*小标题*/
.data-title-left,.data-title-right{color:#105eda;font-family:"微软雅黑";font-size:20px}
.data-title{background-color:#000c3b;width:178px;margin:-18px auto 0 auto;color:#83c7e3;font-size:20px;}
.data-title span{text-align:center;width:150px; display:inline-block; text-align:center;font-size:18px;}
Binary file added web/057 大屏数据统计/images/title-left.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added web/057 大屏数据统计/images/title-right.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
209 changes: 209 additions & 0 deletions web/057 大屏数据统计/index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,209 @@

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<link href="css/public.css" rel="stylesheet" type="text/css"/>
<link href="css/jianlisw.css" rel="stylesheet" type="text/css"/>
<title>大屏数据统计</title>
</head>
<body>

<!-- banner start -->
<div class="caption-title">
<i class="fl"><img src="images/title-left.png" ></i>
<span class="biaoti fl">大屏数据统计</span>
<i class="fr"><img src="images/title-right.png" ></i>
</div>
<!-- 内容正文 -->
<div class="zhenwen">
<div class="left_zs fl">
<!-- 项目概览 -->
<div class="data-box1 left_tb fl">
<i class="topL"></i>
<i class="topR"></i>
<i class="bottomL"></i>
<i class="bottomR"></i>
<div class="data-title">
<b class="data-title-left fl">[</b>
<span>项目概览</span>
<b class="data-title-right fr">]</b>
</div>
<!-- 项目概览-->
<div class="xmglan">
<ul class="xmgl_heard">
<li>当前</li>
<li class="hove">历史</li>
</ul>
<div id="xmgl_cen">
<div class="xmgl_tb">
<ul class="xm_cszs">
<li>在建项目（个）:<span>100</span>个</li>
<li> 在建工地面积（平米）：<span>100</span>万M</li>
<li>
<p>市政（%）:<span>100</span><cite>%</cite></p>
<p>绿化（%）:<span>100</span><cite>%</cite></p>
<p>房建（%）<span>100</span><cite>%</cite></p>
</li>
<li>
<p>交建（%）<span>100</span><cite>%</cite></p>
<p>其他（%）<span>100</span><cite>%</cite></p>
</li>
</ul>
</div>
<div class="xmgl_tb none">
<ul class="xm_cszs">
<li>在建项目（个）:<span>140</span>个</li>
<li> 在建工地面积（平米）：<span>120</span>万M</li>
<li>
<p>市政（%）:<span>110</span><cite>%</cite></p>
<p>绿化（%）:<span>140</span><cite>%</cite></p>
<p>房建（%）<span>180</span><cite>%</cite></p>
</li>
<li>
<p>交建（%）<span>10</span><cite>%</cite></p>
<p>其他（%）<span>140</span><cite>%</cite></p>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- 项目人员信息状态 -->
<div class="data-box1 left_tb fl mtop40">
<i class="topL"></i>
<i class="topR"></i>
<i class="bottomL"></i>
<i class="bottomR"></i>
<div class="data-title">
<b class="data-title-left fl">[</b>
<span>项目人员信息状态</span>
<b class="data-title-right fr">]</b>
</div>
<!-- 项目人员信息状态-->
<div class="xmglan">
<div id="lytj" class="lytj"></div>

<div class="wgrytj">
<span class="wgrytj_bt">务工人员工种统计</span>
<div class="wgrytj_tb">
<div id="gztj" style="height:163px"></div>
</div>
</div>

<div class="wgrytj">
<span class="wgrytj_bt">各公司现场人员统计</span>
<div class="wgrytj_tb">
<div id="xcrytj" style="height:163px"></div>
</div>
</div>
</div>
</div>

</div>

<!--仪表盘等展示-->
<div class="center_zs fl">
<div class="data-box1 box1-back">
<i class="topL"></i>
<i class="topR"></i>
<i class="bottomL"></i>
<i class="bottomR"></i>
<div class="data-title">
<b class="data-title-left">[</b>
<span>仪表盘等展示</span>
<b class="data-title-right">]</b>
</div>

</div>
</div>
<!--右侧图表展示 -->
<div class="right_zs fl">
<!-- 巡检风险状态 -->
<div class="data-box1 right_tb ">
<i class="topL"></i>
<i class="topR"></i>
<i class="bottomL"></i>
<i class="bottomR"></i>
<div class="data-title">
<b class="data-title-left">[</b>
<span>巡检风险状态</span>
<b class="data-title-right">]</b>
</div>
<!--巡检风险状态-->
<div class="ryclts">
<div id="xjfxzt" style="height:300px"></div>
</div>
</div>

<!-- 风险变化趋势 -->
<div class="data-box1 right_tb mtop40">
<i class="topL"></i>
<i class="topR"></i>
<i class="bottomL"></i>
<i class="bottomR"></i>
<div class="data-title">
<b class="data-title-left">[</b>
<span>风险变化趋势</span>
<b class="data-title-right">]</b>
</div>
<!--问题等级-->
<div class="ryclts">
<div class="clearfix"><div id="fxbhqs" style="height:300px"></div></div>
<div class="wgrytj">
<div class="wenti_dj">
<div id="wentidj" style="height:100px"></div>
</div>
<div class="wenti_bg">
<table width="200" border="1">
<tr>
<td>类别</td>
<td>发现总是</td>
<td>重大问题</td>
<td>一般问题</td>
</tr>
<tr>
<td>质量问题</td>
<td class="green">45</td>
<td class="orange">300</td>
<td class="green">40</td>
</tr>
<tr>
<td>安全问题</td>
<td class="green">36</td>
<td class="orange">100</td>
<td class="green">78</td>
</tr>
</table>

</div>
</div>
</div>
</div>
</div>

</div>

<div class="h30 clearfix"></div>
</body>
<script src="js/jquery.min.js"></script>
<script src="js/echarts.min.js"></script>
<script src="js/monitor_sw.js"></script>

<script>
$(function(){
//分类选择
$(".xmgl_heard li").click(function(){

$(this).attr("class","");
$(this).siblings().attr("class","hove");
$("#xmgl_cen").find(".xmgl_tb").eq($(this).index()).removeClass("none").siblings().addClass("none")
});
})
</script>

</html>
22 changes: 22 additions & 0 deletions web/057 大屏数据统计/js/echarts.min.js
View file

Large diffs are not rendered by default.

6 changes: 6 additions & 0 deletions web/057 大屏数据统计/js/jquery.min.js
View file

Large diffs are not rendered by default.

Loading

0 comments on commit 5a281ff

Please sign in to comment.