cwchen
/
ah_jjzhgd_webscreen
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

省侧大屏跳转施工大屏

This commit is contained in:
cwchen 2024-04-23 14:20:47 +08:00
parent 9306dcbbdb
commit 5fb459b9d8
1 changed files with 267 additions and 212 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

237
pages/web/js/main.js
View File

@ -1,6 +1,3 @@
const baseUrl = 'http://127.0.0.1:18080/zhgd'
// const baseUrl = 'http://192.168.0.7:18080/zhgd'
var loader = { var loader = {
get: function (url, data = null, scb) { get: function (url, data = null, scb) {
let reqData = { let reqData = {
@ -15,7 +12,7 @@ var loader = {
} }
$.ajax({ $.ajax({
url: baseUrl + url, url: commonUrl + url,
type: 'get', type: 'get',
headers: { headers: {
"authorization": sessionStorage.getItem("zhgd_token") "authorization": sessionStorage.getItem("zhgd_token")
@ -25,12 +22,12 @@ var loader = {
}); });
} }
} }
let gtList=[]; let gtList = [];
var terrainMap; var terrainMap;
let element, layer, table; let element, layer, table;
// 选中标段工程 // 选中标段工程
let checkBidCode = null; let checkBidCode = null;
layui.use(['form','layer', 'element', 'table'], function () { layui.use(['form', 'layer', 'element', 'table'], function () {
element = layui.element; element = layui.element;
layer = layui.layer; layer = layui.layer;
table = layui.table; table = layui.table;
@ -84,8 +81,10 @@ layui.use(['form','layer', 'element', 'table'], function () {
form.on('select(bidPro)', function (data) { form.on('select(bidPro)', function (data) {
let value = data.value; let value = data.value;
let valueArr = value.split('@'); let valueArr = value.split('@');
loadBidProTower(valueArr[0],valueArr[1]); loadBidProTower(valueArr[0], valueArr[1]);
}); });
$("#quality-ranking-table").niceScroll({ cursorborder: "", cursorcolor: "#c0c4cc", boxzoom: true });
$("#alarm-reminder-table").niceScroll({ cursorborder: "", cursorcolor: "#c0c4cc", boxzoom: true });
}); });
$('#indexIframe').attr('src', './views/main.html'); $('#indexIframe').attr('src', './views/main.html');
@ -117,25 +116,32 @@ const tooltip = {
*/ */
// 工程统计 // 工程统计
function initEngineeringStatistic() { function initEngineeringStatistic() {
const url = '/screen/largeScreen/scIndex/proStatusStatistics' const url = 'screen/largeScreen/scIndex/proStatusStatistics'
loader.get(url, null, function (res) { loader.get(url, null, function (res) {
const {djNum, zjNum, allNum, tcNum, tgNum} = res.data if (res.code === 200) {
const { djNum, zjNum, allNum, tcNum, tgNum } = res.data
$('#engineering-statistic-item-1').text(djNum) $('#engineering-statistic-item-1').text(djNum)
$('#engineering-statistic-item-2').text(zjNum) $('#engineering-statistic-item-2').text(zjNum)
$('#engineering-statistic-item-3').text(allNum) $('#engineering-statistic-item-3').text(allNum)
$('#engineering-statistic-item-4').text(tcNum) $('#engineering-statistic-item-4').text(tcNum)
$('#engineering-statistic-item-5').text(tgNum) $('#engineering-statistic-item-5').text(tgNum)
} else if (res.code === 401) {
loginout(1);
} else {
console.error('工程统计:' + res.msg);
}
}) })
} }
// 施工质量排名 // 施工质量排名
function initQualityRanking() { function initQualityRanking() {
const url = '/screen/largeScreen/scIndex/constrQuality' const url = 'screen/largeScreen/scIndex/constrQuality'
loader.get(url, null, function (res) { loader.get(url, null, function (res) {
if (res.code === 200) {
res.data.forEach((item, index) => { res.data.forEach((item, index) => {
const {bidName, teamName, teamLeader, score} = item const { bidName, teamName, teamLeader, score } = item
var newRow = `<li> var newRow = `<li>
<div class="quality-ranking quality-ranking-${index+1}">${index + 1}</div> <div class="quality-ranking quality-ranking-${index + 1}">${index + 1}</div>
<div title="${bidName}">${bidName}</div> <div title="${bidName}">${bidName}</div>
<div title="${teamName}">${teamName}</div> <div title="${teamName}">${teamName}</div>
<div title="${teamLeader}">${teamLeader}</div> <div title="${teamLeader}">${teamLeader}</div>
@ -146,23 +152,34 @@ function initQualityRanking() {
if (res.data && res.data.length === 0) { if (res.data && res.data.length === 0) {
$("#quality-ranking-table").append('<li class="layout"><p>无数据</p></li>'); $("#quality-ranking-table").append('<li class="layout"><p>无数据</p></li>');
} }
$("#quality-ranking-table").niceScroll({ cursorborder: "", cursorcolor: "#c0c4cc", boxzoom: true }); } else if (res.code === 401) {
loginout(1);
} else {
console.error('施工质量排名:' + res.msg);
}
}) })
} }
// 环境分析 // 环境分析
function initEnvironmentAnalysis() { function initEnvironmentAnalysis() {
const url = '/screen/largeScreen/scIndex/environmentDetection' const url = 'screen/largeScreen/scIndex/environmentDetection'
loader.get(url, null, function (res) { loader.get(url, null, function (res) {
if (res.code === 200) {
const data = res.data[0] const data = res.data[0]
if (!data) { return } if (!data) { return }
const {aqiNormalNum, aqiErrorNum, dbNormalNum, dbErrorNum, hcNormalNum, hcErrorNum} = data const { aqiNormalNum, aqiErrorNum, dbNormalNum, dbErrorNum, hcNormalNum, hcErrorNum } = data
$('#environment-analysis-1').find('div:first').find('p:first span').text(aqiNormalNum) $('#environment-analysis-1').find('div:first').find('p:first span').text(aqiNormalNum)
$('#environment-analysis-1').find('div:first').find('p:last span').text(aqiErrorNum) $('#environment-analysis-1').find('div:first').find('p:last span').text(aqiErrorNum)
$('#environment-analysis-2').find('div:first').find('p:first span').text(dbNormalNum) $('#environment-analysis-2').find('div:first').find('p:first span').text(dbNormalNum)
$('#environment-analysis-2').find('div:first').find('p:last span').text(dbErrorNum) $('#environment-analysis-2').find('div:first').find('p:last span').text(dbErrorNum)
$('#environment-analysis-3').find('div:first').find('p:first span').text(hcNormalNum) $('#environment-analysis-3').find('div:first').find('p:first span').text(hcNormalNum)
$('#environment-analysis-3').find('div:first').find('p:last span').text(hcErrorNum) $('#environment-analysis-3').find('div:first').find('p:last span').text(hcErrorNum)
} else if (res.code === 401) {
loginout(1);
} else {
console.error('环境分析:' + res.msg);
}
}) })
} }
@ -174,21 +191,27 @@ function initDeviceStatus() {
let data2 = [] let data2 = []
let data3 = [] let data3 = []
const url = '/screen/largeScreen/scIndex/deviceStatus' const url = 'screen/largeScreen/scIndex/deviceStatus'
loader.get(url, null, function (res) { loader.get(url, null, function (res) {
const {allTotalNum, onlineTotalNum, offTotalNum, valueList} = res.data; if (res.code === 200) {
const { allTotalNum, onlineTotalNum, offTotalNum, valueList } = res.data;
$('#device-status__total').text(allTotalNum) $('#device-status__total').text(allTotalNum)
$('#device-status__online').text(onlineTotalNum) $('#device-status__online').text(onlineTotalNum)
$('#device-status__offline').text(offTotalNum) $('#device-status__offline').text(offTotalNum)
// console.log(valueList) // console.log(valueList)
valueList.forEach(item => { valueList.forEach(item => {
const {proName, totalNum, onlineNum, offLineNum} = item const { proName, totalNum, onlineNum, offLineNum } = item
xLabel.push(proName) xLabel.push(proName)
data1.push(totalNum) data1.push(totalNum)
data2.push(onlineNum) data2.push(onlineNum)
data3.push(offLineNum) data3.push(offLineNum)
}) })
} else if (res.code === 401) {
loginout(1);
} else {
console.error('设备状态:' + res.msg);
}
// console.log(xLabel) // console.log(xLabel)
let option = { let option = {
tooltip, tooltip,
@ -472,13 +495,13 @@ function initMainMap(dataMap = []) {
textStyle: { textStyle: {
color: '#fff' color: '#fff'
}, },
formatter (res) { formatter(res) {
const dom = '<div>'+ `标段工程名称：${res.data.bidName}` + '</div>' + const dom = '<div>' + `标段工程名称：${res.data.bidName}` + '</div>' +
'<div>'+ `标段编码：${res.data.bidCode}` + '</div>' + '<div>' + `标段编码：${res.data.bidCode}` + '</div>' +
'<div>'+ `班组名称：${res.data.teamName}` + '</div>' + '<div>' + `班组名称：${res.data.teamName}` + '</div>' +
'<div>'+ `班组长：${res.data.workManager}` + '</div>' + '<div>' + `班组长：${res.data.workManager}` + '</div>' +
'<div>'+ `风险等级：${res.data.riskLevel}` + '</div>' + '<div>' + `风险等级：${res.data.riskLevel}` + '</div>' +
'<div>'+ `工作内容：${res.data.workContent}` + '</div>' '<div>' + `工作内容：${res.data.workContent}` + '</div>'
return dom return dom
}, },
extraCssText: "max-width:300px;height:auto;word-break:break-all;white-space:pre-wrap;", extraCssText: "max-width:300px;height:auto;word-break:break-all;white-space:pre-wrap;",
@ -597,6 +620,20 @@ function initMainMap(dataMap = []) {
myChart.clear(); myChart.clear();
myChart.setOption(option, true); myChart.setOption(option, true);
myChart.off('dblclick').on("dblclick", function (params) {
if(params.componentType === 'series'){
const paramsData = {
'bidCode': params.data.bidCode,
'token': token
};
// 将参数转换为查询字符串
const queryString = Object.keys(paramsData)
.map(key => encodeURIComponent(key) + '=' + encodeURIComponent(encryptCBC(paramsData[key])))
.join('&');
const hrefUrl = login_sg_index + "?" + queryString;
const newWindow = window.open(hrefUrl, 'newWindow');
}
})
}); });
window.addEventListener("resize", function () { window.addEventListener("resize", function () {
myChart.resize(); myChart.resize();
@ -664,7 +701,7 @@ function mapSearch() {
} }
function initRiskData() { function initRiskData() {
const url = '/screen/largeScreen/scIndex/riskStatistics' const url = 'screen/largeScreen/scIndex/riskStatistics'
loader.get(url, null, function (res) { loader.get(url, null, function (res) {
const data = res.data const data = res.data
mainMapPointList = data mainMapPointList = data
@ -673,7 +710,7 @@ function initRiskData() {
}) })
} }
function initMap(){ function initMap() {
createMap() createMap()
// madeBoundary(); //加载区域图 // madeBoundary(); //加载区域图
// addMapControl(); // 添加自定义控件 // addMapControl(); // 添加自定义控件
@ -682,7 +719,7 @@ function initMap(){
} }
// 设置杆塔连线 // 设置杆塔连线
function setTowerLine(gtList){ function setTowerLine(gtList) {
let allOverlayList = terrainMap.getOverlays(); let allOverlayList = terrainMap.getOverlays();
//循坏所有点并清除指定的点 //循坏所有点并清除指定的点
if (allOverlayList.length > 0) { if (allOverlayList.length > 0) {
@ -693,64 +730,64 @@ function setTowerLine(gtList){
} }
} }
} }
var points=[]; var points = [];
for(var i = 0; i < gtList.length; i++) { for (var i = 0; i < gtList.length; i++) {
var point=new Object(); var point = new Object();
point.lng=gtList[i].lon; point.lng = gtList[i].lon;
point.lat=gtList[i].lat; point.lat = gtList[i].lat;
point.proName=gtList[i].proName; point.proName = gtList[i].proName;
point.img='../../../img/map/bdz.png'; point.img = '../../../img/map/bdz.png';
point.place=gtList[i].gtName; point.place = gtList[i].gtName;
points.push(point); points.push(point);
} }
console.log(points) console.log(points)
for(var i=0, len = points.length; i<len; i++) { for (var i = 0, len = points.length; i < len; i++) {
//自定义图标 //自定义图标
var pointIcon = new BMap.Icon(points[i].img,new BMap.Size(27,27)); var pointIcon = new BMap.Icon(points[i].img, new BMap.Size(27, 27));
//将标注点转化为地图上的点 //将标注点转化为地图上的点
var point = new BMap.Point(points[i].lat, points[i].lng); var point = new BMap.Point(points[i].lat, points[i].lng);
var infoWindow = new BMap.InfoWindow( points[i].place); var infoWindow = new BMap.InfoWindow(points[i].place);
//将点转化为标注点 //将点转化为标注点
var marker = new BMap.Marker(point,{icon:pointIcon}); var marker = new BMap.Marker(point, { icon: pointIcon });
//添加点图层 //添加点图层
terrainMap.addOverlay(marker); terrainMap.addOverlay(marker);
(function() { (function () {
let title= '<p class="map-p">工程名称：' + points[i].proName+ '</p>' + let title = '<p class="map-p">工程名称：' + points[i].proName + '</p>' +
'<p class="map-p">杆塔名称：' + points[i].place + '</p>' + '<p class="map-p">杆塔名称：' + points[i].place + '</p>' +
'<p class="map-p">经度：' +points[i].lat + '</p>' + '<p class="map-p">经度：' + points[i].lat + '</p>' +
'<p class="map-p">维度：' + points[i].lng+ '</p>'; '<p class="map-p">维度：' + points[i].lng + '</p>';
//创建label图层 points[i].place //创建label图层 points[i].place
var label = new BMap.Label(title,{position:point}); var label = new BMap.Label(title, { position: point });
marker.addEventListener("mouseover",function() { marker.addEventListener("mouseover", function () {
terrainMap.addOverlay(label); terrainMap.addOverlay(label);
}); });
marker.addEventListener("mouseout",function() { marker.addEventListener("mouseout", function () {
terrainMap.removeOverlay(label); terrainMap.removeOverlay(label);
}); });
})(); })();
} }
//将所有点连线，连线图层polyline //将所有点连线，连线图层polyline
var line = []; var line = [];
for(var i=0; i<points.length; i++){ for (var i = 0; i < points.length; i++) {
console.log(points[i].lng, points[i].lat) console.log(points[i].lng, points[i].lat)
line.push(new BMap.Point(points[i].lat, points[i].lng)); line.push(new BMap.Point(points[i].lat, points[i].lng));
} }
line.push(new BMap.Point(points[0].lat, points[0].lng)); line.push(new BMap.Point(points[0].lat, points[0].lng));
console.log(line,'line') console.log(line, 'line')
console.log(line) console.log(line)
var polyline = new BMap.Polyline(line,{strokeColor:'#00aa00',strokeWeight:2,strokeOpacity:1}); var polyline = new BMap.Polyline(line, { strokeColor: '#00aa00', strokeWeight: 2, strokeOpacity: 1 });
terrainMap.addOverlay(polyline); terrainMap.addOverlay(polyline);
terrainMap.centerAndZoom(line[0],10); //设置中心点和缩放层级 terrainMap.centerAndZoom(line[0], 10); //设置中心点和缩放层级
} }
function createMap(){ function createMap() {
terrainMap = new BMap.Map("map", {}); terrainMap = new BMap.Map("map", {});
terrainMap.centerAndZoom('合肥', 8); terrainMap.centerAndZoom('合肥', 8);
madeBoundary(); //加载区域图 madeBoundary(); //加载区域图
addMapControl(); // 添加自定义控件 addMapControl(); // 添加自定义控件
setMapEvent(); //地图控件设置 setMapEvent(); //地图控件设置
$('#allMap').css({'zIndex': 999, 'backgroundColor': 'transparent'}); $('#allMap').css({ 'zIndex': 999, 'backgroundColor': 'transparent' });
} }
//设置区域图 start //设置区域图 start
@ -834,17 +871,23 @@ function setMapEvent() {
// 工程安全隐患分析 // 工程安全隐患分析
function initSafetyAnalysis() { function initSafetyAnalysis() {
const url = '/screen/largeScreen/scIndex/potentialSafetyHazard' const url = 'screen/largeScreen/scIndex/potentialSafetyHazard'
loader.get(url, null, function (res) { loader.get(url, null, function (res) {
let xLabel = [] let xLabel = []
let dataValue = [] let dataValue = []
let dataValue1 = [] let dataValue1 = []
if(res.code === 200){
res.data.forEach(item => { res.data.forEach(item => {
const {orgName, planNum, dangerNum} = item const { orgName, planNum, dangerNum } = item
xLabel.push(orgName) xLabel.push(orgName)
dataValue.push(planNum) dataValue.push(planNum)
dataValue1.push(dangerNum) dataValue1.push(dangerNum)
}) })
}else if(res.code === 401){
loginout(1);
}else {
console.error("工程安全隐患分析:"+res.msg);
}
let option = { let option = {
@ -1104,13 +1147,19 @@ function initEfficiencyAnalysis() {
let xLabel = [] let xLabel = []
let data = [] let data = []
const url = '/screen/largeScreen/scIndex/efficiencyAnalysis' const url = 'screen/largeScreen/scIndex/efficiencyAnalysis'
loader.get(url, null, function (res) { loader.get(url, null, function (res) {
if(res.code === 200){
res.data.forEach(item => { res.data.forEach(item => {
const {proName, value} = item const { proName, value } = item
xLabel.push(proName) xLabel.push(proName)
data.push(value) data.push(value)
}) })
}else if(res.code === 401){
loginout(1);
}else{
console.error("工人效率分析:" + res.msg);
}
let option = { let option = {
tooltip, tooltip,
@ -1130,7 +1179,7 @@ function initEfficiencyAnalysis() {
moveHandleStyle: { moveHandleStyle: {
color: "#08A0A3", color: "#08A0A3",
}, },
},{ }, {
type: "inside", // 支持内部鼠标滚动平移 type: "inside", // 支持内部鼠标滚动平移
startValue: 0, startValue: 0,
endValue: 3, endValue: 3,
@ -1266,7 +1315,7 @@ function initEfficiencyAnalysis() {
// 资源利用 // 资源利用
function initResourceRate() { function initResourceRate() {
const url = '/screen/largeScreen/scIndex/resourceUse' const url = 'screen/largeScreen/scIndex/resourceUse'
let element = document.getElementsByClassName('resource-rate-item') let element = document.getElementsByClassName('resource-rate-item')
const config = [ const config = [
{ {
@ -1292,7 +1341,7 @@ function initResourceRate() {
}, },
] ]
loader.get(url, null, function (res) { loader.get(url, null, function (res) {
const {personnelRate, deviceRate, energyValue} = res.data const { personnelRate, deviceRate, energyValue } = res.data
config[0].dataNum = personnelRate config[0].dataNum = personnelRate
config[1].dataNum = deviceRate config[1].dataNum = deviceRate
config[2].dataNum = energyValue config[2].dataNum = energyValue
@ -1309,7 +1358,7 @@ function initResourceRate() {
}) })
} }
function getResourceChartOption(config) { function getResourceChartOption(config) {
const {dataTitle, dataNum, dataNumColor, dashboardBgc, dashboardColor} = config const { dataTitle, dataNum, dataNumColor, dashboardBgc, dashboardColor } = config
let option = { let option = {
series: [ series: [
{ {
@ -1395,10 +1444,11 @@ function getResourceChartOption(config) {
// 告警提醒 // 告警提醒
function initAlarmReminder() { function initAlarmReminder() {
const url = '/screen/largeScreen/scIndex/alarmReminder' const url = 'screen/largeScreen/scIndex/alarmReminder'
loader.get(url, null, function (res) { loader.get(url, null, function (res) {
if(res.code === 200){
res.data.forEach((item, index) => { res.data.forEach((item, index) => {
const {proName, warningContent} = item const { proName, warningContent } = item
var newRow = `<li> var newRow = `<li>
<div title="${proName}">${proName}</div> <div title="${proName}">${proName}</div>
<div title="${warningContent}">${warningContent}</div> <div title="${warningContent}">${warningContent}</div>
@ -1408,8 +1458,13 @@ function initAlarmReminder() {
if (res.data && res.data.length === 0) { if (res.data && res.data.length === 0) {
$("#alarm-reminder-table").append('<li class="layout" style="justify-content: center;"><p>无数据</p></li>'); $("#alarm-reminder-table").append('<li class="layout" style="justify-content: center;"><p>无数据</p></li>');
} }
$("#alarm-reminder-table").niceScroll({ cursorborder: "", cursorcolor: "#c0c4cc", boxzoom: true }); }else if(res.code === 401){
loginout(1);
}else {
console.error("告警提醒:"+res.msg);
}
}) })
} }
/* 标段工程数据 */ /* 标段工程数据 */
@ -1432,15 +1487,15 @@ function loadBidPro() {
setData(null); setData(null);
}, aqEnnable); }, aqEnnable);
function setData(bidCodeList){ function setData(bidCodeList) {
let html = ''; let html = '';
if (bidCodeList && bidCodeList.length > 0) { if (bidCodeList && bidCodeList.length > 0) {
$.each(bidCodeList, function (index, item) { $.each(bidCodeList, function (index, item) {
if(index === 0){ if (index === 0) {
checkBidCode = item.bidCode; checkBidCode = item.bidCode;
html += '<option value="' + (item.bidCode + "@" + item.proName) + '" checked>' + item.proName + '</option>' html += '<option value="' + (item.bidCode + "@" + item.proName) + '" checked>' + item.proName + '</option>'
loadBidProTower(item.bidCode,item.proName); loadBidProTower(item.bidCode, item.proName);
}else{ } else {
html += '<option value="' + (item.bidCode + "@" + item.proName) + '">' + item.proName + '</option>' html += '<option value="' + (item.bidCode + "@" + item.proName) + '">' + item.proName + '</option>'
} }
}) })
@ -1452,7 +1507,7 @@ function loadBidPro() {
} }
/* 标段工程杆塔数据 */ /* 标段工程杆塔数据 */
function loadBidProTower(bidCode,proName) { function loadBidProTower(bidCode, proName) {
const paramData = 'bidCode=' + bidCode; const paramData = 'bidCode=' + bidCode;
let montageParam = aqEnnable ? encryptCBC(paramData) : ' &' + encryptCBC(paramData); let montageParam = aqEnnable ? encryptCBC(paramData) : ' &' + encryptCBC(paramData);
const url = commonUrl + 'screen/largeScreen/scIndex/getGtList?params=' + montageParam; const url = commonUrl + 'screen/largeScreen/scIndex/getGtList?params=' + montageParam;
@ -1469,38 +1524,38 @@ function loadBidProTower(bidCode,proName) {
errorFn(xhr, status, error) errorFn(xhr, status, error)
}, aqEnnable); }, aqEnnable);
function setData(data){ function setData(data) {
if(data && data.length == 0){ if (data && data.length == 0) {
data = [ data = [
{ {
lat:118.07138310, lat: 118.07138310,
lon:31.05344367, lon: 31.05344367,
proName:proName, proName: proName,
gtName:'A1', gtName: 'A1',
}, },
{ {
lat:118.07050390, lat: 118.07050390,
lon:31.05571928, lon: 31.05571928,
proName:proName, proName: proName,
gtName:'A2', gtName: 'A2',
}, },
{ {
lat:118.06960770, lat: 118.06960770,
lon:31.05803784, lon: 31.05803784,
proName:proName, proName: proName,
gtName:'A3', gtName: 'A3',
}, },
{ {
lat:118.0684919, lat: 118.0684919,
lon:31.06092441, lon: 31.06092441,
proName:proName, proName: proName,
gtName:'A4', gtName: 'A4',
}, },
{ {
lat:118.07093833, lat: 118.07093833,
lon:31.06312931, lon: 31.06312931,
proName:proName, proName: proName,
gtName:'A5', gtName: 'A5',
} }
] ]