diff --git a/css/basic/fit_type_list.css b/css/basic/fit_type_list.css new file mode 100644 index 0000000..6b9bb65 --- /dev/null +++ b/css/basic/fit_type_list.css @@ -0,0 +1,61 @@ +#main-box { + width: 100%; + height: calc(100% - 180px); + box-sizing: border-box; + background-color: #fff; + border-radius: 5px; +} + +/*dtree样式设置*/ +[class^="dtree-icon-"], +[class*=" dtree-icon-"] { + font-size: 20px !important; +} + +.dtree-laySimple-item:hover { + background-color: #d2d2d2 !important; +} + +.dtree-laySimple-item cite { + font-size: 16px !important; +} + +.dtree-theme-item cite { + font-size: 16px !important; +} + +.dtree-theme-item:hover cite { + color: #1E9FFF !important; +} + +.dtree-nav-this cite { + color: #1E9FFF !important; +} + +.dtree-nav-div:hover cite { + opacity: 1 !important; +} + +.dtree-toolbar .layui-nav-child dd a i { + color: #1E9FFF !important; +} + +.dtree-toolbar-fixed a i { + color: #1E9FFF !important; +} + +.dtree-laySimple-item-this { + background-color: rgb(214 237 250) !important; +} + +.dtree-laySimple-item:hover { + background-color: rgb(214 237 250) !important; +} + +.dtree-theme-item:hover { + background-color: #d6edfa !important; +} + +.dtree-theme-item-this { + background-color: #d6edfa !important; +} \ No newline at end of file diff --git a/css/data_form.css b/css/data_form.css index 2162e78..390fff8 100644 --- a/css/data_form.css +++ b/css/data_form.css @@ -59,4 +59,24 @@ body { line-height: 10px; font-size: 10px; color: #a29c9c; +} + +/**自定义滚动条样式 */ +::-webkit-scrollbar { + width: 6px; + height: 6px +} + +::-webkit-scrollbar-track { + background-color: transparent; + -webkit-border-radius: 2em; + -moz-border-radius: 2em; + border-radius: 2em; +} + +::-webkit-scrollbar-thumb { + background-color: #9c9da0; + -webkit-border-radius: 2em; + -moz-border-radius: 2em; + border-radius: 2em } \ No newline at end of file diff --git a/js/basic/child/fit_type_form.js b/js/basic/child/fit_type_form.js new file mode 100644 index 0000000..0fb3eed --- /dev/null +++ b/js/basic/child/fit_type_form.js @@ -0,0 +1,73 @@ +let form, layer; +let objParam; +function setParams(obj) { + objParam = JSON.parse(obj); + console.log(objParam); + $('#parentName').val(objParam.context); + $('#parentId').val(objParam.id); + if (objParam.type === 2) { // 新增 + $('#id').val(objParam.nodeId); + } + console.log(objParam); + layui.use(['form', 'layer'], function () { + form = layui.form; + layer = layui.layer; + form.verify(); + form.on('submit(formData)', function (data) { + submitApply(data); + }); + form.render(); + }); +} + +function saveData2() { + $('#formSubmit').trigger('click') +} + +// 提交 +function submitApply(data) { + console.log(data.field); + let loadingMsg = layer.msg('正在提交保存,请稍等...', { icon: 16, shade: 0.01, time: '0' }); + console.log(JSON.stringify(data.field)); + let url = ''; + if (objParam.type === 1) { // 新增 + url = dataUrl + 'backstage/paType/addTypeData'; + } else if (objParam.type === 2) { // 修改 + url = dataUrl + 'backstage/paType/updateTypeData'; + } + let params = { + encryptedData: JSON.stringify(data.field) + }; + ajaxRequest(url, 'POST', params, true, function () { + $('.save').addClass("layui-btn-disabled").attr("disabled", true); + $('.cancel').addClass("layui-btn-disabled").attr("disabled", true); + }, function (result) { + console.log(result); + layer.close(loadingMsg); + $('.save').removeClass("layui-btn-disabled").attr("disabled", false); + $('.cancel').removeClass("layui-btn-disabled").attr("disabled", false); + if (result.code === 200) { + parent.layer.msg(result.msg, { icon: 1 }); + closePage(1); + } else { + layer.msg(result.msg, { icon: 2 }); + } + }, function (xhr, status, error) { + layer.close(loadingMsg); // 关闭提示层 + layer.msg('服务异常，请稍后重试', { icon: 16, scrollbar: false, time: 2000 }); + $('.save').removeClass("layui-btn-disabled").attr("disabled", false); + $('.cancel').removeClass("layui-btn-disabled").attr("disabled", false); + errorFn(xhr, status, error) + }, null); +} + +// 关闭页面 +function closePage(type, obj) { + let index = parent.layer.getFrameIndex(window.name); + parent.layer.close(index); + if (type == 1) { + let json = { "id": obj.id, "title": obj.name, "parentId": obj.parentId, "level": obj.level }; + window.parent.reloadData(json) + } + +} \ No newline at end of file diff --git a/js/basic/fit_type_list.js b/js/basic/fit_type_list.js index e69de29..3cf7c67 100644 --- a/js/basic/fit_type_list.js +++ b/js/basic/fit_type_list.js @@ -0,0 +1,122 @@ +let form, layer, dtree, fitTypeTree, util, dtreeData = [], jsonData = null; +layui.config({ + base: "../../lib/layui-v2.9.18/layui/dtree/", //此处路径请自行处理, 可以使用绝对路径 +}).extend({ + dtree: 'dtree' +}).use(['form', 'layer', 'dtree', 'util'], function () { + layer = layui.layer; + form = layui.form; + dtree = layui.dtree; + util = layui.util; + form.render(); + dtreeData = getDTreeData(); + fitTypeTree = dtree.render({ + elem: "#fitTypeTree", + width: "98%", // 指定树的宽度 + dataFormat: "list", + none: "无数据", + menubar: true, + data: dtreeData, + line: true, // 显示树线 + toolbar: true, + menubarTips: { + group: [] + }, + toolbarWay: "follow", + toolbarShow: [], + toolbarFun: { + loadToolbarBefore: function (buttons, param, $div) { //（层级最多3级，一级配件类型，二级配件名称，三级规格型号） + if (param.level === '1') { + buttons.customEdit = ""; + buttons.customDel = ""; + } else if (param.level === '4') { // 三级规格型号 + buttons.customAdd = ""; + } + return buttons; // 将按钮对象返回 + }, + }, + toolbarExt: [{ + toolbarId: "customAdd", icon: "dtree-icon-roundadd", title: "新增", handler: function (node, $div) { + addOrEditFitType(1, node, $div); + } + }, + { + toolbarId: "customEdit", icon: "dtree-icon-bianji", title: "修改", handler: function (node, $div) { + addOrEditFitType(2, node, $div); + } + }, + { + toolbarId: "customDel", icon: "dtree-icon-roundclose", title: "删除", handler: function (node, $div) { + if (node.level === '2') { // 删除配件 + delAreaData(node.nodeId, node.parentId, '1', $div) + } else if (node.level === '3') { // 删除配件 + delAreaData(node.nodeId, node.parentId, '2', $div) + } + } + }], + done: function (result, $ul, first) { + + } + }); + dtree.on('node("areaTree")', function (obj) { + }); +}); + +/** + * 新增/修改 配件管理 + * */ +function addOrEditFitType(type, node, $div) { + let title = ''; + node.type = type; + if (type == 1) { + title = '新增'; + } else if (type == 2) { + title = '修改'; + } + console.log(node); + openIframeByDtree("fit_type_form", title, './child/fit_type_form.html', '40%', '50%', node, $div); +} + +// 赋值新增节点 +function reloadData(data) { + jsonData = data; +} + + +// 加载dtree数据 +function getDTreeData() { + let list = []; + let encryptedData = {}; + let url = dataUrl + 'backstage/paType/getTypeList?encryptedData=' + encodeURIComponent(JSON.stringify(encryptedData)); + ajaxRequest(url, "GET", null, false, function () { + }, function (result) { + console.log(result); + if (result.code === 200) { + if (result.data && result.data.length > 0) { + $.each(result.data, function (index, item) { + item.title = item.name; + list.push(item); + }) + } + } + }, function (xhr, status, error) { + errorFn(xhr, status, error) + }, null); + return list; +} + +// 查询、重置 +function queryDtree(type) { + if (type === 1) { + var keyWord = $("#keyWord").val(); + fitTypeTree.fuzzySearch(keyWord); + } else if (type === 2) { + $("#keyWord").val(''); + fitTypeTree.fuzzySearch(''); + } +} + +// 赋值新增节点 +function reloadData(data) { + jsonData = data; +} \ No newline at end of file diff --git a/js/openIframe.js b/js/openIframe.js index 745e1ee..a63162b 100644 --- a/js/openIframe.js +++ b/js/openIframe.js @@ -6,7 +6,7 @@ * height：高度 * params 参数 */ -function openIframeByParam(id, title, content, width, height,params) { +function openIframeByParam(id, title, content, width, height, params) { let layerIndex = layer.open({ id: id, type: 2, @@ -18,13 +18,13 @@ function openIframeByParam(id, title, content, width, height,params) { area: [width, height], move: false, success: function () { - if(params){ + if (params) { let iframeWin = window["layui-layer-iframe" + layerIndex]; iframeWin.setParams(params); } }, - cancel:function () {}, - end:function(){} + cancel: function () { }, + end: function () { } }); } @@ -36,7 +36,7 @@ function openIframeByParam(id, title, content, width, height,params) { * height：高度 * params 参数对象 */ -function openIframeByParamObj(id, title, content, width, height,paramsObj) { +function openIframeByParamObj(id, title, content, width, height, paramsObj) { let layerIndex = layer.open({ id: id, type: 2, @@ -48,17 +48,17 @@ function openIframeByParamObj(id, title, content, width, height,paramsObj) { area: [width, height], move: false, success: function () { - if(paramsObj){ + if (paramsObj) { let iframeWin = window["layui-layer-iframe" + layerIndex]; iframeWin.setParams(JSON.stringify(paramsObj)); } }, - cancel:function () {}, - end:function(){} + cancel: function () { }, + end: function () { } }); } -function openIframeByParamObj2(id, title, content, width, height,paramsObj) { +function openIframeByParamObj2(id, title, content, width, height, paramsObj) { let layerIndex = parent.layer.open({ id: id, type: 2, @@ -70,12 +70,44 @@ function openIframeByParamObj2(id, title, content, width, height,paramsObj) { area: [width, height], move: false, success: function () { - if(paramsObj){ + if (paramsObj) { let iframeWin = parent.window["layui-layer-iframe" + layerIndex]; iframeWin.setParams(JSON.stringify(paramsObj)); } }, - cancel:function () {}, - end:function(){} + cancel: function () { }, + end: function () { } + }); +} + + +/* dtree专用弹框 */ +function openIframeByDtree(id, title, content, width, height, params, $div) { + let layerIndex = layer.open({ + id: id, + type: 2, + title: ['
' + title + '
', 'font-size:16px;background-color:#f0f0f0;display: flex;align-items: center;'], + content: content, + shade: 0.3, + anim: 2, + shadeClose: false, + area: [width, height], + move: false, + success: function () { + let iframeWin = window["layui-layer-iframe" + layerIndex]; + iframeWin.setParams(JSON.stringify(params)); + }, + end: function () { + if (jsonData) { + if (params.id) { + // 修改节点 + areaTree.partialRefreshEdit($div, jsonData.title); + } else { + // 新增节点 + areaTree.partialRefreshAdd($div, jsonData); + } + jsonData = null; + } + } }); } \ No newline at end of file diff --git a/page/basic/child/fit_type_form.html b/page/basic/child/fit_type_form.html new file mode 100644 index 0000000..ceb967a --- /dev/null +++ b/page/basic/child/fit_type_form.html @@ -0,0 +1,65 @@ + + + + + + + 配件类型-新增/修改 + + + + + + + + +
+
+ + +
+
+ +
+ +
+
+
+
+
+ +
+ +
+
+
+
+
+ +
+ +
+
+
+ +
+
+
+ + +
+ + + + + + + \ No newline at end of file diff --git a/page/basic/fit_type_list.html b/page/basic/fit_type_list.html index fb9e3fb..5dc8e92 100644 --- a/page/basic/fit_type_list.html +++ b/page/basic/fit_type_list.html @@ -10,11 +10,46 @@ - + + +
+
+
+ 搜索信息 +
+
+
+
+
+ +
+
+ +
+ + + + +
+
+
+
+
+
+
    +
+
+
+