Files
SIPAIIS_WMS_JSSW/WebRoot/jsp/work/scadapic/processView.jsp

2095 lines
82 KiB
Plaintext
Raw Permalink Normal View History

2026-01-16 14:13:44 +08:00
<%@ 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"%>
<%@page import="com.sipai.entity.scada.ScadaAlarm"%>
<%@page import="com.sipai.entity.work.ScadaPic_Txt"%>
<%@page import="com.sipai.entity.work.ScadaPic"%>
<%@page import="com.sipai.entity.equipment.EquipmentCard"%>
<%@page import="com.sipai.entity.maintenance.MaintenanceDetail"%>
<%@page import="com.sipai.entity.maintenance.MaintenanceCommString"%>
<%@page import="com.sipai.entity.work.KPIPointProfessor"%>
<%@page import="com.sipai.entity.work.ProAlarm"%>
<% request.setAttribute("Type_scadapic_ps", ScadaPic.Type_scadapic_ps); %>
<% request.setAttribute("Status_N", ProAlarm.Status_N); %>
<% request.setAttribute("Status_C", ProAlarm.Status_C); %>
<% request.setAttribute("Status_Y", ProAlarm.Status_Y); %>
<%@page import="java.util.Date"%>
<%@page import="java.text.SimpleDateFormat"%>
<%@ page import="com.sipai.tools.SessionManager"%>
<%
SessionManager sessionManager = new SessionManager();
%>
<%
request.setAttribute("Flag_Txt", ScadaPic_Txt.Flag_Txt);
%>
<%
request.setAttribute("Flag_MPoint", ScadaPic_Txt.Flag_MPoint);
%>
<%
request.setAttribute("Flag_EM", ScadaPic_Txt.Flag_EM);
%>
<%
request.setAttribute("Flag_PS", ScadaPic_Txt.Flag_PS);
%>
<%
request.setAttribute("Type_Prime", ScadaPic_Txt.Type_Prime);
%>
<%
request.setAttribute("Type_Detail", ScadaPic_Txt.Type_Detail);
%>
<%
request.setAttribute("Status_Start", MaintenanceDetail.Status_Start);
%>
<%
request.setAttribute("Status_Finish",
MaintenanceDetail.Status_Finish);
%>
<%
request.setAttribute("MAINTENANCE_TYPE_REPAIR",
MaintenanceCommString.MAINTENANCE_TYPE_REPAIR);
%>
<%
request.setAttribute("Status_Fault", EquipmentCard.Status_Fault);
%>
<%
request.setAttribute("Status_OFF", EquipmentCard.Status_OFF);
%>
<%
request.setAttribute("Status_ON", EquipmentCard.Status_ON);
%>
<%-- <%
request.setAttribute("Status_StandBy", EquipmentCard.Status_StandBy);
%>
<%
request.setAttribute("Status_UnMatch",
EquipmentCard.Status_UnMatch);
%> --%>
<%
request.setAttribute("Type_scadapic_brief",
ScadaPic.Type_scadapic_brief);
%>
<%
request.setAttribute("Type_scadapic_detail",
ScadaPic.Type_scadapic_detail);
%>
<%
request.setAttribute("STATUS_ALARM", ScadaAlarm.STATUS_ALARM);
%>
<%
request.setAttribute("STATUS_ALARM_CONFIRM", ScadaAlarm.STATUS_ALARM_CONFIRM);
%>
<%
request.setAttribute("STATUS_ALARM_RECOVER", ScadaAlarm.STATUS_ALARM_RECOVER);
%>
<%
request.setAttribute("Flag_Yes", KPIPointProfessor.Flag_Yes);
%>
<%
request.setAttribute("Flag_No", KPIPointProfessor.Flag_No);
%>
<!DOCTYPE html>
<!-- <html lang="zh-CN"> -->
<!-- BEGIN HEAD -->
<head>
<title><%=ServerObject.atttable.get("TOPTITLE")%></title>
<!-- 引用页头及CSS页-->
<jsp:include page="/jsp/inc.jsp"></jsp:include>
<link rel="stylesheet" href="<%=request.getContextPath()%>/plugins/toastr/toastr.min.css"/>
<style type="text/css">
.main-container::-webkit-scrollbar {/*滚动条整体样式*/
width: 0; /*高宽分别对应横竖滚动条的尺寸*/
}
#toast-container>.toast-success{
background-image: url(data:image/png;base64,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) !important;
}
</style>
<script type="text/javascript">
// 兼容IE11 Array.from方法
// Production steps of ECMA-262, Edition 6, 22.1.2.1
if (!Array.from) {
Array.from = (function () {
var toStr = Object.prototype.toString;
var isCallable = function (fn) {
return typeof fn === 'function' || toStr.call(fn) === '[object Function]';
};
var toInteger = function (value) {
var number = Number(value);
if (isNaN(number)) { return 0; }
if (number === 0 || !isFinite(number)) { return number; }
return (number > 0 ? 1 : -1) * Math.floor(Math.abs(number));
};
var maxSafeInteger = Math.pow(2, 53) - 1;
var toLength = function (value) {
var len = toInteger(value);
return Math.min(Math.max(len, 0), maxSafeInteger);
};
// The length property of the from method is 1.
return function from(arrayLike/*, mapFn, thisArg */) {
// 1. Let C be the this value.
var C = this;
// 2. Let items be ToObject(arrayLike).
var items = Object(arrayLike);
// 3. ReturnIfAbrupt(items).
if (arrayLike == null) {
throw new TypeError('Array.from requires an array-like object - not null or undefined');
}
// 4. If mapfn is undefined, then let mapping be false.
var mapFn = arguments.length > 1 ? arguments[1] : void undefined;
var T;
if (typeof mapFn !== 'undefined') {
// 5. else
// 5. a If IsCallable(mapfn) is false, throw a TypeError exception.
if (!isCallable(mapFn)) {
throw new TypeError('Array.from: when provided, the second argument must be a function');
}
// 5. b. If thisArg was supplied, let T be thisArg; else let T be undefined.
if (arguments.length > 2) {
T = arguments[2];
}
}
// 10. Let lenValue be Get(items, "length").
// 11. Let len be ToLength(lenValue).
var len = toLength(items.length);
// 13. If IsConstructor(C) is true, then
// 13. a. Let A be the result of calling the [[Construct]] internal method
// of C with an argument list containing the single item len.
// 14. a. Else, Let A be ArrayCreate(len).
var A = isCallable(C) ? Object(new C(len)) : new Array(len);
// 16. Let k be 0.
var k = 0;
// 17. Repeat, while k < len… (also steps a - h)
var kValue;
while (k < len) {
kValue = items[k];
if (mapFn) {
A[k] = typeof T === 'undefined' ? mapFn(kValue, k) : mapFn.call(T, kValue, k);
} else {
A[k] = kValue;
}
k += 1;
}
// 18. Let putStatus be Put(A, "length", len, true).
A.length = len;
// 20. Return A.
return A;
};
}());
}
</script>
<script type="text/javascript">
var beginTimeStore1 = '';
var endTimeStore1 = '';
var companyId = "";
var processSectionId = "";//底图id
var processid ="";//工艺段id
var selectionIds = []; //保存选中ids
function initDate1() {
//定义locale汉化插件
beginTimeStore1 = moment().subtract(6, 'days').format('YYYY-MM-DD');;
endTimeStore1 = moment().subtract(-1, 'days').format('YYYY-MM-DD');
/* if(${param.sdt!=''}){
beginTimeStore1='2018-08-09';
}
if(${param.edt!=''}){
endTimeStore1='2018-08-10';
} */
var locale = {
"format": 'YYYY-MM-DD',
"separator": " ~ ",
"applyLabel": "确定",
"cancelLabel": "取消",
"fromLabel": "起始时间",
"toLabel": "结束时间'",
"customRangeLabel": "自定义",
"weekLabel": "W",
"daysOfWeek": ["日", "一", "二", "三", "四", "五", "六"],
"monthNames": ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
"firstDay": 1
};
$('#reservationtime1').daterangepicker({
"timePicker": false,
"timePicker24Hour": false,
"linkedCalendars": false,
"autoUpdateInput": false,
"timePickerIncrement": 10,
"locale": locale,
//汉化按钮部分
ranges: {
'今日': [moment(), moment().subtract(-1, 'days')],
'昨日': [moment().subtract(1, 'days'), moment()],
'最近7日': [moment().subtract(6, 'days'), moment().subtract(-1, 'days')],
'本月': [moment().startOf('month'), moment().endOf('month').subtract(-1, 'days')],
'上月': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month').subtract(-1, 'days')]
},
startDate: beginTimeStore1,
endDate: endTimeStore1
}, function(start, end, label) {
beginTimeStore1 = start.format(this.locale.format);
endTimeStore1 = end.format(this.locale.format);
if(!this.startDate){
this.element.val('');
}else{
this.element.val(this.startDate.format(this.locale.format) + this.locale.separator + this.endDate.format(this.locale.format));
}
});
$('#reservationtime1').val(beginTimeStore1 + locale.separator + endTimeStore1);
};
var beginTimeStore2 = '';
var endTimeStore2 = '';
function initDate2() {
//定义locale汉化插件
beginTimeStore2 = moment().subtract(1, 'month').format('YYYY-MM-DD');
endTimeStore2 = moment().subtract(0, 'month').format('YYYY-MM-DD');
// if(${param.sdt!=''}){
// beginTimeStore2='2019-01-01';
// }
// if(${param.edt!=''}){
// endTimeStore2='2019-01-01';
// }
var locale = {
"format": 'YYYY-MM-DD',
"separator": " ~ ",
"applyLabel": "确定",
"cancelLabel": "取消",
"fromLabel": "起始时间",
"toLabel": "结束时间'",
"customRangeLabel": "自定义",
"weekLabel": "W",
"daysOfWeek": ["日", "一", "二", "三", "四", "五", "六"],
"monthNames": ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
"firstDay": 1
};
$('#reservationtime2').daterangepicker({
"timePicker": false,
"timePicker24Hour": false,
"linkedCalendars": false,
"autoUpdateInput": false,
"timePickerIncrement": 10,
"locale": locale,
//汉化按钮部分
ranges: {
'今日': [moment(), moment().subtract(-1, 'days')],
'昨日': [moment().subtract(1, 'days'), moment()],
'最近7日': [moment().subtract(6, 'days'), moment().subtract(-1, 'days')],
'本月': [moment().startOf('month'), moment().endOf('month').subtract(-1, 'days')],
'上月': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month').subtract(-1, 'days')]
},
startDate: beginTimeStore2,
endDate: endTimeStore2
}, function(start, end, label) {
beginTimeStore2 = start.format(this.locale.format);
endTimeStore2 = end.format(this.locale.format);
if(!this.startDate){
this.element.val('');
}else{
this.element.val(this.startDate.format(this.locale.format) + this.locale.separator + this.endDate.format(this.locale.format));
}
});
$('#reservationtime2').val(beginTimeStore2 + locale.separator + endTimeStore2);
//$('#reservationtime2').val(beginTimeStore2 + locale.separator + endTimeStore2);
//$('#reservationtime2').daterangepicker({autoUpdateInput:false})
};
var myChart;
function dochart(psid){
//$.post(ext.contextPath +"/maintenance/getStaffMaintenanceResultView.do",{userId:"${param.userId}",sdt:beginTimeStore1,edt:endTimeStore1},function(data){
// var posList = [
// 'left', 'right', 'top', 'bottom',
// 'inside',
// 'insideTop', 'insideLeft', 'insideRight', 'insideBottom',
// 'insideTopLeft', 'insideTopRight', 'insideBottomLeft', 'insideBottomRight'
// ];
// unitId: unitId,
// pSectionId: processid,
// beginTimeStore:beginTimeStore2,
// endTimeStore:endTimeStore2
$.post(ext.contextPath +"/work/proAlarm/getAlarmNumber.do",{unitId:unitId,sdt:beginTimeStore2,edt:endTimeStore2,pSectionId:psid},function(data){
var num=[];
var num_recover=[];
var p_name=[];
var res= eval('(' + data + ')');
// console.log('res:'+data);
$('#myTab li a[data-toggle="tab"]').on('show.bs.tab',function(e){
if($(e.target).context.hash === '#tab3'&&res.length>0) {
getCamerasDetail(res[0].id);
} else {
$('#camerasFrame').html('');
}
});
for(var i=0;i<res.length;i++){
p_name.push(res[i].p_name);
num.push(res[i].num);
num_recover.push(res[i].num_recover);
}
option = {
color: ['#3c8dbc', '#5bc0de'],
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
legend: {
data: ['报警总数量', '已解除报警量']
},
/* toolbox: {
show: true,
orient: 'vertical',
left: 'right',
top: 'center',
feature: {
mark: {show: true},
dataView: {show: true, readOnly: false},
magicType: {show: true, type: ['line', 'bar', 'stack', 'tiled']},
restore: {show: true},
saveAsImage: {show: true}
}
}, */
calculable: true,
xAxis: [
{
type: 'category',
axisTick: {show: false},
data: p_name,
axisLabel: {
rotate: 340//横坐标倾斜角度
}
}
],
yAxis: [
{
type: 'value'
// min:0,
// max:10
}
],
series: [
{
name: '报警总数量',
type: 'bar',
barGap: 0,
//label: labelOption,
data: num
},
{
name: '已解除报警量',
type: 'bar',
//label: labelOption,
data: num_recover
}
]
};
if(myChart!=null){
myChart.clear();
myChart.dispose();
}
//var boxHeight=legendData.length*200;
var boxHeight=450;
var boxWidth=$("#tab6").width();
$("#box").height(boxHeight);
$("#box").width(boxWidth*0.45);
/* var boxWidth=$("#boxdiv").width();
$("#box").height(boxHeight);
$("#box").width(boxWidth); */
setTimeout(function(){
myChart = echarts.init(document.getElementById("box"));
//自适用大小
//用于使chart自适应高度和宽度
//window.onresize=myChart.resize;
myChart.setOption(option);
},100);
});
}
var addFun = function() {
$.post(ext.contextPath + '/process/add.do', {} , function(data) {
$("#subDiv").html(data);
openModal('subModal');
});
};
var editFun = function(id) {
initDate1();
$.post(ext.contextPath + '/work/kpipoint/showchart.do', {companyId:unitId,ids:id,sdt:beginTimeStore1,edt:endTimeStore1} , function(data) {
$("#subDiv").html(data);
openModal('subModal');
});
};
var viewFun = function(flag,mpid) {
if(flag=='${Flag_Yes}'){
$.post(ext.contextPath + '/work/KPIPro/view.do', {companyId:unitId,mpid:mpid} , function(data) {
$("#subDiv").html(data);
openModal('subModal1');
});
}else{
swal('暂无建议');
}
//swal('系统升级中');
};
var viewEqu = function(id) {
$.post(ext.contextPath + '/equipment/doview.do', {id:id} , function(data) {
$("#subDiv").html(data);
openModal('subModal');
});
};
var deleteFun = function(id) {
swal({
text: "您确定要删除此记录?",
dangerMode: true,
buttons: {
cancel: {
text: "取消",
value: null,
visible: true,
className: "btn btn-default btn-sm",
closeModal: true,
},
confirm: {
text: "确定",
value: true,
visible: true,
className: "btn btn-danger btn-sm",
closeModal: true
}
}
})
.then(function(willDelete){
if (willDelete) {
$.post(ext.contextPath + '/process/delete.do', {id : id}, function(data) {
if(data==1){
$("#table").bootstrapTable('refresh');
}else{
showAlert('d','删除失败','mainAlertdiv');
}
});
}
});
};
var deletesFun = function() {
var checkedItems = $("#table").bootstrapTable('getSelections');
var datas="";
$.each(checkedItems, function(index, item){
datas+=item.id+",";
});
if(datas==""){
showAlert('d','请先选择记录','mainAlertdiv');
}else{
swal({
text: "您确定要删除此记录?",
dangerMode: true,
buttons: {
cancel: {
text: "取消",
value: null,
visible: true,
className: "btn btn-default btn-sm",
closeModal: true,
},
confirm: {
text: "确定",
value: true,
visible: true,
className: "btn btn-danger btn-sm",
closeModal: true
}
}
})
.then(function(willDelete) {
if (willDelete) {
$.post(ext.contextPath + '/process/deletes.do', {ids:datas} , function(data) {
if(data>0){
$("#table").bootstrapTable('refresh');
}else{
showAlert('d','删除失败','mainAlertdiv');
}
});
}
});
}
};
var init = function() {
$('#myTab a[href="#tab1"]').tab('show');
var Width = window.innerWidth;
var Height = window.innerHeight;
//window.onresize = changesize;
/* $.post(ext.contextPath + "/user/getSearchBizsByUserId4Select.do", {}, function(data) {
if(data.length == 1){
//选择厂区为一个厂时隐藏选择框
$("#search_code").css("display", "none");
$("#company").text(data[0].text);
companyId=data[0].id;
dosearch();
}else{
$("#company").css("display", "none");
var selelct=$("#search_code").select2({
data : data ,
placeholder:'请先选择水厂',//默认文字提示
allowClear: true,//允许清空
escapeMarkup: function (markup) { return markup; }, // 自定义格式化防止xss注入
language: "zh-CN",
minimumInputLength: 0,
minimumResultsForSearch: 10,//数据超过十个启用搜索框
formatResult: function formatRepo(repo){return repo.text;}, // 函数用来渲染结果
formatSelection: function formatRepoSelection(repo){return repo.text;} // 函数用于呈现当前的选择
});
$(".select2-selection--single").css({'height':'30px','paddingTop':'4px'})
selelct.val('').trigger("change");
refreshSelect();
selelct.on("change",function(e){
companyId= $(this).val();
dosearch();
});
}
},'json'); */
////////////////////////////////////////////////////////////////////////////
//简易公司combotree
// $.post(ext.contextPath + '/user/getUnitForTree.do', { ng: '' }, function (data) {
// if (data.length == 1 && !data[0].hasOwnProperty("nodes")) {
// //当登陆者的pid以下没有子节点时显示单独一个span
// $("#search_code").val(data[0].id);
// $("#companyselect").hide();
// $("#company").text("公司: " + data[0].text);
// companyId = data[0].id;
// dosearch();
// //initFun();
// } else if ((data.length == 1 && data.nodes != "") || data.length > 1) {
// //第一次加载时赋值
// $("#search_code").val(data[0].id);
// $("#cname_input").val(data[0].text);
// companyId = data[0].id;
// dosearch();
// //initFun();
// //$table.bootstrapTable('refresh');//异步加载重新刷新,待修改
// $('#companytree').treeview({
// data: data,
// showBorder: false,
// levels: 3,
// });
// $('#companytree').on('nodeSelected', function (event, data) {
// $("#search_code").val(data.id);
// $("#cname_input").val(data.text);
// document.getElementById('ul_tree').style.display = "none";
// companyId= data.id;
// dosearch();
// //initFun();
// });
// } else {
// //待完善
// };
// }, 'json');
dosearch();
//防止点击树的+号收起下拉框
$("#ul_tree").on("click", function (e) {
event.stopPropagation();
});
//点击空白隐藏树
$(document).click(function (e) {
var divTree = $('#ul_tree'); // 设置目标区域
if (!divTree.is(e.target) && divTree.has(e.target).length === 0) {
divTree.hide()
}
})
};
var dosearch = function() {
var contentdiv=$("#content");
$.post(ext.contextPath + "/work/scadaPic/getlist4Combo.do", {companyId:unitId,type:'${Type_scadapic_brief}'}, function(data) {
var res= JSON.parse(data);
// console.log(res);
$("#table").bootstrapTable('refresh');
$("#table1").bootstrapTable('refresh');
$("#table2").bootstrapTable('refresh');
$("#table3").bootstrapTable('refresh');
//console.info(processSectionId);
// console.info(res.length);
if(res.length==0){
processSectionId='';
$("#img").attr("src","");
$("#tab2_img").attr("src","");
showMPoint();
showEM();
showPS();
showTxt();
}else{
processSectionId = res[0].id;
showMPoint();
showEM();
showPS();
showTxt();
$("#img").attr("src",ext.serverPath + res[0].picpath);
//$("#tab2_img").attr("src",ext.serverPath + res[i].picpath);
$.post(ext.contextPath + "/work/scadaPic/getlist4Combo.do", {companyId:unitId,type:'${Type_scadapic_ps}'}, function(data) {
var res= JSON.parse(data);
// console.log("cb",res);
$("#tab2_img").attr("src",ext.serverPath + res[0].picpath);
showTabMPoint(res[0].id);
showTabPS(res[0].id);
showTabTxt(res[0].id);
showTabEM(res[0].id);
});
}
});
dochart();
};
function showdetail(psid) {
selectionIds=[];
$("#table").bootstrapTable('refresh');
$("#table1").bootstrapTable('refresh');
$("#table2").bootstrapTable('refresh');
$("#table3").bootstrapTable('refresh');
var contentdiv=$("#content");
//$("#tab2_img").attr("height",contentdiv.height());
$.post(ext.contextPath + "/work/scadaPic/getlist4Combo.do", {companyId:unitId,pSectionId:psid}, function(data) {
var res = eval('(' + data + ')');
// console.log("ccc",res);
if(res.length==0){
$("#tab2_img").attr("src","");
}else{
$("#tab2_img").attr("src",ext.serverPath + res[0].picpath);
showTabMPoint(res[0].id);
showTabPS(res[0].id);
showTabTxt(res[0].id);
showTabEM(res[0].id);
}
});
dochart(psid);
};
function goToLocation(url){
$.post(ext.contextPath +"/user/getMenuRelation.do",{location:url},function(data){
// console.info(data)
if(data.length>2){
doforward(url,data[2].id,data[1].id,data[0].id)
}
},'json');
}
function clearPS(){
clearItem("${Flag_PS}");
}
var psOnClick = false;
var itemId = '';
function showPS(){
var workshopid = processSectionId;
$.post(ext.contextPath + "/work/scadaPic/getPSList.do", {pid:workshopid,companyId:unitId}, function(data) {
clearItem("${Flag_PS}");
if (data.length>0) {
for(i=0 ;i<data.length;i++){
var item= data[i];
containerWidth = $("#content").width();
containerHeight = $("#content").height();
var picurl = ext.contextPath+item.picurl;
var value='';
//console.info('222'+item.processSectionName);
if(item.processSection!=null){
value=item.processSection.name;
}
var left=containerWidth*item.posx/item.containerwidth;
var top=containerHeight*item.posy/item.containerheight;
var w=containerWidth*item.width/item.containerwidth;
var h=containerHeight*item.height/item.containerheight;
var problemNumber = parseInt(item.problemNumber);
var alarmNumber = parseInt(item.alarmNumber);
var professorNumber = parseInt(item.professorNumber);
// var son= '<div contentEditable="false" class="bootstrap-draggable " style="cursor:pointer !important;width:'+w+'px;height:'+h+'px;position:absolute;top:'+top+'px;left:'+left+'px;" id="'+item.id+'" type="${Flag_PS}" data-name='+item.processsectionid+'>';
// //'<span style="font-weight:bold">'+value+'</span>'+
// //'<img src="'+picurl+'" width="100%"></img>'+
// // '<a type="button" onclick="deleteps(this)" title="删除"><i class="fa fa-close"></i></a>'+
// //'<div class="pull-right"style="width:20px;height:20px;margin-right:0px;border-radius:10px;background-color:#ff0000">'+'</div>';
// if(problemNumber>0){
// son +='<div id="'+item.id+'problem" class="pull-right"style="line-height:20px;font-size:10px;text-align:center;cursor:pointer;width:20px;height:20px;margin-right:0px;border-radius:10px;background-color:#F3C200;color:white">'+item.problemNumber+'</div>';
// }
// if(alarmNumber>0){
// son +='<div id="'+item.id+'alarm" class=" pull-right"style="line-height:20px;font-size:10px;text-align:center;cursor:pointer;width:20px;height:20px;margin-left:0px;border-radius:10px;background-color:#ff0000;color:white">'+item.alarmNumber+'</div>';
// }
// if(professorNumber>0){
// son +='<span id="'+item.id+'professor" class="pull-left" style="width:45px;height:35px;background:url(../../IMG/processSection_pic/p8.png) no-repeat;background-size:cover;margin-right:5px;cursor:pointer;"></span>';
// }
// son +='</div>';
var son= '<div contentEditable="false" class="bootstrap-draggable " style="cursor:pointer !important;width:'+w+'px;height:'+h+'px;position:absolute;top:'+top+'px;left:'+left+'px;" id="'+item.id+'" type="${Flag_PS}" data-name='+item.processsectionid+'>'+
// '<span style="font-weight:bold">'+value+'</span>'+
//'<img src="'+picurl+'" width="100%"></img>'+
'<div style="float:left;width:100%;height:15px;color:#3E98D7;"><span >'+item.processSection.name+'</span></div>'+
'</div>';
//console.info(son)
$("#content").append(son);
//报警页面跳转
$('#'+item.id+'alarm').click(function(){
goToLocation('work/scadaAlarm/showlist.do');
});
//缺陷页面跳转
$('#'+item.id+'problem').click(function(){
goToLocation('maintenance/showMaintenanceDetailList.do');
});
//专家建议页面跳转
$('#'+item.id+'professor').click(function(){
goToLocation('work/KPIPro/showlist.do');
});
//2019-10-23
if(psOnClick == true){
var obj = document.getElementsByTagName("DIV");
//循环逆序删除
for(var i=obj.length-1;i>0;i--){
//console.info(obj[i].className.indexOf("easyui-draggable"));
//console.info(obj[i].getAttribute("type"));
if(obj[i].className.indexOf("bootstrap-draggable")>=0 && obj[i].getAttribute("type")=="${Flag_PS}"){
//console.info(obj[i]);
//alert();
obj[i].style.background ="rgba(255,255,255,0)";
//obj[i].css({"background-color":"clear"});
}
}
var id = $('#'+itemId).attr("id");
//$('#'+item.id).css({"background-color":"rgba(142,229,238,0.5)"});
$('#'+id).css({"background-color":"rgba(83,134,139,0.5)"});
}
//$("#tab2").append(son);
$('#'+item.id).click(function(){
processid = $(this).data("name");
var obj = document.getElementsByTagName("DIV");
//循环逆序删除
for(var i=obj.length-1;i>0;i--){
//console.info(obj[i].className.indexOf("easyui-draggable"));
//console.info(obj[i].getAttribute("type"));
if(obj[i].className.indexOf("bootstrap-draggable")>=0 && obj[i].getAttribute("type")=="${Flag_PS}"){
//console.info(obj[i]);
//alert();
obj[i].style.background ="rgba(255,255,255,0)";
//obj[i].css({"background-color":"clear"});
}
}
var id = $(this).attr("id");
//$('#'+id).css({"background-color":"rgba(83,134,139,0.5)"});
$('#'+id).css({"background-image":"radial-gradient(rgba(83,134,139,0.5), rgba(83,134,139,0.5), rgba(83,134,139,0))"});
//2019-10-23
psOnClick = true;
itemId = item.id;
if(!$('#tab3').hasClass('active')){
showdetail(processid);
} else {
getCamerasDetail(processid);
}
$('#myTab li a[data-toggle="tab"]').on('show.bs.tab',function(e){
// console.log('进入111');
if($(e.target).context.hash === '#tab3') {
// console.log('进入');
getCamerasDetail(processid);
} else {
$('#camerasFrame').html(data);
}
});
});
}
}
},'json');
};
function showTabPS(id){
var workshopid = id;
$.post(ext.contextPath + "/work/scadaPic/getPSList.do", {pid:workshopid}, function(data) {
clearTabItem("${Flag_PS}");
if (data.length>0) {
for(i=0 ;i<data.length;i++){
var item= data[i];
containerWidth = $("#tab2").width()+10;
containerHeight = $("#tab2").height()+5;
var picurl = ext.contextPath+item.picurl;
var value='';
//console.info('222'+item.processSectionName);
if(item.processSection!=null){
value=item.processSection.name;
}
var left=containerWidth*item.posx/item.containerwidth;
var top=containerHeight*item.posy/item.containerheight;
var w=containerWidth*item.width/item.containerwidth;
var h=containerHeight*item.height/item.containerheight;
var son= '<div contentEditable="false" class="bootstrap-draggable " style="cursor:pointer;width:'+w+'px;height:'+w+'px;position:absolute;top:'+top+'px;left:'+left+'px;" id="'+item.id+'" type="${Flag_PS}" data-name='+item.processSectionid+'>'+
//'<span style="font-weight:bold">'+value+'</span>'+
//'<img src="'+picurl+'" width="100%"></img>'+
// '<a type="button" onclick="deleteps(this)" title="删除"><i class="fa fa-close"></i></a>'+
'</div>';
//console.info(son)
//$("#content").append(son);
$("#tab2").append(son);
/* $('#'+item.id).bind('contextmenu',function(e){
selectid=this.id;
e.preventDefault();
$('#mEM').menu('show', {
left: e.pageX,
top: e.pageY
});
}); */
//$('#'+item.id).draggable()
//$('#'+item.id).resizable()
//$('#'+item.id).draggable();
//$('#'+item.id).resizable({ alsoResize: '.other' });
$('#'+item.id).click(function(){
processid = $(this).data("name");
showdetail(processid);
//console.info(this)
});
}
}
},'json');
};
function showEM(){
var workshopid = processSectionId;
$.post(ext.contextPath + "/work/scadaPic/getEMList.do", {pid:workshopid}, function(data) {
//console.info(data);
clearItem("${Flag_EM}");
if (data.length>0) {
for(i=0 ;i<data.length;i++){
var item= data[i];
containerWidth = $("#content").width();
containerHeight = $("#content").height();
var left=containerWidth*item.posx/item.containerwidth;
var top=containerHeight*item.posy/item.containerheight;
var w=containerWidth*item.width/item.containerwidth;
var h=containerHeight*item.height/item.containerheight;
var son= '<div contentEditable="false" class="bootstrap-draggable bootstrap-resizable" style="cursor:pointer;border:1px solid yellow;width:'+w+'px;height:'+h+'px;position:absolute;top:'+top+'px;left:'+left+'px;" id="'+item.id+'" type="${Flag_EM}" equipid='+item.equipid+'>'+
'<span style="color:white;font-size:'+item.fsize+'">'+
item.txt+
'</span><span style="color:white;font-size:'+item.fsize+'">'+
''+
'</span>'+
//'<a type="button" onclick="deleteem(this)" title="删除"><i class="fa fa-close"></i></a>'+
'</div>';
//console.info(son)
$("#content").append(son);
}
}
},'json');
};
function showTabEM(id){
var workshopid = id;
$.post(ext.contextPath + "/work/scadaPic/getEMList.do", {pid:workshopid}, function(data) {
//console.info(data);
clearTabItem("${Flag_EM}");
if (data.length>0) {
for(i=0 ;i<data.length;i++){
var item= data[i];
containerWidth = $("#tab2").width()+10;
containerHeight = $("#tab2").height()+5;
var left=containerWidth*item.posx/item.containerwidth;
var top=containerHeight*item.posy/item.containerheight;
var w=containerWidth*item.width/item.containerwidth;
var h=containerHeight*item.height/item.containerheight;
/* console.log("containerWidth:"+containerWidth);
console.log("item.containerwidth:"+item.containerwidth);
console.log("containerHeight:"+containerHeight);
console.log("w:"+w);
console.log("h:"+h); */
var son= '<div contentEditable="false" class="bootstrap-draggable bootstrap-resizable" style="cursor:pointer;border:1px solid yellow;width:'+w+'px;height:'+h+'px;position:absolute;top:'+top+'px;left:'+left+'px;" id="'+item.id+'" type="${Flag_EM}" equipid='+item.equipid+'>'+
'<span style="color:white;font-size:'+item.fsize+'">'+
item.txt+
'</span><span style="color:white;font-size:'+item.fsize+'">'+
''+
'</span>'+
//'<a type="button" onclick="deleteem(this)" title="删除"><i class="fa fa-close"></i></a>'+
'</div>';
//console.info(son)
//$("#content").append(son);
$("#tab2").append(son);
$('#'+item.id).click(function(){
//console.info(this)
showEMInfo(this.getAttribute("equipid"));
//console.info(this)
});
}
}
},'json');
};
function showEMInfo(id){
$.post(ext.contextPath + '/equipment/doview.do', {id:id} , function(data) {
$("#subDiv").html(data);
openModal('subModal');
});
}
function showTxt(){
var workshopid = processSectionId;
$.post(ext.contextPath + "/work/scadaPic/getTxtList.do", {pid:workshopid}, function(data) {
clearItem("${Flag_Txt}");
if (data.length>0) {
for(i=0 ;i<data.length;i++){
var item= data[i];
containerWidth = $("#content").width();
containerHeight = $("#content").height();
var left=containerWidth*item.posx/item.containerwidth;
var top=containerHeight*item.posy/item.containerheight;
son= '<div contentEditable="false" class="bootstrap-draggable" style="background-color:green;width:100px;height:20px;position:absolute;top:'+top+'px;left:'+left+'px;" id="'+item.id+'" type="${Flag_Txt}">'+
'<span style="color:white;font-size:'+item.fsize+'">'+
item.content+
'</span>'+
//'<a type="button" onclick="deletetxt(this)" title="删除"><i class="fa fa-close"></i></a>'+
'</div>';
// console.info(son)
$("#content").append(son);
//$("#tab2").append(son);
//$('#'+item.id).draggable();
//$('#'+item.id).resizable({ alsoResize: '.other' });
/* $('#'+item.id).click(function(){
//console.info(this)
showEMInfo(this.getAttribute("equipid"));
//console.info(this)
}); */
}
}
},'json');
};
function showTabTxt(id){
var workshopid = id;
$.post(ext.contextPath + "/work/scadaPic/getTxtList.do", {pid:workshopid}, function(data) {
clearTabItem("${Flag_Txt}");
if (data.length>0) {
for(i=0 ;i<data.length;i++){
var item= data[i];
containerWidth = $("#tab2").width()+10;
containerHeight = $("#tab2").height()+5;
var left=containerWidth*item.posx/item.containerwidth;
var top=containerHeight*item.posy/item.containerheight;
son= '<div contentEditable="false" class="bootstrap-draggable" style="background-color:green;width:100px;height:20px;position:absolute;top:'+top+'px;left:'+left+'px;" id="'+item.id+'" type="${Flag_Txt}">'+
'<span style="color:white;font-size:'+item.fsize+'">'+
item.content+
'</span>'+
//'<a type="button" onclick="deletetxt(this)" title="删除"><i class="fa fa-close"></i></a>'+
'</div>';
// console.info(son)
//$("#content").append(son);
$("#tab2").append(son);
//$('#'+item.id).draggable();
//$('#'+item.id).resizable({ alsoResize: '.other' });
/* $('#'+item.id).click(function(){
//console.info(this)
showEMInfo(this.getAttribute("equipid"));
//console.info(this)
}); */
}
}
},'json');
};
var MpPics;
function showMPoint(){
// console.log("processSectionId"+processSectionId);
clearItem("${Flag_MPoint}");
var workshopid = processSectionId;
$.post(ext.contextPath + "/work/scadaPic/getMPointList.do", {companyId:unitId,pid:workshopid}, function(data) {
//console.info(data)
if (data.length>0) {
for(i=0 ;i<data.length;i++){
var item= data[i];
containerWidth = $("#content").width();
containerHeight = $("#content").height();
//console.log((containerWidth))
var left=containerWidth*item.posx/item.containerwidth;
var top=containerHeight*item.posy/item.containerheight;
var son="";
//console.log((item.mPoint))
if(item.expressionflag!=null && item.expressionflag &&item.expressionflag!=""){
var path;
if(item.mPoint==null || item.mPoint.exp ==null || item.mPoint.exp==""){
path="";
}else{
path= MpPics[parseInt(item.mPoint.exp)].path;
}
son= '<div contentEditable="false" class="bootstrap-draggable" style="width:40px;height:40px;position:absolute;top:'+top+'px;left:'+left+'px;" id="'+item.id+'" type="${Flag_MPoint}">'+
'<img src=../../'+path+' style="width:20px;height:20px;" ></img>'+
//'<a type="button" onclick="deletemp(this)" title="删除"><i class="fa fa-close"></i></a>'+
'</div>';
}else{
var value ="";
if(item.mPoint!=null){
value=item.mPoint.parmvalue
}
son= '<div contentEditable="false" class="bootstrap-draggable" style="cursor:pointer;background-color:blue;width:150px;height:40px;position:absolute;top:'+top+'px;left:'+left+'px;" id="'+item.id+'" type="${Flag_MPoint}">'+
'<span style="color:white;font-size:'+item.fsize+'">'+
item.txt+
'</span><span style="color:#00ff00;font-size:'+item.fsize+'">'+
value+
'</span>'+
//'<a type="button" onclick="deletemp(this)" title="删除"><i class="fa fa-close"></i></a>'+
'</div>';
}
//console.info(son);
$("#content").append(son);
//$("#tab2").append(son);
/* $('#'+item.id).bind('contextmenu',function(e){
selectid=this.id;
e.preventDefault();
$('#mPoint').menu('show', {
left: e.pageX,
top: e.pageY
});
}); */
//$('#'+item.id).draggable()
}
}
},'json');
}
function showTabMPoint(id){
var workshopid = id;
clearTabItem("${Flag_MPoint}");
$.post(ext.contextPath + "/work/scadaPic/getMPointList.do", {companyId:unitId,pid:workshopid}, function(data) {
console.info(data)
console.info(workshopid)
console.info(unitId)
if (data.length>0) {
for(i=0 ;i<data.length;i++){
var item= data[i];
containerWidth = $("#tab2").width()+10;
containerHeight = $("#tab2").height()+5;
//console.log((containerWidth))
var left=containerWidth*item.posx/item.containerwidth;
var top=containerHeight*item.posy/item.containerheight;
var son="";
//console.log((item.mPoint))
if(item.expressionflag!=null && item.expressionflag &&item.expressionflag!=""){
var path;
if(item.mPoint==null || item.mPoint.exp ==null || item.mPoint.exp==""){
path="";
}else{
path= MpPics[parseInt(item.mPoint.exp)].path;
}
son= '<div contentEditable="false" class="bootstrap-draggable" style="width:40px;height:40px;position:absolute;top:'+top+'px;left:'+left+'px;" id="'+item.id+'" type="${Flag_MPoint}">'+
'<img src=../../'+path+' style="width:20px;height:20px;" ></img>'+
//'<a type="button" onclick="deletemp(this)" title="删除"><i class="fa fa-close"></i></a>'+
'</div>';
}else{
var value ="";
if(item.mPoint!=null){
value=item.mPoint.parmvalue
}
son= '<div contentEditable="false" class="bootstrap-draggable" style="cursor:pointer;background-color:blue;width:150px;height:40px;position:absolute;top:'+top+'px;left:'+left+'px;" id="'+item.id+'" type="${Flag_MPoint}">'+
'<span style="color:white;font-size:'+item.fsize+'">'+
item.txt+
'</span><span style="color:#00ff00;font-size:'+item.fsize+'">'+
value+
'</span>'+
//'<a type="button" onclick="deletemp(this)" title="删除"><i class="fa fa-close"></i></a>'+
'</div>';
}
//console.info(son);
//$("#content").append(son);
$("#tab2").append(son);
/* $('#'+item.id).bind('contextmenu',function(e){
selectid=this.id;
e.preventDefault();
$('#mPoint').menu('show', {
left: e.pageX,
top: e.pageY
});
}); */
//$('#'+item.id).draggable()
}
}
},'json');
}
//清除原先点
function clearItem(type) {
var obj = document.getElementsByTagName("DIV");
//循环逆序删除
for(var i=obj.length-1;i>0;i--){
//console.info(obj[i].className.indexOf("easyui-draggable"));
//console.info(obj[i].getAttribute("type"));
if(obj[i].className.indexOf("bootstrap-draggable")>=0 && obj[i].getAttribute("type")==type){
//console.info(obj[i]);
obj[i].remove();
}
}
//console.log(obj.length)
}
//清除原先点
function clearTabItem(type) {
//var obj=$("#tab2").html();
var obj = $("#tab2 div");
//循环逆序删除
for(var i=0;i<obj.length;i++){
//console.info(obj[i].className.indexOf("easyui-draggable"));
//console.info(obj[i].getAttribute("type"));
if(obj[i].className.indexOf("bootstrap-draggable")>=0 && obj[i].getAttribute("type")==type){
//console.info(obj[i]);
obj[i].remove();
}
}
//console.log(obj.length)
}
var firstOnResizeFire = true;//谷歌浏览器onresize事件会执行2次这里加个标志位控制
var containerWidth = 0;
var containerHeight = 0;
var selectid=""; //记录右键时,指向的对象
function changesize(){
alert();
if (firstOnResizeFire) {
firstOnResizeFire = false;
adjuest();
//0.5秒之后将标志位重置Chrome的window.onresize默认执行两次
setTimeout(function() {
firstOnResizeFire = true;
}, 500);
}
}
$(function() {
init();
initDate1();
initDate2();
// console.log(companyId);
// console.log(processid);
$("#table").bootstrapTable({ // 对应table标签的id
url: ext.contextPath + '/work/kpipoint/getlist.do', // 获取表格数据的url
cache: false, // 设置为 false 禁用 AJAX 数据缓存, 默认为true
striped: true, //表格显示条纹默认为false
pagination: true, // 在表格底部显示分页组件默认false
pageList: [10, 20,50], // 设置页面可以显示的数据条数
pageSize: 10, // 页面数据条数
pageNumber: 1, // 首页页码
sidePagination: 'server', // 设置为服务器端分页
responseHandler:responseHandler, //在渲染页面数据之前执行的方法,此配置很重要!!!!!!!
queryParams: function (params) { // 请求服务器数据时发送的参数可以在这里添加额外的查询参数返回false则终止请求
return {
rows: params.limit, // 每页要显示的数据条数
page: params.offset/params.limit+1, // 每页显示数据的开始页码
sort: params.sort, // 要排序的字段
order: params.order, // 排序规则
search_name: $('#search_name').val(),
companyId: unitId,
pSectionId: processid,
}
},
sortName: 'grade', // 要排序的字段
sortOrder: 'asc', // 排序规则
columns: [
{
checkbox: true, // 显示一个勾选框
formatter: function (i,row) { // 每次加载 checkbox 时判断当前 row 的 id 是否已经存在全局 Set() 里
if($.inArray(row.id,Array.from(selectionIds))!=-1){ // 因为 Set是集合,需要先转换成数组
return {
checked : true // 存在则选中
}
}
}
},{
field: 'grade', // 返回json数据中的name
title: '', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle',
formatter : function(value, row) {
if(value==1){
return '<span class="fa fa-circle" style="color:#ff0000 ;"></span>';
}else if(value==2){
return '<span class="fa fa-circle" style="color:#F3C200;"></span>';
}else{
return '';
}
}
},{
field: 'mpoint', // 返回json数据中的name
title: '工艺运行关键KPI', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle', // 上下居中
formatter: function(value,row) {
if(value !=null){
return value.parmname;
}else{
return '-';
}
}
},{
field: 'mpoint', // 返回json数据中的name
title: '最新值', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle', // 上下居中
formatter: function(value,row) {
if(value !=null){
return value.parmvalue;
}else{
return '-';
}
}
},{
field: 'mpoint', // 返回json数据中的name
title: '单位', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle', // 上下居中
formatter: function(value,row) {
if(value !='' && value!=null){
return value.unit;
} else{
return '-';
}
}
},{
title: "曲线",
align: 'center',
valign: 'middle',
width: 60, // 定义列的宽度单位为像素px
formatter: function (value, row, index) {
return '<span onclick="editFun(\'' + row.mpointid + '\')" class="glyphicon glyphicon-stats" style="cursor:pointer;color:#F3C200"></span>';
/* return '<i class="fa fa-edit" onclick="editFun()(\'' + row.id + '\')></i>'; */
}
}/* ,{
field: 'period', // 返回json数据中的name
title: '刷新周期', // 表格表头显示文字
sortable : true,
align: 'center', // 左右居中
valign: 'middle',
} // 上下居中 */
,{
field: 'mpoint', // 返回json数据中的name
title: '更新时间', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle',
formatter: function(value,row) {
if(value.measuredt !=''){
return value.measuredt.substring(0,16);
} else{
return '-';
}
}
} // 上下居中
,{
field: 'bizid', // 返回json数据中的name
title: '所属厂区', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle' // 上下居中
},{
field: 'processectionname', // 返回json数据中的name
title: '工艺段', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle' // 上下居中
},{
field: 'insuser', // 返回json数据中的name
title: '递交人', // 表格表头显示文字
sortable : true,
align: 'center', // 左右居中
valign: 'middle',
},{
field: 'flag', // 返回json数据中的name
title: '水行家', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle',
formatter : function(value, row) {
if(value =='${Flag_Yes}')
{
return '<span onclick="viewFun(${Flag_Yes},\'' + row.mpointid + '\');" class="glyphicon glyphicon-user" style="cursor:pointer;color:#00c0ef;"></span>';
}else{
return '<span onclick="viewFun(${Flag_No});" class="glyphicon glyphicon-user" style="cursor:pointer;color:#eeeeee;"></span>';
}
}
}
],
onLoadSuccess: function(){ //加载成功时执行
adjustBootstrapTableView("table");
},
onLoadError: function(){ //加载失败时执行
console.info("加载数据失败");
}
});
//绑定选中事件、取消事件、全部选中、全部取消
$("#table").on('check.bs.table check-all.bs.table uncheck.bs.table uncheck-all.bs.table', function (e, rows) {
var ids = $.map(!$.isArray(rows) ? [rows] : rows, function (row) {
return row.mpointid;
});
func = $.inArray(e.type, ['check', 'check-all']) > -1 ? 'union' : 'difference';
selectionIds = _[func](selectionIds, ids);
});
$("#table1").bootstrapTable({ // 对应table标签的id
url: ext.contextPath + '/maintenance/getMaintenanceDetailList.do', // 获取表格数据的url
cache: false, // 设置为 false 禁用 AJAX 数据缓存, 默认为true
striped: true, //表格显示条纹默认为false
pagination: true, // 在表格底部显示分页组件默认false
pageList: [10, 20,50], // 设置页面可以显示的数据条数
pageSize: 10, // 页面数据条数
pageNumber: 1, // 首页页码
sidePagination: 'server', // 设置为服务器端分页
queryParams: function (params) { // 请求服务器数据时发送的参数可以在这里添加额外的查询参数返回false则终止请求
return {
rows: params.limit, // 每页要显示的数据条数
page: params.offset/params.limit+1, // 每页显示数据的开始页码
sort: params.sort, // 要排序的字段
order: params.order, // 排序规则
search_name: $('#search_name').val(),
search_code:unitId,
processSectionId:processid,
type:'${MAINTENANCE_TYPE_REPAIR}'
}
},
sortName: 'id', // 要排序的字段
sortOrder: 'desc', // 排序规则
columns: [
/* {
checkbox: true, // 显示一个勾选框
},{
field: 'status1', // 返回json数据中的name
title: '', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle',
formatter : function(value, row) {
if(value==2){
return '<span class="fa fa-circle" style="color:#ff0000 ;"></span>';
}else if(value==1){
return '<span class="fa fa-circle" style="color:#F3C200;"></span>';
}else{
return '';
}
}
}, */
{
field: 'detailNumber', // 返回json数据中的name
title: '缺陷编码', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle', // 上下居中
formatter: function(value,row) {
var a = '<span style="color:#3c8dbc;font-weight:900">'+value+'</span>';
return a;
}
},{
field: 'problemcontent', // 返回json数据中的name
title: '缺陷内容', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle' // 上下居中
}
/*
,{
field: 'Problemtypeid', // 返回json数据中的name
title: '缺陷类型', // 表格表头显示文字
sortable : true,
align: 'center', // 左右居中
valign: 'middle' // 上下居中
}
*/
,{
field: 'status',
title: "缺陷状态",
align: 'center',
sortable : false,
valign: 'middle',
width: 60, // 定义列的宽度单位为像素px
formatter:function(value,row,index){
if(value == '${Status_Start}' && row.type == '${TYPE_SUPPLEMENT}'){
return '处理中';
}else if(value == '${Status_Start}'){
return '已下发';
}else if(value == '${Status_Finish}'){
return '已完成';
}else{
return value;
}
}
}
/*
,{
field: 'EquipmentId', // 返回json数据中的name
title: '设备', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle',
}
*/ // 上下居中
,{
//field: 'insuser', // 返回json数据中的name
field: 'insertUser.caption',
title: '报告人', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle',
} // 上下居中
,{
field: 'insdt', // 返回json数据中的name
title: '报告时间', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle',
formatter: function(value,row) {
if(value !=null){
return value.substring(0,16);
} else{
return '-';
}
}
} // 上下居中
/*
,{
field: 'maintenanceMan', // 返回json数据中的name
title: '递交人', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle',
},{
field: 'status2', // 返回json数据中的name
title: '智慧助手', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle',
formatter : function(value, row) {
return '<span onclick="viewFun();" class="glyphicon glyphicon-user" style="cursor:pointer;color:#3c8dbc;"></span>';
}
}
*/
],
onLoadSuccess: function(){ //加载成功时执行
adjustBootstrapTableView("table1");
},
onLoadError: function(){ //加载失败时执行
console.info("加载数据失败");
}
});
$("#table2").bootstrapTable({ // 对应table标签的id
url: ext.contextPath + '/equipment/getList.do', // 获取表格数据的url
cache: false, // 设置为 false 禁用 AJAX 数据缓存, 默认为true
striped: true, //表格显示条纹默认为false
pagination: true, // 在表格底部显示分页组件默认false
pageList: [10, 20,50], // 设置页面可以显示的数据条数
pageSize: 10, // 页面数据条数
pageNumber: 1, // 首页页码
sidePagination: 'server', // 设置为服务器端分页
queryParams: function (params) { // 请求服务器数据时发送的参数可以在这里添加额外的查询参数返回false则终止请求
return {
rows: params.limit, // 每页要显示的数据条数
page: params.offset/params.limit+1, // 每页显示数据的开始页码
sort: params.sort, // 要排序的字段
order: params.order, // 排序规则
search_name: $('#search_name').val(),
companyId: unitId,
pSectionId: processid,
}
},
sortName: 'id', // 要排序的字段
sortOrder: 'desc', // 排序规则
onClickRow: function (row) {//单击行事件,执行查看功能
viewEqu(row.id);
},
columns: [
/* {
checkbox: true, // 显示一个勾选框
}, */
{
field: 'equipmentstatus', // 返回json数据中的name
title: '', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle',
formatter: function (value, row, index) {
switch (value){
case '0' :
return '<span class="fa fa-circle" style="color:#ff0000 ;"></span>';
case '1' :
return '<span class="fa fa-circle" style="color:#00ff00;"></span>';
default :
return "";
}
}
},
{
field: 'equipmentname', // 返回json数据中的name
title: '设备名称', // 表格表头显示文字
sortable : true,
align: 'center', // 左右居中
valign: 'middle', // 上下居中
formatter: function(value,row) {
var a = '<span style="font-weight:900">'+value+'</span>';
return a;
}
},{
field: 'equipmentcardid', // 返回json数据中的name
title: '设备编号', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle', // 上下居中
},{
field: 'bizid', // 返回json数据中的name
title: '所属厂区', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle' // 上下居中
},{
field: 'equipmentClass.name', // 返回json数据中的name
title: '设备类型', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle' // 上下居中
/*
formatter: function(value,row) {
return value.name;
}
*/
},{
field: 'equipmentTypeNumber.name',
title: '设备型号', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle' // 上下居中
},{
field: 'processSection.name', // 返回json数据中的name
title: '工艺段', // 表格表头显示文字
sortable : false,
align: 'center', // 左右居中
valign: 'middle',
} // 上下居中
/* {
//field: 'status2', // 返回json数据中的name
title: '智慧助手', // 表格表头显示文字
sortable : true,
align: 'center', // 左右居中
valign: 'middle',
formatter : function(value, row) {
return '<span class="glyphicon glyphicon-user" style="color:#3c8dbc;"></span>';
}
} */
],
onLoadSuccess: function(){ //加载成功时执行
adjustBootstrapTableView("table2");
},
onLoadError: function(){ //加载失败时执行
console.info("加载数据失败");
}
});
//showCameraDetail();
//clickStartRealPlay();
$("#table3").bootstrapTable({ // 对应table标签的id
url: ext.contextPath + '/work/proAlarm/getListForProcess.do', // 获取表格数据的url
cache: false, // 设置为 false 禁用 AJAX 数据缓存, 默认为true
striped: true, //表格显示条纹默认为false
pagination: true, // 在表格底部显示分页组件默认false
pageList: [10, 20,50], // 设置页面可以显示的数据条数
pageSize: 10, // 页面数据条数
pageNumber: 1, // 首页页码
sidePagination: 'server', // 设置为服务器端分页
queryParams: function (params) { // 请求服务器数据时发送的参数可以在这里添加额外的查询参数返回false则终止请求
return {
rows: params.limit, // 每页要显示的数据条数
page: params.offset/params.limit+1, // 每页显示数据的开始页码
sort: params.sort, // 要排序的字段
order: params.order, // 排序规则
//search_name: $('#search_name').val(),
unitId: unitId,
pSectionId: processid,
beginTimeStore:beginTimeStore2,
endTimeStore:endTimeStore2
}
},
sortName: 'alarmtime', // 要排序的字段
sortOrder: 'desc', // 排序规则
columns: [
{
field: 'alarmtime', // 返回json数据中的name
title: '报警时间', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle', // 上下居中
formatter: function (value, row, index){
return value.substring(0,16);
}
},{
field: 'mpid', // 返回json数据中的name
title: '报警变量', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle' // 上下居中
},{
field: 'describe', // 返回json数据中的name
title: '报警内容', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle' // 上下居中
},{
field: 'alarmlvl', // 返回json数据中的name
title: '报警等级', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle' // 上下居中
},{
field: 'areaname', // 返回json数据中的name
title: '所属工艺段', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle', // 上下居中
formatter: function (value, row, index){
if(row.processSection!=null){
return row.processSection.name;
}else{
return ''
}
}
},{
field: 'status', // 返回json数据中的name
title: '状态', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle',// 上下居中
formatter: function (value, row, index){
switch (value){
case '${Status_N}' :
return "新报警";
case '${Status_C}' :
return "已确认";
case '${Status_Y}' :
return "已恢复";
default :
return "";
}
}
}
],
onLoadSuccess: function(){ //加载成功时执行
adjustBootstrapTableView("table3");
},
onLoadError: function(){ //加载失败时执行
console.info("加载数据失败");
}
});
});
var refreshSelect = function() {
var selelct_ =$("#processSection").select2({
data: null,
placeholder:'请选择',//默认文字提示
allowClear: true,//允许清空
escapeMarkup: function (markup) { return markup; }, // 自定义格式化防止xss注入
language: "zh-CN",
minimumInputLength: 0,
minimumResultsForSearch: 10,//数据超过十个启用搜索框
});
$("#processSection").empty();
// $("#table").bootstrapTable('refresh', {data:null});
$(".select2-selection--single").css({'height':'30px','paddingTop':'4px'});
$("#processSection").css("display", "none");
};
var initTreeView = function() {
$.post(ext.contextPath + '/user/getUnitsJson.do?random=' + Math.random(), {ng:''} , function(data) {
//console.info(data)
$('#search_pid').treeview({data: data
});
$('#search_pid').on('nodeSelected', function(event, data) {
editFun(data.id);
//var node=$('#tree').treeview('getSelected');
});
},'json');
$("#search_pid").html("");
};
function detail(){
var datas="";
datas_name="";
$.each(selectionIds, function(index, item){
if(datas!=""){
datas+=",";
}
datas+=item;
});
datas+=",";
// console.log(datas);
editFun(datas);
}
//选中事件操作数组
var union = function(array,ids){
$.each(ids, function (i, id) {
if($.inArray(id,array)==-1){
array[array.length] = id;
}
});
return array;
};
//取消选中事件操作数组
var difference = function(array,ids){
$.each(ids, function (i, id) {
var index = $.inArray(id,array);
if(index!=-1){
array.splice(index, 1);
}
});
return array;
};
var _ = {"union":union,"difference":difference};
//表格分页之前处理多选框数据
function responseHandler(res) {
$.each(res.rows, function (i, row) {
row.checkStatus = $.inArray(row.id, selectionIds) != -1; //判断当前行的数据id是否存在与选中的数组存在则将多选框状态变为true
});
return res;
}
//回到总工艺界面
function refresh(){
psOnClick = false;//2019-10-23
processid='';
init();
$("#table").bootstrapTable('refresh');
$("#table1").bootstrapTable('refresh');
$("#table2").bootstrapTable('refresh');
$("#table3").bootstrapTable('refresh');
}
//刷新表格
function refreshTable(){
$("#table").bootstrapTable('refresh');
$("#table1").bootstrapTable('refresh');
$("#table2").bootstrapTable('refresh');
$("#table3").bootstrapTable('refresh');
}
//刷新控件
function refreshPS(){
//clearPS();
showPS();
}
function refreshAlarm(){
$("#table3").bootstrapTable('refresh');
}
//5分钟定时刷新
$(document).ready(function () {
setInterval("refreshTable()",300000);
setInterval("refreshPS()",300000);
//setInterval这个函数会根据后面定义的1000既每隔1秒执行一次前面那个函数
//如果你用局部刷新要用AJAX技术
});
// 根据工艺段获取视频
var showCameraDetail = function(){
$.post(ext.contextPath + '/work/scadaPic/getCamera.do', {id:'c0664fad941a47d5a32d24eda2085b67'} , function(data) {
// console.log('kkkkkkkk:'+data);
// console.log('kkkkkkkkj:'+ typeof data);
var camera = JSON.parse(data);
$('#loginip').val(camera.camera[0].url);
$('#username').val(camera.camera[0].username);
$('#password').val(camera.camera[0].password);
$('#ip').val(camera.camera[0].url);
$('#channels').val(camera.camera[0].channel);
});
};
function getCamerasDetail(processSectionId) {
// console.log('工艺的ID'+processid);
$.post(ext.contextPath + '/work/scadaPic/showVideoDetail.do', {}, function(data){
$('#camerasFrame').html(data);
document.querySelector('#tab3').dataset.processsectionid = processSectionId;
//processSectionId;
});
}
var websocket = null;
//判断当前浏览器是否支持WebSocket
if ('WebSocket' in window) {
websocket = new ReconnectingWebSocket(ext.basePath.replace("http","ws")+"/msgWebSocket/${cu.id}");
}
else {
alert('当前浏览器 Not support websocket')
}
//接收到消息的回调方法
websocket.onmessage = function (event) {
//toastr.success('专家建议消息!', '专家建议');
refreshPS();
refreshTable();
}
</script>
</head>
<body onload="initMenu()" style="overflow-y:scroll" id="body"
class="hold-transition ${cu.themeclass} sidebar-mini">
<div class="wrapper main-container">
<div class="content-wrapper">
<!-- Content Header (Page header) -->
<section class="content-header">
<h1 id="head_title"></h1>
<ol class="breadcrumb">
<li><a id='head_firstlevel' href="#"><i
class="fa fa-dashboard"></i> </a></li>
<!-- <li class="active">Here</li> -->
</ol>
</section>
<!-- Main content -->
<section class="content container-fluid">
<div id="mainAlertdiv"></div>
<div id="subDiv"></div>
<div id="menu4SelectDiv"></div>
<div>
<!-- <div class="form-group form-inline" style="padding:0;">
<div class="form-group form-inline">
<div class="form-group form-inline">
<div class="form-group">
<label class="form-label" id="companylabel">水厂:</label> <label
class="form-label" id="company"
style="width:180px;border: none;background: transparent;"></label>
</div>
<div class="form-group">
<select class="form-control select2 " id="search_code"
name="search_code" style="width: 220px;"></select>
</div>
<div class="form-group " style="margin-bottom:10px;">
<input id="search_code" name="search_code" type="hidden" />
<span id="company" style="height:31px;color:#000000;border-top-left-radius: 4px;border-bottom-left-radius: 4px;font-weight:bold"></span>
</div>
<ul id="companyselect" style="list-style-type:none;padding-left:0px;width:300px;">
<li class="dropdown" style="width:300px;">
Menu toggle button
<a href="#" class="dropdown-toggle" data-toggle="dropdown"
style="width:300px;" onclick="document.getElementById('ul_tree').style.display = 'block';">
<div class="input-group">
<span class="input-group-addon"
style="height:31px;color:#000000;border-top-left-radius: 4px;border-bottom-left-radius: 4px;font-weight:bold">公司:</span>
<input class="form-control " id="cname_input" name="cname_input"
style="height:31px;width: 220px;border-top-right-radius: 4px;border-bottom-right-radius: 4px;"
readonly />
</div>/input-group
</a>
<ul id="ul_tree" class="dropdown-menu" data-stopPropagation="true">
<li class="header">
<div id="companytree" style="width: 275px;overflow:auto;"></div>
</li>
</ul>
</li>
</ul>
</div>
<div class="form-group ">
<label class="form-label">底图</label>
<select class="form-control select2 " id="processSection" name ="processSection" style="width: 220px;"></select>
</div>
</div>
<div class="form-group pull-right" >
<div class="input-group input-group-sm" style="width: 250px;">
<input type="text" id="search_name" name="search_name" class="form-control pull-right" placeholder="名称">
<div class="input-group-btn">
<button class="btn btn-default" onclick="dosearch();"><i class="fa fa-search"></i></button>
</div>
</div>
</div>
</div>
-->
<div class="col-lg-12 col-xs-12"
style="text-align: center;padding:0px" id="content">
<img alt="" src="" width="100%" id="img" onclick="refresh()">
</div>
</div>
<div class="nav-tabs-custom">
<ul class="nav nav-tabs" id="myTab">
<li class="active"><a href="#tab1" data-toggle="tab"
index="0" aria-expanded="true">工艺运行KPI</a></li>
<li class=""><a href="#tab2" data-toggle="tab" index="1"
aria-expanded="true" >工艺实时监控</a></li>
<li class="hidden-sm hidden-xs"><a href="#tab3" data-toggle="tab" index="2"
aria-expanded="true">现场监控视频</a></li>
<li><a href="#tab5" data-toggle="tab" index="3">主要设备</a></li>
<li><a href="#tab4" data-toggle="tab" index="4">异常消缺管理</a></li>
<li><a href="#tab6" data-toggle="tab" index="5">报警</a></li>
</ul>
<div class="tab-content no-padding">
<!-- Morris chart - Sales -->
<div class="chart tab-pane active" id="tab1"
style="position: relative; padding:5px;">
<div class="input-group pull-right input-group-sm">
<input type="text" class="form-control pull-right"
id="reservationtime1" style="width:175px">
<div class="input-group-btn ">
<button type="button" class="btn btn-default"
onclick="detail();">
<i class="fa fa-search"></i> 详情
</button>
</div>
</div>
<table id="table"></table>
</div>
<div class=" tab-pane" id="tab2"
style="position: relative; padding:0px;overflow:hidden">
<img alt="" src="" width="100%" id="tab2_img">
</div>
<div class="chart tab-pane hidden-sm hidden-xs" id="tab3"
style="position: relative; padding:5px;">
<div id="camerasFrame" style="width:100%;height:400px;padding:10px;background:rgba(255,255,255,0);"></div>
</div>
<div class="chart tab-pane" id="tab4"
style="position: relative; padding:5px;">
<table id="table1"></table>
</div>
<div class="chart tab-pane" id="tab5"
style="position: relative; padding:5px;">
<table id="table2"></table>
</div>
<div class="chart tab-pane" id="tab6" style="padding:5px;">
<!-- <div id="box" style="height:350px"></div>
<div class="col-lg-5 col-xs-12 pull-left" >
<table id="table3"></table>
</div> -->
<div class="col-lg-12 col-xs-12">
<div class="col-lg-6 col-xs-12" id="boxdiv">
<div id="box"></div>
</div>
<div class="col-lg-6 col-xs-12">
<div class="input-group pull-right input-group-sm">
<input type="text" class="form-control pull-right"
id="reservationtime2" style="width:175px">
<div class="input-group-btn ">
<button type="button" class="btn btn-default"
onclick="refreshAlarm();">
<i class="fa fa-search"></i> 查询
</button>
</div>
</div>
<table id="table3"></table>
</div>
</div>
<!-- <table id="table2"></table> -->
<!-- <div id="box" style="height:350px"></div> -->
</div>
</div>
</section>
<!-- /.content -->
</div>
</div>
</body>
<!-- echarts-->
<script type="text/javascript"
src="<%=request.getContextPath()%>/plugins/echarts/echarts.js"
charset="utf-8"></script>
<script type="text/javascript"
src="<%=request.getContextPath()%>/plugins/echarts/macarons.js"
charset="utf-8"></script>
<!-- 引入daterangepicker-->
<link rel="stylesheet"
href="<%=request.getContextPath()%>/plugins/bootstrap-daterangepicker/daterangepicker.css" />
<script type="text/javascript"
src="<%=request.getContextPath()%>/plugins/bootstrap-daterangepicker/moment.min.js"
charset="utf-8"></script>
<script type="text/javascript"
src="<%=request.getContextPath()%>/plugins/bootstrap-daterangepicker/daterangepicker.js"
charset="utf-8"></script>
</html>