200 lines
7.7 KiB
Plaintext
200 lines
7.7 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"%>
|
|||
|
|
<!DOCTYPE html>
|
|||
|
|
<!-- <html lang="zh-CN"> -->
|
|||
|
|
<!-- BEGIN HEAD -->
|
|||
|
|
|
|||
|
|
<head>
|
|||
|
|
<title>大屏</title>
|
|||
|
|
<style>
|
|||
|
|
/* #subModal {
|
|||
|
|
left: 50%;
|
|||
|
|
top: 50%;
|
|||
|
|
transform: translate(-50%, -50%);
|
|||
|
|
min-width: 80%;
|
|||
|
|
overflow: visible;
|
|||
|
|
bottom: inherit;
|
|||
|
|
right: inherit;
|
|||
|
|
} */
|
|||
|
|
</style>
|
|||
|
|
<!-- 引用页头及CSS页-->
|
|||
|
|
<jsp:include page="/jsp/incVisual.jsp"></jsp:include>
|
|||
|
|
|
|||
|
|
<script type="text/javascript">
|
|||
|
|
//获取url地址根目录 当前taomcat下路径
|
|||
|
|
function getRootPath(){
|
|||
|
|
var pathName = window.location.pathname.substring(1);
|
|||
|
|
// var webName = pathName == '' ? '' : pathName.substring(0, pathName.indexOf('/'));
|
|||
|
|
return window.location.protocol + '//' + window.location.host;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function createPage(planId) {
|
|||
|
|
destroyIframe();
|
|||
|
|
$("#layout").html("");//先清空
|
|||
|
|
$("#Start").hide();
|
|||
|
|
$("#Show").show();
|
|||
|
|
$.post(ext.contextPath + '/plan/getPlanWholeInfo.do', { planId: planId }, function (data) {
|
|||
|
|
//console.log("tbheight", document.getElementById("layout").offsetHeight);
|
|||
|
|
//背景赋色
|
|||
|
|
document.getElementById('layout').style.backgroundColor = data[0].backgroundColor;
|
|||
|
|
//背景图
|
|||
|
|
$('#layout').css("background","url("+getRootPath()+""+data[0].image+") no-repeat");
|
|||
|
|
$('#layout').css("background-size","contain");
|
|||
|
|
//生成框架
|
|||
|
|
var rowno = 0;
|
|||
|
|
var $tr = $('');
|
|||
|
|
var layoutList = data[0].planLayout;
|
|||
|
|
// console.log(layoutList);
|
|||
|
|
for (var i = 0; i < layoutList.length; i++) {
|
|||
|
|
if (layoutList[i].layoutDetail.rowno == rowno) {
|
|||
|
|
//添加td
|
|||
|
|
if (layoutList[i].jspCode != "" && layoutList[i].jspCode != undefined) {
|
|||
|
|
var $td = $('<td id="'+layoutList[i].jspCode+'" width="' + layoutList[i].width + '%" colspan="' + layoutList[i].layoutDetail.colspan + '" rowspan = "' + layoutList[i].layoutDetail.rowspan
|
|||
|
|
+ '"></td>');
|
|||
|
|
$tr.append($td);
|
|||
|
|
} else {
|
|||
|
|
var $td = $('<td width="' + layoutList[i].width + '%" colspan="' + layoutList[i].layoutDetail.colspan + '" rowspan = "' + layoutList[i].layoutDetail.rowspan
|
|||
|
|
+ '"></td>');
|
|||
|
|
$tr.append($td);
|
|||
|
|
}
|
|||
|
|
} else if (layoutList[i].layoutDetail.rowno > rowno) {
|
|||
|
|
//大于表示要换行 将原来tr添加到table
|
|||
|
|
if (i != 0) {
|
|||
|
|
$("#layout").append($tr);
|
|||
|
|
}
|
|||
|
|
//生成新tr
|
|||
|
|
rowno = layoutList[i].layoutDetail.rowno;
|
|||
|
|
var miniHeight = 0;
|
|||
|
|
for (var j = 0; j < layoutList.length; j++) {
|
|||
|
|
if (layoutList[j].layoutDetail.rowno == rowno) {
|
|||
|
|
if (miniHeight == 0) {
|
|||
|
|
miniHeight = layoutList[j].height;//此行号第一条先默认miniHeigth
|
|||
|
|
} else {
|
|||
|
|
if (miniHeight < layoutList[j].height) {
|
|||
|
|
miniHeight = layoutList[j].height;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
$tr = $('<tr height="' + miniHeight + '%"></tr>');
|
|||
|
|
// console.log(layoutHeight);
|
|||
|
|
// console.log(miniHeight);
|
|||
|
|
//以及此行第一个td
|
|||
|
|
if (layoutList[i].jspCode != "" && layoutList[i].jspCode != undefined) {
|
|||
|
|
// var iframeHeight=layoutHeight*(miniHeight/100);
|
|||
|
|
// console.log(layoutHeight);
|
|||
|
|
// console.log(miniHeight);
|
|||
|
|
// console.log(iframeHeight);
|
|||
|
|
var $td = $('<td id="'+layoutList[i].jspCode+'" width="' + layoutList[i].width + '%" colspan="' + layoutList[i].layoutDetail.colspan + '" rowspan = "' + layoutList[i].layoutDetail.rowspan
|
|||
|
|
+ '"></td>');
|
|||
|
|
$tr.append($td);
|
|||
|
|
} else {
|
|||
|
|
var $td = $('<td width="' + layoutList[i].width + '%" colspan="' + layoutList[i].layoutDetail.colspan + '" rowspan = "' + layoutList[i].layoutDetail.rowspan
|
|||
|
|
+ '"></td>');
|
|||
|
|
$tr.append($td);
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
$("#layout").append($tr);//最后一次添加tr
|
|||
|
|
|
|||
|
|
for (var i = 0; i < layoutList.length; i++) {
|
|||
|
|
var jspCode=layoutList[i].jspCode;
|
|||
|
|
$.ajax({
|
|||
|
|
type:'GET',
|
|||
|
|
url:ext.contextPath +"/visualjsp/openJspCode.do?jspCode="+jspCode+"&backgroundColor="+ data[0].backgroundColor.replace(/\#/g, "")+ "&planLayoutId="+ layoutList[i].id +"&videoType=switch",
|
|||
|
|
async: false,
|
|||
|
|
globle:false,
|
|||
|
|
error: function(){
|
|||
|
|
return false;
|
|||
|
|
},
|
|||
|
|
success: function(data){
|
|||
|
|
$("#"+jspCode+"").html(data);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
}, 'json');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
var layoutHeight="";
|
|||
|
|
//websocket触发换屏
|
|||
|
|
$(document).ready(function () {
|
|||
|
|
$.post(ext.contextPath + '/plan/getPlanById.do', { id: '${planId}' }, function (data) {
|
|||
|
|
// console.log(data);
|
|||
|
|
layoutHeight=data[0].height;
|
|||
|
|
$("#pageBody").height(data[0].height);
|
|||
|
|
$("#pageBody").width(data[0].width);
|
|||
|
|
if(data[0].backgroundColor=='transparent'){
|
|||
|
|
$("#pageBody").css('backgroundColor',data[0].backgroundColor);
|
|||
|
|
}else{
|
|||
|
|
$("#pageBody").css('backgroundColor',"#" +data[0].backgroundColor);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
createPage('${planId}');
|
|||
|
|
},'json');
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
//获取url地址根目录 当前taomcat下路径
|
|||
|
|
function getRootPath(){
|
|||
|
|
var pathName = window.location.pathname.substring(1);
|
|||
|
|
// var webName = pathName == '' ? '' : pathName.substring(0, pathName.indexOf('/'));
|
|||
|
|
return window.location.protocol + '//' + window.location.host;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function numOutput(num){
|
|||
|
|
var numpart=String(num).split(".");//将数字通过jq split用小数点分隔为数组对象
|
|||
|
|
numpart[0]=numpart[0].replace(new RegExp('(\\d)(?=(\\d{3})+$)','ig'),"$1,");
|
|||
|
|
//将数组对象第一个数据(整数部分)通过正则表达式每三位用逗号分隔
|
|||
|
|
return numpart.join(".");//把数组通过join方法用.进行拼接
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//根据屏幕自定义字体大小（1920下）
|
|||
|
|
function fontSize(res){
|
|||
|
|
let docEl = document.documentElement,
|
|||
|
|
clientWidth = window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth;
|
|||
|
|
if (!clientWidth) return;
|
|||
|
|
let fontSize = 100 * (clientWidth / 1920);
|
|||
|
|
return res*fontSize;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function fontWidth(res){
|
|||
|
|
let docEl = document.documentElement,
|
|||
|
|
clientWidth = window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth;
|
|||
|
|
if (!clientWidth) return;
|
|||
|
|
let fontWidth = (clientWidth*res) / 1920;
|
|||
|
|
return fontWidth;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function showHis(mpcode,unitId){
|
|||
|
|
$.post(ext.contextPath + '/data/showOnlyLine.do', {mpcode:mpcode,unitId:unitId} , function(data) {
|
|||
|
|
$("#subDiv").html(data);
|
|||
|
|
openModal('curveModal');
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function showHisEnd(mpcode,unitId){
|
|||
|
|
$.post(ext.contextPath + '/data/showOnlyLine.do', {mpcode:mpcode,unitId:unitId} , function(data) {
|
|||
|
|
$("#endsubDiv").html(data);
|
|||
|
|
openModal('curveModal');
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
</head>
|
|||
|
|
|
|||
|
|
<body id="pageBody" style="margin:0;padding:0;overflow-x:auto;overflow-y:auto;">
|
|||
|
|
<div id="topsubDiv"></div>
|
|||
|
|
<div id="subDiv"></div>
|
|||
|
|
<div style="width:100%;height:100%;margin:0;padding:0;display: none;" id="Show">
|
|||
|
|
<table id="layout" style="overflow: hidden;width:100%;height:100%;">
|
|||
|
|
|
|||
|
|
</table>
|
|||
|
|
</div>
|
|||
|
|
</body>
|
|||
|
|
</html>
|