Files
SIPAIIS_WMS_JSSW/WebRoot/jsp/command/emergencyConfigureEdit4NS.jsp

766 lines
32 KiB
Plaintext
Raw 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" %>
<style type="text/css">
.select2-container .select2-selection--single {
height: 34px;
line-height: 34px;
}
.select2-selection__arrow {
margin-top: 3px;
}
</style>
<script type="text/javascript"
src="<%=request.getContextPath()%>/node_modules/bootstrap-switch/dist/js/bootstrap-switch.min.js"
charset="utf-8"></script>
<!--拖拽排序-->
<link rel="stylesheet"
href="<%=request.getContextPath()%>/plugins/bootstrap-table/extensions/reorder-rows/bootstrap-table-reorder-rows.css"/>
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/bootstrap-table/jquery.tablednd.js"
charset="utf-8"></script>
<script type="text/javascript"
src="<%=request.getContextPath()%>/plugins/bootstrap-table/extensions/reorder-rows/bootstrap-table-reorder-rows.js"
charset="utf-8"></script>
<script type="text/javascript">
var showMenu4SelectFun = function () {
$.post(ext.contextPath + '/command/emergencyConfigure/showMenu4Select_new.do', {
formId: "subForm",
hiddenId: "pid",
textId: "pname"
}, function (data) {
$("#menu4SelectDiv").html(data);
openModal("menu4SelectModal")
});
};
var showUser4SelectsFun = function () {
var userIds = $("#firstpersonid").val();
$.post(ext.contextPath + '/user/userForSelect.do', {
formId: "subForm",
hiddenId: "firstpersonid",
textId: "firstperson",
userIds: userIds
}, function (data) {
$("#user4SelectDiv").html(data);
openModal("user4SelectModal");
});
};
var showUser4SelectsFun1 = function () {
var userIds = $("#personliableid").val();
$.post(ext.contextPath + '/user/userForSelect.do', {
formId: "subForm_func",
hiddenId: "personliableid",
textId: "personliablename",
userIds: userIds
}, function (data) {
$("#user4SelectDiv").html(data);
openModal("user4SelectModal");
});
};
function dosave() {
//if ($("#subForm").form('validate')) {
$.post(ext.contextPath + "/command/emergencyConfigure/updateMenu_new.do", $("#subForm").serialize(), function (result) {
if (result == 1) {
showAlert('s', '保存成功');
} else {
showAlert('d', '保存失败');
}
});
//}
}
function saveDefault() {
if ($("#location").val() == '') {
showAlert('i', '请先填写菜单地址')
} else {
//if ($(".form").form('validate')) {
$.post(ext.contextPath + "/user/saveDefaultFunc.do", $("#subForm").serialize(), function (result) {
if (result > 0) {
$("#table").bootstrapTable('refresh');
} else {
showAlert('d', '默认权限添加失败', 'alertDiv_power');
}
});
//}
}
}
function dodel() {
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 + '/command/emergencyConfigure/deleteMenu_new.do', $("#subForm").serialize(), function (data) {
if (data.res > 0) {
initTreeView();
} else {
showAlert('d', '删除失败');
}
}, 'json');
}
});
}
function delPowerFun(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 + '/command/emergencyConfigure/deleteMenu.do', {id: id}, function (data) {
if (data.res > 0) {
$("#table").bootstrapTable('refresh');
} else {
showAlert('d', '删除失败', 'alertDiv_power');
}
}, 'json');
}
});
}
function delPowerFun1(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 + '/command/emergencyConfigureDetail/deleteMenu.do', {id: id}, function (data) {
if (data.res > 0) {
$("#table1").bootstrapTable('refresh');
} else {
showAlert('d', '删除失败', 'alertDiv_power');
}
}, 'json');
}
});
}
var addPowerFun = function () {
$.post(ext.contextPath + '/command/emergencyConfigure/showFuncAdd.do', {
pid: "${menu.id}",
unitId
}, function (data) {
$("#powerDiv").html(data);
openModal('powerModal')
});
};
var addPowerFun4NS = function () {
$.post(ext.contextPath + '/command/emergencyConfigure/showFuncAdd4NS.do', {
pid: "${menu.id}",
unitId
}, function (data) {
$("#powerDiv").html(data);
openModal('powerModal')
});
};
var editPowerFun4NS = function (id) {
$.post(ext.contextPath + '/command/emergencyConfigure/showFuncEdit4NS.do', {
id: id,
pid: "${menu.id}",
unitId
}, function (data) {
$("#powerDiv").html(data);
openModal('powerModal')
});
};
var editMemoFun = function (id) {
/*$.post(ext.contextPath + '/command/emergencyConfigure/editMemoFun.do', {
id: id,
pid: "
${menu.id}",
unitId
}, function (data) {
$("#powerDiv").html(data);
openModal('powerModal')
});*/
var url = '<%=request.getContextPath()%>/command/emergencyConfigure/dodrillEdit4NS.do?id=' + id + "&bizid=" + unitId;
if (confirm("将进入页面配置!")) {
window.open(url);
}
};
var addPowerFun1 = function () {
$.post(ext.contextPath + '/command/emergencyConfigureDetail/showFuncAdd.do', {
pid: "${menu.id}",
unitId
}, function (data) {
$("#powerDiv").html(data);
openModal('powerModal')
});
};
var editPowerFun1 = function (id) {
$.post(ext.contextPath + '/command/emergencyConfigureDetail/showFuncEdit.do', {
id: id,
pid: "${menu.id}",
unitId
}, function (data) {
$("#powerDiv").html(data);
openModal('powerModal')
});
};
function buttongd(id) {
$.post(ext.contextPath + '/command/emergencyConfigureWorkOrder/showlist.do', {id: id}, function (data) {
$("#powerDiv").html(data);
openModal('powerModal')
});
};
$(function () {
$("#st").select2({minimumResultsForSearch: -1}).val("${menu.st}").trigger("change");
$("#table").bootstrapTable({ // 对应table标签的id
url: ext.contextPath + '/command/emergencyConfigure/getFuncJson.do?id=${menu.id}', // 获取表格数据的url
cache: false, // 设置为 false 禁用 AJAX 数据缓存, 默认为true
striped: true, //表格显示条纹默认为false
pagination: true, // 在表格底部显示分页组件默认false
pageList: [10, 20, 50], // 设置页面可以显示的数据条数
pageSize: 50, // 页面数据条数
pageNumber: 1, // 首页页码
sidePagination: 'server', // 设置为服务器端分页
queryParams: function (params) { // 请求服务器数据时发送的参数可以在这里添加额外的查询参数返回false则终止请求
return {
rows: params.limit, // 每页要显示的数据条数
page: params.offset / params.limit + 1, // 每页显示数据的开始页码
sort: params.sort, // 要排序的字段
order: params.order // 排序规则
}
},
sortName: 'ord', // 要排序的字段
sortOrder: 'desc', // 排序规则
columns: [
{
field: 'contents', // 返回json数据中的name
title: '事项名称', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle',
width: '15%', // 上下居中
/*formatter: function(value,row,index){
return row.pname;
},*/
}, {
field: 'itemnumber', // 返回json数据中的name
title: '事项编号', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle',
width: '10%'
},
/*{
field: 'personliablename', // 返回json数据中的name
title: '负责人', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle',
width: '10%'
},*/
// {
// field: 'contentsdetail', // 返回json数据中的name
// title: '事项说明', // 表格表头显示文字
// align: 'center', // 左右居中
// valign: 'middle',
// width: '33%'
// },
{
field: 'rank', // 返回json数据中的name
title: '流程图层级', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle',
width: '10%'
},
{
field: 'startupcondition', // 返回json数据中的name
title: '启动条件', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle',
width: '8%'
}, {
field: 'planTime',
title: "预计时间(分钟)",
align: 'center',
valign: 'middle',
width: '10%'
/*formatter: function (value, row, index) {
return '<div class="btn-group"><button class="btn btn-default btn-sm" onclick="editPowerFun(\'' + row.id + '\')"><i class="fa fa-edit"></i></button>'+
'<button class="btn btn-default btn-sm" onclick="delPowerFun(\'' + row.id + '\')"><i class="fa fa-trash-o"></i></button></div>';
}*/
}, {
title: "操作",
align: 'center',
valign: 'middle',
width: '14%',
formatter: function (value, row, index) {
return '<div class="btn-group">' +
'<button class="btn btn-default btn-sm" onclick="editPowerFun4NS(\'' + row.id + '\')"><i class="fa fa-edit"></i></button>' +
'<button class="btn btn-default btn-sm" onclick="delPowerFun(\'' + row.id + '\')"><i class="fa fa-trash-o"></i></button>' +
'<button class="btn btn-default btn-sm" onclick="editMemoFun(\'' + row.id + '\')"><i class="fa fa-cog"></i></button>' +
'</div>';
}
}
],
onLoadSuccess: function (row) { //加载成功时执行
$(".bs-checkbox").css({'text-align': 'center', 'vertical-align': 'middle'})
},
onLoadError: function () { //加载失败时执行
console.info("加载数据失败");
},
//当拖拽结束后,整个表格的数据
onReorderRow: function (newData) {
//这里的newData是整个表格数据数组形式
//console.log(newData); 调试用代码
// $.post(ext.contextPath + '/command/emergencyConfigure/dosortnew.do',
// { jsondata: JSON.stringify(newData) },//将整张表数据Post当然先序列化成Json
// function (data) {
// if (data == 1) {
// $("#table").bootstrapTable('refresh');
// showAlert('s', '排序成功', 'mainAlertdiv');
// } else {
// showAlert('d', '数据错误', 'mainAlertdiv');
// }
// });
$.ajax({
type: 'post',
url: ext.contextPath + '/command/emergencyConfigure/dosortnew.do',
contentType: 'application/json;charset=utf-8',
data: JSON.stringify({jsondata: newData}),
success: function (data) {
console.log("data:", data)
if (data == 1) {
//成功
$("#table").bootstrapTable('refresh');
showAlert('s', '排序成功', 'mainAlertdiv');
} else {
//出错
showAlert('d', '数据错误', 'mainAlertdiv');
}
}, error: function (error) {
console.log("error", error);
}
});
}
})
//应急预案列表
$("#tableYN").bootstrapTable({ // 对应table标签的id
url: ext.contextPath + '/command/emergencyConfigure/getFuncJsonYN.do?id=${menu.id}', // 获取表格数据的url
cache: false, // 设置为 false 禁用 AJAX 数据缓存, 默认为true
striped: true, //表格显示条纹默认为false
pagination: true, // 在表格底部显示分页组件默认false
pageList: [10, 20, 50], // 设置页面可以显示的数据条数
pageSize: 50, // 页面数据条数
pageNumber: 1, // 首页页码
sidePagination: 'server', // 设置为服务器端分页
queryParams: function (params) { // 请求服务器数据时发送的参数可以在这里添加额外的查询参数返回false则终止请求
return {
rows: params.limit, // 每页要显示的数据条数
page: params.offset / params.limit + 1, // 每页显示数据的开始页码
sort: params.sort, // 要排序的字段
order: params.order // 排序规则
}
},
sortName: 'ord', // 要排序的字段
sortOrder: 'desc', // 排序规则
columns: [
{
field: 'name', // 返回json数据中的name
title: '名称', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle',
width: '50%'
},
{
field: 'ord', // 返回json数据中的name
title: '顺序', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle',
width: '50%'
}
],
onLoadSuccess: function (row) { //加载成功时执行
$(".bs-checkbox").css({'text-align': 'center', 'vertical-align': 'middle'})
},
onLoadError: function () { //加载失败时执行
console.info("加载数据失败");
},
//当拖拽结束后,整个表格的数据
/*onReorderRow: function (newData) {
$.ajax({
type: 'post',
url: ext.contextPath + '/command/emergencyConfigure/dosortnew.do',
contentType: 'application/json;charset=utf-8',
data: JSON.stringify({jsondata: newData}),
success: function (data) {
console.log("data:", data)
if (data == 1) {
//成功
$("#tableYN").bootstrapTable('refresh');
showAlert('s', '排序成功', 'mainAlertdiv');
} else {
//出错
showAlert('d', '数据错误', 'mainAlertdiv');
}
}, error: function (error) {
console.log("error", error);
}
});
}*/
})
});
$(function () {
$("#st").select2({minimumResultsForSearch: -1}).val("${menu.st}").trigger("change");
$("#table1").bootstrapTable({ // 对应table标签的id
url: ext.contextPath + '/command/emergencyConfigureDetail/getFuncJson.do?id=${menu.id}', // 获取表格数据的url
cache: false, // 设置为 false 禁用 AJAX 数据缓存, 默认为true
striped: true, //表格显示条纹默认为false
pagination: true, // 在表格底部显示分页组件默认false
pageList: [10, 20, 50], // 设置页面可以显示的数据条数
pageSize: 50, // 页面数据条数
pageNumber: 1, // 首页页码
sidePagination: 'server', // 设置为服务器端分页
queryParams: function (params) { // 请求服务器数据时发送的参数可以在这里添加额外的查询参数返回false则终止请求
return {
rows: params.limit, // 每页要显示的数据条数
page: params.offset / params.limit + 1, // 每页显示数据的开始页码
sort: params.sort, // 要排序的字段
order: params.order // 排序规则
}
},
sortName: 'id', // 要排序的字段
sortOrder: 'desc', // 排序规则
columns: [
{
field: 'triggertype', // 返回json数据中的name
title: '触发类型', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle',
width: 100, // 上下居中
}, {
field: 'triggernumber', // 返回json数据中的name
title: '触发数值', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle',
width: 120, // 上下居中
/*formatter: function(value,row,index){
return row.pname;
},*/
}, {
field: 'mpid', // 返回json数据中的name
title: '测量点', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle',
width: 120, // 上下居中
}, {
field: 'mpname',
title: "测量点名称",
align: 'center',
valign: 'middle',
width: 300, // 定义列的宽度单位为像素px
/*formatter: function (value, row, index) {
return '<div class="btn-group"><button class="btn btn-default btn-sm" onclick="editPowerFun(\'' + row.id + '\')"><i class="fa fa-edit"></i></button>'+
'<button class="btn btn-default btn-sm" onclick="delPowerFun(\'' + row.id + '\')"><i class="fa fa-trash-o"></i></button></div>';
}*/
}, {
field: 'type', // 返回json数据中的name
title: '类型', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle',
width: 120, // 上下居中
}, {
title: "操作",
align: 'center',
valign: 'middle',
width: 240, // 定义列的宽度单位为像素px
formatter: function (value, row, index) {
return '<div class="btn-group"><button class="btn btn-default btn-sm" onclick="editPowerFun1(\'' + row.id + '\')"><i class="fa fa-edit"></i></button>' +
'<button class="btn btn-default btn-sm" onclick="delPowerFun1(\'' + row.id + '\')"><i class="fa fa-trash-o"></i></button></div>';
}
}
],
onLoadSuccess: function (row) { //加载成功时执行
$(".bs-checkbox").css({'text-align': 'center', 'vertical-align': 'middle'})
},
onLoadError: function () { //加载失败时执行
console.info("加载数据失败");
}
})
});
$(function () {
$("#st").select2({minimumResultsForSearch: -1}).val("${menu.st}").trigger("change");
$("#table2").bootstrapTable({ // 对应table标签的id
url: ext.contextPath + '/command/emergencyConfigure/getFuncJson2.do?id=${menu.id}', // 获取表格数据的url
cache: false, // 设置为 false 禁用 AJAX 数据缓存, 默认为true
striped: true, //表格显示条纹默认为false
pagination: true, // 在表格底部显示分页组件默认false
pageList: [10, 20, 50], // 设置页面可以显示的数据条数
pageSize: 50, // 页面数据条数
pageNumber: 1, // 首页页码
sidePagination: 'server', // 设置为服务器端分页
queryParams: function (params) { // 请求服务器数据时发送的参数可以在这里添加额外的查询参数返回false则终止请求
return {
rows: params.limit, // 每页要显示的数据条数
page: params.offset / params.limit + 1, // 每页显示数据的开始页码
sort: params.sort, // 要排序的字段
order: params.order // 排序规则
}
},
sortName: 'id', // 要排序的字段
sortOrder: 'desc', // 排序规则
columns: [
{
field: 'grade', // 返回json数据中的name
title: '应急预案等级', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle',
width: 100, // 上下居中
}, {
field: 'name', // 返回json数据中的name
title: '名称', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle',
width: 120, // 上下居中
/*formatter: function(value,row,index){
return row.pname;
},*/
}
],
onLoadSuccess: function () { //加载成功时执行
$(".bs-checkbox").css({'text-align': 'center', 'vertical-align': 'middle'})
},
onLoadError: function () { //加载失败时执行
console.info("加载数据失败");
}
})
});
function doprocess(category) {
window.open(ext.contextPath + '/command/emergencyConfigure/doprocess.do?id=${menu.id}&category=' + category, window, 'width=' + (window.screen.availWidth - 10) + ',height=' + (window.screen.availHeight - 60) + ',top=0,left=0,toolbar=no,menubar=no,scrollbars=yes,resizable=no,location=no,status=no', true);
}
function doprocess3(category) {
window.open(ext.contextPath + '/command/emergencyConfigure/doprocess3.do?id=${menu.id}&category=' + category, window, 'width=' + (window.screen.availWidth - 10) + ',height=' + (window.screen.availHeight - 60) + ',top=0,left=0,toolbar=no,menubar=no,scrollbars=yes,resizable=no,location=no,status=no', true);
}
function dodrill() {
window.open(ext.contextPath + '/command/emergencyConfigure/dodrill.do?id=${menu.id}', window, 'width=' + (window.screen.availWidth - 10) + ',height=' + (window.screen.availHeight - 60) + ',top=0,left=0,toolbar=no,menubar=no,scrollbars=yes,resizable=no,location=no,status=no', true);
}
</script>
<div id="powerDiv"></div>
<div id="powerDiv1"></div>
<div id="powerDiv2"></div>
<div id="alertDiv"></div>
<div id="'alertDiv_del'"></div>
<div id="menu4SelectDiv"></div>
<div id="user4SelectDiv"></div>
<div class="box box-primary">
<div class="box-header with-border">
<h3 class="box-title">详情</h3>
<div class="box-tools pull-right">
<%--<c:if test="${tags=='2'}">
<a onclick="doprocess('2');" class="btn btn-box-tool" data-toggle="tooltip" title="流程"><i
class="glyphicon glyphicon-asterisk"></i></a>
</c:if>--%>
<a onclick="dosave()" class="btn btn-box-tool" data-toggle="tooltip" title="保存"><i
class="glyphicon glyphicon-floppy-disk"></i></a>
<a onclick="dodel()" class="btn btn-box-tool" data-toggle="tooltip" title="删除"><i
class="glyphicon glyphicon-trash"></i></a>
</div>
</div>
<div class="box-body ">
<form class="form-horizontal " id="subForm">
<input id="id" name="id" type="hidden" value="${menu.id}"/>
<input id="bizid" name="bizid" type="hidden" value="${bizid}"/>
<input id="tags" name="tags" type="hidden" value="${tags}"/>
<!-- 界面提醒div强制id为alertDiv -->
<div class="form-group">
<label class="col-sm-2 control-label">名称</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="name" name="name" placeholder="名称"
value="${menu.name }">
</div>
<label class="col-sm-2 control-label">上级菜单</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="pname" name="pname" placeholder="上级菜单"
onclick="showMenu4SelectFun();" value="${menu.pname}">
<input id="pid" name="pid" type="hidden" value="${menu.pid}"/>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">顺序</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="ord" name="ord" placeholder="顺序" value="${menu.ord}">
</div>
<label class="col-sm-2 control-label">启用</label>
<div class="col-sm-4">
<select id="st" name="st" class="form-control select2">
<option value="启用">启用</option>
<option value="禁用">禁用</option>
</select>
</div>
</div>
<div class="form-group">
<c:if test="${tags=='2'}">
<label class="col-sm-2 control-label">等级</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="grade" name="grade" placeholder="等级"
value="${menu.grade}">
</div>
<label class="col-sm-2 control-label">总负责人</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="firstperson" name="firstperson" placeholder="总负责人"
value="${menu.firstperson}" onclick="showUser4SelectsFun();">
<input id="firstpersonid" name="firstpersonid" type="hidden"/>
</div>
</c:if>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">总体介绍</label>
<div class="col-sm-4">
<textarea name="memo" class="form-control">${menu.memo }</textarea>
</div>
<label class="col-sm-2 control-label">启动条件</label>
<div class="col-sm-4">
<textarea name="startingcondition" class="form-control">${menu.startingcondition }</textarea>
</div>
</div>
<div class="form-group">
</div>
</form>
</div>
</div>
<!-- 预案列表 -->
<c:if test="${tags=='1' || tags=='2'}">
<div class="box box-solid">
<div class="box-header with-border">
<h3 class="box-title">预案列表</h3>
</div>
<div class="box-body ">
<div>
<div></div>
<%--<div class="btn-group" style="width: 220px;padding-bottom:10px;">
<button type="button" class="btn btn-default" onclick="addYNFun();"><i class="fa fa-plus"></i>
新增
</button>
</div>--%>
<br>
<table id="tableYN" data-reorderable-rows="true" data-toggle="table"
data-use-row-attr-func="true">
</table>
</div>
</div>
</div>
</c:if>
<!-- 操作内容列表 -->
<c:if test="${tags=='3'}">
<div class="box box-solid">
<div class="box-header with-border">
<h3 class="box-title">操作内容列表</h3>
<%--<div class="box-tools pull-right">
<a onclick="doprocess('3');" class="btn btn-box-tool" data-toggle="tooltip" title="流程"><i
class="glyphicon glyphicon-asterisk"></i></a>
</div>--%>
</div>
<div class="box-body ">
<div>
<div></div>
<div class="btn-group" style="width: 220px;padding-bottom:10px;">
<button type="button" class="btn btn-default" onclick="addPowerFun4NS();"><i class="fa fa-plus"></i>
新增
</button>
</div>
<br>
<table id="table" data-reorderable-rows="true" data-toggle="table"
data-use-row-attr-func="true">
</table>
</div>
</div>
</div>
</c:if>