/**
@Name：dtree 树形组件
@Author：智慧的小西瓜
@Site：http://www.wisdomelon.com/DTreeHelper/
@License：LAYUI
*/
layui.define(['jquery', 'layer', 'form'], function (exports) {
var $ = layui.$,
layer = layui.layer,
form = layui.form;
// 树的公共定义样式汇总
var LI_NAV_CHILD = "dtree-nav-ul-sid", LI_NAV_ITEM = "dtree-nav-item",
LI_DIV_ITEM = "dtree-nav-div", DTREEFONT = "dtreefont", DTREEFONTSPECIAL = "dtreefont-special",
LI_DIV_MENUBAR = "dtree-menubar", LI_DIV_MENUBAR_DOWN = "dtree-icon-move-down",
LI_DIV_MENUBAR_UP = "dtree-icon-move-up", LI_DIV_MENUBAR_REFRESH = "dtree-icon-refresh",
LI_DIV_MENUBAR_DELETE = "dtree-icon-delete1", LI_DIV_MENUBAR_SEARCH = "dtree-icon-search_list_light",
LI_DIV_TOOLBAR = "dtree-toolbar", TOOLBAR_TOOL = "dtree-toolbar-tool",
LI_DIV_TOOLBAR_ADD = "dtree-icon-roundadd", LI_DIV_TOOLBAR_EDIT = "dtree-icon-bianji",
LI_DIV_TOOLBAR_DEL = "dtree-icon-roundclose",
LI_DIV_SPREAD_LAST = "dtree-icon-dian",
LI_DIV_CHECKBAR = "dtree-nav-checkbox-div", LI_DIV_CHECKBAR_ON = "dtree-icon-fuxuankuangxuanzhong",
LI_DIV_CHECKBAR_OUT = "dtree-icon-fuxuankuang", LI_DIV_CHECKBAR_NOALL = "dtree-icon-fuxuankuang-banxuan",
LI_CLICK_CHECKBAR = "d-click-checkbar", //绑定点击复选框时需要用到
LI_DIV_TEXT_CLASS = "t-click", UL_ROOT = "dtree";
// 树的自定义样式
var DTREE = "dtree-", //自定义样式前缀
ITEMTHIS = "-item-this", //自定义样式当前行选中后缀
ITEM = "-item", //自定义样式当前行后缀
DFONT = "-dtreefont", //自定义样式图标样式后缀
FICON = "-ficon", //自定义样式一级图标样式后缀
ICON = "-icon", //自定义样式二级图标样式后缀
CBOX = "-checkbox", //自定义样式复选框样式后缀
CHS = "-choose"; //自定义样式复选框选中样式后缀
// 树的公共指定
var NAV_THIS = "dtree-nav-this", //当前节点
NAV_SHOW = "dtree-nav-show", //显示子节点
ICON_HIDE = "dtree-icon-hide", //隐藏dot图标
$BODY = $("body"), //body选择器
MOD_NAME = "dtree", //模块名称
VERSION = "v2.4.5_finally_beta", //版本
DTrees = {}; //当前被实例化的树的集合
// 树的一级节点图标集合
var firstIconArray = {
"-1": {"open": "dtree-icon-null-open", "close": "dtree-icon-null-close"}, //未指定
"0": {"open": "dtree-icon-jian", "close": "dtree-icon-jia"},
"1": {"open": "dtree-icon-xiangxia1", "close": "dtree-icon-xiangyou"}
};
// 树的二级节点图标集合
var nodeIconArray = {
"-1": {"open": "dtree-icon-null-open", "close": "dtree-icon-null-close"}, //未指定
"0": {"open": "dtree-icon-wenjianjiazhankai", "close": "dtree-icon-weibiaoti5"}
};
var leafIconArray = {
"-1": "dtree-icon-null", //未指定
"0": "dtree-icon-weibiaoti5", //文件夹
"1": "dtree-icon-yonghu", //人员
"2": "dtree-icon-fenzhijigou", //机构
"3": "dtree-icon-fenguangbaobiao", //报表
"4": "dtree-icon-xinxipilu", //信息
"5": "dtree-icon-shuye1", //叶子
"6": "dtree-icon-caidan_xunzhang", //勋章
"7": "dtree-icon-normal-file" //文件
};
// 树自定义操作事件名称集合 绑定dtree-click的事件
var eventName = {
checkNodeClick: "checkNodeClick", //点击复选框
itemNodeClick: "itemNodeClick" //点击子节点div
};
// 树默认toolbar提供的功能集合 绑定dtree-tool的事件
var defaultTool = {
addToolbar: "addToolbar", //点击toolbar新增
editToolbar: "editToolbar", //点击toolbar编辑
delToolbar: "delToolbar" //点击toolbar删除
};
// 树默认menubar提供的功能集合 绑定dtree-menu的事件
var defaultMenu = {
moveDown: "moveDown", //menubar展开节点
moveUp: "moveUp", //menubar收缩节点
refresh: "refresh", //menubar刷新树
remove: "remove", //menubar删除选中节点
searchNode: "searchNode" //menubar查询节点
};
// 树的公共事件
var event = {
getElemId: function (options) { // 根据传入的参数获取ID
var elem = options.elem || "";
var obj = options.obj || $(elem);
if (obj.length == 0) { //页面中未找到绑定id
return "";
} else {
return $(obj)[0].id;
}
},
escape: function (html) {
if (typeof html !== 'string') return '';
return html.replace(entityReg.escape, function (match) {
return entityMap.escape[match];
});
},
unescape: function (str) {
if (typeof str !== 'string') return '';
return str.replace(entityReg.unescape, function (match) {
return entityMap.unescape[match];
});
},
cloneObj: function (obj, filter) { //深复制对象方法
var newObj = {};
if (obj instanceof Array) {
newObj = [];
}
var str = "";
if (typeof filter !== 'undefined') {
str = filter.join(",");
}
for (var key in obj) {
if (str.indexOf(key) == -1) {
var val = obj[key];
newObj[key] = typeof val === 'object' ? event.cloneObj(val, typeof filter !== undefined ? filter : []) : val;
}
}
return newObj;
}
};
// 特殊符号转义
var keys = Object.keys || function (obj) {
obj = Object(obj);
var arr = [];
for (var a in obj) arr.push(a);
return arr;
};
var invert = function (obj) {
obj = Object(obj);
var result = {};
for (var a in obj) result[obj[a]] = a;
return result;
};
var entityMap = {
escape: {
"&": "&",
"<": "<",
">": ">",
"'": "&quo;"
}
};
entityMap.unescape = invert(entityMap.escape);
var entityReg = {
escape: RegExp('[' + keys(entityMap.escape).join('') + ']', 'g'),
unescape: RegExp('(' + keys(entityMap.unescape).join('|') + ')', 'g')
};
//异步加载接口
var AjaxHelper = {
request: function (config) {
var data = config.data ? config.data : {};
var async = (typeof (config.async) === "boolean") ? config.async : true;
$.ajax({
type: config.type ? config.type : "POST",
headers: config.headers,
url: config.url,
dataType: config.dataType ? config.dataType : "json",
data: data,
async: async,
success: config.success,
error: function (XMLHttpRequest, textStatus, errorThrown) {
if (typeof (config.error) === "function") {
config.error();
} else {
layer.msg('系统异常导致操作失败, 请联系管理员。', {icon: 5, shift: 6});
}
},
statusCode: {
404: function () {
layer.msg('未找到指定请求，请检查访问路径！', {icon: 5, shift: 6});
},
500: function () {
layer.msg('系统错误，请联系管理员。', {icon: 5, shift: 6});
}
},
complete: function (XMLHttpRequest, textStatus) {
if (typeof (config.complete) === "function") {
config.complete(XMLHttpRequest, textStatus);
}
}
});
},
serialize: function (param) { //json序列化 key=value&key1=value1
var p = "?";
for (var key in param) {
p += key + "=" + param[key] + "&";
}
p = p.substring(0, p.length - 1);
return p;
}
};
// 树类
var DTree = function (options) {
/** 默认赋值**/
this.response = { // 树返回的json格式
statusName: "code", //返回标识
statusCode: 200, //返回码
message: "message", //返回信息
rootName: "data", //根节点名称
treeId: "id", //节点ID
parentId: "parentId", //父节点ID
title: "title", //节点名称
iconClass: "iconClass", //自定义图标
childName: "children", //子节点名称
isLast: "isLast", //是否最后一级节点
// level: "level", //层级
spread: "spread", //展开
disabled: "disabled", //禁用
checkArr: "checkArr", //复选框列表
isChecked: "isChecked", //是否选中
type: "type", //复选框标记
basicData: "basicData" //表示用户自定义需要存储在树节点中的数据
};
this.defaultRequest = { // 树的默认发起请求参数格式，最后会将value作为参数名称传递
nodeId: "nodeId", //节点ID
parentId: "parentId", //父节点ID
context: "context", //节点内容
isLeaf: "isLeaf", //是否叶子节点
level: "level", //层级
spread: "spread", //节点展开状态
dataType: "dataType", //节点标记
ischecked: "ischecked", //节点复选框选中状态
initchecked: "initchecked", //节点复选框初始状态
basicData: "basicData", //用户自定义的记录节点数据
recordData: "recordData", //当前data数据（排除basicData和children字段）
};
this.toolbarFun = {
addTreeNode: function (param, $div) { //添加树节点后调用的函数，用于用户自定义，如未指定则树不会发生变化
return;
},
editTreeNode: function (param, $div) { //编辑树节点后调用的函数，用于用户自定义，如未指定则树不会发生变化
return;
},
editTreeLoad: function (param) { // 编辑树的数据回显，用于打开编辑时，回填数据
return;
},
delTreeNode: function (param, $div) { //删除树后调用的函数，用于用户自定义，如未指定则树不会发生变化
return;
},
loadToolbarBefore: function (buttons, param, $div) { // 右键菜单加载前的函数
return buttons;
}
};
this.toolbarStyle = {
title: "节点",
area: ["60%", "80%"]
};
this.menubarFun = {
remove: function (checkbarNodes) { //删除复选框选中节点，需要用户自定义，如未指定则树只是页面上做了修改
return true;
}
};
this.menubarTips = {
toolbar: [],
group: [defaultMenu.moveDown, defaultMenu.moveUp, defaultMenu.refresh, defaultMenu.remove, defaultMenu.searchNode],
freedom: []
};
this.checkbarFun = {
chooseBefore: function ($i, node) { // 复选框点击前回调
return true;
},
chooseDone: function (checkbarNodesParam) { //复选框点击事件完毕后，返回该树关于复选框操作的全部信息，用于用户自定义，如未指定则树只是页面上做了修改
return;
}
};
this.iframe = { // 树点击节点时，打开iframe页面参数配置
iframeElem: "", //iframe的ID
iframeUrl: "", //树关联的frame地址
iframeLoad: "leaf", //点击哪一层加载frame： node：所有节点， leaf：默认，最后一级
iframeDefaultRequest: { //iframe的默认参数,目的是与加载树的参数不一样
nodeId: "nodeId", //节点ID
parentId: "parentId", //父节点ID
context: "context", //节点内容
isLeaf: "isLeaf", //是否叶子节点
level: "level", //层级
spread: "spread", //节点展开状态
dataType: "dataType", //节点标记
ischecked: "ischecked", //节点复选框选中状态
initchecked: "initchecked", //节点复选框初始状态
basicData: "basicData", //用户自定义的记录节点数据
recordData: "recordData", //当前data数据（排除basicData和children字段）
},
iframeRequest: {} //iframe的自定义参数
};
this.iframeFun = {
iframeDone: function (iframeParam) { //iframe加载完毕后，用于用户自定义事件
return;
}
};
this.style = {
item: "",
itemThis: "",
dfont: "",
icon: "",
cbox: "",
chs: ""
};
/** 数据绑定**/
this.node = { // 树节点选中时，包含当前节点的全部信息
nodeId: "", //节点ID
parentId: "", //父节点ID
context: "", //节点内容
isLeaf: "", //是否叶子节点
level: "", //层级
spread: "", //节点展开状态
dataType: "", //节点标记
ischecked: "", //节点复选框选中状态
initchecked: "", //节点复选框初始状态
basicData: "", //用户自定义的记录节点数据
recordData: "", //当前data数据（排除basicData和children字段）
};
this.toolbarMenu = {}; // 工具栏右键菜单绑定的所有元素
this.checkbarNode = []; // 复选框标记的全部节点数据
this.checkArrLen = 0; //添加节点的时判断复选框个数
this.temp = []; // 临时变量
this.setting(options);
};
/******************** 初始参数加载 ********************/
// 设置值
DTree.prototype.setting = function (options) {
this.options = options || {};
/** 绑定元素参数（必填，2个参数项必填一个）**/
this.elem = this.options.elem || ""; //树绑定的元素ID：#elem
this.obj = this.options.obj || $(this.elem); //树绑定的jquery元素，用于当元素是延迟加载出来的话，可以用这个找到
/** 基本参数**/
this.initLevel = this.options.initLevel || 2; //默认展开节点 2节
this.type = this.options.type || "load"; // 树的加载方式 all，全量树， load，增量树，默认load
this.cache = (typeof (this.options.cache) === "boolean") ? this.options.cache : true; //开启数据缓存
this.record = (typeof (this.options.record) === "boolean") ? this.options.record : false; //开启数据记录模式
this.load = (typeof (this.options.load) === "boolean") ? this.options.load : true; //开启加载动画
/** 样式相关参数**/
this.firstIconArray = $.extend(firstIconArray, this.options.firstIconArray) || firstIconArray; //用户自定义一级图标集合，node
this.nodeIconArray = $.extend(nodeIconArray, this.options.nodeIconArray) || nodeIconArray; //用户自定义二级图标集合，node
this.leafIconArray = $.extend(leafIconArray, this.options.leafIconArray) || leafIconArray; //用户自定义二级图标集合，leaf
this.skin = this.options.skin || "theme"; // 自定义样式
if (this.skin == "layui") { // layui主题
this.ficon = this.options.ficon || "1"; // 一级图标样式，0：+，-
this.dot = (typeof (this.options.dot) === "boolean") ? this.options.dot : false; //是否显示一级图标的小圆点，默认不显示
this.icon = this.options.icon || "7"; //二级图标样式，0：文件夹，1：人员，2：机构，3：报表，4：信息，5：叶子，6：勋章, -1：不显示二级图标。默认'1'
this.nodeIcon = (typeof this.icon === 'string' || typeof this.icon === 'number') ? (this.icon == "-1" ? "-1" : "-1") : this.icon[0]; // 二级图标中的node节点图标
} else { // 默认主题 或者自定义主题
this.ficon = this.options.ficon || "0"; // 一级图标样式，0：+，-
this.dot = (typeof (this.options.dot) === "boolean") ? this.options.dot : true; //是否显示一级图标的小圆点，默认显示
this.icon = this.options.icon || "5"; //二级图标样式，0：文件夹，1：人员，2：机构，3：报表，4：信息，5：叶子，6：勋章, -1：不显示二级图标。默认'5'
this.nodeIcon = (typeof this.icon === 'string' || typeof this.icon === 'number') ? (this.icon == "-1" ? "-1" : "0") : this.icon[0]; // 二级图标中的node节点图标
}
/** 内置样式属性*/
this.ficonOpen = this.firstIconArray[this.ficon]["open"]; // 一级图标中的node节点open图标
this.ficonClose = this.firstIconArray[this.ficon]["close"]; // 一级图标中的node节点close图标
this.nodeIconOpen = this.nodeIconArray[this.nodeIcon]["open"]; // 二级图标中的node节点open图标
this.nodeIconClose = this.nodeIconArray[this.nodeIcon]["close"]; // 二级图标中的node节点close图标
this.leafIcon = (typeof this.icon === 'string' || typeof this.icon === 'number') ? this.icon : this.icon[1]; // 二级图标中的leaf节点图标
this.leafIconShow = this.leafIconArray[this.leafIcon]; // 二级图标中的leaf节点图标
this.style.item = DTREE + this.skin + ITEM;
this.style.itemThis = DTREE + this.skin + ITEMTHIS;
this.style.dfont = DTREE + this.skin + DFONT;
this.style.ficon = DTREE + this.skin + FICON;
this.style.icon = DTREE + this.skin + ICON;
this.style.cbox = DTREE + this.skin + CBOX;
this.style.chs = DTREE + this.skin + CHS;
/** 数据加载参数**/
this.url = this.options.url || ""; //请求地址
this.async = (typeof (this.options.async) === "boolean") ? this.options.async : true; //异步同步加载,默认异步加载
this.headers = this.options.headers || {}; // ajax header属性
this.method = this.options.method || "post"; //请求类型
this.dataType = this.options.dataType || "json"; //参数类型
this.defaultRequest = $.extend(this.defaultRequest, this.options.defaultRequest) || this.defaultRequest; //默认请求参数
this.filterRequest = this.options.filterRequest || []; //过滤请求参数
this.request = this.options.request || {}; //用户自定义请求参数
this.response = $.extend(this.response, this.options.response) || this.response; //返回json格式
this.data = this.options.data || null; //初始化指定该参数，则不会访问异步接口
this.dataFormat = this.options.dataFormat || "levelRelationship"; //用于用户配置的data数据格式，list：列表， levelRelationship：层级关系，默认
this.dataStyle = this.options.dataStyle || "defaultStyle"; //用于用户配置layui通用的json数据风格,layuiStyle:layui风格，defaultStyle：默认风格
this.success = this.options.success || function (data, obj) {
}; //树加载完毕后执行解析树之前的回调（仅限异步加载）
this.done = this.options.done || function (data, obj) {
}; //树加载完毕后的回调（仅限异步加载）
/** 工具栏参数**/
this.toolbar = this.options.toolbar || false; //是否开启可编辑模式
this.toolbarStyle = $.extend(this.toolbarStyle, this.options.toolbarStyle) || this.toolbarStyle; //toolbar的自定义风格，标题，弹框大小
this.toolbarScroll = this.options.toolbarScroll || this.elem; //树的上级div容器，让树可以显示滚动条的div容器
this.toolbarLoad = this.options.toolbarLoad || "node"; //toolbar作用范围：node:所有节点，noleaf:非最后一级节点，leaf:最后一级
this.toolbarShow = this.options.toolbarShow || ["add", "edit", "delete"]; // toolbar三个按钮自定义加载
this.toolbarBtn = this.options.toolbarBtn || null; // toolbar增删改中内容的自定义加载
this.toolbarExt = this.options.toolbarExt || []; // toolbar按钮扩展
this.toolbarFun = $.extend(this.toolbarFun, this.options.toolbarFun) || this.toolbarFun; // toolbar事件加载
/** 菜单栏参数**/
this.menubar = this.options.menubar || false; //是否打开菜单栏
this.menubarTips = $.extend(this.menubarTips, this.options.menubarTips) || this.menubarTips; // 菜单栏吸附， toolbar：依附在工具栏，group：依附在按钮组，freedom，自由
this.menubarFun = $.extend(this.menubarFun, this.options.menubarFun) || this.menubarFun; //menubar事件加载
/** 复选框参数**/
this.checkbar = this.options.checkbar || false; //是否开启复选框模式
this.checkbarLoad = this.options.checkbarLoad || "node"; // 复选框作用范围，node：所有节点， leaf：最后一级；默认所有节点
this.checkbarType = this.options.checkbarType || "all"; //复选框选中形式 all：子集选中父级也选中， no-all：子集选中父级半选中，子集全选父级选中，p-casc：父级选中子集全选，子集无法改变父级选中状态， self：没有任何级联关系，only：只能选中一个复选框。 默认all
this.checkbarData = this.options.checkbarData || "choose"; //复选框记录数据类型形式， change表示记录变更数据，choose表示记录选中数据，all，记录全部数据，默认choose
this.checkbarFun = $.extend(this.checkbarFun, this.options.checkbarFun) || this.checkbarFun; // checkbar事件加载
/** iframe模式参数**/
this.useIframe = this.options.useIframe || false; // 是否加载iframe 默认false，
this.iframe = $.extend(this.iframe, this.options.iframe) || this.iframe; //iframe配置
this.iframeFun = $.extend(this.iframeFun, this.options.iframeFun) || this.iframeFun; //iframe事件加载
};
// 设置值
DTree.prototype.reloadSetting = function (options) {
this.options = $.extend(this.options, options) || this.options;
/** 绑定元素参数**/
this.elem = this.options.elem || this.elem; //树绑定的元素ID：#elem
if (typeof this.options.obj === 'undefined') {
if (this.elem) {
if ($(this.elem).length > 0) {
this.obj = $(this.elem);
}
}
} else {
this.obj = this.options.obj || this.obj; //树绑定的jquery元素，用于当元素是延迟加载出来的话，可以用这个找到
}
/** 基本参数**/
this.initLevel = this.options.initLevel || this.initLevel; //默认展开节点 2节
this.type = this.options.type || this.type; // 树的加载方式 all，全量树， load，增量树，默认load
this.cache = (typeof (this.options.cache) === "boolean") ? this.options.cache : this.cache; //开启数据缓存
this.record = (typeof (this.options.record) === "boolean") ? this.options.record : this.record; //开启数据记录模式
this.load = (typeof (this.options.load) === "boolean") ? this.options.load : this.load; //开启加载动画
/** 样式相关参数**/
this.firstIconArray = $.extend(firstIconArray, this.options.firstIconArray) || this.firstIconArray; //用户自定义一级图标集合，node
this.nodeIconArray = $.extend(nodeIconArray, this.options.nodeIconArray) || this.nodeIconArray; //用户自定义二级图标集合，node
this.leafIconArray = $.extend(leafIconArray, this.options.leafIconArray) || this.leafIconArray; //用户自定义二级图标集合，leaf
this.skin = this.options.skin || this.skin; // 自定义样式
if (this.skin == "layui") { // layui主题
this.ficon = this.options.ficon || this.ficon; // 一级图标样式，0：+，-
this.dot = (typeof (this.options.dot) === "boolean") ? this.options.dot : false; //是否显示一级图标的小圆点，默认不显示
this.icon = this.options.icon || this.icon; //二级图标样式，0：文件夹，1：人员，2：机构，3：报表，4：信息，5：叶子，6：勋章, -1：不显示二级图标。默认'1'
this.nodeIcon = (typeof this.icon === 'string' || typeof this.icon === 'number') ? (this.icon == "-1" ? "-1" : "-1") : this.icon[0]; // 二级图标中的node节点图标
} else { // 默认主题 或者自定义主题
this.ficon = this.options.ficon || this.ficon; // 一级图标样式，0：+，-
this.dot = (typeof (this.options.dot) === "boolean") ? this.options.dot : true; //是否显示一级图标的小圆点，默认显示
this.icon = this.options.icon || this.icon; //二级图标样式，0：文件夹，1：人员，2：机构，3：报表，4：信息，5：叶子，6：勋章, -1：不显示二级图标。默认'5'
this.nodeIcon = (typeof this.icon === 'string' || typeof this.icon === 'number') ? (this.icon == "-1" ? "-1" : "0") : this.icon[0]; // 二级图标中的node节点图标
}
/** 内置样式属性*/
this.ficonOpen = this.firstIconArray[this.ficon]["open"]; // 一级图标中的node节点open图标
this.ficonClose = this.firstIconArray[this.ficon]["close"]; // 一级图标中的node节点close图标
this.nodeIconOpen = this.nodeIconArray[this.nodeIcon]["open"]; // 二级图标中的node节点open图标
this.nodeIconClose = this.nodeIconArray[this.nodeIcon]["close"]; // 二级图标中的node节点close图标
this.leafIcon = (typeof this.icon === 'string' || typeof this.icon === 'number') ? this.icon : this.icon[1]; // 二级图标中的leaf节点图标
this.leafIconShow = this.leafIconArray[this.leafIcon]; // 二级图标中的leaf节点图标
this.style.item = DTREE + this.skin + ITEM;
this.style.itemThis = DTREE + this.skin + ITEMTHIS;
this.style.dfont = DTREE + this.skin + DFONT;
this.style.ficon = DTREE + this.skin + FICON;
this.style.icon = DTREE + this.skin + ICON;
this.style.cbox = DTREE + this.skin + CBOX;
this.style.chs = DTREE + this.skin + CHS;
/** 数据加载参数**/
this.url = this.options.url || this.url; //请求地址
this.async = (typeof (this.options.async) === "boolean") ? this.options.async : this.async; //异步同步加载,默认异步加载
this.headers = this.options.headers || this.headers; // ajax header属性
this.method = this.options.method || this.method; //请求类型
this.dataType = this.options.dataType || this.dataType; //参数类型
this.defaultRequest = $.extend(this.defaultRequest, this.options.defaultRequest) || this.defaultRequest; //默认请求参数
this.filterRequest = this.options.filterRequest || this.filterRequest; //过滤请求参数
this.request = this.options.request || this.request; //用户自定义请求参数
this.response = $.extend(this.response, this.options.response) || this.response; //返回json格式
this.data = this.options.data || this.data; //初始化指定该参数，则不会访问异步接口
this.dataFormat = this.options.dataFormat || this.dataFormat; //用于用户配置的data数据格式，list：列表， levelRelationship：层级关系，默认
this.dataStyle = this.options.dataStyle || this.dataStyle; //用于用户配置layui通用的json数据风格,layuiStyle:layui风格，defaultStyle：默认风格
this.success = this.options.success || this.success; //树加载完毕后执行解析树之前的回调（仅限异步加载）
this.done = this.options.done || this.done; //树加载完毕后的回调（仅限异步加载）
/** 可编辑模式参数**/
this.toolbar = this.options.toolbar || this.toolbar; //是否开启可编辑模式
this.toolbarStyle = $.extend(this.toolbarStyle, this.options.toolbarStyle) || this.toolbarStyle; //toolbar的自定义风格，标题，弹框大小
this.toolbarScroll = this.options.toolbarScroll || this.toolbarScroll; //树的上级div容器，让树可以显示滚动条的div容器
this.toolbarLoad = this.options.toolbarLoad || this.toolbarLoad; //toolbar作用范围：node:所有节点，noleaf:非最后一级节点，leaf:最后一级
this.toolbarShow = this.options.toolbarShow || this.toolbarShow; // toolbar三个按钮
this.toolbarBtn = this.options.toolbarBtn || this.toolbarBtn; // toolbar增删改中内容的自定义加载
this.toolbarExt = this.options.toolbarExt || this.toolbarExt; // toolbar按钮扩展
this.toolbarFun = $.extend(this.toolbarFun, this.options.toolbarFun) || this.toolbarFun; // toolbar事件加载
/** 菜单栏参数**/
this.menubar = this.options.menubar || this.menubar; //是否打开菜单栏
this.menubarTips = $.extend(this.menubarTips, this.options.menubarTips) || this.menubarTips; // 菜单栏吸附， toolbar：依附在工具栏，group：依附在按钮组，freedom，自由
this.menubarFun = $.extend(this.menubarFun, this.options.menubarFun) || this.menubarFun; //menubar事件加载
/** 复选框参数**/
this.checkbar = this.options.checkbar || this.checkbar; //是否开启复选框模式
this.checkbarLoad = this.options.checkbarLoad || this.checkbarLoad; // 复选框作用范围，node：所有节点， leaf：最后一级；默认所有节点
this.checkbarType = this.options.checkbarType || this.checkbarType; //复选框选中形式 all：子集选中父级也选中， no-all：子集选中父级半选中，子集全选父级选中，p-casc：父级选中子集全选，子集无法改变父级选中状态， self：没有任何级联关系，only：只能选中一个复选框。 默认all
this.checkbarData = this.options.checkbarData || this.checkbarData; //复选框记录数据类型形式， change表示记录变更数据，choose表示记录选中数据，all，记录全部数据，默认choose
this.checkbarFun = $.extend(this.checkbarFun, this.options.checkbarFun) || this.checkbarFun; // checkbar事件加载
/** iframe模式参数**/
this.useIframe = this.options.useIframe || this.useIframe; // 是否加载iframe 默认false，
this.iframe = $.extend(this.iframe, this.options.iframe) || this.iframe; //iframe配置
this.iframeFun = $.extend(this.iframeFun, this.options.iframeFun) || this.iframeFun; //iframe事件加载
};
/******************** 初始化数据区域 ********************/
// 重载树
DTree.prototype.reload = function (options) {
var _this = this;
_this.reloadSetting(options);
_this.init();
};
// 初始化树
DTree.prototype.init = function () {
var _this = this;
if (typeof _this !== "object") {
layer.msg("树组件未成功加载，请检查配置", {icon: 5});
return;
}
if (_this.data) {
if (typeof _this.data.length === 'undefined') {
layer.msg("数据解析异常，data数据格式不正确", {icon: 5});
return;
}
//先将ul中的元素清空
_this.obj.html("");
// 加载完毕后执行树解析前的回调
_this.success(_this.data, _this.obj);
// 第一次解析树
if (_this.dataFormat == 'list') {
//1.识别根节点ul中的data-id标签，判断顶级父节点
var pid = _this.obj.attr("data-id");
//2.构建一个存放节点的树组
var rootListData = _this.queryListTreeByPid(pid, _this.data);
_this.loadListTree(rootListData, _this.data, 1);
} else {
_this.loadTree(_this.data, 1);
}
// 加载完毕后的回调
_this.done(_this.data, _this.obj);
} else {
if (!_this.url) {
layer.msg("数据请求异常，url参数未指定", {icon: 5});
return;
}
//先将ul中的元素清空
_this.obj.html("");
var index = _this.load ? layer.load(1) : "";
AjaxHelper.request({
async: _this.async,
headers: _this.headers,
type: _this.method,
url: _this.url,
dataType: _this.dataType,
data: _this.getFilterRequestParam(_this.getRequestParam()),
success: function (result) {
if (typeof result === 'string') {
result = $.parseJSON(result);
}
var code = "";
if (_this.dataStyle == 'layuiStyle') {
code = result[_this.response.statusName];
} else {
code = result.status[_this.response.statusName];
}
if (code == _this.response.statusCode) {
// 加载完毕后执行树解析前的回调
_this.success(result, _this.obj);
// 第一次解析树
if (_this.dataFormat == 'list') {
//1.识别根节点ul中的data-id标签，判断顶级父节点
var pid = _this.obj.attr("data-id");
//2.构建一个存放节点的树组
var rootListData = _this.queryListTreeByPid(pid, result[_this.response.rootName]);
_this.loadListTree(rootListData, result[_this.response.rootName], 1);
} else {
_this.loadTree(result[_this.response.rootName], 1);
}
// 加载完毕后的回调
_this.done(result, _this.obj);
} else {
if (_this.dataStyle == 'layuiStyle') {
layer.msg(result[_this.response.message], {icon: 2});
} else {
layer.msg(result.status[_this.response.message], {icon: 2});
}
}
},
complete: function () {
if (_this.load) {
layer.close(index);
}
}
});
}
};
// 加载子节点
DTree.prototype.getChild = function ($div, data) {
var _this = this,
$ul = $div.next("ul");
_this.setNodeParam($div);
if (typeof data !== 'undefined') {
if (typeof data.length === 'undefined') {
layer.msg("数据解析异常，data数据格式不正确", {icon: 5});
return;
}
//先将ul中的元素清空
$ul.html("");
// 解析树
if (_this.dataFormat == 'list') {
var pid = _this.node.nodeId;
var level = parseInt(_this.node.level) + 1;
var listData = _this.queryListTreeByPid(pid, data);
_this.loadListTree(listData, _this.data, level);
} else {
_this.loadTree(data, level);
}
} else {
if (!_this.url) {
layer.msg("数据请求异常，url参数未指定", {icon: 5});
return;
}
$ul.html("");
var index = _this.load ? layer.load(1) : "";
AjaxHelper.request({
async: _this.async,
headers: _this.headers,
type: _this.method,
url: _this.url,
dataType: _this.dataType,
data: _this.getFilterRequestParam(_this.getRequestParam()),
success: function (result) {
if (typeof result === 'string') {
result = $.parseJSON(result);
}
var code = "";
if (_this.dataStyle == 'layuiStyle') {
code = result[_this.response.statusName];
} else {
code = result.status[_this.response.statusName];
}
if (code == _this.response.statusCode) {
// 解析树
var pid = _this.node.nodeId;
var level = parseInt(_this.node.level) + 1;
if (_this.dataFormat == 'list') {
var pListData = _this.queryListTreeByPid(pid, result[_this.response.rootName]);
_this.loadListTree(pListData, result[_this.response.rootName], level, $ul);
} else {
_this.loadTree(result[_this.response.rootName], level, $ul);
}
$ul.addClass(NAV_SHOW);
} else {
if (_this.dataStyle == 'layuiStyle') {
layer.msg(result[_this.response.message], {icon: 2});
} else {
layer.msg(result.status[_this.response.message], {icon: 2});
}
}
},
complete: function () {
if (_this.load) {
layer.close(index);
}
}
});
}
};
// 初始化树或者拼接树
DTree.prototype.loadListTree = function (pListData, listData, level, $ul) {
var _this = this;
$ul = $ul || _this.getNowNodeUl(); //当前选中的节点或根节点
if (pListData.length > 0) {
for (var i = 0; i < pListData.length; i++) {
// 1.获取已知节点的全部数据
var data = pListData[i];
if (typeof data !== "object") continue;
var parseData = _this.parseData(data);
var childListData = _this.queryListTreeByPid(parseData.treeId(), listData); // 根据已知数据的id判断该条数据是否还有子数据
// 3. 页面元素加载数据
$ul.append(_this.getLiItemDom(parseData.treeId(), parseData.parentId(), parseData.title(), parseData.isLast(childListData.length), parseData.iconClass(), parseData.checkArr(), level, parseData.spread(level), parseData.disabled(), parseData.basicData(), parseData.recordData(), ($ul.hasClass(UL_ROOT) ? "root" : "item")));
// 4.有子数据的元素加载子节点
if (childListData.length > 0) {
var cLevel = parseInt(level) + 1;
_this.loadListTree(childListData, listData, cLevel, _this.obj.find("ul[data-id='" + parseData.treeId() + "']"));
}
}
}
};
// 根据父ID查找list数据中匹配的元素
DTree.prototype.queryListTreeByPid = function (pid, listData) {
var _this = this;
var rootListData = [];
if (listData) {
for (var i = 0; i < listData.length; i++) {
var data = listData[i];
if (typeof data !== "object") continue;
if (pid == "null" || pid == null) {
if (data[_this.response.parentId] == null) {
rootListData.push(data);
}
} else {
if (data[_this.response.parentId] == pid) {
rootListData.push(data);
}
}
}
}
return rootListData;
};
// 初始化树或者拼接树
DTree.prototype.loadTree = function (root, level, $ul) {
var _this = this;
if (root) {
$ul = $ul || _this.getNowNodeUl(); //当前选中的节点或根节点
for (var i = 0; i < root.length; i++) { // 遍历跟节点或追加的跟节点
var data = root[i];
if (typeof data !== "object") continue;
var parseData = _this.parseData(data);
var children = parseData.children();
$ul.append(_this.getLiItemDom(parseData.treeId(), parseData.parentId(), parseData.title(), parseData.isLast(children.length), parseData.iconClass(), parseData.checkArr(), level, parseData.spread(level), parseData.disabled(), parseData.basicData(), parseData.recordData(), ($ul.hasClass(UL_ROOT) ? "root" : "item")));
if (children.length != 0) {
var cLevel = parseInt(level) + 1;
_this.loadTree(children, cLevel, _this.obj.find("ul[data-id='" + parseData.treeId() + "']"));
}
}
}
};
// 解析data数据
DTree.prototype.parseData = function (data) {
var _this = this;
return {
treeId: function () {
return data[_this.response.treeId];
},
parentId: function () {
return data[_this.response.parentId];
},
title: function () {
return data[_this.response.title] || "";
},
level: function () {
return data[_this.response.level] || "";
},
iconClass: function () {
return data[_this.response.iconClass] || "";
},
isLast: function (len) {
return ((len == 0) ?
((typeof (data[_this.response.isLast]) === "boolean") ? data[_this.response.isLast] : true) :
((typeof (data[_this.response.isLast]) === "boolean") ? data[_this.response.isLast] : false));
},
spread: function (level) {
return ((level < _this.initLevel) ?
((typeof (data[_this.response.spread]) === "boolean") ? data[_this.response.spread] : true) :
((typeof (data[_this.response.spread]) === "boolean") ? data[_this.response.spread] : false));
},
disabled: function () {
return (typeof (data[_this.response.disabled]) === "boolean") ? data[_this.response.disabled] : false;
},
checkArr: function () {
var checkArr = [];
var checkArrData = data[_this.response.checkArr];
if (typeof checkArrData === 'string') {
if (checkArrData.indexOf("{") > -1 && checkArrData.indexOf("}") > -1) {
checkArrData = JSON.parse(checkArrData);
} else {
checkArrData = {"type": "0", "isChecked": checkArrData};
}
}
if (typeof checkArrData === 'object') {
if (typeof checkArrData.length === 'undefined') {
checkArr.push(checkArrData);
} else {
checkArr = checkArrData;
}
}
if (checkArr.length > 0 && checkArr.length > _this.checkArrLen) {
_this.checkArrLen = checkArr.length; // 获取复选框个数
}
return checkArr;
},
children: function () {
return data[_this.response.childName] || [];
},
basicData: function () {
return event.escape(JSON.stringify(data[_this.response.basicData])) || JSON.stringify({});
},
recordData: function () {
var recordData = _this.record ? event.cloneObj(data, [_this.response.basicData, _this.response.childName]) : {};
return event.escape(JSON.stringify(recordData));
},
data: function () {
return event.escape(JSON.stringify(data));
}
}
};
//新增节点的dom值
DTree.prototype.getDom = function (treeId, parentId, title, isLast, iconClass, checkArr, level, spread, disabled) {
var _this = this,
rootId = _this.obj[0].id,
toolbar = _this.toolbar,
checkbar = _this.checkbar;
return {
fnode: function () { // + - 图标
// 获取图标的变量
var ficon = _this.ficon,
ficonOpen = _this.ficonOpen,
ficonClose = _this.ficonClose,
dot = _this.dot;
if (ficon != "-1" && dot) { // 都加载
return isLast ? "" :
(spread ? "" : "");
}
if (ficon != "-1" && !dot) { // 加载node 隐藏leaf
return isLast ? "" :
(spread ? "" : "");
}
if (ficon == "-1" && dot) { // 隐藏node 加载leaf
return isLast ? "" :
(spread ? "" : "");
}
if (ficon == "-1" && !dot) { // 都隐藏
return isLast ? "" :
(spread ? "" : "");
}
},
node: function () { // 二级图标样式
// 获取图标的变量
var nodeIcon = _this.nodeIcon,
leafIcon = _this.leafIcon;
var leafIconShow = _this.leafIconShow,
nodeIconOpen = _this.nodeIconOpen,
nodeIconClose = _this.nodeIconClose;
if (iconClass) {
leafIconShow = iconClass;
nodeIconOpen = iconClass;
nodeIconClose = iconClass;
}
if (nodeIcon != "-1" && leafIcon != "-1") { // 都加载
return isLast ? "" :
(spread ? "" : "");
}
if (nodeIcon != "-1" && leafIcon == "-1") { // 加载node 隐藏leaf
return isLast ? "" :
(spread ? "" : "");
}
if (nodeIcon == "-1" && leafIcon != "-1") { // 隐藏node 加载leaf
return isLast ? "" :
(spread ? "" : "");
}
if (nodeIcon == "-1" && leafIcon == "-1") { // 都隐藏
return isLast ? "" :
(spread ? "" : "");
}
},
checkbox: function () { // 复选框
var flag = false;
if (_this.checkbarLoad == "node") {
if (checkbar) {
flag = true;
}
} else {
if (isLast) {
if (checkbar) {
flag = true;
}
}
}
if (flag) {
var result = "";
if (checkArr && checkArr.length > 0) {
for (var i = 0; i < checkArr.length; i++) {
var checkData = checkArr[i];
var isChecked = checkData.isChecked;
var CHOOSE_CLASS = LI_DIV_CHECKBAR_OUT;
if (isChecked == "2") { //半选择
CHOOSE_CLASS = LI_DIV_CHECKBAR_NOALL + " " + _this.style.chs;
} else if (isChecked == "1") { //选择
CHOOSE_CLASS = LI_DIV_CHECKBAR_ON + " " + _this.style.chs;
} else { //未选择或者无值
CHOOSE_CLASS = LI_DIV_CHECKBAR_OUT;
}
result += "";
}
}
result += "
";
return result;
}
return "";
},
text: function () { // 文字显示
return "" + title + "";
},
ul: function () { //子节点ul
return isLast ? "" :
(spread ? "" : "");
}
};
};
// 获取拼接好的li
DTree.prototype.getLiItemDom = function (treeId, parentId, title, isLast, iconClass, checkArr, level, spread, disabled, basicData, recordData, flag) {
var _this = this,
rootId = _this.obj[0].id;
var dom = _this.getDom(treeId, parentId, title, isLast, iconClass, checkArr, level, spread, disabled);
basicData = (basicData == "{}") ? "" : basicData;
recordData = (recordData == "{}") ? "" : recordData;
var div = "" +
div,
dom.fnode(),
dom.node(),
dom.checkbox(),
dom.text(),
"
", dom.ul(), ""].join("");
return li;
};
// 初始化节点，用于数据回显
DTree.prototype.dataInit = function (chooseId) {
var _this = this;
var $div = _this.obj.find("div[data-id='" + chooseId + "']");
$div.parent().find("." + NAV_THIS).removeClass(NAV_THIS);
$div.parent().find("." + _this.style.itemThis).removeClass(_this.style.itemThis);
$div.addClass(NAV_THIS);
$div.addClass(_this.style.itemThis);
_this.setNodeParam($div);
// 将该节点的父节点全部展开
var $li_parents = $div.parents("." + LI_NAV_ITEM);
$li_parents.children("ul").addClass(NAV_SHOW);
$li_parents.children("." + LI_DIV_ITEM).children("i[data-spread]." + _this.ficonClose).addClass(_this.ficonOpen);
$li_parents.children("." + LI_DIV_ITEM).children("i[data-spread]." + _this.ficonClose).removeClass(_this.ficonClose);
$li_parents.children("." + LI_DIV_ITEM).children("i[data-spread]." + _this.nodeIconClose).addClass(_this.nodeIconOpen);
$li_parents.children("." + LI_DIV_ITEM).children("i[data-spread]." + _this.nodeIconClose).removeClass(_this.nodeIconClose);
return _this.getNowParam();
};
/******************** 基础事件区域 ********************/
// 展开或隐藏节点 作用点： div
DTree.prototype.clickSpread = function ($div) {
var $i_spread = $div.find("i[data-spread]").eq(0),
$i_node = $div.find("i[data-spread]").eq(1),
i_node_class = $i_node.attr("class"),
$cite = $div.find("cite[data-leaf]").eq(0),
spread = $i_spread.attr("data-spread"),
$ul = $div.next("ul");
var _this = this;
if ($ul.length > 0) {
if (spread == "close") {
if (_this.type == "load") { //增加加载
if (_this.cache) { //开启缓存
if ($ul.html()) {
$ul.addClass(NAV_SHOW);
} else { //加载节点
_this.getChild($div);
}
} else { //每次取新的数据
$ul.html("");
_this.getChild($div);
}
} else { // 全量加载
$ul.addClass(NAV_SHOW);
}
$div.find("i[data-spread]").attr("data-spread", "open");
$i_spread.removeClass(_this.ficonClose);
$i_spread.addClass(_this.ficonOpen);
var node_class = _this.nodeIconClose;
if (i_node_class.indexOf(node_class) > 0) {
$i_node.removeClass(_this.nodeIconClose);
$i_node.addClass(_this.nodeIconOpen);
}
} else if (spread == "open") {
$ul.removeClass(NAV_SHOW);
$div.find("i[data-spread]").attr("data-spread", "close");
$i_spread.removeClass(_this.ficonOpen);
$i_spread.addClass(_this.ficonClose);
var node_class = _this.nodeIconOpen;
if (i_node_class.indexOf(node_class) > 0) {
$i_node.removeClass(_this.nodeIconOpen);
$i_node.addClass(_this.nodeIconClose);
}
}
}
};
// 数据格式化
DTree.prototype.escape = function (html) {
return event.escape(html);
};
// 格式化数据转回正常数据
DTree.prototype.unescape = function (str) {
return event.unescape(str);
};
/******************** 工具栏及菜单栏区域 ********************/
// 初始化菜单栏和工具栏的div
DTree.prototype.initTreePlus = function () {
var _this = this;
// 初始化菜单栏和工具栏的div
_this.obj.prevAll('div#dtree_menubar_' + _this.obj[0].id).remove();
_this.obj.prevAll('div#dtree_toolbar_' + _this.obj[0].id).remove();
_this.toolbarMenu = {};
if (_this.menubar && _this.menubarTips.group && _this.menubarTips.group.length > 0) _this.obj.before("");
if (_this.toolbar) _this.obj.before("");
};
// 开启工具栏和菜单栏
DTree.prototype.openTreePlus = function () {
var _this = this;
// 先对工具栏做处理，因为菜单栏可能会与工具栏产生关联。
var ggMenu = [];
if (_this.toolbar) _this.getToolbarDom();
if (_this.menubar) {
var menubarTips = _this.menubarTips,
mtbar = menubarTips.toolbar,
group = menubarTips.group,
freedom = menubarTips.freedom;
if (mtbar && mtbar.length > 0) {
// 菜单栏吸附工具栏上
for (var i = 0; i < mtbar.length; i++) {
var mt = mtbar[i];
if (typeof mt === 'string') {
_this.getMenubarToolDom(mt);
}
if (typeof mt === 'object') {
_this.getExtMenubarToolDom(mt);
}
}
}
if (group && group.length > 0) {
// 菜单栏吸附在上方的按钮组div中
for (var i = 0; i < group.length; i++) {
var gg = group[i];
if (typeof gg === 'string') {
ggMenu.push(_this.getMenubarDom(gg));
}
if (typeof gg === 'object') {
ggMenu.push(_this.getExtMenubarDom(gg));
}
}
_this.obj.prevAll('div#dtree_menubar_' + _this.obj[0].id).children('div.layui-btn-group').append(ggMenu.join(""));
}
}
};
/******************** 菜单栏区域 ********************/
// 获取菜单栏
DTree.prototype.getMenubarDom = function (menu) {
var _this = this;
var rootId = _this.obj[0].id;
var gg = "";
switch (menu) {
case defaultMenu.moveDown:
gg = "";
break;
case defaultMenu.moveUp:
gg = "";
break;
case defaultMenu.refresh:
gg = "";
break;
case defaultMenu.remove:
gg = (_this.checkbar) ? "" : "";
break;
case defaultMenu.searchNode:
gg = "";
break;
}
return gg;
};
// 获取扩展菜单栏
DTree.prototype.getExtMenubarDom = function (menu) {
var _this = this;
return "";
};
// 获取依附在工具栏的菜单栏
DTree.prototype.getMenubarToolDom = function (menu) {
var _this = this;
var rootId = _this.obj[0].id;
switch (menu) {
case defaultMenu.moveDown:
_this.toolbarMenu[defaultMenu.moveDown] = " 展开" + _this.toolbarStyle.title + "";
break;
case defaultMenu.moveUp:
_this.toolbarMenu[defaultMenu.moveUp] = " 收缩" + _this.toolbarStyle.title + "";
break;
case defaultMenu.refresh:
_this.toolbarMenu[defaultMenu.refresh] = " 刷新";
break;
case defaultMenu.remove:
if (_this.checkbar)
_this.toolbarMenu[defaultMenu.remove] = " 删除选中" + _this.toolbarStyle.title + "";
break;
case defaultMenu.searchNode:
_this.toolbarMenu[defaultMenu.searchNode] = " 查询" + _this.toolbarStyle.title + "";
break;
}
};
// 获取依附在工具栏的扩展菜单栏
DTree.prototype.getExtMenubarToolDom = function (menu) {
var _this = this;
_this.toolbarMenu[menu.menubarId] = " " + menu.title + "";
};
// menubar内置方法
DTree.prototype.menubarMethod = function () {
var _this = this;
return {
openAllNode: function (obj) { // 展开所有节点
var $ulNode = obj || _this.obj.children("li").children("ul");
// 遍历所有ul子节点
for (var i = 0; i < $ulNode.length; i++) {
// 获取当前节点的信息
var $ul = $($ulNode[i]),
$div = $ul.prev("div"),
$i_spread = $div.find("i[data-spread]").eq(0),
$i_node = $div.find("i[data-spread]").eq(1),
i_node_class = $i_node.attr("class"),
$cite = $div.find("cite[data-leaf]").eq(0),
spread = $i_spread.attr("data-spread"),
leaf = $cite.attr("data-leaf");
if (leaf == "leaf") {
continue;
} // 说明是叶子了，则继续循环下一个
if (spread == "open") {
// 说明该节点已经展开了，则进行子节点循环
} else {
if (_this.type == "load") { //是否全量加载
if (_this.cache) { //是否开启缓存
if ($ul.html()) {
$ul.addClass(NAV_SHOW);
} else { //加载节点
_this.getChild($div);
}
} else { //每次取新的数据
$ul.html("");
_this.getChild($div);
}
} else { // 全量加载
$ul.addClass(NAV_SHOW);
}
$div.find("i[data-spread]").attr("data-spread", "open");
$i_spread.removeClass(_this.ficonClose);
$i_spread.addClass(_this.ficonOpen);
var node_class = _this.nodeIconClose;
if (i_node_class.indexOf(node_class) > 0) {
$i_node.removeClass(_this.nodeIconClose);
$i_node.addClass(_this.nodeIconOpen);
}
}
var $childUl = $ul.children("li").children("ul");
_this.menubarMethod().openAllNode($childUl);
}
},
closeAllNode: function () { //收缩所有节点
_this.obj.find("." + LI_NAV_CHILD).each(function () {
// 获取当前节点的信息
var $ul = $(this),
$div = $ul.prev("div"),
$i_spread = $div.find("i[data-spread]").eq(0),
$i_node = $div.find("i[data-spread]").eq(1),
i_node_class = $i_node.attr("class"),
$cite = $div.find("cite[data-leaf]").eq(0),
spread = $i_spread.attr("data-spread"),
leaf = $cite.attr("data-leaf");
$ul.removeClass(NAV_SHOW);
$div.find("i[data-spread]").attr("data-spread", "close");
$i_spread.removeClass(_this.ficonOpen);
$i_spread.addClass(_this.ficonClose);
var node_class = _this.nodeIconOpen;
if (i_node_class.indexOf(node_class) > 0) {
$i_node.removeClass(_this.nodeIconOpen);
$i_node.addClass(_this.nodeIconClose);
}
});
},
refreshTree: function () {// 刷新树
_this.obj.html(""); // 清空树结构
_this.initNodeParam(); // 清空参数
_this.init(); //执行初始化方法
},
remove: function () {// 删除选中节点
var len = _this.obj.find("i[data-par][data-checked='1']").length;
if (len == 0) {
layer.msg("请至少选中一个节点", {icon: 2});
} else {
//操作前先清空
_this.checkbarNode = [];
// 选择所有复选框节点
var i_node = {};
_this.obj.find("i[data-par][data-checked='1']").each(function () {
var $i = $(this), $div = $i.closest("." + LI_DIV_ITEM);
_this.checkbarNode.push(_this.getRequestParam(_this.getCheckbarNodeParam($div, $i)));
});
layer.confirm('确定要删除选中节点？', {icon: 3, title: '删除选中节点'}, function (index1) {
var flag = _this.menubarFun.remove(_this.checkbarNode);
if (flag) {
_this.obj.find("i[data-par][data-checked='1']").closest("." + LI_DIV_ITEM).next("ul").remove();
_this.obj.find("i[data-par][data-checked='1']").closest("." + LI_DIV_ITEM).remove();
_this.checkbarNode = [];
}
layer.close(index1);
});
}
},
searchNode: function () {//模糊查询该值，展开该值节点
layer.prompt({
formType: 0,
value: "",
title: '查询节点'
}, function (value, index1, elem) {
if (value) {
var flag = _this.searchNode(value);
if (!flag) {
layer.msg("该名称节点不存在！", {icon: 5});
}
} else {
layer.msg("未指定查询节点名称", {icon: 5});
}
layer.close(index1);
});
},
extMethod: function (menuId, $div, flag) {
if (_this.menubar && _this.menubarTips.group && _this.menubarTips.group.length > 0 && flag == "group") {
for (var i = 0; i < _this.menubarTips.group.length; i++) {
var ext = _this.menubarTips.group[i];
if (menuId == ext.menubarId) {
ext.handler(_this.getRequestParam(_this.getNodeParam($div), $div));
break;
}
}
}
if (_this.menubar && _this.menubarTips.toolbar && _this.menubarTips.toolbar.length > 0 && flag == "toolbar") {
for (var i = 0; i < _this.menubarTips.toolbar.length; i++) {
var ext = _this.menubarTips.toolbar[i];
if (menuId == ext.menubarId) {
ext.handler(_this.getRequestParam(_this.getNodeParam($div), $div));
break;
}
}
}
if (_this.menubar && _this.menubarTips.freedom && _this.menubarTips.freedom.length > 0 && flag == "freedom") {
for (var i = 0; i < _this.menubarTips.freedom.length; i++) {
var ext = _this.menubarTips.freedom[i];
if (menuId == ext.menubarId) {
ext.handler(_this.getRequestParam(_this.getNodeParam($div), $div));
break;
}
}
}
}
};
};
// menubar监听方法
DTree.prototype.menubarListener = function (menuId, flag) {
var _this = this;
var $div = _this.getNowNode();
switch (menuId) {
case defaultMenu.moveDown: // 展开节点
_this.menubarMethod().openAllNode();
break;
case defaultMenu.moveUp: // 收缩节点
_this.menubarMethod().closeAllNode();
break;
case defaultMenu.refresh:
_this.menubarMethod().refreshTree(); // 刷新树
break;
case defaultMenu.remove:
_this.menubarMethod().remove();
break;
case defaultMenu.searchNode:
_this.menubarMethod().searchNode();
break;
default:
_this.menubarMethod().extMethod(menuId, $div, flag);
break;
}
};
//模糊查询该值，展开该值节点
DTree.prototype.searchNode = function (value) {
var _this = this;
var b = false;
var $lis = [];
_this.obj.find("cite[data-leaf]").each(function () {
var $nthis = $(this);
var html = $nthis.html();
if (html.indexOf(value) > -1) {
if ($nthis.attr("data-leaf") == "leaf") {
// 叶子节点提供包含父节点的所有信息
var title = "";
$nthis.parents("li").each(function () {
title = "-" + $(this).find("cite[data-leaf]").html() + title;
});
title = title.substring(1, title.length);
$nthis.attr("title", title);
}
// 保存当前cite所在的li及父li中包含该值，则只保留父的
var i = 0;
$nthis.parents("li").each(function () {
var html2 = $(this).find("cite[data-leaf]").html();
if (html2.indexOf(value) > -1) {
i++;
}
if (i >= 2) {
return true;
}
});
if (i < 2) {
$lis.push($nthis.closest("li").prop("outerHTML"));
}
}
});
if ($lis.length > 0) {
b = true;
// 1.将树节点清空
_this.obj.html("");
// 2.遍历所有cite节点，展开当前cite节点
for (var i = 0; i < $lis.length; i++) {
_this.obj.append($lis[i]);
}
}
return b;
};
/******************** 工具栏区域 ********************/
// 获取工具栏
DTree.prototype.getToolbarDom = function () {
var _this = this;
var toolbarShow = _this.toolbarShow;
var toolbarExt = _this.toolbarExt;
if (toolbarShow.length > 0) {
for (var i = 0; i < toolbarShow.length; i++) {
var show = toolbarShow[i];
if (show == "add") {
_this.toolbarMenu[defaultTool.addToolbar] = " 新增" + _this.toolbarStyle.title + "";
}
if (show == "edit") {
_this.toolbarMenu[defaultTool.editToolbar] = " 编辑" + _this.toolbarStyle.title + "";
}
if (show == "delete") {
_this.toolbarMenu[defaultTool.delToolbar] = " 删除" + _this.toolbarStyle.title + "";
}
}
}
if (toolbarExt.length > 0) {
for (var i = 0; i < toolbarExt.length; i++) {
var ext = toolbarExt[i];
_this.toolbarMenu[ext.toolbarId] = " " + ext.title + "";
}
}
};
// 设置工具栏按钮
DTree.prototype.setToolbarDom = function (toolbarMenu) {
var _this = this;
if (toolbarMenu) {
_this.obj.prevAll('div#dtree_toolbar_' + _this.obj[0].id).find('div.layui-nav-item>dl.layui-nav-child').html("");
for (var key in toolbarMenu) {
_this.obj.prevAll('div#dtree_toolbar_' + _this.obj[0].id).find('div.layui-nav-item>dl.layui-nav-child').append(toolbarMenu[key]);
}
}
}
// 加载toolBar中的内容
DTree.prototype.loadToolBar = function (title, name) {
var _this = this;
var toolbarShow = _this.toolbarShow;
var nodeBarContents = _this.toolbarBtn;
var html = "";
switch (name) {
case defaultTool.addToolbar:
//1. 必须加载的节点内容
var nowNode = [''].join('');
var addNodeName = [''].join('');
var addNodeBtn = [''].join('');
//2. 用户自定义的节点内容
var addNodeBar = ['');
html = addNodeBar.join('');
break;
case defaultTool.editToolbar:
//1. 必须加载的节点内容
var nowNode = [''].join('');
var editNodeName = [''].join('');
var editNodeBtn = [''].join('');
var editNodeBar = ['');
html = editNodeBar.join('');
break;
}
return html;
};
// 获取toolbar详细的标签信息
DTree.prototype.loadToolBarDetail = function () {
var _this = this;
return {
text: function (nodeBarContents) {
return [''].join('');
},
textarea: function (nodeBarContents) {
return ['',
'
',
'
',
'',
'
',
'