1251 lines
56 KiB
Plaintext
1251 lines
56 KiB
Plaintext
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="main_copy_index_1.aspx.cs" Inherits="FineUIPro.Web.common.main_copy_index_1" %>
|
||
|
||
<!DOCTYPE html>
|
||
<html>
|
||
<head id="Head1" runat="server">
|
||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||
<title>首页</title>
|
||
<link href="../res/index/css/reset.css" rel="stylesheet" />
|
||
<link href="../res/index/css/home.css" rel="stylesheet" />
|
||
<link href="../res/index/css/swiper-3.4.2.min.css" rel="stylesheet" />
|
||
<style type="text/css">
|
||
* {
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.flexV {
|
||
flex-direction: column;
|
||
}
|
||
|
||
.wrap {
|
||
height: 100%;
|
||
padding: 15px;
|
||
}
|
||
|
||
.bottom-wrap {
|
||
padding: 0;
|
||
margin-bottom: 5px;
|
||
}
|
||
|
||
.bottom-wrap:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
.bw-item-content {
|
||
padding: 5px;
|
||
}
|
||
|
||
.top {
|
||
display: flex;
|
||
display: -webkit-flex;
|
||
overflow: hidden;
|
||
width: 100%;
|
||
}
|
||
|
||
.bw-b-bottom {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
.itemlr {
|
||
margin: 0 5px;
|
||
}
|
||
|
||
.bw-b-bottom-up {
|
||
border-radius: 0;
|
||
height: 100%;
|
||
margin: 0;
|
||
box-shadow: none;
|
||
}
|
||
|
||
.yj-info {
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 100%;
|
||
height: 100%;
|
||
color: red;
|
||
font-size: 20px;
|
||
}
|
||
|
||
.yj-info .tit {
|
||
font-weight: 700;
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.yj-info .tel {
|
||
font-weight: 700;
|
||
}
|
||
|
||
.tab-wrap {
|
||
left: auto;
|
||
right: 15px;
|
||
top: 5px;
|
||
}
|
||
|
||
.tab .t-item {
|
||
width: auto;
|
||
padding: 5px 10px;
|
||
}
|
||
|
||
.bottom-list {
|
||
height: 100px;
|
||
padding: 15px;
|
||
overflow: hidden;
|
||
color: #fff;
|
||
margin: 0 10px;
|
||
}
|
||
|
||
.bottom-list .bl-left {
|
||
float: left;
|
||
margin-right: 30px;
|
||
margin-left: 50px;
|
||
}
|
||
|
||
.bottom-list .bl-right {
|
||
float: right;
|
||
margin-right: 50px;
|
||
}
|
||
|
||
.tab .t-item {
|
||
font-size: 12px;
|
||
}
|
||
|
||
.content-body {
|
||
display: flex;
|
||
flex-direction: column;
|
||
flex: 3;
|
||
}
|
||
|
||
.content-body .content-item {
|
||
}
|
||
|
||
.part-item {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
|
||
.part-tag {
|
||
display: flex;
|
||
flex-direction: column;
|
||
background-color: #107ca2;
|
||
opacity: 0.8;
|
||
flex: 1;
|
||
border-radius: 10px;
|
||
}
|
||
|
||
.part-tag + .part-tag {
|
||
margin-left: 20px;
|
||
}
|
||
|
||
.item-top {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
font-size: 20px;
|
||
color: #fff;
|
||
border-bottom: 1px solid #f2f2f2;
|
||
padding: 10px 0px;
|
||
}
|
||
|
||
.unit {
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
text-align: right;
|
||
font-size: 16px;
|
||
padding-right: 30px;
|
||
}
|
||
|
||
.num {
|
||
display: flex;
|
||
justify-content: center;
|
||
flex: 1;
|
||
}
|
||
|
||
.unit-btn {
|
||
display: flex;
|
||
justify-content: center;
|
||
padding: 10px 0px;
|
||
font-size: 16px;
|
||
color: #fff;
|
||
}
|
||
|
||
.do-btn {
|
||
display: flex;
|
||
justify-content: center;
|
||
background-color: #107ca2;
|
||
opacity: 0.8;
|
||
flex: 1;
|
||
border-radius: 10px;
|
||
padding: 20px 0px;
|
||
color: #fff;
|
||
}
|
||
.base-wrap{
|
||
padding:15px 10px;
|
||
height:100%;
|
||
}
|
||
.base-wrap .base-tit{
|
||
font-size:12px;
|
||
color:#fff;
|
||
}
|
||
.base-wrap .base-txt-wrap{
|
||
margin-top:5px;
|
||
background-color:#0B508B;
|
||
border-radius:5px;
|
||
color:#FFAE72;
|
||
height:100%;
|
||
align-items:center;
|
||
justify-content:space-around;
|
||
}
|
||
.base-wrap .base-txt-wrap .num-1{
|
||
background-color:#2A759C;
|
||
padding:5px;
|
||
font-size:40px;
|
||
}
|
||
.yj-info-1{
|
||
height:100%;
|
||
}
|
||
.yj-info-1-list{
|
||
color:#fff;
|
||
}
|
||
.yj-info-1 .telbg{
|
||
height:100%;
|
||
width:85px;
|
||
background: url(../res/index/images/tel.png) center center no-repeat;
|
||
background-size: contain;
|
||
}
|
||
.yj-info-1-list-item{
|
||
padding:0 5px;
|
||
background-color:#2A759C;
|
||
margin-bottom:5px;
|
||
font-size:12px;
|
||
align-items:center;
|
||
justify-content:center;
|
||
}
|
||
.yj-info-1-list-item:last-child{
|
||
margin-bottom:0;
|
||
}
|
||
.yj-info-1-list-item .telnum{
|
||
text-align:center;
|
||
align-items:center;
|
||
justify-content:center;
|
||
display:flex;
|
||
}
|
||
.yj-info-1-info{
|
||
color:#fff;
|
||
background-color:#2A759C;
|
||
text-align:center;
|
||
font-size:16px;
|
||
height:40px;
|
||
line-height:40px;
|
||
margin-top:5px;
|
||
}
|
||
.info-wrap{
|
||
width:100%;
|
||
height:100%;
|
||
padding:5px 10px;
|
||
}
|
||
.info-wrap .info-item{
|
||
align-items:center;
|
||
justify-content: center;
|
||
margin:0 20px;
|
||
}
|
||
.info-wrap .info-item .title {
|
||
margin-bottom:5px;
|
||
font-size:14px;
|
||
}
|
||
.info-wrap .info-item .item {
|
||
width:100%;
|
||
height: 40%;
|
||
background-color:#267AA4;
|
||
border-radius:15px;
|
||
align-items:center;
|
||
justify-content:space-around;
|
||
}
|
||
.info-wrap .info-item .item .i-num{
|
||
color:#F48A5C;
|
||
font-size:28px;
|
||
}
|
||
.info-wrap .info-item .item .i-num-c{
|
||
color:#C1DF8E;
|
||
}
|
||
.tab .t-item {
|
||
width: auto;
|
||
padding: 5px 10px;
|
||
}
|
||
|
||
.tit-item {
|
||
padding: 0 10px;
|
||
color: #fff;
|
||
justify-content: space-between;
|
||
font-size: 12px;
|
||
}
|
||
|
||
.tip-item {
|
||
margin-left: 10px;
|
||
align-items: center;
|
||
font-size: 10px;
|
||
}
|
||
|
||
.tip {
|
||
width: 25px;
|
||
height: 13px;
|
||
background-color: #258F76;
|
||
border-radius: 2px;
|
||
margin-right: 5px;
|
||
}
|
||
|
||
.tip-next {
|
||
background-color: #92BF55;
|
||
}
|
||
.mglone{
|
||
margin-left: 2px;
|
||
}
|
||
.mgrone{
|
||
margin-right: 2px;
|
||
}
|
||
.mgbone{
|
||
margin-bottom: 2px;
|
||
}
|
||
.pdtb0{
|
||
padding-top:0 !important;
|
||
padding-bottom:0 !important;
|
||
}
|
||
.tit-center{
|
||
text-align:center;
|
||
font-size:12px;
|
||
}
|
||
.tit-one{
|
||
padding: 10px 0;
|
||
}
|
||
.content-ul .c-item .tit {
|
||
display:block;
|
||
position:relative;
|
||
padding-left: 2em;
|
||
}
|
||
|
||
|
||
.content-ul .c-item .tit::before {
|
||
content: '';
|
||
position: absolute;
|
||
border-color: #57B8BD;
|
||
border-style: solid;
|
||
border-width: 0.25em;
|
||
height: 0;
|
||
top: 0;
|
||
left: 0.6em;
|
||
margin-top: 0.5em;
|
||
width: 0;
|
||
border-radius:50%;
|
||
}
|
||
|
||
.content-ul .c-item .tit-read::before {
|
||
content: '';
|
||
position: absolute;
|
||
border-color: #ffffff;
|
||
border-style: solid;
|
||
border-width: 0.25em;
|
||
height: 0;
|
||
top: 0;
|
||
left: 0.6em;
|
||
margin-top: 0.25em;
|
||
width: 0;
|
||
border-radius:50%
|
||
}
|
||
.content-ul .c-item .tit .tit-t{
|
||
flex:1;
|
||
min-width: 0;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
text-overflow: ellipsis;
|
||
word-break: keep-all;
|
||
}
|
||
|
||
.content-ul .c-item.disabled .tit::before{
|
||
display:none !important;
|
||
}
|
||
|
||
.content-ul .c-item .tit .tit-v{
|
||
margin-left: 12px;
|
||
width: 80px;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="wrap flex flexV">
|
||
<div class="bottom-wrap flex1">
|
||
<div class="top">
|
||
<div class="item flex1 flex flexV">
|
||
<div class="bw-b-bottom mgbone">
|
||
<div class="bw-b-bottom-up">
|
||
<div class="info-wrap flex">
|
||
<div class="info-item flex flexV flex1">
|
||
<div class="title">一次合格率</div>
|
||
<div class="item flex flexV">
|
||
<div class="specialNum i-num">87</div>
|
||
<div style="font-size:10px">单位：%</div>
|
||
</div>
|
||
</div>
|
||
<div class="info-item flex flexV flex1">
|
||
<div class="title">焊工总人数</div>
|
||
<div class="item flex flexV">
|
||
<div class="specialNum i-num i-num-c">176</div>
|
||
<div style="font-size:10px">单位：人</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="item flex1 mglone mgrone">
|
||
<div class="top flex" style="width: 100%; height: 100%;">
|
||
<div class="item flex1 flex flexV">
|
||
<div class="bw-b-bottom mgbone">
|
||
<div class="bw-b-bottom-up">
|
||
<div class="bw-item-content flex" style="width: 100%; height: 100%;">
|
||
<div id='one1' class="flex1" style="width: 100%; height: 100%;"></div>
|
||
<div id='one2' class="flex1" style="width: 100%; height: 100%;"></div>
|
||
<div id='one3' class="flex1" style="width: 100%; height: 100%;"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="item flex3">
|
||
<div class="bw-b-bottom">
|
||
<div class="bw-b-bottom-up">
|
||
<div class="bw-item-content">
|
||
<div id='two' style="width: 100%; height: 100%;"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
<div class="bottom-wrap flex1">
|
||
<div class="top flex">
|
||
<div class="bw-b-bottom flex1 mgrone">
|
||
<div class="bw-b-bottom-up">
|
||
<div class="tab-wrap">
|
||
<div class="tab" data-value="4">
|
||
<div class="t-item active">施工分包商</div>
|
||
<div class="spline"></div>
|
||
<div class="t-item">问题类别</div>
|
||
</div>
|
||
</div>
|
||
<div class="bw-item-content">
|
||
<div id='four' style="width: 100%; height: 100%;"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="bw-b-bottom flex1">
|
||
<div class="bw-b-bottom-up">
|
||
<div class="tab-wrap">
|
||
<div class="tab" data-value="2">
|
||
<div class="t-item ">施工分包商</div>
|
||
<div class="spline"></div>
|
||
<div class="t-item active">安装单位工程</div>
|
||
<div class="spline"></div>
|
||
<div class="t-item">建筑单位工程</div>
|
||
<div class="spline"></div>
|
||
<div class="t-item">专业</div>
|
||
</div>
|
||
</div>
|
||
<div class="bw-item-content">
|
||
<div id='two2' style="width: 100%; height: 100%;"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="bottom-wrap flex1">
|
||
<div class="top">
|
||
<div class="item flex1 mgrone" id="divJD_wrap">
|
||
<div class="bw-b-bottom">
|
||
<div class="bw-b-bottom-up">
|
||
<div class="tab-wrap">
|
||
<div class="tab" data-value="2">
|
||
<div class="t-item active">单位</div>
|
||
<div class="spline"></div>
|
||
<div class="t-item ">岗位</div>
|
||
</div>
|
||
</div>
|
||
<div class="bw-item-content">
|
||
<div id='three' style="width: 100%; height: 100%;"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="item flex1 flex">
|
||
<div class="bg-item flex1 mgrone" style="margin-bottom:0;">
|
||
<div class="bw-item-content flex flexV" style="padding:0;">
|
||
<div class="tit-new">代办</div>
|
||
<div class="" style="padding: 0 10px 0; overflow: hidden;">
|
||
<div class="swiper-container " id='swiper1' runat="server">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="bg-item flex1" style="margin-bottom:0;">
|
||
<div class="bw-item-content flex flexV" style="padding:0;">
|
||
<div class="tit-new">预警</div>
|
||
<div class="" style="padding: 0 10px 0; overflow: hidden;">
|
||
<div class="swiper-container " id='swiper2' runat="server">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</body>
|
||
<script type="text/javascript" src="../res/index/js/jquery-3.4.1.min.js"></script>
|
||
<script type="text/javascript" src="../res/index/js/swiper-3.4.2.jquery.min.js"></script>
|
||
<script type="text/javascript" src="../res/index/js/echarts.min.js"></script>
|
||
<script type="text/javascript">
|
||
var basePath = '<%= ResolveUrl("~/") %>';
|
||
|
||
function category_Two(id, xArr, data) {
|
||
// 基于准备好的dom，初始化echarts实例
|
||
var myChart = echarts.init(document.getElementById(id))
|
||
// 指定图表的配置项和数据
|
||
var option = {
|
||
title: {
|
||
left: 'center',
|
||
text: '项目安全人工时',
|
||
textStyle: {
|
||
color: '#fff',
|
||
fontSize: 12,
|
||
fontWeight: '300'
|
||
},
|
||
show: true
|
||
},
|
||
tooltip: {},
|
||
legend: {
|
||
show: false
|
||
},
|
||
xAxis: {
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
axisLine: {
|
||
lineStyle: {
|
||
color: 'rgba(255, 255, 255, 0.3)'
|
||
}
|
||
},
|
||
axisLabel: {
|
||
show: true,
|
||
interval: 0,
|
||
textStyle: {
|
||
color: 'rgba(255, 255, 255, 0.8)'
|
||
}
|
||
},
|
||
type: 'category',
|
||
data: xArr
|
||
},
|
||
yAxis: {
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
axisLine: {
|
||
show: false,
|
||
lineStyle: {
|
||
color: 'rgba(255, 255, 255, 0.3)'
|
||
}
|
||
},
|
||
axisLabel: {
|
||
show: true,
|
||
textStyle: {
|
||
color: 'rgba(255, 255, 255, 0.8)'
|
||
}
|
||
}
|
||
},
|
||
series: data,
|
||
grid: {
|
||
top: '15%',
|
||
left: '10',
|
||
right: '10',
|
||
bottom: '0%',
|
||
containLabel: true,
|
||
backgroundColor: 'rgba(0,162,233, 0.01)',
|
||
// borderColor: 'rgba(0,162,233, 1)'
|
||
},
|
||
itemStyle: {
|
||
color: 'rgba(9,199,113, 1)'
|
||
},
|
||
backgroundColor: 'rgba(0,162,233, 0.01)',
|
||
textStyle: {
|
||
color: 'rgba(255, 255, 255, 0.3)'
|
||
}
|
||
}
|
||
// 使用刚指定的配置项和数据显示图表。
|
||
myChart.setOption(option)
|
||
}
|
||
|
||
var two = { "title": "项目安全人工时", "xFontNum": 0, "legend": null, "categories": ["2020-11", "2020-12", "2021-01", "2021-02", "2021-03", "2021-04"], "series": [{ "name": null, "type": null, "data": [64.0, 64.0, 14297.0, 14830.0, 19742.0, 22734.0], "data2": null, "data3": null, "data4": null, "dataString": null, "dataObject": null, "jd": null, "sg": null, "time": null, "ht": null, "convert": null, "pieData": null, "loc": null }, { "name": null, "type": null, "data": [64.0, 0.0, 14233.0, 533.0, 4912.0, 2992.0], "data2": null, "data3": null, "data4": null, "dataString": null, "dataObject": null, "jd": null, "sg": null, "time": null, "ht": null, "convert": null, "pieData": null, "loc": null }], "series2": null };
|
||
var xArr = two.categories
|
||
var data = [{
|
||
name: '累计人工时',
|
||
type: 'line',
|
||
data: two.series[0].data,
|
||
itemStyle: { normal: { color: '#00c771' } }
|
||
}, {
|
||
name: '当月人工时',
|
||
type: 'bar',
|
||
barWidth: 40,
|
||
data: two.series[1].data
|
||
}]
|
||
category_Two('two', xArr, data)
|
||
</script>
|
||
<script type="text/javascript">
|
||
function category_two3(id, xArr, data) {
|
||
// 基于准备好的dom，初始化echarts实例
|
||
var myChart = echarts.init(document.getElementById(id))
|
||
// 指定图表的配置项和数据
|
||
var option = {
|
||
title: [{
|
||
text: '项目焊接工程量统计',
|
||
top: '10',
|
||
//left:'center',
|
||
textStyle: {
|
||
color: '#278AC8',
|
||
fontSize: 12,
|
||
//fontWeight:300
|
||
}
|
||
}],
|
||
legend: {
|
||
show: true,
|
||
bottom: 0,
|
||
align: 'left',
|
||
textStyle: {//图例文字的样式
|
||
color: '#fff'
|
||
}
|
||
},
|
||
color: ['#1E9B7D', '#8EC43D'],
|
||
series: [
|
||
{
|
||
name: '项目焊接工程量统计',
|
||
type: 'pie',
|
||
center: ['50%', '55%'],
|
||
radius: ['50%', '65%'],
|
||
avoidLabelOverlap: false,
|
||
label: {
|
||
show: true,
|
||
position: 'inside',
|
||
formatter: function (data) { return data.percent.toFixed(2) + "%"; }
|
||
},
|
||
labelLine: {
|
||
show: false
|
||
},
|
||
data: [
|
||
{ value: 35, name: '已完成' },
|
||
{ value: 10, name: '未完成' }
|
||
],
|
||
itemStyle: {
|
||
normal: {
|
||
//opacity: 0.7,
|
||
borderWidth: 3,
|
||
borderColor: 'rgba(218,235,234, 1)'
|
||
}
|
||
}
|
||
}
|
||
]
|
||
}
|
||
|
||
// 使用刚指定的配置项和数据显示图表。
|
||
myChart.setOption(option)
|
||
}
|
||
var xArr = ["分包一", "分包二"]
|
||
var data = [
|
||
{
|
||
name: '质量一次性合格率',
|
||
type: 'bar',
|
||
barWidth: 40,
|
||
data: [0.85, 0.82],
|
||
//itemStyle: { normal: { color: 'rgba(231,236,114,.9)' } }
|
||
},
|
||
{
|
||
name: '施工资料同步率',
|
||
type: 'bar',
|
||
barWidth: 40,
|
||
data: [0.69, 0.65],
|
||
//itemStyle: { normal: { color: 'rgba(200,201,10, 1)' } }
|
||
}
|
||
]
|
||
//category_two3('two3', xArr, data)
|
||
</script>
|
||
<script type="text/javascript">
|
||
function category_One(id, title, dataNum, text) {
|
||
// 基于准备好的dom，初始化echarts实例
|
||
var myChart = echarts.init(document.getElementById(id))
|
||
// 指定图表的配置项和数据
|
||
var option = {
|
||
//tooltip: {
|
||
// formatter: '{a} <br/>{b} : {c}%'
|
||
//},
|
||
title: {
|
||
left: 'center',
|
||
top: '25%',
|
||
text: title,
|
||
textStyle: {
|
||
color: '#fff',
|
||
fontSize: 12,
|
||
},
|
||
show: true
|
||
},
|
||
graphic: {
|
||
type: "text",
|
||
left: "center",
|
||
bottom: "25%",
|
||
style: {
|
||
text: text,
|
||
textAlign: "center",
|
||
fill: "#fff",
|
||
fontSize: 10,
|
||
fontWeight: 100
|
||
}
|
||
},
|
||
series: [
|
||
{
|
||
name: ' ',
|
||
center: ["50%", "60%"],
|
||
type: 'gauge',
|
||
radius: "90%",
|
||
axisLabel: { //文字样式（及“10”、“20”等文字样式）
|
||
fontSize: 8,
|
||
distance: 2 //文字离表盘的距离
|
||
},
|
||
pointer: {
|
||
show: true,
|
||
length: '70%',
|
||
width: 3
|
||
},
|
||
axisTick: { //刻度线样式（及短线样式）
|
||
length: 0
|
||
},
|
||
splitLine: {
|
||
length: 10,
|
||
lineStyle: {
|
||
color: 'rgba(255,255,255,.1)'
|
||
}
|
||
},
|
||
axisLine: {
|
||
lineStyle: {
|
||
color: [ //表盘颜色
|
||
[0.5, "#91C7AE"],//0-50%处的颜色
|
||
[0.7, "#63869E"],//51%-70%处的颜色
|
||
[1, "#88C8E2"],//70%-100%处的颜色
|
||
],
|
||
width: 8//表盘宽度
|
||
}
|
||
},
|
||
min: 0,
|
||
max: 100,
|
||
detail: {
|
||
show: false,
|
||
formatter: '{value}%'
|
||
},
|
||
data: [{
|
||
value: dataNum,
|
||
name: ''
|
||
}]
|
||
}
|
||
]
|
||
};
|
||
// 使用刚指定的配置项和数据显示图表。
|
||
myChart.setOption(option, true)
|
||
}
|
||
var one1 = 0.0
|
||
var one2 = 0.0
|
||
var one3 = 0.0
|
||
category_One('one1', "质量问题整改率", one1, one1 + "%")
|
||
category_One('one2', "焊接完成率\n按进度", one2, one2 + "%")
|
||
category_One('one3', "焊接完成率\n按质量", one3, one3 + "%")
|
||
</script>
|
||
|
||
<script type="text/javascript">
|
||
function category_Four(id, xArr, series, title) {
|
||
// 基于准备好的dom，初始化echarts实例
|
||
var myChart = echarts.init(document.getElementById(id))
|
||
// 指定图表的配置项和数据
|
||
var option = {
|
||
title: {
|
||
// left:'center',
|
||
text: title,
|
||
textStyle: {
|
||
color: '#fff',
|
||
fontSize: 12,
|
||
fontWeight: '300',
|
||
},
|
||
show: true
|
||
},
|
||
tooltip: {},
|
||
color: ['#88cc00', '#AE4B23'],
|
||
legend: {
|
||
left: '15%',
|
||
show: true,
|
||
textStyle: {//图例文字的样式
|
||
color: '#ffffff',
|
||
fontSize: 10,
|
||
}
|
||
},
|
||
xAxis: {
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
axisLine: {
|
||
lineStyle: {
|
||
color: 'rgba(255, 255, 255, 0.3)'
|
||
}
|
||
},
|
||
axisLabel: {
|
||
show: true,
|
||
interval: 0,
|
||
textStyle: {
|
||
color: 'rgba(255, 255, 255, 0.8)'
|
||
}
|
||
},
|
||
type: 'category',
|
||
data: xArr
|
||
},
|
||
yAxis: {
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
axisLine: {
|
||
show: false,
|
||
lineStyle: {
|
||
color: 'rgba(255, 255, 255, 0.3)'
|
||
}
|
||
},
|
||
axisLabel: {
|
||
show: true,
|
||
textStyle: {
|
||
color: 'rgba(255, 255, 255, 0.8)'
|
||
}
|
||
}
|
||
},
|
||
series: series,
|
||
grid: {
|
||
top: '25%',
|
||
left: '0%',
|
||
right: '0%',
|
||
bottom: '0%',
|
||
containLabel: true,
|
||
backgroundColor: 'rgba(0,162,233, 0.01)',
|
||
// borderColor: 'rgba(0,162,233, 1)'
|
||
},
|
||
//itemStyle: {
|
||
// color: 'rgba(200,201,10, 1)'
|
||
//},
|
||
backgroundColor: 'rgba(0,162,233, 0.01)',
|
||
textStyle: {
|
||
color: 'rgba(255, 255, 255, 0.3)'
|
||
}
|
||
}
|
||
|
||
// 使用刚指定的配置项和数据显示图表。
|
||
myChart.setOption(option)
|
||
}
|
||
var four1 = { "title": "安全检查问题统计", "xFontNum": 0, "legend": null, "categories": ["十六化建", "十三化建"], "series": [{ "name": null, "type": null, "data": [0.0, 0.0], "data2": null, "data3": null, "data4": null, "dataString": null, "dataObject": null, "jd": null, "sg": null, "time": null, "ht": null, "convert": null, "pieData": null, "loc": null }, { "name": null, "type": null, "data": [1.0, 4.0], "data2": null, "data3": null, "data4": null, "dataString": null, "dataObject": null, "jd": null, "sg": null, "time": null, "ht": null, "convert": null, "pieData": null, "loc": null }], "series2": null };
|
||
var xArr = four1.categories
|
||
var series = [{
|
||
name: '待整改',
|
||
type: 'bar',
|
||
barWidth: 20,
|
||
barGap: 0.05,
|
||
data: four1.series[0].data,
|
||
itemStyle: { normal: { color: '#88cc00' } }
|
||
}, {
|
||
name: '全部',
|
||
type: 'bar',
|
||
barWidth: 20,
|
||
data: four1.series[1].data,
|
||
itemStyle: { normal: { color: '#AE4B23' } }
|
||
}];
|
||
category_Four('four', xArr, series, "安全检查问题统计")
|
||
// 现场人员
|
||
var three1 = { "title": "现场人员", "xFontNum": 4, "legend": null, "categories": ["十六化建", "十三化建"], "series": [{ "name": null, "type": null, "data": [0.0, 0.0], "data2": null, "data3": null, "data4": null, "dataString": null, "dataObject": null, "jd": null, "sg": null, "time": null, "ht": null, "convert": null, "pieData": null, "loc": null }, { "name": null, "type": null, "data": [1.0, 4.0], "data2": null, "data3": null, "data4": null, "dataString": null, "dataObject": null, "jd": null, "sg": null, "time": null, "ht": null, "convert": null, "pieData": null, "loc": null }], "series2": null };
|
||
var xArr = four1.categories
|
||
var series = [{
|
||
name: '签到',
|
||
type: 'bar',
|
||
barWidth: 20,
|
||
barGap: 0.05,
|
||
data: three1.series[0].data,
|
||
itemStyle: { normal: { color: '#6FCE7C' } }
|
||
}, {
|
||
name: '系统',
|
||
type: 'bar',
|
||
barWidth: 20,
|
||
data: three1.series[1].data,
|
||
itemStyle: { normal: { color: '#BF467C' } }
|
||
}];
|
||
category_Four('three', xArr, series, "现场人员")
|
||
</script>
|
||
|
||
<script type="text/javascript">
|
||
function pie(id, data, title, text, needLegend) {
|
||
var myChartPie = echarts.init(document.getElementById(id));
|
||
var needLegend = needLegend || false
|
||
var optionPie = {
|
||
tooltip: {
|
||
trigger: 'item',
|
||
show: true
|
||
},
|
||
legend: {
|
||
show: needLegend,
|
||
selectedMode: false,
|
||
left: 'right',
|
||
orient: 'horizontal',
|
||
textStyle: {//图例文字的样式
|
||
color: '#ffffff'
|
||
}
|
||
},
|
||
title: {
|
||
left: 'center',
|
||
bottom: '0',
|
||
text: title,
|
||
textStyle: {
|
||
color: '#fff',
|
||
fontSize: 10,
|
||
fontWeight: '300'
|
||
},
|
||
show: true
|
||
},
|
||
graphic: {
|
||
type: "text",
|
||
left: "center",
|
||
top: "center",
|
||
style: {
|
||
text: text,
|
||
textAlign: "center",
|
||
fill: "#fff",
|
||
fontSize: 16,
|
||
fontWeight: 700
|
||
}
|
||
},
|
||
color: ['#258F76', '#92BF55'],
|
||
series: [
|
||
{
|
||
name: ' ',
|
||
hoverOffset: 0,
|
||
type: 'pie',
|
||
clickable: false,
|
||
radius: ['50%', '65%'],
|
||
avoidLabelOverlap: false,
|
||
label: {
|
||
show: false
|
||
},
|
||
itemStyle: {
|
||
normal: {
|
||
//opacity: 0.7,
|
||
borderWidth: 3,
|
||
borderColor: 'rgba(218,235,234, 1)'
|
||
}
|
||
},
|
||
emphasis: {
|
||
label: {
|
||
show: true,
|
||
fontSize: '10',
|
||
fontWeight: 'bold'
|
||
}
|
||
},
|
||
labelLine: {
|
||
show: false
|
||
},
|
||
data: data
|
||
}
|
||
]
|
||
};
|
||
//为echarts对象加载数据
|
||
myChartPie.setOption(optionPie);
|
||
}
|
||
var one4 = { "title": null, "num1": 0, "num2": 0, "num3": 0, "num4": 0, "num5": 0, "num6": 0, "num7": 0, "num8": 0, "num9": 0 };
|
||
var data4 = [{ value: one4.num2, name: '已完成' },
|
||
{ value: one4.num1, name: '未完成' }];
|
||
var data5 = [{ value: one4.num5, name: '已完成' },
|
||
{ value: one4.num4, name: '未完成' }];
|
||
var data6 = [{ value: one4.num8, name: '已完成' },
|
||
{ value: one4.num7, name: '未完成' }];
|
||
//pie('one4', data4, "A类", one4.num3)
|
||
//pie('one5', data5, "B类", one4.num6)
|
||
//pie('one6', data6, "C类", one4.num9)
|
||
</script>
|
||
<script type="text/javascript">
|
||
function category_Two2(id, xArr, data, num) {
|
||
// 基于准备好的dom，初始化echarts实例
|
||
var myChart = echarts.init(document.getElementById(id))
|
||
// 指定图表的配置项和数据
|
||
var option = {
|
||
title: {
|
||
// left:'center',
|
||
text: '质量问题统计',
|
||
textStyle: {
|
||
color: '#fff',
|
||
fontWeight: 'normal',
|
||
fontSize: 12
|
||
},
|
||
show: true
|
||
},
|
||
tooltip: {},
|
||
legend: {
|
||
left: '15%',
|
||
show: true,
|
||
textStyle: {//图例文字的样式
|
||
color: '#ffffff',
|
||
fontSize: 10,
|
||
}
|
||
},
|
||
xAxis: {
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
axisLine: {
|
||
lineStyle: {
|
||
color: 'rgba(255, 255, 255, 0.3)',
|
||
}
|
||
},
|
||
axisLabel: {
|
||
show: true,
|
||
textStyle: {
|
||
color: 'rgba(255, 255, 255, 0.8)'
|
||
},
|
||
interval: 0,
|
||
formatter: function (value) {
|
||
var ret = "";//拼接加\n返回的类目项
|
||
var maxLength = num > 0 ? num : 3;//每项显示文字个数
|
||
var valLength = value.length;//X轴类目项的文字个数
|
||
var rowN = Math.ceil(valLength / maxLength); //类目项需要换行的行数
|
||
if (rowN > 1)//如果类目项的文字大于maxLength,
|
||
{
|
||
for (var i = 0; i < rowN; i++) {
|
||
var temp = "";//每次截取的字符串
|
||
var start = i * maxLength;//开始截取的位置
|
||
var end = start + maxLength;//结束截取的位置
|
||
//这里也可以加一个是否是最后一行的判断，但是不加也没有影响，那就不加吧
|
||
//temp = value.substring(start, end) + "\n";
|
||
temp = value.substring(start, end) + (i == rowN - 1 ? "" : "\n");
|
||
ret += temp; //凭借最终的字符串
|
||
}
|
||
return ret;
|
||
}
|
||
else {
|
||
return value;
|
||
}
|
||
}
|
||
},
|
||
type: 'category',
|
||
data: xArr,
|
||
boundaryGap: [0, 0.01],
|
||
},
|
||
yAxis: {
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
axisLine: {
|
||
show: false,
|
||
lineStyle: {
|
||
color: 'rgba(255, 255, 255, 0.3)'
|
||
}
|
||
},
|
||
axisLabel: {
|
||
show: true,
|
||
textStyle: {
|
||
color: 'rgba(255, 255, 255, 0.8)'
|
||
}
|
||
}
|
||
},
|
||
series: data,
|
||
grid: {
|
||
top: '20%',
|
||
left: '0%',
|
||
right: '0%',
|
||
bottom: '0%',
|
||
containLabel: true,
|
||
backgroundColor: 'rgba(0,162,233, 0.01)',
|
||
// borderColor: 'rgba(0,162,233, 1)'
|
||
},
|
||
backgroundColor: 'rgba(0,162,233, 0.01)',
|
||
textStyle: {
|
||
color: 'rgba(255, 255, 255, 0.3)'
|
||
}
|
||
}
|
||
|
||
// 使用刚指定的配置项和数据显示图表。
|
||
myChart.setOption(option)
|
||
}
|
||
var two2 = { "title": "质量问题统计", "xFontNum": 4, "legend": null, "categories": ["分包1", "分包2", "分包3", "分包4", "分包5", "分包6"], "series": [{ "name": null, "type": null, "data": [64.0, 64.0, 14297.0, 14830.0, 19742.0, 22734.0], "data2": null, "data3": null, "data4": null, "dataString": null, "dataObject": null, "jd": null, "sg": null, "time": null, "ht": null, "convert": null, "pieData": null, "loc": null }, { "name": null, "type": null, "data": [64.0, 0.0, 14233.0, 533.0, 4912.0, 2992.0], "data2": null, "data3": null, "data4": null, "dataString": null, "dataObject": null, "jd": null, "sg": null, "time": null, "ht": null, "convert": null, "pieData": null, "loc": null }], "series2": null };
|
||
//var xArr = ["分包1", "分包2", "分包3", "分包4", "分包5", "分包6", "分包7", "分包8", "分包9"]
|
||
var xArr = two2.categories
|
||
var data = [
|
||
{
|
||
name: '未整改',
|
||
type: 'bar',
|
||
stack: '总量',
|
||
barWidth: 40,
|
||
//data: [3, 5, 8, 10, 6, 4, 5, 9, 12],
|
||
data: two2.series[0].data,
|
||
itemStyle: { normal: { color: 'rgba(162,63,21, 1)' } }
|
||
},
|
||
{
|
||
name: '已整改',
|
||
type: 'bar',
|
||
stack: '总量',
|
||
barWidth: 40,
|
||
//data: [2, 7, 5, 9, 12, 9, 2, 8, 10],
|
||
data: two2.series[1].data,
|
||
itemStyle: { normal: { color: 'rgba(206,143,135,1)' } }
|
||
}
|
||
]
|
||
category_Two2('two2', xArr, data, two2.xFontNum)
|
||
</script>
|
||
<script type="text/javascript">
|
||
$(".tab .t-item").click(function () {
|
||
var $this = $(this)
|
||
var index = $this.index()
|
||
if ($this.hasClass('active') && index == 0) {
|
||
return
|
||
}
|
||
var $tab = $this.closest(".tab")
|
||
var value = $tab.attr("data-value")
|
||
$tab.find(".t-item").removeClass('active');
|
||
$this.addClass('active')
|
||
|
||
var four1 = { "title": "安全检查问题统计", "xFontNum": 0, "legend": null, "categories": ["十六化建", "十三化建"], "series": [{ "name": null, "type": null, "data": [0.0, 0.0], "data2": null, "data3": null, "data4": null, "dataString": null, "dataObject": null, "jd": null, "sg": null, "time": null, "ht": null, "convert": null, "pieData": null, "loc": null }, { "name": null, "type": null, "data": [1.0, 4.0], "data2": null, "data3": null, "data4": null, "dataString": null, "dataObject": null, "jd": null, "sg": null, "time": null, "ht": null, "convert": null, "pieData": null, "loc": null }], "series2": null };
|
||
var four2 = { "title": "安全检查问题统计", "xFontNum": 0, "legend": null, "categories": ["PPE", "开挖作业", "临边洞口", "临时用电", "人员教育", "三气管理", "设备管理", "受限空间", "文明施工", "作业平台", "其他", "安全通道", "热处理作业", "吊装作业", "动火作业", "高处作业", "管理类", "基坑围护", "交叉作业", "脚手架"], "series": [{ "name": null, "type": null, "data": [0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0], "data2": null, "data3": null, "data4": null, "dataString": null, "dataObject": null, "jd": null, "sg": null, "time": null, "ht": null, "convert": null, "pieData": null, "loc": null }, { "name": null, "type": null, "data": [0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 2.0, 0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 1.0, 0.0, 0.0, 0.0, 0.0], "data2": null, "data3": null, "data4": null, "dataString": null, "dataObject": null, "jd": null, "sg": null, "time": null, "ht": null, "convert": null, "pieData": null, "loc": null }], "series2": null };
|
||
if (value == 4) {
|
||
var xArr = four1.categories
|
||
var data = [{
|
||
name: '待整改',
|
||
type: 'bar',
|
||
data: four1.series[0].data
|
||
}, {
|
||
name: '全部',
|
||
type: 'bar',
|
||
data: four1.series[1].data,
|
||
itemStyle: { normal: { color: 'rgba(174,75,37, 1)' } }
|
||
}];
|
||
if (index == 2) {
|
||
var xArr = four2.categories
|
||
var data = [{
|
||
name: '待整改',
|
||
data: four2.series[0].data
|
||
}, {
|
||
name: '全部',
|
||
data: four2.series[0].data,
|
||
itemStyle: { normal: { color: 'rgba(174,75,37, 1)' } }
|
||
}];
|
||
}
|
||
category_Four('four', xArr, data)
|
||
}
|
||
})
|
||
</script>
|
||
<script type="text/javascript">
|
||
var slidesNum = 5
|
||
var mySwiper = null
|
||
var mySwiper_JD = null
|
||
var slidesNum_JD = 15
|
||
var accident = { "title": "质量事故", "xFontNum": 0, "legend": null, "categories": ["潮州华瀛", "黄州危废", "山东滨州首站", "嘉盛工程", "湘渝盐化", "东华能源", "广汇启东", "重庆涪陵", "开阳PPA项目", "广西华谊", "金新锅炉", "兴力项目", "济民可信", "哈密广汇", "俄罗斯", "印尼罐区", "印度TALCHER", "天津渤化", "宜都兴发", "图克二期", "云华安"], "series": [{ "name": null, "type": null, "data": [0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0], "data2": [0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0], "data3": [0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0], "data4": [34.56, 37.80, 21.00, 0.00, 6.00, 29.45, 43.12, 29.00, 0.00, 2.84, 95.00, 95.00, 90.00, 23.00, 39.00, 15.00, 17.23, 50.00, 99.00, 86.00, 64.00], "dataString": null, "dataObject": null, "jd": null, "sg": null, "time": null, "ht": null, "convert": null, "pieData": null, "loc": null }], "series2": null }
|
||
$(document).ready(function () {
|
||
var height = $("#divJD_wrap").height() - 30
|
||
var width = $("#divJD_wrap").width() / 2
|
||
$("#swiper1").css("height", (height) + 'px').css("width", (width - 30) + 'px')
|
||
slidesNum = Math.floor((height) / 24)
|
||
$("#swiper1").html('<ul class="content-ul swiper-wrapper"><li data-id="../PZHGL/GJSX/GJSXListEdit.aspx?EditType=Edit&Id=1809800001" notice-id="1809800001" class="c-item swiper-slide"><div class="tit" title="珠光砂装填完成"><div class="flex" ><div class="tit-t flex1">珠光砂装填完成珠光砂装填完成珠光砂装填完成珠光砂装填完成</div><div class="tit-v">2021-04-15</div></div></div></li><li data-id="../PZHGL/GJSX/GJSXListEdit.aspx?EditType=Edit&Id=1809800003" notice-id="1809800003" class="c-item swiper-slide"><div class="tit" title="3#空分整改"><div class="flex" ><div class="tit-t flex1">3#空分整改</div><div class="tit-v">2021-04-15</div></div></div></li><li data-id="../PZHGL/GJSX/GJSXListEdit.aspx?EditType=Edit&Id=1809800004" notice-id="1809800004" class="c-item swiper-slide"><div class="tit" title="盲板阀卸货，尺寸复测。"><div class="flex" ><div class="tit-t flex1">盲板阀卸货，尺寸复测。</div><div class="tit-v">2021-04-15</div></div></div></li></ul>')
|
||
mySwiper = new Swiper('#swiper1', {
|
||
autoplay: 4000,//可选选项，自动滑动
|
||
direction: 'vertical',
|
||
loop: true,
|
||
slidesPerView: slidesNum
|
||
})
|
||
|
||
|
||
$("#swiper2").css("height", (height) + 'px').css("width", (width - 30) + 'px')
|
||
var str = '<ul class="content-ul swiper-wrapper">'
|
||
for (var i = 0; i < accident.categories.length; i++) {
|
||
str += '<li data-id="../PZHGL/GJSX/GJSXListEdit.aspx?EditType=Edit&Id=1809800004" notice-id="1809800004" class="c-item swiper-slide"><div class="tit" title="' + accident.categories[i] + '"><div class="flex" ><div class="tit-t flex1">' + accident.categories[i] + '</div><div class="tit-v">2021-04-15</div></div></div></li>'
|
||
}
|
||
str += '</ul>'
|
||
$("#swiper2").html(str)
|
||
if (accident.categories.length > slidesNum) {
|
||
mySwiper_JD = new Swiper('#swiper2', {
|
||
autoplay: 3000,//可选选项，自动滑动
|
||
direction: 'vertical',
|
||
loop: true,
|
||
slidesPerView: slidesNum
|
||
})
|
||
}
|
||
})
|
||
</script>
|
||
<script>
|
||
//var swiper_One = '<ul class="content-ul swiper-wrapper"><li data-id="../Notice/NoticeView2.aspx?NoticeId=2acbfdd5-dc97-432e-9e66-8281906fe507" notice-id="2acbfdd5-dc97-432e-9e66-8281906fe507" class="c-item swiper-slide"><div class="tit" title="请于2017年6月10日组织开展高处作业安全检查"><div class="flex" ><div class="tit-t flex1">请于2017年6月10日组织开展高处作业安全检查</div><div class="tit-v">2017-05-30</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=2ad4da01-085b-44fc-9fb2-b17ff4188157" class="c-item disabled swiper-slide"><div class="tit tit-read" title="关于现场焊工持证上岗的通知"><div class="flex" ><div class="tit-t flex1">关于现场焊工持证上岗的通知</div><div class="tit-v">2019-12-18</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=2fc6d514-adb9-4071-86da-48dc527f2b05" notice-id="2fc6d514-adb9-4071-86da-48dc527f2b05" class="c-item swiper-slide"><div class="tit" title="通知"><div class="flex" ><div class="tit-t flex1">通知</div><div class="tit-v">2017-03-21</div></div></div></li></ul>'
|
||
//var swiper_One = '<ul class="content-ul swiper-wrapper"><li data-id="../Notice/NoticeView2.aspx?NoticeId=0597eed1-07b2-4d4e-af0c-3946c96a08df" notice-id="0597eed1-07b2-4d4e-af0c-3946c96a08df" class="c-item swiper-slide"><div class="tit" title="Strengthening prevention measures of Sunstroke"><div class="flex" ><div class="tit-t flex1">Strengthening prevention measures of Sunstroke</div><div class="tit-v">2017-07-09</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=062bc818-5994-45da-9d49-19815bef02d4" notice-id="062bc818-5994-45da-9d49-19815bef02d4" class="c-item swiper-slide"><div class="tit" title="关于规范现场人员出入管理的通知"><div class="flex" ><div class="tit-t flex1">关于规范现场人员出入管理的通知</div><div class="tit-v">2017-02-06</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=07ab4cbd-e09d-404a-9c4e-01846a164ad6" notice-id="07ab4cbd-e09d-404a-9c4e-01846a164ad6" class="c-item swiper-slide"><div class="tit" title="关于开展国庆节前安全大检查的通知"><div class="flex" ><div class="tit-t flex1">关于开展国庆节前安全大检查的通知</div><div class="tit-v">2019-09-30</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=07bbe33f-4c65-4bab-b97d-3c0983f7c83e" notice-id="07bbe33f-4c65-4bab-b97d-3c0983f7c83e" class="c-item swiper-slide"><div class="tit" title="关于报送HSE相关资料的通知"><div class="flex" ><div class="tit-t flex1">关于报送HSE相关资料的通知</div><div class="tit-v">2018-04-08</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=0af9fdd1-847f-45cc-8831-03d2a0ccbed1" class="c-item disabled swiper-slide"><div class="tit tit-read" title="About Dining Room"><div class="flex" ><div class="tit-t flex1">About Dining Room</div><div class="tit-v">2017-08-13</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=0c7ca6d4-d1f1-484f-b561-9e6f1e7e1f48" class="c-item disabled swiper-slide"><div class="tit tit-read" title="请于2017年6月8日组织开展施工机具专项检查"><div class="flex" ><div class="tit-t flex1">请于2017年6月8日组织开展施工机具专项检查</div><div class="tit-v">2017-05-30</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=0e0d4655-be58-4ba7-8aa0-4b8ea2052e52" notice-id="0e0d4655-be58-4ba7-8aa0-4b8ea2052e52" class="c-item swiper-slide"><div class="tit" title="请于5月25日前开展HSE内业资料检查、消防安全检查"><div class="flex" ><div class="tit-t flex1">请于5月25日前开展HSE内业资料检查、消防安全检查</div><div class="tit-v">2017-05-23</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=14fe97ba-d619-44c6-9327-4db5eb4aa186" notice-id="14fe97ba-d619-44c6-9327-4db5eb4aa186" class="c-item swiper-slide"><div class="tit" title="关于加强项目现场射线探伤作业安全管理的通知"><div class="flex" ><div class="tit-t flex1">关于加强项目现场射线探伤作业安全管理的通知</div><div class="tit-v">2017-03-22</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=16e3f479-e5fa-4a14-aeb5-88af9ba1a66c" notice-id="16e3f479-e5fa-4a14-aeb5-88af9ba1a66c" class="c-item swiper-slide"><div class="tit" title="关于做好履带吊大臂受损后续工作安排的通知"><div class="flex" ><div class="tit-t flex1">关于做好履带吊大臂受损后续工作安排的通知</div><div class="tit-v">2019-11-10</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=19443b9e-5e92-4c00-9510-02d8c30b03ff" notice-id="19443b9e-5e92-4c00-9510-02d8c30b03ff" class="c-item swiper-slide"><div class="tit" title="关于加强新建LNG罐区大门管理的通知"><div class="flex" ><div class="tit-t flex1">关于加强新建LNG罐区大门管理的通知</div><div class="tit-v">2019-10-10</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=1b21886b-e7df-4cbc-ae3c-1cd1daee93a9" notice-id="1b21886b-e7df-4cbc-ae3c-1cd1daee93a9" class="c-item swiper-slide"><div class="tit" title="关于严格执行作业票证制度和作业前安全技术交底工作的通知"><div class="flex" ><div class="tit-t flex1">关于严格执行作业票证制度和作业前安全技术交底工作的通知</div><div class="tit-v">2018-03-12</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=1c3ff63e-df82-4b0c-ba54-d623f0473e14" notice-id="1c3ff63e-df82-4b0c-ba54-d623f0473e14" class="c-item swiper-slide"><div class="tit" title="Important HSE instructions"><div class="flex" ><div class="tit-t flex1">Important HSE instructions</div><div class="tit-v">2017-08-01</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=227d6922-f455-4382-8f86-7fc83c45d22b" notice-id="227d6922-f455-4382-8f86-7fc83c45d22b" class="c-item swiper-slide"><div class="tit" title="关于报送HSE相关资料的通知"><div class="flex" ><div class="tit-t flex1">关于报送HSE相关资料的通知</div><div class="tit-v">2019-07-23</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=23c364db-62af-4f05-b5e9-3ef60cf1aa9d" notice-id="23c364db-62af-4f05-b5e9-3ef60cf1aa9d" class="c-item swiper-slide"><div class="tit" title="Crane Rejection"><div class="flex" ><div class="tit-t flex1">Crane Rejection</div><div class="tit-v">2017-12-11</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=247fe11c-4f16-4c74-9098-ae287f860b71" notice-id="247fe11c-4f16-4c74-9098-ae287f860b71" class="c-item swiper-slide"><div class="tit" title="关于做好土建撤场工作安排的通知"><div class="flex" ><div class="tit-t flex1">关于做好土建撤场工作安排的通知</div><div class="tit-v">2019-11-06</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=279da471-c47e-47b4-a89d-a3f97692961e" notice-id="279da471-c47e-47b4-a89d-a3f97692961e" class="c-item swiper-slide"><div class="tit" title="请于2017年6月5日前开展动火作业安全专项检查"><div class="flex" ><div class="tit-t flex1">请于2017年6月5日前开展动火作业安全专项检查</div><div class="tit-v">2017-05-30</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=2a35f657-1206-479b-8510-8639cc024e0c" notice-id="2a35f657-1206-479b-8510-8639cc024e0c" class="c-item swiper-slide"><div class="tit" title="关于设定马苏项目重点消防区域及组建义务消防队的通知"><div class="flex" ><div class="tit-t flex1">关于设定马苏项目重点消防区域及组建义务消防队的通知</div><div class="tit-v">2017-05-30</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=2acbfdd5-dc97-432e-9e66-8281906fe507" notice-id="2acbfdd5-dc97-432e-9e66-8281906fe507" class="c-item swiper-slide"><div class="tit" title="请于2017年6月10日组织开展高处作业安全检查"><div class="flex" ><div class="tit-t flex1">请于2017年6月10日组织开展高处作业安全检查</div><div class="tit-v">2017-05-30</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=2ad4da01-085b-44fc-9fb2-b17ff4188157" class="c-item disabled swiper-slide"><div class="tit tit-read" title="关于现场焊工持证上岗的通知"><div class="flex" ><div class="tit-t flex1">关于现场焊工持证上岗的通知</div><div class="tit-v">2019-12-18</div></div></div></li><li data-id="../Notice/NoticeView2.aspx?NoticeId=2fc6d514-adb9-4071-86da-48dc527f2b05" notice-id="2fc6d514-adb9-4071-86da-48dc527f2b05" class="c-item swiper-slide"><div class="tit" title="通知"><div class="flex" ><div class="tit-t flex1">通知</div><div class="tit-v">2017-03-21</div></div></div></li></ul>'
|
||
var swiper_One = '<ul class="content-ul swiper-wrapper"><li data-id="../PZHGL/GJSX/GJSXListEdit.aspx?EditType=Edit&Id=1809800001" notice-id="1809800001" class="c-item swiper-slide"><div class="tit" title="珠光砂装填完成"><div class="flex" ><div class="tit-t flex1">珠光砂装填完成</div><div class="tit-v">2021-04-15</div></div></div></li><li data-id="../PZHGL/GJSX/GJSXListEdit.aspx?EditType=Edit&Id=1809800003" notice-id="1809800003" class="c-item swiper-slide"><div class="tit" title="3#空分整改"><div class="flex" ><div class="tit-t flex1">3#空分整改</div><div class="tit-v">2021-04-15</div></div></div></li><li data-id="../PZHGL/GJSX/GJSXListEdit.aspx?EditType=Edit&Id=1809800004" notice-id="1809800004" class="c-item swiper-slide"><div class="tit" title="盲板阀卸货，尺寸复测。"><div class="flex" ><div class="tit-t flex1">盲板阀卸货，尺寸复测。</div><div class="tit-v">2021-04-15</div></div></div></li></ul>'
|
||
var swiper_Two = '<ul class="content-ul swiper-wrapper"></ul>'
|
||
var todoNum = '0'
|
||
$(".tab .t-item").click(function () {
|
||
var $this = $(this)
|
||
var index = $this.index()
|
||
if ($this.hasClass('active') && index == 0) {
|
||
return
|
||
}
|
||
var $tab = $this.closest(".tab")
|
||
var value = $tab.attr("data-value")
|
||
$tab.find(".t-item").removeClass('active');
|
||
$this.addClass('active')
|
||
if (value == 0) {
|
||
var maptype = index == 0 ? 'world' : 'china'
|
||
mapEchart('map', maptype)
|
||
} else if (value == 1) {
|
||
if (index == 0) {
|
||
$("#swiper1").html(swiper_One)
|
||
mySwiper = new Swiper('#swiper1', {
|
||
autoplay: 4000,//可选选项，自动滑动
|
||
direction: 'vertical',
|
||
loop: true,
|
||
slidesPerView: slidesNum
|
||
})
|
||
} else if (index == 2) {
|
||
$("#swiper2").html(swiper_Two)
|
||
if (todoNum >= slidesNum) {
|
||
mySwiper = new Swiper('#swiper2', {
|
||
autoplay: 4000,//可选选项，自动滑动
|
||
direction: 'vertical',
|
||
loop: true,
|
||
slidesPerView: slidesNum
|
||
})
|
||
}
|
||
else {
|
||
mySwiper = new Swiper('#swiper2', {
|
||
//autoplay: 4000,//可选选项，自动滑动
|
||
direction: 'vertical',
|
||
loop: true,
|
||
slidesPerView: slidesNum
|
||
})
|
||
}
|
||
}
|
||
}
|
||
})
|
||
|
||
$("#swiper2").on('click', 'li', function () {
|
||
var $this = $(this)
|
||
var data = $this.attr("data-id")
|
||
var noticeId = $this.attr("notice-id")
|
||
|
||
//$(".project-list-wrap").show();
|
||
//return
|
||
if (data != "") {
|
||
//Window1.GetShowReference(data) + "return false;";
|
||
document.getElementById("hdNoticeId").value = noticeId;
|
||
document.getElementById("imgBtn").click();
|
||
window.open(data);
|
||
top.window.location.reload();
|
||
}
|
||
})
|
||
</script>
|
||
</html> |