599 lines
20 KiB
Plaintext
599 lines
20 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"%>
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
<html:html lang="true">
|
|||
|
|
<head>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<title></title>
|
|||
|
|
|
|||
|
|
<meta http-equiv="pragma" content="no-cache">
|
|||
|
|
<meta http-equiv="cache-control" content="no-cache">
|
|||
|
|
<meta http-equiv="expires" content="0">
|
|||
|
|
|
|||
|
|
<link rel="stylesheet" href="<%=request.getContextPath()%>/CSS/comm2.css"/>
|
|||
|
|
<link rel="stylesheet" href="<%=request.getContextPath()%>/node_modules/snaker_resource/css/style.css"/>
|
|||
|
|
<link rel="stylesheet" href="<%=request.getContextPath()%>/node_modules/snaker_resource/css/snaker.css"/>
|
|||
|
|
<link href="<%=request.getContextPath()%>/node_modules/snaker_resource/bootstrap.css" rel="stylesheet"/>
|
|||
|
|
|
|||
|
|
<script src="<%=request.getContextPath()%>/node_modules/snaker_resource/js/jquery-1.8.3.min.js" type="text/javascript"></script>
|
|||
|
|
<script src="<%=request.getContextPath()%>/JS/echarts.js" type="text/javascript" ></script>
|
|||
|
|
<script src="<%=request.getContextPath()%>/node_modules/snaker_resource/bootstrap/2.2.2/js/bootstrap.min.js" type="text/javascript"></script>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<style type="text/css">
|
|||
|
|
#left {
|
|||
|
|
width: 40%;
|
|||
|
|
height: 100%;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
float: left;
|
|||
|
|
align: center;
|
|||
|
|
}
|
|||
|
|
#right {
|
|||
|
|
width: 60%;
|
|||
|
|
height: 100%;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
float: left;
|
|||
|
|
align: center;
|
|||
|
|
}
|
|||
|
|
#topdiv {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 50%;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
float: left;
|
|||
|
|
align: center;
|
|||
|
|
}
|
|||
|
|
#topdiv_top {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 20%;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
float: left;
|
|||
|
|
align: center;
|
|||
|
|
}
|
|||
|
|
#topdiv_under {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 80%;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
float: left;
|
|||
|
|
align: center;
|
|||
|
|
}
|
|||
|
|
#topdiv_left {
|
|||
|
|
width: 50%;
|
|||
|
|
height: 100%;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
float: left;
|
|||
|
|
align: center;
|
|||
|
|
border:1px solid #F7F7F7;
|
|||
|
|
}
|
|||
|
|
#topdiv_right {
|
|||
|
|
width: 50%;
|
|||
|
|
height: 100%;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
float: left;
|
|||
|
|
align: center;
|
|||
|
|
border:1px solid #F7F7F7;
|
|||
|
|
}
|
|||
|
|
.topdiv_right_content {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 50%;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
float: left;
|
|||
|
|
align: center;
|
|||
|
|
border:1px solid #F7F7F7;
|
|||
|
|
}
|
|||
|
|
#centerdiv {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 30%;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
float: left;
|
|||
|
|
align: center;
|
|||
|
|
}
|
|||
|
|
#underdiv {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 20%;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
float: left;
|
|||
|
|
align: center;
|
|||
|
|
}
|
|||
|
|
#underdiv_back {
|
|||
|
|
width: 15%;
|
|||
|
|
height: 30%;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
float: left;
|
|||
|
|
align: center;
|
|||
|
|
}
|
|||
|
|
#underdiv_center {
|
|||
|
|
width: 70%;
|
|||
|
|
height: 30%;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
float: left;
|
|||
|
|
align: center;
|
|||
|
|
}
|
|||
|
|
#underdiv_next {
|
|||
|
|
width: 15%;
|
|||
|
|
height: 30%;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
float: left;
|
|||
|
|
align: center;
|
|||
|
|
}
|
|||
|
|
.showechart{ margin:1 auto; width:98%; height:100%;}
|
|||
|
|
|
|||
|
|
</style>
|
|||
|
|
|
|||
|
|
<script type="text/javascript">
|
|||
|
|
|
|||
|
|
var mychart1 = null;
|
|||
|
|
var nodeArr = [];
|
|||
|
|
var nodeLine = [];
|
|||
|
|
|
|||
|
|
function echartdata(content){
|
|||
|
|
var jsonArray= ${jsonArray};//任务矩形json
|
|||
|
|
var titleName ='${titlename}';//标题
|
|||
|
|
nodeArr = [];
|
|||
|
|
for(var i = 0, len = jsonArray.length; i < len; i++) {
|
|||
|
|
if(content==jsonArray[i].contents){
|
|||
|
|
nodeArr.push({
|
|||
|
|
name: jsonArray[i].contents,
|
|||
|
|
id: jsonArray[i].id,
|
|||
|
|
x: jsonArray[i].contents_x,
|
|||
|
|
y: jsonArray[i].contents_y,
|
|||
|
|
value: jsonArray[i].contents,
|
|||
|
|
symbol:'rect',
|
|||
|
|
symbolSize: [90, 35],
|
|||
|
|
itemStyle: {
|
|||
|
|
normal: {
|
|||
|
|
color:'#836FFF'//节点背景色
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
label: {
|
|||
|
|
color: '#EEEE00'//字体颜色
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}else{
|
|||
|
|
nodeArr.push({
|
|||
|
|
name: jsonArray[i].contents,
|
|||
|
|
id: jsonArray[i].id,
|
|||
|
|
x: jsonArray[i].contents_x,
|
|||
|
|
y: jsonArray[i].contents_y,
|
|||
|
|
value: jsonArray[i].contents,
|
|||
|
|
symbol:'rect',
|
|||
|
|
symbolSize: [90, 35],
|
|||
|
|
itemStyle: {
|
|||
|
|
normal: {
|
|||
|
|
color:'#81c0ed'//节点背景色
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
label: {
|
|||
|
|
color: '#333333'//字体颜色
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
nodeLine = [];
|
|||
|
|
|
|||
|
|
for(var i = 0, len = jsonArray.length; i < len; i=i+1) {
|
|||
|
|
nodeLine.push({
|
|||
|
|
source: jsonArray[i].startLine+'',
|
|||
|
|
target: jsonArray[i].endLine+''
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
nodeLine.push({
|
|||
|
|
source: jsonArray.length,
|
|||
|
|
target: jsonArray.length+1
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
var res = {
|
|||
|
|
"start": {
|
|||
|
|
name: '启动',
|
|||
|
|
x: 500,
|
|||
|
|
y: 100,
|
|||
|
|
value: [],
|
|||
|
|
symbol:'circle', //让节点为矩形显示
|
|||
|
|
symbolSize: [50, 50],
|
|||
|
|
itemStyle: {
|
|||
|
|
normal: {
|
|||
|
|
color: '#22c3aa',
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
label: {
|
|||
|
|
color: '#333333'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
"nodes": nodeArr,
|
|||
|
|
"end": {
|
|||
|
|
name: '结束',
|
|||
|
|
x: 500,
|
|||
|
|
y: ${end_y},
|
|||
|
|
value: [],
|
|||
|
|
symbol:'circle', //让节点为矩形显示
|
|||
|
|
symbolSize: [50, 50],
|
|||
|
|
itemStyle: {
|
|||
|
|
normal: {
|
|||
|
|
color: '#CD3333',
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
label: {
|
|||
|
|
color: '#333333'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
var resLine = {
|
|||
|
|
"start": {
|
|||
|
|
source: 0,
|
|||
|
|
target: 1
|
|||
|
|
},
|
|||
|
|
"nodes": nodeLine,
|
|||
|
|
}
|
|||
|
|
//流程框解析
|
|||
|
|
function processGenerator(res) {
|
|||
|
|
var processArr = [];
|
|||
|
|
processArr[0] = res.start;
|
|||
|
|
for(var i = 0, len = res.nodes.length; i < len; i++) {
|
|||
|
|
processArr.push(res.nodes[i]);
|
|||
|
|
}
|
|||
|
|
processArr[res.nodes.length + 1] = res.end;
|
|||
|
|
return processArr;
|
|||
|
|
}
|
|||
|
|
//线条解析
|
|||
|
|
function processLinks(resLine) {
|
|||
|
|
var processArr = [];
|
|||
|
|
processArr[0] = resLine.start;
|
|||
|
|
for(var i = 0, len = resLine.nodes.length; i < len; i++) {
|
|||
|
|
processArr.push(resLine.nodes[i]);
|
|||
|
|
}
|
|||
|
|
//processArr[resLine.nodes.length + 1] = resLine.end;
|
|||
|
|
return processArr;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
mychart1 = echarts.init(document.getElementById('forceChart'));
|
|||
|
|
//echarts
|
|||
|
|
var forceOption = {
|
|||
|
|
title: {
|
|||
|
|
text: '',
|
|||
|
|
x:'center',
|
|||
|
|
y:'0',
|
|||
|
|
textStyle:{
|
|||
|
|
fontWeight:'normal',
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
tooltip: {},
|
|||
|
|
animationDurationUpdate: 1500,
|
|||
|
|
animationEasingUpdate: 'quinticInOut',
|
|||
|
|
series : [
|
|||
|
|
{
|
|||
|
|
type: 'graph',
|
|||
|
|
tooltip: {
|
|||
|
|
backgroundColor:'skyblue',
|
|||
|
|
formatter:'{b}<br/>{c}'
|
|||
|
|
},
|
|||
|
|
layout: 'none',
|
|||
|
|
symbolSize: 50,
|
|||
|
|
roam: false,//禁止用鼠标滚轮缩小放大效果
|
|||
|
|
label: {
|
|||
|
|
normal: {
|
|||
|
|
show: true
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
edgeSymbol: ['none', 'none'],
|
|||
|
|
edgeSymbolSize: [4, 10],
|
|||
|
|
edgeLabel: {
|
|||
|
|
normal: {
|
|||
|
|
textStyle: {
|
|||
|
|
fontSize: 20
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
data: processGenerator(res),
|
|||
|
|
links: processLinks(resLine),
|
|||
|
|
|
|||
|
|
lineStyle: {
|
|||
|
|
normal: {
|
|||
|
|
opacity: 0.9,
|
|||
|
|
//symbolSize: [0, 0],//箭头大小
|
|||
|
|
width: 1,
|
|||
|
|
curveness: 0
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
};
|
|||
|
|
//mychart1.clear();清楚缓存，重新加载新的 echart
|
|||
|
|
mychart1.setOption(forceOption);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//点击流程图的方法
|
|||
|
|
function nodeonclick(){
|
|||
|
|
mychart1.on('click', function (param){
|
|||
|
|
|
|||
|
|
//获取节点点击的数组序号
|
|||
|
|
var arrayIndex = param.dataIndex;
|
|||
|
|
if (param.dataType == 'node') {
|
|||
|
|
var id = nodeArr[arrayIndex-1].id;//根据下标获得数组中对应的id
|
|||
|
|
if(id != undefined){
|
|||
|
|
$.ajax({//type为区分上一步、下一步按钮 type=b为上一步 type=n为下一步 ext.contextPath + "/base/downloadFile.do?key="+id+"&tbName="+tbName
|
|||
|
|
|
|||
|
|
url:"<%=request.getContextPath()%>/command/importantConfigure/getDrillDataAjaxForTable.do?id="+id,
|
|||
|
|
type:'post',
|
|||
|
|
data:{type:'json'},
|
|||
|
|
success:function(res){
|
|||
|
|
var arr= JSON.parse(res);
|
|||
|
|
if(arr.length==0){
|
|||
|
|
alert('演练结束');
|
|||
|
|
//刷新流程图
|
|||
|
|
echartdata('结束');
|
|||
|
|
}else{
|
|||
|
|
//console.log(arr.length);
|
|||
|
|
if(arr.length==1){
|
|||
|
|
$("#tabletest").empty();//先将下面的td置空
|
|||
|
|
for(var i=0;i<arr.length;i++){
|
|||
|
|
var tr;
|
|||
|
|
tr='<td>'+arr[i].content+'</td>'+'<td>'+arr[i].contentsdetail+'</td>'+'<td>'+arr[i].personliablename+'</td>'
|
|||
|
|
$("#tabletest").append('<tr>'+tr+'</tr>')
|
|||
|
|
$("#rank").val(arr[0].rank);
|
|||
|
|
$("#detailid").val(arr[0].id);
|
|||
|
|
$("#startupcondition").val(arr[0].startupcondition);
|
|||
|
|
$("#itemnumber").val(arr[0].itemnumber);
|
|||
|
|
}
|
|||
|
|
//刷新流程图
|
|||
|
|
echartdata(arr[0].content);
|
|||
|
|
}else{
|
|||
|
|
console.log('进了弹窗方法');
|
|||
|
|
selectNodes(res);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
async:true//异步方式
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
}else {
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function dobutton(){
|
|||
|
|
/*
|
|||
|
|
上一步按钮
|
|||
|
|
*/
|
|||
|
|
$("#back").click(function(){
|
|||
|
|
var rankInt = $("#rank").val();
|
|||
|
|
var id = $("#id").val();
|
|||
|
|
var startupcondition = $("#startupcondition").val();
|
|||
|
|
$.ajax({
|
|||
|
|
//type为区分上一步、下一步按钮 type=b为上一步 type=n为下一步；rank为配置表中的层级
|
|||
|
|
url:"<%=request.getContextPath()%>/command/importantConfigure/getDrillDataAjax.do?type=b&rank="+rankInt+"&id="+id+"&startupcondition="+startupcondition,
|
|||
|
|
type:'post',
|
|||
|
|
data:{type:'json'},
|
|||
|
|
success:function(res){
|
|||
|
|
var arr= JSON.parse(res);
|
|||
|
|
$("#tabletest").empty();//先将下面的td置空
|
|||
|
|
|
|||
|
|
if(arr.length==0){
|
|||
|
|
alert('演练结束');
|
|||
|
|
//刷新流程图
|
|||
|
|
echartdata('启动');
|
|||
|
|
}else{
|
|||
|
|
for(var i=0;i<arr.length;i++){
|
|||
|
|
var tr;
|
|||
|
|
tr='<td>'+arr[i].content+'</td>'+'<td>'+arr[i].contentsdetail+'</td>'+'<td>'+arr[i].personliablename+'</td>'
|
|||
|
|
$("#tabletest").append('<tr>'+tr+'</tr>')
|
|||
|
|
$("#rank").val(arr[0].rank);
|
|||
|
|
$("#detailid").val(arr[0].id);
|
|||
|
|
$("#startupcondition").val(arr[0].startupcondition);
|
|||
|
|
$("#itemnumber").val(arr[0].itemnumber);
|
|||
|
|
}
|
|||
|
|
//刷新流程图
|
|||
|
|
echartdata(arr[0].content);
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
async:true
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
/*
|
|||
|
|
下一步按钮
|
|||
|
|
*/
|
|||
|
|
$("#next").click(function(){
|
|||
|
|
var rankInt = $("#rank").val();
|
|||
|
|
var itemnumber = $("#itemnumber").val();
|
|||
|
|
var id = $("#id").val();
|
|||
|
|
$.ajax({//type为区分上一步、下一步按钮 type=b为上一步 type=n为下一步
|
|||
|
|
url:"<%=request.getContextPath()%>/command/importantConfigure/getDrillDataAjax.do?type=n&rank="+rankInt+"&id="+id+"&itemnumber="+itemnumber,
|
|||
|
|
type:'post',
|
|||
|
|
data:{type:'json'},
|
|||
|
|
success:function(res){
|
|||
|
|
var arr= JSON.parse(res);
|
|||
|
|
if(arr.length==0){
|
|||
|
|
alert('演练结束');
|
|||
|
|
//刷新流程图
|
|||
|
|
echartdata('结束');
|
|||
|
|
}else{
|
|||
|
|
//console.log(arr.length);
|
|||
|
|
if(arr.length==1){
|
|||
|
|
$("#tabletest").empty();//先将下面的td置空
|
|||
|
|
for(var i=0;i<arr.length;i++){
|
|||
|
|
var tr;
|
|||
|
|
tr='<td>'+arr[i].content+'</td>'+'<td>'+arr[i].contentsdetail+'</td>'+'<td>'+arr[i].personliablename+'</td>'
|
|||
|
|
$("#tabletest").append('<tr>'+tr+'</tr>')
|
|||
|
|
$("#rank").val(arr[0].rank);
|
|||
|
|
$("#detailid").val(arr[0].id);
|
|||
|
|
$("#startupcondition").val(arr[0].startupcondition);
|
|||
|
|
$("#itemnumber").val(arr[0].itemnumber);
|
|||
|
|
}
|
|||
|
|
//刷新流程图
|
|||
|
|
echartdata(arr[0].content);
|
|||
|
|
}else{
|
|||
|
|
console.log('进了弹窗方法');
|
|||
|
|
selectNodes(res);
|
|||
|
|
//$('#next').popover('destroy');
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
async:true
|
|||
|
|
});
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//点击节点跳转到该节点
|
|||
|
|
function getbranch(detailid){
|
|||
|
|
var rankInt = $("#rank").val();
|
|||
|
|
var itemnumber = $("#itemnumber").val();
|
|||
|
|
var id = $("#id").val();//三级菜单的id
|
|||
|
|
$.ajax({//type为区分上一步、下一步按钮 type=b为上一步 type=n为下一步
|
|||
|
|
url:"<%=request.getContextPath()%>/command/importantConfigure/getDrillDataAjaxnext.do?type=n&rank="+rankInt+"&detailid="+detailid+"&itemnumber="+itemnumber,
|
|||
|
|
type:'post',
|
|||
|
|
data:{type:'json'},
|
|||
|
|
success:function(res){
|
|||
|
|
var arr= JSON.parse(res);
|
|||
|
|
if(arr.length==0){
|
|||
|
|
alert('演练结束');
|
|||
|
|
//刷新流程图
|
|||
|
|
echartdata('结束');
|
|||
|
|
}else{
|
|||
|
|
if(arr.length==1){
|
|||
|
|
$("#tabletest").empty();//先将下面的td置空
|
|||
|
|
for(var i=0;i<arr.length;i++){
|
|||
|
|
var tr;
|
|||
|
|
tr='<td>'+arr[i].content+'</td>'+'<td>'+arr[i].contentsdetail+'</td>'+'<td>'+arr[i].personliablename+'</td>'
|
|||
|
|
$("#tabletest").append('<tr>'+tr+'</tr>')
|
|||
|
|
$("#rank").val(arr[0].rank);
|
|||
|
|
$("#detailid").val(arr[0].id);
|
|||
|
|
$("#startupcondition").val(arr[0].startupcondition);
|
|||
|
|
$("#itemnumber").val(arr[0].itemnumber);
|
|||
|
|
}
|
|||
|
|
//刷新流程图
|
|||
|
|
echartdata(arr[0].content);
|
|||
|
|
$('#next').popover('hide');
|
|||
|
|
}else{
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
async:true
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function selectNodes(res){
|
|||
|
|
var arr= JSON.parse(res);
|
|||
|
|
|
|||
|
|
var ulstring = "<table class=\"table table-bordered\">";
|
|||
|
|
for(var i=0;i<arr.length;i++){
|
|||
|
|
var detailid = arr[i].id;
|
|||
|
|
ulstring +="<tr><td bgcolor=\"#81C0ED\" style=\"cursor:pointer;\" onclick=\"getbranch(\'"+detailid+"\')\">"+arr[i].content+"</td></tr>";
|
|||
|
|
}
|
|||
|
|
ulstring +="</table>";
|
|||
|
|
|
|||
|
|
$('#next').popover('destroy');//先注销弹窗
|
|||
|
|
$("#next").popover({
|
|||
|
|
trigger:'manual',//manual 触发方式
|
|||
|
|
placement : 'left',
|
|||
|
|
title:'<div style="text-align:left; color:gray; font-size:12px;">请选择下一步演练的节点</div>',
|
|||
|
|
html: 'true',
|
|||
|
|
content : ulstring, //这里可以直接写字符串，也可以 是一个函数，该函数返回一个字符串；
|
|||
|
|
animation: false
|
|||
|
|
}).on("mouseleave", function () {
|
|||
|
|
var _this = this;
|
|||
|
|
setTimeout(function () {
|
|||
|
|
if (!$(".popover:hover").length) {
|
|||
|
|
$(_this).popover("hide")
|
|||
|
|
}
|
|||
|
|
}, 100);
|
|||
|
|
});
|
|||
|
|
$("#next").popover('show'); //显示弹窗 不然冲突 弹窗需要点击2下
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
$(function() {
|
|||
|
|
//获取echart数据
|
|||
|
|
echartdata();
|
|||
|
|
//
|
|||
|
|
nodeonclick();
|
|||
|
|
//按钮点击
|
|||
|
|
dobutton();
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
</head>
|
|||
|
|
|
|||
|
|
<body>
|
|||
|
|
<input type="hidden" id="rank" name="rank" value="">
|
|||
|
|
<input type="hidden" id="id" name="id" value="${param.id}">
|
|||
|
|
<input type="hidden" id="detailid" name="detailid" value="">
|
|||
|
|
<input type="hidden" id="startupcondition" name="startupcondition" value="">
|
|||
|
|
<input type="hidden" id="itemnumber" name="itemnumber" value="">
|
|||
|
|
<div>
|
|||
|
|
<!--左边流程图的div-->
|
|||
|
|
<div id="left">
|
|||
|
|
<div id="forceChart" class="showechart"></div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<!--右边列表的div-->
|
|||
|
|
<div id="right">
|
|||
|
|
<!--上方的div 标题-->
|
|||
|
|
<div id="topdiv" style="text-align:center">
|
|||
|
|
<div id="topdiv_top">
|
|||
|
|
<table class="table table-striped table-hover table-condensed" >
|
|||
|
|
<tr>
|
|||
|
|
<th width="100%" bgcolor="#E0FFFF">${titlename}-异常事件演练</th>
|
|||
|
|
</tr>
|
|||
|
|
</table>
|
|||
|
|
</div>
|
|||
|
|
<div id="topdiv_under">
|
|||
|
|
<div id="topdiv_left">
|
|||
|
|
暂无图片
|
|||
|
|
</div>
|
|||
|
|
<div id="topdiv_right" style="text-align:left">
|
|||
|
|
<div class="topdiv_right_content"><strong>操作说明 : </strong>${meno}</div>
|
|||
|
|
<div class="topdiv_right_content"><strong>总负责人 : </strong>${_firstPerson}</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<!--中间列表div-->
|
|||
|
|
<div id="centerdiv">
|
|||
|
|
<table class="table table-striped table-hover table-condensed" >
|
|||
|
|
<tr>
|
|||
|
|
<th width="30%" bgcolor="#E0FFFF">操作内容</th>
|
|||
|
|
<th width="30%" bgcolor="#E0FFFF">操作详情</th>
|
|||
|
|
<th width="30%" bgcolor="#E0FFFF">负责人</th>
|
|||
|
|
</tr>
|
|||
|
|
<tbody id="tabletest">
|
|||
|
|
|
|||
|
|
</tbody>
|
|||
|
|
</table>
|
|||
|
|
</div>
|
|||
|
|
<!--下方的div 上一步 下一步-->
|
|||
|
|
<div id="underdiv">
|
|||
|
|
<div id="underdiv_back">
|
|||
|
|
<button id="back" type="button" class="btn btn-primary" data-toggle="button">
|
|||
|
|
上一步
|
|||
|
|
</button>
|
|||
|
|
</div>
|
|||
|
|
<div id="underdiv_center">
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<div id="underdiv_next">
|
|||
|
|
<button id="next" type="button" class="btn btn-primary" data-toggle="popover" >
|
|||
|
|
下一步
|
|||
|
|
</button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
</body>
|
|||
|
|
</html:html>
|
|||
|
|
<c:if test="${not empty msg}">
|
|||
|
|
<script type="text/javascript">
|
|||
|
|
alert("${msg}");
|
|||
|
|
</script>
|
|||
|
|
</c:if>
|