Files
SIPAIIS_WMS_JSSW/WebRoot/jsp/process/dataVisualFormContainerEdit.jsp
2026-01-16 14:13:44 +08:00

758 lines
37 KiB
Plaintext
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<%@ page language="java" pageEncoding="UTF-8" %>
<link rel="stylesheet"
href="<%=request.getContextPath()%>/node_modules/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.min.css"/>
<script type="text/javascript"
src="<%=request.getContextPath()%>/node_modules/bootstrap-switch/dist/js/bootstrap-switch.min.js"
charset="utf-8"></script>
<style type="text/css">
</style>
<script type="text/javascript">
$(function () {
$('#colorContainer').colorpicker({format: null});
$('#colorContainer1').colorpicker({format: null});
$('#switchBtnUnitSt').bootstrapSwitch({
onText: '是',
offText: '否',
size: "small",
});
if ('${dataVisualForm.unitst}' == 'false') {
$('#switchBtnUnitSt').bootstrapSwitch('state', false, true);
} else if ('${dataVisualForm.unitst}' == 'true') {
$('#switchBtnUnitSt').bootstrapSwitch('state', true, true);
} else {
$('#switchBtnUnitSt').bootstrapSwitch('state', false, true);
}
$('#switchBtnTimeSt').bootstrapSwitch({
onText: '是',
offText: '否',
size: "small",
});
if ('${dataVisualForm.timest}' == 'false') {
$('#switchBtnTimeSt').bootstrapSwitch('state', false, true);
} else if ('${dataVisualForm.timest}' == 'true') {
$('#switchBtnTimeSt').bootstrapSwitch('state', true, true);
} else {
$('#switchBtnTimeSt').bootstrapSwitch('state', false, true);
}
$('#switchBtnSqlst').bootstrapSwitch({
onText: '开',
offText: '关',
size: "small",
onSwitchChange: function () {
//.prop方法查看input的checked属性即使查看其开关状态
var checkedOfAll = $("#switchBtnSqlst").prop("checked");
//false、true对应input的checked属性显示和隐藏输入框
if (checkedOfAll == false) {
$('#sqlcontentSt').css('display', 'none');
} else {
$('#sqlcontentSt').css('display', 'block');
}
}
});
if ('${dataVisualForm.sqlst}' == 'false') {
$('#switchBtnSqlst').bootstrapSwitch('state', false, true);
$('#sqlcontentSt').css('display', 'none');
} else if ('${dataVisualForm.sqlst}' == 'true') {
$('#switchBtnSqlst').bootstrapSwitch('state', true, true);
$('#sqlcontentSt').css('display', 'block');
} else {
$('#switchBtnSqlst').bootstrapSwitch('state', false, true);
}
$('#switchBtnRowStyleSt').bootstrapSwitch({
onText: '开',
offText: '关',
size: "small",
onSwitchChange: function () {
//.prop方法查看input的checked属性即使查看其开关状态
var checkedOfAll = $("#switchBtnRowStyleSt").prop("checked");
//false、true对应input的checked属性显示和隐藏输入框
if (checkedOfAll == false) {
$('#RowStyleSt').css('display', 'none');
} else {
$('#RowStyleSt').css('display', 'block');
}
}
});
if ('${dataVisualForm.rowst}' == 'false') {
$('#switchBtnRowStyleSt').bootstrapSwitch('state', false, true);
$('#RowStyleSt').css('display', 'none');
} else if ('${dataVisualForm.rowst}' == 'true') {
$('#switchBtnRowStyleSt').bootstrapSwitch('state', true, true);
$('#RowStyleSt').css('display', 'block');
} else {
$('#switchBtnRowStyleSt').bootstrapSwitch('state', false, true);
}
$(".select2-selection--single").css({'height': '30px', 'paddingTop': '4px'});//选中元素上下居中
var dataTextalign = JSON.parse("[{\"id\":\"center\",\"text\":\"居中\"},{\"id\":\"left\",\"text\":\"靠左\"},{\"id\":\"right\",\"text\":\"靠右\"}]");
var selectTextalign = $("#textalign").select2({
data: dataTextalign,
placeholder: '请选择',//默认文字提示
allowClear: false,//允许清空
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;
} // 函数用于呈现当前的选择
});
// select.on("change", function (e) {
//
// });
selectTextalign.val('${dataVisualForm.textalign}').trigger("change");//设置选中
var dataverticalalign = JSON.parse("[{\"id\":\"center\",\"text\":\"居中\"},{\"id\":\"top\",\"text\":\"顶部\"},{\"id\":\"bottom\",\"text\":\"底部\"}]");
var selectverticalalign = $("#verticalalign").select2({
data: dataverticalalign,
placeholder: '请选择',//默认文字提示
allowClear: false,//允许清空
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;
} // 函数用于呈现当前的选择
});
// select.on("change", function (e) {
//
// });
selectverticalalign.val('${dataVisualForm.verticalalign}').trigger("change");//设置选中
var datavaluemethod = JSON.parse("[{\"id\":\"nowTime\",\"text\":\"nowTime\"},{\"id\":\"sum\",\"text\":\"sum\"},{\"id\":\"diff\",\"text\":\"diff\"},{\"id\":\"avg\",\"text\":\"avg\"},{\"id\":\"max\",\"text\":\"max\"},{\"id\":\"min\",\"text\":\"min\"},{\"id\":\"first\",\"text\":\"first\"},{\"id\":\"last\",\"text\":\"last\"}]");
var selectvaluemethod = $("#valuemethod").select2({
data: datavaluemethod,
placeholder: '请选择',//默认文字提示
allowClear: false,//允许清空
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;
} // 函数用于呈现当前的选择
});
selectvaluemethod.val('${dataVisualForm.valuemethod}').trigger("change");//设置选中
var datatimeframe = JSON.parse("[{\"id\":\"none\",\"text\":\"无\"},{\"id\":\"hour\",\"text\":\"小时\"},{\"id\":\"nowday\",\"text\":\"今日\"},{\"id\":\"yesterday\",\"text\":\"昨日\"},{\"id\":\"week\",\"text\":\"周\"},{\"id\":\"month\",\"text\":\"月\"},{\"id\":\"year\",\"text\":\"年\"},{\"id\":\"3year\",\"text\":\"历史\"},{\"id\":\"yoy\",\"text\":\"同比\"},{\"id\":\"mom\",\"text\":\"环比\"}]");
var selecttimeframe = $("#timeframe").select2({
data: datatimeframe,
placeholder: '请选择',//默认文字提示
allowClear: false,//允许清空
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;
} // 函数用于呈现当前的选择
});
selecttimeframe.val('${dataVisualForm.timeframe}').trigger("change");//设置选中
$("#formSqlPointTable").bootstrapTable({ // 对应table标签的id
url: ext.contextPath + '/process/dataVisualFormSqlPoint/getList.do', // 获取表格数据的url
cache: false, // 设置为 false 禁用 AJAX 数据缓存, 默认为true
striped: true, //表格显示条纹默认为false
pagination: true, // 在表格底部显示分页组件默认false
pageList: [10, 20, 50], // 设置页面可以显示的数据条数
pageSize: 50, // 页面数据条数
pageNumber: 1, // 首页页码
paginationDetailHAlign: ' hidden',//去除分页的显示
sidePagination: 'server', // 设置为服务器端分页
queryParams: function (params) { // 请求服务器数据时发送的参数可以在这里添加额外的查询参数返回false则终止请求
return {
rows: params.limit, // 每页要显示的数据条数
page: params.offset / params.limit + 1, // 每页显示数据的开始页码
sort: params.sort, // 要排序的字段
order: params.order,
pid: '${dataVisualForm.id}'
}
},
// onClickRow: function (row) {//单击行事件,执行查看功能
// viewFun(row.id);
// },
sortName: 'morder', // 要排序的字段
sortOrder: 'asc', // 排序规则
columns: [
{
field: 'name', // 返回json数据中的name
title: '名称', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle',
formatter: function (value, row, index) {
let html = "<input style='width: 240px;' id=\"" + row.id + "_FormSqlPointName\" value=\"" + row.name + "\" onchange=\"changeFormSqlPointName('" + row.id + "');\" />";
return html;
}
}, {
title: "操作",
align: 'center',
valign: 'middle',
width: 120, // 定义列的宽度单位为像素px
formatter: function (value, row, index) {
var buts = "";
buts += '<button class="btn btn-default btn-sm" type="button" title="删除" onclick="deleteFormSqlPointFun(\'' + row.id + '\')"><i class="fa fa fa-trash-o"></i><span class="hidden-md hidden-lg">删除</span></button';
buts = '<div class="btn-group" >' + buts + '</div>';
return buts;
}
}
],
onLoadSuccess: function () { //加载成功时执行
adjustBootstrapTableView("formSqlPointTable");
},
onLoadError: function () { //加载失败时执行
console.info("加载数据失败");
},
onReorderRow: function (newData) {
//这里的newData是整个表格数据数组形式
// console.log("data",newData); //调试用代码
$.post(ext.contextPath + '/process/dataVisualFormSqlPoint/dosort.do', {jsondata: JSON.stringify(newData)},//将整张表数据 不能分页
function (data) {
if (data == 1) {
// $("#formSqlPointTable").bootstrapTable('refresh');
} else {
showAlert('d', '数据错误', 'mainAlertdiv');
}
});
}
});
$("#formSqlPointTable").tableDnD();
$("#formRowStyleTable").bootstrapTable({ // 对应table标签的id
url: ext.contextPath + '/process/dataVisualFormShowStyle/getList.do', // 获取表格数据的url
cache: false, // 设置为 false 禁用 AJAX 数据缓存, 默认为true
striped: true, //表格显示条纹默认为false
pagination: true, // 在表格底部显示分页组件默认false
pageList: [10, 20, 50], // 设置页面可以显示的数据条数
pageSize: 50, // 页面数据条数
pageNumber: 1, // 首页页码
paginationDetailHAlign: ' hidden',//去除分页的显示
sidePagination: 'server', // 设置为服务器端分页
queryParams: function (params) { // 请求服务器数据时发送的参数可以在这里添加额外的查询参数返回false则终止请求
return {
rows: params.limit, // 每页要显示的数据条数
page: params.offset / params.limit + 1, // 每页显示数据的开始页码
sort: params.sort, // 要排序的字段
order: params.order,
pid: '${dataVisualForm.id}'
}
},
// onClickRow: function (row) {//单击行事件,执行查看功能
// viewFun(row.id);
// },
sortName: 'morder', // 要排序的字段
sortOrder: 'asc', // 排序规则
columns: [
{
field: 'ckmethod', // 返回json数据中的name
title: '比较方式', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle'
}, {
field: 'ckcontent', // 返回json数据中的name
title: '比较内容', // 表格表头显示文字
align: 'center', // 左右居中
valign: 'middle'
}, {
title: "操作",
align: 'center',
valign: 'middle',
width: 120, // 定义列的宽度单位为像素px
formatter: function (value, row, index) {
var buts = "";
buts += '<button class="btn btn-default btn-sm" type="button" title="编辑" onclick="editRowStyleFun(\'' + row.id + '\')"><i class="fa fa-edit"></i><span class="hidden-md hidden-lg"> 编辑</span></button>';
buts += '<button class="btn btn-default btn-sm" type="button" title="删除" onclick="deleteRowStyleFun(\'' + row.id + '\')"><i class="fa fa fa-trash-o"></i><span class="hidden-md hidden-lg">删除</span></button';
buts = '<div class="btn-group" >' + buts + '</div>';
return buts;
}
}
],
onLoadSuccess: function () { //加载成功时执行
adjustBootstrapTableView("formSqlPointTable");
},
onLoadError: function () { //加载失败时执行
console.info("加载数据失败");
},
onReorderRow: function (newData) {
//这里的newData是整个表格数据数组形式
// console.log("data",newData); //调试用代码
$.post(ext.contextPath + '/process/dataVisualFormShowStyle/dosort.do', {jsondata: JSON.stringify(newData)},//将整张表数据 不能分页
function (data) {
if (data == 1) {
// $("#formSqlPointTable").bootstrapTable('refresh');
} else {
showAlert('d', '数据错误', 'mainAlertdiv');
}
});
}
});
$("#formRowStyleTable").tableDnD();
})
function docontainerEditSave() {
$("#containerEditSubForm").bootstrapValidator('validate');//提交验证
if ($("#containerEditSubForm").data('bootstrapValidator').isValid()) {//获取验证结果,如果成功,执行下面代码
var oldwidth = $('#oldwidth').val();
var oldheight = $('#oldheight').val();
let form = $("#containerEditSubForm").serialize() + "&oldwidth=" + oldwidth + "&oldheight=" + oldheight + "&frameId=${param.contentId}";
const unitStStatus = $('#switchBtnUnitSt').bootstrapSwitch('state');
if (unitStStatus) {
form = form + "&unitst=true";
} else {
form = form + "&unitst=false";
}
const timeStStatus = $('#switchBtnTimeSt').bootstrapSwitch('state');
if (timeStStatus) {
form = form + "&timest=true";
} else {
form = form + "&timest=false";
}
const sqlstStatus = $('#switchBtnSqlst').bootstrapSwitch('state');
if (sqlstStatus) {
form = form + "&sqlst=true";
} else {
form = form + "&sqlst=false";
}
const rowStyleStatus = $('#switchBtnRowStyleSt').bootstrapSwitch('state');
if (rowStyleStatus) {
form = form + "&rowst=true";
} else {
form = form + "&rowst=false";
}
$.post(ext.contextPath + "/process/dataVisualForm/doTdupdate.do", form, function (data) {
closeModal('containerFormSubModal');
$.post(ext.contextPath + "/process/dataVisualContent/getOneJson.do", {id: '${param.contentId}'}, function (contentData) {
contentData = contentData[0];
if (contentData.istab == 'true') {
showOneContent(contentData.id, 'tab');
} else {
showOneContent(contentData.id);
}
// showOneContent('${param.contentId}');
}, 'json');
}, 'json');
}
}
function selectmpid() {
$.post(ext.contextPath + '/work/mpoint/mpointListSingle4LayerES.do', {
// mpids: mpids,
mpids: '',
fucname: 'ckmpidDone'
}, function (data) {
$("#mpSelectDiv").html(data);
openModal('subModalMpoint');
});
}
function ckmpidDone(data) {
data = JSON.parse(data);
console.log(data)
$('#containerEditSubForm #mpid').val(data[0].mpid);
closeModal('subModalMpoint');
}
function addFormSqlPointFun() {
$.post(ext.contextPath + "/process/dataVisualFormSqlPoint/dosave.do", {pid: '${dataVisualForm.id}'}, function (data) {
if (data.code == 1) {
$("#formSqlPointTable").bootstrapTable('refresh');
} else if (data.code == 0) {
showAlert('d', '保存失败');
} else {
showAlert('d', data.res);
}
}, 'json');
}
function deleteFormSqlPointFun(id) {
stopBubbleDefaultEvent();
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/dataVisualFormSqlPoint/dodelete.do', {id: id}, function (data) {
if (data.code == "1") {
$("#formSqlPointTable").bootstrapTable('refresh');
} else {
showAlert('d', '删除失败', 'mainAlertdiv');
}
}, 'json');
}
});
}
function changeFormSqlPointName(id) {
let name = $('#' + id + '_FormSqlPointName').val();
$.post(ext.contextPath + "/process/dataVisualFormSqlPoint/updateName.do", {
id: id,
name: name
}, function (data) {
if (data.code == 1) {
} else if (data.code == 0) {
showAlert('d', '保存失败');
} else {
showAlert('d', data.res);
}
}, 'json');
}
function addFormShowStyleFun() {
$.post(ext.contextPath + '/process/dataVisualFormShowStyle/doadd.do', {
pid: '${dataVisualForm.id}'
}, function (data) {
$("#formShowStyleDiv").html(data);
openModal('formShowStyleSubModal');
});
}
function editRowStyleFun(id) {
stopBubbleDefaultEvent();
$.post(ext.contextPath + '/process/dataVisualFormShowStyle/doedit.do', {id: id}, function (data) {
$("#formShowStyleDiv").html(data);
openModal('formShowStyleSubModal');
});
}
function deleteRowStyleFun(id) {
stopBubbleDefaultEvent();
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/dataVisualFormShowStyle/dodelete.do', {id: id}, function (data) {
if (data.code == "1") {
$("#formRowStyleTable").bootstrapTable('refresh');
} else {
showAlert('d', '删除失败', 'mainAlertdiv');
}
}, 'json');
}
});
}
</script>
<div class="modal fade" id="containerFormSubModal">
<div class="modal-dialog" style="width: 1200px;">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span></button>
<h4 class="modal-title">编辑</h4>
</div>
<div class="modal-body" style="float: left;height: calc(100% - 60px);">
<form class="form-horizontal" id="containerEditSubForm" autocomplete="off">
<!-- 界面提醒div强制id为alertDiv -->
<div id="alertDiv"></div>
<input type="hidden" name="id" id="id" value="${dataVisualForm.id}"/>
<input type="hidden" name="insertcolumn" id="insertcolumn" value="${dataVisualForm.insertcolumn}"/>
<input type="hidden" name="columns" id="columns" value="${dataVisualForm.columns}"/>
<input type="hidden" name="insertrow" id="insertrow" value="${dataVisualForm.insertrow}"/>
<input type="hidden" name="rows" id="rows" value="${dataVisualForm.rows}"/>
<div class="col-sm-6">
<div class="form-group">
<label class="col-sm-2 control-label">宽</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="width" name="width" placeholder="宽"
value="${dataVisualForm.width}">
<input type="hidden" class="form-control" id="oldwidth" name="oldwidth" placeholder="宽"
value="${dataVisualForm.width}">
</div>
<label class="col-sm-2 control-label">高</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="height" name="height" placeholder="高"
value="${dataVisualForm.height}">
<input type="hidden" class="form-control" id="oldheight" name="oldheight"
placeholder="高"
value="${dataVisualForm.height}">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">背景颜色</label>
<div class="col-sm-4">
<div class="input-group" id="colorContainer">
<input name="background" id="background" type="text" class="form-control"
placeholder="背景颜色"
value="${dataVisualForm.background}">
<div class="input-group-addon">
<i></i>
</div>
</div>
</div>
<label class="col-sm-2 control-label">边距</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="padding" name="padding"
placeholder="边距"
value="${dataVisualForm.padding}">
</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="mpid" name="mpid" placeholder="测量点"
value="${dataVisualForm.mpid}" onclick="selectmpid();">
</div>
<label class="col-sm-2 control-label">显示单位</label>
<div class="col-sm-4">
<div class="switch" data-on="primary" data-off="info">
<input id="switchBtnUnitSt" type="checkbox"/>
</div>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">显示日期</label>
<div class="col-sm-4">
<div class="switch" data-on="primary" data-off="info">
<input id="switchBtnTimeSt" type="checkbox"/>
</div>
</div>
<label class="col-sm-2 control-label">日期位数</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="timestnum" name="timestnum"
placeholder="日期位数"
value="${dataVisualForm.timestnum}">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">计算方式</label>
<div class="col-sm-4">
<select class="form-control select2 " id="valuemethod" name="valuemethod"
style="width: 170px;"></select>
</div>
<label class="col-sm-2 control-label">时间范围</label>
<div class="col-sm-4">
<select class="form-control select2 " id="timeframe" name="timeframe"
style="width: 170px;"></select>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">接口数据</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="urldata" name="urldata"
placeholder="接口数据"
value="${dataVisualForm.urldata}">
</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="numtail" name="numtail"
placeholder="小数位"
value="${dataVisualForm.numtail}">
</div>
<label class="col-sm-2 control-label">系数</label>
<div class="col-sm-4">
<input type="text" class="form-control" id="rate" name="rate" placeholder="系数"
value="${dataVisualForm.rate}">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">文本内容</label>
<div class="col-sm-10">
<textarea id="textcontent" name="textcontent" style="width:100%;height:66px;"
wrap="soft">${dataVisualForm.textcontent}</textarea>
</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="fontsize" name="fontsize"
placeholder="文字大小"
value="${dataVisualForm.fontsize}">
</div>
<label class="col-sm-2 control-label">文字颜色</label>
<div class="col-sm-4">
<div class="input-group" id="colorContainer1">
<input name="fontcolor" id="fontcolor" type="text" class="form-control"
placeholder="文字颜色"
value="${dataVisualForm.fontcolor}">
<div class="input-group-addon">
<i></i>
</div>
</div>
</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="fontweight" name="fontweight"
placeholder="文字粗细"
value="${dataVisualForm.fontweight}">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">水平位置</label>
<div class="col-sm-4">
<select class="form-control select2 " id="textalign" name="textalign"
style="width: 170px;"></select>
</div>
<label class="col-sm-2 control-label">垂直位置</label>
<div class="col-sm-4">
<select class="form-control select2 " id="verticalalign" name="verticalalign"
style="width: 170px;"></select>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">边框样式</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="border" name="border"
placeholder="边框样式"
value="${dataVisualForm.border}">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">边框弧度</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="borderradius" name="borderradius"
placeholder="边框弧度"
value="${dataVisualForm.borderradius}">
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">样式</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="style" name="style" placeholder="样式"
value="${dataVisualForm.style}">
</div>
</div>
</div>
<div class="col-sm-6">
<div class="form-group">
<label class="col-sm-2 control-label">sql开关</label>
<div class="col-sm-4">
<div class="switch" data-on="primary" data-off="info">
<input id="switchBtnSqlst" type="checkbox"/>
</div>
</div>
</div>
<div id="sqlcontentSt" style="display: none;">
<div class="form-group">
<label class="col-sm-2 control-label">sql内容</label>
<div class="col-sm-10">
<textarea id="sqlcontent" name="sqlcontent" style="width:100%;height:120px;"
wrap="soft">${dataVisualForm.sqlcontent}</textarea>
</div>
</div>
<div class="form-group">
<div class="btn-group" style="width: 220px;padding-bottom:10px;">
<button type="button" class="btn btn-default" onclick="addFormSqlPointFun();"><i
class="fa fa-plus"></i> 新增
</button>
</div>
<table id="formSqlPointTable" data-use-row-attr-func="true"
data-reorderable-rows="true"></table>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">行样式</label>
<div class="col-sm-4">
<div class="switch" data-on="primary" data-off="info">
<input id="switchBtnRowStyleSt" type="checkbox"/>
</div>
</div>
</div>
<div id="RowStyleSt" style="display: none;">
<div class="btn-group" style="width: 220px;padding-bottom:10px;">
<button type="button" class="btn btn-default" onclick="addFormShowStyleFun();"><i
class="fa fa-plus"></i> 新增
</button>
</div>
<table id="formRowStyleTable" data-use-row-attr-func="true"
data-reorderable-rows="true"></table>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default pull-left" data-dismiss="modal">关闭</button>
<button type="button" class="btn btn-primary" onclick="docontainerEditSave()" id="btn_save">保存</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>