下载后,treeTable.js、treeTable.css 的放置目录分别为: layuiadmin/modules/treeTable.js layuiadmin/modules/treeTable/treeTable.css

页面元素:

定义:

layui.config({

base: '${ctxLayui}/layuiadmin/'

}).extend({

index: 'lib/index'

}).use(['index', 'table','dict','laydate','util','treeTable'], function(){

var $ = layui.$,table = layui.table,form = layui.form;

var dict = layui.dict;

var laydate = layui.laydate;

var admin = layui.admin;

var util = layui.util;

var treeTable = layui.treeTable;

渲染:

var insTb = treeTable.render({

elem: '#businessConfigListTable',

tree: {

iconIndex: 1, // 折叠图标显示在第几列

idName: 'id', // 自定义id字段的名称

pidName: 'parentId', // 自定义标识是否还有子节点的字段名称

},

cols: [

{type: 'checkbox', fixed: 'left'},

{type: 'numbers',width: 120,style:'text-align:left'},

// {field: 'id', title: 'ID',width: 180},

{field: 'type', title: '类型', width: 120,templet:tplType},

{field: 'name', title: '名称', width: 200},

{field: 'value', title: '值'},

{field: 'sortOrder', title: '排序', width: 120},

{field: 'status', title: '状态', width: 150,templet:tplStatus},

{title:'操作', toolbar: '#businessConfigListTable-bar', width:120}

],

reqData: function(data, callback) {

// 在这里写ajax请求,通过callback方法回调数据

var url = ctx+'/business/businessConfig/businessConfigTreeList';

var rtn = admin.syncReq(url,{});

var rtnData = rtn.data;

for(var i=0;i

var vo = rtnData[i];

vo.open = true;

}

callback(rtnData);

}

,height: 'full-99'

});

接口:business/businessConfig/businessConfigTreeList, 如下:

@RequestMapping(value = "businessConfigTreeList")

@ResponseBody

public BaseResp businessConfigTreeList(@ModelAttribute("command") BusinessConfigQo command){

BaseResp resp = new BaseResp();

try{

List list = businessConfigService.businessConfigTreeList(command);

resp.setData(list);

}catch (Exception e){

error(logger,resp,e);

}

return resp;

}

其中 BaseResp 结构:

/**

* 应答返回码

*/

private int code = RC_OK;

/**

* 应答返回消息

*/

private String msg;

/**

* 跳转url

*/

private String url = "";

private int count;

private boolean success = false;// 是否成功

private Object data;

service层获取数据,递归:

public List businessConfigTreeList(BusinessConfigQo command) throws Exception{

command.setParentId(0l);

command.setLimit(99999);

List list = this.businessConfigMapper.query(command);

for(BusinessConfigPo rec:list){

List children = getChildrenConfig(rec);

rec.setChildren(children);

}

return list;

}

private List getChildrenConfig(BusinessConfigPo rec) throws Exception{

BusinessConfigQo qo = new BusinessConfigQo();

qo.setLimit(99999);

qo.setParentId(rec.getId());

List list = this.businessConfigMapper.query(qo);

if(list==null){

return null;

}

for(BusinessConfigPo child:list){

List children = getChildrenConfig(child);

child.setChildren(children);

}

return list;

}

java tree 表格_00030-layui+java 树形表格treeTable相关推荐

  1. 实现layui的树形表格treeTable

    实现layui的树形表格treeTable,layui中有 可以使用 'tree','table' , 进而使用layui.treeGird实现 layui.treeGird({elem: '#dem ...

  2. Tree Table 树形表格

    1.安装 npm i vue-table-with-tree-grid -S 2.配置 在main.js文件内配置 import TreeTable from 'vue-table-with-tree ...

  3. bootstrap 树形表格渲染慢_layUI之树状表格异步加载组件treetableAsync.js(基于treetable.js)...

    概述 后台框架中使用树状表格是非常常用的操作,layUI本身并没有这种组件. 第三方的treetable.js做到了完美的实现,但是不能实现在双击时异步加载数据,本文就是站在了巨人的肩膀上实现的异步加 ...

  4. java实现layui静态表格分页,layui——数据表格分页实例

    layui实现数据表格table分页功能,异步加载,表格渲染.总体流程:layui的数据表格设置分页参数开启可以从请求中看到如下图,所以我们需要在后端控制器接收分页数据page和limit进行操作,下 ...

  5. 表格存储的Java SDK性能优化经验

    原文发布于阿里云论坛,在圈子内重发. 问题背景 用户通过Java SDK来访问表格存储,在SDK内部也是有开销的,在高并发的场景下这些开销尤其突出.如果SDK的性能很差,用户为了达到更高的QPS,可能 ...

  6. Spread表格组件For JAVA功能介绍—表格相关操作

    之前有篇文章我们说到 Spread 表格组件的 Java CTP 版本已经发布:<表格组件JAVACTP版本抢先预览>. 本篇我们来看一下他的主要功能,例如下图所示的Excel我们应当如何 ...

  7. java自适应table_Java 设置Word中的表格自适应的3种方式

    概述 在Word创建表格时,可设置表格"自动调整",有3种情况,通过Java程序设置可调用相应的方法来实现,即: 根据内容调整表格AutoFitBehaviorType.Auto_ ...

  8. java 将网页表格导出_Java导出网页表格Excel过程详解

    将网页中的table数据,导出到excel表格,可以使用java POI实现. java poi是java中操作excel的工具,支持excel的导入与导出,一般有三种形式: 1.HSSFWorkbo ...

  9. Layui树形表格组件的实现

    效果图: 一.Layui树形组件:treetable.js 可在layui下创建一个文件夹保存组件的js代码,以便引用. // 基于layui table的树形表格实现,只支持页面仅有一个表格的情况 ...

  10. LayUI treetable树形表格的实现, 数据格式正确,不显示的解决方案 和在这个过程中遇到的坑~ 认真看 你会得到一些想要的答案。

    先给大家看下效果吧! 我这边只是针对数据显示的问题做了解释.并没有增删改查.找增删改查的同学可以不用看了. 做出这样的效果,首先我们要借用LayUI的内置插件,treetable.js 网上有很多,之 ...

最新文章

  1. 中国高校首个Apache开源项目 清华数为物联网时序数据库IoTDB 及可自由组装的大数据软件栈系列组件发布...
  2. 几种检查调试CSS布局的有效方法
  3. hdu3001(三进制状压)
  4. python中栈的描述是_数据结构与算法:Python语言描述 栈和队列.ppt
  5. Android开发之原型图浏览器打开可点击跳转之Google插件之Axure(实际上大部分浏览器都可以安装这个插件)
  6. 2020蓝桥杯省赛---java---B---6(分类计数)
  7. 计算机组成原理与应用,计算机组成原理简答与应用
  8. malloc函数的使用以及内存泄露情况
  9. NLP 自然语言分析理解
  10. pandas数据处理实践四(时间序列date_range、数据分箱cut、分组技术GroupBy)
  11. Flutter开发 Android Studio 安装第三方模拟器—网易MuMu
  12. 学习总结-在Icepak模型中修改和增加零件
  13. 怎么为小数据集划分训练集和测试集
  14. SpringBoot Web项目 解析
  15. 中国联通沃云----弹性云主机使用说明
  16. 直律云所——让法律变得简单
  17. Linux下Netfilter创建自己的Hook,让数据包可以发送到用户层,然后统计节点负载信息
  18. 沈阳大学计算机李华,计算机自适应考试曝光率控制-数学专业毕业论文.pdf
  19. ICMAX告诉你除了BGA、SOP,还有那些主流的封装类型?
  20. 精通DDR3 PCB设计

热门文章

  1. windows组件_如何关闭win7系统windows移动中心 电脑关闭windows移动中心方法【详解】...
  2. bll调用mysql存储过程_SQL Server的存储过程或自定义函数调用Com组件
  3. git21天打卡day11-删除分支
  4. linux删除5天前文件和目录,Linux Shell命令定时删除指定目录下n天前的文件
  5. python读压缩文件内容_使用Python读写及压缩和解压缩文件的示例
  6. 3种常见的渗透测试漏洞总结,快来收藏√
  7. 计算机图形学规则形体,计算机图形学教案
  8. 用MATLAB编程课程设计,matlab课程设计报告---用Mtlab编程实现句柄图形应用
  9. 查看matlab当前路径,MATLAB R2012a 的当前路径和路径搜索
  10. pytorch-迁移学习学习率trick