treetable 用法小例
插件地址:http://pan.baidu.com/s/1kVf0Kcfcript src="/plugins/jQuery/jQuery-2.1.4.min.js"></script>
<link rel="stylesheet" type="text/css" href="/plugins/jquery-treetable-master/css/jquery.treetable.css">
<link rel="stylesheet" type="text/css"
href="/plugins/jquery-treetable-master/css/jquery.treetable.theme.default.css">
<div class="box-body table-responsive no-padding">
<table id="treetable">
<thead>
<tr>
<th width="80px">部门名称</th> <th>规章制度</th>
<th width="120px">操作</th>
<th width="120px">操作</th>
</tr>
</thead> <tbody>
<#list treeDept as o> <#if o.parentId == '' || o.parentId == null>
<tr data-tt-id="${(o.id)!}">
<td><span class='folder'/>${o.deptName}</td>
<td>${o.deptDesc}</td>
<td>
<#if permissions?seq_contains('editDept')>
<a class="btn btn-primary btn-xs" href="/system/dept/edit/${(o.id)!}"> <i
class="fa fa-pencil-square-o"></i> 编辑</a>
<#else>-
</#if>
</td>
<td> <#if permissions?seq_contains('deleteDept')>
<a class="btn btn-danger btn-xs"
onclick="del('${(o.parentIds)!}')"
><i class="fa fa-times"></i> 删除</a>
<#else>-
</#if>
</td> </tr>
<#else>
<tr data-tt-id="${(o.id)!}" data-tt-parent-id="${(o.parentId)!}">
<td><span class='folder'/>${o.deptName}</td>
<td>${o.deptDesc}</td>
<td>
<#if permissions?seq_contains('editDept')>
<a class="btn btn-primary btn-xs" href="/system/dept/edit/${(o.id)!}">
<i
class="fa fa-pencil-square-o"></i> 编辑</a>
<#else>-
</#if>
</td>
<td>
<#if permissions?seq_contains('deleteDept')>
<a class="btn btn-danger btn-xs"
onclick="del('${(o.parentIds)!}')"
><i class="fa fa-times"></i> 删除</a>
<#else>-
</#if>
</td> </tr>
</#if>
</#list>
</tbody>
<!--t--> </table>
</div> <script src="/plugins/jquery-treetable-master/jquery.treetable.js"></script>
<script>
function del(parentIds) {
if (confirm("您确定要删除该条记录吗")) {
$.ajax({
type: "POST",
url: "/system/dept/delete",
data: {parentIds: parentIds}, // 省级别
dataType: 'json',
success: function (data) {
alert(data.msg);
if (data.code == 0) {
window.location.href = "/system/dept/list/1"
} debugger
}, error: function () {
alert("错了");
}
});
}
} </script>
<script>
$("#treetable").treetable({
expandable: true,// 展示
initialState: "expanded",//默认打开所有节点
stringCollapse: '关闭',
stringExpand: '展开',
onNodeExpand: function () {// 分支展开后的回调函数
var node = this; //判断当前节点是否已经拥有子节点 var childSize = $("#treetable").find("[data-tt-parent-id='" + node.id + "']").length;
if (childSize > 0) {
return;
}
var data = "pageId=" + node.id; // Render loader/spinner while loading 加载时渲染 $.ajax({
loading: false, sync: false,// Must be false, otherwise loadBranch happens after showChildren? // url: context + "/document/loadChild.json",
data: data,
success: function (result) {
if (0 == result.code) {
if (!com.isNull(result.body)) {
if (0 == eval(result.body['chilPages']).length) {//不存在子节点 var $tr = $("#treetable").find("[data-tt-id='" + node.id + "']");
$tr.attr("data-tt-branch", "false");// data-tt-branch 标记当前节点是否是分支节点,在树被初始化的时候生效 $tr.find("span.indenter").html("");// 移除展开图标 return;
}
var rows = this.getnereateHtml(result.body['chilPages']);
$("#treetable").treetable("loadBranch", node, rows);// 插入子节点 $("#treetable").treetable("expandNode", node.id);// 展开子节点 }
} else {
alert(result.tip);
}
}
});
}
}); </script>
/**
* 执行新增
*/
@Permission("addDept")
@Log("保存部门")
@RequestMapping("/doSave")
public String doSave(SysDept dept) {
if (StringUtils.isNotBlank(dept.getId())) { //编辑
sysDeptService.doUpdate(dept);
} else { //新增
dept.setId(CommonUtil.UUID());
int recond = sysDeptService.doSave(dept);
}
return redirectTo("/system/dept/list/1");
}
@Override
public int doSave(SysDept dept) {
String id = dept.getId();
String parentIds = dept.getParentIds();
parentIds += "/" + id;
dept.setParentIds(parentIds);
int record = baseMapper.add(dept);
return record;
} @Override
public int doUpdate(SysDept dept) {
String id = dept.getId();
String parentIds = dept.getParentIds(); parentIds += "/" + id;
dept.setParentIds(parentIds);
int record = baseMapper.doUpdate(dept);
return record; }
<select id="selectDeptList" resultMap="BaseResultMap">
SELECT id,deptName,deptDesc,parentId, parentName,parentIds,sorts
FROM sys_dept
where delFlag=0
<if test="dept!=null and dept.deptName != null and dept.deptName != ''">
and deptName like concat('%',#{dept.deptName},'%')
</if>
<if test="dept!=null and dept.parentIds != null and dept.parentIds != ''">
and parentIds like concat('%',#{dept.parentIds},'%')
</if> ORDER BY
parentIds
</select>
<insert id="add"
parameterType="com.vacomall.entity.SysDept">
INSERT INTO sys_dept (
id,
deptName,
deptDesc,
parentId,
parentName,
sorts,
deptCode,
parentIds
)
VALUES
(
#{id,jdbcType=VARCHAR},
#{deptName,jdbcType=VARCHAR},
#{deptDesc,jdbcType=VARCHAR},
#{parentId,jdbcType=VARCHAR},
#{parentName,jdbcType=VARCHAR},
#{sorts,jdbcType=TINYINT},
#{deptCode,jdbcType=VARCHAR},
#{parentIds,jdbcType=VARCHAR}
)
</insert> <update id="doUpdate" parameterType="com.vacomall.entity.SysDept">
update sys_dept
set
deptName = #{deptName,jdbcType=VARCHAR},
deptDesc = #{deptDesc,jdbcType=VARCHAR},
parentId = #{parentId,jdbcType=VARCHAR},
parentName = #{parentName,jdbcType=VARCHAR},
parentIds = #{parentIds,jdbcType=VARCHAR},
sorts = #{sorts,jdbcType=TINYINT},
deptCode = #{deptCode,jdbcType=VARCHAR} where id = #{id,jdbcType=VARCHAR}
</update>
treetable 用法小例的更多相关文章
- wmic命令用法小例
wmic就是wmic.exe,位于windows目录底下,是一个命令行程序.WMIC可以以两种模式执行:交互模式(Interactive mode)和非交互模式(Non-Interactive mod ...
- zTree 用法小例
插件地址:链接:http://pan.baidu.com/s/1jHVtyZ0 密码:7kee <select id="getTree" resultType="j ...
- linux 命令小例
xargs示例: ls |xargs -i mv {} /opt find示例: find -mtime +n -name “*.avi” -type f -exec rm {} \; find - ...
- Ubuntu13.04 Eclipse下编译安装Hadoop插件及使用小例
Ubuntu13.04 Eclipse下编译安装Hadoop插件及使用小例 一.在Eclipse下编译安装Hadoop插件 Hadoop的Eclipse插件现在已经没有二进制版直接提供,只能自己编译. ...
- 使用libcurl下载文件小例
libcurl是一个很强大的开源网络处理库,支持包括HTTP.HTTPS.FTP……一系列网络协议.用它来进行HTTP的get\post 或者下载文件更是小菜一碟,chrome内核都用到了它,本文主要 ...
- webpack -- 多页面简单小例
有时单页面并不能满足我们的业务需求,就需要去构建多页面应用,以下为简单小例: entry:{ index:'./src/module/index/index.js', student:'./src/m ...
- [libpng]CMake+VS2015下编译libpng,及使用小例
编译前的工作 在编译libpng前,需要把zlib编译好,并加载到编译环境里. CMake + VS2015 下编译zlib,及使用小例 下载与解压 libpng的官网是 http://www.lib ...
- Linux下 ls 命令的高级用法8例
Linux下 ls 命令的高级用法8例 在Linux下,ls这个命令大家肯定太熟悉了,良许相信只要是Linux工程师,每天都会离不开这个命令,而且一天会使用个几百次.但是,除了 ls -l 以外,你还 ...
- CSS语法与用法小字典
前言:这是上学时期对CSS学习的整理,一直没见过光,由于不是专门做前端开发的,难免写不到重点,但对于看懂CSS,和掌握一些基本的用法,熟悉里面的门路还是大有裨益的.由于是从word中贴过来的,排版和格 ...
随机推荐
- OpenWrite方法打开现有文件并进行写入
实现效果: 知识运用: File类的OpenWrite方法 //实现打开现有文件以进行写入 public static FileStream OpenWrite (string path) Encod ...
- python_111_动态导入模块
lib下aa.py文件内容: class C: def __init__(self): self.name='alex' from lib import aa#正常导入 print(aa.C) 动态导 ...
- Python基础篇 -- 部分练习题
实现一个整数加法计算器(两个数相加): 如:content = input("请输入内容:") 用户输入:5+9或5+ 9或5 + 9(含空白),然后进行分割转换最终进行整数的计算 ...
- vue+element UI如何导出excel表
导出excel表应按如下规则 首先要先安装如下依赖 npm install --save xlsx npm install --save file-saver 接下在在你的代码中去引用这两个 impo ...
- LeetCode 岛屿的最大面积
给定一个包含了一些 0 和 1的非空二维数组 grid , 一个 岛屿 是由四个方向 (水平或垂直) 的 1 (代表土地) 构成的组合.你可以假设二维矩阵的四个边缘都被水包围着. 找到给定的二维数组中 ...
- PAT 乙级 1005
题目 题目地址:PAT 乙级 1005 题解 本题主要就在于将一个数的一系列计算结果不重复地存储起来并便于检索,考虑到STL中的集合有相似的特性,使用set可以有效地简化代码和运算. 过程如下: (初 ...
- Python 基本数据类型 (二) - 字符串
str.expandtabs([tabsize]): str类型的expandtabs函数,有一个可选参数tabsize(制表符大小) 详细来说,expandtabs的意思就是,将字符串中的制表符\t ...
- Linux Shell脚本教程:30分钟玩转Shell脚本编程
http://c.biancheng.net/cpp/shell/ Linux在线体验: http://compileonline.com/ Linux命令查询: http://man.linuxde ...
- LeetCode(125) Valid Palindrome
题目 Given a string, determine if it is a palindrome, considering only alphanumeric characters and ign ...
- 爬虫必备:Python 执行 JS 代码 —— PyExecJS、PyV8、Js2Py
在使用爬虫中,经常会遇到网页请求数据是经过 JS 处理的,特别是模拟登录时可能有加密请求.而目前绝大部分前端 JS 代码都是经过混淆的,可读性极低,想理解代码逻辑需要花费大量时间.这时不要着急使用 S ...