抽取okMenu
bobi
parent
dac9be277f
commit
233ed2f4a8
142
js/okadmin.js
142
js/okadmin.js
|
|
@ -2,13 +2,15 @@ layui.config({
|
||||||
base: "lib/okPlugins/"
|
base: "lib/okPlugins/"
|
||||||
}).extend({
|
}).extend({
|
||||||
okTab: "okTab",
|
okTab: "okTab",
|
||||||
okUtils: "okUtils"
|
okUtils: "okUtils",
|
||||||
}).use(["element", "layer", "okTab", "okUtils"], function () {
|
okMenu: "okMenu"
|
||||||
|
}).use(["element", "layer", "okTab", "okUtils", "okMenu"], function () {
|
||||||
var element = layui.element;
|
var element = layui.element;
|
||||||
var layer = layui.layer;
|
var layer = layui.layer;
|
||||||
var $ = layui.jquery;
|
var $ = layui.jquery;
|
||||||
var okTab = layui.okTab;
|
var okTab = layui.okTab;
|
||||||
var okUtils = layui.okUtils;
|
var okUtils = layui.okUtils;
|
||||||
|
var okMenu = layui.okMenu;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* localhost运行提示
|
* localhost运行提示
|
||||||
|
|
@ -34,78 +36,82 @@ layui.config({
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
// TODO 无限级菜单
|
/**
|
||||||
okUtils.ajax("data/menu.json", "get").done(function (response) {
|
* 生成左侧菜单树
|
||||||
var html = "";
|
*/
|
||||||
for (var i = 0; i < response.length; i++) {
|
okMenu.generatorMenu("data/menu.json", "get");
|
||||||
var d = response[i];
|
|
||||||
html += liHtml(d);
|
// okUtils.ajax("data/menu.json", "get").done(function (response) {
|
||||||
html += "<a href='javascript:;'>"
|
// var html = "";
|
||||||
html += iconHtml(d) + " " + response[i].title;
|
// for (var i = 0; i < response.length; i++) {
|
||||||
html += "</a>"
|
// var d = response[i];
|
||||||
// var children = d.children;
|
// html += liHtml(d);
|
||||||
// if (children != undefined && children.length > 0) {
|
// html += "<a href='javascript:;'>"
|
||||||
|
// html += iconHtml(d) + " " + response[i].title;
|
||||||
|
// html += "</a>"
|
||||||
|
// // var children = d.children;
|
||||||
|
// // if (children != undefined && children.length > 0) {
|
||||||
|
// // html += "<dl class='layui-nav-child'>"
|
||||||
|
// // for (var j = 0; j < children.length; j++) {
|
||||||
|
// // html += "<dd>";
|
||||||
|
// // html += "<a href='javascript:;' path='" + children[j].path + "'>" + iconHtml(children[j]) + " " + children[j].title + "</a>";
|
||||||
|
// // html += "</dd>";
|
||||||
|
// // }
|
||||||
|
// // html += "</dl>"
|
||||||
|
// // }
|
||||||
|
// var temp = createMenu(d.children);
|
||||||
|
// html += temp;
|
||||||
|
// html += "</li>";
|
||||||
|
// }
|
||||||
|
// $(".layui-nav-tree").html(html);
|
||||||
|
// element.render("nav");
|
||||||
|
// }).fail(function (error) {
|
||||||
|
// console.log(error)
|
||||||
|
// });
|
||||||
|
|
||||||
|
// function liHtml(obj) {
|
||||||
|
// var html = "";
|
||||||
|
// if (obj.spread) {
|
||||||
|
// html += "<li class='layui-nav-item layui-nav-itemed'>";
|
||||||
|
// } else {
|
||||||
|
// html += "<li class='layui-nav-item'>";
|
||||||
|
// }
|
||||||
|
// return html;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// function iconHtml(obj) {
|
||||||
|
// var html = "";
|
||||||
|
// if (obj.icon) {
|
||||||
|
// if (obj.font == "iconfont") {
|
||||||
|
// html += "<i class='iconfont'>" + obj.icon + "</i>";
|
||||||
|
// } else if (obj.font == "layui-icon") {
|
||||||
|
// html += "<i class='layui-icon'> " + obj.icon + "</i>";
|
||||||
|
// } else {
|
||||||
|
// html += "<i class='iconfont'>" + obj.icon + "</i>";
|
||||||
|
// }
|
||||||
|
// } else {
|
||||||
|
// console.warn(obj.title, "icon未定义");
|
||||||
|
// }
|
||||||
|
// return html;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// function createMenu(obj) {
|
||||||
|
// var html = "";
|
||||||
|
// if (obj != undefined && obj.length > 0) {
|
||||||
// html += "<dl class='layui-nav-child'>"
|
// html += "<dl class='layui-nav-child'>"
|
||||||
// for (var j = 0; j < children.length; j++) {
|
// for (var i = 0; i < obj.length; i++) {
|
||||||
// html += "<dd>";
|
// html += "<dd>";
|
||||||
// html += "<a href='javascript:;' path='" + children[j].path + "'>" + iconHtml(children[j]) + " " + children[j].title + "</a>";
|
// html += "<a href='javascript:;' path='" + obj[i].path + "'>" + iconHtml(obj[i]) + " " + obj[i].title + "</a>";
|
||||||
|
// var children = obj[i].children;
|
||||||
|
// if (children != undefined && children.length > 0) {
|
||||||
|
// html += createMenu(children);
|
||||||
|
// }
|
||||||
// html += "</dd>";
|
// html += "</dd>";
|
||||||
// }
|
// }
|
||||||
// html += "</dl>"
|
// html += "</dl>"
|
||||||
// }
|
// }
|
||||||
var temp = createMenu(d.children);
|
// return html;
|
||||||
html += temp;
|
// }
|
||||||
html += "</li>";
|
|
||||||
}
|
|
||||||
$(".layui-nav-tree").html(html);
|
|
||||||
element.render("nav");
|
|
||||||
}).fail(function (error) {
|
|
||||||
console.log(error)
|
|
||||||
});
|
|
||||||
|
|
||||||
function liHtml(obj) {
|
|
||||||
var html = "";
|
|
||||||
if (obj.spread) {
|
|
||||||
html += "<li class='layui-nav-item layui-nav-itemed'>";
|
|
||||||
} else {
|
|
||||||
html += "<li class='layui-nav-item'>";
|
|
||||||
}
|
|
||||||
return html;
|
|
||||||
}
|
|
||||||
|
|
||||||
function iconHtml(obj) {
|
|
||||||
var html = "";
|
|
||||||
if (obj.icon) {
|
|
||||||
if (obj.font == "iconfont") {
|
|
||||||
html += "<i class='iconfont'>" + obj.icon + "</i>";
|
|
||||||
} else if (obj.font == "layui-icon") {
|
|
||||||
html += "<i class='layui-icon'> " + obj.icon + "</i>";
|
|
||||||
} else {
|
|
||||||
html += "<i class='iconfont'>" + obj.icon + "</i>";
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
console.warn(obj.title, "icon未定义");
|
|
||||||
}
|
|
||||||
return html;
|
|
||||||
}
|
|
||||||
|
|
||||||
function createMenu(obj) {
|
|
||||||
var html = "";
|
|
||||||
if (obj != undefined && obj.length > 0) {
|
|
||||||
html += "<dl class='layui-nav-child'>"
|
|
||||||
for (var i = 0; i < obj.length; i++) {
|
|
||||||
html += "<dd>";
|
|
||||||
html += "<a href='javascript:;' path='" + obj[i].path + "'>" + iconHtml(obj[i]) + " " + obj[i].title + "</a>";
|
|
||||||
var children = obj[i].children;
|
|
||||||
if (children != undefined && children.length > 0) {
|
|
||||||
html += createMenu(children);
|
|
||||||
}
|
|
||||||
html += "</dd>";
|
|
||||||
}
|
|
||||||
html += "</dl>"
|
|
||||||
}
|
|
||||||
return html;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 监听导航菜单的点击
|
* 监听导航菜单的点击
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,68 @@ layui.define(["element", "okUtils"], function (exports) {
|
||||||
var okUtils = layui.okUtils;
|
var okUtils = layui.okUtils;
|
||||||
var $ = layui.jquery;
|
var $ = layui.jquery;
|
||||||
|
|
||||||
var okMenu = {}
|
var okMenu = {
|
||||||
|
generatorMenu: function (url, method) {
|
||||||
|
okUtils.ajax(url, method).done(function (response) {
|
||||||
|
var html = "";
|
||||||
|
for (var i = 0; i < response.length; i++) {
|
||||||
|
var d = response[i];
|
||||||
|
html += okMenu.liHtml(d);
|
||||||
|
html += "<a href='javascript:;'>"
|
||||||
|
html += okMenu.iconHtml(d) + " " + response[i].title;
|
||||||
|
html += "</a>"
|
||||||
|
var temp = okMenu.createMenu(d.children);
|
||||||
|
html += temp;
|
||||||
|
html += "</li>";
|
||||||
|
}
|
||||||
|
$(".layui-nav-tree").html(html);
|
||||||
|
element.render("nav");
|
||||||
|
}).fail(function (error) {
|
||||||
|
console.log(error)
|
||||||
|
});
|
||||||
|
},
|
||||||
|
liHtml: function (obj) {
|
||||||
|
var html = "";
|
||||||
|
if (obj.spread) {
|
||||||
|
html += "<li class='layui-nav-item layui-nav-itemed'>";
|
||||||
|
} else {
|
||||||
|
html += "<li class='layui-nav-item'>";
|
||||||
|
}
|
||||||
|
return html;
|
||||||
|
},
|
||||||
|
iconHtml: function (obj) {
|
||||||
|
var html = "";
|
||||||
|
if (obj.icon) {
|
||||||
|
if (obj.font == "iconfont") {
|
||||||
|
html += "<i class='iconfont'>" + obj.icon + "</i>";
|
||||||
|
} else if (obj.font == "layui-icon") {
|
||||||
|
html += "<i class='layui-icon'> " + obj.icon + "</i>";
|
||||||
|
} else {
|
||||||
|
html += "<i class='iconfont'>" + obj.icon + "</i>";
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
console.warn(obj.title, "icon未定义");
|
||||||
|
}
|
||||||
|
return html;
|
||||||
|
},
|
||||||
|
createMenu: function (obj) {
|
||||||
|
var html = "";
|
||||||
|
if (obj != undefined && obj.length > 0) {
|
||||||
|
html += "<dl class='layui-nav-child'>"
|
||||||
|
for (var i = 0; i < obj.length; i++) {
|
||||||
|
html += "<dd>";
|
||||||
|
html += "<a href='javascript:;' path='" + obj[i].path + "'>" + okMenu.iconHtml(obj[i]) + " " + obj[i].title + "</a>";
|
||||||
|
var children = obj[i].children;
|
||||||
|
if (children != undefined && children.length > 0) {
|
||||||
|
html += okMenu.createMenu(children);
|
||||||
|
}
|
||||||
|
html += "</dd>";
|
||||||
|
}
|
||||||
|
html += "</dl>"
|
||||||
|
}
|
||||||
|
return html;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
exports("okMenu", okMenu);
|
exports("okMenu", okMenu);
|
||||||
});
|
});
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue