|
|
|
|
@ -9,132 +9,72 @@ |
|
|
|
|
<html lang="en"> |
|
|
|
|
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> <!--输出,条件,迭代标签库--> |
|
|
|
|
<%@ page pageEncoding="utf-8" %> |
|
|
|
|
<head> |
|
|
|
|
<script> |
|
|
|
|
|
|
|
|
|
function showMenu() { |
|
|
|
|
var child = $("." + $(this).attr("id")); |
|
|
|
|
i = $(this).find('i'); |
|
|
|
|
classPrefix = 'fas fa-angle-'; |
|
|
|
|
if (i.attr('class') == classPrefix + 'right') { |
|
|
|
|
i.attr('class', classPrefix + 'down'); |
|
|
|
|
child.fadeIn() |
|
|
|
|
}else{ |
|
|
|
|
i.attr('class', classPrefix + 'right'); |
|
|
|
|
hideMenu(child) |
|
|
|
|
} |
|
|
|
|
<script> |
|
|
|
|
function showMenu() { |
|
|
|
|
var child = $("." + $(this).attr("id")); |
|
|
|
|
i = $(this).find('i'); |
|
|
|
|
classPrefix = 'fas fa-angle-'; |
|
|
|
|
if (i.attr('class') == classPrefix + 'right') { |
|
|
|
|
i.attr('class', classPrefix + 'down'); |
|
|
|
|
child.fadeIn() |
|
|
|
|
} else { |
|
|
|
|
i.attr('class', classPrefix + 'right'); |
|
|
|
|
hideMenu(child) |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
function hideMenu(child){ |
|
|
|
|
if(child.length>1){ |
|
|
|
|
child.find('i').attr('class', classPrefix + 'right'); |
|
|
|
|
} |
|
|
|
|
child.each(function(){ |
|
|
|
|
$(this).fadeOut(); |
|
|
|
|
hideMenu($("."+$(this).attr('id'))); |
|
|
|
|
}) |
|
|
|
|
function hideMenu(child) { |
|
|
|
|
if (child.length > 1) { |
|
|
|
|
child.find('i').attr('class', classPrefix + 'right'); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function addMenu(menus, level, id) { |
|
|
|
|
for (var menu in menus) { |
|
|
|
|
menuId = 'menu' + menus[menu].id; |
|
|
|
|
$("#list-tab").append('<a class="list-group-item list-group-item-action" id="' + menuId + '" data-toggle="list">\n' + |
|
|
|
|
' ' + menus[menu].menuName + '\n' + |
|
|
|
|
' </a>'); |
|
|
|
|
if (level > 0) { |
|
|
|
|
$("#" + menuId).addClass('offset-' + level).addClass('menu' + id); |
|
|
|
|
$("#" + menuId).hide(); |
|
|
|
|
} |
|
|
|
|
if (menus[menu].childMenu.length > 0) { |
|
|
|
|
$("#" + menuId).append('<i class="fas fa-angle-right"></i><span class="badge badge-primary badge-pill offset-8">' + menus[menu].childMenu.length + '</span>').click(showMenu); |
|
|
|
|
addMenu(menus[menu].childMenu, level + 1, menus[menu].id); |
|
|
|
|
} |
|
|
|
|
child.each(function () { |
|
|
|
|
$(this).fadeOut(); |
|
|
|
|
hideMenu($("." + $(this).attr('id'))); |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function addMenu(menus, level,id) { |
|
|
|
|
|
|
|
|
|
for (var menu in menus) { |
|
|
|
|
href = menus[menu].href; |
|
|
|
|
menuId='#menu'+menus[menu].id; |
|
|
|
|
$("#list-tab").append('<a class="list-group-item list-group-item-action" data-href="'+menus[menu].href+'" data-id="'+menus[menu].id+'" id="' + menuId.substr(1) + '" data-toggle="list">\n' + |
|
|
|
|
' ' + menus[menu].menuName + '\n' + |
|
|
|
|
' </a>'); |
|
|
|
|
if (level > 0) { |
|
|
|
|
$(menuId).addClass('offset-' + level).addClass('menu' + id); |
|
|
|
|
$(menuId).hide(); |
|
|
|
|
} |
|
|
|
|
if (menus[menu].childMenu.length > 0) { |
|
|
|
|
$(menuId).append('<i class="fas fa-angle-right"></i><span class="badge badge-primary badge-pill offset-8">' + menus[menu].childMenu.length + '</span>').click(showMenu); |
|
|
|
|
addMenu(menus[menu].childMenu, level + 1, menus[menu].id); |
|
|
|
|
} else { |
|
|
|
|
$(menuId).click(function () { |
|
|
|
|
btnId='#btn'+$(this).data('id'); |
|
|
|
|
if ($(btnId).length == 0) { |
|
|
|
|
$("#tabs").append('<button type="button" id="' + btnId.substr(1) + '" class="btn btn-secondary btn-lg">' + $(this).text() + '\n' + |
|
|
|
|
' <i class="fas fa-times" style="display: none"></i>\n' + |
|
|
|
|
' </button>') |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
$(top.document).find('.navbar>' + btnId).click(); |
|
|
|
|
$(top.document).find('#myIframe').attr('src', $(this).data('href')); |
|
|
|
|
}); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
$(function () { |
|
|
|
|
|
|
|
|
|
addMenu(${menus}.data, 0); |
|
|
|
|
|
|
|
|
|
$("#side-menu>li>a").click(function () { |
|
|
|
|
menu_id = $(this).data("id"); |
|
|
|
|
menu_href = $(this).data("href"); |
|
|
|
|
menu_name = $(this).data("name"); |
|
|
|
|
|
|
|
|
|
if ($("#" + menu_id).length == 0) { |
|
|
|
|
$("#chooseTab").append("<button class=\"btn btn-outline btn-default\">\n" + |
|
|
|
|
" <a class=\"dropdown-toggle\" data-id=\"" + menu_id + "\">\n" + |
|
|
|
|
" <b>" + menu_name + "</b><i class=\"glyphicon glyphicon-remove\"></i>\n" + |
|
|
|
|
" </a>\n" + |
|
|
|
|
" </button>"); |
|
|
|
|
|
|
|
|
|
$("#tab").append("<iframe id=\"" + menu_id + "\" src=\"" + menu_href + "\" width=\"100%\" height=\"100%\" frameborder=\"0\" ></iframe>"); |
|
|
|
|
} |
|
|
|
|
$("a[data-id=" + menu_id + "]>b").click(); |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
$("#chooseTab").on("click", "button", function () { |
|
|
|
|
ele = $("#" + $(this).find("a").data("id")); |
|
|
|
|
ele.show(); |
|
|
|
|
ele.siblings().hide(); |
|
|
|
|
$(this).addClass("btn-default"); |
|
|
|
|
$(this).siblings().removeClass("btn-default"); |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
$("#chooseTab").on("click", "i", function () { |
|
|
|
|
$("#" + $(this).parent().data("id")).remove(); |
|
|
|
|
$(this).parents("button").remove(); |
|
|
|
|
}); |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
</script> |
|
|
|
|
</head> |
|
|
|
|
|
|
|
|
|
<nav class="navbar navbar-dark bg-info"> |
|
|
|
|
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" |
|
|
|
|
aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation"> |
|
|
|
|
<span class="navbar-toggler-icon"></span> |
|
|
|
|
</button> |
|
|
|
|
<div class="collapse navbar-collapse"> |
|
|
|
|
<ul class="navbar-nav"> |
|
|
|
|
<li class="nav-item active"> |
|
|
|
|
<a class="nav-link" href="#"> |
|
|
|
|
主页<i class="fas fa-home"></i> |
|
|
|
|
</a> |
|
|
|
|
</li> |
|
|
|
|
|
|
|
|
|
<li class="nav-item dropdown"> |
|
|
|
|
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" |
|
|
|
|
aria-haspopup="true" aria-expanded="false"> |
|
|
|
|
Dropdown link |
|
|
|
|
</a> |
|
|
|
|
<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink"> |
|
|
|
|
<a class="dropdown-item" href="#">Action</a> |
|
|
|
|
<a class="dropdown-item" href="#">Another action</a> |
|
|
|
|
<a class="dropdown-item" href="#">Something else here</a> |
|
|
|
|
</div> |
|
|
|
|
</li> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</ul> |
|
|
|
|
</div> |
|
|
|
|
</nav> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="row flex-xl-nowrap show" id="navbarNavDropdown"> |
|
|
|
|
<div class="col-2 bd-sidebar"> |
|
|
|
|
<div class="list-group" id="list-tab" role="tablist"> |
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
|
$(function () { |
|
|
|
|
addMenu(${menus}.data, 0 |
|
|
|
|
) |
|
|
|
|
; |
|
|
|
|
}); |
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<main class="col-10 bd-content"> |
|
|
|
|
<div class="list-group col-2 float-left" id="list-tab" role="tablist"> |
|
|
|
|
|
|
|
|
|
</main> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
10295
6 years ago