Files
SIPAIIS_WMS_JSSW/WebRoot/jsp/process/dataVisualView.jsp
2026-01-16 14:13:44 +08:00

1046 lines
59 KiB
Plaintext

<%@ page language="java" pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ page import="com.sipai.entity.base.ServerObject" %>
<%@ taglib uri="http://www.springsecurity.org/jsp" prefix="security" %>
<%String contextPath = request.getContextPath();%>
<%@page import="com.sipai.entity.process.DataVisualFrame" %>
<%request.setAttribute("Type_structure", DataVisualFrame.Type_structure); %>
<%request.setAttribute("Type_frame", DataVisualFrame.Type_frame); %>
<%@page import="com.sipai.entity.process.DataVisualContent" %>
<%request.setAttribute("Type_SignalPoint", DataVisualContent.Type_SignalPoint); %>
<%request.setAttribute("Type_DataPoint", DataVisualContent.Type_DataPoint); %>
<%request.setAttribute("Type_Text", DataVisualContent.Type_Text); %>
<%request.setAttribute("Type_Camera", DataVisualContent.Type_Camera); %>
<%request.setAttribute("Type_Form", DataVisualContent.Type_Form); %>
<%request.setAttribute("Type_BarChart", DataVisualContent.Type_BarChart); %>
<%request.setAttribute("Type_LineChart", DataVisualContent.Type_LineChart); %>
<%request.setAttribute("Type_PieChart", DataVisualContent.Type_PieChart); %>
<%request.setAttribute("Type_PercentChart", DataVisualContent.Type_PercentChart); %>
<%request.setAttribute("Type_RadarChart", DataVisualContent.Type_RadarChart); %>
<%request.setAttribute("Type_GaugeChart", DataVisualContent.Type_GaugeChart); %>
<%request.setAttribute("Type_Picture", DataVisualContent.Type_Picture); %>
<%request.setAttribute("Type_Date", DataVisualContent.Type_Date); %>
<%request.setAttribute("Type_Iframe", DataVisualContent.Type_Iframe); %>
<%request.setAttribute("Type_Tab", DataVisualContent.Type_Tab); %>
<%request.setAttribute("Type_MpView", DataVisualContent.Type_MpView); %>
<%request.setAttribute("Type_ProgressBar", DataVisualContent.Type_ProgressBar); %>
<%request.setAttribute("Type_Line", DataVisualContent.Type_Line); %>
<%request.setAttribute("Type_DateSelect", DataVisualContent.Type_DateSelect); %>
<%request.setAttribute("Type_SuspensionFrame", DataVisualContent.Type_SuspensionFrame); %>
<%request.setAttribute("Type_PolarCoordinates", DataVisualContent.Type_PolarCoordinates); %>
<%request.setAttribute("Type_Weather", DataVisualContent.Type_Weather); %>
<%request.setAttribute("Type_PersonnelPositioning", DataVisualContent.Type_PersonnelPositioning); %>
<!DOCTYPE html>
<!-- <html lang="zh-CN"> -->
<!-- BEGIN HEAD -->
<head>
<title><%= ServerObject.atttable.get("TOPTITLE")%>
</title>
<!-- 引用页头及CSS页-->
<jsp:include page="/jsp/incProVisual.jsp"></jsp:include>
<!-- 组件自定义js-->
<script type="text/javascript" src="<%=request.getContextPath()%>/jsp/process/dataVisualAssembly/assembly.js"
charset="utf-8"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/jsp/process/dataVisualAssembly/ZResize.js"
charset="utf-8"></script>
<!-- 引入daterangepicker-->
<link rel="stylesheet" href="<%=request.getContextPath()%>/node_modules/daterangepicker/daterangepicker-bs3.css"/>
<script type="text/javascript" src="<%=request.getContextPath()%>/node_modules/daterangepicker/moment.js"></script>
<script type="text/javascript"
src="<%=request.getContextPath()%>/node_modules/daterangepicker/daterangepicker.js"></script>
<link rel="stylesheet"
href="<%=request.getContextPath()%>/node_modules/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.min.css"/>
<script type="text/javascript"
src="<%=request.getContextPath()%>/node_modules/bootstrap-switch/dist/js/bootstrap-switch.min.js"
charset="utf-8"></script>
<%-- mqtt依赖--%>
<script src="<%=request.getContextPath()%>/JS/mqtt/mqtt.min.js" type="text/javascript"></script>
<%-- mqtt事件--%>
<jsp:include page="/jsp/mqtt/alarm_mqtt.jsp"></jsp:include>
<script type="text/javascript">
var frameId = "";
var nowUnitId = "";
var sdt = "";
var edt = "";
var roundtimeT = null;
var nowTNum = 1;
$(function () {
mqttStatus = '${mqttStatus}';
mqttHostWeb = '${mqttHostWeb}';
if ('${param.unitId}' != '') {
nowUnitId = '${param.unitId}';
} else {
nowUnitId = unitId;
}
frameId = '${param.frameId}'
showFrame('${param.frameId}');
});
var nowFrameWidth = "";
var nowFrameHeight = "";
var allContainers = new Array();
var nowFrameDataJson = [];
//mqtt推送服务
var mpValueDataJson = [];
var percentChartDataJson = [];
function showFrame(id) {
allContainers = new Array();
frameId = id;
$.post(ext.contextPath + '/process/dataVisualFrame/getFrame.do', {id: id}, function (data) {
if (data.type == '${Type_frame}') {
nowUnitId = data.unitid;
var id = data.id;
var bodyWidth = $(window).width();
var bodyHeight = $(window).height();
// var bodyWidth = "";
// var bodyHeight = "";
// if (global_width != null && global_height != null) {
// bodyWidth = global_width;
// bodyHeight = global_height;
// } else {
// bodyWidth = $(window).width();
// bodyHeight = $(window).height();
// }
$('#outFrame').css('width', bodyWidth);
$('#outFrame').css('height', bodyHeight);
// $('#outFrame').css('background-color', data.background);
// $('#bodyId').css('background-color', data.background);
window.onresize = function () {
$('#outFrame').css('width', $(window).width());
$('#outFrame').css('height', $(window).height());
}
var frameStyle = data.style;
if (frameStyle != '' && frameStyle.length > 0) {
document.getElementById("showFrame").style = frameStyle;
} else {
document.getElementById("showFrame").style = "";
}
$('#showFrame').css('width', data.width);
$('#showFrame').css('height', data.height);
// $('#showFrame').css('background', '');
$.post(ext.contextPath + '/base/getInputFileList.do', {
masterId: id,
tbName: 'tb_pro_dataVisual_frame_file'
}, function (imgdata) {
if (imgdata != '' && imgdata.length > 0) {
var path = imgdata[0].abspath;
path = path.substring(path.indexOf('webapps') + 7, path.length);
path = ext.basePath.replace(ext.contextPath, '') + path.replace(/\\/g, "\/");
$('#showFrame').css("background", "url(" + path + ") no-repeat");
$('#showFrame').css("background-size", "100% 100%");
} else {
$('#showFrame').css('background', data.background);
}
}, 'json');
// showContent(id);
nowFrameWidth = $('#showFrame').width();
nowFrameHeight = $('#showFrame').height();
$.ajax({
type: "GET",
url: ext.contextPath + "/process/dataVisualFrameContainer/getJson.do",
async: true,
globle: false,
data: {
frameId: frameId
},
dataType: 'json',
success: function (data) {
var html = "<table style=\"width: 100%;height: 100%;border-collapse: collapse;\">";
// var trLength=data.length;
// $('#containerC').css('height',(trLength*50)+"px");
for (var i = 0; i < data.length; i++) {
var r = data[i];
let trStyle = "";
if (r.height != null && r.height != '') {
trStyle += "height:" + r.height + ";";
}
if (r.width != null && r.width != '') {
trStyle += "height:" + r.width + ";";
}
html += "<tr style='" + trStyle + "'>";
if (r.nodes != '') {
for (var j = 0; j < r.nodes.length; j++) {
var c = r.nodes[j];
var width = c.width + "%";
var height = c.height + "%";
var bkcolor = c.background;
html += "<td rowspan=" + c.rows + " colspan=" + c.columns + " showRow=" + (r.insertRow) + " showColumn=" + (c.insertColumn) + " style='width:" + width + ";height:" + height + ";background:" + bkcolor + ";' >";
html += "<div id=" + c.id + " style=\"float:left;width:100%;height:100%;\">";
html += "<div id=\"" + c.id + "contentRelativeDiv\" style=\"position:relative;width: 100%;height: 100%;\"></div>";
html += "</div>";
allContainers.push(c.id);
html += "</td>";
}
}
html += "</tr>"
}
html += "</table>"
// console.log(html);
$('#showFrame').html(html);
// let t = setInterval(function () {
// console.log(t)
// }, 1000)
// for (let m = 1; m <= t; m++) {
// clearInterval(m);
// }
$.ajax({
type: "GET",
url: ext.contextPath + "/process/dataVisualContent/getFrameId_ZJ_Type.do?frameId=" + frameId,
async: false,
globle: false,
// dataType: 'json',
success: function (zjdatas) {
if (zjdatas.length > 0) {
let zjdatass = zjdatas.substring(0, zjdatas.length - 1).split(",");
for (var z = 0; z < zjdatass.length; z++) {
let zjdata = zjdatass[z];
if (zjdata == '11Switch' || zjdata == 'AADateSelect') {
$.ajax({
type: "GET",
url: ext.contextPath + "/process/dataVisualContent/getAllJson.do?frameId=" + frameId + "&sdt=" + sdt + "&edt=" + edt + "&zjdata=" + zjdata,
async: false,
globle: false,
dataType: 'json',
success: function (datas) {
nowFrameDataJson = datas;
console.log(datas)
if (datas != '') {
for (let i = 0; i < datas.length; i++) {
const data = datas[i];
showAllContent(data);
}
}
}
});
} else {
$.ajax({
type: "GET",
url: ext.contextPath + "/process/dataVisualContent/getAllJson.do?frameId=" + frameId + "&sdt=" + sdt + "&edt=" + edt + "&zjdata=" + zjdata,
async: true,
globle: false,
dataType: 'json',
success: function (datas) {
nowFrameDataJson = datas;
console.log(datas)
if (datas != '') {
for (let i = 0; i < datas.length; i++) {
const data = datas[i];
//给mq推送的各组件赋值
let contentId = data.content.id;
if (data.type == 'MpView') {
mpValueDataJson["AA" + contentId] = {
contnent: data.content,
showData: data.showData,
nowIndex: "-"
}
} else if (data.type == 'PercentChart') {
percentChartDataJson["AA" + contentId] = {
contnent: data.content,
showData: data.showData
}
}
showAllContent(data);
clearInterval(roundtimeT);
if (roundtimecontentList != '' && roundtimecontentList.length > 0) {
let roundtimecontentLists = roundtimecontentList.substring(0, roundtimecontentList.length - 1).split(",");
roundtimeT = setInterval(function () {
for (let t = 0; t < roundtimecontentLists.length; t++) {
if (roundtimecontentLists[t] == roundtimecontentLists[nowTNum - 1]) {
$("#" + roundtimecontentLists[t]).css('display', 'block');
} else {
$("#" + roundtimecontentLists[t]).css('display', 'none');
}
}
if (nowTNum < roundtimecontentLists.length) {
nowTNum++;
} else {
nowTNum = 1;
}
}, 5000);
}
}
}
}
});
}
}
}
}
});
setTimeout(function () {
getMqtt(mqttStatus, mqttHostWeb);
}, 5000);
// for (let index = 0; index < allContainers.length; index++) {
// const did = allContainers[index];
// showContent(did, 'td', did);
// // $.ajax({
// // type: "GET",
// // url: ext.contextPath + "/process/dataVisualContent/getJson.do?pid=" + did,
// // async: true,
// // globle: false,
// // success: function (data) {
// // var datas = JSON.parse(data);
// // if (datas != '') {
// // for (let i = 0; i < datas.length; i++) {
// // const content = datas[i];
// //
// // }
// // }
// // }
// // });
// }
}
// complete: function () {
// setTimeout(function () {
// if (roundtimecontentList != '' && roundtimecontentList.length > 0) {
// let roundtimecontentLists = roundtimecontentList.substring(0, roundtimecontentList.length - 1).split(",");
// roundtimeT = setInterval(function () {
// for (let t = 0; t < roundtimecontentLists.length; t++) {
// if (roundtimecontentLists[t] == roundtimecontentLists[nowTNum - 1]) {
// $("#" + roundtimecontentLists[t]).css('display', 'block');
// } else {
// $("#" + roundtimecontentLists[t]).css('display', 'none');
// }
// }
// if (nowTNum < roundtimecontentLists.length) {
// nowTNum++;
// } else {
// nowTNum = 1;
// }
// }, 5000);
// }
// },
// 10000
// )
// }
});
}
}, 'json');
}
<%--function showAllContent(data) {--%>
<%-- if (data.type == '${Type_SignalPoint}') {--%>
<%-- divHtml = showAssembly_mpdata_DI_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_DataPoint}') {--%>
<%-- divHtml = showAssembly_mpdata_AI_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_Text}') {--%>
<%-- divHtml = showAssembly_Text_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_Camera}') {--%>
<%-- divHtml = showAssembly_Camera_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_Form}') {--%>
<%-- divHtml = showAssembly_Form_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_PieChart}') {--%>
<%-- divHtml = showAssembly_PieChart_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_PercentChart}') {--%>
<%-- divHtml = showAssembly_PercentChart_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_RadarChart}') {--%>
<%-- divHtml = showAssembly_RadarChart_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_GaugeChart}') {--%>
<%-- divHtml = showAssembly_GaugeChart_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_Picture}') {--%>
<%-- divHtml = showAssembly_Picture_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_Date}') {--%>
<%-- divHtml = showAssembly_Date_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_DateSelect}') {--%>
<%-- divHtml = showAssembly_DateSelect_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_Weather}') {--%>
<%-- divHtml = showAssembly_Weather_View(data.content, data.showData, data.showWeatherData);--%>
<%-- } else if (data.type == '${Type_Iframe}') {--%>
<%-- divHtml = showAssembly_Iframe_View(data.content);--%>
<%-- } else if (data.type == '${Type_Line}') {--%>
<%-- divHtml = showAssembly_Line_View(data.content);--%>
<%-- } else if (data.type == '${Type_MpView}') {--%>
<%-- divHtml = showAssembly_MpView_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_ProgressBar}') {--%>
<%-- divHtml = showAssembly_ProgressBarChart_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_SuspensionFrame}') {--%>
<%-- divHtml = showAssembly_SuspensionFrame_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_PolarCoordinates}') {--%>
<%-- divHtml = showAssembly_PolarCoordinates_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_LineChart}') {--%>
<%-- divHtml = showAssembly_LineChart_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_BarChart}') {--%>
<%-- divHtml = showAssembly_BarChart_View(data.content, data.showData);--%>
<%-- } else if (data.type == '${Type_Tab}') {--%>
<%-- divHtml = showAssembly_Tab_View(data.content, data.showData);--%>
<%-- // console.log(divHtml)--%>
<%-- $('#' + data.cid + 'contentRelativeDiv').append(divHtml);--%>
<%-- if (data.showTabData != null && data.showTabData.length > 0) {--%>
<%-- for (let i = 0; i < data.showTabData.length; i++) {--%>
<%-- data.showTabData[i].cid = data.cid;--%>
<%-- showAllContent(data.showTabData[i]);--%>
<%-- clearInterval(roundtimeT);--%>
<%-- if (roundtimecontentList != '' && roundtimecontentList.length > 0) {--%>
<%-- let roundtimecontentLists = roundtimecontentList.substring(0, roundtimecontentList.length - 1).split(",");--%>
<%-- roundtimeT = setInterval(function () {--%>
<%-- for (let t = 0; t < roundtimecontentLists.length; t++) {--%>
<%-- if (roundtimecontentLists[t] == roundtimecontentLists[nowTNum - 1]) {--%>
<%-- $("#" + roundtimecontentLists[t]).css('display', 'block');--%>
<%-- } else {--%>
<%-- $("#" + roundtimecontentLists[t]).css('display', 'none');--%>
<%-- }--%>
<%-- }--%>
<%-- if (nowTNum < roundtimecontentLists.length) {--%>
<%-- nowTNum++;--%>
<%-- } else {--%>
<%-- nowTNum = 1;--%>
<%-- }--%>
<%-- }, 5000);--%>
<%-- }--%>
<%-- }--%>
<%-- }--%>
<%-- }--%>
<%-- if (data.type != '${Type_Tab}') {--%>
<%-- $('#' + data.cid + 'contentRelativeDiv').append(divHtml);--%>
<%-- }--%>
<%-- if (data.type == '${Type_SignalPoint}') {--%>
<%-- $("#" + data.content.id).mousedown(function (e) {--%>
<%-- //右键为3--%>
<%-- if (3 == e.which) {--%>
<%-- let eqid = $("#" + data.content.id).attr('eqid');--%>
<%-- if (eqid != '') {--%>
<%-- stopBubbleDefaultEvent();--%>
<%-- $.post(ext.contextPath + '/equipment/doview.do', {id: eqid}, function (data) {--%>
<%-- $("#subDiv").html(data);--%>
<%-- openModal('subModal');--%>
<%-- });--%>
<%-- }--%>
<%-- } else if (1 == e.which) {--%>
<%-- //左键为1--%>
<%-- showCurveForMp(data.content.id);--%>
<%-- }--%>
<%-- })--%>
<%-- }--%>
<%-- if (data.type == '${Type_PieChart}') {--%>
<%-- showPieChart(data.content.id, data.showData, data.showSeriesData);--%>
<%-- } else if (data.type == '${Type_PercentChart}') {--%>
<%-- showPercentChart(data.content.id, data.showData);--%>
<%-- } else if (data.type == '${Type_RadarChart}') {--%>
<%-- showRadarChart(data.content.id, data.showData, data.showSeriesData, data.showAxisData);--%>
<%-- } else if (data.type == '${Type_GaugeChart}') {--%>
<%-- showGaugeChart(data.content.id, data.showData);--%>
<%-- } else if (data.type == '${Type_ProgressBar}') {--%>
<%-- showProgressBarChart(data.content.id, data.showData);--%>
<%-- } else if (data.type == '${Type_PolarCoordinates}') {--%>
<%-- showPolarCoordinates(data.content.id, data.showData, data.showSeriesData);--%>
<%-- } else if (data.type == '${Type_Date}') {--%>
<%-- if (data.content.refreshtime != null && data.content.refreshtime != '' && data.content.refreshtime != '0') {--%>
<%-- setInterval(function () {--%>
<%-- showAssembly_Date_View_Show(data.content.id, data.showData.types);--%>
<%-- }, Number(data.content.refreshtime) * 1000);--%>
<%-- }--%>
<%-- } else if (data.type == '${Type_LineChart}') {--%>
<%-- showLineChart(data.content.id, data.content.refreshtime, data.showData, data.showSeriesData, data.showYAxisData);--%>
<%-- } else if (data.type == '${Type_BarChart}') {--%>
<%-- showBarChart(data.content.id, data.content.refreshtime, data.showData, data.showSeriesData, data.showYAxisData);--%>
<%-- } else if (data.type == '${Type_DateSelect}') {--%>
<%-- let dateSelectType = data.showData.type;--%>
<%-- showDateSelect(data.content.id, dateSelectType);--%>
<%-- }--%>
<%--}--%>
function showContent(containerId, st, containerId2) {
// $('#'+containerId+'contentDiv').html("");
$.ajax({
type: "GET",
url: ext.contextPath + "/process/dataVisualContent/getJson.do?pid=" + containerId,
async: true,
globle: false,
success: function (data) {
var datas = JSON.parse(data);
if (datas != '') {
for (let i = 0; i < datas.length; i++) {
var divHtml = "";
const content = datas[i];
if (content.type == '${Type_SignalPoint}') {
divHtml = showAssembly_mpdata_DI_View(content);
} else if (content.type == '${Type_DataPoint}') {
divHtml = showAssembly_mpdata_AI_View(content);
} else if (content.type == '${Type_Text}') {
divHtml = showAssembly_Text_View(content);
} else if (content.type == '${Type_Camera}') {
divHtml = showAssembly_Camera_View(content);
} else if (content.type == '${Type_Form}') {
divHtml = showAssembly_Form_View(content);
} else if (content.type == '${Type_LineChart}') {
divHtml = showAssembly_LineChart_View(content);
} else if (content.type == '${Type_BarChart}') {
divHtml = showAssembly_BarChart_View(content);
} else if (content.type == '${Type_PercentChart}') {
divHtml = showAssembly_PercentChart_View(content);
} else if (content.type == '${Type_RadarChart}') {
divHtml = showAssembly_RadarChart_View(content);
} else if (content.type == '${Type_PieChart}') {
divHtml = showAssembly_PieChart_View(content);
} else if (content.type == '${Type_Picture}') {
divHtml = showAssembly_Picture_View(content);
} else if (content.type == '${Type_GaugeChart}') {
divHtml = showAssembly_GaugeChart_View(content);
} else if (content.type == '${Type_Date}') {
divHtml = showAssembly_Date_View(content);
} else if (content.type == '${Type_Iframe}') {
divHtml = showAssembly_Iframe_View(content);
} else if (content.type == '${Type_Tab}') {
divHtml = showAssembly_Tab_View(content);
$.ajax({
type: 'GET',
url: ext.contextPath + "/process/dataVisualTab/getJson.do?pid=" + content.id,
async: true,
globle: false,
dataType: 'json',
error: function () {
return false;
},
success: function (tabdata) {
for (let index = 0; index < tabdata.length; index++) {
if (tabdata[index].firstck == 'true') {
showContent(tabdata[index].id, 'tab', containerId2);
$.ajax({
type: "GET",
url: ext.contextPath + "/process/dataVisualContent/getJson.do?pid=" + tabdata[index].id,
async: true,
globle: false,
success: function (data) {
var datas = JSON.parse(data);
if (datas != '') {
for (let i = 0; i < datas.length; i++) {
const content = datas[i];
if (content.type == '${Type_Date}') {
$.ajax({
type: 'GET',
url: ext.contextPath + "/process/dataVisualDate/getJson.do?pid=" + content.id,
async: true,
globle: false,
dataType: 'json',
error: function () {
return false;
},
success: function (dateData) {
if (content.refreshtime != null && content.refreshtime != '' && content.refreshtime != '0') {
setInterval(function () {
showAssembly_Date_View_Show(content.id, dateData[0].types);
}, Number(content.refreshtime) * 1000);
}
}
});
} else {
if (content.type != '${Type_LineChart}' && content.type != '${Type_BarChart}') {
if (content.refreshtime != null && content.refreshtime != '' && content.refreshtime != '0') {
setInterval(function () {
showOneContent(content.id, 'tab');
}, Number(content.refreshtime) * 60000);
}
}
}
}
}
}
});
}
}
}
});
} else if (content.type == '${Type_MpView}') {
divHtml = showAssembly_MpView_View(content);
} else if (content.type == '${Type_ProgressBar}') {
divHtml = showAssembly_ProgressBarChart_View(content);
} else if (content.type == '${Type_Line}') {
divHtml = showAssembly_Line_View(content);
} else if (content.type == '${Type_DateSelect}') {
divHtml = showAssembly_DateSelect_View(content);
} else if (content.type == '${Type_SuspensionFrame}') {
divHtml = showAssembly_SuspensionFrame_View(content);
}
if (st == 'tab') {
$('#' + containerId2 + 'contentRelativeDiv').append(divHtml);
} else {
$('#' + containerId + 'contentRelativeDiv').append(divHtml);
}
if (content.type == '${Type_DateSelect}') {
$.ajax({
type: 'GET',
url: ext.contextPath + "/process/dataVisualDateSelect/getJson.do?pid=" + content.id,
async: false,
globle: false,
dataType: 'json',
error: function () {
return false;
},
success: function (dateSelectData) {
dateSelectData = dateSelectData[0];
let dateSelectType = dateSelectData.type;
showDateSelect(content.id, dateSelectType);
}
});
}
if (content.type == '${Type_LineChart}') {
showLineChart(content.id, content.refreshtime);
} else if (content.type == '${Type_BarChart}') {
showBarChart(content.id, content.refreshtime);
} else if (content.type == '${Type_PercentChart}') {
showPercentChart(content.id);
} else if (content.type == '${Type_RadarChart}') {
showRadarChart(content.id);
} else if (content.type == '${Type_PieChart}') {
showPieChart(content.id);
} else if (content.type == '${Type_GaugeChart}') {
showGaugeChart(content.id);
} else if (content.type == '${Type_ProgressBar}') {
showProgressBarChart(content.id);
} else if (content.type == '${Type_PolarCoordinates}') {
showPolarCoordinates(content.id);
}
if (content.type == '${Type_Date}') {
$.ajax({
type: 'GET',
url: ext.contextPath + "/process/dataVisualDate/getJson.do?pid=" + content.id,
async: true,
globle: false,
dataType: 'json',
error: function () {
return false;
},
success: function (dateData) {
if (content.refreshtime != null && content.refreshtime != '' && content.refreshtime != '0') {
setInterval(function () {
showAssembly_Date_View_Show(content.id, dateData[0].types);
}, Number(content.refreshtime) * 1000);
}
}
});
} else {
if (content.type != '${Type_LineChart}' && content.type != '${Type_BarChart}') {
if (content.refreshtime != null && content.refreshtime != '' && content.refreshtime != '0') {
setInterval(function () {
showOneContent(content.id);
}, Number(content.refreshtime) * 60000);
}
}
}
}
}
}
});
}
function showOneContent(contentId, st) {
$.ajax({
type: "GET",
url: ext.contextPath + "/process/dataVisualContent/getOneJson.do?id=" + contentId,
async: true,
globle: false,
success: function (data) {
let content = JSON.parse(data);
content = content[0];
// console.log(content);
if (content != '') {
let containerId = content.pid;
$('#' + contentId).remove();
let divHtml = "";
if (content.type == '${Type_SignalPoint}') {
divHtml = showAssembly_mpdata_DI_View(content);
} else if (content.type == '${Type_DataPoint}') {
divHtml = showAssembly_mpdata_AI_View(content);
} else if (content.type == '${Type_Text}') {
divHtml = showAssembly_Text_View(content);
} else if (content.type == '${Type_Camera}') {
divHtml = showAssembly_Camera_View(content);
} else if (content.type == '${Type_Form}') {
divHtml = showAssembly_Form_View(content);
} else if (content.type == '${Type_LineChart}') {
divHtml = showAssembly_LineChart_View(content);
} else if (content.type == '${Type_BarChart}') {
divHtml = showAssembly_BarChart_View(content);
} else if (content.type == '${Type_PercentChart}') {
divHtml = showAssembly_PercentChart_View(content);
} else if (content.type == '${Type_RadarChart}') {
divHtml = showAssembly_RadarChart_View(content);
} else if (content.type == '${Type_PieChart}') {
divHtml = showAssembly_PieChart_View(content);
} else if (content.type == '${Type_Picture}') {
divHtml = showAssembly_Picture_View(content);
} else if (content.type == '${Type_GaugeChart}') {
divHtml = showAssembly_GaugeChart_View(content);
} else if (content.type == '${Type_Date}') {
divHtml = showAssembly_Date_View(content);
} else if (content.type == '${Type_Iframe}') {
divHtml = showAssembly_Iframe_View(content);
} else if (content.type == '${Type_Tab}') {
divHtml = showAssembly_Tab_View(content);
} else if (content.type == '${Type_MpView}') {
divHtml = showAssembly_MpView_View(content);
} else if (content.type == '${Type_ProgressBar}') {
divHtml = showAssembly_ProgressBarChart_View(content);
} else if (content.type == '${Type_Line}') {
divHtml = showAssembly_Line_View(content);
} else if (content.type == '${Type_DateSelect}') {
divHtml = showAssembly_DateSelect_View(content);
} else if (content.type == '${Type_SuspensionFrame}') {
divHtml = showAssembly_SuspensionFrame_View(content);
} else if (content.type == '${Type_PolarCoordinates}') {
divHtml = showAssembly_PolarCoordinates_View(content);
} else if (content.type == '${Type_PersonnelPositioning}') {
divHtml = showAssembly_PersonnelPositioning_View(content);
}
// console.log(divHtml);
if (st != null && st == 'tab') {
$.ajax({
type: 'GET',
url: ext.contextPath + "/process/dataVisualTab/getContainer.do?tabId=" + containerId,
async: false,
globle: false,
dataType: 'json',
error: function () {
return false;
},
success: function (contentData) {
contentData = contentData[0];
$('#' + contentData.containerId + 'contentRelativeDiv').append(divHtml);
}
});
} else {
$('#' + containerId + 'contentRelativeDiv').append(divHtml);
}
if (content.type == '${Type_LineChart}') {
showLineChart(content.id, content.refreshtime);
} else if (content.type == '${Type_BarChart}') {
showBarChart(content.id, content.refreshtime);
} else if (content.type == '${Type_PercentChart}') {
showPercentChart(content.id);
} else if (content.type == '${Type_RadarChart}') {
showRadarChart(content.id);
} else if (content.type == '${Type_PieChart}') {
showPieChart(content.id);
} else if (content.type == '${Type_GaugeChart}') {
showGaugeChart(content.id);
} else if (content.type == '${Type_ProgressBar}') {
showProgressBarChart(content.id);
} else if (content.type == '${Type_PolarCoordinates}') {
showPolarCoordinates(content.id);
}
}
}
});
}
function showCurveForMp(contentId) {
$.post(ext.contextPath + '/process/dataVisualMPoint/getJson.do', {pid: contentId}, function (data) {
var mpid = data[0].mpid;
var unitId = data[0].unitid;
$.post(ext.contextPath + '/data/showOnlyLine.do', {mpcode: mpid, unitId: unitId}, function (data2) {
$("#subDiv").html(data2);
openModal('curveModal');
});
}, 'json');
}
function openLine(mpid) {
$.post(ext.contextPath + '/data/showOnlyLine.do', {mpcode: mpid}, function (data2) {
$("#subDiv").html(data2);
openModal('curveModal');
});
}
var viewCameraWindow = null;
function viewCameraFun(id) {
viewCameraWindow = window.open(ext.contextPath + "/work/camera/getCameraJsp.do?id=" + id, 'largeScreenViewCamera', 'width=720,height=480,top=200,left=300,toolbar=0,menubar=0,scrollbars=0,resizable=0,location=0,status=0')
viewCameraWindow.focus();
}
function clickTab(ckid, data) {
stopBubbleDefaultEvent();
let tabContentId = "";
for (let i = 0; i < data.length; i++) {
let tab = data[i];
if (i == 0) {
tabContentId = tab.pid;
}
let ckbackground = 'transparent';
if (tab.ckbackground != null && tab.ckbackground != '') {
ckbackground = tab.ckbackground;
if (ckbackground.indexOf("/") >= 0) {
var path = getRootPath() + ckbackground;
ckbackground = 'url(' + path + ')';
}
}
let ckfontcolor = '#3c8dbc';
if (tab.ckfontcolor != null && tab.ckfontcolor != '') {
ckfontcolor = tab.ckfontcolor;
}
let ckfontsize = '14';
if (tab.ckfontsize != null && tab.ckfontsize != '') {
ckfontsize = tab.ckfontsize;
}
let ckfontweight = '400';
if (tab.ckfontweight != null && tab.ckfontweight != '') {
ckfontweight = tab.ckfontweight;
}
let cktextAlign = 'center';
// if (tab.cktextAlign != null && tab.cktextAlign != '') {
// cktextAlign = tab.cktextAlign;
// }
let ckstyle = '';
if (tab.ckstyle != null && tab.ckstyle != '') {
ckstyle = tab.ckstyle;
}
let unckbackground = 'transparent';
if (tab.unckbackground != null && tab.unckbackground != '') {
unckbackground = tab.unckbackground;
if (unckbackground.indexOf("/") >= 0) {
var path = getRootPath() + unckbackground;
unckbackground = 'url(' + path + ')';
}
}
let unckfontcolor = '#555555';
if (tab.unckfontcolor != null && tab.unckfontcolor != '') {
unckfontcolor = tab.unckfontcolor;
}
let unckfontsize = '14';
if (tab.unckfontsize != null && tab.unckfontsize != '') {
unckfontsize = tab.unckfontsize;
}
let unckfontweight = '400';
if (tab.unckfontweight != null && tab.unckfontweight != '') {
unckfontweight = tab.unckfontweight;
}
let uncktextAlign = 'center';
// if (tab.uncktextAlign != null && tab.uncktextAlign != '') {
// uncktextAlign = tab.uncktextAlign;
// }
let unckstyle = '';
if (tab.unckstyle != null && tab.unckstyle != '') {
unckstyle = tab.unckstyle;
}
if (tab.id == ckid) {
$('#' + tab.id).css('background', ckbackground);
$('#' + tab.id).css('background-size', "100% 100%");
$('#' + tab.id).css('color', ckfontcolor);
$('#' + tab.id).css('font-size', ckfontsize + "px");
$('#' + tab.id).css('font-weight', ckfontweight);
} else {
$('#' + tab.id).css('background', unckbackground);
$('#' + tab.id).css('background-size', "100% 100%");
$('#' + tab.id).css('color', unckfontcolor);
$('#' + tab.id).css('font-size', unckfontsize + "px");
$('#' + tab.id).css('font-weight', unckfontweight);
}
$.ajax({
type: "GET",
url: ext.contextPath + "/process/dataVisualContent/getIdsForAllTabContent.do?pid=" + tab.id,
async: false,
globle: false,
success: function (data) {
data = data.split(',');
for (let t = 0; t < (data.length - 1); t++) {
const element = data[t];
// console.log(element)
$('#' + element).remove();
}
}
});
}
$.ajax({
type: "GET",
url: ext.contextPath + "/process/dataVisualContent/getTabAllJson.do?tabId=" + tabContentId + "&ckTabId=" + ckid + "&sdt=" + sdt + "&edt=" + edt,
async: false,
globle: false,
dataType: 'json',
success: function (datas) {
console.log(datas)
if (datas != '') {
for (let i = 0; i < datas.length; i++) {
const data = datas[i];
showAllContent(data);
}
}
// data = data.split(',');
// for (let t = 0; t < (data.length - 1); t++) {
// const element = data[t];
// showOneContent(element, 'tab');
// }
}
});
clearInterval(roundtimeT);
if (roundtimecontentList != '' && roundtimecontentList.length > 0) {
let roundtimecontentLists = roundtimecontentList.substring(0, roundtimecontentList.length - 1).split(",");
roundtimeT = setInterval(function () {
for (let t = 0; t < roundtimecontentLists.length; t++) {
if (roundtimecontentLists[t] == roundtimecontentLists[nowTNum - 1]) {
$("#" + roundtimecontentLists[t]).css('display', 'block');
} else {
$("#" + roundtimecontentLists[t]).css('display', 'none');
}
}
if (nowTNum < roundtimecontentLists.length) {
nowTNum++;
} else {
nowTNum = 1;
}
}, 5000);
}
}
function getRootPath() {
// var pathName = window.location.pathname.substring(1);
// var webName = pathName == '' ? '' : pathName.substring(0, pathName.indexOf('/'));
// return window.location.protocol + '//' + window.location.host;
return window.location.protocol;
}
function reFrame(url) {
window.location.href = ext.contextPath + url;
}
function openFrame(id) {
$.ajax({
type: 'GET',
url: ext.contextPath + "/process/dataVisualFrame/getFrame.do?id=" + id,
async: false,
globle: false,
dataType: 'json',
error: function () {
return false;
},
success: function (fdata) {
window.open(ext.contextPath + "/process/dataVisualFrame/view.do?frameId=" + id + "&unitId=" + fdata.unitId, 'openFrame', 'width=' + (window.screen.availWidth / 2) + ',height=' + (window.screen.availHeight / 2) + ',top=0,left=0,toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no')
}
});
// $('#url').html(window.location.host + ext.contextPath + "/process/dataVisualFrame/view.do?frameId="+id+"&unitId=" + ckunitId)
}
function tabFrame(id) {
$.ajax({
type: 'GET',
url: ext.contextPath + "/process/dataVisualFrame/getFrame.do?id=" + id,
async: false,
globle: false,
dataType: 'json',
error: function () {
return false;
},
success: function (fdata) {
let tabId = "tabId_" + id;
let url = "/process/dataVisualFrame/view.do?frameId=" + id + "&unitId=" + fdata.unitId;
window.parent.addTab(tabId, fdata.name, url);
}
});
}
function urlClick(st, url, id, name) {
if (url.substring(0, 1) != '/') {
url = "/" + url;
}
if (st == 'openFrame') {
window.open(ext.contextPath + url, 'openFrame', 'width=' + (window.screen.availWidth / 2) + ',height=' + (window.screen.availHeight / 2) + ',top=0,left=0,toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no')
} else if (st == 'tabFrame') {
let tabId = "tabId_" + id;
window.parent.addTab(tabId, name, url);
}
}
function showRoundtimeOne(id, st) {
let roundtimecontentLists = roundtimecontentList.substring(0, roundtimecontentList.length - 1).split(",");
if (st == 'in') {
clearInterval(roundtimeT);
for (let t = 0; t < roundtimecontentLists.length; t++) {
if (roundtimecontentLists[t] == id) {
$("#" + roundtimecontentLists[t]).css('display', 'block');
} else {
$("#" + roundtimecontentLists[t]).css('display', 'none');
}
}
} else if ('out') {
roundtimeT = setInterval(function () {
for (let t = 0; t < roundtimecontentLists.length; t++) {
if (roundtimecontentLists[t] == roundtimecontentLists[nowTNum - 1]) {
$("#" + roundtimecontentLists[t]).css('display', 'block');
} else {
$("#" + roundtimecontentLists[t]).css('display', 'none');
}
}
if (nowTNum < roundtimecontentLists.length) {
nowTNum++;
} else {
nowTNum = 1;
}
}, 2000);
}
}
</script>
</head>
<body id="bodyId" style="overflow: auto;background-color: transparent;">
<div id="subDiv"></div>
<div id="alertDiv"></div>
<div id="fileInputDiv"></div>
<div id="contentDiv" style="position:relative;"></div>
<!-- <div id="showFrame" ondrop="drop(event)" ondragover="allowDrop(event)"></div> -->
<div id="outFrame">
<div id="showFrame"></div>
</div>
</body>
</html>