1702 lines
61 KiB
Plaintext
1702 lines
61 KiB
Plaintext
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="mainProject_ZJ.aspx.cs" Inherits="FineUIPro.Web.common.mainProject_ZJ" %>
|
||
|
||
<!DOCTYPE html>
|
||
<html>
|
||
<head id="Head1" runat="server">
|
||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||
<meta name="viewport" content="initial-scale=scale,maximum-scale=scale,minimum-scale=scale,user-scalable=no" />
|
||
<title>首页</title>
|
||
<link rel="stylesheet" href="../res/css/indexv2.css">
|
||
<link rel="stylesheet" href="../res/assets/css/video-7.15.0.min.css"/>
|
||
<link rel="stylesheet" href="../res/assets/css/xfk.css" />
|
||
|
||
<style type="text/css">
|
||
.risk{
|
||
calc(100% - 1.4737rem)
|
||
}
|
||
#riskMap{
|
||
width:100%;
|
||
height:100%;
|
||
}
|
||
.video-inner
|
||
{height: 22rem;
|
||
}
|
||
#wrap .items1>.title
|
||
{
|
||
left:18.75105rem !important}
|
||
html {
|
||
min-height: auto;
|
||
}
|
||
|
||
.pdtb0{
|
||
padding-top:0 !important;
|
||
padding-bottom:0 !important;
|
||
}
|
||
.swiper-container{
|
||
width:100%;
|
||
height:100%;
|
||
}
|
||
.flex{
|
||
display:flex;
|
||
align-items:center;
|
||
justify-content:space-between;
|
||
width:100%;
|
||
}
|
||
.flexV{
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-between;
|
||
}
|
||
.content-ul {
|
||
color: #666;
|
||
box-sizing: border-box;
|
||
padding: 10px 0;
|
||
}
|
||
|
||
.content-ul .c-item {
|
||
cursor:pointer;
|
||
display: flex;
|
||
overflow: hidden;
|
||
max-width: 100%;
|
||
font-size:12px;
|
||
height:24px;
|
||
/* margin-bottom: 8px; */
|
||
}
|
||
|
||
.content-ul .c-item:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
.content-ul .c-item .tit {
|
||
flex: 1;
|
||
min-width: 0;
|
||
float: left;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
text-overflow: ellipsis;
|
||
word-break: keep-all;
|
||
display:flex;
|
||
align-items:center;
|
||
}
|
||
|
||
.content-ul .c-item .time {
|
||
width: 90px;
|
||
float: right;
|
||
}
|
||
|
||
.text-ellipsis {
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
text-overflow: ellipsis;
|
||
word-break: keep-all;
|
||
}
|
||
.video-wrapper{
|
||
padding-bottom: 50% !important;
|
||
}
|
||
</style>
|
||
<style>
|
||
#wrap{
|
||
height: 57.7895rem !important;
|
||
}
|
||
#wrap .items1
|
||
{
|
||
width:43.9474rem}
|
||
#wrap .items
|
||
{width:26rem ;
|
||
}
|
||
.left .items .content
|
||
{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
.left .items .content .i-item
|
||
{
|
||
width: 6.6146rem;
|
||
margin: 0 0.5rem;
|
||
}
|
||
|
||
.left .items .content .i-item .i-txt
|
||
{
|
||
font-size: 0.6292rem;
|
||
color: #7ECEF7;
|
||
text-align: center;
|
||
margin: 0 auto;
|
||
}
|
||
.left .items .content .i-item .i-desc {
|
||
width: 100%;
|
||
height: 4.5229rem;
|
||
background: rgba(11, 32, 86, 0.5);
|
||
box-shadow: 0 0 0.1563rem 0.01563rem rgba(11, 32, 86, 0.8);
|
||
margin: 1.0417rem 0;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-direction: column;
|
||
}
|
||
.left .items .content .i-item .i-desc .id-txt {
|
||
font-size: 0.6292rem;
|
||
color: #FFF;
|
||
}
|
||
.left .items .content .i-item .i-desc .id-num {
|
||
margin-top: 0.7813rem;
|
||
font-size: 1.3542rem;
|
||
color: #1AB1FF;
|
||
}
|
||
.left .items .content .i-item .i-desc .id-num-cl1 {
|
||
color: #12CDA2 !important;
|
||
}
|
||
</style>
|
||
<style>
|
||
.center .items .content .sgsjsj .sg-top {
|
||
display: flex;
|
||
height: 2.0313rem;
|
||
}
|
||
.center .items .content .sgsjsj .sg-top .sg-top-item {
|
||
/* width: .6875rem; */
|
||
background: rgba(15, 45, 88, 0.5);
|
||
margin-right: .44688rem;
|
||
border: 1px solid #0F2D58;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
color: #fff;
|
||
font-size: .6625rem;
|
||
padding: 0 1.0417rem 0 .77813rem;
|
||
}
|
||
.center .items .content .sgsjsj .sg-top .sg-top-item .num{ color: #1AB1FF;
|
||
font-size: .8542rem;}
|
||
.center .items .content .sgsjsj .sg-chart
|
||
{width: 100%;
|
||
height: 11.2708rem;
|
||
}
|
||
|
||
|
||
.center .items .tit ,.right .items .tit {
|
||
height: 1.4583rem;
|
||
|
||
font-size: .77292rem;
|
||
color: #7ecef7;
|
||
display: flex;
|
||
align-items: center;
|
||
padding-left: .05208rem;
|
||
}
|
||
.center .items .tit .tab-wrap, .right .items .tit .tab-wrap {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding-right: .22604rem;
|
||
}
|
||
.center .items .tit .tab-wrap .tab, .right .items .tit .tab-wrap .tab {
|
||
height: 1.4583rem;
|
||
font-size: .77292rem;
|
||
color: #7ECEF7;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
|
||
.center .items .tit .tab-wrap .tab>div , .right .items .tit .tab-wrap .tab>div {
|
||
height: 1.4583rem;
|
||
line-height: 1.4583rem;
|
||
text-align: center;
|
||
cursor: pointer;
|
||
padding: 0 .55208rem;
|
||
}
|
||
.center .items .tit .tab-wrap .tab .active, .right .items .tit .tab-wrap .tab .active{
|
||
color: #FFF;
|
||
position: relative;
|
||
z-index: 1;
|
||
cursor: default !important;
|
||
}
|
||
.center .items .tit .tab-wrap .tab .active::before, .right .items .tit .tab-wrap .tab .active::before {
|
||
height: 1.4583rem;
|
||
content: '';
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
z-index: -1;
|
||
background-color: #19509E;
|
||
transform: skew(-15deg);
|
||
}
|
||
|
||
.center .items .flexCenter
|
||
{
|
||
height:12rem;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
.center .items .content .wdgcsj {
|
||
width: 28.97917rem;
|
||
height: 10.01563rem;
|
||
background: url(../res/assets/image/index1/wdgcsj.png) center center / 100% 100% no-repeat;
|
||
font-size: 0;
|
||
display:flex;
|
||
flex-wrap:wrap;
|
||
}
|
||
.center .items .content .wdgcsj .item {
|
||
|
||
width: 50%;
|
||
height: 5.59375rem;
|
||
position: relative;
|
||
}
|
||
|
||
.center .items .content .wdgcsj .item .leftPos {
|
||
position: absolute;
|
||
left: .5208rem;
|
||
top: .7813rem;
|
||
}
|
||
.center .items .content .wdgcsj .item .rightPos {
|
||
position: absolute;
|
||
right: .5208rem;
|
||
top: .7813rem;
|
||
text-align: right;
|
||
}
|
||
.center .items .content .wdgcsj .item .item-inner .desc {
|
||
color: #7ECEF7;
|
||
font-size: .77292rem;
|
||
margin-bottom: .55208rem;
|
||
}
|
||
.center .items .content .wdgcsj .item .item-inner .num {
|
||
color: #1AB1FF;
|
||
font-size: .88542rem;
|
||
}
|
||
|
||
.center .items .content .yjglsj {
|
||
width: 15.53125rem;
|
||
height: 12.22917rem;
|
||
background: url(../res/assets/image/index1/yjglsj.png) center center / 100% 100% no-repeat;
|
||
font-size: 0;
|
||
}
|
||
.center .items .content .yjglsj .item {
|
||
display: inline-block;
|
||
width: 50%;
|
||
height: 5.59375rem;
|
||
}
|
||
.center .items .content .yjglsj .item .item-inner
|
||
{
|
||
height:100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-direction: column;
|
||
}
|
||
|
||
.center .items .content .yjglsj .item .item-inner .num {
|
||
color: #1AB1FF;
|
||
font-size: 1.5625rem;
|
||
margin-bottom: .88854rem;
|
||
}
|
||
.center .items .content .yjglsj .desc {
|
||
color: #7ECEF7;
|
||
font-size: .77292rem;
|
||
}
|
||
.right .items .new_table{
|
||
font-size: 0.7rem;
|
||
}
|
||
.right .items .new_table .new_thead{
|
||
width: 100%;
|
||
display: flex;
|
||
flex-direction: row;
|
||
|
||
}
|
||
|
||
.right .items .new_table .new_thead .th{
|
||
color:#7ECEF7;
|
||
text-align: center;
|
||
height: 1.75rem;
|
||
line-height: 1.75rem;
|
||
background-color: #213771;
|
||
}
|
||
.right .items .new_table .new_thead .time{
|
||
flex: 1;
|
||
}
|
||
.right .items .new_table .new_thead .content{
|
||
width: 70%;
|
||
}
|
||
.right .items .new_table .new_tbody{
|
||
width: 100%;
|
||
|
||
|
||
}
|
||
.right .items .new_table .new_tbody .tr{
|
||
width: 100%;
|
||
background-color: rgba(33,55,133,0.5);
|
||
|
||
color: #ffffff;
|
||
}
|
||
.right .items .new_table .new_tbody .tr .list
|
||
{
|
||
display: flex;
|
||
flex-direction: row;}
|
||
.right .items .new_table .new_tbody .tr span{
|
||
text-align: center;
|
||
height: 1.55rem;
|
||
line-height: 1.55rem;
|
||
}
|
||
.right .items .new_table .new_tbody .tr .time{
|
||
flex: 1;
|
||
}
|
||
.right .items .new_table .new_tbody .tr .content{
|
||
width: 70%;
|
||
white-space: nowrap; /* 保证文本在一行内显示 */
|
||
overflow: hidden; /* 隐藏溢出的内容 */
|
||
text-overflow: ellipsis; /* 使用省略号表示溢出的文本 */
|
||
}
|
||
.spjc{
|
||
padding: 1.5rem 0;
|
||
margin: 0.5rem 0;
|
||
position: relative;
|
||
}
|
||
.spjc .bottom_right span{
|
||
border-bottom: 1px solid;
|
||
cursor: pointer;
|
||
margin-left: 0.5rem;
|
||
}
|
||
|
||
|
||
.spjc img{
|
||
width: 100%;
|
||
height: 100%;
|
||
cursor: pointer;
|
||
|
||
}
|
||
.spjc .bottom{
|
||
position: absolute;
|
||
bottom: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
|
||
|
||
}
|
||
.spjc .bottom_info{
|
||
line-height: 1.5rem;
|
||
background-color: #213771;
|
||
color: #7ECEF7;
|
||
font-size: 0.7rem;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
padding:0 0.2rem;
|
||
box-sizing: border-box;
|
||
}
|
||
.spjc .top{
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
}
|
||
.spjc .top .top_title{
|
||
line-height: 1.5rem;
|
||
background-color: linear-gradient(270deg, rgba(7, 39, 97, 0) 0%, rgba(68, 121, 216, 0.69) 100%);
|
||
background: linear-gradient(270deg, rgba(7, 39, 97, 0) 0%, rgba(68, 121, 216, 0.69) 100%);
|
||
background-image: linear-gradient(270deg, rgba(7, 39, 97, 0) 0%, rgba(68, 121, 216, 0.69) 100%);
|
||
background-position-x: initial;
|
||
background-position-y: initial;
|
||
background-size: initial;
|
||
background-repeat: initial;
|
||
background-attachment: initial;
|
||
background-origin: initial;
|
||
background-clip: initial;
|
||
background-color: initial;
|
||
color: #fff;
|
||
font-size: 0.7rem;
|
||
|
||
box-sizing: border-box;
|
||
padding-left: 1rem;
|
||
}
|
||
|
||
.swiper {
|
||
width: 600px;
|
||
height:11rem;
|
||
border: 1px solid #000;
|
||
|
||
}
|
||
|
||
.swiper-slide {
|
||
border: 1px;
|
||
background-color: aqua;
|
||
color: #fff;
|
||
}
|
||
|
||
|
||
.swiper-wrapper {
|
||
/* 这里是改变其动画效果为匀速形式，不加此样式的话会造成滚动卡顿，看起来效果不平滑 */
|
||
/* 样式做了各种浏览器的兼容 */
|
||
transition-timing-function:linear !important;
|
||
-webkit-transition-timing-function: linear !important;
|
||
-moz-transition-timing-function: linear !important;
|
||
-ms-transition-timing-function: linear !important;
|
||
-o-transition-timing-function: linear !important;
|
||
transition-timing-function: linear !important;
|
||
}
|
||
|
||
</style>
|
||
</head>
|
||
|
||
<body>
|
||
<script src="../res/lib/flexlib.js">
|
||
|
||
</script>
|
||
<div id="wrap">
|
||
<div class="left">
|
||
<div class="items">
|
||
<div class="title">安全数据统计</div>
|
||
<div class="statistics">
|
||
<div class="statistics-label">安全人工时</div>
|
||
<div class="statistics-nub" id="divSafeWorkTime" runat="server">00000000000</div>
|
||
</div>
|
||
<div class="service" style="padding-top:0">
|
||
<div class="boxs">
|
||
<div class="box">
|
||
<p>当前现场人数</p>
|
||
<p id="divALLPerson" runat="server">0</p>
|
||
</div>
|
||
<div class="box">
|
||
<p>作业人员总数</p>
|
||
<p id="divZYPerson" runat="server">0</p>
|
||
</div>
|
||
<div class="box">
|
||
<p>管理人员总数</p>
|
||
<p id="divGLPerson" runat="server">0</p>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="items" style="height: 21rem;">
|
||
<div class="title">预警警报</div>
|
||
<div class="predict">
|
||
<div class="box">
|
||
<div class="box-item">
|
||
<img src="../res/images/02/10zzyj.png">
|
||
<div class="item-text">
|
||
<span style="color: #F24166;" id="divenergyData" runat="server">0</span>
|
||
<span style="color: #F24166;">水电监测</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="box">
|
||
<div class="box-item box-right">
|
||
<img src="../res/images/02/10zzyj.png">
|
||
<div class="item-text">
|
||
<span style="color: #F24166;" runat="server" id="divtowerCraneWarningData">0</span>
|
||
<span style="color: #F24166;">塔式起重机预警</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="box">
|
||
<div class="box-item">
|
||
<img src="../res/images/02/10zzyj.png">
|
||
<div class="item-text">
|
||
<span style="color: #F24166;" runat="server" id="divdeepPitCheckData">0</span>
|
||
<span style="color: #F24166;">基坑监测预警</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="box">
|
||
<div class="box-item box-right">
|
||
<img src="../res/images/02/10zzyj.png">
|
||
<div class="item-text">
|
||
<span style="color: #F24166;" runat="server" id="divcarWashCheckData">0</span>
|
||
<span style="color: #F24166;">车辆冲洗监测       </span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div style="display: flex; justify-content: space-between;">
|
||
<div class="items" style="width: 8rem;">
|
||
<div class="title" style="font-size: 0.6rem;">安全费用</div>
|
||
<div class="content flexCenter margin-left">
|
||
<div class="i-item js-hover" data-type="SafeCost">
|
||
<div class="i-desc flexCenterV tbMg">
|
||
<div class="id-txt">费用提取（元）</div>
|
||
<div class="id-num"><%= showData(hSSEData_HSSE.CostExtract, "--") %></div>
|
||
</div>
|
||
<div class="i-desc flexCenterV">
|
||
<div class="id-txt">费用使用（元）</div>
|
||
<div class="id-num"><%= showData(hSSEData_HSSE.CostUse, "--") %></div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
<div class="items" style="width: 8rem;">
|
||
<div class="title" style="font-size: 0.6rem;">施工机具设备</div>
|
||
<div class="content flexCenter margin-left">
|
||
|
||
<div class="i-item js-hover" data-type="ConstructionEquipment">
|
||
<div class="i-desc flexCenterV tbMg">
|
||
<div class="id-txt">在用</div>
|
||
<div class="id-num"><%= showData(hSSEData_HSSE.UseEquipmentNum, "--") %></div>
|
||
|
||
</div>
|
||
<div class="i-desc flexCenterV">
|
||
<div class="id-txt">特种设备</div>
|
||
<div class="id-num"><%= showData(hSSEData_HSSE.SpecialEquipmentNum, "--") %></div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
<div class="items" style="width: 8rem;">
|
||
<div class="title" style="font-size: 0.6rem;">高风险作业许可</div>
|
||
<div class="content flexCenter margin-left">
|
||
|
||
<div class="i-item js-hover" data-type="HighRiskWorkPermit">
|
||
<div class="i-desc flexCenterV tbMg">
|
||
<div class="id-txt">许可项</div>
|
||
<div class="id-num id-num-cl1"><%= showData(hSSEData_HSSE.LicensesNum, "--") %></div>
|
||
</div>
|
||
<div class="i-desc flexCenterV">
|
||
<div class="id-txt">关闭项</div>
|
||
<div class="id-num id-num-cl2"><%= showData(hSSEData_HSSE.LicensesCloseNum, "--") %></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
</div>
|
||
<div class="center">
|
||
<div class="items1">
|
||
<div class="title">项目鸟瞰图</div>
|
||
<div class="general">
|
||
<div class="general-i">
|
||
<ul>
|
||
<li>
|
||
<p class="label">工程名称:</p>
|
||
<p class="val" id="divProjectName" runat="server"></p>
|
||
</li>
|
||
<li>
|
||
<p class="label">工程地点:</p>
|
||
<p class="val" id="divProjectAddress" runat="server"></p>
|
||
</li>
|
||
<li>
|
||
<p class="label">工程造价:</p>
|
||
<p class="val" id="divProjectMoney" runat="server">万元</p>
|
||
</li>
|
||
<li>
|
||
<p class="label">建设单位:</p>
|
||
<p class="val" id="divOwnUnit" runat="server"></p>
|
||
</li>
|
||
<li>
|
||
<p class="label">施工单位:</p>
|
||
<p class="val" runat="server" id="divSGUnit"></p>
|
||
</li>
|
||
<li>
|
||
<p class="label"> 监理单位:</p>
|
||
<p class="val" id="divJLUnit" runat="server"></p>
|
||
</li>
|
||
|
||
</ul>
|
||
</div>
|
||
<div class="general-i">
|
||
<div class="project" id="divProjectImg">
|
||
|
||
</div>
|
||
</div>
|
||
<div class="general-i">
|
||
<div class="boxs">
|
||
<div class="box">
|
||
<div class="box-label">合同总工期</div>
|
||
<div class="box-val pact" id="divProjectDays" runat="server">0<span>天</span></div>
|
||
</div>
|
||
<div class="box">
|
||
<div class="box-label">合同到期时间</div>
|
||
<div class="box-val time" id="divEndDate" runat="server"></div>
|
||
</div>
|
||
<div class="box">
|
||
<div class="box-label">距竣工剩余</div>
|
||
<div class="box-val residue" id="divRemainingDays" runat="server">0<span>天</span></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="spjc" style="height: 25rem;">
|
||
<div class="top">
|
||
<div class="top_title" >
|
||
<span>安全云监控</span>
|
||
</div>
|
||
</div>
|
||
<%-- <img src="../res/assets/image/video.jpg" alt="">--%>
|
||
<live-player id="player01" live="true" aspect="16:12"></live-player>
|
||
<div class="bottom">
|
||
<div class="bottom_info">
|
||
<div class="bottom_left"> 实时视频 </div>
|
||
<div class="bottom_right"> <span id='more'>更多</span></div>
|
||
|
||
|
||
</div>
|
||
</div>
|
||
<div class="quality" style="display: none;">
|
||
<div class="boxs">
|
||
<div class="boxs-label"><span>问题总数</span><span
|
||
style="color:#00FFFF;" id="divCQMSAllNum" runat="server">0</span><span>个</span></div>
|
||
<div id="issueMap"></div>
|
||
</div>
|
||
|
||
<div class="boxs">
|
||
<div class="boxs-label"><span>已完成</span><span style="color:#15EDBB;" id="divCQMSCAllNum" runat="server">0</span><span>个</span>
|
||
</div>
|
||
<div id="finishMap"></div>
|
||
</div>
|
||
<div class="boxs">
|
||
<div class="boxs-label"><span>未完成</span><span style="color:#F24166;" id="divCQMSUCAllNum" runat="server">0</span><span>个</span>
|
||
</div>
|
||
<div id="unfinishedMap"></div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
</div>
|
||
<div style="display:flex;flex-direction:row;justify-content:space-between" >
|
||
<div class="items" style='width:13rem !important' id="divIPersonNum">
|
||
<div class="title" id="divDesignNum" style="font-size: 0.6rem;">风险分级动态管控</div>
|
||
<div class="plan" style='display:none'>
|
||
<div class="zlpxsj-wrap">
|
||
<div class="zlpxsj">
|
||
<div class="left">
|
||
<div class="num" id="divIPersonNum" runat="server">0</div>
|
||
<div class="desc">质量培训人次数</div>
|
||
</div>
|
||
<div class="right">
|
||
<div class="num" id="divDesignNum" runat="server">0</div>
|
||
<div class="desc">技术交底人次数</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<%--<div class="sgsjsj">
|
||
<div class="sg-top">
|
||
<div class="sg-top-item">
|
||
<div>未遂</div>
|
||
<div class="num">
|
||
0
|
||
</div>
|
||
</div>
|
||
<div class="sg-top-item">
|
||
<div>可记录</div>
|
||
<div class="num">
|
||
0
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div id="sgsjsj" class="sg-chart"></div>
|
||
</div>--%>
|
||
<div class="risk">
|
||
<div id="riskMap"></div>
|
||
</div>
|
||
</div>
|
||
<div class="items" style='width:15rem !important' >
|
||
<div class="title" style="font-size: 0.6rem;">危大/超危大数据</div>
|
||
<div class="plan" style='display:none'>
|
||
<div class="sbrc-item">
|
||
<div class="sbrci-bigTit">
|
||
<div class="sbig-left">
|
||
<div class="first">焊工</div>
|
||
<div>总数</div>
|
||
</div>
|
||
<div class="sbig-right" id="divHjPersonNum" runat="server">0</div>
|
||
</div>
|
||
<div class="sbrci-list">
|
||
<div class="item">
|
||
<div class="item-c">
|
||
<div class="num" id="divTotalDineNum" runat="server">0</div>
|
||
<div class="desc">总达因数</div>
|
||
</div>
|
||
</div>
|
||
<div class="item">
|
||
<div class="item-c">
|
||
<div class="num" id="divCompleteDineNum" runat="server">0</div>
|
||
<div class="desc">完成达因数</div>
|
||
</div>
|
||
</div>
|
||
<div class="item">
|
||
<div class="item-c">
|
||
<div class="num" id="divTotalFilmNum" runat="server">0</div>
|
||
<div class="desc">总片数</div>
|
||
</div>
|
||
</div>
|
||
<div class="item">
|
||
<div class="item-c">
|
||
<div class="num" id="divOkFilmNum" runat="server">0</div>
|
||
<div class="desc">合格片数</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
<div class="tit">
|
||
<div class="txt tab-wrap">
|
||
<div></div>
|
||
<div class="tab">
|
||
<div class="active" data-type="large">危大工程</div>
|
||
<div data-type="super">超危大工程</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="content flexCenter">
|
||
<div class="wdgcsj">
|
||
<div class="item js-hover" data-type="wdgcsj" data-tabType="wdgcsj">
|
||
<div class="item-inner leftPos">
|
||
<div class="desc mgbS">未开始个数</div>
|
||
<div id="pro_static_1" class="num">
|
||
<%= showData(hSSEData_HSSE.CompletedNum, "--" ) %>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="item js-hover" data-type="wdgcsj" data-tabType="wdgcsj">
|
||
<div class="item-inner rightPos">
|
||
<div class="desc mgbS">培训人次数</div>
|
||
<div id="pro_static_2" class="num">
|
||
<%= showData(hSSEData_HSSE.TrainPersonNum, "--" ) %>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="item js-hover" data-type="wdgcsj" data-tabType="wdgcsj">
|
||
<div class="item-inner leftPos">
|
||
<div id="pro_static_3" class="num mgbS numC1">
|
||
<%= showData(hSSEData_HSSE.ConstructionNum, "--" ) %>
|
||
</div>
|
||
<div class="desc">施工个数</div>
|
||
</div>
|
||
</div>
|
||
<div class="item js-hover" data-type="wdgcsj" data-tabType="wdgcsj">
|
||
<div class="item-inner rightPos">
|
||
<div id="pro_static_4" class="num mgbS numC2">
|
||
<%= showData(hSSEData_HSSE.FinishedNum, "--" ) %>
|
||
</div>
|
||
<div class="desc">完工个数</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="items" style='width:14rem !important'>
|
||
<div class="title" style="font-size: 0.6rem;">应急管理数据</div>
|
||
|
||
<div class="tit">
|
||
<div class="txt tab-wrap">
|
||
<div></div>
|
||
<div class="tab">
|
||
<%--<div data-type="large">企业级</div>--%>
|
||
<div class="active" data-type="super">项目级</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="content flexCenter">
|
||
<div class="yjglsj">
|
||
<div class="item js-hover" data-type="yjglsj" data-tabType="yjglsj">
|
||
<div class="item-inner flexCenterV">
|
||
<div id="yj_num_1" class="num">
|
||
<%= showData(hSSEData_HSSE.ProjectComprehensivePlanNum, "--" ) %>
|
||
</div>
|
||
<div class="desc">综合预案</div>
|
||
</div>
|
||
</div>
|
||
<div class="item js-hover" data-type="yjglsj" data-tabType="yjglsj">
|
||
<div class="item-inner flexCenterV">
|
||
<div id="yj_num_2" class="num">
|
||
<%= showData(hSSEData_HSSE.ProjectSpecialPlanNum, "--" ) %>
|
||
</div>
|
||
<div class="desc">专项预案</div>
|
||
</div>
|
||
</div>
|
||
<div class="item js-hover" data-type="yjglsj" data-tabType="yjglsj">
|
||
<div class="item-inner flexCenterV">
|
||
<div id="yj_num_3" class="num">
|
||
<%= showData(hSSEData_HSSE.ProjectOnSiteDisposalPlan, "--" ) %>
|
||
</div>
|
||
<div class="desc">现场处置预案</div>
|
||
</div>
|
||
</div>
|
||
<div class="item js-hover" data-type="yjglsj" data-tabType="yjglsj">
|
||
<div class="item-inner flexCenterV">
|
||
<div id="yj_num_4" class="num">
|
||
<%= showData(hSSEData_HSSE.ProjectDrillNum, "--" ) %>
|
||
</div>
|
||
<div class="desc">演练次数</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
<div class="right">
|
||
<div class="items">
|
||
<div class="title">安全/质量检查</div>
|
||
<div class="tit">
|
||
<div class="txt tab-wrap">
|
||
<div></div>
|
||
<div class="tab">
|
||
<div class="active" data-type="large">安全</div>
|
||
<div data-type="super">质量</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="statistics">
|
||
<div class="boxs">
|
||
<div class="box">
|
||
<span style="color:#00FFFF;" runat="server" id="divAllRectify">0</span>
|
||
<img src="../res/images/02/07aqtj01.png">
|
||
<span>总数（次）</span>
|
||
</div>
|
||
<div class="box">
|
||
<span style="color:#15EDBB;" runat="server" id="divCRectify">0</span>
|
||
<img src="../res/images/02/08aqtj02.png">
|
||
<span>已闭合（次）</span>
|
||
</div>
|
||
<div class="box">
|
||
<span style="color:#F24166;" runat="server" id="divUCRectify">0</span>
|
||
<img src="../res/images/02/09aqtj03.png">
|
||
<span>未闭合（次）</span>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
|
||
<div class="items stl-bottom bg js-hover" style="height: 22.5rem;" data-type="NoticeData">
|
||
<div class="title">通知公告</div>
|
||
<div class="new_table">
|
||
<div class="new_thead">
|
||
<div class="th time">
|
||
时间
|
||
</div>
|
||
<div class="th content">
|
||
内容
|
||
</div>
|
||
</div>
|
||
|
||
<div class="new_tbody " id="wrapper">
|
||
<%-- <div class="tr " id='list' > <div class='list '>
|
||
<span class="time">
|
||
2024-5-25
|
||
</span> <span class="content">
|
||
领导督查年化肥项目原水等装置土建分包工程项目
|
||
</span> </div> </div>--%>
|
||
<%=notice %>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
<div class="items" style="height: 15.5rem;">
|
||
<div class="title">环境监测</div>
|
||
<div class="env">
|
||
<div class="boxs">
|
||
<div class="box-column">
|
||
<div class="box">
|
||
<div class="left">
|
||
<p>温度<span>℃</span></p>
|
||
<img src="../res/images/02/37.png">
|
||
</div>
|
||
<div class="num" style="color: #CFC782;" id="divTemp" runat="server">0</div>
|
||
</div>
|
||
<div class="box">
|
||
<div class="left">
|
||
<p>噪音<span>db</span></p>
|
||
<img src="../res/images/02/40.png">
|
||
</div>
|
||
<div class="num" style="color: #CFC782;margin-left:0;" id="divNoise" runat="server">0</div>
|
||
</div>
|
||
<div class="box">
|
||
<div class="left">
|
||
<p>湿度<span>%rh</span></p>
|
||
<img src="../res/images/02/38.png">
|
||
</div>
|
||
<div class="num" style="color: #CFC782;" id="divHumid" runat="server">0</div>
|
||
</div>
|
||
</div>
|
||
<div class="env_center">
|
||
<img width="46px" height="46px" src="../res/images/02/35pm10.png">
|
||
<p id="divTemp2" runat="server"><span>℃</span></p>
|
||
<p class="d" runat="server" id="divInfo">多云</p>
|
||
</div>
|
||
<div class="box-column box-column1">
|
||
<div class="box">
|
||
<div class="num" style="color: #CFC782;" id="divPmTwoPointFive" runat="server">0</div>
|
||
<div class="left">
|
||
<p>PM2.5<span></span></p>
|
||
<img src="../res/images/02/39.png">
|
||
</div>
|
||
</div>
|
||
<div class="box">
|
||
<div class="num" style="color: #CFC782;margin-right:0;" id="divWindSpeed" runat="server">0</div>
|
||
<div class="left">
|
||
<p>风速<span>km/h</span></p>
|
||
<img src="../res/images/02/41.png">
|
||
</div>
|
||
</div>
|
||
<div class="box">
|
||
<div class="num" style="color: #CFC782;" id="divPmTen" runat="server">0</div>
|
||
<div class="left">
|
||
<p>PM10<span></span></p>
|
||
<img src="../res/images/02/42.png">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="hover-wrap">
|
||
<div class="hover-item">
|
||
</div>
|
||
</div>
|
||
|
||
</body>
|
||
|
||
</html>
|
||
<script src="../res/lib/echarts.min.js"></script>
|
||
<script src="../res/lib/china.js"></script>
|
||
<script src="../res/js/optionV2.js"></script>
|
||
<script src="../res/lib/jquery.js"></script>
|
||
<script src="../res/liveplayer/liveplayer-element.min.js"></script>
|
||
<script src="../res/assets/js/video-7.15.0.min.js"></script>
|
||
<script src="../res/assets/js/jquery-3.7.1.min.js"></script>
|
||
<script src="../res/assets/js/jquery.mousewheel.min.js"></script>
|
||
<script src="../res/assets/js/hScrollPane.js"></script>
|
||
<script src="../res/assets/js/echarts-5.2.0.min.js"></script>
|
||
<script src="../res/assets/js/china.js"></script>
|
||
<script>
|
||
// var mySwiper = new Swiper('.swiper', {
|
||
// direction: 'vertical', // 垂直切换选项
|
||
// loop: true, // 循环模式选项
|
||
// loopPreventsSlide: true,//当swiper 正在过渡时，阻止slide 前进后退的切换操作
|
||
// observer: true,
|
||
// observeParents: true,
|
||
// slidesPerView: 5, //swiper容器同时展示的元素数量
|
||
// spaceBetween: 20, //元素之间间隔距离
|
||
// speed: 2000, //slider自动滑动开始到结束的时间
|
||
// autoplay: {//开启自动切换
|
||
// delay: 0,//自动切换的时间间隔
|
||
// stopOnLastSlide: false,//当切换到最后一个slide时停止自动切换
|
||
// disableOnInteraction: false,//用户操作swiper之后，是否停止自动切换效果
|
||
// },
|
||
// })
|
||
|
||
var videoURL = '<%= VideoHost %>';
|
||
let more = document.getElementById('more')
|
||
more.addEventListener("click", function () {
|
||
// 在点击事件中执行的代码
|
||
if (videoURL) {
|
||
//var username = $('#SimpleForm1_hfProjectCode-inputEl').val()
|
||
//var password = $('#SimpleForm1_hfMonitorPW-inputEl').val();
|
||
console.log(videoURL);
|
||
debugger
|
||
window.open(videoURL + "#/screen?username=" + '<%= VideoUserName %>' + "&password=" + '<%= VideoPassWord %>', '_blank');
|
||
}
|
||
else {
|
||
alert("您没有权限！");
|
||
}
|
||
});
|
||
|
||
|
||
|
||
// // 人员统计 在岗率初始化
|
||
// var guardMap = echarts.init(document.getElementById('onGuardMap'));
|
||
// guardMap.setOption(guardOption)
|
||
|
||
// 风险分级
|
||
let riskData1 = [
|
||
{ value: <%=riskData4%>, name: '四级/重大风险', label: { color: '#FF7473' }, itemStyle: { color: '#FF7473' }, labelLine: { lineStyle: { color: '#FF7473' } } },
|
||
{ value: <%=riskData1%>, name: '一级/低风险', label: { color: '#5C5AFF' }, itemStyle: { color: '#5C5AFF' }, labelLine: { lineStyle: { color: '#5C5AFF' } } },
|
||
{ value: <%=riskData2%>, name: '三级/较大风险', label: { color: '#FFA502' }, itemStyle: { color: '#FFA502' }, labelLine: { lineStyle: { color: '#FFA502' } } },
|
||
{ value: <%=riskData3%>, name: '二级/一般风险', label: { color: '#E7EA2E' }, itemStyle: { color: '#E7EA2E' }, labelLine: { lineStyle: { color: '#E7EA2E' } } },
|
||
]
|
||
let riskOption1 = {
|
||
tooltip: {
|
||
trigger: 'item'
|
||
},
|
||
series: [
|
||
{
|
||
type: 'pie',
|
||
radius: ['20%', '60%'],
|
||
center: ['50%', '50%'],
|
||
label: {
|
||
formatter: '{b}\n{c}'
|
||
},
|
||
data: riskData1.sort(function (a, b) {
|
||
return a.value - b.value;
|
||
}),
|
||
roseType: 'radius',
|
||
|
||
animationType: 'scale',
|
||
animationEasing: 'elasticOut',
|
||
animationDelay: function (idx) {
|
||
return Math.random() * 200;
|
||
}
|
||
}
|
||
]
|
||
};
|
||
|
||
var riskMap = echarts.init(document.getElementById('riskMap'));
|
||
riskMap.setOption(riskOption1)
|
||
|
||
// 劳务数据
|
||
// X轴数据
|
||
var laborId_xAxisData = JSON.parse('<%=WorkPostS %>')
|
||
var laborId_data1 = JSON.parse('<%=InPostCounts %>')
|
||
var laborId_data2 = JSON.parse('<%=InDutyCounts %>')
|
||
// Y轴数据
|
||
var laborId_series = [{
|
||
name: '在岗',
|
||
type: 'bar',
|
||
barWidth: 26,
|
||
data: laborId_data1,
|
||
},
|
||
{
|
||
name: '在场',
|
||
type: 'bar',
|
||
barWidth: 26,
|
||
data: laborId_data2,
|
||
barGap: '-100%',
|
||
}]
|
||
|
||
|
||
var option = {
|
||
color: ['#d0f5ec', '#12cda2'],
|
||
grid: {
|
||
top: '10%',
|
||
left: '0%',
|
||
right: '0%',
|
||
bottom: '3%',
|
||
containLabel: true
|
||
},
|
||
tooltip: {
|
||
trigger: 'axis',
|
||
showDelay: 0,
|
||
axisPointer: {
|
||
type: 'shadow'
|
||
}
|
||
},
|
||
xAxis: {
|
||
data: laborId_xAxisData,
|
||
axisLabel: {
|
||
interval: 0,
|
||
color: '#179eb3',
|
||
},
|
||
axisTick: {
|
||
show: false,
|
||
},
|
||
axisLine: {
|
||
onZero: true,
|
||
lineStyle: {
|
||
color: '#179eb3',
|
||
width: 1,
|
||
}
|
||
},
|
||
boundaryGap: true
|
||
},
|
||
yAxis: {
|
||
type: 'value',
|
||
axisLabel: {
|
||
show: true,
|
||
color: '#179eb3',
|
||
},
|
||
axisTick: {
|
||
show: false,
|
||
},
|
||
axisLine: {
|
||
show: true,
|
||
onZero: false,
|
||
lineStyle: {
|
||
color: '#179eb3',
|
||
width: 1,
|
||
}
|
||
},
|
||
splitLine: {
|
||
show: true,
|
||
lineStyle: {
|
||
type: 'dashed',
|
||
color: '#0D3C65',
|
||
},
|
||
},
|
||
splitNumber: 5,
|
||
},
|
||
series: laborId_series
|
||
};
|
||
if (laborId_xAxisData.length > 5) {
|
||
option.dataZoom = [{
|
||
type: 'slider',
|
||
show: true,
|
||
startValue: 0,
|
||
endValue: 4,
|
||
height: '3',
|
||
backgroundColor: 'rgba(47,69,84,0)',
|
||
fillerColor: 'rgba(47,69,84,0)',
|
||
bottom: '0%',
|
||
zoomLock: true,
|
||
moveOnMouseWheel: true,
|
||
brushSelect: true,
|
||
showDetail: false,
|
||
}]
|
||
}
|
||
// var safeMap = echarts.init(document.getElementById('serviceMap'));
|
||
//option && safeMap.setOption(option)
|
||
|
||
|
||
|
||
|
||
// var riskMap = echarts.init(document.getElementById('riskMap'));
|
||
// riskMap.setOption(riskOption)
|
||
let issueData1 = [
|
||
{
|
||
value: <%=CRectificationRate%>
|
||
}
|
||
];
|
||
let issueOption1 = {
|
||
title: {
|
||
text: '整改率',
|
||
textStyle: {
|
||
color: '#FFA600 ',
|
||
fontSize: 0.7368 * basePx,
|
||
},
|
||
bottom: 0,
|
||
left: 'center'
|
||
},
|
||
series: [
|
||
{
|
||
type: 'gauge',
|
||
startAngle: 225,
|
||
endAngle: -45,
|
||
progress: {
|
||
show: true,
|
||
overlap: false,
|
||
roundCap: true,
|
||
clip: false,
|
||
lineStyle: {
|
||
|
||
}
|
||
},
|
||
pointer: { // 时针
|
||
show: false
|
||
},
|
||
splitLine: {
|
||
show: false,
|
||
distance: 0,
|
||
length: 0.5263 * basePx
|
||
},
|
||
axisLine: {
|
||
roundCap: false,
|
||
lineStyle: {
|
||
width: 0.8421 * basePx,
|
||
color: [[1, '#0E3668']]
|
||
}
|
||
},
|
||
axisTick: { // 刻度
|
||
show: false
|
||
},
|
||
axisLabel: {
|
||
show: false,
|
||
distance: 2.6316 * basePx,
|
||
},
|
||
itemStyle: {
|
||
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||
{ offset: 0, color: '#EB9002' },
|
||
{ offset: 1, color: '#404745' }
|
||
]),
|
||
},
|
||
title: {
|
||
show: true,
|
||
offsetCenter: [0, '75%'],
|
||
width: 1.5789 * basePx,
|
||
height: 0.2632 * basePx,
|
||
borderRadius: 0.1053 * basePx,
|
||
shadowBlur: 0.1579 * basePx,
|
||
shadowColor: '#C88621',
|
||
backgroundColor: '#C88621',
|
||
},
|
||
detail: {
|
||
fontSize: 1.5789 * basePx,
|
||
color: '#B78021',
|
||
formatter: '{value}{a|%}',
|
||
offsetCenter: [0, 0],
|
||
rich: {
|
||
a: {
|
||
fontSize: 0.8421 * basePx,
|
||
color: '#B78021'
|
||
}
|
||
}
|
||
},
|
||
data: issueData1
|
||
}
|
||
]
|
||
};
|
||
// var issueMap = echarts.init(document.getElementById('issueMap'));
|
||
// issueMap.setOption(issueOption1)
|
||
|
||
let finishData1 = [
|
||
{
|
||
value: <%=CQualifiedRate%>
|
||
}
|
||
];
|
||
let finishOption1 = {
|
||
title: {
|
||
text: '合格率',
|
||
textStyle: {
|
||
color: '#15EDBB ',
|
||
fontSize: 0.7368 * basePx,
|
||
},
|
||
bottom: 0,
|
||
left: 'center'
|
||
},
|
||
series: [
|
||
{
|
||
type: 'gauge',
|
||
startAngle: 225,
|
||
endAngle: -45,
|
||
progress: {
|
||
show: true,
|
||
overlap: false,
|
||
roundCap: true,
|
||
clip: false,
|
||
lineStyle: {
|
||
|
||
}
|
||
},
|
||
pointer: { // 时针
|
||
show: false
|
||
},
|
||
splitLine: {
|
||
show: false,
|
||
distance: 0,
|
||
length: 10
|
||
},
|
||
axisLine: {
|
||
roundCap: false,
|
||
lineStyle: {
|
||
width: 0.8421 * basePx,
|
||
color: [[1, '#0E3668']]
|
||
}
|
||
},
|
||
axisTick: { // 刻度
|
||
show: false
|
||
},
|
||
axisLabel: {
|
||
show: false,
|
||
distance: 2.6316 * basePx,
|
||
},
|
||
itemStyle: {
|
||
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||
{ offset: 0, color: '#01D4D4' },
|
||
{ offset: 1, color: '#026974' }
|
||
]),
|
||
},
|
||
title: {
|
||
show: true,
|
||
offsetCenter: [0, '75%'],
|
||
width: 1.5789 * basePx,
|
||
height: 0.2632 * basePx,
|
||
borderRadius: 0.1053 * basePx,
|
||
shadowBlur: 0.1579 * basePx,
|
||
shadowColor: '#15EDBB ',
|
||
backgroundColor: '#15EDBB ',
|
||
},
|
||
detail: {
|
||
fontSize: 1.5789 * basePx,
|
||
color: '#15EDBB ',
|
||
formatter: '{value}{a|%}',
|
||
offsetCenter: [0, 0],
|
||
rich: {
|
||
a: {
|
||
fontSize: 0.8421 * basePx,
|
||
color: '#15EDBB '
|
||
}
|
||
}
|
||
},
|
||
data: finishData1
|
||
}
|
||
]
|
||
};
|
||
|
||
// var finishMap = echarts.init(document.getElementById('finishMap'));
|
||
// finishMap.setOption(finishOption1)
|
||
|
||
|
||
let unfinishedData1 = [
|
||
|
||
{
|
||
value: <%=FirstPassRate%>
|
||
}
|
||
];
|
||
let unfinishedOption1 = {
|
||
title: {
|
||
text: '焊接一次合格率',
|
||
textStyle: {
|
||
color: '#15EDBB ',
|
||
fontSize: 0.7368 * basePx,
|
||
},
|
||
bottom: 0,
|
||
left: 'center'
|
||
},
|
||
series: [
|
||
{
|
||
type: 'gauge',
|
||
startAngle: 225,
|
||
endAngle: -45,
|
||
progress: {
|
||
show: true,
|
||
overlap: false,
|
||
roundCap: true,
|
||
clip: false,
|
||
lineStyle: {
|
||
|
||
}
|
||
},
|
||
pointer: { // 时针
|
||
show: false
|
||
},
|
||
splitLine: {
|
||
show: false,
|
||
distance: 0,
|
||
length: 10
|
||
},
|
||
axisLine: {
|
||
roundCap: false,
|
||
lineStyle: {
|
||
width: 0.8421 * basePx,
|
||
color: [[1, '#0E3668']]
|
||
}
|
||
},
|
||
axisTick: { // 刻度
|
||
show: false
|
||
},
|
||
axisLabel: {
|
||
show: false,
|
||
distance: 2.6316 * basePx,
|
||
},
|
||
itemStyle: {
|
||
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||
{ offset: 0, color: '#01D4D4' },
|
||
{ offset: 1, color: '#026974' }
|
||
]),
|
||
},
|
||
title: {
|
||
show: true,
|
||
offsetCenter: [0, '75%'],
|
||
width: 1.5789 * basePx,
|
||
height: 0.2632 * basePx,
|
||
borderRadius: 0.1053 * basePx,
|
||
shadowBlur: 0.1579 * basePx,
|
||
shadowColor: '#15EDBB ',
|
||
backgroundColor: '#15EDBB ',
|
||
},
|
||
detail: {
|
||
fontSize: 1.5789 * basePx,
|
||
color: '#15EDBB ',
|
||
formatter: '{value}{a|%}',
|
||
offsetCenter: [0, 0],
|
||
rich: {
|
||
a: {
|
||
fontSize: 0.8421 * basePx,
|
||
color: '#15EDBB '
|
||
}
|
||
}
|
||
},
|
||
data: unfinishedData1
|
||
}
|
||
]
|
||
};
|
||
// var unfinishedMap = echarts.init(document.getElementById('unfinishedMap'));
|
||
// unfinishedMap.setOption(unfinishedOption1)
|
||
</script>
|
||
<script>
|
||
function initTab() {
|
||
$(document).on('click', '.tab > div', function () {
|
||
var $this = $(this)
|
||
if ($this.hasClass('active')) {
|
||
return
|
||
}
|
||
var $tab = $this.closest('.tab')
|
||
$tab.find('div').removeClass('active')
|
||
$this.addClass('active')
|
||
debugger
|
||
if ($this.html() === '企业级') {
|
||
$('#yj_num_1').html('<%= showData(hSSEData_HSSE.CompanyComprehensivePlanNum, "--") %>');
|
||
$('#yj_num_2').html('<%= showData(hSSEData_HSSE.CompanySpecialPlanNum, "--") %>');
|
||
$('#yj_num_3').html('<%= showData(hSSEData_HSSE.CompanyOnSiteDisposalPlan, "--") %>');
|
||
$('#yj_num_4').html('<%= showData(hSSEData_HSSE.CompanyDrillNum, "--") %>');
|
||
} else if ($this.html() === '项目级') {
|
||
$('#yj_num_1').html('<%= showData(hSSEData_HSSE.ProjectComprehensivePlanNum, "--") %>');
|
||
$('#yj_num_2').html('<%= showData(hSSEData_HSSE.ProjectSpecialPlanNum, "--") %>');
|
||
$('#yj_num_3').html('<%= showData(hSSEData_HSSE.ProjectOnSiteDisposalPlan, "--") %>');
|
||
$('#yj_num_4').html('<%= showData(hSSEData_HSSE.ProjectDrillNum, "--") %>');
|
||
} else if ($this.html() === '危大工程') {
|
||
$('#pro_static_1').html('<%= showData(hSSEData_HSSE.CompletedNum, "--") %>');
|
||
$('#pro_static_2').html('<%= showData(hSSEData_HSSE.TrainPersonNum, "--") %>');
|
||
$('#pro_static_3').html('<%= showData(hSSEData_HSSE.ConstructionNum, "--") %>');
|
||
$('#pro_static_4').html('<%= showData(hSSEData_HSSE.FinishedNum, "--") %>');
|
||
} else if ($this.html() === '超危大工程') {
|
||
$('#pro_static_1').html('<%= showData(hSSEData_HSSE.SuperCompletedNum, "--") %>');
|
||
$('#pro_static_2').html('<%= showData(hSSEData_HSSE.SuperTrainPersonNum, "--") %>');
|
||
$('#pro_static_3').html('<%= showData(hSSEData_HSSE.SuperConstructionNum, "--") %>');
|
||
$('#pro_static_4').html('<%= showData(hSSEData_HSSE.SuperFinishedNum, "--") %>');
|
||
}
|
||
|
||
})
|
||
}
|
||
function GetClickHtml(obj) {
|
||
console.log(type)
|
||
var $this = $(obj), type = $this.attr('data-type'), tabType = $this.attr('data-tabType') || '';
|
||
var title = '';
|
||
if (tabType != '') {
|
||
tabType = $this.closest('.bb-item').find('.tab-wrap .tab .active').attr('data-type')
|
||
if (tabType == null) {
|
||
tabType = $this.closest('.str-bottom').find('.tab-wrap .tab .active').attr('data-type')
|
||
}
|
||
}
|
||
console.log(type)
|
||
if (type == 'NoticeData') {
|
||
$('iframe').attr('src', '../Notice/NoIssuedNotice.aspx') //安全会议数据
|
||
window.open("../Notice/NoIssuedNotice.aspx")
|
||
//Notice/NoIssuedNotice.aspx
|
||
}/*
|
||
else if (type == 'Video') {
|
||
$('iframe').attr('src', '../InterfacePopup/HSSE/VideoView.aspx') //视频监控
|
||
}*/
|
||
else {
|
||
// $('iframe').attr('src', '../SysManage/Unit.aspx')
|
||
// window.open("../DataShow/Unit.aspx")
|
||
console.log("通用")
|
||
}
|
||
}
|
||
|
||
function initClick() {
|
||
// 设置iframe高度
|
||
$('.click-wrap .click-item iframe').height($('.click-wrap').height())
|
||
$(".js-hover").click(function () {
|
||
console.log("通用")
|
||
var htmlContent = GetClickHtml(this)
|
||
// $('.click-wrap').show()
|
||
// $(".hover-wrap").hide()
|
||
})
|
||
$('.click-close').click(function () {
|
||
$('.click-wrap').hide()
|
||
})
|
||
}
|
||
$(function () {
|
||
var datasg = [
|
||
{ value: 10, name: '一般事故' },
|
||
{ value: 5, name: '较大事故' },
|
||
{ value: 5, name: '重大事故' },
|
||
{ value: 4, name: '特别重大' },
|
||
]
|
||
|
||
//initSgsjsj('sgsjsj', datasg)
|
||
|
||
})
|
||
|
||
// 获取url请求参数
|
||
function getUrlParam(name) {
|
||
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
|
||
var r = window.location.search.substr(1).match(reg); //匹配目标参数
|
||
if (r != null) return unescape(r[2]); return null; //返回参数值
|
||
}
|
||
|
||
// 切换全屏
|
||
$('.magnify').click(function () {
|
||
const element = document.documentElement
|
||
if (document.fullscreenElement) {
|
||
// 如果浏览器有这个Function
|
||
if (document.exitFullscreen) {
|
||
document.exitFullscreen()
|
||
} else if (document.webkitCancelFullScreen) {
|
||
document.webkitCancelFullScreen()
|
||
} else if (document.mozCancelFullScreen) {
|
||
document.mozCancelFullScreen()
|
||
} else if (document.msExitFullscreen) {
|
||
document.msExitFullscreen()
|
||
}
|
||
} else {
|
||
// 如果浏览器有这个Function
|
||
if (element.requestFullscreen) {
|
||
element.requestFullscreen()
|
||
} else if (element.webkitRequestFullScreen) {
|
||
element.webkitRequestFullScreen()
|
||
} else if (element.mozRequestFullScreen) {
|
||
element.mozRequestFullScreen()
|
||
} else if (element.msRequestFullscreen) {
|
||
element.msRequestFullscreen()
|
||
}
|
||
}
|
||
|
||
})
|
||
// 监听全屏变化
|
||
window.onresize = function () {
|
||
if (document.fullscreenElement) {
|
||
$('.nav-center').hide();
|
||
$('.magnify').text('退出全屏');
|
||
} else {
|
||
$('.nav-center').show();
|
||
$('.magnify').text('全屏');
|
||
}
|
||
}
|
||
|
||
// 选择项目
|
||
$('.selected').click(function () {
|
||
$('.selectedVal').toggle();
|
||
})
|
||
|
||
$('.selectedVal>li').click(function () {
|
||
$('.selected>span').text($('.selectedVal>li').text()).attr('title', $('.selectedVal>li').text());
|
||
})
|
||
|
||
|
||
var divProjectImg = '<%=divProjectImg %>'
|
||
|
||
function getUnitValues() {
|
||
$("#divProjectImg").css("background", "url('" + divProjectImg + "') center/100% 100% no-repeat ");
|
||
}
|
||
getUnitValues();
|
||
function initSgsjsj(id, data) {
|
||
var chartDom = document.getElementById(id);
|
||
var myChartSg = echarts.init(chartDom);
|
||
var option;
|
||
|
||
option = {
|
||
legend: {
|
||
show: false,
|
||
top: 'bottom'
|
||
},
|
||
tooltip: {
|
||
trigger: 'item',
|
||
formatter: '{a}<br />{b}<span style="color:#000;font-weight:bold;margin-left:15px;">{c}</span>'
|
||
},
|
||
toolbox: {
|
||
show: false,
|
||
feature: {
|
||
mark: { show: true },
|
||
dataView: { show: true, readOnly: false },
|
||
restore: { show: true },
|
||
saveAsImage: { show: true }
|
||
}
|
||
},
|
||
color: ['#595AFF', '#E9E931', '#FFA602', '#FF7474'],
|
||
series: [
|
||
{
|
||
name: '事故事件数据',
|
||
type: 'pie',
|
||
radius: [30, 55],
|
||
center: ['50%', '50%'],
|
||
roseType: 'area',
|
||
itemStyle: {
|
||
borderRadius: 0
|
||
},
|
||
data: data,
|
||
label: {
|
||
color: '#fff',
|
||
// formatter: '{b}\n{c}',
|
||
formatter: function (data) {
|
||
if (data.dataIndex == 0) {
|
||
return '{name1|' + data.data.name + '}\n{time|' + data.data.value + '}';
|
||
} else if (data.dataIndex == 1) {
|
||
return '{name2|' + data.data.name + '}\n{time|' + data.data.value + '}';
|
||
} else if (data.dataIndex == 2) {
|
||
return '{name3|' + data.data.name + '}\n{time|' + data.data.value + '}';
|
||
} else if (data.dataIndex == 3) {
|
||
return '{name4|' + data.data.name + '}\n{time|' + data.data.value + '}';
|
||
}
|
||
},
|
||
rich: {
|
||
name1: {
|
||
color: '#595AFF',
|
||
fontSize: 10
|
||
},
|
||
name2: {
|
||
color: '#E9E931',
|
||
fontSize: 10
|
||
},
|
||
name3: {
|
||
color: '#FFA602',
|
||
fontSize: 10
|
||
},
|
||
name4: {
|
||
color: '#FF7474',
|
||
fontSize: 10
|
||
},
|
||
time: {
|
||
color: '#ffffff',
|
||
fontSize: 12
|
||
}
|
||
},
|
||
},
|
||
labelLine: {
|
||
length: 10,
|
||
length2: 0,
|
||
maxSurfaceAngle: 50
|
||
},
|
||
}
|
||
]
|
||
};
|
||
option && myChartSg.setOption(option);
|
||
|
||
window.addEventListener("resize", function () {
|
||
myChartSg.resize();
|
||
});
|
||
}
|
||
var videoids = [];
|
||
var videoIndex = 0;
|
||
var authToken = '';
|
||
|
||
var videoHost = '<%= VideoHost %>';
|
||
function runShowVideo() {
|
||
if (videoids.length <= 0) {
|
||
setTimeout(function () {
|
||
runShowVideo();
|
||
}, 5000);
|
||
} else if (videoIndex < videoids.length) {
|
||
$.get(videoHost + 'api/v1/stream/start?serial=' + videoids[videoIndex].split(':')[0] + '&code=' + videoids[videoIndex].split(':')[1] + '&token=' + authToken, function (data4) {
|
||
console.log(data4.HLS)
|
||
videoIndex++;
|
||
var player = document.getElementById('player01');
|
||
player.setAttribute("video-url", data4.HLS);
|
||
setTimeout(function () {
|
||
runShowVideo();
|
||
}, 500000);
|
||
}, 'json');
|
||
}
|
||
}
|
||
|
||
function initVideo() {
|
||
$.get(videoHost + 'api/v1/login?username=<%= VideoUserName %>&password=<%= VideoPassWord %>', function (data1) {
|
||
authToken = data1.AuthToken;
|
||
$.get(videoHost + 'api/v1/device/channeltree?token=' + authToken, function (data2) {
|
||
for (var i = 0; i < data2.length && i <= 0; i++) {
|
||
$.get(videoHost + 'api/v1/device/channeltree?serial=' + data2[i].serial + '&token=' + authToken, function (data3) {
|
||
for (var j = 0; j < data3.length && j <= 0; j++) {
|
||
videoids.push(data3[j].id);
|
||
}
|
||
|
||
|
||
}, 'json');
|
||
}
|
||
}, 'json');
|
||
}, 'json');
|
||
|
||
}
|
||
initVideo();
|
||
runShowVideo();
|
||
initTab();
|
||
initClick();
|
||
</script>
|