zcdsj
/
safesite
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

datashow2 random popup

This commit is contained in:
caoqianming 2019-12-30 16:39:58 +08:00
parent 7cea8fe683
commit 9da58b81aa
3 changed files with 129 additions and 103 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
safesite/static/safesite/mystatic/js/util2.js
View File

@ -1,47 +0,0 @@
//map定时显示,每分钟请求一次
function update() {
if ($('#mapshowinput').length) {
source.clear()
$.get('/api/mapshow?a=risk', function (res) {
for (let i = 0, len = res.length; i < len; i++) {
setPolygon(res[i])
}
})
$.get('/api/mapshow?a=trouble', function (res) {
for (let i = 0, len = res.length; i < len; i++) {
var data = res[i]
data.id = data.yhqy__id
data.num = data.num
data.polygon = data.yhqy__polygon
data.name = data.yhqy__name
data.type = 'yh'
setPoint(data)
}
})
$.get('/api/mapshow?a=miss', function (res) {
for (let i = 0, len = res.length; i < len; i++) {
var data = res[i]
data.id = data.missqy__id
data.num = data.num
data.polygon = data.missqy__polygon
data.name = data.missqy__name
data.type = 'ws'
setPoint(data)
}
})
$.get('/api/mapshow?a=operation', function (res) {
console.log(res)
for (let i = 0, len = res.length; i < len; i++) {
var data = res[i]
data.id = data.zyqy__id
data.num = data.num
data.polygon = data.zyqy__polygon
data.name = data.zyqy__name
data.type = 'zy'
data.list = data.zylist
setPoint(data)
}
})
}
}
var t1 = window.setInterval(update, 1000 * 60 * 5)

3
safesite/static/safesite/mystatic/openlayer/polyfill.js Normal file
View File

@ -0,0 +1,3 @@
/* Disable minification (remove `.min` from URL path) for more info */
(function(undefined) {}).call('object' === typeof window && window || 'object' === typeof self && self || 'object' === typeof global && global || {});

182
safesite/templates/datashow2.html
View File

@ -9,11 +9,8 @@
<link rel="icon" href="/media/favicon.ico" type="image/x-icon" /> <link rel="icon" href="/media/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" type="text/css" href="/static/safesite/mystatic/openlayer/ol.css"> <link rel="stylesheet" type="text/css" href="/static/safesite/mystatic/openlayer/ol.css">
<script type="text/javascript" src="/static/safesite/easyui/jquery.min.js"></script> <script type="text/javascript" src="/static/safesite/easyui/jquery.min.js"></script>
<script type="text/javascript" src="/static/safesite/mystatic/js/util2.js"></script>
<script type="text/javascript" src="/static/safesite/mystatic/openlayer/ol.js"></script> <script type="text/javascript" src="/static/safesite/mystatic/openlayer/ol.js"></script>
<script <script type="text/javascript" src="/static/safesite/mystatic/openlayer/polyfill.js"></script>
src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"></script>
</head> </head>
<body> <body>
@ -21,54 +18,54 @@
<header> <header>
企业安全数据显示大屏 企业安全数据显示大屏
</header> </header>
<div class="center_top"> <div class="center_top">
<div id="map" class="map" style="width:100%;height:100%;outline: #4A74A8 solid 0.15em;"> <div id="map" class="map" style="width:100%;height:100%;outline: #4A74A8 solid 0.15em;">
</div> </div>
<input type='hidden' id='mapshowinput'></input> <input type='hidden' id='mapshowinput'></input>
<div id="popup" class="ol-popup"> <div id="popup" class="ol-popup">
<a href="#" id="popup-closer" class="ol-popup-closer"></a> <a href="#" id="popup-closer" class="ol-popup-closer"></a>
<div id="popup-content"></div> <div id="popup-content"></div>
</div> </div>
</div>
<div class="center_bot">
<div height="40" style="background-color: red;font-weight:bold;text-align: center;">危险作业列表
</div>
<div class="tablebox">
<div class="tbl-header">
<table cellspacing="0" cellpadding="0" border="0">
<thead>
<tr>
<th>作业编号</th>
<th>作业类型</th>
<th>作业区域</th>
<th>作业部门</th>
<th>作业负责人</th>
<th>作业人数</th>
<th>开始时间</th>
</tr>
</thead>
<tbody style="opacity:0;"></tbody>
</table>
</div> </div>
<div class="center_bot">
<div height="40" style="background-color: red;font-weight:bold;text-align: center;">危险作业列表
</div>
<div class="tablebox">
<div class="tbl-header">
<table cellspacing="0" cellpadding="0" border="0">
<thead>
<tr>
<th>作业编号</th>
<th>作业类型</th>
<th>作业区域</th>
<th>作业部门</th>
<th>作业负责人</th>
<th>作业人数</th>
<th>开始时间</th>
</tr>
</thead>
<tbody style="opacity:0;"></tbody>
</table>
</div>
<div class="tbl-body"> <div class="tbl-body">
<table cellspacing="0" cellpadding="0" border="0"> <table cellspacing="0" cellpadding="0" border="0">
<thead> <thead>
<tr> <tr>
<th>作业编号</th> <th>作业编号</th>
<th>作业类型</th> <th>作业类型</th>
<th>作业区域</th> <th>作业区域</th>
<th>作业部门</th> <th>作业部门</th>
<th>作业负责人</th> <th>作业负责人</th>
<th>作业人数</th> <th>作业人数</th>
<th>开始时间</th> <th>开始时间</th>
</tr> </tr>
</thead> </thead>
<tbody></tbody> <tbody></tbody>
</table> </table>
</div>
</div>
</div> </div>
</div>
</div>
<!-- center --> <!-- center -->
<style> <style>
.ol-popup { .ol-popup {
@ -122,6 +119,11 @@
</style> </style>
<script> <script>
var map, source, vector;// global so we can remove it later var map, source, vector;// global so we can remove it later
var popuplist = [];
var MyMarhq = ''; //列表滚动定时
var Mylist = ''; //作业列表定时获取
var Updatepoint = ''; //图标定时获取
var Updatepopup = '';//popup定时获取
var container = document.getElementById("popup"); var container = document.getElementById("popup");
var content = document.getElementById("popup-content"); var content = document.getElementById("popup-content");
var popupCloser = document.getElementById("popup-closer"); var popupCloser = document.getElementById("popup-closer");
@ -134,7 +136,7 @@
$.get('/api/map?a=default', function (res) { $.get('/api/map?a=default', function (res) {
$('#map').empty() $('#map').empty()
map = initMap(res.pic) map = initMap(res.pic)
update() updatepo()
}) })
function initMap(url) { function initMap(url) {
@ -328,9 +330,8 @@
} }
var MyMarhq = '';
var Mylist = ''; clearInterval(Mylist, Updatepoint);
clearInterval(Mylist);
$('.tbl-body tbody').empty(); $('.tbl-body tbody').empty();
$('.tbl-header tbody').empty(); $('.tbl-header tbody').empty();
var str = ''; var str = '';
@ -341,7 +342,7 @@
Items = res.rows Items = res.rows
str = '' str = ''
$.each(Items, function (i, item) { $.each(Items, function (i, item) {
str = str + '<tr>' + str = str + '<tr>' +
'<td>' + item.zynum + '</td>' + '<td>' + item.zynum + '</td>' +
'<td>' + item.zylx__dickeyname + '</td>' + '<td>' + item.zylx__dickeyname + '</td>' +
'<td>' + item.zyqy__name + '</td>' + '<td>' + item.zyqy__name + '</td>' +
@ -379,9 +380,78 @@
} }
}) })
} }
getOperlist() getOperlist();
Mylist = setInterval("getOperlist()", 1000 * 60 * 10); Mylist = setInterval("getOperlist()", 1000 * 60 * 10);
//map定时显示,每5分钟请求一次
function updatepo() {
if ($('#mapshowinput').length) {
source.clear()
$.get('/api/mapshow?a=risk', function (res) {
for (let i = 0, len = res.length; i < len; i++) {
setPolygon(res[i])
}
})
$.get('/api/mapshow?a=trouble', function (res) {
for (let i = 0, len = res.length; i < len; i++) {
var data = res[i]
data.id = data.yhqy__id
data.num = data.num
data.polygon = data.yhqy__polygon
data.name = data.yhqy__name
data.type = 'yh'
setPoint(data)
}
})
$.get('/api/mapshow?a=miss', function (res) {
for (let i = 0, len = res.length; i < len; i++) {
var data = res[i]
data.id = data.missqy__id
data.num = data.num
data.polygon = data.missqy__polygon
data.name = data.missqy__name
data.type = 'ws'
setPoint(data)
}
})
$.get('/api/mapshow?a=operation', function (res) {
for (let i = 0, len = res.length; i < len; i++) {
var data = res[i]
data.id = data.zyqy__id
data.num = data.num
data.polygon = data.zyqy__polygon
data.name = data.zyqy__name
data.type = 'zy'
data.list = data.zylist
popuplist.push(data)
setPoint(data)
}
})
}
}
Updatepoint = setInterval(updatepo, 1000 * 60 * 5)
function showpopup(){
var len = popuplist.length
if(len != 0){
var index = Math.floor(Math.random()*len)
let po = popuplist[index]
var extent = ol.extent.boundingExtent(po.polygon[0]);
var center = ol.extent.getCenter(extent);//中心点
var html = "<p style='color:green;font-weight:bold' >" + po.name + "</p>"
html = html + "<p style='color:blue'>危险作业数量:" + po.num.toString() + "</p>"
for (let i = 0; i < po.list.length; i++) {
html = html + "<p style='color:red'>" + (i + 1).toString() + ":" + po.list[i].zylx__dickeyname + "--" + po.list[i].zybm__partname + "--" + po.list[i].zyfzr__name + "--作业人数" + po.list[i].num.toString() + "</p>"
}
content.innerHTML = html;
overlay.setPosition(undefined);
popupCloser.blur();
//设置overlay的显示位置
overlay.setPosition(center);
//显示overlay
map.addOverlay(overlay);
}
}
Updatepopup = setInterval(showpopup, 1000 * 5)
</script> </script>
</body> </body>