master

分支 (1)

管理

管理

master

easy-layui-admin
/
index.html

<!DOCTYPE html>
<html>

<head>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<title>Easy Layui Admin后台管理</title>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" href="plugin/layui/css/layui.css" media="all">
	<link rel="stylesheet" href="css/style.css">
	<script type="text/javascript" src="js/jquery.min.js"></script>
	<script type="text/javascript" src="plugin/layui/layui.js"></script>
</head>

<body>
	<!-- 顶部开始 -->
	<div class="admin-header">
		<div class="logo">
			<a target="appiframe" href="welcome.html">Easy Layui Admin</a>
		</div>
		<ul class="layui-nav layui-layout-left" style="background-color:#222;">
			<li class="layui-nav-item">
				<a target="appiframe" href="welcome.html">网站首页</a>
			</li>
			<li class="layui-nav-item">
				<a target="appiframe" href="welcome.html">更新缓存<span class="layui-badge-dot"></span></a>
			</li>
		</ul>
		<ul class="layui-nav layui-layout-right" style="background-color:#222;">
			<li class="layui-nav-item">
				<a href="javascript:;">Admin</a>
				<dl class="layui-nav-child">
					<dd><a target="appiframe" href="user-setting.html">基本资料</a></dd>
					<dd><a target="appiframe" href="user-password-edit.html">密码修改</a></dd>
				</dl>
			</li>
			<li class="layui-nav-item"><a href="">退出</a></li>
		</ul>
	</div>
	<!-- 顶部结束 -->
	<!-- 中部开始 -->
	<!-- 左侧菜单开始 -->
	<div class="left-nav">
		<div id="side-nav">
			<ul class="nav" id="nav">
				<li id="menu8" class="open"><a _href=""><i class="layui-icon layui-icon-read"></i><cite>文章管理</cite><i class="layui-icon nav_right"></i></a>
					<ul class="sub-menu">
						<li id="menu9"><a _href="./article-list.html"><i class="layui-icon layui-icon-right"></i><cite>文章列表</cite></a></li>
						<li id="menu10"><a _href="./articletype-list.html"><i class="layui-icon layui-icon-right"></i><cite>分类管理</cite></a></li>
					</ul>
				</li>
				<li id="menu1"><a _href=""><i class="layui-icon layui-icon-user"></i><cite>会员管理</cite><i class="layui-icon nav_right"></i></a>
					<ul class="sub-menu">
						<li id="menu2"><a _href="user-list.html"><i class="layui-icon layui-icon-right"></i><cite>会员列表</cite></a></li>
						<li id="menu4"><a _href=""><i class="layui-icon layui-icon-right"></i><cite>三级菜单</cite><i class="layui-icon nav_right"></i></a>
							<ul class="sub-menu">
								<li id="menu6"><a _href="echarts-stacked-line-chart.html"><i class="layui-icon layui-icon-right"></i><cite>拆线图</cite></a></li>
								<li id="menu7"><a _href="echarts-bar-label-rotation.html"><i class="layui-icon layui-icon-right"></i><cite>柱状图</cite></a></li>
							</ul>
						</li>
					</ul>
				</li>
				<li id="menu18"><a _href=""><i class="layui-icon layui-icon-chart"></i><cite>报表统计</cite><i class="layui-icon nav_right"></i></a>
					<ul class="sub-menu">
						<li id="menu19"><a _href="echarts-stacked-line-chart.html"><i class="layui-icon layui-icon-right"></i><cite>拆线图</cite></a></li>
						<li id="menu20"><a _href="echarts-bar-label-rotation.html"><i class="layui-icon layui-icon-right"></i><cite>柱状图</cite></a></li>
						<li id="menu21"><a _href="echarts-pie-with-scrollable-legend.html"><i class="layui-icon layui-icon-right"></i><cite>饼图</cite></a></li>
					</ul>
				</li>
				<li id="menu13"><a _href=""><i class="layui-icon layui-icon-note"></i><cite>设置</cite><i class="layui-icon nav_right"></i></a>
					<ul class="sub-menu">
						<li id="menu14"><a _href="setting-siteinfo.html"><i class="layui-icon layui-icon-right"></i><cite>网站设置</cite></a></li>
					</ul>
				</li>
			</ul>
		</div>
	</div>
	<!-- 左侧菜单结束 -->
	<!-- 右侧主体开始 -->
	<div class="page-content">
		<iframe src='welcome.html' frameborder="0" scrolling="yes" allowtransparency="true" id="appiframe" name="appiframe"></iframe>
	</div>
	<!-- 右侧主体结束 -->
	<!-- 中部结束 -->
	<script type="text/javascript">
		/*
		 * @todo 左侧菜单事件
		 * 如果有子级就展开，没有就打开frame
		 */
		$('body').on('click', '.left-nav #nav li', function(event) {
			if($(this).children('.sub-menu').length) {
				if($(this).hasClass('open')) {
					$(this).removeClass('open');
					$(this).find('.nav_right').removeClass('layui-icon-down');
					$(this).find('.nav_right').addClass('layui-icon-up');
					$(this).children('.sub-menu').stop().slideUp();
					$(this).siblings().children('.sub-menu').slideUp();
				} else {
					$(this).addClass('open');
					$(this).children('a').find('.nav_right').removeClass('layui-icon-up');
					$(this).children('a').find('.nav_right').addClass('layui-icon-down');
					$(this).children('.sub-menu').stop().slideDown();
					$(this).siblings().children('.sub-menu').stop().slideUp();
					$(this).siblings().find('.nav_right').removeClass('layui-icon-down');
					$(this).siblings().find('.nav_right').addClass('layui-icon-up');
					$(this).siblings().removeClass('open');
				}
			} else {
				var url = $(this).children('a').attr('_href');
				var title = $(this).find('cite').html();
				var index = $('.left-nav #nav li').index($(this));

				$('#appiframe').attr('src', url);
			}
			event.stopPropagation(); //不触发任何前辈元素上的事件处理函数
		});

		//左侧菜单事件右侧图标初始化
		$(document).ready(function(){
			$('.nav_right').removeClass('layui-icon-up');
			$('.nav_right').removeClass('layui-icon-down');
			$('.nav_right').addClass('layui-icon-up');
			$('li.open > .nav_right').removeClass('layui-icon-up');
			$('li.open > .nav_right').addClass('layui-icon-down');
			$('li.open > .sub-menu').show();
		});
	</script>
	<script>
		layui.use('element', function () {
			var layer = layui.layer;
			var element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块
		});
	</script>
</body>

</html>