From 8861bd04ff82a3fb3455123fd82386038c32fe76 Mon Sep 17 00:00:00 2001 From: ly19960718 <1622779752@qq.com> Date: Mon, 2 Aug 2021 10:27:21 +0800 Subject: [PATCH] =?UTF-8?q?=E8=A1=A8=E5=8D=95=E5=B8=83=E5=B1=80=20?= =?UTF-8?q?=E5=B1=9E=E6=80=A7=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ConfigTableRouteController.java | 9 +- .../templates/configtable/field-select.html | 283 ++++++++++++++++-- .../templates/configtable/list-field.html | 45 ++- 3 files changed, 295 insertions(+), 42 deletions(-) diff --git a/module-config-table/src/main/java/cn/com/tenlion/configtable/controller/route/configtable/ConfigTableRouteController.java b/module-config-table/src/main/java/cn/com/tenlion/configtable/controller/route/configtable/ConfigTableRouteController.java index eaad368..f36f471 100644 --- a/module-config-table/src/main/java/cn/com/tenlion/configtable/controller/route/configtable/ConfigTableRouteController.java +++ b/module-config-table/src/main/java/cn/com/tenlion/configtable/controller/route/configtable/ConfigTableRouteController.java @@ -46,10 +46,15 @@ public class ConfigTableRouteController extends DefaultBaseController { - @GetMapping("field") - public ModelAndView inputField() { + @GetMapping("field-select") + public ModelAndView fieldSelect() { String path = "configtable/field-select"; return new ModelAndView(path); } + @GetMapping("field-file") + public ModelAndView fieldFile() { + String path = "configtable/field-file"; + return new ModelAndView(path); + } } \ No newline at end of file diff --git a/module-config-table/src/main/resources/templates/configtable/field-select.html b/module-config-table/src/main/resources/templates/configtable/field-select.html index 8bf260d..fba1476 100644 --- a/module-config-table/src/main/resources/templates/configtable/field-select.html +++ b/module-config-table/src/main/resources/templates/configtable/field-select.html @@ -10,28 +10,108 @@ + + + - -
-
+ + + + + + + + +
+ 选项 +
+
+
-
-
    -
  • 网站设置
  • -
  • 用户管理
  • -
  • 权限分配
  • -
  • 商品管理
  • -
  • 订单管理
  • -
-
+
+ + +
+
+ +
+
+ +
+ +
+ +
+
+
+
+ +
+ +
+
+
+
+ +
+
+
+
+ +
+ +
+
+
+
+
+ + + + + + + + + + + + + + @@ -41,46 +121,183 @@ base: 'assets/layuiadmin/' //静态资源所在路径 }).extend({ index: 'lib/index' //主入口模块 - }).use(['index', 'form', 'laydate', 'laytpl', 'table'], function(){ + }).use(['index', 'form', 'laydate', 'laytpl', 'table','element'], function(){ var $ = layui.$; var form = layui.form; - var $win = $(window); var laytpl = layui.laytpl; - var table = layui.table; - var laydate = layui.laydate; + var element = layui.element var id = top.restAjax.params(window.location.href).id; + // 初始化数据字典下拉选择 + function initDataDictIdSelect(selectValue) { + top.restAjax.get(top.restAjax.path('api/data/listbyparentid/0', []), {}, null, function(code, data, args) { + laytpl(document.getElementById('dataDictIdSelectTemplate').innerHTML).render(data, function(html) { + document.getElementById('dataDictIdSelectTemplateBox').innerHTML = html; + }); + form.render('select', 'dataDictIdSelectTemplateBox'); + + var selectObj = {}; + selectObj['dataDictId'] = selectValue; + form.val('dataForm', selectObj); + }, function(code, data) { + top.dialog.msg(data.msg); + }); + } + + /* $('.attr').change(function () { + + })*/ - //alert(window.parent.aa) + //数据类型 + $('.buttonDiv .layui-btn').on('click', function(){ + $('.buttonDiv .layui-btn').removeClass('showButton') + $(this).addClass('showButton') + var optionType = $(this).attr("data-value"); + + if(optionType === '1'){ + $("#dataValue1").show(); + $("#dataValue2").hide() + $("#dataValue3").hide() + } + if(optionType === '2'){ + $("#dataValue1").hide(); + $("#dataValue2").show() + $("#dataValue3").hide() + } + if(optionType === '3'){ + $("#dataValue1").hide() + $("#dataValue2").hide() + $("#dataValue3").show() + } + }); - $('.attr').change(function () { - window.parent.setData("2",$(this).attr('name'),this.value); + //填加选项 + $("#addOption").on('click',function(){ + optionTemplate(); + }); + + function optionTemplate(optionData){ + var reg = new RegExp("\\[([^\\[\\]]*?)\\]", 'igm'); + var template = document.getElementById("optionTemplate").innerHTML; + var html = template.replace(reg, function (node, key) { + if(typeof(optionData) == "undefined"){ + return { 'optionKeyValue': '选项一', 'optionValueValue': '1'}[key]; + }else{ + return { 'optionKeyValue': optionData.optionKey, 'optionValueValue': optionData.optionValue}[key]; + } + }); + $("#optionDataDiv").append(html) + } + + + + //删除选项 + $(document).on('click','.optionRemove',function () { + $(this).parent().parent().remove() }) - // 初始化内容 - function initData() { - - - - + //获取选项数据 + function getOptionData(){ + var option = {}; + var type = $(".buttonDiv .showButton").attr('data-value'); + option['type'] = type; + option['data'] = ''; + if(type === '1'){ + var data = [] + $($("#optionDataDiv .layui-row")).each(function (i,e) { + var optionData = {} + $($(e).find("input")).each(function (i,e) { + var name = e.name; + if(name === 'optionKey'){ + optionData['optionKey'] = e.value + } + if(name === 'optionValue'){ + optionData['optionValue'] = e.value + } + }); + data.push(optionData) + }) + option['data'] = data + } + if(type === '2'){ + option['data'] = $("#dataDictId").val() + } + if(type === '3'){ + option['data'] = $("#optionPath").val() + } + return option } + + + + + // 初始化内容 initData(); + function initData() { + var custom = window.parent.getMapCustomData(id); + console.log(custom) + var optionData = custom.optionData; + if(optionData == undefined){ + $("#dataValue2").hide() + $("#dataValue3").hide() + initDataDictIdSelect(""); + } else { + var optionType = optionData.type; + if(optionType === '1'){ + $("#dataValue1").show(); + $("#dataValue2").hide() + $("#dataValue3").hide() + $(optionData.data).each(function (i,e) { + optionTemplate(e); + }) + } + if(optionType === '2'){ + $("#dataValue1").hide(); + $("#dataValue2").show() + $("#dataValue3").hide() + initDataDictIdSelect(optionData.data) + } + if(optionType === '3'){ + $("#dataValue1").hide() + $("#dataValue2").hide() + $("#dataValue3").show() + $("#optionPath").val(optionData.data) + } + + } + } + + + function saveConfig(){ + window.parent.setMapCustomData(id,'optionData',getOptionData()); + } + + + + + // 校验 form.verify({ - - - - }); - }); + + + window.onbeforeunload=function(e){ + saveConfig(); + } + + }) + + + + \ No newline at end of file diff --git a/module-config-table/src/main/resources/templates/configtable/list-field.html b/module-config-table/src/main/resources/templates/configtable/list-field.html index 37aa492..609cf11 100644 --- a/module-config-table/src/main/resources/templates/configtable/list-field.html +++ b/module-config-table/src/main/resources/templates/configtable/list-field.html @@ -54,6 +54,10 @@ .clearIn { clear: both !important; } + + + + @@ -325,6 +329,11 @@ function getMapBaseConfig(id){ return configMap.get(id).baseConfig; } + //根据id获取扩展配置 + function getMapCustomData(id){ + return configMap.get(id).customConfig; + } + //根据id获取配置 function getMapById(id){ @@ -569,7 +578,8 @@ configTableFieldPlaceholder:data[i].configTableFieldPlaceholder, configTableFieldDefault:data[i].configTableFieldDefault, configTableFieldId:data[i].configTableFieldId, - configTableFieldDisplay:data[i].configTableFieldDisplay + configTableFieldDisplay:data[i].configTableFieldDisplay, + configTableFieldType:data[i].configTableFieldType }, customConfig: { demo:'demo', @@ -581,17 +591,16 @@ // 排序 var container = document.getElementById("container"); var sort = Sortable.create(container, { - animation: 30, // ms, animation speed moving items when sorting, `0` — without animation + animation: 250, // ms, animation speed moving items when sorting, `0` — without animation handle: ".module1", // Restricts sort start click/touch to the specified element draggable: ".module1", // Specifies which items inside the element should be sortable onUpdate: function (evt){ - console.log(evt); - console.log(evt.item); - console.log(evt.nextSibling); + //console.log(evt); + //console.log(evt.item); + //console.log(evt.nextSibling); }, onChoose: function (evt) { - var path = top.restAjax.path('route/configtable/field?id={id}', [213]) - $('#attribute').attr('src',path) + setFieldAttributeHtml(evt.item.id) // 初始化基础数据 var dataFormData = getMapBaseConfig(evt.item.id); dataFormData.configTableFieldMust = dataFormData.configTableFieldMust == 1 ? true : false; @@ -663,6 +672,28 @@ } }); + + + + function setFieldAttributeHtml(id){ + var baseConfig = getMapBaseConfig(id); + if(typeof(baseConfig) != "undefined" || baseConfig != null || baseConfig != ''){ + var type = baseConfig['configTableFieldType']; + if(type === '2' || type === '3' || type === '4'){ + var path = top.restAjax.path('route/configtable/field-file?id={id}', [id,'file']) + $('#attribute').attr('src',path) + + }else if(type === '8' || type === '9'){ + var path = top.restAjax.path('route/configtable/field-select?id={id}', [id,'select']) + $('#attribute').attr('src',path) + }else{ + $('#attribute').attr('src',''); + } + } + + + } + // 校验 form.verify({ });