Files
SIPAIIS_WMS_JSSW/WebRoot/jsp/work/overviewManagement.jsp

1196 lines
44 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_OFF", EquipmentCard.Status_OFF); %>
<%request.setAttribute("Status_ON", EquipmentCard.Status_ON); %>
<%request.setAttribute("Status_Fault", EquipmentCard.Status_Fault); %>
<%request.setAttribute("Status_Transfer", EquipmentCard.Status_Transfer); %>
<%request.setAttribute("Status_Scrap", EquipmentCard.Status_Scrap); %>
<%request.setAttribute("Status_STOP", EquipmentCard.Status_STOP); %>
<%
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>
<!-- 引入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>
<style>
.box-top {
height: 625px;
padding: 10px ;
}
.box-bottom {
height: 330px;
padding: 10px ;
}
.box-top>.box-body>.row{
height:25%;
}
.box-top>.box-body>.row>.col-md-12{
height:100%;
}
.box-bottom>.box-body>.row,.box-bottom>.box-body>.row>.col-md-12{
height:100%;
background: #e3ecff;
}
.box-right {
height: 975px;
padding: 10px ;
}
.box.box-white {
border-top: 0;
}
.nowdt{
font-size: 12px;
font-weight:600;
color:#EFA103;
}
.table>tbody>tr>td{
vertical-align: middle;
}
.box-header .box-title{
font-size: 16px;
font-family: MicrosoftYaHei
}
.box.box-white .box-border{
padding:0 10px;
}
.box.box-white .box-border >.box-border-left{
width: 50px;
height: 4px;
background: #c4e2e6;
border-radius: 4px;
float:left;
}
.box.box-white .box-border >.box-border-right{
width: calc(100% - 50px);
height: 3px;
border-bottom: 2px solid #f6f7fa;
border-radius: 4px;
float:right;
}
.dl-horizontal{
margin-top:10px;
}
.dl-horizontal>dt{
font-weight:initial;
text-align: right;
width: 120px;
height: 20px;
margin-bottom:8px;
}
.dl-horizontal>dd{
margin-left: 120px;
height: 20px;
text-align: left;
margin-bottom:8px;
}
.font-blue{
color: #1890FF;
}
.font-red{
color: #F55945;
}
.font-yellow{
color: #efa103;
}
.lable-right{
font-size: 15px;
font-family: MicrosoftYaHei;
font-weight: 550;
color: #1d1e1f;
line-height: 20px;
}
.lable-left{
font-size: 14px;
font-family: MicrosoftYaHei;
color: #68696b;
line-height: 20px;
letter-spacing: 1px;
}
.lable-black{
font-size: 16px;
font-family: MicrosoftYaHei;
font-weight: 700;
text-align: center;
color: #121212;
line-height: 21px;
letter-spacing: 0px;
}
.lable-green{
font-size: 50px;
font-family: MicrosoftYaHei, MicrosoftYaHei-Bold;
font-weight: 700;
text-align: center;
color: #00cccc;
line-height: 72px;
}
.lable-green-small{
font-size: 30px;
font-family: MicrosoftYaHei, MicrosoftYaHei-Bold;
font-weight: 700;
text-align: left;
color: #00cccc;
line-height: 42px;
}
.select-blue{
border: 1px solid #3e99e8;
border-radius: 4px;
color: #3e99e8;
padding:5px 10px;
height:30px;
}
.select-blue{
border: 1px solid #3e99e8;
border-radius: 4px;
color: #3e99e8;
padding:0px 5px;
height:25px;
}
.well-xs{
padding: 5px;
}
.well-xs>label{
margin-bottom: 0px;
}
.fa-long-arrow-up{
color:#EC4747;
}
.fa-long-arrow-down{
color:#1790FF;
}
.fa-check{
color:#28A3CF;
}
.fa-line-chart{
color:#EFA103;
}
.tab-content{
height:88%;
}
.tab-pane{
height:100%;
}
.input-xs{
height: 22px;
line-height: 22px;
padding: 1px;
}
.table .label{
margin-right:5px;
}
.dl-horizontal{
height:20%;
margin-bottom: 10px;
}
.handle-title{
height:5%;
font-size: 16px;
font-family: MicrosoftYaHei;
font-weight:600;
text-align: center;
line-height: 21px;
letter-spacing: 1px;
}
.monitor{
position: absolute;
right: 10px;
bottom: 5px;
}
</style>
<script type="text/javascript">
var companyId = "";
var processSectionId = "";//底图id
var processid ="";//工艺段id
var selectionIds = []; //保存选中ids
var addFun = function() {
$.post(ext.contextPath + '/work/mpoint/add.do', {} , function(data) {
$("#subDiv").html(data);
openModal('subModal');
});
};
var editFun = function(id) {
$.post(ext.contextPath + '/work/mpoint/edit.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(willDelete => {
if (willDelete) {
$.post(ext.contextPath + '/work/group/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(willDelete => {
if (willDelete) {
$.post(ext.contextPath + '/work/group/deletes.do', {ids:datas} , function(data) {
if(data>0){
$("#table").bootstrapTable('refresh');
}else{
showAlert('d','删除失败','mainAlertdiv');
}
});
}
});
}
};
var init = function() {
$.post(ext.contextPath + '/work/group/getListForSelect.do', {} , function(data) {
//console.info(data)
if(data.length>0){
for(var i=0;i<data.length;i++){
$("#search_code").append("<option value='"+data[i].id+"'>"+data[i].text+"</option>");
}
}
},'json');
};
var dosearch = function() {
$("#table").bootstrapTable('refresh');
};
//巡检情况
function doInspection(id,value,colorNum){
const colorList = [ '#0988FF','#EFA103', '#FE8840', '#FBD444', '#7F6AAD', '#585247'];
var othVal = 100 - value;
var myChart = echarts.init(document.getElementById(id));
var option = {
title: {
text: value+'%',
x: 'center',
y: '30%',
textStyle: {
fontSize: '19',
fontWeight: 600,
color: '#000000',
},
},
color: ['#F6F8F9'],
grid: {
top:0,
left:0,
right:0,
bottom:0,
},
series: [{
name: 'Line 1',
type: 'pie',
clockWise: true,
radius: ['65%', '80%'],
center: ['50%', '40%'],
itemStyle: {
normal: {
label: {
show: false
},
labelLine: {
show: false
}
}
},
hoverAnimation: false,
data: [{
value: value,
name: '01',
itemStyle: {
normal: {
color: colorList[colorNum],
label: {
show: false
},
labelLine: {
show: false
}
}
}
}, {
name: '02',
value: othVal
}]
}]
}
myChart.clear();
myChart.setOption(option, true);
}
//临时任务
function doTable(id,size){
if(size==null || size==undefined){
size = 10;
}
var height = $("#"+id).parent().height();
$("#"+id).bootstrapTable({
//url:"",
height:height,
striped: false, //是否显示行间隔色
cache: false, //是否使用缓存默认为true所以一般情况下需要设置一下这个属性*
pagination: true, //是否显示分页(*
sidePagination: "client", //分页方式client客户端分页server服务端分页*
pageNumber:1, //初始化加载第一页,默认第一页
pageSize: size, //每页的记录行数(*
pageList: [10,20], //可供选择的每页的行数(*
});
}
function doLoad(url){
url=ext.contextPath+'/'+url;
location.replace(url);
}
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 processSectionSelect() {
$.post(ext.contextPath + "/user/processSection/getProcessSection4Select.do", { companyId: companyId }, function (data) {
var select = $("#processSection").select2({
data: data,
cache: false,
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' })
select.val('').trigger("change");
select.on("select2:select", function (e) {
dosearch();
});
}, 'json');
}
var beginTimeStore2 = '';
var endTimeStore2 = '';
function initDate() {
//定义locale汉化插件
beginTimeStore2 = moment().subtract(1, 'month').format('YYYY-MM-DD');
endTimeStore2 = moment().subtract(0, 'month').format('YYYY-MM-DD');
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})
};
$(function() {
processSectionSelect();
initDate();
$("#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: 5, // 页面数据条数
pageNumber: 1, // 首页页码
sidePagination: 'server', // 设置为服务器端分页
responseHandler:responseHandler, //在渲染页面数据之前执行的方法,此配置很重要!!!!!!!
queryParams: function (params) { // 请求服务器数据时发送的参数可以在这里添加额外的查询参数返回false则终止请求
processid=$("#processSection").val();
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: [
{
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 '-';
}
}
},{
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' // 上下居中
}
],
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: 5, // 页面数据条数
pageNumber: 1, // 首页页码
sidePagination: 'server', // 设置为服务器端分页
queryParams: function (params) { // 请求服务器数据时发送的参数可以在这里添加额外的查询参数返回false则终止请求
processid=$("#processSection").val();
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: [
{
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: '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: '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 '-';
}
}
}
],
onLoadSuccess: function(){ //加载成功时执行
adjustBootstrapTableView("table1");
},
onLoadError: function(){ //加载失败时执行
console.info("加载数据失败");
}
});
$("#table2").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: 5, // 页面数据条数
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("table2");
},
onLoadError: function(){ //加载失败时执行
console.info("加载数据失败");
}
});
//统计信息-异常处理率
doInspection("Err", 0, 0);
//统计信息-报警处理率
doInspection("Alrm", 0, 1);
$("#tableEqu").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: 22, // 页面数据条数
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: [
{
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: 'equipmentstatus', // 返回json数据中的name
title: '状态', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle',
formatter: function (value, row, index) {
switch (value){
case '${Status_OFF}' :
return "封存";
case '${Status_ON}' :
return "在用";
case '${Status_Fault}' :
return "故障";
case '${Status_Transfer}' :
return "调拨";
case '${Status_Scrap}' :
return "报废";
case '${Status_STOP}' :
return "停用";
default :
return "";
}
}
}
],
onLoadSuccess: function(){ //加载成功时执行
adjustBootstrapTableView("table2");
},
onLoadError: function(){ //加载失败时执行
console.info("加载数据失败");
}
});
});
</script>
</head>
<body onload="initMenu()" class="hold-transition ${cu.themeclass} sidebar-mini">
<div class="wrapper">
<!-- 引用top -->
<%--<jsp:include page="/jsp/top.jsp"></jsp:include>--%>
<!-- 菜单栏 -->
<%--<jsp:include page="/jsp/left.jsp"></jsp:include>--%>
<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-refresh"></i> </a></li>
</ol>
</section>
<!-- Main content -->
<section class="content container-fluid">
<div id="mainAlertdiv"></div>
<div id="subDiv"></div>
<div id="menu4SelectDiv"></div>
<div calss="row">
<div class="col-md-2">
<div class="box box-white box-top">
<div class="box-header">
<h4 class="box-title">统计信息</h4>
<div class="box-tools "></div>
<!-- /.box-tools -->
</div>
<div class="box-border">
<div class="box-border-left"></div>
<div class="box-border-right"></div>
</div>
<!-- /.box-header -->
<div class="box-body" style="height:90%;">
<div class="handle-title font-blue">异常处理率</div>
<dl class="dl-horizontal">
<dt class="lable-left">异常处理量:</dt>
<dd class="lable-right">0</dd>
<dt class="lable-left">异常目标处理量:</dt>
<dd class="lable-right">0</dd>
<dt class="lable-left">异常处理率:</dt>
<dd class="lable-right">0%</dd>
</dl>
<div class="row">
<div class="col-md-12" id="Err"></div>
</div>
<div class="handle-title font-yellow">报警处理率</div>
<dl class="dl-horizontal">
<dt class="lable-left">报警总数量:</dt>
<dd class="lable-right">0</dd>
<dt class="lable-left">已解除报警量:</dt>
<dd class="lable-right">0</dd>
<dt class="lable-left">报警处理率:</dt>
<dd class="lable-right">0%</dd>
</dl>
<div class="row">
<div class="col-md-12" id="Alrm"></div>
</div>
</div>
<!-- /.box-body -->
</div>
<div class="box box-white box-bottom">
<div class="box-header">
<h4 class="box-title">现场监控</h4>
<div class="box-tools ">
<select class="form-control select-blue">
<option>监控区域1</option>
</select>
</div>
<!-- /.box-tools -->
</div>
<div class="box-border">
<div class="box-border-left"></div>
<div class="box-border-right"></div>
</div>
<!-- /.box-header -->
<div class="box-body" style="height:90%;">
<div class="row">
<div class="col-md-12"></div>
</div>
</div>
<!-- /.box-body -->
</div>
</div>
<div class="col-md-7">
<div class="box box-white box-top">
<div class="box-header">
<h4 class="box-title">工艺流程</h4>
<div class="box-tools-left "></div>
<!-- /.box-tools -->
</div>
<div class="box-border">
<div class="box-border-left"></div>
<div class="box-border-right"></div>
</div>
<!-- /.box-header -->
<div class="box-body" style="height:90%;">
<img alt="" style=" width: 100%; " src="<%=request.getContextPath()%>/IMG/gy.jpg">
<a class="btn btn-primary monitor" href="javascript:doLoad('work/mpoint/overviewMonitor.do');"
role="button"><i class="fa fa-video-camera"></i> 实时监控</a>
</div>
<!-- /.box-body -->
</div>
<div class="nav-tabs-custom box-bottom">
<ul class="nav nav-tabs">
<li class="active"><a href="#tab_1" data-toggle="tab">工艺运行KPI</a></li>
<li><a href="#tab_2" data-toggle="tab">缺陷管理</a></li>
<li><a href="#tab_3" data-toggle="tab">报警统计</a></li>
<!-- <li><a href="#tab_4" data-toggle="tab">报警详情</a></li> -->
<li class="pull-right">
<div class="btn-toolbar" role="toolbar" aria-label="...">
<!-- <div class="btn-group" role="group" aria-label="...">
<a class="btn btn-default" href="#" role="button">年</a>
</div>
<div class="btn-group" role="group" aria-label="...">
<a class="btn btn-primary" href="#" role="button">月</a>
</div>
<div class="btn-group" role="group" aria-label="...">
<a class="btn btn-default" href="#" role="button">日</a>
</div>
<div class="btn-group" role="group" aria-label="...">
<select class="form-control">
<option>2020-02</option>
</select>
</div>
<div class="btn-group" role="group" aria-label="...">
<a class="btn btn-primary" href="#" role="button">确定</a>
</div> -->
</div>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="tab_1">
<table class="table table-striped table-condensed" id="table">
<!-- <thead>
<tr>
<th data-width="30px" data-align="center">
<input type="checkbox" name="checkall" class="checkbox"
onclick="selectAll('cids',this.checked);">
</th>
<th data-width="30%">工艺运行关键KPI</th>
<th data-width="20%">目标值</th>
<th data-width="20%">实际值</th>
<th data-width="20%">评价</th>
<th data-width="8%">曲线</th>
</tr>
</thead> -->
</table>
</div>
<!-- /.tab-pane -->
<div class="tab-pane" id="tab_2">
<table class="table table-striped table-condensed" id="table1"></table>
</div>
<!-- /.tab-pane -->
<div class="tab-pane" id="tab_3">
<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 class="table table-striped table-condensed" id="table2"></table>
</div>
<!-- /.tab-pane -->
<div class="tab-pane" id="tab_4">
</div>
<!-- /.tab-pane -->
</div>
<!-- /.tab-content -->
</div>
<!-- nav-tabs-custom -->
</div>
<div class="col-md-3">
<div class="box box-white box-right">
<div class="box-header">
<h4 class="box-title">主要设备</h4>
<div class="box-tools-left "></div>
<!-- /.box-tools -->
</div>
<div class="box-border">
<div class="box-border-left"></div>
<div class="box-border-right"></div>
</div>
<!-- /.box-header -->
<div class="box-body" style="height:97%;">
<table class="table table-condensed">
<thead>
<tr>
<th>工艺段</th>
<th>
<select class="form-control input-xs select2 " id="processSection" name="processSection" style="width: 200px;">
</select>
</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<table class="table table-condensed" id="tableEqu">
</div>
<!-- /.box-body -->
</div>
</div>
</div>
</section>
<!-- /.content -->
</div>
<%--<jsp:include page="/jsp/bottom.jsp"></jsp:include>--%>
<%--<jsp:include page="/jsp/side.jsp"></jsp:include>--%>
</div>
</body>
</html>