提交 559fda9a 编写于 作者: Skyeye云's avatar Skyeye云

表格组件完善

上级 656dbe59
......@@ -26,13 +26,13 @@ layui.config({
</div>
</div>`,
'titleBox': `<div class="layui-form-item layui-col-xs12">
<label class="layui-form-label">标题</label>
<label class="layui-form-label">标题</label>
<div class="layui-input-block">
<input type="text" id="title" name="title" placeholder="请输入标题" class="layui-input" />
</div>
</div>`,
'placeholderBox': `<div class="layui-form-item layui-col-xs12">
<label class="layui-form-label">提示语</label>
<label class="layui-form-label">提示语</label>
<div class="layui-input-block winui-radio">
<input type="text" id="placeholder" name="placeholder" placeholder="请输入控件提示语" class="layui-input" />
</div>
......@@ -44,7 +44,7 @@ layui.config({
</div>
</div>`,
'defaultValueBox': `<div class="layui-form-item layui-col-xs12">
<label class="layui-form-label">默认值</label>
<label class="layui-form-label">默认值</label>
<div class="layui-input-block">
<input type="text" id="defaultValue" name="defaultValue" placeholder="请输入默认值" class="layui-input" />
</div>
......@@ -94,7 +94,7 @@ layui.config({
</div>
</div>`,
'isEditBox': `<div class="layui-form-item layui-col-xs12">
<label class="layui-form-label">是否可以编辑</label>
<label class="layui-form-label">是否可以编辑</label>
<div class="layui-input-block" id="isEdit">
</div>
......@@ -136,10 +136,34 @@ layui.config({
</div>`,
'tableAttrBox': `<div class="layui-form-item layui-col-xs12">
<label class="layui-form-label">表格属性<i class="red">*</i></label>
<div class="layui-input-block" id="attrTransformTableList" data-json="[]">
<div class="layui-input-block" data="[]">
<button id="attrTransformTableListConfig" type="button" class="winui-toolbtn">属性配置</button>
</div>
</div>`,
'minDataBox': `<div class="layui-form-item layui-col-xs12">
<label class="layui-form-label">最小数据行数:</label>
<div class="layui-input-block">
<input type="text" id="minData" name="minData" placeholder="请输入最小数据行数" class="layui-input" />
</div>
</div>`,
'deleteRowCallbackBox': `<div class="layui-form-item layui-col-xs12">
<label class="layui-form-label" style="width: 60%;">删除行之后的回调函数:</label>
<div class="layui-input-block" script="">
<button id="deleteRowCallbackConfig" type="button" class="winui-toolbtn writeScript">编写脚本</button>
</div>
</div>`,
'addRowCallbackBox': `<div class="layui-form-item layui-col-xs12">
<label class="layui-form-label" style="width: 60%;">新增行之后的回调函数:</label>
<div class="layui-input-block" script="">
<button id="addRowCallbackConfig" type="button" class="winui-toolbtn writeScript">编写脚本</button>
</div>
</div>`,
'afterScriptBox': `<div class="layui-form-item layui-col-xs12">
<label class="layui-form-label" style="width: 60%;">组件加载完成后执行的脚本:</label>
<div class="layui-input-block" script="">
<button id="afterScriptConfig" type="button" class="winui-toolbtn writeScript">编写脚本</button>
</div>
</div>`,
};
// 详情类布局才展示的组件属性
var detailsPageAttr = ['attrKeyBox', 'titleBox', 'widthBox'];
......@@ -193,7 +217,7 @@ layui.config({
$("#attrKey").val('');
}
}
$("#attrTransformTableList").attr('data-json', JSON.stringify([]));
$("#attrTransformTableListConfig").parent().attr('data-json', JSON.stringify([]));
});
// 宽度
......@@ -224,17 +248,34 @@ layui.config({
// 表格属性的属性配置
var attrTransformTableList = isNull(data.attrTransformTableList) ? '[]' : JSON.stringify(data.attrTransformTableList);
$("#attrTransformTableListConfig").attr('data', attrTransformTableList);
$("#attrTransformTableListConfig").parent().attr('data', attrTransformTableList);
$("#minData").val(data.minData);
$("#deleteRowCallbackConfig").parent().attr('script', data.deleteRowCallback);
$("#addRowCallbackConfig").parent().attr('script', data.addRowCallback);
$("#afterScriptConfig").parent().attr('script', data.afterScript);
$("body").on("click", "#attrTransformTableListConfig", function() {
parent.temData = $("#attrTransformTableListConfig").attr('data');
parent.temData = $("#attrTransformTableListConfig").parent().attr('data');
parent._openNewWindows({
url: "../../tpl/dsFormPage/editPageContentIsTable.html?attrKey=" + $("#attrKey").val() + '&className=' + parent.className,
title: '表格属性配置',
pageId: "editPageContentIsTable",
area: ['90vw', '90vh'],
callBack: function (refreshCode) {
$("#attrTransformTableListConfig").attr('data', parent.temData);
$("#attrTransformTableListConfig").parent().attr('data', parent.temData);
}});
});
$("body").on("click", ".writeScript", function() {
var id = $(this).attr("id");
parent.scriptData = $(this).parent().attr('script');
parent._openNewWindows({
url: "../../tpl/dsFormPage/editPageContentIsScript.html",
title: '编写脚本',
pageId: "editPageContentIsScript",
area: ['90vw', '90vh'],
callBack: function (refreshCode) {
$(`#${id}`).parent().attr('script', parent.scriptData);
}});
});
......@@ -274,7 +315,12 @@ layui.config({
newParams.chooseOrNotEmail = $("#chooseOrNotEmail").val();
newParams.checkType = $("#checkType").val();
newParams.attrTransformTableList = isNull($("#attrTransformTableListConfig").attr('data')) ? [] : JSON.parse($("#attrTransformTableListConfig").attr('data'));
newParams.attrTransformTableList = isNull($("#attrTransformTableListConfig").parent().attr('data')) ? []
: JSON.parse($("#attrTransformTableListConfig").parent().attr('data'));
newParams.minData = $("#minData").val();
newParams.deleteRowCallback = $("#deleteRowCallbackConfig").parent().attr('script');
newParams.addRowCallback = $("#addRowCallbackConfig").parent().attr('script');
newParams.afterScript = $("#afterScriptConfig").parent().attr('script');
if (!isNull($("#attrKey").val())) {
newParams.attrDefinition = getInPoingArr(parent.attrList, 'attrKey', $("#attrKey").val());
......
layui.config({
base: basePath,
version: skyeyeVersion
}).extend({
window: 'js/winui.window'
}).define(['window', 'jquery', 'winui', 'form'].concat(dsFormUtil.mastHaveImport), function (exports) {
winui.renderColor();
var index = parent.layer.getFrameIndex(window.name);
var $ = layui.$,
form = layui.form;
$("#scriptContent").val(parent.scriptData);
var jsEditor = CodeMirror.fromTextArea(document.getElementById("scriptContent"), codeUtil.getConfig('text/javascript'));
matchingLanguage();
form.render();
form.on('submit(formWriteBean)', function (data) {
if (winui.verifyForm(data.elem)) {
parent.scriptData = encodeURIComponent(jsEditor.getValue());
parent.layer.close(index);
parent.refreshCode = '0';
}
return false;
});
$("body").on("click", "#cancle", function() {
parent.layer.close(index);
});
});
\ No newline at end of file
......@@ -16,6 +16,10 @@ layui.config({
// 对齐方式
var alignmentData = skyeyeClassEnumUtil.getEnumDataListByClassName("alignment");
var rowNum = 1;
$.each(tableDataList, function (i, item) {
item["id"] = rowNum;
rowNum++;
});
var parentAttrKey = GetUrlParam("attrKey");
var parentClassName = GetUrlParam("className");
......@@ -73,6 +77,10 @@ layui.config({
_html += `</select>`;
return _html;
}},
{ field: 'layFilter', title: '表单监听Filter', align: 'left', width: 120, templet: function (d) {
return `<input type="text" id="layFilter${d.id}" placeholder="表单监听Filter" cus-id="${d.id}" class="layui-input tableInput" ` +
`value="` + (isNull(d.layFilter) ? "" : d.layFilter) + `"/>`;
}},
{ field: 'width', title: '宽度<i class="red">*</i>', align: 'left', width: 120, templet: function (d) {
return `<input type="text" id="width${d.id}" placeholder="请填写宽度" cus-id="${d.id}" class="layui-input tableInput" win-verify="required|number" ` +
`value="` + (isNull(d.width) ? "" : d.width) + `"/>`;
......@@ -94,19 +102,23 @@ layui.config({
}},
{ field: 'dataFrom', title: '数据源', align: 'left', width: 200, templet: function (d) {
var disabledClass = d.showType == showType[2].id ? '' : 'layui-btn-disabled';
var params = {};
var btnName = '选择数据源';
if (!isNull(d.dataType)) {
params = {
dataType: d.dataType,
defaultData: d.defaultData,
objectId: d.objectId,
businessApi: d.businessApi,
};
btnName = '更换数据源';
}
var data = JSON.stringify(params);
return `<button id="dataFrom${d.id}" type="button" cus-id="${d.id}" class="chooseDataFrom ${disabledClass}" data="${data}">${btnName}</button>`;
return `<button id="dataFrom${d.id}" type="button" cus-id="${d.id}" class="chooseDataFrom ${disabledClass}">${btnName}</button>`;
}},
{ field: 'value', title: '默认值', align: 'left', width: 120, templet: function (d) {
return `<input type="text" id="value${d.id}" placeholder="默认值" cus-id="${d.id}" class="layui-input tableInput" ` +
`value="` + (isNull(d.value) ? "" : d.value) + `"/>`;
}},
{ field: 'className', title: 'class属性', align: 'left', width: 120, templet: function (d) {
return `<input type="text" id="className${d.id}" placeholder="class属性" cus-id="${d.id}" class="layui-input tableInput" ` +
`value="` + (isNull(d.className) ? "" : d.className) + `"/>`;
}},
{ field: 'iconClassName', title: 'ICON的class属性', align: 'left', width: 150, templet: function (d) {
return `<input type="text" id="iconClassName${d.id}" placeholder="ICON的class属性" cus-id="${d.id}" class="layui-input tableInput" ` +
`value="` + (isNull(d.iconClassName) ? "" : d.iconClassName) + `"/>`;
}},
]]
......@@ -129,8 +141,22 @@ layui.config({
}
$.each(tableDataList, function (i, item) {
// 限制条件
var require = isNull(item.require) ? '' : item.require.toString();
skyeyeClassEnumUtil.showEnumDataListByClassName("verificationParams", 'verificationSelect', "require" + item.id, require, form, null, 'formerRequirement');
// 数据源
var params = {};
if (!isNull(item.dataType)) {
params = {
dataType: item.dataType,
defaultData: item.defaultData,
objectId: item.objectId,
businessApi: item.businessApi,
};
}
var data = JSON.stringify(params);
$(`#dataFrom${item.id}`).attr("data", data);
});
soulTable.render(this);
......
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link href="../../assets/lib/layui/css/layui.css" rel="stylesheet" />
<link href="../../assets/lib/winui/css/winui.css" rel="stylesheet" />
<link href="../../assets/lib/layui/css/codemirror.css" rel="stylesheet" />
</head>
<body>
<div style="margin: 0 auto; padding: 20px;">
<form class="layui-form" action="" id="showForm" autocomplete="off">
<div class="layui-form-item layui-col-xs12" id="tableBox">
<label class="layui-form-label">脚本<i class="red">*</i></label>
<div class="layui-input-block">
<textarea id="scriptContent"></textarea>
</div>
</div>
<div class="layui-form-item layui-col-xs12">
<div class="layui-input-block">
<button class="winui-btn" id="cancle"><language showName="com.skyeye.cancel"></language></button>
<button class="winui-btn" lay-submit lay-filter="formWriteBean"><language showName="com.skyeye.save"></language></button>
</div>
</div>
</form>
</div>
<script src="../../assets/lib/layui/layui.js"></script>
<script src="../../assets/lib/layui/custom.js"></script>
<script type="text/javascript">
layui.config({base: '../../js/dsFormPage/'}).use('editPageContentIsScript');
</script>
</body>
</html>
\ No newline at end of file
......@@ -13,7 +13,7 @@ layui.config({
tableCheckBoxUtil = layui.tableCheckBoxUtil;
var checkType = '1';//工序选择类型:1.单选;2.多选
if (!isNull(parent.procedureCheckType)){
if (!isNull(parent.procedureCheckType)) {
checkType = parent.procedureCheckType;
}
......
......@@ -52,7 +52,7 @@ var initTableChooseUtil = {
' <button id="deleteRow' + newOptions.id + '" class="winui-toolbtn" type="button"><i class="fa fa-trash-o" aria-hidden="true"></i>删除行</button>' +
' </div>' +
' </div>' +
' <table class="layui-table">' +
' <table class="layui-table" style="width: auto">' +
' <thead>' +
' <tr id="header' + newOptions.id + '"></tr>' +
' </thead>' +
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册