shuochen
/
LargeScreenVisualization


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209
							
<!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>