12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027202820292030203120322033203420352036203720382039204020412042204320442045204620472048204920502051205220532054205520562057205820592060206120622063206420652066206720682069207020712072207320742075207620772078207920802081208220832084208520862087208820892090209120922093209420952096209720982099210021012102210321042105210621072108210921102111211221132114211521162117211821192120212121222123212421252126212721282129213021312132213321342135213621372138213921402141214221432144214521462147214821492150215121522153215421552156215721582159216021612162216321642165216621672168216921702171217221732174217521762177217821792180218121822183218421852186218721882189219021912192219321942195219621972198219922002201220222032204220522062207220822092210221122122213221422152216221722182219222022212222222322242225222622272228222922302231223222332234223522362237223822392240224122422243224422452246224722482249225022512252225322542255225622572258225922602261226222632264226522662267226822692270227122722273227422752276227722782279228022812282228322842285228622872288228922902291229222932294229522962297229822992300230123022303230423052306230723082309231023112312231323142315231623172318231923202321232223232324232523262327232823292330233123322333233423352336233723382339234023412342234323442345234623472348234923502351235223532354235523562357235823592360236123622363236423652366236723682369237023712372237323742375237623772378237923802381238223832384238523862387238823892390239123922393239423952396239723982399240024012402240324042405240624072408240924102411241224132414241524162417241824192420242124222423242424252426242724282429243024312432243324342435243624372438243924402441244224432444244524462447244824492450245124522453245424552456245724582459246024612462246324642465246624672468246924702471247224732474247524762477247824792480248124822483248424852486248724882489249024912492249324942495249624972498249925002501250225032504250525062507250825092510251125122513251425152516251725182519252025212522252325242525252625272528252925302531253225332534253525362537253825392540254125422543254425452546254725482549255025512552255325542555255625572558255925602561256225632564256525662567256825692570257125722573257425752576257725782579258025812582258325842585258625872588258925902591259225932594259525962597259825992600260126022603260426052606260726082609261026112612261326142615261626172618261926202621262226232624262526262627262826292630263126322633263426352636263726382639264026412642264326442645264626472648264926502651265226532654265526562657265826592660266126622663266426652666266726682669267026712672267326742675267626772678267926802681268226832684268526862687268826892690269126922693269426952696269726982699270027012702270327042705270627072708270927102711271227132714271527162717271827192720272127222723272427252726272727282729273027312732273327342735273627372738273927402741274227432744274527462747274827492750275127522753275427552756275727582759276027612762276327642765276627672768276927702771277227732774277527762777277827792780278127822783278427852786278727882789279027912792279327942795279627972798279928002801280228032804280528062807280828092810281128122813281428152816281728182819282028212822282328242825282628272828282928302831283228332834283528362837283828392840284128422843284428452846284728482849285028512852285328542855285628572858285928602861286228632864286528662867286828692870287128722873287428752876287728782879288028812882288328842885288628872888288928902891289228932894289528962897 |
- /**
- @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 ? "<i class='" + DTREEFONT + " " + LI_DIV_SPREAD_LAST + " " + _this.style.dfont + " " + _this.style.ficon + "' data-spread='last' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>" :
- (spread ? "<i class='" + DTREEFONT + " " + ficonOpen + " " + _this.style.dfont + " " + _this.style.ficon + "' data-spread='open' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>" : "<i class='" + DTREEFONT + " " + ficonClose + " " + _this.style.dfont + " " + _this.style.ficon + "' data-spread='close' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>");
- }
- if (ficon != "-1" && !dot) { // 加载node 隐藏leaf
- return isLast ? "<i class='" + DTREEFONT + " " + LI_DIV_SPREAD_LAST + " " + ICON_HIDE + " " + _this.style.dfont + " " + _this.style.ficon + "' data-spread='last' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>" :
- (spread ? "<i class='" + DTREEFONT + " " + ficonOpen + " " + _this.style.dfont + " " + _this.style.ficon + "' data-spread='open' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>" : "<i class='" + DTREEFONT + " " + ficonClose + " " + _this.style.dfont + " " + _this.style.ficon + "' data-spread='close' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>");
- }
- if (ficon == "-1" && dot) { // 隐藏node 加载leaf
- return isLast ? "<i class='" + DTREEFONT + " " + LI_DIV_SPREAD_LAST + " " + _this.style.dfont + " " + _this.style.ficon + "' data-spread='last' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>" :
- (spread ? "<i class='" + DTREEFONT + " " + ficonOpen + " " + _this.style.dfont + " " + _this.style.ficon + "' data-spread='open' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>" : "<i class='" + DTREEFONT + " " + ficonClose + " " + _this.style.dfont + " " + _this.style.ficon + "' data-spread='close' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>");
- }
- if (ficon == "-1" && !dot) { // 都隐藏
- return isLast ? "<i class='" + DTREEFONT + " " + LI_DIV_SPREAD_LAST + " " + ICON_HIDE + " " + _this.style.dfont + " " + _this.style.ficon + "' data-spread='last' data-id='" + treeId + "' dtree-id='" + rootId + "' style='display:none;'></i>" :
- (spread ? "<i class='" + DTREEFONT + " " + ficonOpen + " " + _this.style.dfont + " " + _this.style.ficon + "' data-spread='open' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>" : "<i class='" + DTREEFONT + " " + ficonClose + " " + _this.style.dfont + " " + _this.style.ficon + "' data-spread='close' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>");
- }
- },
- 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 ? "<i class='" + DTREEFONT + " " + leafIconShow + " " + DTREEFONTSPECIAL + " " + _this.style.dfont + " " + _this.style.icon + "' data-spread='last' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>" :
- (spread ? "<i class='" + DTREEFONT + " " + nodeIconOpen + " " + DTREEFONTSPECIAL + " " + _this.style.dfont + " " + _this.style.icon + "' data-spread='open' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>" : "<i class='" + DTREEFONT + " " + nodeIconClose + " " + DTREEFONTSPECIAL + " " + _this.style.dfont + " " + _this.style.icon + "' data-spread='close' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>");
- }
- if (nodeIcon != "-1" && leafIcon == "-1") { // 加载node 隐藏leaf
- return isLast ? "<i class='" + DTREEFONT + " " + leafIconShow + " " + DTREEFONTSPECIAL + " " + _this.style.dfont + " " + _this.style.icon + "' data-spread='last' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>" :
- (spread ? "<i class='" + DTREEFONT + " " + nodeIconOpen + " " + DTREEFONTSPECIAL + " " + _this.style.dfont + " " + _this.style.icon + "' data-spread='open' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>" : "<i class='" + DTREEFONT + " " + nodeIconClose + " " + DTREEFONTSPECIAL + " " + _this.style.dfont + " " + _this.style.icon + "' data-spread='close' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>");
- }
- if (nodeIcon == "-1" && leafIcon != "-1") { // 隐藏node 加载leaf
- return isLast ? "<i class='" + DTREEFONT + " " + leafIconShow + " " + DTREEFONTSPECIAL + " " + _this.style.dfont + " " + _this.style.icon + "' data-spread='last' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>" :
- (spread ? "<i class='" + DTREEFONT + " " + nodeIconOpen + " " + DTREEFONTSPECIAL + " " + _this.style.dfont + " " + _this.style.icon + "' data-spread='open' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>" : "<i class='" + DTREEFONT + " " + nodeIconClose + " " + DTREEFONTSPECIAL + " " + _this.style.dfont + " " + _this.style.icon + "' data-spread='close' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>");
- }
- if (nodeIcon == "-1" && leafIcon == "-1") { // 都隐藏
- return isLast ? "<i class='" + DTREEFONT + " " + leafIconShow + " " + DTREEFONTSPECIAL + " " + _this.style.dfont + " " + _this.style.icon + "' data-spread='last' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>" :
- (spread ? "<i class='" + DTREEFONT + " " + nodeIconOpen + " " + DTREEFONTSPECIAL + " " + _this.style.dfont + " " + _this.style.icon + "' data-spread='open' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>" : "<i class='" + DTREEFONT + " " + nodeIconClose + " " + DTREEFONTSPECIAL + " " + _this.style.dfont + " " + _this.style.icon + "' data-spread='close' data-id='" + treeId + "' dtree-id='" + rootId + "'></i>");
- }
- },
- checkbox: function () { // 复选框
- var flag = false;
- if (_this.checkbarLoad == "node") {
- if (checkbar) {
- flag = true;
- }
- } else {
- if (isLast) {
- if (checkbar) {
- flag = true;
- }
- }
- }
- if (flag) {
- var result = "<div class='" + LI_DIV_CHECKBAR + "' data-id='" + treeId + "' dtree-id='" + rootId + "'>";
- 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 += "<i class='" + DTREEFONT + " " + _this.style.dfont + " " + _this.style.cbox + " " + CHOOSE_CLASS + "' data-id='" + treeId + "' dtree-id='" + rootId + "' data-checked='" + checkData.isChecked + "' data-initchecked='" + checkData.isChecked + "' data-type='" + checkData.type + "' dtree-click='" + eventName.checkNodeClick + "' data-par='." + LI_CLICK_CHECKBAR + "'></i>";
- }
- }
- result += "</div>";
- return result;
- }
- return "";
- },
- text: function () { // 文字显示
- return "<cite class='" + LI_DIV_TEXT_CLASS + "' data-id='" + treeId + "' data-leaf='" + (isLast ? "leaf" : "node") + "'>" + title + "</cite>";
- },
- ul: function () { //子节点ul
- return isLast ? "<ul class='" + LI_NAV_CHILD + "' data-id='" + treeId + "' dtree-id='" + rootId + "'></ul>" :
- (spread ? "<ul class='" + LI_NAV_CHILD + " " + NAV_SHOW + "' data-id='" + treeId + "' dtree-id='" + rootId + "'></ul>" : "<ul class='" + LI_NAV_CHILD + "' data-id='" + treeId + "' dtree-id='" + rootId + "'></ul>");
- }
- };
- };
- // 获取拼接好的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 class='" + LI_DIV_ITEM + " " + _this.style.item + "' data-id='" + treeId + "' dtree-id='" + rootId + "' dtree-click='" + eventName.itemNodeClick + "' data-basic='" + basicData + "' data-record='" + recordData + "' ";
- if (_this.toolbar) {
- if (_this.toolbarLoad == "node") {
- div += " d-contextmenu='true'>";
- }
- if (_this.toolbarLoad == "noleaf") {
- if (!isLast) {
- div += " d-contextmenu='true'>";
- } else {
- div += " d-contextmenu='false'>";
- }
- }
- if (_this.toolbarLoad == "leaf") {
- if (isLast) {
- div += " d-contextmenu='true'>";
- } else {
- div += " d-contextmenu='false'>";
- }
- }
- } else {
- div += " d-contextmenu='false'>";
- }
- var li = ["<li " + "class='" + LI_CLICK_CHECKBAR + " " + LI_NAV_ITEM + "'" + "data-id='" + treeId + "'" + "data-pid='" + (flag == "root" ? (parentId ? parentId : "-1") : parentId) + "'" + "dtree-id='" + rootId + "'" + "data-index='" + level + "'" + ">" +
- div,
- dom.fnode(),
- dom.node(),
- dom.checkbox(),
- dom.text(),
- "</div>", dom.ul(), "</li>"].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("<div class='" + LI_DIV_MENUBAR + "' id='dtree_menubar_" + _this.obj[0].id + "'><div class='layui-btn-group'></div></div>");
- if (_this.toolbar) _this.obj.before("<div class='" + LI_DIV_TOOLBAR + " layui-nav' id='dtree_toolbar_" + _this.obj[0].id + "'><div class='layui-nav-item'><dl class='layui-nav-child layui-anim'></dl></div></div>");
- };
- // 开启工具栏和菜单栏
- 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 = "<button class='layui-btn layui-btn-sm layui-btn-primary' dtree-id='" + rootId + "' d-menu='" + defaultMenu.moveDown + "' title='展开节点'><i class='" + DTREEFONT + " " + LI_DIV_MENUBAR_DOWN + "'></i></button>";
- break;
- case defaultMenu.moveUp:
- gg = "<button class='layui-btn layui-btn-sm layui-btn-primary' dtree-id='" + rootId + "' d-menu='" + defaultMenu.moveUp + "' title='收缩节点'><i class='" + DTREEFONT + " " + LI_DIV_MENUBAR_UP + "'></i></button>";
- break;
- case defaultMenu.refresh:
- gg = "<button class='layui-btn layui-btn-sm layui-btn-primary' dtree-id='" + rootId + "' d-menu='" + defaultMenu.refresh + "' title='刷新'><i class='" + DTREEFONT + " " + LI_DIV_MENUBAR_REFRESH + "'></i></button>";
- break;
- case defaultMenu.remove:
- gg = (_this.checkbar) ? "<button class='layui-btn layui-btn-sm layui-btn-primary' dtree-id='" + rootId + "' d-menu='" + defaultMenu.remove + "' title='删除选中节点'><i class='" + DTREEFONT + " " + LI_DIV_MENUBAR_DELETE + "'></i></button>" : "";
- break;
- case defaultMenu.searchNode:
- gg = "<button class='layui-btn layui-btn-sm layui-btn-primary' dtree-id='" + rootId + "' d-menu='" + defaultMenu.searchNode + "' title='查询节点'><i class='" + DTREEFONT + " " + LI_DIV_MENUBAR_SEARCH + "'></i></button>";
- break;
- }
- return gg;
- };
- // 获取扩展菜单栏
- DTree.prototype.getExtMenubarDom = function (menu) {
- var _this = this;
- return "<button class='layui-btn layui-btn-sm layui-btn-primary' dtree-id='" + _this.obj[0].id + "' d-menu='" + menu.menubarId + "' title='" + menu.title + "'><i class='" + DTREEFONT + " " + menu.icon + "'></i></button>";
- };
- // 获取依附在工具栏的菜单栏
- DTree.prototype.getMenubarToolDom = function (menu) {
- var _this = this;
- var rootId = _this.obj[0].id;
- switch (menu) {
- case defaultMenu.moveDown:
- _this.toolbarMenu[defaultMenu.moveDown] = "<dd><a dtree-id='" + rootId + "' d-menu='" + defaultMenu.moveDown + "'><i class='" + DTREEFONT + " " + LI_DIV_MENUBAR_DOWN + "'></i> 展开" + _this.toolbarStyle.title + "</a></dd>";
- break;
- case defaultMenu.moveUp:
- _this.toolbarMenu[defaultMenu.moveUp] = "<dd><a dtree-id='" + rootId + "' d-menu='" + defaultMenu.moveUp + "'><i class='" + DTREEFONT + " " + LI_DIV_MENUBAR_UP + "'></i> 收缩" + _this.toolbarStyle.title + "</a></dd>";
- break;
- case defaultMenu.refresh:
- _this.toolbarMenu[defaultMenu.refresh] = "<dd><a dtree-id='" + rootId + "' d-menu='" + defaultMenu.refresh + "'><i class='" + DTREEFONT + " " + LI_DIV_MENUBAR_REFRESH + "'></i> 刷新</a></dd>";
- break;
- case defaultMenu.remove:
- if (_this.checkbar)
- _this.toolbarMenu[defaultMenu.remove] = "<dd><a dtree-id='" + rootId + "' d-menu='" + defaultMenu.remove + "'><i class='" + DTREEFONT + " " + LI_DIV_MENUBAR_DELETE + "'></i> 删除选中" + _this.toolbarStyle.title + "</a></dd>";
- break;
- case defaultMenu.searchNode:
- _this.toolbarMenu[defaultMenu.searchNode] = "<dd><a dtree-id='" + rootId + "' d-menu='" + defaultMenu.searchNode + "'><i class='" + DTREEFONT + " " + LI_DIV_MENUBAR_SEARCH + "'></i> 查询" + _this.toolbarStyle.title + "</a></dd>";
- break;
- }
- };
- // 获取依附在工具栏的扩展菜单栏
- DTree.prototype.getExtMenubarToolDom = function (menu) {
- var _this = this;
- _this.toolbarMenu[menu.menubarId] = "<dd><a dtree-id='" + _this.obj[0].id + "' d-menu='" + menu.menubarId + "'><i class='" + DTREEFONT + " " + menu.icon + "'></i> " + menu.title + "</a></dd>";
- };
- // 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] = "<dd><a dtree-tool='" + defaultTool.addToolbar + "'><i class='" + DTREEFONT + " " + LI_DIV_TOOLBAR_ADD + "'></i> 新增" + _this.toolbarStyle.title + "</a></dd>";
- }
- if (show == "edit") {
- _this.toolbarMenu[defaultTool.editToolbar] = "<dd><a dtree-tool='" + defaultTool.editToolbar + "'><i class='" + DTREEFONT + " " + LI_DIV_TOOLBAR_EDIT + "'></i> 编辑" + _this.toolbarStyle.title + "</a></dd>";
- }
- if (show == "delete") {
- _this.toolbarMenu[defaultTool.delToolbar] = "<dd><a dtree-tool='" + defaultTool.delToolbar + "'><i class='" + DTREEFONT + " " + LI_DIV_TOOLBAR_DEL + "'></i> 删除" + _this.toolbarStyle.title + "</a></dd>";
- }
- }
- }
- if (toolbarExt.length > 0) {
- for (var i = 0; i < toolbarExt.length; i++) {
- var ext = toolbarExt[i];
- _this.toolbarMenu[ext.toolbarId] = "<dd><a dtree-tool='" + ext.toolbarId + "'><i class='" + DTREEFONT + " " + ext.icon + "'></i> " + ext.title + "</a></dd>";
- }
- }
- };
- // 设置工具栏按钮
- 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 = ['<div class="layui-form-item">',
- '<label class="layui-form-label">当前选中:</label>',
- '<div class="layui-input-block f-input-par">',
- '<input type="text" name="nodeTitle" class="layui-input f-input" value="' + title + '" readonly/>',
- '</div>',
- '</div>'].join('');
- var addNodeName = ['<div class="layui-form-item">',
- '<label class="layui-form-label">新增' + _this.toolbarStyle.title + ':</label>',
- '<div class="layui-input-block f-input-par">',
- '<input type="text" name="addNodeName" class="layui-input f-input" value="" lay-verify="required"/>',
- '</div>',
- '</div>'].join('');
- var addNodeBtn = ['<div class="layui-form-item">',
- '<div class="layui-input-block" style="margin-left:0px;text-align:center;">',
- '<button type="button" class="layui-btn layui-btn-normal btn-w100" lay-submit lay-filter="dtree_addNode_form">确认添加</button>',
- '</div>',
- '</div>'].join('');
- //2. 用户自定义的节点内容
- var addNodeBar = ['<div class="' + TOOLBAR_TOOL + '"><form class="layui-form layui-form-pane" lay-filter="dtree_addNode_form">', nowNode, addNodeName];
- if (nodeBarContents != null && nodeBarContents.length > 0) {
- if (nodeBarContents[0] != null && nodeBarContents[0] != undefined && nodeBarContents[0].length > 0) {
- var addNodeBarContents = nodeBarContents[0];
- for (var j = 0; j < addNodeBarContents.length; j++) {
- var type = addNodeBarContents[j].type;
- if (!type) {
- type = "text";
- }
- switch (type) {
- case "text":
- addNodeBar.push(_this.loadToolBarDetail().text(addNodeBarContents[j]));
- break;
- case "textarea":
- addNodeBar.push(_this.loadToolBarDetail().textarea(addNodeBarContents[j]));
- break;
- case "select":
- addNodeBar.push(_this.loadToolBarDetail().select(addNodeBarContents[j]));
- break;
- case "hidden":
- addNodeBar.push(_this.loadToolBarDetail().hidden(addNodeBarContents[j]));
- break;
- }
- }
- }
- }
- addNodeBar.push(addNodeBtn);
- addNodeBar.push('</form></div>');
- html = addNodeBar.join('');
- break;
- case defaultTool.editToolbar:
- //1. 必须加载的节点内容
- var nowNode = ['<div class="layui-form-item">',
- '<label class="layui-form-label">当前选中:</label>',
- '<div class="layui-input-block f-input-par">',
- '<input type="text" name="nodeTitle" class="layui-input f-input" value="' + title + '" readonly/>',
- '</div>',
- '</div>'].join('');
- var editNodeName = ['<div class="layui-form-item">',
- '<label class="layui-form-label">编辑' + _this.toolbarStyle.title + ':</label>',
- '<div class="layui-input-block f-input-par">',
- '<input type="text" name="editNodeName" class="layui-input f-input" value="' + title + '" lay-verify="required"/>',
- '</div>',
- '</div>'].join('');
- var editNodeBtn = ['<div class="layui-form-item">',
- '<div class="layui-input-block" style="margin-left:0px;text-align:center;">',
- '<button type="button" class="layui-btn layui-btn-normal btn-w100" lay-submit lay-filter="dtree_editNode_form">确认编辑</button>',
- '</div>',
- '</div>'].join('');
- var editNodeBar = ['<div class="' + TOOLBAR_TOOL + '"><form class="layui-form layui-form-pane" lay-filter="dtree_editNode_form">', nowNode, editNodeName];
- //2. 用户自定义的节点内容
- if (nodeBarContents != null && nodeBarContents.length > 0) {
- if (nodeBarContents[1] != null && nodeBarContents[1] != undefined && nodeBarContents[1].length > 0) {
- var editNodeBarContents = nodeBarContents[1];
- for (var j = 0; j < editNodeBarContents.length; j++) {
- var type = editNodeBarContents[j].type;
- if (!type) {
- type = "text";
- }
- switch (type) {
- case "text":
- editNodeBar.push(_this.loadToolBarDetail().text(editNodeBarContents[j]));
- break;
- case "textarea":
- editNodeBar.push(_this.loadToolBarDetail().textarea(editNodeBarContents[j]));
- break;
- case "select":
- editNodeBar.push(_this.loadToolBarDetail().select(editNodeBarContents[j]));
- break;
- case "hidden":
- editNodeBar.push(_this.loadToolBarDetail().hidden(editNodeBarContents[j]));
- break;
- }
- }
- }
- }
- editNodeBar.push(editNodeBtn);
- editNodeBar.push('</form></div>');
- html = editNodeBar.join('');
- break;
- }
- return html;
- };
- // 获取toolbar详细的标签信息
- DTree.prototype.loadToolBarDetail = function () {
- var _this = this;
- return {
- text: function (nodeBarContents) {
- return ['<div class="layui-form-item">',
- '<label class="layui-form-label" title="' + nodeBarContents.label + '">' + nodeBarContents.label + ':</label>',
- '<div class="layui-input-block f-input-par">',
- '<input type="text" name="' + nodeBarContents.name + '" class="layui-input f-input" value="' + (nodeBarContents.value ? nodeBarContents.value : "") + '"/>',
- '</div>',
- '</div>'].join('');
- },
- textarea: function (nodeBarContents) {
- return ['<div class="layui-form-item layui-form-text">',
- '<label class="layui-form-label">' + nodeBarContents.label + ':</label>',
- '<div class="layui-input-block f-input-par">',
- '<textarea name="' + nodeBarContents.name + '" class="layui-textarea f-input">' + (nodeBarContents.value ? nodeBarContents.value : "") + '</textarea>',
- '</div>',
- '</div>'].join('');
- },
- hidden: function (nodeBarContents) {
- return ['<input type="hidden" name="' + nodeBarContents.name + '" class="layui-input f-input" value="' + (nodeBarContents.value ? nodeBarContents.value : "") + '"/>'].join('');
- },
- select: function (nodeBarContents) {
- var optionsData = nodeBarContents.optionsData;
- var options = "";
- var defaultValue = nodeBarContents.value ? nodeBarContents.value : "";
- for (var key in optionsData) {
- if (defaultValue == optionsData[key]) {
- options += "<option value='" + key + "' selected>" + optionsData[key] + "</option>";
- } else {
- options += "<option value='" + key + "'>" + optionsData[key] + "</option>";
- }
- }
- return ['<div class="layui-form-item">',
- '<label class="layui-form-label" title="' + nodeBarContents.label + '">' + nodeBarContents.label + ':</label>',
- '<div class="layui-input-block f-input-par">',
- '<select name="' + nodeBarContents.name + '">',
- options,
- '</select>',
- '</div>',
- '</div>'].join('');
- }
- }
- };
- // 新增节点后改变节点内容
- DTree.prototype.changeTreeNodeAdd = function (returnID) {
- var _this = this;
- var temp = _this.temp;
- var id = temp[0], $ul = temp[1], $div = temp[2], level = temp[3];
- if (returnID) {
- var $thisDiv = _this.obj.find("[data-id='" + id + "']");
- if (typeof returnID === "object") {
- // 如果是JSON格式数据,则将当前DIV删除,重新建造DIV
- $thisDiv.remove();
- var parseData = _this.parseData(returnID);
- if (parseData.treeId()) {
- $ul.append(_this.getLiItemDom(parseData.treeId(), parseData.parentId(), parseData.title(), parseData.isLast(0), parseData.iconClass(), parseData.checkArr(), level, parseData.spread(), parseData.disabled(), parseData.basicData(), parseData.recordData(), "item"));
- // 建造完毕后,选中该DIV
- var $addDiv = $ul.find("div[data-id='" + returnID.id + "']");
- _this.setNodeParam($addDiv)
- } else {
- layer.msg("添加失败,节点ID为undefined!", {icon: 5});
- // 将li节点删除
- $ul.find("li[data-id='" + id + "']").remove();
- // 重新赋值
- _this.setNodeParam($div);
- // 临时变量制空
- _this.temp = [];
- return;
- }
- } else if (typeof returnID === "string" || typeof this.icon === 'number') {
- $thisDiv.attr("data-id", returnID);
- // 将li节点展示
- $ul.find("li[data-id='" + returnID + "']").show();
- var $addDiv = $ul.find("div[data-id='" + returnID + "']");
- _this.setNodeParam($addDiv)
- }
- // 判断当前点击的节点是否是最后一级节点,如果是,则需要修改节点的样式
- var $icon_i = $div.find("i[data-spread]");
- if ($icon_i.eq(0).attr("data-spread") == "last") {
- $icon_i.attr("data-spread", "open");
- $icon_i.eq(0).removeClass(LI_DIV_SPREAD_LAST);
- $icon_i.eq(0).removeClass(ICON_HIDE);
- $icon_i.eq(0).addClass(_this.ficonOpen);
- $icon_i.eq(1).removeClass(leafIconArray[_this.leafIcon]);
- $icon_i.eq(1).addClass(_this.nodeIconOpen);
- } else { //如果不是,也要修改节点样式
- $icon_i.attr("data-spread", "open");
- $icon_i.eq(0).removeClass(_this.ficonClose);
- $icon_i.eq(0).addClass(_this.ficonOpen);
- $icon_i.eq(1).removeClass(_this.nodeIconClose);
- $icon_i.eq(1).addClass(_this.nodeIconOpen);
- // _this.clickSpread($div);
- }
- $ul.addClass(NAV_SHOW); //展开UL
- } else {
- // 将li节点删除
- $ul.find("li[data-id='" + id + "']").remove();
- // 重新赋值
- _this.setNodeParam($div);
- }
- _this.temp = []; // 临时变量制空
- };
- // 修改节点后改变节点内容
- DTree.prototype.changeTreeNodeEdit = function (flag) {
- var _this = this;
- var temp = _this.temp;
- var $cite = temp[0],
- $div = temp[1];
- if (!flag) {
- $cite.html(title);
- node = _this.getNodeParam($div);
- }
- _this.temp = []; // 临时变量制空
- };
- // 编辑页打开后显示编辑页内容
- DTree.prototype.changeTreeNodeDone = function (param) {
- var _this = this;
- form.val('dtree_editNode_form', param);
- form.render();
- };
- // 删除节点后改变节点内容
- DTree.prototype.changeTreeNodeDel = function (flag) {
- var _this = this;
- var temp = _this.temp;
- var $p_li = temp[0],
- $p_ul = $p_li.parent("ul"),
- $p_div = temp[1];
- if (flag) {
- $p_li.remove();
- // 判断父级ul中是否还存在li,如果不存在,则需要修改节点的样式
- if ($p_ul.children("li").length == 0) {
- var $icon_i = $p_div.find("i[data-spread]");
- $icon_i.attr("data-spread", "last");
- $icon_i.eq(0).removeClass(_this.ficonOpen);
- $icon_i.eq(0).removeClass(_this.ficonClose);
- if (!_this.dot) {
- $icon_i.eq(0).addClass(ICON_HIDE);
- }
- $icon_i.eq(0).addClass(LI_DIV_SPREAD_LAST);
- $icon_i.eq(1).removeClass(_this.nodeIconOpen);
- $icon_i.eq(1).removeClass(_this.nodeIconClose);
- $icon_i.eq(1).addClass(leafIconArray[_this.leafIcon]);
- }
- _this.initNodeParam();
- }
- _this.temp = []; // 临时变量制空
- };
- /******************** 复选框区域 ********************/
- // 初始化复选框的值
- DTree.prototype.chooseDataInit = function (chooseIds) {
- var _this = this;
- var chooseId = chooseIds.split(",");
- for (var i = 0; i < chooseId.length; i++) {
- _this.obj.find("i[dtree-click='" + eventName.checkNodeClick + "']").each(function () {
- if ($(this).attr("data-id") == chooseId[i]) {
- _this.checkStatus($(this)).check();
- }
- });
- }
- // 展开选中节点的父节点
- var $li_parents = _this.obj.find("i[dtree-click='" + eventName.checkNodeClick + "'][data-checked='1']").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.getCheckbarNodesParam();
- };
- //实现复选框点击,子集选中父级也选中
- DTree.prototype.checkAllOrNot = function ($i) {
- var _this = this;
- //$i 当前点击的checkbox
- var dataPar = $i.attr("data-par"),
- dataType = $i.attr("data-type"),
- $li = $i.closest(dataPar), //当前checkbox的上级li节点
- $parent_li = $i.parents(dataPar), //当前checkbox的所有父级li节点
- $child_li = $li.find(dataPar); //当前checkbox的上级li节点下的所有子级li节点
- if ($i.attr("data-checked") == "1") {
- // 处理当前节点的选中状态
- _this.checkStatus($i).noCheck();
- // 处理子级节点的选中状态
- var $child_li_i = $child_li.find(">." + LI_DIV_ITEM + ">." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "']");
- _this.checkStatus($child_li_i).noCheck();
- // 处理父级节点的选中状态
- for (var i = 1, item = $parent_li; i < item.length; i++) {
- var flag = item.eq(i).find(">." + LI_NAV_CHILD + " ." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "'][data-checked='1']").length;
- if (flag == 0) {
- //把父级去掉选中
- var $item_i = item.eq(i).find(">." + LI_DIV_ITEM + ">." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "']");
- _this.checkStatus($item_i).noCheck();
- }
- }
- } else {
- // 处理当前节点的选中状态
- _this.checkStatus($i).check();
- // 处理子级节点的选中状态
- var $child_li_i = $child_li.find(">." + LI_DIV_ITEM + ">." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "']");
- _this.checkStatus($child_li_i).check();
- // 处理父级节点的选中状态
- for (var i = 1, item = $parent_li; i < item.length; i++) {
- var $item_i = item.eq(i).find(">." + LI_DIV_ITEM + ">." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "']");
- //把父级选中
- _this.checkStatus($item_i).check();
- }
- }
- };
- //实现复选框点击, no-all 子集选中父级半选中,子集全选父级选中
- DTree.prototype.checkAllOrNoallOrNot = function ($i) {
- var _this = this;
- //$i 当前点击的checkbox
- var $div = $i.closest("." + LI_DIV_ITEM),
- dataPar = $i.attr("data-par"),
- dataType = $i.attr("data-type"),
- $li = $i.closest(dataPar), //当前checkbox的上级li节点
- $parent_li = $i.parents(dataPar), //当前checkbox的所有父级li节点
- $child_li = $li.find(dataPar); //当前checkbox的上级li节点下的所有子级li节点
- if ($i.attr("data-checked") == "1") { //当前复选框为选中状态,点击后变为未选中状态
- // 处理当前节点的选中状态
- _this.checkStatus($i).noCheck();
- // 处理子级节点的选中状态
- var $child_li_i = $child_li.find(">." + LI_DIV_ITEM + ">." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "']");
- _this.checkStatus($child_li_i).noCheck();
- // 处理父级节点的选中状态
- for (var i = 1, item = $parent_li; i < item.length; i++) {
- var flag = item.eq(i).find(">." + LI_NAV_CHILD + " ." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "'][data-checked='1']").length;
- var $item_i = item.eq(i).find(">." + LI_DIV_ITEM + ">." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "']");
- if (flag == 0) {
- //把父级去掉选中
- _this.checkStatus($item_i).noCheck();
- } else {
- //把父级半选
- _this.checkStatus($item_i).noallCheck();
- }
- }
- } else { //当前复选框为未选中状态,点击后变为选中状态
- // 处理当前节点的选中状态
- _this.checkStatus($i).check();
- // 处理子级节点的选中状态
- var $child_li_i = $child_li.find(">." + LI_DIV_ITEM + ">." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "']");
- _this.checkStatus($child_li_i).check();
- // 处理父级节点的选中状态
- for (var i = 1, item = $parent_li; i < item.length; i++) {
- var flag1 = item.eq(i).find(">." + LI_NAV_CHILD + " ." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "'][data-checked='1']").length;
- var flag2 = item.eq(i).find(">." + LI_NAV_CHILD + " ." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "']").length;
- var $item_i = item.eq(i).find(">." + LI_DIV_ITEM + ">." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "']");
- if (flag1 != flag2) {
- // 父级复选框半选
- _this.checkStatus($item_i).noallCheck();
- } else {
- // 父级复选框全选
- _this.checkStatus($item_i).check();
- }
- }
- }
- };
- //实现复选框点击,p-casc:父级选中子集全选,子集无法改变父级选中状态
- DTree.prototype.checkAllOrPcascOrNot = function ($i) {
- var _this = this;
- //$i 当前点击的checkbox
- var $div = $i.closest("." + LI_DIV_ITEM),
- dataPar = $i.attr("data-par"),
- dataType = $i.attr("data-type"),
- $li = $i.closest(dataPar), //当前checkbox的上级li节点
- $parent_li = $i.parents(dataPar), //当前checkbox的所有父级li节点
- $child_li = $li.find(dataPar); //当前checkbox的上级li节点下的所有子级li节点
- if ($i.attr("data-checked") == "1") { //当前复选框为选中状态,点击后变为未选中状态
- // 处理当前节点的选中状态
- _this.checkStatus($i).noCheck();
- // 处理子级节点的选中状态
- var $child_li_i = $child_li.find(">." + LI_DIV_ITEM + ">." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "']");
- _this.checkStatus($child_li_i).noCheck();
- } else { //当前复选框为未选中状态,点击后变为选中状态
- // 处理当前节点的选中状态
- _this.checkStatus($i).check();
- // 处理子级节点的选中状态
- var $child_li_i = $child_li.find(">." + LI_DIV_ITEM + ">." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "']");
- _this.checkStatus($child_li_i).check();
- }
- };
- //实现复选框点击,self:各自选中互不影响
- DTree.prototype.checkOrNot = function ($i) {
- var _this = this;
- //$i 当前点击的checkbox
- var $div = $i.closest("." + LI_DIV_ITEM),
- dataPar = $i.attr("data-par"),
- dataType = $i.attr("data-type"),
- $li = $i.closest(dataPar), //当前checkbox的上级li节点
- $parent_li = $i.parents(dataPar), //当前checkbox的所有父级li节点
- $child_li = $li.find(dataPar); //当前checkbox的上级li节点下的所有子级li节点
- if ($i.attr("data-checked") == "1") { //当前复选框为选中状态,点击后变为未选中状态
- // 处理当前节点的选中状态
- _this.checkStatus($i).noCheck();
- } else { //当前复选框为未选中状态,点击后变为选中状态
- // 处理当前节点的选中状态
- _this.checkStatus($i).check();
- }
- };
- //实现复选框点击,only:只能选中1个复选框
- DTree.prototype.checkOnly = function ($i) {
- var _this = this;
- //$i 当前点击的checkbox
- var $div = $i.closest("." + LI_DIV_ITEM),
- dataPar = $i.attr("data-par"),
- dataType = $i.attr("data-type"),
- $li = $i.closest(dataPar), //当前checkbox的上级li节点
- $parent_li = $i.parents(dataPar), //当前checkbox的所有父级li节点
- $child_li = $li.find(dataPar); //当前checkbox的上级li节点下的所有子级li节点
- var checked = $i.attr("data-checked");
- // 将全部节点全部设为未选中状态
- var $all_i = _this.obj.find("i[data-checked]");
- _this.checkStatus($all_i).noCheck();
- if (checked != "1") { //当前复选框为未选中状态,点击后变为选中状态
- // 处理当前节点的选中状态
- _this.checkStatus($i).check();
- }
- };
- //实现复选框点击
- DTree.prototype.changeCheck = function () {
- var _this = this;
- var temp = _this.temp;
- var $i = temp[0];
- // 复选框选中事件
- if (_this.checkbarType == "all") {
- _this.checkAllOrNot($i);
- } else if (_this.checkbarType == "no-all") {
- _this.checkAllOrNoallOrNot($i);
- } else if (_this.checkbarType == "p-casc") {
- _this.checkAllOrPcascOrNot($i);
- } else if (_this.checkbarType == "self") {
- _this.checkOrNot($i);
- } else if (_this.checkbarType == "only") {
- _this.checkOnly($i);
- } else {
- _this.checkAllOrNot($i);
- }
- // 获取复选框选中节点的内容
- var checkbarNodes = _this.setAndGetCheckbarNodesParam();
- // 用户自定义想做的事情
- _this.checkbarFun.chooseDone(checkbarNodes);
- layui.event.call(this, MOD_NAME, "chooseDone(" + $(_this.obj)[0].id + ")", {"checkbarParams": checkbarNodes});
- _this.temp = [];
- };
- //复选框半选状态初始化设置
- DTree.prototype.initNoAllCheck = function () {
- var _this = this;
- //1.获取所有选中节点
- var $is = _this.obj.find("i[data-checked='1']");
- if ($is.length > 0) {
- for (var key = 0; key < $is.length; key++) {
- var $i = $($is[key]),
- dataPar = $i.attr("data-par"),
- dataType = $i.attr("data-type"),
- $li = $i.closest(dataPar), //当前checkbox的上级li节点
- $parent_li = $i.parents(dataPar), //当前checkbox的所有父级li节点
- $child_li = $li.find(dataPar); //当前checkbox的上级li节点下的所有子级li节点
- // 处理父级节点的选中状态
- for (var i = 1, item = $parent_li; i < item.length; i++) {
- var flag1 = item.eq(i).find(">." + LI_NAV_CHILD + " ." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "'][data-checked='1']").length;
- var flag2 = item.eq(i).find(">." + LI_NAV_CHILD + " ." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "']").length;
- var $item_i = item.eq(i).find(">." + LI_DIV_ITEM + ">." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "']");
- if (flag1 != flag2) {
- // 父级复选框半选
- _this.checkStatus($item_i).noallCheck();
- } else {
- // 父级复选框全选
- _this.checkStatus($item_i).check();
- }
- }
- }
- }
- };
- //复选框选中状态初始化设置
- DTree.prototype.initAllCheck = function () {
- var _this = this;
- //1.获取所有选中节点
- var $is = _this.obj.find("i[data-checked='1']");
- if ($is.length > 0) {
- for (var key = 0; key < $is.length; key++) {
- var $i = $($is[key]),
- dataPar = $i.attr("data-par"),
- dataType = $i.attr("data-type"),
- $li = $i.closest(dataPar), //当前checkbox的上级li节点
- $parent_li = $i.parents(dataPar), //当前checkbox的所有父级li节点
- $child_li = $li.find(dataPar); //当前checkbox的上级li节点下的所有子级li节点
- // 处理父级节点的选中状态
- for (var i = 1, item = $parent_li; i < item.length; i++) {
- var $item_i = item.eq(i).find(">." + LI_DIV_ITEM + ">." + LI_DIV_CHECKBAR + ">i[data-type='" + dataType + "']");
- // 父级复选框全选
- _this.checkStatus($item_i).check();
- }
- }
- }
- };
- // 设置复选框选中/未选中/半选 _this.checkStatus($i).check(); _this.checkStatus($i).noCheck(); _this.checkStatus($i).noallCheck();
- DTree.prototype.checkStatus = function ($i) {
- var _this = this;
- return {
- check: function () {
- $i.removeClass(LI_DIV_CHECKBAR_OUT);
- $i.removeClass(LI_DIV_CHECKBAR_NOALL);
- $i.addClass(LI_DIV_CHECKBAR_ON);
- $i.addClass(_this.style.chs);
- $i.attr("data-checked", "1");
- },
- noCheck: function () {
- $i.removeClass(LI_DIV_CHECKBAR_NOALL);
- $i.removeClass(LI_DIV_CHECKBAR_ON);
- $i.removeClass(_this.style.chs);
- $i.addClass(LI_DIV_CHECKBAR_OUT);
- $i.attr("data-checked", "0");
- },
- noallCheck: function () {
- $i.removeClass(LI_DIV_CHECKBAR_OUT);
- $i.removeClass(LI_DIV_CHECKBAR_ON);
- $i.addClass(LI_DIV_CHECKBAR_NOALL);
- $i.addClass(_this.style.chs);
- $i.attr("data-checked", "2");
- }
- }
- };
- // 设置树的复选框操作值的全部参数,并获取
- DTree.prototype.setAndGetCheckbarNodesParam = function () {
- var _this = this;
- //操作前先清空
- _this.checkbarNode = [];
- // 选择所有复选框节点
- if (_this.checkbarData == "change") { //记录变更数据
- _this.obj.find("i[data-par]").each(function () {
- var $i = $(this), $div = $i.closest("." + LI_DIV_ITEM);
- if ($i.attr("data-checked") != $i.attr("data-initchecked")) {
- _this.checkbarNode.push(_this.getRequestParam(_this.getCheckbarNodeParam($div, $i)));
- }
- });
- } else if (_this.checkbarData == "all") { //记录全部数据
- _this.obj.find("i[data-par][data-checked]").each(function () {
- var $i = $(this), $div = $i.closest("." + LI_DIV_ITEM);
- _this.checkbarNode.push(_this.getRequestParam(_this.getCheckbarNodeParam($div, $i)));
- });
- } else { //记录选中数据
- _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)));
- });
- }
- return _this.checkbarNode;
- };
- // 获取树的复选框操作值的全部参数
- DTree.prototype.getCheckbarNodesParam = function () {
- var _this = this;
- return _this.setAndGetCheckbarNodesParam();
- };
- // 获取树的一个复选框的参数
- DTree.prototype.getCheckbarNodeParam = function ($div, $i) {
- var _this = this;
- var temp_node = {};
- temp_node.nodeId = $div.attr("data-id");
- temp_node.parentId = $div.parent().attr("data-pid");
- temp_node.context = $div.find("cite[data-leaf]").eq(0).text();
- temp_node.isLeaf = $div.find("cite[data-leaf]").eq(0).attr("data-leaf") == "leaf" ? true : false;
- temp_node.level = $div.parent().attr("data-index");
- temp_node.spread = $div.find("i[data-spread]").eq(0).attr("data-spread") == "open" ? true : false;
- temp_node.basicData = $div.attr("data-basic");
- temp_node.recordData = $div.attr("data-record");
- temp_node.dataType = $i.attr("data-type");
- temp_node.ischecked = $i.attr("data-checked");
- temp_node.initchecked = $i.attr("data-initchecked");
- return temp_node;
- };
- //判断复选框是否发生变更
- DTree.prototype.changeCheckbarNodes = function () {
- var flag = false;
- var _this = this;
- _this.obj.find("i[data-par]").each(function () {
- var $i = $(this);
- $div = $i.closest("." + LI_DIV_ITEM);
- if ($i.attr("data-checked") != $i.attr("data-initchecked")) {
- flag = true;
- return true;
- }
- });
- return flag;
- };
- /******************** iframe区域 ********************/
- // 加载iframe
- DTree.prototype.loadIframe = function ($div, iframeParam) {
- var _this = this;
- var $cite = $div.find("cite[data-leaf]").eq(0);
- if (!_this.useIframe) { // 启用iframe
- return false;
- }
- var iframeElem = _this.iframe.iframeElem,
- iframeUrl = _this.iframe.iframeUrl,
- iframeLoad = _this.iframe.iframeLoad;
- var flag = iframeLoad == "leaf" ? (($cite.attr("data-leaf") == "leaf") ? true : false) : true;
- if (flag) {
- if ($(iframeElem).length > 0) { //iframe存在
- if (!iframeUrl) {
- layer.msg("数据请求异常,iframeUrl参数未指定", {icon: 5});
- return false;
- }
- var param = AjaxHelper.serialize(iframeParam);
- if (iframeUrl.indexOf("?") > -1) {
- param = "&" + param.substring(1, param.length);
- }
- var url = iframeUrl + param;
- $(iframeElem).attr("src", url);
- } else {
- layer.msg("iframe绑定异常,请确认页面中是否有iframe页对应的容器", {icon: 5});
- return false;
- }
- }
- return flag;
- };
- // 获取传递出去的参数,根据iframe.iframeDefaultRequest、iframe.iframeRequest和node拼出发出请求的参数
- DTree.prototype.getIframeRequestParam = function (nodes) {
- var _this = this;
- var request = _this.iframe.iframeRequest,
- defaultRequestNames = _this.iframe.iframeDefaultRequest,
- node = nodes || _this.node,
- requestParam = {};
- // 先拼用户自定义的,在拼树生成的,这样的话用户可以自定义当树未生成时的节点的初始值
- for (var key in request) {
- requestParam[key] = request[key];
- }
- for (var key in defaultRequestNames) {
- var paramName = defaultRequestNames[key];
- var paramValue = node[key];
- if (typeof paramValue === "boolean") {
- requestParam[paramName] = paramValue;
- } else {
- if (paramValue) {
- requestParam[paramName] = paramValue;
- }
- }
- }
- // 解决传递中文的乱码问题
- var reg = /[\u4E00-\u9FA5\uF900-\uFA2D]/; //正则匹配中文
- for (var key in requestParam) {
- if (reg.test(requestParam[key])) {
- var str = requestParam[key];
- requestParam[key] = encodeURI(encodeURI(str));
- }
- }
- return requestParam;
- };
- /******************** 数据回调区域 ********************/
- // 获取当前选中节点下一个UL 或根节点。为了将新节点放入ul下
- DTree.prototype.getNowNodeUl = function () {
- var _this = this;
- return (_this.obj.find("div[data-id]").parent().find("." + NAV_THIS).length == 0) ? _this.obj : _this.obj.find("div[data-id]").parent().find("." + NAV_THIS).next("ul");
- };
- // 获取当前选中节点 或根节点。
- DTree.prototype.getNowNode = function () {
- var _this = this;
- return (_this.obj.find("div[data-id]").parent().find("." + NAV_THIS).length == 0) ? _this.obj.children("li").eq(0).children("div").eq(0) : _this.obj.find("div[data-id]").parent().find("." + NAV_THIS);
- };
- // 设置当前选中节点的全部参数
- DTree.prototype.setNodeParam = function ($div) {
- var _this = this;
- _this.node.nodeId = $div.attr("data-id");
- _this.node.parentId = $div.parent().attr("data-pid");
- _this.node.context = $div.find("cite[data-leaf]").eq(0).text();
- _this.node.isLeaf = $div.find("cite[data-leaf]").eq(0).attr("data-leaf") == "leaf" ? true : false;
- _this.node.level = $div.parent().attr("data-index");
- _this.node.spread = $div.find("i[data-spread]").eq(0).attr("data-spread") == "open" ? true : false;
- _this.node.basicData = $div.attr("data-basic");
- _this.node.recordData = $div.attr("data-record");
- if ($div.find("i[data-par]")) {
- var dataTypes = "", ischeckeds = "", initcheckeds = "";
- $div.find("i[data-par]").each(function () {
- dataTypes += $(this).attr("data-type") + ",";
- ischeckeds += $(this).attr("data-checked") + ",";
- initcheckeds += $(this).attr("data-initchecked") + ",";
- });
- dataTypes = dataTypes.substring(0, dataTypes.length - 1);
- ischeckeds = ischeckeds.substring(0, ischeckeds.length - 1);
- initcheckeds = initcheckeds.substring(0, initcheckeds.length - 1);
- _this.node.dataType = dataTypes;
- _this.node.ischecked = ischeckeds;
- _this.node.initchecked = initcheckeds;
- }
- };
- // 获取当前选中节点的全部参数
- DTree.prototype.getNodeParam = function ($div) {
- var _this = this;
- if ($div) {
- _this.setNodeParam($div);
- } else {
- if (_this.obj.find("div[data-id]").parent().find("." + NAV_THIS).length == 0) {
- _this.initNodeParam();
- }
- }
- return this.node;
- };
- // 获取一个临时的node参数
- DTree.prototype.getTempNodeParam = function ($div) {
- var _this = this;
- var temp_node = {};
- temp_node.nodeId = $div.attr("data-id");
- temp_node.parentId = $div.parent().attr("data-pid");
- temp_node.context = $div.find("cite[data-leaf]").eq(0).text();
- temp_node.isLeaf = $div.find("cite[data-leaf]").eq(0).attr("data-leaf") == "leaf" ? true : false;
- temp_node.level = $div.parent().attr("data-index");
- temp_node.spread = $div.find("i[data-spread]").eq(0).attr("data-spread") == "open" ? true : false;
- temp_node.basicData = $div.attr("data-basic");
- temp_node.recordData = $div.attr("data-record");
- if ($div.find("i[data-par]")) {
- var dataTypes = "", ischeckeds = "", initcheckeds = "";
- $div.find("i[data-par]").each(function () {
- dataTypes += $(this).attr("data-type") + ",";
- ischeckeds += $(this).attr("data-checked") + ",";
- initcheckeds += $(this).attr("data-initchecked") + ",";
- });
- dataTypes = dataTypes.substring(0, dataTypes.length - 1);
- ischeckeds = ischeckeds.substring(0, ischeckeds.length - 1);
- initcheckeds = initcheckeds.substring(0, initcheckeds.length - 1);
- temp_node.dataType = dataTypes;
- temp_node.ischecked = ischeckeds;
- temp_node.initchecked = initcheckeds;
- }
- return temp_node;
- };
- // 重置参数
- DTree.prototype.initNodeParam = function () {
- var _this = this;
- _this.node.nodeId = "";
- _this.node.parentId = "";
- _this.node.context = "";
- _this.node.isLeaf = "";
- _this.node.level = "";
- _this.node.spread = "";
- _this.node.dataType = "";
- _this.node.ischecked = "";
- _this.node.initchecked = "";
- _this.node.basicData = "";
- };
- // 获取传递出去的参数,根据defaultRequest、request和node拼出发出请求的参数
- DTree.prototype.getRequestParam = function (nodes) {
- var _this = this;
- var request = _this.request,
- defaultRequestNames = _this.defaultRequest,
- node = nodes || _this.node,
- requestParam = {};
- // 先拼用户自定义的,在拼树生成的,这样的话用户可以自定义当树未生成时的节点的初始值
- for (var key in request) {
- requestParam[key] = request[key];
- }
- for (var key in defaultRequestNames) {
- var paramName = defaultRequestNames[key];
- var paramValue = node[key];
- if (typeof paramValue === "boolean") {
- requestParam[paramName] = paramValue;
- } else {
- if (paramValue) {
- requestParam[paramName] = paramValue;
- }
- }
- }
- return requestParam;
- };
- // 获取filterParam过滤后的requestParam
- DTree.prototype.getFilterRequestParam = function (requestParam) {
- var _this = this;
- var filterRequest = _this.filterRequest;
- return event.cloneObj(requestParam, filterRequest);
- };
- // 获取当前选中值
- DTree.prototype.getNowParam = function () {
- var _this = this;
- return _this.getRequestParam(_this.getNodeParam());
- };
- // 获取参数的上级节点
- DTree.prototype.getParentParam = function (id) {
- var _this = this;
- var $div = _this.obj.find("div[data-id='" + id + "']");
- if ($div.length > 0) {
- return _this.callbackData().parentNode($div);
- } else {
- return {};
- }
- };
- // 获取参数的下级节点
- DTree.prototype.getChildParam = function (id) {
- var _this = this;
- var $div = _this.obj.find("div[data-id='" + id + "']");
- if ($div.length > 0) {
- return _this.callbackData().childNode($div);
- } else {
- return [];
- }
- };
- // 获取回调数据
- DTree.prototype.callbackData = function () {
- var _this = this;
- return {
- dom: function ($dom) { // 获取dom
- return $dom;
- },
- node: function (node) { // 获取当前节点值
- return _this.getRequestParam(node);
- },
- childNode: function ($div) { // 获取下级节点值
- var $childDivs = $div.next("ul").find("li." + LI_NAV_ITEM + " div." + LI_DIV_ITEM);
- var childNode = [];
- if ($childDivs && $childDivs.length > 0) {
- $childDivs.each(function () {
- var $cDiv = $(this);
- childNode.push(_this.getRequestParam(_this.getTempNodeParam($cDiv)));
- });
- }
- return childNode;
- },
- parentNode: function ($div) { // 获取上级节点值
- var pId = $div.parent().attr("data-pid");
- var $pdiv = _this.obj.find("div[data-id='" + pId + "']");
- if ($pdiv.length > 0) {
- return _this.getRequestParam(_this.getTempNodeParam($pdiv));
- } else {
- return {};
- }
- }
- }
- };
- /******************** 事件回调区域 ********************/
- // 绑定浏览器事件
- DTree.prototype.bindBrowserEvent = function () {
- var _this = this;
- // 绑定文件夹展开/收缩的图标的点击事件,点击时给当前节点的div添加选中class
- _this.obj.on("click", "i[data-spread]", function (event) {
- event.stopPropagation();
- var $i = $(this),
- $div = $i.parent("div"),
- $cite = $div.find("cite"),
- node = _this.getNodeParam($div),
- $ul = $div.next("ul"),
- $p_li = $div.parent("li[data-index]"), //当前选中节点的顶级li节点
- $p_ul = $p_li.parent("ul");
- var $toolBarDiv = _this.obj.prevAll('div#dtree_toolbar_' + _this.obj[0].id);
- $toolBarDiv.find(".layui-nav-child").removeClass('layui-anim-fadein layui-show');
- _this.obj.find("div[data-id]").parent().find("." + NAV_THIS).removeClass(NAV_THIS);
- _this.obj.find("div[data-id]").parent().find("." + _this.style.itemThis).removeClass(_this.style.itemThis);
- $div.addClass(NAV_THIS);
- $div.addClass(_this.style.itemThis);
- _this.clickSpread($div); // 展开或隐藏节点
- // 树状态改变后,用户自定义想做的事情
- layui.event.call(this, MOD_NAME, "changeTree(" + $(_this.obj)[0].id + ")", {
- param: _this.callbackData().node(node),
- dom: _this.callbackData().dom($i),
- show: _this.callbackData().dom($i).attr("data-spread") == "open" ? true : false
- });
- });
- // 绑定所有子节点div的单击事件,点击时触发加载iframe或用户自定义想做的事情
- _this.obj.on("click", "div[dtree-click='" + eventName.itemNodeClick + "']", function (event) {
- event.stopPropagation();
- var $div = $(this),
- $cite = $div.find("cite"),
- node = _this.getNodeParam($div),
- $ul = $div.next("ul"),
- $p_li = $div.parent("li[data-index]"), //当前选中节点的顶级li节点
- $p_ul = $p_li.parent("ul");
- var $toolBarDiv = _this.obj.prevAll('div#dtree_toolbar_' + _this.obj[0].id);
- $toolBarDiv.find(".layui-nav-child").removeClass('layui-anim-fadein layui-show');
- _this.obj.find("div[data-id]").parent().find("." + NAV_THIS).removeClass(NAV_THIS);
- _this.obj.find("div[data-id]").parent().find("." + _this.style.itemThis).removeClass(_this.style.itemThis);
- $div.addClass(NAV_THIS);
- $div.addClass(_this.style.itemThis);
- if (_this.useIframe) {
- var iframeParam = _this.getFilterRequestParam(_this.getIframeRequestParam(node));
- var flag = _this.loadIframe($div, iframeParam); // 加载iframe
- if (flag) {
- // iframe加载完毕后,用户自定义想做的事情
- _this.iframeFun.iframeDone(iframeParam);
- layui.event.call(this, MOD_NAME, "iframeDone(" + $(_this.obj)[0].id + ")", {
- "iframeParam": iframeParam,
- dom: _this.callbackData().dom($div)
- });
- }
- } else {
- // 单击事件执行完毕后,用户自定义想做的事情
- layui.event.call(this, MOD_NAME, "node(" + $(_this.obj)[0].id + ")", {
- param: _this.callbackData().node(node),
- childParams: _this.callbackData().childNode($div),
- parentParam: _this.callbackData().parentNode($div),
- dom: _this.callbackData().dom($div)
- });
- }
- });
- // 绑定所有子节点div的双击事件,暴露on给用户自定义
- _this.obj.on("dblclick", "div[dtree-click='" + eventName.itemNodeClick + "']", function (event) {
- event.stopPropagation();
- var $div = $(this),
- $cite = $div.find("cite"),
- node = _this.getNodeParam($div),
- $ul = $div.next("ul"),
- $p_li = $div.parent("li[data-index]"), //当前选中节点的顶级li节点
- $p_ul = $p_li.parent("ul");
- var $toolBarDiv = _this.obj.prevAll('div#dtree_toolbar_' + _this.obj[0].id);
- $toolBarDiv.find(".layui-nav-child").removeClass('layui-anim-fadein layui-show');
- _this.obj.find("div[data-id]").parent().find("." + NAV_THIS).removeClass(NAV_THIS);
- _this.obj.find("div[data-id]").parent().find("." + _this.style.itemThis).removeClass(_this.style.itemThis);
- $div.addClass(NAV_THIS);
- $div.addClass(_this.style.itemThis);
- // 双击事件执行完毕后,用户自定义想做的事情
- layui.event.call(this, MOD_NAME, "nodedblclick(" + $(_this.obj)[0].id + ")", {
- param: _this.callbackData().node(node),
- childParams: _this.callbackData().childNode($div),
- parentParam: _this.callbackData().parentNode($div),
- dom: _this.callbackData().dom($div)
- });
- });
- //绑定所有子节点div的右键点击事件,用于显示toolbar
- _this.obj.on("contextmenu", "div[dtree-click='" + eventName.itemNodeClick + "'][d-contextmenu]", function (e) {
- var $div = $(this),
- node = _this.getNodeParam($div),
- contextmenu = $div.attr("d-contextmenu");
- if (_this.toolbar) {
- var $toolBarDiv = _this.obj.prevAll('div#dtree_toolbar_' + _this.obj[0].id);
- $toolBarDiv.find(".layui-nav-child").removeClass('layui-anim-fadein layui-show');
- // toolbar加载前执行的方法,执行完毕之后创建按钮
- _this.setToolbarDom(_this.toolbarFun.loadToolbarBefore(event.cloneObj(_this.toolbarMenu), _this.getRequestParam(node), $div));
- var e = e || window.event,
- mx = e.pageX - $div.offset().left + 45,
- my = $div.offset().top - _this.obj.closest(_this.toolbarScroll).offset().top + 15;
- if (contextmenu == "true") {
- _this.obj.find("div[data-id]").parent().find("." + NAV_THIS).removeClass(NAV_THIS);
- _this.obj.find("div[data-id]").parent().find("." + _this.style.itemThis).removeClass(_this.style.itemThis);
- $div.addClass(NAV_THIS);
- $div.addClass(_this.style.itemThis);
- $toolBarDiv.find(".layui-nav-child").addClass('layui-anim-fadein layui-show');
- $toolBarDiv.css({'left': mx + 'px', 'top': my + 'px'});
- }
- }
- e.stopPropagation();
- return false;
- });
- // 绑定装载树的上层出现滚动条的容器,让toolbar隐藏
- _this.obj.closest(_this.toolbarScroll).scroll(function () {
- var $toolBarDiv = _this.obj.prevAll('div#dtree_toolbar_' + _this.obj[0].id);
- $toolBarDiv.find(".layui-nav-child").removeClass('layui-anim-fadein layui-show');
- });
- // 绑定toolbar的点击事件
- _this.obj.prevAll('div#dtree_toolbar_' + _this.obj[0].id).on("click", "a[dtree-tool]", function (event) {
- event.stopPropagation();
- var $div = _this.getNowNode(),
- node = _this.getNodeParam($div),
- $ul = $div.next("ul"),
- $p_li = $div.parent("li[data-index]"), //当前选中节点的顶级li节点
- $p_ul = $p_li.parent("ul"), //当前选中节点的顶级li节点的父级ul
- $p_div = $p_ul.prev("div"), //当前选中节点的顶级li节点的父级ul的前一个div
- $cite = $div.children("cite"), //当前选中节点的text
- title = $cite.html();
- var $toolBarDiv = _this.obj.prevAll('div#dtree_toolbar_' + _this.obj[0].id);
- $toolBarDiv.find(".layui-nav-child").removeClass('layui-anim-fadein layui-show');
- var tool = $(this).attr("dtree-tool");
- switch (tool) {
- case defaultTool.addToolbar:
- var content = _this.loadToolBar(title, defaultTool.addToolbar);
- layer.open({
- title: "新增" + _this.toolbarStyle.title,
- type: 1,
- area: _this.toolbarStyle.area,
- content: content,
- success: function (layero, index) {
- form.render();
- form.on("submit(dtree_addNode_form)", function (data) {
- var data = data.field;
- var parentId = $div.attr("data-id"),
- id = $div.attr("data-id") + "_node_" + $ul[0].childNodes.length,
- isLeaf = true,
- isChecked = "0",
- level = parseInt($p_li.attr("data-index")) + 1;
- // 创建子节点的DOM,添加子节点
- var checkArr = [];
- if (_this.checkArrLen > 0) {
- for (var i = 0; i < _this.checkArrLen; i++) {
- checkArr.push({"type": i, "isChecked": "0"});
- }
- }
- $ul.append(_this.getLiItemDom(id, parentId, data.addNodeName, true, "", checkArr, level, false, false, "", "", "item"));
- // 先将li节点隐藏
- $ul.find("li[data-id='" + id + "']").hide();
- // 重新赋值
- var $addDiv = $ul.find("div[data-id='" + id + "']");
- node = _this.getNodeParam($addDiv);
- //获取组装后的requestNode,组合参数
- var requestNode = _this.getRequestParam(node);
- requestNode = $.extend(requestNode, data);
- _this.temp = [id, $ul, $div, level];
- // 用户自定义想做的事情
- _this.toolbarFun.addTreeNode(requestNode, $div);
- layer.close(index);
- return false;
- });
- }
- });
- break;
- case defaultTool.editToolbar:
- var content = _this.loadToolBar(title, defaultTool.editToolbar);
- layer.open({
- title: "编辑" + _this.toolbarStyle.title,
- type: 1,
- area: _this.toolbarStyle.area,
- content: content,
- success: function (layero, index) {
- _this.toolbarFun.editTreeLoad(_this.getRequestParam(node));
- form.render();
- form.on("submit(dtree_editNode_form)", function (data) {
- var data = data.field;
- $cite.html(data.editNodeName);
- node = _this.getNodeParam($div);
- var requestNode = _this.getRequestParam(node);
- requestNode = $.extend(requestNode, data);
- _this.temp = [$cite, $div];
- _this.toolbarFun.editTreeNode(requestNode, $div);
- layer.close(index);
- });
- }
- });
- break;
- case defaultTool.delToolbar:
- layer.confirm('确定要删除该' + _this.toolbarStyle.title + '?', {
- icon: 3,
- title: '删除' + _this.toolbarStyle.title
- }, function (index) {
- var node = _this.getNodeParam($div);
- _this.temp = [$p_li, $p_div];
- _this.toolbarFun.delTreeNode(_this.getRequestParam(node), $div);
- layer.close(index);
- });
- break;
- default:
- var toolbarId = $(this).attr("dtree-tool");
- if (_this.toolbarExt.length > 0) {
- for (var i = 0; i < _this.toolbarExt.length; i++) {
- var ext = _this.toolbarExt[i];
- if (toolbarId == ext.toolbarId) {
- ext.handler(_this.getRequestParam(_this.getNodeParam($div), $div));
- break;
- }
- }
- }
- break;
- }
- });
- // 绑定menubar的点击事件
- _this.obj.prevAll('div#dtree_menubar_' + _this.obj[0].id).on("click", "button[d-menu]", function (event) {
- event.stopPropagation();
- var $toolBarDiv = _this.obj.prevAll('div#dtree_toolbar_' + _this.obj[0].id);
- $toolBarDiv.find(".layui-nav-child").removeClass('layui-anim-fadein layui-show');
- _this.menubarListener($(this).attr("d-menu"), "group");
- });
- // 绑定menubar的点击事件
- _this.obj.prevAll('div#dtree_toolbar_' + _this.obj[0].id).on("click", "a[d-menu]", function (event) {
- event.stopPropagation();
- var $toolBarDiv = _this.obj.prevAll('div#dtree_toolbar_' + _this.obj[0].id);
- $toolBarDiv.find(".layui-nav-child").removeClass('layui-anim-fadein layui-show');
- _this.menubarListener($(this).attr("d-menu"), "toolbar");
- });
- // 绑定menubar的点击按钮事件
- _this.obj.closest('body').find("*[dtree-id='" + _this.obj[0].id + "'][dtree-menu]").on("click", function (event) {
- event.stopPropagation();
- var $toolBarDiv = _this.obj.prevAll('div#dtree_toolbar_' + _this.obj[0].id);
- $toolBarDiv.find(".layui-nav-child").removeClass('layui-anim-fadein layui-show');
- _this.menubarListener($(this).attr("dtree-menu"), "freedom");
- });
- // 绑定cheboxbar的节点复选框
- _this.obj.on("click", "i[dtree-click='" + eventName.checkNodeClick + "']", function (event) {
- var $toolBarDiv = _this.obj.prevAll('div#dtree_toolbar_' + _this.obj[0].id);
- $toolBarDiv.find(".layui-nav-child").removeClass('layui-anim-fadein layui-show');
- var $i = $(this),
- $div = $i.closest("div[dtree-click='" + eventName.itemNodeClick + "']"),
- node = _this.getNodeParam($div);
- // 复选框选中前的回调
- var flag = _this.checkbarFun.chooseBefore($i, _this.getRequestParam(node));
- _this.temp = [$i];
- if (flag) {
- _this.changeCheck();
- }
- event.stopPropagation();
- });
- };
- // 绑定body的单击,让本页面所有的toolbar隐藏
- $BODY.on("click", function (event) {
- $("div." + LI_DIV_TOOLBAR).find(".layui-show").removeClass('layui-anim-fadein layui-show');
- });
- // 解绑浏览器事件
- DTree.prototype.unbindBrowserEvent = function () {
- var _this = this;
- // 本身事件解绑
- _this.obj.unbind();
- // 菜单栏解绑
- if (_this.menubar) {
- _this.obj.prevAll('div#dtree_menubar_' + _this.obj[0].id).unbind();
- if (_this.obj.closest('body').find("*[dtree-id='" + _this.obj[0].id + "'][dtree-menu]").length > 0) {
- _this.obj.closest('body').find("*[dtree-id='" + _this.obj[0].id + "'][dtree-menu]").unbind();
- }
- }
- // 工具栏解绑
- if (_this.toolbar) {
- _this.obj.prevAll('div#dtree_toolbar_' + _this.obj[0].id).unbind();
- if (_this.obj.closest(_this.toolbarScroll).length > 0) {
- _this.obj.closest(_this.toolbarScroll).unbind();
- }
- }
- };
- /** 外部访问 **/
- var dtree = {
- render: function (options) { // 初始化树
- var dTree = null;
- var id = event.getElemId(options);
- if (id == "") {
- layer.msg("页面中未找到绑定id", {icon: 5});
- } else {
- dTree = DTrees[id];
- if (typeof dTree === 'object') {
- dTree.reloadSetting(options);
- dTree.initTreePlus();
- dTree.openTreePlus();
- dTree.init();
- dTree.unbindBrowserEvent();
- dTree.bindBrowserEvent();
- } else {
- // 创建树
- dTree = new DTree(options);
- // 添加到树数组中去
- DTrees[id] = dTree;
- dTree.initTreePlus();
- dTree.openTreePlus();
- dTree.init();
- dTree.bindBrowserEvent();
- }
- }
- return dTree;
- },
- reload: function (dTree, options) {
- if (typeof dTree === "string") {
- dTree = DTrees[dTree];
- }
- if (typeof dTree === "undefined") {
- layer.msg("方法获取失败,请检查ID或对象传递是否正确", {icon: 2});
- return;
- }
- dTree.reloadSetting(options);
- dTree.initTreePlus();
- dTree.openTreePlus();
- dTree.init();
- dTree.unbindBrowserEvent();
- dTree.bindBrowserEvent();
- },
- on: function (events, callback) { // 绑定事件
- if (events.indexOf("'") > 0) {
- events = events.replace(/'/g, "");
- }
- if (events.indexOf('"') > 0) {
- events = events.replace(/"/g, "");
- }
- return layui.onevent.call(this, MOD_NAME, events, callback);
- },
- getNowParam: function (dTree) {
- if (typeof dTree === "string") {
- dTree = DTrees[dTree];
- }
- if (typeof dTree === "undefined") {
- layer.msg("方法获取失败,请检查ID或对象传递是否正确", {icon: 2});
- return;
- }
- return dTree.getNowParam(); // 获取当前选中值
- },
- getParentParam: function (dTree, id) { // 获取参数的上级节点
- if (typeof dTree === "string") {
- dTree = DTrees[dTree];
- }
- if (typeof dTree === "undefined") {
- layer.msg("方法获取失败,请检查ID或对象传递是否正确", {icon: 2});
- return;
- }
- return dTree.getParentParam(id);
- },
- getChildParam: function (dTree, id) { // 获取参数的全部下级节点
- if (typeof dTree === "string") {
- dTree = DTrees[dTree];
- }
- if (typeof dTree === "undefined") {
- layer.msg("方法获取失败,请检查ID或对象传递是否正确", {icon: 2});
- return;
- }
- return dTree.getChildParam(id);
- },
- getCheckbarNodesParam: function (dTree) {
- if (typeof dTree === "string") {
- dTree = DTrees[dTree];
- }
- if (typeof dTree === "undefined") {
- layer.msg("方法获取失败,请检查ID或对象传递是否正确", {icon: 2});
- return {};
- }
- return dTree.getCheckbarNodesParam(); // 获取复选框选中值
- },
- dataInit: function (dTree, chooseId) { // 初始化选中树,针对数据返选
- if (typeof dTree === "string") {
- dTree = DTrees[dTree];
- }
- if (typeof dTree === "undefined") {
- layer.msg("方法获取失败,请检查ID或对象传递是否正确", {icon: 2});
- return;
- }
- if (chooseId) {
- return dTree.dataInit(chooseId);
- }
- },
- chooseDataInit: function (dTree, chooseIds) { // 初始化复选框的值
- if (typeof dTree === "string") {
- dTree = DTrees[dTree];
- }
- if (typeof dTree === "undefined") {
- layer.msg("方法获取失败,请检查ID或对象传递是否正确", {icon: 2});
- return;
- }
- if (chooseIds) {
- return dTree.chooseDataInit(chooseIds);
- }
- },
- changeCheckbarNodes: function (dTree) { //判断复选框是否发生变更
- if (typeof dTree === "string") {
- dTree = DTrees[dTree];
- }
- if (typeof dTree === "undefined") {
- layer.msg("方法获取失败,请检查ID或对象传递是否正确", {icon: 2});
- return;
- }
- return dTree.changeCheckbarNodes();
- },
- refreshTree: function (dTree) { //刷新树,并具有数据回显的功能,自动识别复选框or单选(未完成)
- if (typeof dTree === "string") {
- dTree = DTrees[dTree];
- }
- if (typeof dTree === "undefined") {
- layer.msg("方法获取失败,请检查ID或对象传递是否正确", {icon: 2});
- return;
- }
- },
- escape: function (html) {
- return event.escape(html);
- },
- unescape: function (str) {
- return event.unescape(str);
- },
- version: function () {
- return VERSION;
- }
- };
- exports('dtree', dtree);
- });
|