layui 经典代码笔记

http://www.yinniannian.com/Home/AboutView

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <meta name="keywords" content="尹念念,尹念念博客,尹念念的个人博客,个人博客,个人网站,个人主页,.NET尹念念,尹念念.NET,c#,CSharp,.NET个人博客,.NET个人博客源码,.NET程序员博客,个人博客.NET源代码,基于.NET个人博客">
    <meta name="description" content="尹念念博客,我就是想做一个简单的站长。">
    <meta property="og:url" content="http://www.yinniannian.com" />
    <meta property="og:title" content="尹念念博客" />
    <meta property="og:description" content="尹念念博客,我就是想做一个简单的站长。" />
    <title>关于尹念念</title>
    <link rel="shortcut icon" href="../Icon/C.png" />
    <link href="/Scripts/layui/css/layui.css" rel="stylesheet" />
    <link href="/Content/style.css" rel="stylesheet" />
    <script src="/Scripts/layui/layui.js"></script>
    
</head>
<body>
    <div class="layui-header header trans_3">
        <div class="main index_main">
            <a class="logo" href="/"><img src="/images/logo.png" alt="尹念念的博客"></a>
            <ul class="layui-nav" lay-filter="top_nav">
                <li class="layui-nav-item home"><a href="/">首页</a></li>
                <li class="layui-nav-item">
                    <a href="/Home/ArticleListView">文章分类</a>
                    <dl class="layui-nav-child">
                        <!-- 二级菜单 -->
                            <dd><a href="/Home/ArticleListView?id=44e6cbfc-6ce3-426f-a8f4-0fad7ab76096">学习心得</a></dd>
                            <dd><a href="/Home/ArticleListView?id=f6d63a28-8916-489b-a5c5-6e207e7ec3e4">生活感悟</a></dd>
                            <dd><a href="/Home/ArticleListView?id=97d4c0cc-498e-4c4d-a49b-ced1766b12a1">技术文章</a></dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:void(0);">常用工具</a>
                    <dl class="layui-nav-child">
                        <!-- 二级菜单 -->
                        <dd><a href="/Home/CreateGUIDView">生成Guid</a></dd>
                        <dd><a href="/Home/TimeStampView">时间戳</a></dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="/Home/DiaryView">日记</a>
                </li>
                <li class="layui-nav-item">
                    <a href="/Home/AboutView">关于</a>
                    <dl class="layui-nav-child">
                        <!-- 二级菜单 -->
                        <dd><a href="/Home/AboutView">关于尹念念</a></dd>
                        <dd><a href="/Home/MessageBoardView">留言</a></dd>
                    </dl>
                </li>
            </ul>
            <div class="title">尹念念的博客</div>
            <form action="/Home/SearchView" target="_blank" class="head_search trans_3 layui-form">
                <div class="layui-form-item trans_3">
                    <!-- <span class="close trans_3"><i class="layui-icon">ဆ</i> </span> -->
                    <div class="layui-input-inline trans_3">
                        <select name="typeId">
                                <option value="44e6cbfc-6ce3-426f-a8f4-0fad7ab76096">学习心得</option>
                                <option value="f6d63a28-8916-489b-a5c5-6e207e7ec3e4">生活感悟</option>
                                <option value="97d4c0cc-498e-4c4d-a49b-ced1766b12a1">技术文章</option>
                        </select>
                    </div>
                    <input type="text" name="keywords" placeholder="搜索" autocomplete="off" class="search_input trans_3">
                    <button class="layui-btn" lay-submit="" style="display: none;"></button>
                </div>

            </form>
        </div>
    </div>
    <div class="header_back"></div>
    <!-- 头部 结束 -->
    <!-- 左边导航 开始 -->
    <div class="layui-side layui-bg-black left_nav trans_2">
        <div class="layui-side-scroll">
            <ul class="layui-nav layui-nav-tree" lay-filter="left_nav">
                <li class="layui-nav-item home"><a href="/">首页</a></li>
                <li class="layui-nav-item">
                    <a href="javascript:void(0);">文章分类</a>
                    <dl class="layui-nav-child">
                        <!-- 二级菜单 -->
                            <dd><a href="/Home/ArticleListView?id=44e6cbfc-6ce3-426f-a8f4-0fad7ab76096">学习心得</a></dd>
                            <dd><a href="/Home/ArticleListView?id=f6d63a28-8916-489b-a5c5-6e207e7ec3e4">生活感悟</a></dd>
                            <dd><a href="/Home/ArticleListView?id=97d4c0cc-498e-4c4d-a49b-ced1766b12a1">技术文章</a></dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:void();">常用工具</a>
                    <dl class="layui-nav-child">
                        <!-- 二级菜单 -->
                        <dd><a href="/Home/CreateGUIDView">生成Guid</a></dd>
                        <dd><a href="/Home/TimeStampView">时间戳</a></dd>
                    </dl>
                </li>
                <li class="layui-nav-item">
                    <a href="/Home/DiaryView">日记</a>
                </li>
                <li class="layui-nav-item">
                    <a href="javascript:void();">关于</a>
                    <dl class="layui-nav-child">
                        <!-- 二级菜单 -->
                        <dd><a href="/Home/AboutView">关于尹念念</a></dd>
                        <dd><a href="/Home/MessageBoardView">留言</a></dd>
                    </dl>
                </li>
            </ul>
        </div>
    </div>
    <div class="left_nav_mask"></div>
    <div class="left_nav_btn"><i class="layui-icon"></i></div>
    <div>
        

<body>
    <div class="main breadcrumb_nav trans_3">
        <span class="layui-breadcrumb" lay-separator="—">
            <a href="/">首页</a><a src="javascirpt:void(0);"><cite>关于尹念念</cite></a>
        </span>
    </div>
    <div class="main">
        <div class="page_left">
            <div class="detail_container trans_3">
                <h1>关于尹念念</h1>
                <div class="line"></div>
                <div class="content">
                    90年油腻男一枚,从事计算机这个行业也有一些时日了,可是技术上却并没有多大的提高,这与我的重度拖延症有关系吧,所以借此机会强制自己每天看看书,看看技术相关的文章、逛逛论坛以方便每天都有更新自己博客的内容。
                    本人也是那种理科生外表却有一颗文艺心的人,想多读书丰富丰富自己的词藻,如果大家有好的文章,欢迎大家给我提供,先说一声谢谢!。邮箱:<a href="mailto:[email protected]" style="font-size: 14px;">发送到邮箱</a>
                </div>
                <div class="prev_next"></div>
                <div class="commont_containr">
                    <!--【畅言】表情评价-->
                    <div id="cyEmoji" role="cylabs" data-use="emoji" sid="{$data['category_id']}{$data['id']}"></div>
                    <!--【畅言】PC和WAP自适应版-->
                    <!--PC打分版-->
                    <div id="SOHUCS" sid="19900120"></div>
                    <script charset="utf-8" type="text/javascript" src="http://qn.apkfuns.com/changyan/changyan.js"></script>
                    <script type="text/javascript">
                        window._config = { showScore: true };
                        window.changyan.api.config({
                            appid: 'cytaAQ7AE',
                            conf: 'prod_5761c1049530fb4ca7a3bf14135449fe'
                        });
                    </script>
                </div>
            </div>
        </div>
        <div class="page_right">
            <div class="second_categorys_container">
                <h3>栏目导航</h3>
                <ol class="seond_category">
                    <li class="selected"><a class="layui-btn layui-btn-primary trans_1" href="/Home/AboutView">关于尹念念</a></li>
                    <li><a class="layui-btn layui-btn-primary trans_1" href="/Home/MessageBoardView">留言板</a></li>
                </ol>
            </div>
            <div class="second_categorys_container">
                <h3>文章投递方式</h3>
                <ol class="seond_category">
                    <li class="selected"><a class="layui-btn layui-btn-primary trans_1" href="mailto:[email protected]" style="font-size: 14px;">发送到邮箱</a></li>
                </ol>
            </div>
            
        </div>
        <div class="clear"></div>
    </div>
</body>


    </div>
    <!-- 底部 开始 -->
    <ul class="layui-fixbar">
        <!-- <li class="layui-icon qr_code"><img class="qr_code_pic" src="{$settings.qr_code}" alt="微信公众号二维码"></li> -->
        <li class="layui-icon layui-fixbar-top" id="to_top"></li>
    </ul>
    <div class="layui-footer footer">
        <div class="main index_main">
            <p><a href="http://www.尹念念.com" target="_blank">尹念念</a>|<a href="http://www.yinniannian.com" target="_blank">yinniannian</a></p>
            <p class="beian">
                <a href="http://www.miitbeian.gov.cn" target="_blank">冀ICP备16029502号</a>
            </p>
        </div>
    </div>
    <!-- 底部 结束 -->
    <script type="text/javascript">
        layui.use(['form', 'element'], function () {
            var layer = layui.layer,
                form = layui.form,
                element = layui.element,
                $ = layui.jquery;
            form.render();

            //左边导航点击显示
            $('.left_nav_btn').click(function () {
                $('.left_nav_mask').show();
                $('.left_nav').addClass('left_nav_show');
            });
            //左边导航点击消失
            $('.left_nav_mask').click(function () {
                $('.left_nav').removeClass('left_nav_show');
                $('.left_nav_mask').hide();
            });

            //搜索框特效
            $('.header .head_search .search_input').focus(function () {
                $('.header .head_search').addClass('focus');
                $(this).attr('placeholder', '输入关键词搜索');
            });
            $(document).click(function () {
                $('.header .head_search').removeClass('focus');
                $('.header .head_search .search_input').attr('placeholder', '搜索');
            });
            $('.header .head_search').click(function (e) {
                $(this).addClass('focus');
                e.stopPropagation();
            });
            $('.header .head_search .close').click(function () {
                $('.header .head_search').removeClass('focus');
                $('.header .head_search .search_input').attr('placeholder', '搜索');
            });

            //回到顶部
            $("#to_top").click(function () {
                $("html,body").animate({ scrollTop: 0 }, 200);
            });
            $(document).scroll(function () {
                var scroll_top = $(document).scrollTop();
                if (scroll_top > 500) {
                    $("#to_top").show();
                } else {
                    $("#to_top").hide();
                }
            });
            //底部版权始终在底部
            var win_height = $(window).height();
            var body_height = $('body').height();
            var footer_height = $('.footer').height();
            if (body_height - win_height < 0) {
                $('.footer').addClass('footer_fixed');
            }
        });
    </script>
    <script type="text/javascript">
        var _hmt = _hmt || [];
        (function () {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?cdeb57c03f21a9d74f3fa705e74d68d1";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
    </script>
    
</body>
</html>

http://layuicms.com/v1/index.html

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>layui后台管理模板</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta http-equiv="Access-Control-Allow-Origin" content="*">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<link rel="icon" href="favicon.ico">
	<link rel="stylesheet" href="layui/css/layui.css" media="all" />
	<link rel="stylesheet" href="//at.alicdn.com/t/font_tnyc012u2rlwstt9.css" media="all" />
	<link rel="stylesheet" href="css/main.css" media="all" />
</head>
<body class="main_body">
	<div class="layui-layout layui-layout-admin">
		<!-- 顶部 -->
		<div class="layui-header header">
			<div class="layui-main">
				<a href="#" class="logo">layui后台管理</a>
				<!-- 显示/隐藏菜单 -->
				<a href="javascript:;" class="iconfont hideMenu icon-menu1"></a>
				<!-- 搜索 -->
				<div class="layui-form component">
			        <select name="modules" lay-verify="required" lay-search="">
						<option value="">直接选择或搜索选择</option>
						<option value="1">layer</option>
						<option value="2">form</option>
						<option value="3">layim</option>
						<option value="4">element</option>
						<option value="5">laytpl</option>
						<option value="6">upload</option>
						<option value="7">laydate</option>
						<option value="8">laypage</option>
						<option value="9">flow</option>
						<option value="10">util</option>
			        </select>
			        <i class="layui-icon"></i>
			    </div>
			    <!-- 天气信息 -->
			    <div class="weather" pc>
			    	<div id="tp-weather-widget"></div>
					<script>(function(T,h,i,n,k,P,a,g,e){g=function(){P=h.createElement(i);a=h.getElementsByTagName(i)[0];P.src=k;P.charset="utf-8";P.async=1;a.parentNode.insertBefore(P,a)};T["ThinkPageWeatherWidgetObject"]=n;T[n]||(T[n]=function(){(T[n].q=T[n].q||[]).push(arguments)});T[n].l=+new Date();if(T.attachEvent){T.attachEvent("onload",g)}else{T.addEventListener("load",g,false)}}(window,document,"script","tpwidget","//widget.seniverse.com/widget/chameleon.js"))</script>
					<script>tpwidget("init", {
					    "flavor": "slim",
					    "location": "WX4FBXXFKE4F",
					    "geolocation": "enabled",
					    "language": "zh-chs",
					    "unit": "c",
					    "theme": "chameleon",
					    "container": "tp-weather-widget",
					    "bubble": "disabled",
					    "alarmType": "badge",
					    "color": "#FFFFFF",
					    "uid": "U9EC08A15F",
					    "hash": "039da28f5581f4bcb5c799fb4cdfb673"
					});
					tpwidget("show");</script>
			    </div>
			    <!-- 顶部右侧菜单 -->
			    <ul class="layui-nav top_menu">
			    	<li class="layui-nav-item showNotice" id="showNotice" pc>
						<a href="javascript:;"><i class="iconfont icon-gonggao"></i><cite>系统公告</cite></a>
					</li>
			    	<li class="layui-nav-item" mobile>
			    		<a href="javascript:;" class="mobileAddTab" data-url="page/user/changePwd.html"><i class="iconfont icon-shezhi1" data-icon="icon-shezhi1"></i><cite>设置</cite></a>
			    	</li>
			    	<li class="layui-nav-item" mobile>
			    		<a href="page/login/login.html" class="signOut"><i class="iconfont icon-loginout"></i> 退出</a>
			    	</li>
					<li class="layui-nav-item lockcms" pc>
						<a href="javascript:;"><i class="iconfont icon-lock1"></i><cite>锁屏</cite></a>
					</li>
					<li class="layui-nav-item" pc>
						<a href="javascript:;">
							<img src="images/face.jpg" class="layui-circle" width="35" height="35">
							<cite>请叫我马哥</cite>
						</a>
						<dl class="layui-nav-child">
							<dd><a href="javascript:;" data-url="page/user/userInfo.html"><i class="iconfont icon-zhanghu" data-icon="icon-zhanghu"></i><cite>个人资料</cite></a></dd>
							<dd><a href="javascript:;" data-url="page/user/changePwd.html"><i class="iconfont icon-shezhi1" data-icon="icon-shezhi1"></i><cite>修改密码</cite></a></dd>
							<dd><a href="javascript:;" class="changeSkin"><i class="iconfont icon-huanfu"></i><cite>更换皮肤</cite></a></dd>
							<dd><a href="page/login/login.html" class="signOut"><i class="iconfont icon-loginout"></i><cite>退出</cite></a></dd>
						</dl>
					</li>
				</ul>
			</div>
		</div>
		<!-- 左侧导航 -->
		<div class="layui-side layui-bg-black">
			<div class="user-photo">
				<a class="img" title="我的头像" ><img src="images/face.jpg"></a>
				<p>你好!<span class="userName">请叫我马哥</span>, 欢迎登录</p>
			</div>
			<div class="navBar layui-side-scroll"></div>
		</div>
		<!-- 右侧内容 -->
		<div class="layui-body layui-form">
			<div class="layui-tab marg0" lay-filter="bodyTab" id="top_tabs_box">
				<ul class="layui-tab-title top_tab" id="top_tabs">
					<li class="layui-this" lay-id=""><i class="iconfont icon-computer"></i> <cite>后台首页</cite></li>
				</ul>
				<ul class="layui-nav closeBox">
				  <li class="layui-nav-item">
				    <a href="javascript:;"><i class="iconfont icon-caozuo"></i> 页面操作</a>
				    <dl class="layui-nav-child">
					  <dd><a href="javascript:;" class="refresh refreshThis"><i class="layui-icon">ဂ</i> 刷新当前</a></dd>
				      <dd><a href="javascript:;" class="closePageOther"><i class="iconfont icon-prohibit"></i> 关闭其他</a></dd>
				      <dd><a href="javascript:;" class="closePageAll"><i class="iconfont icon-guanbi"></i> 关闭全部</a></dd>
				    </dl>
				  </li>
				</ul>
				<div class="layui-tab-content clildFrame">
					<div class="layui-tab-item layui-show">
						<iframe src="page/main.html"></iframe>
					</div>
				</div>
			</div>
		</div>
		<!-- 底部 -->
		<div class="layui-footer footer">
			<p>copyright @2017 请叫我马哥  <a onclick="donation()" class="layui-btn layui-btn-danger layui-btn-small">捐赠作者</a></p>
		</div>
	</div>
	
	<!-- 移动导航 -->
	<div class="site-tree-mobile layui-hide"><i class="layui-icon"></i></div>
	<div class="site-mobile-shade"></div>

	<script type="text/javascript" src="layui/layui.js"></script>
	<script type="text/javascript" src="js/leftNav.js"></script>
	<script type="text/javascript" src="js/index.js"></script>
</body>
</html>

leftNav.js

function navBar(strData){
	var data;
	if(typeof(strData) == "string"){
		var data = JSON.parse(strData); //閮ㄥ垎鐢ㄦ埛瑙f瀽鍑烘潵鐨勬槸瀛楃涓诧紝杞崲涓€涓�
	}else{
		data = strData;
	}	
	var ulHtml = '<ul class="layui-nav layui-nav-tree">';
	for(var i=0;i<data.length;i++){
		if(data[i].spread){
			ulHtml += '<li class="layui-nav-item layui-nav-itemed">';
		}else{
			ulHtml += '<li class="layui-nav-item">';
		}
		if(data[i].children != undefined && data[i].children.length > 0){
			ulHtml += '<a href="javascript:;">';
			if(data[i].icon != undefined && data[i].icon != ''){
				if(data[i].icon.indexOf("icon-") != -1){
					ulHtml += '<i class="iconfont '+data[i].icon+'" data-icon="'+data[i].icon+'"></i>';
				}else{
					ulHtml += '<i class="layui-icon" data-icon="'+data[i].icon+'">'+data[i].icon+'</i>';
				}
			}
			ulHtml += '<cite>'+data[i].title+'</cite>';
			ulHtml += '<span class="layui-nav-more"></span>';
			ulHtml += '</a>';
			ulHtml += '<dl class="layui-nav-child">';
			for(var j=0;j<data[i].children.length;j++){
				if(data[i].children[j].target == "_blank"){
					ulHtml += '<dd><a href="javascript:;" data-url="'+data[i].children[j].href+'" target="'+data[i].children[j].target+'">';
				}else{
					ulHtml += '<dd><a href="javascript:;" data-url="'+data[i].children[j].href+'">';
				}
				if(data[i].children[j].icon != undefined && data[i].children[j].icon != ''){
					if(data[i].children[j].icon.indexOf("icon-") != -1){
						ulHtml += '<i class="iconfont '+data[i].children[j].icon+'" data-icon="'+data[i].children[j].icon+'"></i>';
					}else{
						ulHtml += '<i class="layui-icon" data-icon="'+data[i].children[j].icon+'">'+data[i].children[j].icon+'</i>';
					}
				}
				ulHtml += '<cite>'+data[i].children[j].title+'</cite></a></dd>';
			}
			ulHtml += "</dl>";
		}else{
			if(data[i].target == "_blank"){
				ulHtml += '<a href="javascript:;" data-url="'+data[i].href+'" target="'+data[i].target+'">';
			}else{
				ulHtml += '<a href="javascript:;" data-url="'+data[i].href+'">';
			}
			if(data[i].icon != undefined && data[i].icon != ''){
				if(data[i].icon.indexOf("icon-") != -1){
					ulHtml += '<i class="iconfont '+data[i].icon+'" data-icon="'+data[i].icon+'"></i>';
				}else{
					ulHtml += '<i class="layui-icon" data-icon="'+data[i].icon+'">'+data[i].icon+'</i>';
				}
			}
			ulHtml += '<cite>'+data[i].title+'</cite></a>';
		}
		ulHtml += '</li>';
	}
	ulHtml += '</ul>';
	return ulHtml;
}

index.js

var $,tab,skyconsWeather;
layui.config({
	base : "js/"
}).use(['bodyTab','form','element','layer','jquery'],function(){
	var form = layui.form(),
		layer = layui.layer,
		element = layui.element();
		$ = layui.jquery;
		tab = layui.bodyTab({
			openTabNum : "50",  //鏈€澶у彲鎵撳紑绐楀彛鏁伴噺
			url : "json/navs.json" //鑾峰彇鑿滃崟json鍦板潃
		});

	//鏇存崲鐨偆
	function skins(){
		var skin = window.sessionStorage.getItem("skin");
		if(skin){  //濡傛灉鏇存崲杩囩毊鑲�
			if(window.sessionStorage.getItem("skinValue") != "鑷畾涔�"){
				$("body").addClass(window.sessionStorage.getItem("skin"));
			}else{
				$(".layui-layout-admin .layui-header").css("background-color",skin.split(',')[0]);
				$(".layui-bg-black").css("background-color",skin.split(',')[1]);
				$(".hideMenu").css("background-color",skin.split(',')[2]);
			}
		}
	}
	skins();
	$(".changeSkin").click(function(){
		layer.open({
			title : "鏇存崲鐨偆",
			area : ["310px","280px"],
			type : "1",
			content : '<div class="skins_box">'+
						'<form class="layui-form">'+
							'<div class="layui-form-item">'+
								'<input type="radio" name="skin" value="榛樿" title="榛樿" lay-filter="default" checked="">'+
								'<input type="radio" name="skin" value="姗欒壊" title="姗欒壊" lay-filter="orange">'+
								'<input type="radio" name="skin" value="钃濊壊" title="钃濊壊" lay-filter="blue">'+
								'<input type="radio" name="skin" value="鑷畾涔�" title="鑷畾涔�" lay-filter="custom">'+
								'<div class="skinCustom">'+
									'<input type="text" class="layui-input topColor" name="topSkin" placeholder="椤堕儴棰滆壊" />'+
									'<input type="text" class="layui-input leftColor" name="leftSkin" placeholder="宸︿晶棰滆壊" />'+
									'<input type="text" class="layui-input menuColor" name="btnSkin" placeholder="椤堕儴鑿滃崟鎸夐挳" />'+
								'</div>'+
							'</div>'+
							'<div class="layui-form-item skinBtn">'+
								'<a href="javascript:;" class="layui-btn layui-btn-small layui-btn-normal" lay-submit="" lay-filter="changeSkin">纭畾鏇存崲</a>'+
								'<a href="javascript:;" class="layui-btn layui-btn-small layui-btn-primary" lay-submit="" lay-filter="noChangeSkin">鎴戝啀鎯虫兂</a>'+
							'</div>'+
						'</form>'+
					'</div>',
			success : function(index, layero){
				var skin = window.sessionStorage.getItem("skin");
				if(window.sessionStorage.getItem("skinValue")){
					$(".skins_box input[value="+window.sessionStorage.getItem("skinValue")+"]").attr("checked","checked");
				};
				if($(".skins_box input[value=鑷畾涔塢").attr("checked")){
					$(".skinCustom").css("visibility","inherit");
					$(".topColor").val(skin.split(',')[0]);
					$(".leftColor").val(skin.split(',')[1]);
					$(".menuColor").val(skin.split(',')[2]);
				};
				form.render();
				$(".skins_box").removeClass("layui-hide");
				$(".skins_box .layui-form-radio").on("click",function(){
					var skinColor;
					if($(this).find("span").text() == "姗欒壊"){
						skinColor = "orange";
					}else if($(this).find("span").text() == "钃濊壊"){
						skinColor = "blue";
					}else if($(this).find("span").text() == "榛樿"){
						skinColor = "";
					}
					if($(this).find("span").text() != "鑷畾涔�"){
						$(".topColor,.leftColor,.menuColor").val('');
						$("body").removeAttr("class").addClass("main_body "+skinColor+"");
						$(".skinCustom").removeAttr("style");
						$(".layui-bg-black,.hideMenu,.layui-layout-admin .layui-header").removeAttr("style");
					}else{
						$(".skinCustom").css("visibility","inherit");
					}
				})
				var skinStr,skinColor;
				$(".topColor").blur(function(){
					$(".layui-layout-admin .layui-header").css("background-color",$(this).val());
				})
				$(".leftColor").blur(function(){
					$(".layui-bg-black").css("background-color",$(this).val());
				})
				$(".menuColor").blur(function(){
					$(".hideMenu").css("background-color",$(this).val());
				})

				form.on("submit(changeSkin)",function(data){
					if(data.field.skin != "鑷畾涔�"){
						if(data.field.skin == "姗欒壊"){
							skinColor = "orange";
						}else if(data.field.skin == "钃濊壊"){
							skinColor = "blue";
						}else if(data.field.skin == "榛樿"){
							skinColor = "";
						}
						window.sessionStorage.setItem("skin",skinColor);
					}else{
						skinStr = $(".topColor").val()+','+$(".leftColor").val()+','+$(".menuColor").val();
						window.sessionStorage.setItem("skin",skinStr);
						$("body").removeAttr("class").addClass("main_body");
					}
					window.sessionStorage.setItem("skinValue",data.field.skin);
					layer.closeAll("page");
				});
				form.on("submit(noChangeSkin)",function(){
					$("body").removeAttr("class").addClass("main_body "+window.sessionStorage.getItem("skin")+"");
					$(".layui-bg-black,.hideMenu,.layui-layout-admin .layui-header").removeAttr("style");
					skins();
					layer.closeAll("page");
				});
			},
			cancel : function(){
				$("body").removeAttr("class").addClass("main_body "+window.sessionStorage.getItem("skin")+"");
				$(".layui-bg-black,.hideMenu,.layui-layout-admin .layui-header").removeAttr("style");
				skins();
			}
		})
	})

	//閫€鍑�
	$(".signOut").click(function(){
		window.sessionStorage.removeItem("menu");
		menu = [];
		window.sessionStorage.removeItem("curmenu");
	})

	//闅愯棌宸︿晶瀵艰埅
	$(".hideMenu").click(function(){
		$(".layui-layout-admin").toggleClass("showMenu");
		//娓叉煋椤堕儴绐楀彛
		tab.tabMove();
	})

	//娓叉煋宸︿晶鑿滃崟
	tab.render();

	//閿佸睆
	function lockPage(){
		layer.open({
			title : false,
			type : 1,
			content : '	<div class="admin-header-lock" id="lock-box">'+
							'<div class="admin-header-lock-img"><img src="images/face.jpg"/></div>'+
							'<div class="admin-header-lock-name" id="lockUserName">璇峰彨鎴戦┈鍝�</div>'+
							'<div class="input_btn">'+
								'<input type="password" class="admin-header-lock-input layui-input" autocomplete="off" placeholder="璇疯緭鍏ュ瘑鐮佽В閿�.." name="lockPwd" id="lockPwd" />'+
								'<button class="layui-btn" id="unlock">瑙i攣</button>'+
							'</div>'+
							'<p>璇疯緭鍏モ€�123456鈥濓紝鍚﹀垯涓嶄細瑙i攣鎴愬姛鍝︼紒锛侊紒</p>'+
						'</div>',
			closeBtn : 0,
			shade : 0.9
		})
		$(".admin-header-lock-input").focus();
	}
	$(".lockcms").on("click",function(){
		window.sessionStorage.setItem("lockcms",true);
		lockPage();
	})
	// 鍒ゆ柇鏄惁鏄剧ず閿佸睆
	if(window.sessionStorage.getItem("lockcms") == "true"){
		lockPage();
	}
	// 瑙i攣
	$("body").on("click","#unlock",function(){
		if($(this).siblings(".admin-header-lock-input").val() == ''){
			layer.msg("璇疯緭鍏ヨВ閿佸瘑鐮侊紒");
			$(this).siblings(".admin-header-lock-input").focus();
		}else{
			if($(this).siblings(".admin-header-lock-input").val() == "123456"){
				window.sessionStorage.setItem("lockcms",false);
				$(this).siblings(".admin-header-lock-input").val('');
				layer.closeAll("page");
			}else{
				layer.msg("瀵嗙爜閿欒锛岃閲嶆柊杈撳叆锛�");
				$(this).siblings(".admin-header-lock-input").val('').focus();
			}
		}
	});
	$(document).on('keydown', function() {
		if(event.keyCode == 13) {
			$("#unlock").click();
		}
	});

	//鎵嬫満璁惧鐨勭畝鍗曢€傞厤
	var treeMobile = $('.site-tree-mobile'),
		shadeMobile = $('.site-mobile-shade')

	treeMobile.on('click', function(){
		$('body').addClass('site-mobile');
	});

	shadeMobile.on('click', function(){
		$('body').removeClass('site-mobile');
	});

	// 娣诲姞鏂扮獥鍙�
	$("body").on("click",".layui-nav .layui-nav-item a",function(){
		//濡傛灉涓嶅瓨鍦ㄥ瓙绾�
		if($(this).siblings().length == 0){
			addTab($(this));
			$('body').removeClass('site-mobile');  //绉诲姩绔偣鍑昏彍鍗曞叧闂彍鍗曞眰
		}
		$(this).parent("li").siblings().removeClass("layui-nav-itemed");
	})

	//鍏憡灞�
	function showNotice(){
		layer.open({
	        type: 1,
	        title: "绯荤粺鍏憡",
	        closeBtn: false,
	        area: '310px',
	        shade: 0.8,
	        id: 'LAY_layuipro',
	        btn: ['鐏€熷洿瑙�'],
	        moveType: 1,
	        content: '<div style="padding:15px 20px; text-align:justify; line-height: 22px; text-indent:2em;border-bottom:1px solid #e2e2e2;"><p>鏈€杩戝伓鐒跺彂鐜拌搐蹇冨ぇ绁炵殑layui妗嗘灦锛岀灛闂磋浠栫殑瀹岀編鏍峰紡鎵€鍚稿紩锛岃櫧鐒跺姛鑳戒笉绠楀己澶э紝浣嗘瘯绔熸槸涓€涓垰鍒氬嚭鐜扮殑妗嗘灦锛屽悗闈細鎱㈡參瀹屽杽鐨勩€傚緢鏃╀箣鍓嶅氨鎯冲仛涓€濂楀悗鍙版ā鐗堬紝浣嗘槸鎰熻bootstrop浠g爜鐨勫啑浣欏お澶э紝涓嶆槸闈炲父鍠滄锛岃嚜宸卞啓鍙堝お绱紝鎵€浠ヤ竴鐩撮棽缃簡涓嬫潵銆傜洿鍒伴亣鍒颁簡layui鎴戞墠鍙堢噧璧蜂簡鍒朵綔涓€濂楀悗鍙版ā鐗堢殑鏂楀織銆傜敱浜庢湰浜哄彧鏄函鍓嶇锛屾墍浠ラ〉闈㈠彧鏄崟绾殑瀹炵幇浜嗘晥鏋滐紝娌℃湁鍋氭湇鍔″櫒绔殑涓€浜涘鐞嗭紝鍙兘鍚庢湡鎶€鏈窡涓婁簡浼氭洿鏂扮殑锛屽鏋滄湁浠€涔堥棶棰樻杩庡ぇ瀹舵寚瀵笺€傝阿璋㈠ぇ瀹躲€�</p><p>鍦ㄦ鐗瑰埆鎰熻阿Beginner鍜孭aco锛屼粬浠啓鐨勬鏋剁粰浜嗘垜寰堝ソ鐨勫惎鍙戝拰鍊熼壌銆傚笇鏈涙湁鏃堕棿鍙互澶氬璇锋暀銆�</p></div>',
	        success: function(layero){
				var btn = layero.find('.layui-layer-btn');
				btn.css('text-align', 'center');
				btn.on("click",function(){
					window.sessionStorage.setItem("showNotice","true");
				})
				if($(window).width() > 432){  //濡傛灉椤甸潰瀹藉害涓嶈冻浠ユ樉绀洪《閮ㄢ€滅郴缁熷叕鍛娾€濇寜閽紝鍒欎笉鎻愮ず
					btn.on("click",function(){
						layer.tips('绯荤粺鍏憡韬插湪浜嗚繖閲�', '#showNotice', {
							tips: 3
						});
					})
				}
	        }
	    });
	}
	//鍒ゆ柇鏄惁澶勪簬閿佸睆鐘舵€�(濡傛灉鍏抽棴浠ュ悗鍒欐湭鍏抽棴娴忚鍣ㄤ箣鍓嶄笉鍐嶆樉绀�)
	if(window.sessionStorage.getItem("lockcms") != "true" && window.sessionStorage.getItem("showNotice") != "true"){
		showNotice();
	}
	$(".showNotice").on("click",function(){
		showNotice();
	})

	//鍒锋柊鍚庤繕鍘熸墦寮€鐨勭獥鍙�
	if(window.sessionStorage.getItem("menu") != null){
		menu = JSON.parse(window.sessionStorage.getItem("menu"));
		curmenu = window.sessionStorage.getItem("curmenu");
		var openTitle = '';
		for(var i=0;i<menu.length;i++){
			openTitle = '';
			if(menu[i].icon){
				if(menu[i].icon.split("-")[0] == 'icon'){
					openTitle += '<i class="iconfont '+menu[i].icon+'"></i>';
				}else{
					openTitle += '<i class="layui-icon">'+menu[i].icon+'</i>';
				}
			}
			openTitle += '<cite>'+menu[i].title+'</cite>';
			openTitle += '<i class="layui-icon layui-unselect layui-tab-close" data-id="'+menu[i].layId+'">ဆ</i>';
			element.tabAdd("bodyTab",{
				title : openTitle,
		        content :"<iframe src='"+menu[i].href+"' data-id='"+menu[i].layId+"'></frame>",
		        id : menu[i].layId
			})
			//瀹氫綅鍒板埛鏂板墠鐨勭獥鍙�
			if(curmenu != "undefined"){
				if(curmenu == '' || curmenu == "null"){  //瀹氫綅鍒板悗鍙伴椤�
					element.tabChange("bodyTab",'');
				}else if(JSON.parse(curmenu).title == menu[i].title){  //瀹氫綅鍒板埛鏂板墠鐨勯〉闈�
					element.tabChange("bodyTab",menu[i].layId);
				}
			}else{
				element.tabChange("bodyTab",menu[menu.length-1].layId);
			}
		}
		//娓叉煋椤堕儴绐楀彛
		tab.tabMove();
	}

	//鍒锋柊褰撳墠
	$(".refresh").on("click",function(){  //姝ゅ娣诲姞绂佹杩炵画鐐瑰嚮鍒锋柊涓€鏄负浜嗛檷浣庢湇鍔″櫒鍘嬪姏锛屽彟澶栦竴涓氨鏄负浜嗛槻姝㈣秴蹇偣鍑婚€犳垚chrome鏈韩鐨勪竴浜沯s鏂囦欢鐨勬姤閿�(涓嶈繃璨屼技杩欎釜闂杩樻槸瀛樺湪锛屼笉杩囨鐜囧皬浜嗗緢澶�)
		if($(this).hasClass("refreshThis")){
			$(this).removeClass("refreshThis");
			$(".clildFrame .layui-tab-item.layui-show").find("iframe")[0].contentWindow.location.reload(true);
			setTimeout(function(){
				$(".refresh").addClass("refreshThis");
			},2000)
		}else{
			layer.msg("鎮ㄧ偣鍑荤殑閫熷害瓒呰繃浜嗘湇鍔″櫒鐨勫搷搴旈€熷害锛岃繕鏄瓑涓ょ鍐嶅埛鏂板惂锛�");
		}
	})

	//鍏抽棴鍏朵粬
	$(".closePageOther").on("click",function(){
		if($("#top_tabs li").length>2 && $("#top_tabs li.layui-this cite").text()!="鍚庡彴棣栭〉"){
			var menu = JSON.parse(window.sessionStorage.getItem("menu"));
			$("#top_tabs li").each(function(){
				if($(this).attr("lay-id") != '' && !$(this).hasClass("layui-this")){
					element.tabDelete("bodyTab",$(this).attr("lay-id")).init();
					//姝ゅ灏嗗綋鍓嶇獥鍙i噸鏂拌幏鍙栨斁鍏ession锛岄伩鍏嶄竴涓釜鍒犻櫎鏉ュ洖寰幆閫犳垚鐨勪笉蹇呰宸ヤ綔閲�
					for(var i=0;i<menu.length;i++){
						if($("#top_tabs li.layui-this cite").text() == menu[i].title){
							menu.splice(0,menu.length,menu[i]);
							window.sessionStorage.setItem("menu",JSON.stringify(menu));
						}
					}
				}
			})
		}else if($("#top_tabs li.layui-this cite").text()=="鍚庡彴棣栭〉" && $("#top_tabs li").length>1){
			$("#top_tabs li").each(function(){
				if($(this).attr("lay-id") != '' && !$(this).hasClass("layui-this")){
					element.tabDelete("bodyTab",$(this).attr("lay-id")).init();
					window.sessionStorage.removeItem("menu");
					menu = [];
					window.sessionStorage.removeItem("curmenu");
				}
			})
		}else{
			layer.msg("娌℃湁鍙互鍏抽棴鐨勭獥鍙d簡@_@");
		}
		//娓叉煋椤堕儴绐楀彛
		tab.tabMove();
	})
	//鍏抽棴鍏ㄩ儴
	$(".closePageAll").on("click",function(){
		if($("#top_tabs li").length > 1){
			$("#top_tabs li").each(function(){
				if($(this).attr("lay-id") != ''){
					element.tabDelete("bodyTab",$(this).attr("lay-id")).init();
					window.sessionStorage.removeItem("menu");
					menu = [];
					window.sessionStorage.removeItem("curmenu");
				}
			})
		}else{
			layer.msg("娌℃湁鍙互鍏抽棴鐨勭獥鍙d簡@_@");
		}
		//娓叉煋椤堕儴绐楀彛
		tab.tabMove();
	})
})

//鎵撳紑鏂扮獥鍙�
function addTab(_this){
	tab.tabAdd(_this);
}

//鎹愯禒寮圭獥
function donation(){
	layer.tab({
		area : ['260px', '367px'],
		tab : [{
			title : "寰俊",
			content : "<div style='padding:30px;overflow:hidden;background:#d2d0d0;'><img src='images/wechat.jpg'></div>"
		},{
			title : "鏀粯瀹�",
			content : "<div style='padding:30px;overflow:hidden;background:#d2d0d0;'><img src='images/alipay.jpg'></div>"
		}]
	})
}


猜你喜欢

转载自blog.csdn.net/tanxuefeng22/article/details/80543960