構建layui的tree節點資料

KK凱凱發表於2018-01-24
var dat = "";
var max = 0;
function godatasourcemanage() {
	$("#mainFrame").attr("src", "datasource/toList");
};
function changeiframe(id) {
	if (id == 1) {
		$("#mainFrame").attr("src", getContext() + "/experiment/toList");
	} else if (id == 2) {
		$("#mainFrame").attr("src", "http://www.baidu.com");
	} else if (id == 3) {
		$("#mainFrame").attr("src", getContext() + "/datasource/toList");
	} else if (id == 4) {
		$("#mainFrame").attr("src", getContext() + "/datasource/toList");
	}
};

function editsou(dataId) {
	layer.open({
		type : 2,
		title : '資料管理',
		maxmin : true,
		shadeClose : true, // 點選遮罩關閉層
		area : [ '800px', '550px' ],
		content : getContext() + "/datasource/goAdit?dataId=" + dataId
	});
};

function editexp(experimentId) {
	layer.open({
		type : 2,
		title : '實驗管理',
		maxmin : true,
		shadeClose : true, // 點選遮罩關閉層
		area : [ '800px', '550px' ],
		content : getContext() + "/experiment/goAdit?experimentId="
				+ experimentId
	});
};

$(function() {
	loadresourcemenu();
	loadtree();
});

function loadresourcemenu() {
	$
			.ajax({
				async : false,
				cache : false,
				type : 'POST',
				dataType : "json",
				url : getContext() + "/datasource/getdatasource",// 請求的action路徑
				error : function() {// 請求失敗處理函式
					alert('請求失敗');
				},
				success : function(data) { // 請求成功後處理函式。
					datasource = eval(data); //
					for (var i = 0; i < datasource.length; i++) {
						// $("#datasources").append("<li>"+datasource[i].enName+"</li>");
						$("#datasources")
								.append(
										"<li><button οnclick=editsou('"
												+ datasource[i].dataId
												+ "') style='width:183px;' class='layui-btn layui-btn-sm'>"
												+ datasource[i].enName
												+ "</button></li>");
					}
				}
			});
};
function loadtree() {
	$.ajax({
		async : false,
		cache : false,
		type : 'POST',
		dataType : "json",
		url : "http://localhost:8080/model-web/experiment/loadexptree",// 請求的action路徑
		error : function() {// 請求失敗處理函式
			alert('請求失敗');
		},
		success : function(data) {
			dat = eval(data);
			for (var i = 0; i < dat.length; i++) {
				if (dat[i].level > max) {
					max = dat[i].level;
				}
			}
		}
	});
};
/*
 * layui.use('element', function(){ var element = layui.element;
 * 
 * });
 */
layui
		.use(
				[ 'form', 'layedit', 'laydate', 'jquery', 'element', 'tree',
						'layer' ],
				function() { // 獨立版的layer無需執行這一句
					// var $ = layui.jquery, layer = layui.layer;
					// //獨立版的layer無需執行這一句
					var form = layui.form, layer = layui.layer, layedit = layui.layedit, laydate = layui.laydate, layer = layui.layer, $ = layui.$;
					var element = layui.element;

					// 生成一個模擬樹
					var createTree = function(node, start) {
						// alert(dat);
						// alert(max);
						node = node || function() {
							var arr = [];
							for (var i = 0; i < dat.length; i++) {
								if (dat[i].level == 1) {
									arr.push({
										name : dat[i].name,
										catalogId : dat[i].catalogId,
										parentId : dat[i].parentId
									});
								}
							}
							return arr;
						}();
						start = start || 1;
						layui
								.each(
										node,
										function(index, item) {
											if (start < max + 1) {
												var charr = [];
												for (var i = 0; i < dat.length; i++) {
													if (node[index].catalogId == dat[i].parentId) {
														var child = {
															name : dat[i].name,
															catalogId : dat[i].catalogId,
															parentId : dat[i].parentId,
															experimentId : dat[i].experimentId
														};
														charr.push(child);
													}
												}
												node[index].children = charr;
												createTree(charr, index + start
														+ 1);
											}
										});
						return node;
					};

					layui.tree({
						elem : '#demo2',
						click : function(item) { // 點選節點回撥
							if ("undefined" != typeof(item.experimentId)) {
								editexp(item.experimentId);
							}
						},
						nodes : createTree()
					});

					// layer.msg('hello');
					// 觸發事件
					var active = {
						setTop : function() {
							var that = this;
							var url = "";
							if (that.id == 1) {
								url = getContext() + "/experiment/goAdit"
							} else if (that.id == 4) {
								url = getContext() + "/datasource/goAdit"
							} else {
								url = getContext() + "/datasource/goAdit"
							}
							// 多視窗模式,層疊置頂
							layer.open({
								type : 2,
								title : '資料管理',
								maxmin : true,
								shadeClose : true, // 點選遮罩關閉層
								area : [ '800px', '550px' ],
								content : url,
								yes : function() {
									$(that).click();
								},
								btn2 : function() {
									layer.closeAll();
								}

								,
								zIndex : layer.zIndex // 重點1
								,
								success : function(layero) {
									layer.setTop(layero); // 重點2
								}
							});
						},
					};

					$('.layui-btn-sm').on('click', function() {
						var othis = $(this), method = othis.data('method');
						active[method] ? active[method].call(this, othis) : '';
					});

					// layui-btn-sm
				});

相關文章