“代码”

master
装作不在意 3 years ago
parent 0373b997a0
commit f94a109dbc

@ -0,0 +1,25 @@
<?xml version="1.0" encoding="UTF-8"?>
<classpath>
<classpathentry kind="src" path="src"/>
<classpathentry kind="con" path="org.eclipse.jst.j2ee.internal.web.container"/>
<classpathentry kind="con" path="org.eclipse.jst.j2ee.internal.module.container"/>
<classpathentry kind="con" path="org.eclipse.jdt.junit.JUNIT_CONTAINER/4"/>
<classpathentry kind="con" path="org.eclipse.jdt.launching.JRE_CONTAINER/org.eclipse.jdt.internal.debug.ui.launcher.StandardVMType/JavaSE-1.8">
<attributes>
<attribute name="module" value="true"/>
<attribute name="owner.project.facets" value="java"/>
</attributes>
</classpathentry>
<classpathentry kind="lib" path="WebContent/WEB-INF/lib/c3p0-0.9.5.5.jar"/>
<classpathentry kind="lib" path="WebContent/WEB-INF/lib/commons-dbutils-1.7.jar"/>
<classpathentry kind="lib" path="WebContent/WEB-INF/lib/fastjson-1.2.2.jar"/>
<classpathentry kind="lib" path="WebContent/WEB-INF/lib/jsp-api.jar"/>
<classpathentry kind="lib" path="WebContent/WEB-INF/lib/mchange-commons-java-0.2.19.jar"/>
<classpathentry kind="lib" path="WebContent/WEB-INF/lib/mysql-connector-java-5.1.39-bin.jar"/>
<classpathentry kind="lib" path="WebContent/WEB-INF/lib/servlet-api.jar"/>
<classpathentry kind="lib" path="WebContent/WEB-INF/lib/taglibs-standard-compat-1.2.5.jar"/>
<classpathentry kind="lib" path="WebContent/WEB-INF/lib/taglibs-standard-impl-1.2.5.jar"/>
<classpathentry kind="lib" path="WebContent/WEB-INF/lib/taglibs-standard-jstlel-1.2.5.jar"/>
<classpathentry kind="lib" path="WebContent/WEB-INF/lib/taglibs-standard-spec-1.2.5.jar"/>
<classpathentry kind="output" path="build/classes"/>
</classpath>

@ -0,0 +1,31 @@
<?xml version="1.0" encoding="UTF-8"?>
<projectDescription>
<name>ChinapartyProject</name>
<comment></comment>
<projects>
</projects>
<buildSpec>
<buildCommand>
<name>org.eclipse.jdt.core.javabuilder</name>
<arguments>
</arguments>
</buildCommand>
<buildCommand>
<name>org.eclipse.wst.common.project.facet.core.builder</name>
<arguments>
</arguments>
</buildCommand>
<buildCommand>
<name>org.eclipse.wst.validation.validationbuilder</name>
<arguments>
</arguments>
</buildCommand>
</buildSpec>
<natures>
<nature>org.eclipse.jem.workbench.JavaEMFNature</nature>
<nature>org.eclipse.wst.common.modulecore.ModuleCoreNature</nature>
<nature>org.eclipse.wst.common.project.facet.core.nature</nature>
<nature>org.eclipse.jdt.core.javanature</nature>
<nature>org.eclipse.wst.jsdt.core.jsNature</nature>
</natures>
</projectDescription>

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<classpath>
<classpathentry excluding="**/bower_components/*|**/node_modules/*|**/*.min.js" kind="src" path="WebContent"/>
<classpathentry kind="con" path="org.eclipse.wst.jsdt.launching.JRE_CONTAINER"/>
<classpathentry kind="con" path="org.eclipse.wst.jsdt.launching.WebProject">
<attributes>
<attribute name="hide" value="true"/>
</attributes>
</classpathentry>
<classpathentry kind="con" path="org.eclipse.wst.jsdt.launching.baseBrowserLibrary"/>
<classpathentry kind="output" path=""/>
</classpath>

@ -0,0 +1,3 @@
eclipse.preferences.version=1
encoding//src/com/xxxy/niehongxuan/action/classobj/getAllYearsServlet.java=UTF-8
encoding//src/com/xxxy/niehongxuan/dao/DepartmentDao.java=UTF-8

@ -0,0 +1,7 @@
eclipse.preferences.version=1
org.eclipse.jdt.core.compiler.codegen.inlineJsrBytecode=enabled
org.eclipse.jdt.core.compiler.codegen.targetPlatform=1.8
org.eclipse.jdt.core.compiler.compliance=1.8
org.eclipse.jdt.core.compiler.problem.assertIdentifier=error
org.eclipse.jdt.core.compiler.problem.enumIdentifier=error
org.eclipse.jdt.core.compiler.source=1.8

@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?><project-modules id="moduleCoreId" project-version="1.5.0">
<wb-module deploy-name="ChinapartyProject">
<wb-resource deploy-path="/" source-path="/WebContent" tag="defaultRootSource"/>
<wb-resource deploy-path="/WEB-INF/classes" source-path="/src"/>
<property name="java-output-path" value="/ChinapartyProject/build/classes"/>
<property name="context-root" value="ChinapartyProject"/>
</wb-module>
</project-modules>

@ -0,0 +1,9 @@
<?xml version="1.0" encoding="UTF-8"?>
<faceted-project>
<fixed facet="java"/>
<fixed facet="wst.jsdt.web"/>
<fixed facet="jst.web"/>
<installed facet="java" version="1.8"/>
<installed facet="jst.web" version="3.0"/>
<installed facet="wst.jsdt.web" version="1.0"/>
</faceted-project>

@ -0,0 +1 @@
org.eclipse.wst.jsdt.launching.baseBrowserLibrary

@ -0,0 +1,3 @@
Manifest-Version: 1.0
Class-Path:

@ -0,0 +1,20 @@
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="WebApp_ID" version="3.0">
<display-name>ChinapartyProject</display-name>
<welcome-file-list>
<welcome-file>index.html</welcome-file>
<welcome-file>index.htm</welcome-file>
<welcome-file>index.jsp</welcome-file>
<welcome-file>default.html</welcome-file>
<welcome-file>default.htm</welcome-file>
<welcome-file>default.jsp</welcome-file>
</welcome-file-list>
<servlet>
<servlet-name>getAllYearsServlet</servlet-name>
<servlet-class>com.xxxy.niehongxuan.action.classobj.getAllYearsServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>getAllYearsServlet</servlet-name>
<url-pattern>/view/classobj/YearsList.jsp</url-pattern>
</servlet-mapping>
</web-app>

@ -0,0 +1,130 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>IT博客管理系统</title>
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="shortcut icon" href="statics/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="statics/css/font.css">
<link rel="stylesheet" href="statics/css/xadmin.css">
<script src="statics/js/jquery.min.js"></script>
<script src="statics/lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="statics/js/xadmin.js"></script>
</head>
<body>
<!-- 顶部开始 -->
<div class="container">
<div class="logo"><a href="index.html">IT博客管理系统</a></div>
<div class="left_open">
<i title="展开左侧栏" class="iconfont">&#xe699;</i>
</div>
<ul class="layui-nav right" lay-filter="">
<li class="layui-nav-item">
<a href="javascript:;">admin</a>
<dl class="layui-nav-child"> <!-- 二级菜单 -->
<dd><a onClick="x_admin_show('个人信息','http://www.baidu.com')">个人信息</a></dd>
<dd><a onClick="x_admin_show('切换帐号','http://www.baidu.com')">切换帐号</a></dd>
<dd><a href="login.html">退出</a></dd>
</dl>
</li>
<li class="layui-nav-item to-index"><a href="#">前台首页</a></li>
</ul>
</div>
<!-- 顶部结束 -->
<!-- 中部开始 -->
<!-- 左侧菜单开始 -->
<div class="left-nav">
<div id="side-nav">
<ul id="nav">
<li >
<a href="javascript:;">
<i class="iconfont">&#xe6e4;</i>
<cite>系统管理</cite>
<i class="iconfont nav_right">&#xe6a7;</i>
</a>
<ul class="sub-menu">
<li><a _href="/ChinapartyProject/getAllClassobjServlet"><i class="iconfont">&#xe6a7;</i><cite>用户管理</cite></a></li>
<li><a _href="/ChinapartyProject/getAllTeacherobjServlet"><i class="iconfont">&#xe6a7;</i><cite>博文管理</cite></a></li>
<li> <a _href="/ChinapartyProject/getAllDepartmentServlet"><i class="iconfont">&#xe6a7;</i><cite>评论管理</cite></a></li>
<!-- <li><a _href="html/tab.html"><i class="iconfont">&#xe6a7;</i><cite>角色管理</cite></a></li> -->
<li><a _href="/ChinapartyProject/getAllPostServlet"><i class="iconfont">&#xe6a7;</i><cite>标签管理</cite></a></li>
<!--<li><a _href="html/nav.html"><i class="iconfont">&#xe6a7;</i><cite>人员管理</cite></a></li> -->
<!--<li><a _href="html/tab.html"><i class="iconfont">&#xe6a7;</i><cite>用户管理</cite></a></li> -->
</ul>
</li>
<!-- <li>
<a href="javascript:;"><i class="iconfont">&#xe6f6;</i><cite>学习资源</cite><i class="iconfont nav_right">&#xe6a7;</i></a>
<ul class="sub-menu">
<li><a _href="html/upload.html"><i class="iconfont">&#xe6a7;</i><cite>资源类别</cite></a></li>
<li><a _href="html/page.html"><i class="iconfont">&#xe6a7;</i><cite>资源管理</cite></a></li>
</ul>
</li> -->
<!-- <li >
<a href="javascript:;">
<i class="iconfont">&#xe6b4;</i>
<cite>知识测试</cite>
<i class="iconfont nav_right">&#xe6a7;</i>
</a>
<ul class="sub-menu">
<li><a _href="/ChinapartyProject/getAllThemeServlet"><i class="iconfont">&#xe6a7;</i><cite>测试主题</cite></a></li>
<li><a _href="html/welcome2.html"><i class="iconfont">&#xe6a7;</i><cite>测试题库</cite></a></li>
<li><a _href="html/welcome2.html"><i class="iconfont">&#xe6a7;</i><cite>测试结果</cite></a></li>
</ul>
</li> -->
<!-- <li>
<a href="javascript:;">
<i class="iconfont">&#xe69e;</i>
<cite>学习足迹</cite>
<i class="iconfont nav_right">&#xe6a7;</i>
</a>
<ul class="sub-menu">
<li>
<a _href="statics/html/order-list.html">
<i class="iconfont">&#xe6a7;</i>
<cite>学习心得</cite>
</a>
</li >
<li>
<a _href="html/order-list.html">
<i class="iconfont">&#xe6a7;</i>
<cite>学习记录</cite>
</a>
</li >
</ul>
</li> -->
</ul>
</div>
</div>
<!-- <div class="x-slide_left"></div> -->
<!-- 左侧菜单结束 -->
<!-- 右侧主体开始 -->
<div class="page-content">
<div class="layui-tab tab" lay-filter="xbs_tab" lay-allowclose="false">
<ul class="layui-tab-title">
<li class="home"><i class="layui-icon">&#xe68e;</i>我的桌面</li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">
<iframe src='statics/html/welcome.html' frameborder="0" scrolling="yes" class="x-iframe"></iframe>
</div>
</div>
</div>
</div>
<div class="page-content-bg"></div>
<!-- 右侧主体结束 -->
<!-- 中部结束 -->
<!-- 底部开始 -->
<!--<div class="footer">
<div class="copyright">Copyright ©2019 L-admin v2.3 All Rights Reserved</div>
</div>-->
<!-- 底部结束 -->
</body>
</html>

@ -0,0 +1,235 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>系统后台登录页面</title>
<script
src="${pageContext.request.contextPath}/static/bootstrap3/js/jquery-1.11.2.min.js"></script>
<STYLE>
body {
background: #ebebeb;
font-family: "Helvetica Neue", "Hiragino Sans GB", "Microsoft YaHei",
"\9ED1\4F53", Arial, sans-serif;
color: #222;
font-size: 12px;
}
* {
padding: 0px;
margin: 0px;
}
.top_div {
background: #008ead;
width: 100%;
height: 400px;
}
.ipt {
border: 1px solid #d3d3d3;
padding: 10px 10px;
width: 290px;
border-radius: 4px;
padding-left: 35px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
-webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow
ease-in-out .15s;
-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out
.15s;
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s
}
.ipt:focus {
border-color: #66afe9;
outline: 0;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px
rgba(102, 175, 233, .6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px
rgba(102, 175, 233, .6)
}
.u_logo {
background:
url("${pageContext.request.contextPath}/static/images/username.png")
no-repeat;
padding: 10px 10px;
position: absolute;
top: 43px;
left: 40px;
}
.p_logo {
background:
url("${pageContext.request.contextPath}/static/images/password.png")
no-repeat;
padding: 10px 10px;
position: absolute;
top: 12px;
left: 40px;
}
a {
text-decoration: none;
}
.tou {
background:
url("${pageContext.request.contextPath}/static/images/tou.png")
no-repeat;
width: 97px;
height: 92px;
position: absolute;
top: -87px;
left: 140px;
}
.left_hand {
background:
url("${pageContext.request.contextPath}/static/images/left_hand.png")
no-repeat;
width: 32px;
height: 37px;
position: absolute;
top: -38px;
left: 150px;
}
.right_hand {
background:
url("${pageContext.request.contextPath}/static/images/right_hand.png")
no-repeat;
width: 32px;
height: 37px;
position: absolute;
top: -38px;
right: -64px;
}
.initial_left_hand {
background:
url("${pageContext.request.contextPath}/static/images/hand.png")
no-repeat;
width: 30px;
height: 20px;
position: absolute;
top: -12px;
left: 100px;
}
.initial_right_hand {
background:
url("${pageContext.request.contextPath}/static/images/hand.png")
no-repeat;
width: 30px;
height: 20px;
position: absolute;
top: -12px;
right: -112px;
}
.left_handing {
background:
url("${pageContext.request.contextPath}/static/images/left-handing.png")
no-repeat;
width: 30px;
height: 20px;
position: absolute;
top: -24px;
left: 139px;
}
.right_handinging {
background:
url("${pageContext.request.contextPath}/static/images/right_handing.png")
no-repeat;
width: 30px;
height: 20px;
position: absolute;
top: -21px;
left: 210px;
}
</STYLE>
<SCRIPT type="text/javascript">
$(function(){
//得到焦点
$("#password").focus(function() {
$("#left_hand").animate({
left : "150",
top : " -38"
}, {
step : function() {
if (parseInt($("#left_hand").css("left")) > 140) {
$("#left_hand").attr("class", "left_hand");
}
}
}, 2000);
$("#right_hand").animate({
right : "-64",
top : "-38px"
}, {
step : function() {
if (parseInt($("#right_hand").css("right")) > -70) {
$("#right_hand").attr("class", "right_hand");
}
}
}, 2000);
});
//失去焦点
$("#password").blur(function() {
$("#left_hand").attr("class", "initial_left_hand");
$("#left_hand").attr("style", "left:100px;top:-12px;");
$("#right_hand").attr("class", "initial_right_hand");
$("#right_hand").attr("style", "right:-112px;top:-12px");
});
});
function checkForm() {
var userName = $("#userName").val();
var password = $("#password").val();
if (userName == null || userName == "") {
$("#error").html("用户名不能为空!");
return false;
}
if (password == null || password == "") {
$("#error").html("密码不能为空!");
return false;
}
return true;
}
</SCRIPT>
</head>
<body>
<DIV class="top_div"></DIV>
<form action="LoginsServlet" method="post" onsubmit="return checkForm()"">
<DIV style="background: rgb(255, 255, 255); margin: -100px auto auto; border: 1px solid rgb(231, 231, 231); border-image: none; width: 400px; height: 200px; text-align: center;">
<DIV style="width: 165px; height: 96px; position: absolute;">
<DIV class="tou"></DIV>
<DIV class="initial_left_hand" id="left_hand"></DIV>
<DIV class="initial_right_hand" id="right_hand"></DIV>
</DIV>
<P style="padding: 30px 0px 10px; position: relative;">
<SPAN class="u_logo"></SPAN> <INPUT id="userName" name="admin_name"
class="ipt" type="text" placeholder="请输入用户名">
</P>
<P style="position: relative;">
<SPAN class="p_logo"></SPAN> <INPUT id="password" name="admin_pwd"
class="ipt" type="password" placeholder="请输入密码">
</P>
<DIV
style="height: 50px; line-height: 50px; margin-top: 30px; border-top-color: rgb(231, 231, 231); border-top-width: 1px; border-top-style: solid;">
<P style="margin: 0px 35px 20px 45px;">
<SPAN style="float: left;">管理员登录系统</SPAN>
<SPAN style="float: right;">
<input type="submit" style="background: rgb(0, 142, 173); padding: 7px 10px; border-radius: 4px; border: 1px solid rgb(26, 117, 152); border-image: none; color: rgb(255, 255, 255); font-weight: bold;"
value="登录" />
</SPAN>
</P>
</DIV>
</DIV>
</form>
<div style="text-align: center; padding-top: 30px"></div>
</body>
</html>

File diff suppressed because one or more lines are too long

@ -0,0 +1,16 @@
@font-face {
font-family: 'iconfont';
src: url('../fonts/iconfont.eot');
src: url('../fonts/iconfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/iconfont.woff') format('woff'),
url('../fonts/iconfont.ttf') format('truetype'),
url('../fonts/iconfont.svg#iconfont') format('svg');
}
.iconfont{
font-family:"iconfont" !important;
font-size:15px;font-style:normal;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0.2px;
-moz-osx-font-smoothing: grayscale;
}

File diff suppressed because one or more lines are too long

@ -0,0 +1,135 @@
.login-page {
width: 420px;
padding: 8% 0 0;
margin: auto;
}
.form {
position: relative;
z-index: 1;
background: #fff;
max-width: 400px;
margin: 0 auto 100px;
padding: 40px 40px 50px;
text-align: center;
box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2), 0 5px 5px 0 rgba(0, 0, 0, 0.24);
}
.form input {
font-family: "Roboto", sans-serif;
outline: 0;
background: #f2f2f2;
width: 100%;
border: 0;
margin: 0 0 15px;
padding: 15px;
box-sizing: border-box;
font-size: 14px;
}
.form button {
font-family: "Microsoft YaHei", "Roboto", sans-serif;
text-transform: uppercase;
outline: 0;
background: #0dc316;
width: 100%;
border: 0;
padding: 15px;
color: #FFFFFF;
font-size: 15px;
-webkit-transition: all 0.3 ease;
transition: all 0.3 ease;
cursor: pointer;
}
.form button:hover, .form button:active, .form button:focus {
background: #0eb618;
}
.form .message {
margin: 18px 0 0;
color: #b3b3b3;
font-size: 14px;
}
.form .message a {
color: #0eb618;
text-decoration: none;
}
.form .register-form {
display: none;
}
.container {
position: relative;
z-index: 1;
max-width: 300px;
margin: 0 auto;
}
.container:before, .container:after {
content: "";
display: block;
clear: both;
}
.container .info {
margin: 50px auto;
text-align: center;
}
.container .info h1 {
margin: 0 0 15px;
padding: 0;
font-size: 36px;
font-weight: 300;
color: #1a1a1a;
}
.container .info span {
color: #4d4d4d;
font-size: 12px;
}
.container .info span a {
color: #000000;
text-decoration: none;
}
.container .info span .fa {
color: #EF3B3A;
}
.login-form h2{ font-size:24px; color:#212121; font-weight:600; text-align:left;}
body {
background: #20222A; /* fallback for old browsers */
font-family: "microsoft", sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.shake_effect {
-webkit-animation-name: shake;
animation-name: shake;
-webkit-animation-duration: 1s;
animation-duration: 1s;
}
@-webkit-keyframes shake {
from, to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%, 40%, 60%, 80% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
@keyframes shake {
from, to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%, 40%, 60%, 80% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
p.center {
color: #888;
font-family: "Microsoft YaHei";
}
/* CSS Document */

@ -0,0 +1,357 @@
*{
padding: 0px;
margin: 0px;
}
li{
list-style-type: none;
}
a{
text-decoration: none;
}
a:hover{
font-weight: bold;
}
#main{
width: 100%;
height: 100%;
}
.btn{
border: none;
padding: 3px 15px ;
font-size: 15px;
font-weight: bold;
}
.btn-blue{
color: white;
background-color: #359ee8;
}
.btn-blue:hover{
cursor: pointer;
background-color: #dbd6d687;
}
.left{
float: left;
}
.clearfix{
zoom: 1;
}
.table {
border-top: 1px solid #cccccc;
border-left: 1px solid #cccccc;
border-right: 1px solid #cccccc;
}
.table tr:hover{
background: whitesmoke;
}
.table th{
height: 30px;
line-height: 30px;
font-weight: bold;
font-size: 15px;
background: #ccc;
}
.table td{
height: 30px;
line-height: 30px;
border-bottom: 1px solid #cccccc;
font-size: 13px;
}
.text-center{
text-align: center;
}
.login{
width: 500px;
height: 340px;
background: #0077ca;
position: absolute;
top: 50%;
left: 50%;
margin: -170px;
}
.loginMain{
padding: 50px;
color: white;
}
.loginMain form ul li{
margin-top: 10px;
}
.loginMain ul span{
display: inline-block;
width: 102px;
height: 30px;
text-align: right;
font-size: 15px;
}
.loginMain ul li input[type="text"],.loginMain ul li input[type="password"]{
height: 25px;
width: 205px;
border-radius: initial;
}
.loginMain ul li input[name="verify"]{
width: 75px;
}
img[name="verifyImg"]{
margin-left: 50px;
height: 30px;
width: 79px;
float:right;
position: absolute;
}
.loginMain ul li input[name="submit"],.loginMain ul li input[name="reset"]{
width: 78px;
height: 30px;
background-color: #00608b;
margin: 0px -57px 0px 106px;
cursor: pointer;
}
.loginMain ul li input[name="submit"]:hover{
background-color: darkblue;
}
.loginMain ul li input[name="reset"]:hover{
background-color: darkblue;
}
#warmText{
display: block;
margin-left: 115px;
width: 200px;
text-align: center;
}
/*顶部导航*/
.head{
width: 100%;
height: 50px;
background-color: #0077ca;
float: right;
}
.headLogo{
width: 150px;
height: 50px;
text-align: center;
line-height: 50px;
color: white;
float: left;
}
ul.headnav li{
width: 72px;
height: 50px;
line-height: 47px;
margin-right: 2px;
border: white;
float: left;
background-color: #00a2ca;
}
.head .headnav li.current-menu{
width: 120px;
background: #82a8ff;
}
ul.headnav li a{
text-align: center;
display: block;
}
ul.headnav li a:hover{
font-weight: bold;
}
#headnavRight li{
display: block;
float: left;
margin: 25px 2px 0px 6px;
background-color: #82a8ff;
}
#headnavRight li:first-child{
margin-left: 19%;
}
.leftMenu{
position: absolute;
top: 53px;
overflow-x: hidden;
overflow-y: auto;
}
.leftMenu_1 dl{
background-color: #0077CA;
width: 150px;
cursor: pointer;
}
.leftMenu_1 dl dt{
width: 150px;
text-indent: 20px;
padding-top: 8px;
height: 30px;
font-weight: bold;
background: url(../img/toggle.png ) 120px 17px no-repeat;
}
.leftMenu_1 dl dd{
background-color: #d3e5ee;
}
.leftMenu_1 dl dd ul li{
height: 30px;
margin-left: 30px;
}
.leftMenu_1 dl dd ul li a{
width: 150px;
display: block;
background: #D3E5EE;
color: #00a2ca;
}
.leftMenu_1 dl dd ul li a:hover{
font-weight: bold;
border: 1px solid #00A2CA;
}
.rightMain{
position: absolute;
top: 50px;
left: 155px;
bottom: 0px;
right: 0px;
overflow: initial;
margin-top: 5px;
}
.rightContent{
height: 100%;
}
.rightContent iframe{
height: 100%;
width: 100%;
}
body.showLeftMenu .rightMain{
left: 155px;
}
body.hideLeftMenu .rightMain{
left: 0px;
}
.maincol-left{
float: left;
}
.maincol dl{
border:2px solid greenyellow;
margin-bottom: 5px;
width:430px;
background-color: #00a2ca;
text-align: left;
color: #d3e5ee;
padding-left: 10px;
}
.maincol-left dl:first-child{
background-color: #329be3;
}
.maincol dl dd{
font-size: 13px;
margin-bottom: 5px;
}
.maincol dl dt{
margin: 10px 0px;
}
.maincol-right{
float: right;
}
.maincol-right dl{
background-color: #54b834;
}
.pos{
height: 35px;
border-bottom: 2px solid #ccc;
padding-left: 20px;
line-height: 35px;
font-size: 14px;
color: #0077CA;
font-weight: bold;
}
.operatr{
margin: 5px;
height: 25px;
}
.page{
height: 30px;
line-height: 30px;
border-bottom: 1px solid #cccccc;
border-right: 1px solid #cccccc;
border-left: 1px solid #cccccc;
}
.text-left{
text-align: left;
}
.tableWrap{
margin: 5px;
}
.title{
width: 100px;
}
.textarea-default{
width: 600px;
height: 90px;
}
.leftMenu_1 dl dd ul a.currentLeftMenu{
border-bottom: 1px solid #cccccc;
border-right: 1px solid #cccccc;
border-left: 1px solid #cccccc;
background-color: ghostwhite;
}
.optionsBar ul{
}
.optionsBar ul li{
border: 1px solid honeydew;
font-size: 15px;
background-color: #bebebe8f;
height: 20px;
display: inline-block;
margin-left: 8px;
margin-top: 10px;
padding: 2px;
}
.optionsBar ul li:hover{
font-weight: bold;
background-color: whitesmoke;
}
.webItem{
display: none;
}
.webItem dl{
margin-top: 55px;
width: 100%;
}
.webItem dl dd{
display: block;
margin-left: 10px;
margin-top: 10px;
padding: 5px;
font-size: 14px;
}
.webItem dl dd input[type="text"],.webItem dl dd textarea{
margin-left: 100px;
width: 20%;
}
.webItem dl dd input{
position: relative;
}
input[type="button"]{
padding: 1px 8px;
background-color: #00a2ca;
border: 1px solid whitesmoke;
margin-left: 181px;
}
input[type="button"]:hover{
background-color: #D3E5EE;
}
.optionsBar ul li.currentWebItem{
background-color: white;
}

File diff suppressed because it is too large Load Diff

@ -0,0 +1,565 @@
@charset "utf-8";
@import url(../lib/layui/css/layui.css);
*{
margin: 0px;
padding: 0px;
font-family: "microsoft yahei","Helvetica Neue", Helvetica, Arial, sans-serif;
}
a{
text-decoration: none;
}
html{
width: 100%;
height: 100%;
overflow-x:hidden;
overflow-y:auto;
}
body{
width: 100%;
min-height: 100%;
}
.login-bg{
background: #eeeeee url() 0 0 no-repeat;
background-size: cover;
overflow: hidden;
}
.form-wrap{background:#f8f8f8; margin-top:15px;}
.login{
margin: 120px auto 0 auto;
min-height: 420px;
max-width: 420px;
padding: 40px;
background-color: #ffffff;
margin-left: auto;
margin-right: auto;
border-radius: 4px;
/* overflow-x: hidden; */
box-sizing: border-box;
}
.login a.logo{
display: block;
height: 58px;
width: 167px;
margin: 0 auto 30px auto;
background-size: 167px 42px;
}
.login .message {
margin: 10px 0 0 0;
padding: 18px 10px 18px 60px;
background: #0dc316;
position: relative;
color: #fff;
font-size: 16px;
}
.login #darkbannerwrap {
/* background: url(../images/aiwrap.png);
*/ width: 18px;
height: 10px;
margin: 0 0 20px -58px;
position: relative;
}
.login input[type=text],
.login input[type=file],
.login input[type=password],
.login input[type=email], select {
border: 1px solid #DCDEE0;
vertical-align: middle;
border-radius: 3px;
height: 50px;
padding: 0px 16px;
font-size: 14px;
color: #555555;
outline:none;
width:100%;
box-sizing: border-box;
}
.login input[type=text]:focus,
.login input[type=file]:focus,
.login input[type=password]:focus,
.login input[type=email]:focus, select:focus {
border: 1px solid #27A9E3;
}
.login input[type=submit],
.login input[type=button]{
display: inline-block;
vertical-align: middle;
padding: 12px 24px;
margin: 0px;
font-size: 18px;
line-height: 24px;
text-align: center;
white-space: nowrap;
vertical-align: middle;
cursor: pointer;
color: #ffffff;
background-color: #189F92;
border-radius: 3px;
border: none;
-webkit-appearance: none;
outline:none;
width:100%;
}
.login hr {
background: #fff url() 0 0 no-repeat;
}
.login hr.hr15 {
height: 15px;
border: none;
margin: 0px;
padding: 0px;
width: 100%;
}
.login hr.hr20 {
height: 20px;
border: none;
margin: 0px;
padding: 0px;
width: 100%;
}
.x-body{
padding: 20px;
}
.x-nav{
padding: 0 20px;
position: relative;
z-index: 99;
border-bottom: 1px solid #e5e5e5;
line-height: 39px;
height: 39px;
overflow: hidden;
}
xblock{
display: block;
margin-bottom: 10px;
padding: 5px ;
padding-left:6px;
padding-right:15px;
line-height: 22px;
/* border-left: 5px solid #15c142; */
border-radius: 0 2px 2px 0;
background-color: #f2f2f2;
}
.x-right{
float: right;
}
.x-so{
/*text-align: center;*/
/*background: #f2f2f2 url() 0 0 no-repeat;*/
margin-bottom: 20px;
}
.x-so input.layui-input{
width: 150px;
}
.x-so .layui-form-label{
display: inline-block;
}
.x-so input.layui-input,.x-so input.layui-btn{
display: inline-block;
}
.x-red{
color: red;
}
.x-a{
color: #099641;
}
.x-a:hover{
color: #077e37;
}
.x-sort{
height: 30px;
}
.x-show{
cursor: pointer;
}
.layui-form-switch{
margin-top: 0px;
}
.layui-input:focus, .layui-textarea:focus {
border-color: #15c142!important;
}
.page{
margin-top: 20px;
text-align: center;
}
.page a{
display: inline-block;
background: #f5f5f5;
color: #888;
padding: 10px 13px;
min-width: 15px;
transition:background-color ease .5s;
font-family:"microsoft yahei";
border-radius:3px;
}
.page span{
display: inline-block;
padding: 10px 10px;
min-width: 15px;
}
.page span.current{
display: inline-block;
background: #15c142 url() 0 0 no-repeat;
color: #fff;
padding: 10px 13px;
min-width: 15px;
border-radius:3px;
}
.page .pagination li{
display: inline-block;
margin-right: 5px;
text-align: center;
}
.page .pagination li.active span{
background: #15c142 url() 0 0 no-repeat;
color: #fff;
}
/*登录样式*/
/*头部*/
.container{
width: 100%;
height: 55px;
background-color:#111;
border-bottom: 1px solid rgba(0, 0, 0, 0.8);
}
.container .logo a{
float: left;
color: #fff;
font-size: 18px;
padding-left: 20px;
line-height: 50px;
width: 200px;
transition:background-color ease .3s
}
.container .right{
background-color:rgba(0,0,0,0);
float: right;
transition:background-color ease .3s
}
.container .left_open{
height: 55px;
float: left;
}
.container .left_open i{
display: block;
background: rgba(255,255,255,0.1) url() 0 0 no-repeat;
color: #fff;
width: 32px;
height: 32px;
line-height: 32px;
border-radius: 3px;
text-align: center;
margin-top: 10px;
cursor: pointer;
transition:background-color ease .3s
}
.container .left_open i:hover{
background: rgba(255,255,255,0.3) url() 0 0 no-repeat;
}
.container .left{
background-color:rgba(0,0,0,0);
float: left;
}
.container .layui-nav-item{
line-height: 50px;
}
.container .layui-nav-more{
top: 25px;
}
.container .layui-nav-child{
top: 50px;
}
.container .layui-nav-child i{
margin-right: 10px;
}
.layui-nav .layui-nav-item a{
color: #ccc;
cursor: pointer;
}
.layui-nav .layui-nav-item >a:hover{
color: #fff;
cursor: pointer;
}
.layui-nav .layui-nav-child a{
color: #333;
cursor: pointer;
}
.left-nav{
position: absolute;
top: 51px;
bottom: 0px;
left: 0;
z-index: 2;
padding-top: 10px;
background-color: #222324;
width: 220px;
max-width: 220px;
overflow: hidden;
border-right: 1px solid #131e26;
/*width: 0px;*/
}
.left-nav #nav > li{
line-height:30px;
border-left:4px solid #222324;
transition:background-color ease .3s
}
.left-nav #nav > li:hover {
background:#181818;
border-left:4px solid #42b8f1;
}
.left-nav #nav > li.open {
border-left:4px solid #42b8f1;
background:#181818;
}
.left-nav #nav li a:hover {
color: white;
}
.left-nav #nav .current{
background:#41b8f0;
}
.left-nav #nav li a{
font-size: 14px;
padding: 12px 15px 12px 20px;
display: block;
cursor: pointer;
color:#8e8e8e;
transition:background-color ease .3s;
}
.left-nav #nav li a cite{
font-size: 14px;
}
.left-nav #nav li .sub-menu{
display: none;
}
.left-nav #nav li .opened{
display: block;
background:#454648;
}
.left-nav #nav li .opened:hover{
/*background: #fff url() 0 0 no-repeat;*/
}
.left-nav #nav li .opened .current{
}
.left-nav #nav li .sub-menu li{
background:#181818;
transition:background-color ease .3s
/*color: blue;*/
/*background: #fff url() 0 0 no-repeat;*/
}
.left-nav #nav li .sub-menu li:hover{
background:#303235;
/*color: blue;*/
/*background: #fff url() 0 0 no-repeat;*/
}
.left-nav #nav li .sub-menu li a{
padding: 10px 15px 10px 30px;
font-size: 14px;
cursor: pointer;
color:#8e8e8e;
}
.left-nav #nav li .sub-menu li .sub-menu li a{
padding-left: 45px;
}
/*点击当前菜单显示效果*/
.menu-current {
background:#282b33!important;
}
.menu-current > a{
color:#fff!important;
}
.left-nav #nav li .sub-menu li a:hover{
color: #fff;
}
.left-nav #nav li .sub-menu li a i{
font-size: 12px;
}
.left-nav #nav li a i{
padding-right: 10px;
padding-top:8px;
line-height: 14px;
}
.left-nav #nav li .nav_right{
float: right;
font-size: 16px;
}
.page a:hover{ color:#fff; background:#969696; }
.x-slide_left {
width: 17px;
height: 61px;
background: url(../images/icon.png) 0 0 no-repeat;
position: absolute;
top: 200px;
left: 221px;
cursor: pointer;
z-index: 3;
}
.page-content{
position: absolute;
top: 51px;
right: 0;
bottom: 0px;
left: 221px;
overflow: hidden;
z-index: 1;
}
.page-content-bg{
position: absolute;
top: 46px;
right: 0;
bottom: 42px;
left: 221px;
background: rgba(0,0,0,0.5); url() 0 0 no-repeat;
overflow: hidden;
z-index: 100;
display: none;
}
.page-content .tab{
height: 100%;
width: 100%;
background: #EFEEF0 url() 0 0 no-repeat;
margin: 0px;
}
.page-content .layui-tab-title{
/*padding-top: 5px;*/
height: 35px;
background: #EFEEF0 url() 0 0 no-repeat;
position: relative;
z-index: 100;
}
.page-content .layui-tab-title li.home i{
padding-right: 5px;
}
.page-content .layui-tab-title li.home .layui-tab-close{
display: none;
}
.page-content .layui-tab-title li{
line-height: 35px;
}
.page-content .layui-tab-title .layui-this:after{
height: 36px;
}
.page-content .layui-tab-title li .layui-tab-close{
border-radius: 50%;
}
.page-content .layui-tab-title .layui-this{
background: #fff url() 0 0 no-repeat;
}
.page-content .layui-tab-bar{
height:34px;
line-height: 35px;
}
.page-content .layui-tab-content{
position: absolute;
top: 36px;
bottom: 0px;
width: 100%;
background: #fff url() 0 0 no-repeat;
padding: 0px;
overflow: hidden;
}
.page-content .layui-tab-content .layui-tab-item{
width: 100%;
height: 100%;
}
.page-content .layui-tab-content .layui-tab-item iframe{
width: 100%;
height: 100%;
}
.x-admin-carousel,.layui-carousel,.x-admin-carousel>[carousel-item]>* {
background-color:#fff
}
.x-admin-backlog .x-admin-backlog-body {
display:block;
padding:10px 15px;
background-color:#f8f8f8;
color:#999;
border-radius:2px;
transition:all .3s;
-webkit-transition:all .3s
}
.x-admin-backlog-body h3 {
padding-bottom:10px;
font-size:12px
}
.x-admin-backlog-body p cite {
font-style:normal;
font-size:30px;
font-weight:300;
color:#169f1d;
}
.x-admin-backlog-body:hover {
background-color:#CFCFCF;
color:#888
}
.welcome-footer{padding: 30px 0; line-height: 30px; text-align: center; background-color: #eee; color: #666; font-weight: 300;}
body .layui-layout-admin .footer-demo{height: auto; padding: 15px 0; line-height: 26px;}
.welcome-footer a{padding: 0 5px;}
table th, table td {
word-break: break-all;
}
.footer{
position: fixed;
bottom: 0px;
width: 100%;
background-color: #323436;
text-align:center;
font-size:12px;
border-top: 1px solid rgba(0, 0, 0, 0.1);
line-height: 41px;
color: #666;
/*padding-left: 10px;*/
}
.footer .copyright{
margin-left: 10px;
}
@media screen and (max-width: 768px){
.fast-add{
display: none;
}
.layui-nav .to-index{
display: none;
}
.container .logo a{
width: 140px;
}
.container .left_open {
/*float: right;*/
}
.left-nav{
left: -221px;
}
.page-content{
left: 0px;
}
.page-content .layui-tab-content .layui-tab-item{
-webkit-overflow-scrolling: touch;
overflow-y: scroll;
}
.x-so input.layui-input{
width: 100%;
margin: 10px;
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

@ -0,0 +1,139 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="x-body">
<form class="layui-form">
<div class="layui-form-item">
<label for="username" class="layui-form-label">
<span class="x-red">*</span>登录名
</label>
<div class="layui-input-inline">
<input type="text" id="username" name="username" required lay-verify="required"
autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">
<span class="x-red">*</span>将会成为您唯一的登入名
</div>
</div>
<div class="layui-form-item">
<label for="phone" class="layui-form-label">
<span class="x-red">*</span>手机
</label>
<div class="layui-input-inline">
<input type="text" id="phone" name="phone" required lay-verify="phone"
autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">
<span class="x-red">*</span>将会成为您唯一的登入名
</div>
</div>
<div class="layui-form-item">
<label for="L_email" class="layui-form-label">
<span class="x-red">*</span>邮箱
</label>
<div class="layui-input-inline">
<input type="text" id="L_email" name="email" required lay-verify="email"
autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">
<span class="x-red">*</span>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span class="x-red">*</span>角色</label>
<div class="layui-input-block">
<input type="checkbox" name="like1[write]" lay-skin="primary" title="超级管理员" checked="">
<input type="checkbox" name="like1[read]" lay-skin="primary" title="编辑人员">
<input type="checkbox" name="like1[write]" lay-skin="primary" title="宣传人员" checked="">
</div>
</div>
<div class="layui-form-item">
<label for="L_pass" class="layui-form-label">
<span class="x-red">*</span>密码
</label>
<div class="layui-input-inline">
<input type="password" id="L_pass" name="pass" required lay-verify="pass"
autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">
6到16个字符
</div>
</div>
<div class="layui-form-item">
<label for="L_repass" class="layui-form-label">
<span class="x-red">*</span>确认密码
</label>
<div class="layui-input-inline">
<input type="password" id="L_repass" name="repass" required lay-verify="repass"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="L_repass" class="layui-form-label">
</label>
<button class="layui-btn" lay-filter="add" lay-submit="">
增加
</button>
</div>
</form>
</div>
<script>
layui.use(['form','layer'], function(){
$ = layui.jquery;
var form = layui.form
,layer = layui.layer;
//自定义验证规则
form.verify({
nikename: function(value){
if(value.length < 5){
return '昵称至少得5个字符啊';
}
}
,pass: [/(.+){6,12}$/, '密码必须6到12位']
,repass: function(value){
if($('#L_pass').val()!=$('#L_repass').val()){
return '两次密码不一致';
}
}
});
//监听提交
form.on('submit(add)', function(data){
console.log(data);
//发异步把数据提交给php
layer.alert("增加成功", {icon: 6},function () {
// 获得frame索引
var index = parent.layer.getFrameIndex(window.name);
//关闭当前frame
parent.layer.close(index);
});
return false;
});
});
</script>
</body>
</html>

@ -0,0 +1,148 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="x-nav">
<span class="layui-breadcrumb">
<a href="">首页</a>
<a href="">演示</a>
<a>
<cite>导航元素</cite></a>
</span>
<a class="layui-btn layui-btn-primary layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
<i class="layui-icon" style="line-height:38px"></i></a>
</div>
<div class="x-body">
<div class="layui-row">
<form class="layui-form layui-col-md12 x-so layui-form-pane">
<input class="layui-input" placeholder="分类名" name="cate_name">
<button class="layui-btn" lay-submit="" lay-filter="sreach"><i class="layui-icon"></i>增加</button>
</form>
</div>
<xblock>
<button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>
<span class="x-right" style="line-height:40px">共有数据88 条</span>
</xblock>
<table class="layui-table">
<thead>
<tr>
<th>
<div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
</th>
<th>ID</th>
<th>分类名</th>
<th>操作</th>
</thead>
<tbody>
<tr>
<td>
<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i class="layui-icon">&#xe605;</i></div>
</td>
<td>1</td>
<td>会员相关</td>
<td class="td-manage">
<a title="编辑" onclick="x_admin_show('编辑','admin-edit.html')" href="javascript:;">
<i class="layui-icon">&#xe642;</i>
</a>
<a title="删除" onclick="member_del(this,'要删除的id')" href="javascript:;">
<i class="layui-icon">&#xe640;</i>
</a>
</td>
</tr>
</tbody>
</table>
<div class="page">
<div>
<a class="prev" href="">&lt;&lt;</a>
<a class="num" href="">1</a>
<span class="current">2</span>
<a class="num" href="">3</a>
<a class="num" href="">489</a>
<a class="next" href="">&gt;&gt;</a>
</div>
</div>
</div>
<script>
layui.use('laydate', function(){
var laydate = layui.laydate;
//执行一个laydate实例
laydate.render({
elem: '#start' //指定元素
});
//执行一个laydate实例
laydate.render({
elem: '#end' //指定元素
});
});
/*用户-停用*/
function member_stop(obj,id){
layer.confirm('确认要停用吗?',function(index){
if($(obj).attr('title')=='启用'){
//发异步把用户状态进行更改
$(obj).attr('title','停用')
$(obj).find('i').html('&#xe62f;');
$(obj).parents("tr").find(".td-status").find('span').addClass('layui-btn-disabled').html('已停用');
layer.msg('已停用!',{icon: 5,time:1000});
}else{
$(obj).attr('title','启用')
$(obj).find('i').html('&#xe601;');
$(obj).parents("tr").find(".td-status").find('span').removeClass('layui-btn-disabled').html('已启用');
layer.msg('已启用!',{icon: 5,time:1000});
}
});
}
/*用户-删除*/
function member_del(obj,id){
layer.confirm('确认要删除吗?',function(index){
//发异步删除数据
$(obj).parents("tr").remove();
layer.msg('已删除!',{icon:1,time:1000});
});
}
function delAll (argument) {
var data = tableCheck.getData();
layer.confirm('确认要删除吗?'+data,function(index){
//捉到所有被选中的,发异步进行删除
layer.msg('删除成功', {icon: 1});
$(".layui-form-checked").not('.header').parents('tr').remove();
});
}
</script>
</body>
</html>

@ -0,0 +1,139 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="x-body">
<form class="layui-form">
<div class="layui-form-item">
<label for="username" class="layui-form-label">
<span class="x-red">*</span>登录名
</label>
<div class="layui-input-inline">
<input type="text" id="username" name="username" required lay-verify="required"
autocomplete="off" value="admin" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">
<span class="x-red">*</span>将会成为您唯一的登入名
</div>
</div>
<div class="layui-form-item">
<label for="phone" class="layui-form-label">
<span class="x-red">*</span>手机
</label>
<div class="layui-input-inline">
<input type="text" value="18925139194" id="phone" name="phone" required lay-verify="phone"
autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">
<span class="x-red">*</span>将会成为您唯一的登入名
</div>
</div>
<div class="layui-form-item">
<label for="L_email" class="layui-form-label">
<span class="x-red">*</span>邮箱
</label>
<div class="layui-input-inline">
<input type="text" value="113664000@qq.com" id="L_email" name="email" required lay-verify="email"
autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">
<span class="x-red">*</span>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"><span class="x-red">*</span>角色</label>
<div class="layui-input-block">
<input type="checkbox" name="like1[write]" lay-skin="primary" title="超级管理员" checked="">
<input type="checkbox" name="like1[read]" lay-skin="primary" title="编辑人员">
<input type="checkbox" name="like1[write]" lay-skin="primary" title="宣传人员" >
</div>
</div>
<div class="layui-form-item">
<label for="L_pass" class="layui-form-label">
<span class="x-red">*</span>密码
</label>
<div class="layui-input-inline">
<input type="password" id="L_pass" name="pass" required lay-verify="pass"
autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">
6到16个字符
</div>
</div>
<div class="layui-form-item">
<label for="L_repass" class="layui-form-label">
<span class="x-red">*</span>确认密码
</label>
<div class="layui-input-inline">
<input type="password" id="L_repass" name="repass" required lay-verify="repass"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="L_repass" class="layui-form-label">
</label>
<button class="layui-btn" lay-filter="add" lay-submit="">
增加
</button>
</div>
</form>
</div>
<script>
layui.use(['form','layer'], function(){
$ = layui.jquery;
var form = layui.form
,layer = layui.layer;
//自定义验证规则
form.verify({
nikename: function(value){
if(value.length < 5){
return '昵称至少得5个字符啊';
}
}
,pass: [/(.+){6,12}$/, '密码必须6到12位']
,repass: function(value){
if($('#L_pass').val()!=$('#L_repass').val()){
return '两次密码不一致';
}
}
});
//监听提交
form.on('submit(add)', function(data){
console.log(data);
//发异步把数据提交给php
layer.alert("增加成功", {icon: 6},function () {
// 获得frame索引
var index = parent.layer.getFrameIndex(window.name);
//关闭当前frame
parent.layer.close(index);
});
return false;
});
});
</script>
</body>
</html>

@ -0,0 +1,165 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="x-nav">
<span class="layui-breadcrumb">
<a href="">首页</a>
<a href="">演示</a>
<a>
<cite>导航元素</cite></a>
</span>
<a class="layui-btn layui-btn-primary layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
<i class="layui-icon" style="line-height:38px"></i></a>
</div>
<div class="x-body">
<div class="layui-row">
<form class="layui-form layui-col-md12 x-so">
<input class="layui-input" placeholder="开始日" name="start" id="start">
<input class="layui-input" placeholder="截止日" name="end" id="end">
<input type="text" name="username" placeholder="请输入用户名" autocomplete="off" class="layui-input">
<button class="layui-btn" lay-submit="" lay-filter="sreach"><i class="layui-icon">&#xe615;</i></button>
</form>
</div>
<xblock>
<button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>
<button class="layui-btn" onclick="x_admin_show('添加用户','./admin-add.html')"><i class="layui-icon"></i>添加</button>
<span class="x-right" style="line-height:40px">共有数据88 条</span>
</xblock>
<table class="layui-table">
<thead>
<tr>
<th>
<div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
</th>
<th>ID</th>
<th>登录名</th>
<th>手机</th>
<th>邮箱</th>
<th>角色</th>
<th>加入时间</th>
<th>状态</th>
<th>操作</th>
</thead>
<tbody>
<tr>
<td>
<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i class="layui-icon">&#xe605;</i></div>
</td>
<td>1</td>
<td>admin</td>
<td>18925139194</td>
<td>113664000@qq.com</td>
<td>超级管理员</td>
<td>2017-01-01 11:11:42</td>
<td class="td-status">
<span class="layui-btn layui-btn-normal layui-btn-mini">已启用</span></td>
<td class="td-manage">
<a onclick="member_stop(this,'10001')" href="javascript:;" title="启用">
<i class="layui-icon">&#xe601;</i>
</a>
<a title="编辑" onclick="x_admin_show('编辑','admin-edit.html')" href="javascript:;">
<i class="layui-icon">&#xe642;</i>
</a>
<a title="删除" onclick="member_del(this,'要删除的id')" href="javascript:;">
<i class="layui-icon">&#xe640;</i>
</a>
</td>
</tr>
</tbody>
</table>
<div class="page">
<div>
<a class="prev" href="">&lt;&lt;</a>
<a class="num" href="">1</a>
<span class="current">2</span>
<a class="num" href="">3</a>
<a class="num" href="">489</a>
<a class="next" href="">&gt;&gt;</a>
</div>
</div>
</div>
<script>
layui.use('laydate', function(){
var laydate = layui.laydate;
//执行一个laydate实例
laydate.render({
elem: '#start' //指定元素
});
//执行一个laydate实例
laydate.render({
elem: '#end' //指定元素
});
});
/*用户-停用*/
function member_stop(obj,id){
layer.confirm('确认要停用吗?',function(index){
if($(obj).attr('title')=='启用'){
//发异步把用户状态进行更改
$(obj).attr('title','停用')
$(obj).find('i').html('&#xe62f;');
$(obj).parents("tr").find(".td-status").find('span').addClass('layui-btn-disabled').html('已停用');
layer.msg('已停用!',{icon: 5,time:1000});
}else{
$(obj).attr('title','启用')
$(obj).find('i').html('&#xe601;');
$(obj).parents("tr").find(".td-status").find('span').removeClass('layui-btn-disabled').html('已启用');
layer.msg('已启用!',{icon: 5,time:1000});
}
});
}
/*用户-删除*/
function member_del(obj,id){
layer.confirm('确认要删除吗?',function(index){
//发异步删除数据
$(obj).parents("tr").remove();
layer.msg('已删除!',{icon:1,time:1000});
});
}
function delAll (argument) {
var data = tableCheck.getData();
layer.confirm('确认要删除吗?'+data,function(index){
//捉到所有被选中的,发异步进行删除
layer.msg('删除成功', {icon: 1});
$(".layui-form-checked").not('.header').parents('tr').remove();
});
}
</script>
</body>
</html>

@ -0,0 +1,161 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="x-nav">
<span class="layui-breadcrumb">
<a href="">首页</a>
<a href="">演示</a>
<a>
<cite>导航元素</cite></a>
</span>
<a class="layui-btn layui-btn-primary layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
<i class="layui-icon" style="line-height:38px"></i></a>
</div>
<div class="x-body">
<div class="layui-row">
<form class="layui-form layui-col-md12 x-so">
<input class="layui-input" placeholder="开始日" name="start" id="start">
<input class="layui-input" placeholder="截止日" name="end" id="end">
<input type="text" name="username" placeholder="请输入用户名" autocomplete="off" class="layui-input">
<button class="layui-btn" lay-submit="" lay-filter="sreach"><i class="layui-icon">&#xe615;</i></button>
</form>
</div>
<xblock>
<button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>
<button class="layui-btn" onclick="x_admin_show('添加用户','role-add.html')"><i class="layui-icon"></i>添加</button>
<span class="x-right" style="line-height:40px">共有数据88 条</span>
</xblock>
<table class="layui-table">
<thead>
<tr>
<th>
<div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
</th>
<th>ID</th>
<th>角色名</th>
<th>拥有权限规则</th>
<th>描述</th>
<th>状态</th>
<th>操作</th>
</thead>
<tbody>
<tr>
<td>
<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i class="layui-icon">&#xe605;</i></div>
</td>
<td>1</td>
<td>超级管理员</td>
<td>会员列表,问题列表</td>
<td>具有至高无上的权利</td>
<td class="td-status">
<span class="layui-btn layui-btn-normal layui-btn-mini">已启用</span></td>
<td class="td-manage">
<a onclick="member_stop(this,'10001')" href="javascript:;" title="启用">
<i class="layui-icon">&#xe601;</i>
</a>
<a title="编辑" onclick="x_admin_show('编辑','role-add.html')" href="javascript:;">
<i class="layui-icon">&#xe642;</i>
</a>
<a title="删除" onclick="member_del(this,'要删除的id')" href="javascript:;">
<i class="layui-icon">&#xe640;</i>
</a>
</td>
</tr>
</tbody>
</table>
<div class="page">
<div>
<a class="prev" href="">&lt;&lt;</a>
<a class="num" href="">1</a>
<span class="current">2</span>
<a class="num" href="">3</a>
<a class="num" href="">489</a>
<a class="next" href="">&gt;&gt;</a>
</div>
</div>
</div>
<script>
layui.use('laydate', function(){
var laydate = layui.laydate;
//执行一个laydate实例
laydate.render({
elem: '#start' //指定元素
});
//执行一个laydate实例
laydate.render({
elem: '#end' //指定元素
});
});
/*用户-停用*/
function member_stop(obj,id){
layer.confirm('确认要停用吗?',function(index){
if($(obj).attr('title')=='启用'){
//发异步把用户状态进行更改
$(obj).attr('title','停用')
$(obj).find('i').html('&#xe62f;');
$(obj).parents("tr").find(".td-status").find('span').addClass('layui-btn-disabled').html('已停用');
layer.msg('已停用!',{icon: 5,time:1000});
}else{
$(obj).attr('title','启用')
$(obj).find('i').html('&#xe601;');
$(obj).parents("tr").find(".td-status").find('span').removeClass('layui-btn-disabled').html('已启用');
layer.msg('已启用!',{icon: 5,time:1000});
}
});
}
/*用户-删除*/
function member_del(obj,id){
layer.confirm('确认要删除吗?',function(index){
//发异步删除数据
$(obj).parents("tr").remove();
layer.msg('已删除!',{icon:1,time:1000});
});
}
function delAll (argument) {
var data = tableCheck.getData();
layer.confirm('确认要删除吗?'+data,function(index){
//捉到所有被选中的,发异步进行删除
layer.msg('删除成功', {icon: 1});
$(".layui-form-checked").not('.header').parents('tr').remove();
});
}
</script>
</body>
</html>

@ -0,0 +1,178 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="x-nav">
<span class="layui-breadcrumb">
<a href="">首页</a>
<a href="">演示</a>
<a>
<cite>导航元素88</cite></a>
</span>
<a class="layui-btn layui-btn-primary layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
<i class="layui-icon" style="line-height:38px"></i></a>
</div>
<div class="x-body">
<div class="layui-row">
<form class="layui-form layui-col-md12 x-so layui-form-pane">
<div class="layui-input-inline">
<select name="cateid">
<option>规则分类</option>
<option>文章</option>
<option>会员</option>
<option>权限</option>
</select>
</div>
<div class="layui-input-inline">
<select name="contrller">
<option>请控制器</option>
<option>Index</option>
<option>Goods</option>
<option>Cate</option>
</select>
</div>
<div class="layui-input-inline">
<select name="action">
<option>请方法</option>
<option>add</option>
<option>login</option>
<option>checklogin</option>
</select>
</div>
<input class="layui-input" placeholder="权限名" name="cate_name" >
<button class="layui-btn" lay-submit="" lay-filter="sreach"><i class="layui-icon"></i>增加</button>
</form>
</div>
<xblock>
<button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>
<span class="x-right" style="line-height:40px">共有数据88 条</span>
</xblock>
<table class="layui-table">
<thead>
<tr>
<th>
<div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
</th>
<th>ID</th>
<th>权限规则</th>
<th>权限名称</th>
<th>所属分类</th>
<th>操作</th>
</thead>
<tbody>
<tr>
<td>
<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i class="layui-icon">&#xe605;</i></div>
</td>
<td>1</td>
<td>admin/user/userlist</td>
<td>会员列表</td>
<td>会员相关</td>
<td class="td-manage">
<a title="编辑" onclick="x_admin_show('编辑','xxx.html')" href="javascript:;">
<i class="layui-icon">&#xe642;</i>
</a>
<a title="删除" onclick="member_del(this,'要删除的id')" href="javascript:;">
<i class="layui-icon">&#xe640;</i>
</a>
</td>
</tr>
</tbody>
</table>
<div class="page">
<div>
<a class="prev" href="">&lt;&lt;</a>
<a class="num" href="">1</a>
<span class="current">2</span>
<a class="num" href="">3</a>
<a class="num" href="">489</a>
<a class="next" href="">&gt;&gt;</a>
</div>
</div>
</div>
<script>
layui.use('laydate', function(){
var laydate = layui.laydate;
//执行一个laydate实例
laydate.render({
elem: '#start' //指定元素
});
//执行一个laydate实例
laydate.render({
elem: '#end' //指定元素
});
});
/*用户-停用*/
function member_stop(obj,id){
layer.confirm('确认要停用吗?',function(index){
if($(obj).attr('title')=='启用'){
//发异步把用户状态进行更改
$(obj).attr('title','停用')
$(obj).find('i').html('&#xe62f;');
$(obj).parents("tr").find(".td-status").find('span').addClass('layui-btn-disabled').html('已停用');
layer.msg('已停用!',{icon: 5,time:1000});
}else{
$(obj).attr('title','启用')
$(obj).find('i').html('&#xe601;');
$(obj).parents("tr").find(".td-status").find('span').removeClass('layui-btn-disabled').html('已启用');
layer.msg('已启用!',{icon: 5,time:1000});
}
});
}
/*用户-删除*/
function member_del(obj,id){
layer.confirm('确认要删除吗?',function(index){
//发异步删除数据
$(obj).parents("tr").remove();
layer.msg('已删除!',{icon:1,time:1000});
});
}
function delAll (argument) {
var data = tableCheck.getData();
layer.confirm('确认要删除吗?'+data,function(index){
//捉到所有被选中的,发异步进行删除
layer.msg('删除成功', {icon: 1});
$(".layui-form-checked").not('.header').parents('tr').remove();
});
}
</script>
</body>
</html>

@ -0,0 +1,78 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" type="text/css" href="../lib/layui/css/layui.css">
<link rel="stylesheet" type="text/css" href="../lib/layui/css/global.css">
<style>
.site-doc-icon li{width: 222px;}
.site-doc-icon li .layui-anim{width: 150px; height: 150px; line-height: 150px; margin: 0 auto 10px; text-align: center; background-color: #009688; cursor: pointer; color: #fff; border-radius: 50%;}
</style>
<script src="../js/jquery.min.js"></script>
<script src="../lib/layui/layui.js"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="layui-fluid">
<fieldset class="layui-elem-field layui-field-title mar-t30" >
<legend>动画过程演示</legend>
</fieldset>
<ul class="site-doc-icon site-doc-anim">
<li>
<div class="layui-anim" data-anim="layui-anim-up">从最底部往上滑入</div>
<div class="code">layui-anim-up</div>
</li>
<li>
<div class="layui-anim" data-anim="layui-anim-upbit">微微往上滑入</div>
<div class="code">layui-anim-upbit</div>
</li>
<li>
<div class="layui-anim" data-anim="layui-anim-scale">平滑放大</div>
<div class="code">layui-anim-scale</div>
</li>
<li>
<div class="layui-anim" data-anim="layui-anim-scaleSpring">弹簧式放大</div>
<div class="code">layui-anim-scaleSpring</div>
</li>
</ul>
<ul class="site-doc-icon site-doc-anim">
<li>
<div class="layui-anim" data-anim="layui-anim-fadein">渐现</div>
<div class="code">layui-anim-fadein</div>
</li>
<li>
<div class="layui-anim" data-anim="layui-anim-fadeout">渐隐</div>
<div class="code">layui-anim-fadeout</div>
</li>
<li>
<div class="layui-anim" data-anim="layui-anim-rotate">360度旋转</div>
<div class="code">layui-anim-rotate</div>
</li>
<li>
<div class="layui-anim" data-anim="layui-anim-rotate layui-anim-loop">循环动画</div>
<div class="code">追加layui-anim-loop</div>
</li>
</ul>
<script src="../lib/layui/layui.js"></script>
<!-- 注意如果你直接复制所有代码到本地上述js路径需要改成你本地的 -->
<script>
</script>
</body>
</html>

@ -0,0 +1,303 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>后台登录-L-admin2.0</title>
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="css/font.css">
<link rel="stylesheet" href="css/xadmin.css">
<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script src="lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="js/xadmin.js"></script>
</head>
<body>
<!-- 顶部开始 -->
<div class="container">
<div class="logo"><a href="index.html">L-admin v2.0</a></div>
<div class="left_open">
<i title="展开左侧栏" class="iconfont">&#xe699;</i>
</div>
<ul class="layui-nav left fast-add" lay-filter="">
<li class="layui-nav-item">
<a href="javascript:;">+新增</a>
<dl class="layui-nav-child"> <!-- 二级菜单 -->
<dd><a onclick="x_admin_show('资讯','http://www.baidu.com')"><i class="iconfont">&#xe6a2;</i>资讯</a></dd>
<dd><a onclick="x_admin_show('图片','http://www.baidu.com')"><i class="iconfont">&#xe6a8;</i>图片</a></dd>
<dd><a onclick="x_admin_show('用户','http://www.baidu.com')"><i class="iconfont">&#xe6b8;</i>用户</a></dd>
</dl>
</li>
</ul>
<ul class="layui-nav right" lay-filter="">
<li class="layui-nav-item">
<a href="javascript:;">admin</a>
<dl class="layui-nav-child"> <!-- 二级菜单 -->
<dd><a onclick="x_admin_show('个人信息','http://www.baidu.com')">个人信息</a></dd>
<dd><a onclick="x_admin_show('切换帐号','http://www.baidu.com')">切换帐号</a></dd>
<dd><a href="login.html">退出</a></dd>
</dl>
</li>
<li class="layui-nav-item to-index"><a href="#">前台首页</a></li>
</ul>
</div>
<!-- 顶部结束 -->
<!-- 中部开始 -->
<!-- 左侧菜单开始 -->
<div class="left-nav">
<div id="side-nav">
<ul id="nav">
<li >
<a href="javascript:;">
<i class="iconfont">&#xe6eb;</i>
<cite>主页</cite>
<i class="iconfont nav_right">&#xe6a7;</i>
</a>
<ul class="sub-menu">
<li><a _href="html/welcome.html"><i class="iconfont">&#xe6a7;</i><cite>控制台</cite></a></li >
</ul>
</li>
<li >
<a href="javascript:;">
<i class="iconfont">&#xe6a0;</i>
<cite>基本元素</cite>
<i class="iconfont nav_right">&#xe6a7;</i>
</a>
<ul class="sub-menu">
<li><a _href="html/grid.html"><i class="iconfont">&#xe6a7;</i><cite>栅格</cite></a></li>
<li><a _href="html/unicode.html"><i class="iconfont">&#xe6a7;</i><cite>图标字体</cite></a></li>
<li><a _href="html/form1.html"><i class="iconfont">&#xe6a7;</i><cite>表单元素</cite></a></li>
<li> <a _href="html/form2.html"><i class="iconfont">&#xe6a7;</i><cite>表单组合</cite></a></li>
<li><a _href="html/buttons.html"><i class="iconfont">&#xe6a7;</i><cite>按钮</cite></a></li>
<li><a _href="html/nav.html"><i class="iconfont">&#xe6a7;</i><cite>导航/面包屑</cite></a></li>
<li><a _href="html/tab.html"><i class="iconfont">&#xe6a7;</i><cite>选项卡</cite></a></li>
<li><a _href="html/progress-bar.html"><i class="iconfont">&#xe6a7;</i><cite>进度条</cite></a></li>
<li><a _href="html/panel.html"><i class="iconfont">&#xe6a7;</i><cite>面板</cite></a></li>
<li><a _href="html/badge.html"><i class="iconfont">&#xe6a7;</i><cite>微章</cite></a></li>
<li><a _href="html/timeline.html"><i class="iconfont">&#xe6a7;</i><cite>时间线</cite></a></li>
<li><a _href="html/table-element.html"><i class="iconfont">&#xe6a7;</i><cite>静态表格</cite></a></li>
<li><a _href="html/anim.html"><i class="iconfont">&#xe6a7;</i><cite>动画</cite></a></li>
</ul>
</li>
<li>
<a href="javascript:;">
<i class="iconfont">&#xe74a;</i>
<cite>组件页面</cite>
<i class="iconfont nav_right">&#xe6a7;</i>
</a>
<ul class="sub-menu">
<li>
<a _href="html/upload.html">
<i class="iconfont">&#xe6a7;</i>
<cite>文件上传</cite>
</a>
</li>
<li>
<a _href="html/city.html">
<i class="iconfont">&#xe6a7;</i>
<cite>城市三级联动</cite>
</a>
</li>
<li>
<a _href="html/cate.html">
<i class="iconfont">&#xe6a7;</i>
<cite>多级分类</cite>
</a>
</li>
<li>
<a _href="html/carousel.html">
<i class="iconfont">&#xe6a7;</i>
<cite>轮播图</cite>
</a>
</li>
</ul>
</li>
<li>
<a href="javascript:;">
<i class="iconfont">&#xe69e;</i>
<cite>订单管理</cite>
<i class="iconfont nav_right">&#xe6a7;</i>
</a>
<ul class="sub-menu">
<li>
<a _href="html/order-list.html">
<i class="iconfont">&#xe6a7;</i>
<cite>订单列表</cite>
</a>
</li >
</ul>
</li>
<li>
<a href="javascript:;">
<i class="iconfont">&#xe726;</i>
<cite>管理员管理</cite>
<i class="iconfont nav_right">&#xe6a7;</i>
</a>
<ul class="sub-menu">
<li>
<a _href="html/admin-list.html">
<i class="iconfont">&#xe6a7;</i>
<cite>管理员列表</cite>
</a>
</li >
<li>
<a _href="html/admin-role.html">
<i class="iconfont">&#xe6a7;</i>
<cite>角色管理</cite>
</a>
</li >
<li>
<a _href="html/admin-cate.html">
<i class="iconfont">&#xe6a7;</i>
<cite>权限分类</cite>
</a>
</li >
<li>
<a _href="html/admin-rule.html">
<i class="iconfont">&#xe6a7;</i>
<cite>权限管理</cite>
</a>
</li >
</ul>
</li>
<li>
<a href="javascript:;">
<i class="iconfont">&#xe6b8;</i>
<cite>用户管理</cite>
<i class="iconfont nav_right">&#xe6a7;</i>
</a>
<ul class="sub-menu">
<li>
<a _href="html/member-list.html">
<i class="iconfont">&#xe6a7;</i>
<cite>会员列表</cite>
</a>
</li >
<li>
<a _href="html/member-del.html">
<i class="iconfont">&#xe6a7;</i>
<cite>会员删除</cite>
</a>
</li>
<li>
<a href="javascript:;">
<i class="iconfont">&#xe70b;</i>
<cite>会员管理</cite>
<i class="iconfont nav_right">&#xe6a7;</i>
</a>
<ul class="sub-menu">
<li>
<a _href="html/member-del.html">
<i class="iconfont">&#xe6a7;</i>
<cite>会员列表</cite>
</a>
</li >
<li>
<a _href="html/member-del.html">
<i class="iconfont">&#xe6a7;</i>
<cite>会员删除</cite>
</a>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a href="javascript:;">
<i class="iconfont">&#xe6ce;</i>
<cite>系统统计</cite>
<i class="iconfont nav_right">&#xe6a7;</i>
</a>
<ul class="sub-menu">
<li>
<a _href="html/echarts1.html">
<i class="iconfont">&#xe6a7;</i>
<cite>拆线图</cite>
</a>
</li >
<li>
<a _href="html/echarts2.html">
<i class="iconfont">&#xe6a7;</i>
<cite>柱状图</cite>
</a>
</li>
<li>
<a _href="html/echarts3.html">
<i class="iconfont">&#xe6a7;</i>
<cite>地图</cite>
</a>
</li>
<li>
<a _href="html/echarts4.html">
<i class="iconfont">&#xe6a7;</i>
<cite>饼图</cite>
</a>
</li>
<li>
<a _href="html/echarts5.html">
<i class="iconfont">&#xe6a7;</i>
<cite>雷达图</cite>
</a>
</li>
<li>
<a _href="html/echarts6.html">
<i class="iconfont">&#xe6a7;</i>
<cite>k线图</cite>
</a>
</li>
<li>
<a _href="html/echarts7.html">
<i class="iconfont">&#xe6a7;</i>
<cite>热力图</cite>
</a>
</li>
<li>
<a _href="html/echarts8.html">
<i class="iconfont">&#xe6a7;</i>
<cite>仪表图</cite>
</a>
</li>
</ul>
</li> </ul>
</div>
</div>
<!-- <div class="x-slide_left"></div> -->
<!-- 左侧菜单结束 -->
<!-- 右侧主体开始 -->
<div class="page-content">
<div class="layui-tab tab" lay-filter="xbs_tab" lay-allowclose="false">
<ul class="layui-tab-title">
<li class="home"><i class="layui-icon">&#xe68e;</i>我的桌面</li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">
<iframe src='html/welcome.html' frameborder="0" scrolling="yes" class="x-iframe"></iframe>
</div>
</div>
</div>
</div>
<div class="page-content-bg"></div>
<!-- 右侧主体结束 -->
<!-- 中部结束 -->
<!-- 底部开始 -->
<!--<div class="footer">
<div class="copyright">Copyright ©2019 L-admin v2.3 All Rights Reserved</div>
</div>-->
<!-- 底部结束 -->
</body>
</html>

@ -0,0 +1,89 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" type="text/css" href="../lib/layui/css/layui.css">
<script src="../js/jquery.min.js"></script>
<script src="../lib/layui/layui.js"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class=" layui-fluid">
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>小徽章、大家族</legend>
</fieldset>
<blockquote class="layui-elem-quote layui-quote-nm">
小圆点:
<span class="layui-badge-dot"></span>
<span class="layui-badge-dot layui-bg-orange"></span>
<span class="layui-badge-dot layui-bg-green"></span>
<span class="layui-badge-dot layui-bg-cyan"></span>
<span class="layui-badge-dot layui-bg-blue"></span>
<span class="layui-badge-dot layui-bg-black"></span>
<span class="layui-badge-dot layui-bg-gray"></span>
<br><br>常规弧形徽章:
<span class="layui-badge">6</span>
<span class="layui-badge">99</span>
<span class="layui-badge">61728</span>
<span class="layui-badge"></span>
<span class="layui-badge layui-bg-orange"></span>
<span class="layui-badge layui-bg-green">绿</span>
<span class="layui-badge layui-bg-cyan"></span>
<span class="layui-badge layui-bg-blue"></span>
<span class="layui-badge layui-bg-black"></span>
<span class="layui-badge layui-bg-gray"></span>
<br><br>边框徽章:
<span class="layui-badge-rim">6</span>
<span class="layui-badge-rim">Hot</span>
</blockquote>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>与其它元素的搭配</legend>
</fieldset>
<button class="layui-btn">查看消息<span class="layui-badge layui-bg-gray">1</span></button>
<button class="layui-btn">动态<span class="layui-badge-dot layui-bg-orange"></span></button>
<br><br>
<ul class="layui-nav style="" text-align:="" right;"=""> &lt;-- 小Tips这里有没有发现设置导航靠右对齐或居中对齐其实非常简单 --&gt;
<li class="layui-nav-item">
<a href="">控制台<span class="layui-badge">9</span></a>
</li>
<li class="layui-nav-item">
<a href="">个人中心<span class="layui-badge-dot"></span></a>
</li>
</ul>
<br>
<div class="layui-tab layui-tab-brief">
<ul class="layui-tab-title">
<li class="layui-this">网站设置</li>
<li>用户管理<span class="layui-badge-dot"></span></li>
<li>最新邮件<span class="layui-badge">99+</span></li>
</ul>
<div class="layui-tab-content"></div>
</div>
<script src="../lib/layui/layui.js"></script>
<!-- 注意如果你直接复制所有代码到本地上述js路径需要改成你本地的 -->
</body>
</html>

@ -0,0 +1,188 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script src="../lib/layui/layui.js"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="form-wrap">
<div class="layui-fluid">
<div class="layui-row layui-col-space15">
<div class="layui-col-md6">
<div class="layui-card">
<div class="layui-card-header">按钮主题</div>
<div class="layui-card-body">
<div class="layui-btn-container">
<button class="layui-btn layui-btn-primary">原始按钮</button>
<button class="layui-btn">默认按钮</button>
<button class="layui-btn layui-btn-normal">百搭按钮</button>
<button class="layui-btn layui-btn-warm">暖色按钮</button>
<button class="layui-btn layui-btn-danger">警告按钮</button>
<button class="layui-btn layui-btn-disabled">禁用按钮</button>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">按钮尺寸</div>
<div class="layui-card-body">
<div class="layui-btn-container">
<button class="layui-btn layui-btn-primary layui-btn-lg">大型按钮</button>
<button class="layui-btn layui-btn-primary">默认按钮</button>
<button class="layui-btn layui-btn-primary layui-btn-sm">小型按钮</button>
<button class="layui-btn layui-btn-primary layui-btn-xs">迷你按钮</button>
<br>
<button class="layui-btn layui-btn-lg">大型按钮</button>
<button class="layui-btn">默认按钮</button>
<button class="layui-btn layui-btn-sm">小型按钮</button>
<button class="layui-btn layui-btn-xs">迷你按钮</button>
<br>
<button class="layui-btn layui-btn-lg layui-btn-normal">大型按钮</button>
<button class="layui-btn layui-btn-normal">默认按钮</button>
<button class="layui-btn layui-btn-sm layui-btn-normal">小型按钮</button>
<button class="layui-btn layui-btn-xs layui-btn-normal">迷你按钮</button>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">按钮图标</div>
<div class="layui-card-body">
<div class="layui-btn-container">
<button class="layui-btn"><i class="layui-icon">&#xe600;</i></button>
<button class="layui-btn"><i class="layui-icon">&#xe603;</i></button>
<button class="layui-btn"><i class="layui-icon">&#xe602;</i></button>
<button class="layui-btn"><i class="layui-icon">&#xe642;</i></button>
<button class="layui-btn"><i class="layui-icon">&#xe640;</i></button>
<button class="layui-btn"><i class="layui-icon">&#xe641;</i></button>
<br>
<button class="layui-btn layui-btn-danger"><i class="layui-icon">&#xe600;</i></button>
<button class="layui-btn layui-btn-danger"><i class="layui-icon">&#xe603;</i></button>
<button class="layui-btn layui-btn-danger"><i class="layui-icon">&#xe602;</i></button>
<button class="layui-btn layui-btn-danger"><i class="layui-icon">&#xe642;</i></button>
<button class="layui-btn layui-btn-danger"><i class="layui-icon">&#xe640;</i></button>
<button class="layui-btn layui-btn-danger"><i class="layui-icon">&#xe641;</i></button>
<br>
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon">&#xe600;</i></button>
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon">&#xe603;</i></button>
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon">&#xe602;</i></button>
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon">&#xe642;</i></button>
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon">&#xe640;</i></button>
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon">&#xe641;</i></button>
<br>
<button class="layui-btn layui-btn-sm"><i class="layui-icon">&#xe600;</i></button>
<button class="layui-btn layui-btn-sm"><i class="layui-icon">&#xe603;</i></button>
<button class="layui-btn layui-btn-sm"><i class="layui-icon">&#xe602;</i></button>
<button class="layui-btn layui-btn-sm"><i class="layui-icon">&#xe642;</i></button>
<button class="layui-btn layui-btn-sm"><i class="layui-icon">&#xe640;</i></button>
<button class="layui-btn layui-btn-sm"><i class="layui-icon">&#xe641;</i></button>
<br>
<button class="layui-btn layui-btn-normal layui-btn-sm"><i class="layui-icon">&#xe600;</i></button>
<button class="layui-btn layui-btn-normal layui-btn-sm"><i class="layui-icon">&#xe603;</i></button>
<button class="layui-btn layui-btn-normal layui-btn-sm"><i class="layui-icon">&#xe602;</i></button>
<button class="layui-btn layui-btn-normal layui-btn-sm"><i class="layui-icon">&#xe642;</i></button>
<button class="layui-btn layui-btn-normal layui-btn-sm"><i class="layui-icon">&#xe640;</i></button>
<button class="layui-btn layui-btn-normal layui-btn-sm"><i class="layui-icon">&#xe641;</i></button>
</div>
</div>
</div>
</div>
<div class="layui-col-md6">
<div class="layui-card">
<div class="layui-card-header">按钮圆角</div>
<div class="layui-card-body">
<div class="layui-btn-container">
<button class="layui-btn layui-btn-primary layui-btn-radius">原始按钮</button>
<button class="layui-btn layui-btn-radius">默认按钮</button>
<button class="layui-btn layui-btn-normal layui-btn-radius">百搭按钮</button>
<button class="layui-btn layui-btn-warm layui-btn-radius">暖色按钮</button>
<button class="layui-btn layui-btn-danger layui-btn-radius">警告按钮</button>
<button class="layui-btn layui-btn-disabled layui-btn-radius">禁用按钮</button>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">按钮混搭</div>
<div class="layui-card-body">
<div class="layui-btn-container">
<button class="layui-btn layui-btn-lg layui-btn-primary layui-btn-radius">大型加圆角</button>
<a href="http://www.layui.com/doc/element/button.html" class="layui-btn" target="_blank">跳转的按钮</a>
<button class="layui-btn layui-btn-sm layui-btn-normal"><i class="layui-icon">&#xe640;</i> 删除</button>
<button class="layui-btn layui-btn-xs layui-btn-disabled"><i class="layui-icon">&#xe641;</i> 分享</button>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">按钮组合</div>
<div class="layui-card-body">
<div class="layui-btn-container">
<div class="layui-btn-group">
<button class="layui-btn">增加</button>
<button class="layui-btn ">编辑</button>
<button class="layui-btn">删除</button>
</div>
</div>
<div class="layui-btn-container">
<div class="layui-btn-group">
<button class="layui-btn layui-btn-sm"><i class="layui-icon">&#xe654;</i></button>
<button class="layui-btn layui-btn-sm"><i class="layui-icon">&#xe642;</i></button>
<button class="layui-btn layui-btn-sm"><i class="layui-icon">&#xe640;</i></button>
<button class="layui-btn layui-btn-sm"><i class="layui-icon">&#xe602;</i></button>
</div>
<div class="layui-btn-group">
<button class="layui-btn layui-btn-primary layui-btn-sm">文字</button>
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon">&#xe654;</i></button>
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon">&#xe642;</i></button>
<button class="layui-btn layui-btn-primary layui-btn-sm"><i class="layui-icon">&#xe640;</i></button>
</div>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">按钮铺满</div>
<div class="layui-card-body">
<div class="layui-btn-container">
<button class="layui-btn layui-btn-fluid">好雨知时节</button>
<button class="layui-btn layui-btn-fluid">当春乃发生</button>
<button class="layui-btn layui-btn-fluid">随风潜入夜</button>
<button class="layui-btn layui-btn-fluid">润物细无声</button>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>

@ -0,0 +1,202 @@
<!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 name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<style>img{ width:100%; height:auto;}</style>
<link rel="stylesheet" href="../css/xadmin.css">
<link rel="stylesheet" type="text/css" href="../lib/layui/css/layui.css">
<!-- 注意如果你直接复制所有代码到本地上述css路径需要改成你本地的 -->
</head>
<body class="form-wrap">
<div class="layui-fluid">
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>常规轮播</legend>
</fieldset>
<div class="layui-carousel" id="test1" lay-filter="test1">
<div carousel-item="">
<div class="layui-bg-gray">条目1</div>
<div class="layui-bg-green">条目2</div>
<div class="layui-bg-gray">条目3</div>
<div class="layui-bg-gray">条目4</div>
</div>
</div>
<div class="layui-carousel" id="test2" style="margin-top: 15px;">
<div carousel-item="">
<div class="layui-bg-gray">条目1</div>
<div class="layui-bg-gray">条目2</div>
</div>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>设定各种参数</legend>
</fieldset>
<div class="layui-form">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">宽高</label>
<div class="layui-input-inline" style="width: 98px;">
<input type="tel" name="width" value="600" autocomplete="off" placeholder="width" class="layui-input demoSet">
</div>
<div class="layui-input-inline" style="width: 98px;">
<input type="tel" name="height" value="280" autocomplete="off" placeholder="height" class="layui-input demoSet">
</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">动画类型</label>
<div class="layui-input-block">
<div class="layui-btn-group demoTest" style="margin-top: 5px;">
<button class="layui-btn layui-btn-sm" style="background-color: #5FB878;" data-type="set" data-key="anim" data-value="default">左右切换</button>
<button class="layui-btn layui-btn-sm" data-type="set" data-key="anim" data-value="updown">上下切换</button>
<button class="layui-btn layui-btn-sm" data-type="set" data-key="anim" data-value="fade">渐隐渐显</button>
</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">箭头状态</label>
<div class="layui-input-block">
<div class="layui-btn-group demoTest" style="margin-top: 5px;">
<button class="layui-btn layui-btn-sm" style="background-color: #5FB878;" data-type="set" data-key="arrow" data-value="hover">悬停显示</button>
<button class="layui-btn layui-btn-sm" data-type="set" data-key="arrow" data-value="always">始终显示</button>
<button class="layui-btn layui-btn-sm" data-type="set" data-key="arrow" data-value="none">不显示</button>
</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">指示器位置</label>
<div class="layui-input-block">
<div class="layui-btn-group demoTest" style="margin-top: 5px;">
<button class="layui-btn layui-btn-sm" style="background-color: #5FB878;" data-key="indicator" data-type="set" data-value="inside">容器内部</button>
<button class="layui-btn layui-btn-sm" data-type="set" data-key="indicator" data-value="outside">容器外部</button>
<button class="layui-btn layui-btn-sm" data-type="set" data-key="indicator" data-value="none">不显示</button>
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">自动切换</label>
<div class="layui-input-block">
<input type="checkbox" name="switch" lay-skin="switch" checked="" lay-text="ON|OFF" lay-filter="autoplay">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label" style="width: auto;">时间间隔</label>
<div class="layui-input-inline" style="width: 120px;">
<input type="tel" name="interval" value="3000" autocomplete="off" placeholder="毫秒" class="layui-input demoSet">
</div>
</div>
</div>
</div>
<div class="layui-carousel" id="test3" lay-filter="test4">
<div carousel-item="">
<div class="layui-bg-gray">条目1</div>
<div class="layui-bg-gray">条目2</div>
<div class="layui-bg-gray">条目3</div>
<div class="layui-bg-gray">条目4</div>
<div class="layui-bg-gray">条目5</div>
</div>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>填充轮播元素 - 以图片为例</legend>
</fieldset>
<div class="layui-carousel" id="test10">
<div carousel-item="">
<div><img src="../images/pic/1.png" ></div>
<div><img src="../images/pic/2.png" ></div>
<div><img src="../images/pic/3.png" ></div>
</div>
</div>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<!-- 注意如果你直接复制所有代码到本地上述js路径需要改成你本地的 -->
<script>
layui.use(['carousel', 'form'], function(){
var carousel = layui.carousel
,form = layui.form;
//常规轮播
carousel.render({
elem: '#test1'
,arrow: 'always'
});
//改变下时间间隔、动画类型、高度
carousel.render({
elem: '#test2'
,interval: 1800
,anim: 'fade'
,height: '120px'
});
//设定各种参数
var ins3 = carousel.render({
elem: '#test3'
});
//图片轮播
carousel.render({
elem: '#test10'
,width: '800px'
,height: '440px'
,interval: 5000
});
//事件
carousel.on('change(test4)', function(res){
console.log(res)
});
var $ = layui.$, active = {
set: function(othis){
var THIS = 'layui-bg-normal'
,key = othis.data('key')
,options = {};
othis.css('background-color', '#5FB878').siblings().removeAttr('style');
options[key] = othis.data('value');
ins3.reload(options);
}
};
//监听开关
form.on('switch(autoplay)', function(){
ins3.reload({
autoplay: this.checked
});
});
$('.demoSet').on('keyup', function(){
var value = this.value
,options = {};
if(!/^\d+$/.test(value)) return;
options[this.name] = value;
ins3.reload(options);
});
//其它示例
$('.demoTest .layui-btn').on('click', function(){
var othis = $(this), type = othis.data('type');
active[type] ? active[type].call(this, othis) : '';
});
});
</script>
</div>
</body>
</html>

@ -0,0 +1,231 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="x-nav">
<span class="layui-breadcrumb">
<a href="">首页</a>
<a href="">演示</a>
<a>
<cite>导航元素</cite></a>
</span>
<a class="layui-btn layui-btn-primary layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
<i class="layui-icon" style="line-height:38px"></i></a>
</div>
<div class="x-body">
<div class="layui-row">
<form class="layui-form layui-col-md12 x-so layui-form-pane">
<input class="layui-input" placeholder="分类名" name="cate_name">
<button class="layui-btn" lay-submit="" lay-filter="sreach"><i class="layui-icon"></i>增加</button>
</form>
</div>
<blockquote class="layui-elem-quote">每个tr 上有两个属性 cate-id='1' 当前分类id fid='0' 父级id ,顶级分类为 0有子分类的前面加收缩图标<i class="layui-icon x-show" status='true'>&#xe623;</i></blockquote>
<xblock>
<button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>
<span class="x-right" style="line-height:40px">共有数据88 条</span>
</xblock>
<table class="layui-table layui-form">
<thead>
<tr>
<th width="20">
<div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
</th>
<th width="70">ID</th>
<th>栏目名</th>
<th width="50">排序</th>
<th width="50">状态</th>
<th width="280">操作</th>
</thead>
<tbody class="x-cate">
<tr cate-id='1' fid='0' >
<td>
<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i class="layui-icon">&#xe605;</i></div>
</td>
<td>1</td>
<td>
<i class="layui-icon x-show" status='true'>&#xe623;</i>
产品管理
</td>
<td><input type="text" class="layui-input x-sort" name="order" value="1"></td>
<td>
<input type="checkbox" name="switch" lay-text="开启|停用" checked="" lay-skin="switch">
</td>
<td class="td-manage">
<button class="layui-btn layui-btn layui-btn-xs" onclick="x_admin_show('编辑','admin-edit.html')" ><i class="layui-icon">&#xe642;</i>编辑</button>
<button class="layui-btn layui-btn-warm layui-btn-xs" onclick="x_admin_show('编辑','admin-edit.html')" ><i class="layui-icon">&#xe642;</i>添加子栏目</button>
<button class="layui-btn-danger layui-btn layui-btn-xs" onclick="member_del(this,'要删除的id')" href="javascript:;" ><i class="layui-icon">&#xe640;</i>删除</button>
</td>
</tr>
<tr cate-id='2' fid='1' >
<td>
<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i class="layui-icon">&#xe605;</i></div>
</td>
<td>2</td>
<td>
&nbsp;&nbsp;&nbsp;&nbsp;
<i class="layui-icon x-show" status='true'>&#xe623;</i>
产品列表
</td>
<td><input type="text" class="layui-input x-sort" name="order" value="1"></td>
<td>
<input type="checkbox" name="switch" lay-text="开启|停用" checked="" lay-skin="switch">
</td>
<td class="td-manage">
<button class="layui-btn layui-btn layui-btn-xs" onclick="x_admin_show('编辑','admin-edit.html')" ><i class="layui-icon">&#xe642;</i>编辑</button>
<button class="layui-btn layui-btn-warm layui-btn-xs" onclick="x_admin_show('编辑','admin-edit.html')" ><i class="layui-icon">&#xe642;</i>添加子栏目</button>
<button class="layui-btn-danger layui-btn layui-btn-xs" onclick="member_del(this,'要删除的id')" href="javascript:;" ><i class="layui-icon">&#xe640;</i>删除</button>
</td>
</tr>
<tr cate-id='3' fid='2' >
<td>
<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i class="layui-icon">&#xe605;</i></div>
</td>
<td>3</td>
<td>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
├产品列表
</td>
<td><input type="text" class="layui-input x-sort" name="order" value="1"></td>
<td>
<input type="checkbox" name="switch" lay-text="开启|停用" checked="" lay-skin="switch">
</td>
<td class="td-manage">
<button class="layui-btn layui-btn layui-btn-xs" onclick="x_admin_show('编辑','admin-edit.html')" ><i class="layui-icon">&#xe642;</i>编辑</button>
<button class="layui-btn layui-btn-warm layui-btn-xs" onclick="x_admin_show('编辑','admin-edit.html')" ><i class="layui-icon">&#xe642;</i>添加子栏目</button>
<button class="layui-btn-danger layui-btn layui-btn-xs" onclick="member_del(this,'要删除的id')" href="javascript:;" ><i class="layui-icon">&#xe640;</i>删除</button>
</td>
</tr>
<tr cate-id='4' fid='2' >
<td>
<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i class="layui-icon">&#xe605;</i></div>
</td>
<td>4</td>
<td>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
├产品列表
</td>
<td><input type="text" class="layui-input x-sort" name="order" value="1"></td>
<td>
<input type="checkbox" name="switch" lay-text="开启|停用" checked="" lay-skin="switch">
</td>
<td class="td-manage">
<button class="layui-btn layui-btn layui-btn-xs" onclick="x_admin_show('编辑','admin-edit.html')" ><i class="layui-icon">&#xe642;</i>编辑</button>
<button class="layui-btn layui-btn-warm layui-btn-xs" onclick="x_admin_show('编辑','admin-edit.html')" ><i class="layui-icon">&#xe642;</i>添加子栏目</button>
<button class="layui-btn-danger layui-btn layui-btn-xs" onclick="member_del(this,'要删除的id')" href="javascript:;" ><i class="layui-icon">&#xe640;</i>删除</button>
</td>
</tr>
<tr cate-id='5' fid='0' >
<td>
<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i class="layui-icon">&#xe605;</i></div>
</td>
<td>5</td>
<td>
<i class="layui-icon x-show" status='true'>&#xe623;</i>新闻
</td>
<td><input type="text" class="layui-input x-sort" name="order" value="1"></td>
<td>
<input type="checkbox" name="switch" lay-text="开启|停用" checked="" lay-skin="switch">
</td>
<td class="td-manage">
<button class="layui-btn layui-btn layui-btn-xs" onclick="x_admin_show('编辑','admin-edit.html')" ><i class="layui-icon">&#xe642;</i>编辑</button>
<button class="layui-btn layui-btn-warm layui-btn-xs" onclick="x_admin_show('编辑','admin-edit.html')" ><i class="layui-icon">&#xe642;</i>添加子栏目</button>
<button class="layui-btn-danger layui-btn layui-btn-xs" onclick="member_del(this,'要删除的id')" href="javascript:;" ><i class="layui-icon">&#xe640;</i>删除</button>
</td>
</tr>
<tr cate-id='6' fid='5' >
<td>
<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i class="layui-icon">&#xe605;</i></div>
</td>
<td>6</td>
<td>
&nbsp;&nbsp;&nbsp;&nbsp;
├国内新闻
</td>
<td><input type="text" class="layui-input x-sort" name="order" value="1"></td>
<td>
<input type="checkbox" name="switch" lay-text="开启|停用" checked="" lay-skin="switch">
</td>
<td class="td-manage">
<button class="layui-btn layui-btn layui-btn-xs" onclick="x_admin_show('编辑','admin-edit.html')" ><i class="layui-icon">&#xe642;</i>编辑</button>
<button class="layui-btn layui-btn-warm layui-btn-xs" onclick="x_admin_show('编辑','admin-edit.html')" ><i class="layui-icon">&#xe642;</i>添加子栏目</button>
<button class="layui-btn-danger layui-btn layui-btn-xs" onclick="member_del(this,'要删除的id')" href="javascript:;" ><i class="layui-icon">&#xe640;</i>删除</button>
</td>
</tr>
<tr cate-id='7' fid='5' >
<td>
<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i class="layui-icon">&#xe605;</i></div>
</td>
<td>7</td>
<td>
&nbsp;&nbsp;&nbsp;&nbsp;
├国外新闻
</td>
<td><input type="text" class="layui-input x-sort" name="order" value="1"></td>
<td>
<input type="checkbox" name="switch" lay-text="开启|停用" checked="" lay-skin="switch">
</td>
<td class="td-manage">
<button class="layui-btn layui-btn layui-btn-xs" onclick="x_admin_show('编辑','admin-edit.html')" ><i class="layui-icon">&#xe642;</i>编辑</button>
<button class="layui-btn layui-btn-warm layui-btn-xs" onclick="x_admin_show('编辑','admin-edit.html')" ><i class="layui-icon">&#xe642;</i>添加子栏目</button>
<button class="layui-btn-danger layui-btn layui-btn-xs" onclick="member_del(this,'要删除的id')" href="javascript:;" ><i class="layui-icon">&#xe640;</i>删除</button>
</td>
</tr>
</tbody>
</table>
</div>
<style type="text/css">
</style>
<script>
layui.use(['form'], function(){
form = layui.form;
});
/*用户-删除*/
function member_del(obj,id){
layer.confirm('确认要删除吗?',function(index){
//发异步删除数据
$(obj).parents("tr").remove();
layer.msg('已删除!',{icon:1,time:1000});
});
}
function delAll (argument) {
var data = tableCheck.getData();
layer.confirm('确认要删除吗?'+data,function(index){
//捉到所有被选中的,发异步进行删除
layer.msg('删除成功', {icon: 1});
$(".layui-form-checked").not('.header').parents('tr').remove();
});
}
</script>
</body>
</html>

@ -0,0 +1,81 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="x-nav">
<span class="layui-breadcrumb">
<a href="">首页</a>
<a href="">演示</a>
<a>
<cite>导航元素</cite></a>
</span>
<a class="layui-btn layui-btn-primary layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
<i class="layui-icon" style="line-height:38px"></i></a>
</div>
<div class="x-body">
<div class="layui-row">
<form class="layui-form layui-col-md12 layui-form-pane">
<div class="layui-form-item" id="x-city">
<label class="layui-form-label">城市联动</label>
<div class="layui-input-inline">
<select name="province" lay-filter="province">
<option value="">请选择省</option>
</select>
</div>
<div class="layui-input-inline">
<select name="city" lay-filter="city">
<option value="">请选择市</option>
</select>
</div>
<div class="layui-input-inline">
<select name="area" lay-filter="area">
<option value="">请选择县/区</option>
</select>
</div>
</div>
</form>
</div>
<blockquote class="layui-elem-quote"> </blockquote>
<pre class="layui-code" lay-title="JavaScript" lay-skin="notepad">
//xcity城市插件 基于于jquery与layui form 模块,使用之前先确认这两者是否引入
//插件文件为 xcity.js,引入
select lay-filter 属性值 为必须 "province/city/area"
//初始化
$('#x-city').xcity();
//传默认值
$('#x-city').xcity('广东','广州市','东山区');
</pre>
</div>
<script type="text/javascript" src="../js/xcity.js"></script>
<script>
layui.use(['form','code'], function(){
form = layui.form;
layui.code();
$('#x-city').xcity('广东','广州市','东山区');
});
</script>
</body>
</html>

@ -0,0 +1,183 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" type="text/css" href="../lib/layui/css/global.css">
<link rel="stylesheet" type="text/css" href="../lib/layui/css/layui.css">
<link rel="stylesheet" href="../css/font.css">
<script src="../js/jquery.min.js"></script>
<script src="../lib/layui/layui.js"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class=" layui-fluid"><fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>基础效果</legend>
</fieldset>
<div id="test1"></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>显示文字</legend>
</fieldset>
<div id="test2"></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>半星效果</legend>
</fieldset>
<div id="test3"></div>
<div><div id="test4"></div></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>自定义内容</legend>
</fieldset>
<div id="test5"></div>
<div><div id="test6"></div></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>自定义长度</legend>
</fieldset>
<div id="test7"></div>
<div><div id="test8"></div></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>只读</legend>
</fieldset>
<div id="test9"></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>自定义主题色</legend>
</fieldset>
<ul>
<li><div id="test10"></div></li>
<li><div id="test11"></div></li>
<li><div id="test12"></div></li>
<li><div id="test13"></div></li>
<li><div id="test14"></div></li>
</ul>
<script src="../lib/layui/layui.js"></script>
<!-- 注意如果你直接复制所有代码到本地上述js路径需要改成你本地的 -->
<script>
layui.use(['rate'], function(){
var rate = layui.rate;
//基础效果
rate.render({
elem: '#test1'
})
//显示文字
rate.render({
elem: '#test2'
,value: 2 //初始值
,text: true //开启文本
});
//半星效果
rate.render({
elem: '#test3'
,value: 2.5 //初始值
,half: true //开启半星
})
rate.render({
elem: '#test4'
,value: 3.5
,half: true
,text: true
})
//自定义文本
rate.render({
elem: '#test5'
,value: 3
,text: true
,setText: function(value){ //自定义文本的回调
var arrs = {
'1': '极差'
,'2': '差'
,'3': '中等'
,'4': '好'
,'5': '极好'
};
this.span.text(arrs[value] || ( value + "星"));
}
})
rate.render({
elem: '#test6'
,value: 1.5
,half: true
,text: true
,setText: function(value){
this.span.text(value);
}
})
//自定义长度
rate.render({
elem: '#test7'
,length: 3
});
rate.render({
elem: '#test8'
,length: 10
,value: 8 //初始值
});
//只读
rate.render({
elem: '#test9'
,value: 4
,readonly: true
});
//主题色
rate.render({
elem: '#test10'
,value: 3
,theme: '#FF8000' //自定义主题色
});
rate.render({
elem: '#test11'
,value: 3
,theme: '#009688'
});
rate.render({
elem: '#test12'
,value: 2.5
,half: true
,theme: '#1E9FFF'
})
rate.render({
elem: '#test13'
,value: 2.5
,half: true
,theme: '#2F4056'
});
rate.render({
elem: '#test14'
,value: 2.5
,half: true
,theme: '#FE0000'
})
});
</script></body>
</html>

@ -0,0 +1,101 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>后台登录-X-admin2.0</title>
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
</head>
<body>
<div class="x-body">
<blockquote class="layui-elem-quote">
特别声明ECharts一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上兼容当前绝大部分浏览器IE8/9/10/11ChromeFirefoxSafari等底层依赖轻量级的 Canvas 类库 ZRender提供直观生动可交互可高度个性化定制的数据可视化图表。如需使用详细了解可以访问官网 <a href="http://echarts.baidu.com/" style="color:red">ECharts</a>。 x-admin不承担任何版权问题。
</blockquote>
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM -->
<div id="main" style="width: 100%;height:400px;"></div>
<blockquote class="layui-elem-quote">
注意本案例的Echarts图表库由cdn引入需要在线才能正常使用如想离想请至Echarts官网下载。
</blockquote>
</div>
<script src="https://cdn.bootcss.com/echarts/3.7.0/echarts.min.js"></script>
<script type="text/javascript">
// 基于准备好的dom初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
// 指定图表的配置项和数据
var option = {
title: {
text: '折线图堆叠'
},
tooltip: {
trigger: 'axis'
},
legend: {
data:['邮件营销','联盟广告','视频广告','直接访问','搜索引擎']
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
toolbox: {
feature: {
saveAsImage: {}
}
},
xAxis: {
type: 'category',
boundaryGap: false,
data: ['周一','周二','周三','周四','周五','周六','周日']
},
yAxis: {
type: 'value'
},
series: [
{
name:'邮件营销',
type:'line',
stack: '总量',
data:[120, 132, 101, 134, 90, 230, 210]
},
{
name:'联盟广告',
type:'line',
stack: '总量',
data:[220, 182, 191, 234, 290, 330, 310]
},
{
name:'视频广告',
type:'line',
stack: '总量',
data:[150, 232, 201, 154, 190, 330, 410]
},
{
name:'直接访问',
type:'line',
stack: '总量',
data:[320, 332, 301, 334, 390, 330, 320]
},
{
name:'搜索引擎',
type:'line',
stack: '总量',
data:[820, 932, 901, 934, 1290, 1330, 1320]
}
]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
</script>
</body>
</html>

@ -0,0 +1,99 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>后台登录-X-admin2.0</title>
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
</head>
<body>
<div class="x-body">
<blockquote class="layui-elem-quote">
特别声明ECharts一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上兼容当前绝大部分浏览器IE8/9/10/11ChromeFirefoxSafari等底层依赖轻量级的 Canvas 类库 ZRender提供直观生动可交互可高度个性化定制的数据可视化图表。如需使用或者详细更多案例可以访问官网 <a href="http://echarts.baidu.com/" style="color:red">ECharts</a>。 x-admin不承担任何版权问题。
</blockquote>
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM -->
<div id="main" style="width: 100%;height:400px;"></div>
<blockquote class="layui-elem-quote">
注意本案例的Echarts图表库由cdn引入需要在线才能正常使用如想离想请至Echarts官网下载。
</blockquote>
</div>
<script src="https://cdn.bootcss.com/echarts/3.7.0/echarts.min.js"></script>
<script type="text/javascript">
// 基于准备好的dom初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
// 指定图表的配置项和数据
var labelRight = {
normal: {
position: 'right'
}
};
option = {
title: {
text: '交错正负轴标签',
subtext: 'From ExcelHome',
sublink: 'http://e.weibo.com/1341556070/AjwF2AgQm'
},
tooltip : {
trigger: 'axis',
axisPointer : { // 坐标轴指示器,坐标轴触发有效
type : 'shadow' // 默认为直线,可选为:'line' | 'shadow'
}
},
grid: {
top: 80,
bottom: 30
},
xAxis: {
type : 'value',
position: 'top',
splitLine: {lineStyle:{type:'dashed'}},
},
yAxis: {
type : 'category',
axisLine: {show: false},
axisLabel: {show: false},
axisTick: {show: false},
splitLine: {show: false},
data : ['ten', 'nine', 'eight', 'seven', 'six', 'five', 'four', 'three', 'two', 'one']
},
series : [
{
name:'生活费',
type:'bar',
stack: '总量',
label: {
normal: {
show: true,
formatter: '{b}'
}
},
data:[
{value: -0.07, label: labelRight},
{value: -0.09, label: labelRight},
0.2, 0.44,
{value: -0.23, label: labelRight},
0.08,
{value: -0.17, label: labelRight},
0.47,
{value: -0.36, label: labelRight},
0.18
]
}
]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
</script>
</body>
</html>

@ -0,0 +1,341 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>后台登录-X-admin2.0</title>
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
</head>
<body>
<div class="x-body">
<blockquote class="layui-elem-quote">
特别声明ECharts一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上兼容当前绝大部分浏览器IE8/9/10/11ChromeFirefoxSafari等底层依赖轻量级的 Canvas 类库 ZRender提供直观生动可交互可高度个性化定制的数据可视化图表。如需使用或者详细更多案例可以访问官网 <a href="http://echarts.baidu.com/" style="color:red">ECharts</a>。 x-admin不承担任何版权问题。
</blockquote>
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM -->
<div id="main" style="width: 100%;height:400px;"></div>
<blockquote class="layui-elem-quote">
注意本案例的Echarts图表库由cdn引入需要在线才能正常使用如想离想请至Echarts官网下载。
</blockquote>
</div>
<script src="https://cdn.bootcss.com/echarts/3.7.0/echarts.min.js"></script>
<script src="../js/echarts/bmap.min.js"></script>
<script src="http://echarts.baidu.com/asset/map/js/china.js"></script>
<script type="text/javascript">
// 基于准备好的dom初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
myChart.setOption({
series: [{
type: 'map',
map: 'china'
}]
});
// 指定图表的配置项和数据
var geoCoordMap = {
'上海': [121.4648,31.2891],
'东莞': [113.8953,22.901],
'东营': [118.7073,37.5513],
'中山': [113.4229,22.478],
'临汾': [111.4783,36.1615],
'临沂': [118.3118,35.2936],
'丹东': [124.541,40.4242],
'丽水': [119.5642,28.1854],
'乌鲁木齐': [87.9236,43.5883],
'佛山': [112.8955,23.1097],
'保定': [115.0488,39.0948],
'兰州': [103.5901,36.3043],
'包头': [110.3467,41.4899],
'北京': [116.4551,40.2539],
'北海': [109.314,21.6211],
'南京': [118.8062,31.9208],
'南宁': [108.479,23.1152],
'南昌': [116.0046,28.6633],
'南通': [121.1023,32.1625],
'厦门': [118.1689,24.6478],
'台州': [121.1353,28.6688],
'合肥': [117.29,32.0581],
'呼和浩特': [111.4124,40.4901],
'咸阳': [108.4131,34.8706],
'哈尔滨': [127.9688,45.368],
'唐山': [118.4766,39.6826],
'嘉兴': [120.9155,30.6354],
'大同': [113.7854,39.8035],
'大连': [122.2229,39.4409],
'天津': [117.4219,39.4189],
'太原': [112.3352,37.9413],
'威海': [121.9482,37.1393],
'宁波': [121.5967,29.6466],
'宝鸡': [107.1826,34.3433],
'宿迁': [118.5535,33.7775],
'常州': [119.4543,31.5582],
'广州': [113.5107,23.2196],
'廊坊': [116.521,39.0509],
'延安': [109.1052,36.4252],
'张家口': [115.1477,40.8527],
'徐州': [117.5208,34.3268],
'德州': [116.6858,37.2107],
'惠州': [114.6204,23.1647],
'成都': [103.9526,30.7617],
'扬州': [119.4653,32.8162],
'承德': [117.5757,41.4075],
'拉萨': [91.1865,30.1465],
'无锡': [120.3442,31.5527],
'日照': [119.2786,35.5023],
'昆明': [102.9199,25.4663],
'杭州': [119.5313,29.8773],
'枣庄': [117.323,34.8926],
'柳州': [109.3799,24.9774],
'株洲': [113.5327,27.0319],
'武汉': [114.3896,30.6628],
'汕头': [117.1692,23.3405],
'江门': [112.6318,22.1484],
'沈阳': [123.1238,42.1216],
'沧州': [116.8286,38.2104],
'河源': [114.917,23.9722],
'泉州': [118.3228,25.1147],
'泰安': [117.0264,36.0516],
'泰州': [120.0586,32.5525],
'济南': [117.1582,36.8701],
'济宁': [116.8286,35.3375],
'海口': [110.3893,19.8516],
'淄博': [118.0371,36.6064],
'淮安': [118.927,33.4039],
'深圳': [114.5435,22.5439],
'清远': [112.9175,24.3292],
'温州': [120.498,27.8119],
'渭南': [109.7864,35.0299],
'湖州': [119.8608,30.7782],
'湘潭': [112.5439,27.7075],
'滨州': [117.8174,37.4963],
'潍坊': [119.0918,36.524],
'烟台': [120.7397,37.5128],
'玉溪': [101.9312,23.8898],
'珠海': [113.7305,22.1155],
'盐城': [120.2234,33.5577],
'盘锦': [121.9482,41.0449],
'石家庄': [114.4995,38.1006],
'福州': [119.4543,25.9222],
'秦皇岛': [119.2126,40.0232],
'绍兴': [120.564,29.7565],
'聊城': [115.9167,36.4032],
'肇庆': [112.1265,23.5822],
'舟山': [122.2559,30.2234],
'苏州': [120.6519,31.3989],
'莱芜': [117.6526,36.2714],
'菏泽': [115.6201,35.2057],
'营口': [122.4316,40.4297],
'葫芦岛': [120.1575,40.578],
'衡水': [115.8838,37.7161],
'衢州': [118.6853,28.8666],
'西宁': [101.4038,36.8207],
'西安': [109.1162,34.2004],
'贵阳': [106.6992,26.7682],
'连云港': [119.1248,34.552],
'邢台': [114.8071,37.2821],
'邯郸': [114.4775,36.535],
'郑州': [113.4668,34.6234],
'鄂尔多斯': [108.9734,39.2487],
'重庆': [107.7539,30.1904],
'金华': [120.0037,29.1028],
'铜川': [109.0393,35.1947],
'银川': [106.3586,38.1775],
'镇江': [119.4763,31.9702],
'长春': [125.8154,44.2584],
'长沙': [113.0823,28.2568],
'长治': [112.8625,36.4746],
'阳泉': [113.4778,38.0951],
'青岛': [120.4651,36.3373],
'韶关': [113.7964,24.7028]
};
var BJData = [
[{name:'北京'}, {name:'上海',value:95}],
[{name:'北京'}, {name:'广州',value:90}],
[{name:'北京'}, {name:'大连',value:80}],
[{name:'北京'}, {name:'南宁',value:70}],
[{name:'北京'}, {name:'南昌',value:60}],
[{name:'北京'}, {name:'拉萨',value:50}],
[{name:'北京'}, {name:'长春',value:40}],
[{name:'北京'}, {name:'包头',value:30}],
[{name:'北京'}, {name:'重庆',value:20}],
[{name:'北京'}, {name:'常州',value:10}]
];
var SHData = [
[{name:'上海'},{name:'包头',value:95}],
[{name:'上海'},{name:'昆明',value:90}],
[{name:'上海'},{name:'广州',value:80}],
[{name:'上海'},{name:'郑州',value:70}],
[{name:'上海'},{name:'长春',value:60}],
[{name:'上海'},{name:'重庆',value:50}],
[{name:'上海'},{name:'长沙',value:40}],
[{name:'上海'},{name:'北京',value:30}],
[{name:'上海'},{name:'丹东',value:20}],
[{name:'上海'},{name:'大连',value:10}]
];
var GZData = [
[{name:'广州'},{name:'福州',value:95}],
[{name:'广州'},{name:'太原',value:90}],
[{name:'广州'},{name:'长春',value:80}],
[{name:'广州'},{name:'重庆',value:70}],
[{name:'广州'},{name:'西安',value:60}],
[{name:'广州'},{name:'成都',value:50}],
[{name:'广州'},{name:'常州',value:40}],
[{name:'广州'},{name:'北京',value:30}],
[{name:'广州'},{name:'北海',value:20}],
[{name:'广州'},{name:'海口',value:10}]
];
var planePath = 'path://M1705.06,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705.06,1318.313z';
var convertData = function (data) {
var res = [];
for (var i = 0; i < data.length; i++) {
var dataItem = data[i];
var fromCoord = geoCoordMap[dataItem[0].name];
var toCoord = geoCoordMap[dataItem[1].name];
if (fromCoord && toCoord) {
res.push({
fromName: dataItem[0].name,
toName: dataItem[1].name,
coords: [fromCoord, toCoord]
});
}
}
return res;
};
var color = ['#a6c84c', '#ffa022', '#46bee9'];
var series = [];
[['北京', BJData], ['上海', SHData], ['广州', GZData]].forEach(function (item, i) {
series.push({
name: item[0] + ' Top10',
type: 'lines',
zlevel: 1,
effect: {
show: true,
period: 6,
trailLength: 0.7,
color: '#fff',
symbolSize: 3
},
lineStyle: {
normal: {
color: color[i],
width: 0,
curveness: 0.2
}
},
data: convertData(item[1])
},
{
name: item[0] + ' Top10',
type: 'lines',
zlevel: 2,
effect: {
show: true,
period: 6,
trailLength: 0,
symbol: planePath,
symbolSize: 15
},
lineStyle: {
normal: {
color: color[i],
width: 1,
opacity: 0.4,
curveness: 0.2
}
},
data: convertData(item[1])
},
{
name: item[0] + ' Top10',
type: 'effectScatter',
coordinateSystem: 'geo',
zlevel: 2,
rippleEffect: {
brushType: 'stroke'
},
label: {
normal: {
show: true,
position: 'right',
formatter: '{b}'
}
},
symbolSize: function (val) {
return val[2] / 8;
},
itemStyle: {
normal: {
color: color[i]
}
},
data: item[1].map(function (dataItem) {
return {
name: dataItem[1].name,
value: geoCoordMap[dataItem[1].name].concat([dataItem[1].value])
};
})
});
});
option = {
backgroundColor: '#404a59',
title : {
text: '模拟迁徙',
subtext: '数据纯属虚构',
left: 'center',
textStyle : {
color: '#fff'
}
},
tooltip : {
trigger: 'item'
},
legend: {
orient: 'vertical',
top: 'bottom',
left: 'right',
data:['北京 Top10', '上海 Top10', '广州 Top10'],
textStyle: {
color: '#fff'
},
selectedMode: 'single'
},
geo: {
map: 'china',
label: {
emphasis: {
show: false
}
},
roam: true,
itemStyle: {
normal: {
areaColor: '#323c48',
borderColor: '#404a59'
},
emphasis: {
areaColor: '#2a333d'
}
}
},
series: series
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
</script>
</body>
</html>

@ -0,0 +1,106 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>后台登录-X-admin2.0</title>
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
</head>
<body>
<div class="x-body">
<blockquote class="layui-elem-quote">
特别声明ECharts一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上兼容当前绝大部分浏览器IE8/9/10/11ChromeFirefoxSafari等底层依赖轻量级的 Canvas 类库 ZRender提供直观生动可交互可高度个性化定制的数据可视化图表。如需使用或者详细更多案例可以访问官网 <a href="http://echarts.baidu.com/" style="color:red">ECharts</a>。 x-admin不承担任何版权问题。
</blockquote>
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM -->
<div id="main" style="width: 100%;height:400px;"></div>
<blockquote class="layui-elem-quote">
注意本案例的Echarts图表库由cdn引入需要在线才能正常使用如想离想请至Echarts官网下载。
</blockquote>
</div>
<script src="https://cdn.bootcss.com/echarts/3.7.0/echarts.min.js"></script>
<script src="../js/echarts/bmap.min.js" type="text/javascript"></script>
<script type="text/javascript">
// 基于准备好的dom初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
// 指定图表的配置项和数据
option = {
backgroundColor: '#2c343c',
title: {
text: 'Customized Pie',
left: 'center',
top: 20,
textStyle: {
color: '#ccc'
}
},
tooltip : {
trigger: 'item',
formatter: "{a} <br/>{b} : {c} ({d}%)"
},
visualMap: {
show: false,
min: 80,
max: 600,
inRange: {
colorLightness: [0, 1]
}
},
series : [
{
name:'访问来源',
type:'pie',
radius : '55%',
center: ['50%', '50%'],
data:[
{value:335, name:'直接访问'},
{value:310, name:'邮件营销'},
{value:274, name:'联盟广告'},
{value:235, name:'视频广告'},
{value:400, name:'搜索引擎'}
].sort(function (a, b) { return a.value - b.value}),
roseType: 'angle',
label: {
normal: {
textStyle: {
color: 'rgba(255, 255, 255, 0.3)'
}
}
},
labelLine: {
normal: {
lineStyle: {
color: 'rgba(255, 255, 255, 0.3)'
},
smooth: 0.2,
length: 10,
length2: 20
}
},
itemStyle: {
normal: {
color: '#c23531',
shadowBlur: 200,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}
]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
</script>
</body>
</html>

@ -0,0 +1,72 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>后台登录-X-admin2.0</title>
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
</head>
<body>
<div class="x-body">
<blockquote class="layui-elem-quote">
特别声明ECharts一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上兼容当前绝大部分浏览器IE8/9/10/11ChromeFirefoxSafari等底层依赖轻量级的 Canvas 类库 ZRender提供直观生动可交互可高度个性化定制的数据可视化图表。如需使用详细了解可以访问官网 <a href="http://echarts.baidu.com/" style="color:red">ECharts</a>。 x-admin不承担任何版权问题。
</blockquote>
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM -->
<div id="main" style="width: 100%;height:400px;"></div>
<blockquote class="layui-elem-quote">
注意本案例的Echarts图表库由cdn引入需要在线才能正常使用如想离想请至Echarts官网下载。
</blockquote>
</div>
<script src="https://cdn.bootcss.com/echarts/3.7.0/echarts.min.js"></script>
<script type="text/javascript">
// 基于准备好的dom初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
// 指定图表的配置项和数据
var option = {
title: {
text: '基础雷达图'
},
tooltip: {},
legend: {
data: ['预算分配Allocated Budget', '实际开销Actual Spending']
},
radar: {
// shape: 'circle',
indicator: [
{ name: '销售sales', max: 6500},
{ name: '管理Administration', max: 16000},
{ name: '信息技术Information Techology', max: 30000},
{ name: '客服Customer Support', max: 38000},
{ name: '研发Development', max: 52000},
{ name: '市场Marketing', max: 25000}
]
},
series: [{
name: '预算 vs 开销Budget vs spending',
type: 'radar',
// areaStyle: {normal: {}},
data : [
{
value : [4300, 10000, 28000, 35000, 50000, 19000],
name : '预算分配Allocated Budget'
},
{
value : [5000, 14000, 28000, 31000, 42000, 21000],
name : '实际开销Actual Spending'
}
]
}]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
</script>
</body>
</html>

@ -0,0 +1,335 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>后台登录-X-admin2.0</title>
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
</head>
<body>
<div class="x-body">
<blockquote class="layui-elem-quote">
特别声明ECharts一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上兼容当前绝大部分浏览器IE8/9/10/11ChromeFirefoxSafari等底层依赖轻量级的 Canvas 类库 ZRender提供直观生动可交互可高度个性化定制的数据可视化图表。如需使用详细了解可以访问官网 <a href="http://echarts.baidu.com/" style="color:red">ECharts</a>。 x-admin不承担任何版权问题。
</blockquote>
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM -->
<div id="main" style="width: 100%;height:400px;"></div>
<blockquote class="layui-elem-quote">
注意本案例的Echarts图表库由cdn引入需要在线才能正常使用如想离想请至Echarts官网下载。
</blockquote>
</div>
<script src="https://cdn.bootcss.com/echarts/3.7.0/echarts.min.js"></script>
<script type="text/javascript">
// 基于准备好的dom初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
// 指定图表的配置项和数据
// 数据意义:开盘(open),收盘(close),最低(lowest),最高(highest)
var data0 = splitData([
['2013/1/24', 2320.26,2320.26,2287.3,2362.94],
['2013/1/25', 2300,2291.3,2288.26,2308.38],
['2013/1/28', 2295.35,2346.5,2295.35,2346.92],
['2013/1/29', 2347.22,2358.98,2337.35,2363.8],
['2013/1/30', 2360.75,2382.48,2347.89,2383.76],
['2013/1/31', 2383.43,2385.42,2371.23,2391.82],
['2013/2/1', 2377.41,2419.02,2369.57,2421.15],
['2013/2/4', 2425.92,2428.15,2417.58,2440.38],
['2013/2/5', 2411,2433.13,2403.3,2437.42],
['2013/2/6', 2432.68,2434.48,2427.7,2441.73],
['2013/2/7', 2430.69,2418.53,2394.22,2433.89],
['2013/2/8', 2416.62,2432.4,2414.4,2443.03],
['2013/2/18', 2441.91,2421.56,2415.43,2444.8],
['2013/2/19', 2420.26,2382.91,2373.53,2427.07],
['2013/2/20', 2383.49,2397.18,2370.61,2397.94],
['2013/2/21', 2378.82,2325.95,2309.17,2378.82],
['2013/2/22', 2322.94,2314.16,2308.76,2330.88],
['2013/2/25', 2320.62,2325.82,2315.01,2338.78],
['2013/2/26', 2313.74,2293.34,2289.89,2340.71],
['2013/2/27', 2297.77,2313.22,2292.03,2324.63],
['2013/2/28', 2322.32,2365.59,2308.92,2366.16],
['2013/3/1', 2364.54,2359.51,2330.86,2369.65],
['2013/3/4', 2332.08,2273.4,2259.25,2333.54],
['2013/3/5', 2274.81,2326.31,2270.1,2328.14],
['2013/3/6', 2333.61,2347.18,2321.6,2351.44],
['2013/3/7', 2340.44,2324.29,2304.27,2352.02],
['2013/3/8', 2326.42,2318.61,2314.59,2333.67],
['2013/3/11', 2314.68,2310.59,2296.58,2320.96],
['2013/3/12', 2309.16,2286.6,2264.83,2333.29],
['2013/3/13', 2282.17,2263.97,2253.25,2286.33],
['2013/3/14', 2255.77,2270.28,2253.31,2276.22],
['2013/3/15', 2269.31,2278.4,2250,2312.08],
['2013/3/18', 2267.29,2240.02,2239.21,2276.05],
['2013/3/19', 2244.26,2257.43,2232.02,2261.31],
['2013/3/20', 2257.74,2317.37,2257.42,2317.86],
['2013/3/21', 2318.21,2324.24,2311.6,2330.81],
['2013/3/22', 2321.4,2328.28,2314.97,2332],
['2013/3/25', 2334.74,2326.72,2319.91,2344.89],
['2013/3/26', 2318.58,2297.67,2281.12,2319.99],
['2013/3/27', 2299.38,2301.26,2289,2323.48],
['2013/3/28', 2273.55,2236.3,2232.91,2273.55],
['2013/3/29', 2238.49,2236.62,2228.81,2246.87],
['2013/4/1', 2229.46,2234.4,2227.31,2243.95],
['2013/4/2', 2234.9,2227.74,2220.44,2253.42],
['2013/4/3', 2232.69,2225.29,2217.25,2241.34],
['2013/4/8', 2196.24,2211.59,2180.67,2212.59],
['2013/4/9', 2215.47,2225.77,2215.47,2234.73],
['2013/4/10', 2224.93,2226.13,2212.56,2233.04],
['2013/4/11', 2236.98,2219.55,2217.26,2242.48],
['2013/4/12', 2218.09,2206.78,2204.44,2226.26],
['2013/4/15', 2199.91,2181.94,2177.39,2204.99],
['2013/4/16', 2169.63,2194.85,2165.78,2196.43],
['2013/4/17', 2195.03,2193.8,2178.47,2197.51],
['2013/4/18', 2181.82,2197.6,2175.44,2206.03],
['2013/4/19', 2201.12,2244.64,2200.58,2250.11],
['2013/4/22', 2236.4,2242.17,2232.26,2245.12],
['2013/4/23', 2242.62,2184.54,2182.81,2242.62],
['2013/4/24', 2187.35,2218.32,2184.11,2226.12],
['2013/4/25', 2213.19,2199.31,2191.85,2224.63],
['2013/4/26', 2203.89,2177.91,2173.86,2210.58],
['2013/5/2', 2170.78,2174.12,2161.14,2179.65],
['2013/5/3', 2179.05,2205.5,2179.05,2222.81],
['2013/5/6', 2212.5,2231.17,2212.5,2236.07],
['2013/5/7', 2227.86,2235.57,2219.44,2240.26],
['2013/5/8', 2242.39,2246.3,2235.42,2255.21],
['2013/5/9', 2246.96,2232.97,2221.38,2247.86],
['2013/5/10', 2228.82,2246.83,2225.81,2247.67],
['2013/5/13', 2247.68,2241.92,2231.36,2250.85],
['2013/5/14', 2238.9,2217.01,2205.87,2239.93],
['2013/5/15', 2217.09,2224.8,2213.58,2225.19],
['2013/5/16', 2221.34,2251.81,2210.77,2252.87],
['2013/5/17', 2249.81,2282.87,2248.41,2288.09],
['2013/5/20', 2286.33,2299.99,2281.9,2309.39],
['2013/5/21', 2297.11,2305.11,2290.12,2305.3],
['2013/5/22', 2303.75,2302.4,2292.43,2314.18],
['2013/5/23', 2293.81,2275.67,2274.1,2304.95],
['2013/5/24', 2281.45,2288.53,2270.25,2292.59],
['2013/5/27', 2286.66,2293.08,2283.94,2301.7],
['2013/5/28', 2293.4,2321.32,2281.47,2322.1],
['2013/5/29', 2323.54,2324.02,2321.17,2334.33],
['2013/5/30', 2316.25,2317.75,2310.49,2325.72],
['2013/5/31', 2320.74,2300.59,2299.37,2325.53],
['2013/6/3', 2300.21,2299.25,2294.11,2313.43],
['2013/6/4', 2297.1,2272.42,2264.76,2297.1],
['2013/6/5', 2270.71,2270.93,2260.87,2276.86],
['2013/6/6', 2264.43,2242.11,2240.07,2266.69],
['2013/6/7', 2242.26,2210.9,2205.07,2250.63],
['2013/6/13', 2190.1,2148.35,2126.22,2190.1]
]);
function splitData(rawData) {
var categoryData = [];
var values = []
for (var i = 0; i < rawData.length; i++) {
categoryData.push(rawData[i].splice(0, 1)[0]);
values.push(rawData[i])
}
return {
categoryData: categoryData,
values: values
};
}
function calculateMA(dayCount) {
var result = [];
for (var i = 0, len = data0.values.length; i < len; i++) {
if (i < dayCount) {
result.push('-');
continue;
}
var sum = 0;
for (var j = 0; j < dayCount; j++) {
sum += data0.values[i - j][1];
}
result.push(sum / dayCount);
}
return result;
}
option = {
title: {
text: '上证指数',
left: 0
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'line'
}
},
legend: {
data: ['日K', 'MA5', 'MA10', 'MA20', 'MA30']
},
grid: {
left: '10%',
right: '10%',
bottom: '15%'
},
xAxis: {
type: 'category',
data: data0.categoryData,
scale: true,
boundaryGap : false,
axisLine: {onZero: false},
splitLine: {show: false},
splitNumber: 20,
min: 'dataMin',
max: 'dataMax'
},
yAxis: {
scale: true,
splitArea: {
show: true
}
},
dataZoom: [
{
type: 'inside',
start: 50,
end: 100
},
{
show: true,
type: 'slider',
y: '90%',
start: 50,
end: 100
}
],
series: [
{
name: '日K',
type: 'candlestick',
data: data0.values,
markPoint: {
label: {
normal: {
formatter: function (param) {
return param != null ? Math.round(param.value) : '';
}
}
},
data: [
{
name: 'XX标点',
coord: ['2013/5/31', 2300],
value: 2300,
itemStyle: {
normal: {color: 'rgb(41,60,85)'}
}
},
{
name: 'highest value',
type: 'max',
valueDim: 'highest'
},
{
name: 'lowest value',
type: 'min',
valueDim: 'lowest'
},
{
name: 'average value on close',
type: 'average',
valueDim: 'close'
}
],
tooltip: {
formatter: function (param) {
return param.name + '<br>' + (param.data.coord || '');
}
}
},
markLine: {
symbol: ['none', 'none'],
data: [
[
{
name: 'from lowest to highest',
type: 'min',
valueDim: 'lowest',
symbol: 'circle',
symbolSize: 10,
label: {
normal: {show: false},
emphasis: {show: false}
}
},
{
type: 'max',
valueDim: 'highest',
symbol: 'circle',
symbolSize: 10,
label: {
normal: {show: false},
emphasis: {show: false}
}
}
],
{
name: 'min line on close',
type: 'min',
valueDim: 'close'
},
{
name: 'max line on close',
type: 'max',
valueDim: 'close'
}
]
}
},
{
name: 'MA5',
type: 'line',
data: calculateMA(5),
smooth: true,
lineStyle: {
normal: {opacity: 0.5}
}
},
{
name: 'MA10',
type: 'line',
data: calculateMA(10),
smooth: true,
lineStyle: {
normal: {opacity: 0.5}
}
},
{
name: 'MA20',
type: 'line',
data: calculateMA(20),
smooth: true,
lineStyle: {
normal: {opacity: 0.5}
}
},
{
name: 'MA30',
type: 'line',
data: calculateMA(30),
smooth: true,
lineStyle: {
normal: {opacity: 0.5}
}
},
]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
</script>
</body>
</html>

@ -0,0 +1,488 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>后台登录-X-admin2.0</title>
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
</head>
<body>
<div class="x-body">
<blockquote class="layui-elem-quote">
特别声明ECharts一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上兼容当前绝大部分浏览器IE8/9/10/11ChromeFirefoxSafari等底层依赖轻量级的 Canvas 类库 ZRender提供直观生动可交互可高度个性化定制的数据可视化图表。如需使用或者详细更多案例可以访问官网 <a href="http://echarts.baidu.com/" style="color:red">ECharts</a>。 x-admin不承担任何版权问题。
</blockquote>
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM -->
<div id="main" style="width: 100%;height:400px;"></div>
<blockquote class="layui-elem-quote">
注意本案例的Echarts图表库由cdn引入需要在线才能正常使用如想离想请至Echarts官网下载。
</blockquote>
</div>
<script src="https://cdn.bootcss.com/echarts/3.7.0/echarts.min.js"></script>
<script src="../js/echarts/bmap.min.js" type="text/javascript"></script>
<script src="http://echarts.baidu.com/asset/map/js/china.js"></script>
<script type="text/javascript">
// 基于准备好的dom初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
myChart.setOption({
series: [{
type: 'map',
map: 'china'
}]
});
var geoCoordMap = {
"海门":[121.15,31.89],
"鄂尔多斯":[109.781327,39.608266],
"招远":[120.38,37.35],
"舟山":[122.207216,29.985295],
"齐齐哈尔":[123.97,47.33],
"盐城":[120.13,33.38],
"赤峰":[118.87,42.28],
"青岛":[120.33,36.07],
"乳山":[121.52,36.89],
"金昌":[102.188043,38.520089],
"泉州":[118.58,24.93],
"莱西":[120.53,36.86],
"日照":[119.46,35.42],
"胶南":[119.97,35.88],
"南通":[121.05,32.08],
"拉萨":[91.11,29.97],
"云浮":[112.02,22.93],
"梅州":[116.1,24.55],
"文登":[122.05,37.2],
"上海":[121.48,31.22],
"攀枝花":[101.718637,26.582347],
"威海":[122.1,37.5],
"承德":[117.93,40.97],
"厦门":[118.1,24.46],
"汕尾":[115.375279,22.786211],
"潮州":[116.63,23.68],
"丹东":[124.37,40.13],
"太仓":[121.1,31.45],
"曲靖":[103.79,25.51],
"烟台":[121.39,37.52],
"福州":[119.3,26.08],
"瓦房店":[121.979603,39.627114],
"即墨":[120.45,36.38],
"抚顺":[123.97,41.97],
"玉溪":[102.52,24.35],
"张家口":[114.87,40.82],
"阳泉":[113.57,37.85],
"莱州":[119.942327,37.177017],
"湖州":[120.1,30.86],
"汕头":[116.69,23.39],
"昆山":[120.95,31.39],
"宁波":[121.56,29.86],
"湛江":[110.359377,21.270708],
"揭阳":[116.35,23.55],
"荣成":[122.41,37.16],
"连云港":[119.16,34.59],
"葫芦岛":[120.836932,40.711052],
"常熟":[120.74,31.64],
"东莞":[113.75,23.04],
"河源":[114.68,23.73],
"淮安":[119.15,33.5],
"泰州":[119.9,32.49],
"南宁":[108.33,22.84],
"营口":[122.18,40.65],
"惠州":[114.4,23.09],
"江阴":[120.26,31.91],
"蓬莱":[120.75,37.8],
"韶关":[113.62,24.84],
"嘉峪关":[98.289152,39.77313],
"广州":[113.23,23.16],
"延安":[109.47,36.6],
"太原":[112.53,37.87],
"清远":[113.01,23.7],
"中山":[113.38,22.52],
"昆明":[102.73,25.04],
"寿光":[118.73,36.86],
"盘锦":[122.070714,41.119997],
"长治":[113.08,36.18],
"深圳":[114.07,22.62],
"珠海":[113.52,22.3],
"宿迁":[118.3,33.96],
"咸阳":[108.72,34.36],
"铜川":[109.11,35.09],
"平度":[119.97,36.77],
"佛山":[113.11,23.05],
"海口":[110.35,20.02],
"江门":[113.06,22.61],
"章丘":[117.53,36.72],
"肇庆":[112.44,23.05],
"大连":[121.62,38.92],
"临汾":[111.5,36.08],
"吴江":[120.63,31.16],
"石嘴山":[106.39,39.04],
"沈阳":[123.38,41.8],
"苏州":[120.62,31.32],
"茂名":[110.88,21.68],
"嘉兴":[120.76,30.77],
"长春":[125.35,43.88],
"胶州":[120.03336,36.264622],
"银川":[106.27,38.47],
"张家港":[120.555821,31.875428],
"三门峡":[111.19,34.76],
"锦州":[121.15,41.13],
"南昌":[115.89,28.68],
"柳州":[109.4,24.33],
"三亚":[109.511909,18.252847],
"自贡":[104.778442,29.33903],
"吉林":[126.57,43.87],
"阳江":[111.95,21.85],
"泸州":[105.39,28.91],
"西宁":[101.74,36.56],
"宜宾":[104.56,29.77],
"呼和浩特":[111.65,40.82],
"成都":[104.06,30.67],
"大同":[113.3,40.12],
"镇江":[119.44,32.2],
"桂林":[110.28,25.29],
"张家界":[110.479191,29.117096],
"宜兴":[119.82,31.36],
"北海":[109.12,21.49],
"西安":[108.95,34.27],
"金坛":[119.56,31.74],
"东营":[118.49,37.46],
"牡丹江":[129.58,44.6],
"遵义":[106.9,27.7],
"绍兴":[120.58,30.01],
"扬州":[119.42,32.39],
"常州":[119.95,31.79],
"潍坊":[119.1,36.62],
"重庆":[106.54,29.59],
"台州":[121.420757,28.656386],
"南京":[118.78,32.04],
"滨州":[118.03,37.36],
"贵阳":[106.71,26.57],
"无锡":[120.29,31.59],
"本溪":[123.73,41.3],
"克拉玛依":[84.77,45.59],
"渭南":[109.5,34.52],
"马鞍山":[118.48,31.56],
"宝鸡":[107.15,34.38],
"焦作":[113.21,35.24],
"句容":[119.16,31.95],
"北京":[116.46,39.92],
"徐州":[117.2,34.26],
"衡水":[115.72,37.72],
"包头":[110,40.58],
"绵阳":[104.73,31.48],
"乌鲁木齐":[87.68,43.77],
"枣庄":[117.57,34.86],
"杭州":[120.19,30.26],
"淄博":[118.05,36.78],
"鞍山":[122.85,41.12],
"溧阳":[119.48,31.43],
"库尔勒":[86.06,41.68],
"安阳":[114.35,36.1],
"开封":[114.35,34.79],
"济南":[117,36.65],
"德阳":[104.37,31.13],
"温州":[120.65,28.01],
"九江":[115.97,29.71],
"邯郸":[114.47,36.6],
"临安":[119.72,30.23],
"兰州":[103.73,36.03],
"沧州":[116.83,38.33],
"临沂":[118.35,35.05],
"南充":[106.110698,30.837793],
"天津":[117.2,39.13],
"富阳":[119.95,30.07],
"泰安":[117.13,36.18],
"诸暨":[120.23,29.71],
"郑州":[113.65,34.76],
"哈尔滨":[126.63,45.75],
"聊城":[115.97,36.45],
"芜湖":[118.38,31.33],
"唐山":[118.02,39.63],
"平顶山":[113.29,33.75],
"邢台":[114.48,37.05],
"德州":[116.29,37.45],
"济宁":[116.59,35.38],
"荆州":[112.239741,30.335165],
"宜昌":[111.3,30.7],
"义乌":[120.06,29.32],
"丽水":[119.92,28.45],
"洛阳":[112.44,34.7],
"秦皇岛":[119.57,39.95],
"株洲":[113.16,27.83],
"石家庄":[114.48,38.03],
"莱芜":[117.67,36.19],
"常德":[111.69,29.05],
"保定":[115.48,38.85],
"湘潭":[112.91,27.87],
"金华":[119.64,29.12],
"岳阳":[113.09,29.37],
"长沙":[113,28.21],
"衢州":[118.88,28.97],
"廊坊":[116.7,39.53],
"菏泽":[115.480656,35.23375],
"合肥":[117.27,31.86],
"武汉":[114.31,30.52],
"大庆":[125.03,46.58]
};
var convertData = function (data) {
var res = [];
for (var i = 0; i < data.length; i++) {
var geoCoord = geoCoordMap[data[i].name];
if (geoCoord) {
res.push(geoCoord.concat(data[i].value));
}
}
return res;
};
option = {
title: {
text: '全国主要城市空气质量',
subtext: 'data from PM25.in',
sublink: 'http://www.pm25.in',
left: 'center',
textStyle: {
color: '#fff'
}
},
backgroundColor: '#404a59',
visualMap: {
min: 0,
max: 500,
splitNumber: 5,
inRange: {
color: ['#d94e5d','#eac736','#50a3ba'].reverse()
},
textStyle: {
color: '#fff'
}
},
geo: {
map: 'china',
label: {
emphasis: {
show: false
}
},
roam: true,
itemStyle: {
normal: {
areaColor: '#323c48',
borderColor: '#111'
},
emphasis: {
areaColor: '#2a333d'
}
}
},
series: [{
name: 'AQI',
type: 'heatmap',
coordinateSystem: 'geo',
data: convertData([
{name: "海门", value: 9},
{name: "鄂尔多斯", value: 12},
{name: "招远", value: 12},
{name: "舟山", value: 12},
{name: "齐齐哈尔", value: 14},
{name: "盐城", value: 15},
{name: "赤峰", value: 16},
{name: "青岛", value: 18},
{name: "乳山", value: 18},
{name: "金昌", value: 19},
{name: "泉州", value: 21},
{name: "莱西", value: 21},
{name: "日照", value: 21},
{name: "胶南", value: 22},
{name: "南通", value: 23},
{name: "拉萨", value: 24},
{name: "云浮", value: 24},
{name: "梅州", value: 25},
{name: "文登", value: 25},
{name: "上海", value: 25},
{name: "攀枝花", value: 25},
{name: "威海", value: 25},
{name: "承德", value: 25},
{name: "厦门", value: 26},
{name: "汕尾", value: 26},
{name: "潮州", value: 26},
{name: "丹东", value: 27},
{name: "太仓", value: 27},
{name: "曲靖", value: 27},
{name: "烟台", value: 28},
{name: "福州", value: 29},
{name: "瓦房店", value: 30},
{name: "即墨", value: 30},
{name: "抚顺", value: 31},
{name: "玉溪", value: 31},
{name: "张家口", value: 31},
{name: "阳泉", value: 31},
{name: "莱州", value: 32},
{name: "湖州", value: 32},
{name: "汕头", value: 32},
{name: "昆山", value: 33},
{name: "宁波", value: 33},
{name: "湛江", value: 33},
{name: "揭阳", value: 34},
{name: "荣成", value: 34},
{name: "连云港", value: 35},
{name: "葫芦岛", value: 35},
{name: "常熟", value: 36},
{name: "东莞", value: 36},
{name: "河源", value: 36},
{name: "淮安", value: 36},
{name: "泰州", value: 36},
{name: "南宁", value: 37},
{name: "营口", value: 37},
{name: "惠州", value: 37},
{name: "江阴", value: 37},
{name: "蓬莱", value: 37},
{name: "韶关", value: 38},
{name: "嘉峪关", value: 38},
{name: "广州", value: 38},
{name: "延安", value: 38},
{name: "太原", value: 39},
{name: "清远", value: 39},
{name: "中山", value: 39},
{name: "昆明", value: 39},
{name: "寿光", value: 40},
{name: "盘锦", value: 40},
{name: "长治", value: 41},
{name: "深圳", value: 41},
{name: "珠海", value: 42},
{name: "宿迁", value: 43},
{name: "咸阳", value: 43},
{name: "铜川", value: 44},
{name: "平度", value: 44},
{name: "佛山", value: 44},
{name: "海口", value: 44},
{name: "江门", value: 45},
{name: "章丘", value: 45},
{name: "肇庆", value: 46},
{name: "大连", value: 47},
{name: "临汾", value: 47},
{name: "吴江", value: 47},
{name: "石嘴山", value: 49},
{name: "沈阳", value: 50},
{name: "苏州", value: 50},
{name: "茂名", value: 50},
{name: "嘉兴", value: 51},
{name: "长春", value: 51},
{name: "胶州", value: 52},
{name: "银川", value: 52},
{name: "张家港", value: 52},
{name: "三门峡", value: 53},
{name: "锦州", value: 54},
{name: "南昌", value: 54},
{name: "柳州", value: 54},
{name: "三亚", value: 54},
{name: "自贡", value: 56},
{name: "吉林", value: 56},
{name: "阳江", value: 57},
{name: "泸州", value: 57},
{name: "西宁", value: 57},
{name: "宜宾", value: 58},
{name: "呼和浩特", value: 58},
{name: "成都", value: 58},
{name: "大同", value: 58},
{name: "镇江", value: 59},
{name: "桂林", value: 59},
{name: "张家界", value: 59},
{name: "宜兴", value: 59},
{name: "北海", value: 60},
{name: "西安", value: 61},
{name: "金坛", value: 62},
{name: "东营", value: 62},
{name: "牡丹江", value: 63},
{name: "遵义", value: 63},
{name: "绍兴", value: 63},
{name: "扬州", value: 64},
{name: "常州", value: 64},
{name: "潍坊", value: 65},
{name: "重庆", value: 66},
{name: "台州", value: 67},
{name: "南京", value: 67},
{name: "滨州", value: 70},
{name: "贵阳", value: 71},
{name: "无锡", value: 71},
{name: "本溪", value: 71},
{name: "克拉玛依", value: 72},
{name: "渭南", value: 72},
{name: "马鞍山", value: 72},
{name: "宝鸡", value: 72},
{name: "焦作", value: 75},
{name: "句容", value: 75},
{name: "北京", value: 79},
{name: "徐州", value: 79},
{name: "衡水", value: 80},
{name: "包头", value: 80},
{name: "绵阳", value: 80},
{name: "乌鲁木齐", value: 84},
{name: "枣庄", value: 84},
{name: "杭州", value: 84},
{name: "淄博", value: 85},
{name: "鞍山", value: 86},
{name: "溧阳", value: 86},
{name: "库尔勒", value: 86},
{name: "安阳", value: 90},
{name: "开封", value: 90},
{name: "济南", value: 92},
{name: "德阳", value: 93},
{name: "温州", value: 95},
{name: "九江", value: 96},
{name: "邯郸", value: 98},
{name: "临安", value: 99},
{name: "兰州", value: 99},
{name: "沧州", value: 100},
{name: "临沂", value: 103},
{name: "南充", value: 104},
{name: "天津", value: 105},
{name: "富阳", value: 106},
{name: "泰安", value: 112},
{name: "诸暨", value: 112},
{name: "郑州", value: 113},
{name: "哈尔滨", value: 114},
{name: "聊城", value: 116},
{name: "芜湖", value: 117},
{name: "唐山", value: 119},
{name: "平顶山", value: 119},
{name: "邢台", value: 119},
{name: "德州", value: 120},
{name: "济宁", value: 120},
{name: "荆州", value: 127},
{name: "宜昌", value: 130},
{name: "义乌", value: 132},
{name: "丽水", value: 133},
{name: "洛阳", value: 134},
{name: "秦皇岛", value: 136},
{name: "株洲", value: 143},
{name: "石家庄", value: 147},
{name: "莱芜", value: 148},
{name: "常德", value: 152},
{name: "保定", value: 153},
{name: "湘潭", value: 154},
{name: "金华", value: 157},
{name: "岳阳", value: 169},
{name: "长沙", value: 175},
{name: "衢州", value: 177},
{name: "廊坊", value: 193},
{name: "菏泽", value: 194},
{name: "合肥", value: 229},
{name: "武汉", value: 273},
{name: "大庆", value: 279}
])
}]
};
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
</script>
</body>
</html>

@ -0,0 +1,230 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>后台登录-X-admin2.0</title>
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
</head>
<body>
<div class="x-body">
<blockquote class="layui-elem-quote">
特别声明ECharts一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上兼容当前绝大部分浏览器IE8/9/10/11ChromeFirefoxSafari等底层依赖轻量级的 Canvas 类库 ZRender提供直观生动可交互可高度个性化定制的数据可视化图表。如需使用详细了解可以访问官网 <a href="http://echarts.baidu.com/" style="color:red">ECharts</a>。 x-admin不承担任何版权问题。
</blockquote>
<!-- 为 ECharts 准备一个具备大小(宽高)的 DOM -->
<div id="main" style="width: 100%;height:400px;"></div>
<blockquote class="layui-elem-quote">
注意本案例的Echarts图表库由cdn引入需要在线才能正常使用如想离想请至Echarts官网下载。
</blockquote>
</div>
<script src="https://cdn.bootcss.com/echarts/3.7.0/echarts.min.js"></script>
<script type="text/javascript">
// 基于准备好的dom初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
// 指定图表的配置项和数据
option = {
tooltip : {
formatter: "{a} <br/>{c} {b}"
},
toolbox: {
show: true,
feature: {
restore: {show: true},
saveAsImage: {show: true}
}
},
series : [
{
name: '速度',
type: 'gauge',
z: 3,
min: 0,
max: 220,
splitNumber: 11,
radius: '50%',
axisLine: { // 坐标轴线
lineStyle: { // 属性lineStyle控制线条样式
width: 10
}
},
axisTick: { // 坐标轴小标记
length: 15, // 属性length控制线长
lineStyle: { // 属性lineStyle控制线条样式
color: 'auto'
}
},
splitLine: { // 分隔线
length: 20, // 属性length控制线长
lineStyle: { // 属性lineStyle详见lineStyle控制线条样式
color: 'auto'
}
},
title : {
textStyle: { // 其余属性默认使用全局文本样式详见TEXTSTYLE
fontWeight: 'bolder',
fontSize: 20,
fontStyle: 'italic'
}
},
detail : {
textStyle: { // 其余属性默认使用全局文本样式详见TEXTSTYLE
fontWeight: 'bolder'
}
},
data:[{value: 40, name: 'km/h'}]
},
{
name: '转速',
type: 'gauge',
center: ['20%', '55%'], // 默认全局居中
radius: '35%',
min:0,
max:7,
endAngle:45,
splitNumber:7,
axisLine: { // 坐标轴线
lineStyle: { // 属性lineStyle控制线条样式
width: 8
}
},
axisTick: { // 坐标轴小标记
length:12, // 属性length控制线长
lineStyle: { // 属性lineStyle控制线条样式
color: 'auto'
}
},
splitLine: { // 分隔线
length:20, // 属性length控制线长
lineStyle: { // 属性lineStyle详见lineStyle控制线条样式
color: 'auto'
}
},
pointer: {
width:5
},
title: {
offsetCenter: [0, '-30%'], // x, y单位px
},
detail: {
textStyle: { // 其余属性默认使用全局文本样式详见TEXTSTYLE
fontWeight: 'bolder'
}
},
data:[{value: 1.5, name: 'x1000 r/min'}]
},
{
name: '油表',
type: 'gauge',
center: ['77%', '50%'], // 默认全局居中
radius: '25%',
min: 0,
max: 2,
startAngle: 135,
endAngle: 45,
splitNumber: 2,
axisLine: { // 坐标轴线
lineStyle: { // 属性lineStyle控制线条样式
width: 8
}
},
axisTick: { // 坐标轴小标记
splitNumber: 5,
length: 10, // 属性length控制线长
lineStyle: { // 属性lineStyle控制线条样式
color: 'auto'
}
},
axisLabel: {
formatter:function(v){
switch (v + '') {
case '0' : return 'E';
case '1' : return 'Gas';
case '2' : return 'F';
}
}
},
splitLine: { // 分隔线
length: 15, // 属性length控制线长
lineStyle: { // 属性lineStyle详见lineStyle控制线条样式
color: 'auto'
}
},
pointer: {
width:2
},
title : {
show: false
},
detail : {
show: false
},
data:[{value: 0.5, name: 'gas'}]
},
{
name: '水表',
type: 'gauge',
center : ['77%', '50%'], // 默认全局居中
radius : '25%',
min: 0,
max: 2,
startAngle: 315,
endAngle: 225,
splitNumber: 2,
axisLine: { // 坐标轴线
lineStyle: { // 属性lineStyle控制线条样式
width: 8
}
},
axisTick: { // 坐标轴小标记
show: false
},
axisLabel: {
formatter:function(v){
switch (v + '') {
case '0' : return 'H';
case '1' : return 'Water';
case '2' : return 'C';
}
}
},
splitLine: { // 分隔线
length: 15, // 属性length控制线长
lineStyle: { // 属性lineStyle详见lineStyle控制线条样式
color: 'auto'
}
},
pointer: {
width:2
},
title: {
show: false
},
detail: {
show: false
},
data:[{value: 0.5, name: 'gas'}]
}
]
};
setInterval(function (){
option.series[0].data[0].value = (Math.random()*100).toFixed(2) - 0;
option.series[1].data[0].value = (Math.random()*7).toFixed(2) - 0;
option.series[2].data[0].value = (Math.random()*2).toFixed(2) - 0;
option.series[3].data[0].value = (Math.random()*2).toFixed(2) - 0;
myChart.setOption(option,true);
},2000);
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
</script>
</body>
</html>

@ -0,0 +1,254 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script src="../lib/layui/layui.js"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="form-wrap">
<div class="layui-fluid">
<div class="layui-row layui-col-space15">
<div class="layui-col-md6">
<div class="layui-card">
<div class="layui-card-header">输入框</div>
<div class="layui-card-body layui-row layui-col-space10">
<div class="layui-col-md12">
<input type="text" name="title" placeholder="请输入标题" autocomplete="off" class="layui-input">
</div>
<div class="layui-col-md6">
<input type="text" name="title" placeholder="用户名" autocomplete="off" class="layui-input">
</div>
<div class="layui-col-md6">
<input type="password" name="title" placeholder="密码" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-card layui-form" lay-filter="component-form-element">
<div class="layui-card-header">下拉选择框</div>
<div class="layui-card-body layui-row layui-col-space10">
<div class="layui-col-md6">
<select name="city" lay-verify="">
<option value="">请选择一个城市</option>
<option value="010">北京</option>
<option value="021">上海</option>
<option value="0571">杭州</option>
</select>
</div>
<div class="layui-col-md6">
<select name="city" lay-verify="">
<option value="010">北京</option>
<option value="021" disabled>上海(禁用效果)</option>
<option value="0571" selected>杭州</option>
</select>
</div>
<div class="layui-col-md6">
<select name="quiz">
<option value="">请选择</option>
<optgroup label="城市记忆">
<option value="你工作的第一个城市">你工作的第一个城市?</option>
</optgroup>
<optgroup label="学生时代">
<option value="你的工号">你的工号?</option>
<option value="你最喜欢的老师">你最喜欢的老师?</option>
</optgroup>
</select>
</div>
<div class="layui-col-md6">
<select name="city" 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>
<option value="11">code</option>
<option value="12">tree</option>
<option value="13">layedit</option>
<option value="14">nav</option>
<option value="15">tab</option>
<option value="16">table</option>
<option value="17">select</option>
<option value="18">checkbox</option>
<option value="19">switch</option>
<option value="20">radio</option>
</select>
</div>
<div class="layui-col-md12">
<select name="city" lay-verify="">
<option value="">请选择一个城市</option>
<option value="010">北京</option>
<option value="021">上海</option>
<option value="0571">杭州</option>
</select>
</div>
</div>
</div>
<div class="layui-card layui-form" lay-filter="component-form-element">
<div class="layui-card-header">复选框</div>
<div class="layui-card-body layui-row layui-col-space10">
<div class="layui-col-md12">
<input type="checkbox" name="" title="写作" checked>
<input type="checkbox" name="" title="发呆">
<input type="checkbox" name="" title="禁用" disabled>
</div>
<div class="layui-col-md12">
<input type="checkbox" name="" title="写作" lay-skin="primary" checked>
<input type="checkbox" name="" title="发呆" lay-skin="primary">
<input type="checkbox" name="" title="禁用" lay-skin="primary" disabled>
<input type="checkbox" name="" lay-skin="primary">
</div>
</div>
</div>
<div class="layui-card layui-form" lay-filter="component-form-element">
<div class="layui-card-header">开关</div>
<div class="layui-card-body layui-row layui-col-space10">
<div class="layui-col-md12">
<input type="checkbox" name="xxx" lay-skin="switch">
<input type="checkbox" name="yyy" lay-skin="switch" lay-text="ON|OFF" checked>
<input type="checkbox" name="zzz" lay-skin="switch" lay-text="开启|关闭">
<input type="checkbox" name="aaa" lay-skin="switch" disabled>
</div>
</div>
</div>
<div class="layui-card layui-form" lay-filter="component-form-element">
<div class="layui-card-header">单选框</div>
<div class="layui-card-body layui-row layui-col-space10">
<div class="layui-col-md12">
<input type="radio" name="sex" value="nan" title="男">
<input type="radio" name="sex" value="nv" title="女" checked>
<input type="radio" name="sex" value="" title="中性" disabled>
</div>
</div>
</div>
</div>
<div class="layui-col-md6">
<div class="layui-card">
<div class="layui-card-header">文本域</div>
<div class="layui-card-body layui-row layui-col-space10">
<div class="layui-col-md12">
<textarea name="" placeholder="请输入" class="layui-textarea"></textarea>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">响应式组合</div>
<div class="layui-card-body">
<form class="layui-form" action="" lay-filter="component-form-element">
<div class="layui-row layui-col-space10 layui-form-item">
<div class="layui-col-lg6">
<label class="layui-form-label">员工姓名:</label>
<div class="layui-input-block">
<input type="text" name="fullname" lay-verify="required" placeholder="" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-col-lg6">
<label class="layui-form-label">技术工种:</label>
<div class="layui-input-block">
<select name="type" lay-verify="required" lay-filter="aihao">
<option value=""></option>
<option value="0">前端工程师</option>
<option value="1">Node.js工程师</option>
<option value="2">PHP工程师</option>
<option value="3">Java工程师</option>
<option value="4">运维</option>
<option value="4">视觉设计师</option>
</select>
</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">兴趣爱好:</label>
<div class="layui-input-block">
<input type="checkbox" name="interest[write]" title="写作">
<input type="checkbox" name="interest[read]" title="阅读">
<input type="checkbox" name="interest[code]" title="代码" checked>
<input type="checkbox" name="interest[dreaming]" title="做梦">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">是否婚姻:</label>
<div class="layui-input-block">
<input type="checkbox" name="marriage" lay-skin="switch" lay-text="是|否">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">所属职称:</label>
<div class="layui-input-block">
<input type="radio" name="role" value="" title="经理">
<input type="radio" name="role" value="" title="主管">
<input type="radio" name="role" value="" title="码农" checked>
<input type="radio" name="role" value="" title="端水">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">其它信息:</label>
<div class="layui-input-block">
<textarea name="other" placeholder="" class="layui-textarea"></textarea>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label"> </label>
<div class="layui-input-block">
<input type="checkbox" name="agreement" title="同意" lay-skin="primary" checked>
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn" lay-submit lay-filter="component-form-element">立即提交</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<script src="../lib/layui/layui.js"></script>
<script>
layui.config({
base: '../../../layuiadmin/' //静态资源所在路径
}).extend({
index: 'lib/index' //主入口模块
}).use(['index', 'form'], function(){
var $ = layui.$
,admin = layui.admin
,element = layui.element
,form = layui.form;
form.render(null, 'component-form-element');
element.render('breadcrumb', 'breadcrumb');
form.on('submit(component-form-element)', function(data){
layer.msg(JSON.stringify(data.field));
return false;
});
});
</script>
</body>
</html>

@ -0,0 +1,315 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="form-wrap" >
<div class="layui-fluid">
<div class="layui-card">
<div class="layui-card-header">表单组合</div>
<div class="layui-card-body" style="padding: 15px;">
<form class="layui-form" action="" lay-filter="component-form-group">
<div class="layui-form-item">
<label class="layui-form-label">单行输入框</label>
<div class="layui-input-block">
<input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="请输入标题" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">验证必填项</label>
<div class="layui-input-block">
<input type="text" name="username" lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">验证手机</label>
<div class="layui-input-inline">
<input type="tel" name="phone" lay-verify="required|phone" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">验证邮箱</label>
<div class="layui-input-inline">
<input type="text" name="email" lay-verify="email" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">多规则验证</label>
<div class="layui-input-inline">
<input type="text" name="number" lay-verify="required|number" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">验证日期</label>
<div class="layui-input-inline">
<input type="text" name="date" id="LAY-component-form-group-date" lay-verify="date" placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input" lay-key="1">
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">验证链接</label>
<div class="layui-input-inline">
<input type="tel" name="url" lay-verify="url" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">验证身份证</label>
<div class="layui-input-block">
<input type="text" name="identity" lay-verify="identity" placeholder="" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">自定义验证</label>
<div class="layui-input-inline">
<input type="password" name="password" lay-verify="pass" placeholder="请输入密码" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">请填写6到12位密码</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">范围</label>
<div class="layui-input-inline" style="width: 100px;">
<input type="text" name="price_min" placeholder="¥" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid">-</div>
<div class="layui-input-inline" style="width: 100px;">
<input type="text" name="price_max" placeholder="¥" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">单行选择框</label>
<div class="layui-input-block">
<select name="interest" lay-filter="aihao">
<option value=""></option>
<option value="0">写作</option>
<option value="1" selected="">阅读</option>
<option value="2">游戏</option>
<option value="3">音乐</option>
<option value="4">旅行</option>
</select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input type="text" placeholder="请选择" value="阅读" readonly class="layui-input layui-unselect"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="" class="layui-select-tips">请选择</dd><dd lay-value="0" class="">写作</dd><dd lay-value="1" class="layui-this">阅读</dd><dd lay-value="2" class="">游戏</dd><dd lay-value="3" class="">音乐</dd><dd lay-value="4" class="">旅行</dd></dl></div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">分组选择框</label>
<div class="layui-input-inline">
<select name="quiz">
<option value="">请选择问题</option>
<optgroup label="城市记忆">
<option value="你工作的第一个城市">你工作的第一个城市</option>
</optgroup>
<optgroup label="学生时代">
<option value="你的工号">你的工号</option>
<option value="你最喜欢的老师">你最喜欢的老师</option>
</optgroup>
</select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input type="text" placeholder="请选择问题" value="" readonly class="layui-input layui-unselect"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit layui-select-group"><dd lay-value="" class="layui-select-tips">请选择问题</dd><dt>城市记忆</dt><dd lay-value="你工作的第一个城市" class="">你工作的第一个城市</dd><dt>学生时代</dt><dd lay-value="你的工号" class="">你的工号</dd><dd lay-value="你最喜欢的老师" class="">你最喜欢的老师</dd></dl></div>
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">搜索选择框</label>
<div class="layui-input-inline">
<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>
<option value="11">code</option>
<option value="12">tree</option>
<option value="13">layedit</option>
<option value="14">nav</option>
<option value="15">tab</option>
<option value="16">table</option>
<option value="17">select</option>
<option value="18">checkbox</option>
<option value="19">switch</option>
<option value="20">radio</option>
</select><div class="layui-form-select"><div class="layui-select-title"><input type="text" placeholder="直接选择或搜索选择" value="" class="layui-input"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="" class="layui-select-tips">直接选择或搜索选择</dd><dd lay-value="1" class="">layer</dd><dd lay-value="2" class="">form</dd><dd lay-value="3" class="">layim</dd><dd lay-value="4" class="">element</dd><dd lay-value="5" class="">laytpl</dd><dd lay-value="6" class="">upload</dd><dd lay-value="7" class="">laydate</dd><dd lay-value="8" class="">laypage</dd><dd lay-value="9" class="">flow</dd><dd lay-value="10" class="">util</dd><dd lay-value="11" class="">code</dd><dd lay-value="12" class="">tree</dd><dd lay-value="13" class="">layedit</dd><dd lay-value="14" class="">nav</dd><dd lay-value="15" class="">tab</dd><dd lay-value="16" class="">table</dd><dd lay-value="17" class="">select</dd><dd lay-value="18" class="">checkbox</dd><dd lay-value="19" class="">switch</dd><dd lay-value="20" class="">radio</dd></dl></div>
</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">联动选择框</label>
<div class="layui-input-block">
<div class="layui-inline">
<select name="quiz1">
<option value="">请选择省</option>
<option value="浙江" selected="">浙江省</option>
<option value="你的工号">江西省</option>
<option value="你最喜欢的老师">福建省</option>
</select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input type="text" placeholder="请选择省" value="浙江省" readonly class="layui-input layui-unselect"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="" class="layui-select-tips">请选择省</dd><dd lay-value="浙江" class="layui-this">浙江省</dd><dd lay-value="你的工号" class="">江西省</dd><dd lay-value="你最喜欢的老师" class="">福建省</dd></dl></div>
</div>
<div class="layui-inline">
<select name="quiz2">
<option value="">请选择市</option>
<option value="杭州">杭州</option>
<option value="宁波" disabled="">宁波</option>
<option value="温州">温州</option>
<option value="温州">台州</option>
<option value="温州">绍兴</option>
</select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input type="text" placeholder="请选择市" value="" readonly class="layui-input layui-unselect"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="" class="layui-select-tips">请选择市</dd><dd lay-value="杭州" class="">杭州</dd><dd lay-value="宁波" class=" layui-disabled">宁波</dd><dd lay-value="温州" class="">温州</dd><dd lay-value="温州" class="">台州</dd><dd lay-value="温州" class="">绍兴</dd></dl></div>
</div>
<div class="layui-inline">
<select name="quiz3">
<option value="">请选择县/区</option>
<option value="西湖区">西湖区</option>
<option value="余杭区">余杭区</option>
<option value="拱墅区">临安市</option>
</select><div class="layui-unselect layui-form-select"><div class="layui-select-title"><input type="text" placeholder="请选择县/区" value="" readonly class="layui-input layui-unselect"><i class="layui-edge"></i></div><dl class="layui-anim layui-anim-upbit"><dd lay-value="" class="layui-select-tips">请选择县/区</dd><dd lay-value="西湖区" class="">西湖区</dd><dd lay-value="余杭区" class="">余杭区</dd><dd lay-value="拱墅区" class="">临安市</dd></dl></div>
</div>
<div class="layui-inline">
<div class="layui-form-mid layui-word-aux">此处只是演示联动排版,并未做联动交互</div>
</div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">复选框</label>
<div class="layui-input-block">
<input type="checkbox" name="like[write]" title="写作"><div class="layui-unselect layui-form-checkbox"><span>写作</span><i class="layui-icon layui-icon-ok"></i></div>
<input type="checkbox" name="like[read]" title="阅读" checked=""><div class="layui-unselect layui-form-checkbox layui-form-checked"><span>阅读</span><i class="layui-icon layui-icon-ok"></i></div>
<input type="checkbox" name="like[game]" title="游戏"><div class="layui-unselect layui-form-checkbox"><span>游戏</span><i class="layui-icon layui-icon-ok"></i></div>
</div>
</div>
<div class="layui-form-item" pane="">
<label class="layui-form-label">原始复选框</label>
<div class="layui-input-block">
<input type="checkbox" name="like1[write]" lay-skin="primary" title="写作" checked=""><div class="layui-unselect layui-form-checkbox layui-form-checked" lay-skin="primary"><span>写作</span><i class="layui-icon layui-icon-ok"></i></div>
<input type="checkbox" name="like1[read]" lay-skin="primary" title="阅读"><div class="layui-unselect layui-form-checkbox" lay-skin="primary"><span>阅读</span><i class="layui-icon layui-icon-ok"></i></div>
<input type="checkbox" name="like1[game]" lay-skin="primary" title="游戏" disabled=""><div class="layui-unselect layui-form-checkbox layui-checkbox-disbaled layui-disabled" lay-skin="primary"><span>游戏</span><i class="layui-icon layui-icon-ok"></i></div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">开关-默认关</label>
<div class="layui-input-block">
<input type="checkbox" name="close" lay-skin="switch" lay-text="ON|OFF"><div class="layui-unselect layui-form-switch" lay-skin="_switch"><em>OFF</em><i></i></div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">开关-默认开</label>
<div class="layui-input-block">
<input type="checkbox" checked="" name="open" lay-skin="switch" lay-filter="component-form-switchTest" lay-text="ON|OFF"><div class="layui-unselect layui-form-switch layui-form-onswitch" lay-skin="_switch"><em>ON</em><i></i></div>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">单选框</label>
<div class="layui-input-block">
<input type="radio" name="sex" value="男" title="男" checked=""><div class="layui-unselect layui-form-radio layui-form-radioed"><i class="layui-anim layui-icon"></i><div></div></div>
<input type="radio" name="sex" value="女" title="女"><div class="layui-unselect layui-form-radio"><i class="layui-anim layui-icon"></i><div></div></div>
<input type="radio" name="sex" value="禁" title="禁用" disabled=""><div class="layui-unselect layui-form-radio layui-radio-disbaled layui-disabled"><i class="layui-anim layui-icon"></i><div>禁用</div></div>
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">普通文本域</label>
<div class="layui-input-block">
<textarea name="text" placeholder="请输入内容" class="layui-textarea"></textarea>
</div>
</div>
<div class="layui-form-item layui-layout-admin">
<div class="layui-input-block">
<div class="layui-footer" style="left: 0;">
<button class="layui-btn" lay-submit="" lay-filter="component-form-demo1">立即提交</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<script>
layui.config({
base: '../../../layuiadmin/' //静态资源所在路径
}).extend({
index: 'lib/index' //主入口模块
}).use(['index', 'form', 'laydate'], function(){
var $ = layui.$
,admin = layui.admin
,element = layui.element
,layer = layui.layer
,laydate = layui.laydate
,form = layui.form;
form.render(null, 'component-form-group');
laydate.render({
elem: '#LAY-component-form-group-date'
});
/* 自定义验证规则 */
form.verify({
title: function(value){
if(value.length < 5){
return '标题至少得5个字符啊';
}
}
,pass: [/(.+){6,12}$/, '密码必须6到12位']
,content: function(value){
layedit.sync(editIndex);
}
});
/* 监听指定开关 */
form.on('switch(component-form-switchTest)', function(data){
layer.msg('开关checked'+ (this.checked ? 'true' : 'false'), {
offset: '6px'
});
layer.tips('温馨提示请注意开关状态的文字可以随意定义而不仅仅是ON|OFF', data.othis)
});
/* 监听提交 */
form.on('submit(component-form-demo1)', function(data){
parent.layer.alert(JSON.stringify(data.field), {
title: '最终的提交信息'
})
return false;
});
});
</script>
<style id="LAY_layadmin_theme">.layui-side-menu,.layadmin-pagetabs .layui-tab-title li:after,.layadmin-pagetabs .layui-tab-title li.layui-this:after,.layui-layer-admin .layui-layer-title,.layadmin-side-shrink .layui-side-menu .layui-nav>.layui-nav-item>.layui-nav-child{background-color:#20222A !important;}.layui-nav-tree .layui-this,.layui-nav-tree .layui-this>a,.layui-nav-tree .layui-nav-child dd.layui-this,.layui-nav-tree .layui-nav-child dd.layui-this a{background-color:#009688 !important;}.layui-layout-admin .layui-logo{background-color:#20222A !important;}</style>
</body>
</html>

@ -0,0 +1,311 @@
<!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 name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" type="text/css" href="../lib/layui/css/global.css">
<link rel="stylesheet" type="text/css" href="../lib/layui/css/layui.css">
<!-- 注意如果你直接复制所有代码到本地上述css路径需要改成你本地的 -->
</head>
<body class="">
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<div class="layui-container">
<blockquote class="layui-elem-quote">注意:下述演示中的颜色只是做一个区分作用,并非栅格内置。</blockquote>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
<legend>始终等比例水平排列</legend>
</fieldset>
<div class="layui-row">
<div class="layui-col-xs6">
<div class="grid-demo grid-demo-bg1">6/12</div>
</div>
<div class="layui-col-xs6">
<div class="grid-demo">6/12</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-xs3">
<div class="grid-demo grid-demo-bg1">3/12</div>
</div>
<div class="layui-col-xs3">
<div class="grid-demo">3/12</div>
</div>
<div class="layui-col-xs3">
<div class="grid-demo grid-demo-bg1">3/12</div>
</div>
<div class="layui-col-xs3">
<div class="grid-demo">3/12</div>
</div>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
<legend>移动设备、桌面端的组合响应式展现</legend>
</fieldset>
<div class="layui-row">
<div class="layui-col-xs12 layui-col-md8">
<div class="grid-demo grid-demo-bg1">移动12/12、桌面8/12</div>
</div>
<div class="layui-col-xs6 layui-col-md4">
<div class="grid-demo">移动6/12、桌面4/12</div>
</div>
<div class="layui-col-xs6 layui-col-md12">
<div class="grid-demo grid-demo-bg2">移动6/12、桌面12/12</div>
</div>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>移动设备、平板、桌面端的复杂组合响应式展现</legend>
</fieldset>
<div class="layui-row">
<div class="layui-col-xs6 layui-col-sm6 layui-col-md4">
<div class="grid-demo grid-demo-bg1">移动6/12 | 平板6/12 | 桌面4/12</div>
</div>
<div class="layui-col-xs6 layui-col-sm6 layui-col-md4">
<div class="grid-demo layui-bg-red">移动6/12 | 平板6/12 | 桌面4/12</div>
</div>
<div class="layui-col-xs4 layui-col-sm12 layui-col-md4">
<div class="grid-demo layui-bg-blue">移动4/12 | 平板12/12 | 桌面4/12</div>
</div>
<div class="layui-col-xs4 layui-col-sm7 layui-col-md8">
<div class="grid-demo layui-bg-green">移动4/12 | 平板7/12 | 桌面8/12</div>
</div>
<div class="layui-col-xs4 layui-col-sm5 layui-col-md4">
<div class="grid-demo layui-bg-black">移动4/12 | 平板5/12 | 桌面4/12</div>
</div>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>常规布局:从小屏幕堆叠到桌面水平排列</legend>
</fieldset>
<div class="layui-row">
<div class="layui-col-md1">
<div class="grid-demo grid-demo-bg1">1/12</div>
</div>
<div class="layui-col-md1">
<div class="grid-demo">1/12</div>
</div>
<div class="layui-col-md1">
<div class="grid-demo grid-demo-bg1">1/12</div>
</div>
<div class="layui-col-md1">
<div class="grid-demo">1/12</div>
</div>
<div class="layui-col-md1">
<div class="grid-demo grid-demo-bg1">1/12</div>
</div>
<div class="layui-col-md1">
<div class="grid-demo">1/12</div>
</div>
<div class="layui-col-md1">
<div class="grid-demo grid-demo-bg1">1/12</div>
</div>
<div class="layui-col-md1">
<div class="grid-demo">1/12</div>
</div>
<div class="layui-col-md1">
<div class="grid-demo grid-demo-bg1">1/12</div>
</div>
<div class="layui-col-md1">
<div class="grid-demo">1/12</div>
</div>
<div class="layui-col-md1">
<div class="grid-demo grid-demo-bg1">1/12</div>
</div>
<div class="layui-col-md1">
<div class="grid-demo">1/12</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md9">
<div class="grid-demo grid-demo-bg1">75%</div>
</div>
<div class="layui-col-md3">
<div class="grid-demo">25%</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md4">
<div class="grid-demo grid-demo-bg1">33.33%</div>
</div>
<div class="layui-col-md4">
<div class="grid-demo">33.33%</div>
</div>
<div class="layui-col-md4">
<div class="grid-demo grid-demo-bg1">33.33%</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md6">
<div class="grid-demo grid-demo-bg1">50%</div>
</div>
<div class="layui-col-md6">
<div class="grid-demo">50%</div>
</div>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>列间隔</legend>
</fieldset>
<div class="layui-row layui-col-space1">
<div class="layui-col-md3">
<div class="grid-demo grid-demo-bg1">1/4</div>
</div>
<div class="layui-col-md3">
<div class="grid-demo">1/4</div>
</div>
<div class="layui-col-md3">
<div class="grid-demo grid-demo-bg1">1/4</div>
</div>
<div class="layui-col-md3">
<div class="grid-demo">1/4</div>
</div>
</div>
<div class="layui-row layui-col-space5">
<div class="layui-col-md4">
<div class="grid-demo grid-demo-bg1">1/3</div>
</div>
<div class="layui-col-md4">
<div class="grid-demo">1/3</div>
</div>
<div class="layui-col-md4">
<div class="grid-demo grid-demo-bg1">1/3</div>
</div>
</div>
<div class="layui-row layui-col-space10">
<div class="layui-col-md9">
<div class="grid-demo grid-demo-bg1">9/12</div>
</div>
<div class="layui-col-md3">
<div class="grid-demo">3/12</div>
</div>
</div>
<div class="layui-row layui-col-space15">
<div class="layui-col-md7">
<div class="grid-demo grid-demo-bg1">7/12</div>
</div>
<div class="layui-col-md5">
<div class="grid-demo">5/12</div>
</div>
</div>
<div class="layui-row layui-col-space30">
<div class="layui-col-md7">
<div class="grid-demo grid-demo-bg1">7/12</div>
</div>
<div class="layui-col-md5">
<div class="grid-demo">5/12</div>
</div>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>列偏移</legend>
</fieldset>
<div class="layui-row">
<div class="layui-col-md4">
<div class="grid-demo grid-demo-bg1">4/12</div>
</div>
<div class="layui-col-md4 layui-col-md-offset4">
<div class="grid-demo">偏移4列</div>
</div>
<div class="layui-col-md1 layui-col-md-offset5">
<div class="grid-demo grid-demo-bg1">偏移5列</div>
</div>
<div class="layui-col-md1">
<div class="grid-demo">不偏移</div>
</div>
</div>
<div class="layui-row">
<div class="layui-col-md3 layui-col-md-offset3">
<div class="grid-demo grid-demo-bg1">偏移3列</div>
</div>
<div class="layui-col-md3 layui-col-md-offset1">
<div class="grid-demo">偏移1列</div>
</div>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>栅格嵌套</legend>
</fieldset>
<div class="layui-row">
<div class="layui-col-md5">
<div class="layui-row grid-demo">
<div class="layui-col-md3">
<div class="grid-demo grid-demo-bg1">内部列</div>
</div>
<div class="layui-col-md9">
<div class="grid-demo grid-demo-bg2">内部列</div>
</div>
<div class="layui-col-md12">
<div class="grid-demo grid-demo-bg3">内部列</div>
</div>
</div>
</div>
<div class="layui-col-md7">
<div class="layui-row grid-demo grid-demo-bg1">
<div class="layui-col-md12">
<div class="grid-demo">内部列</div>
</div>
<div class="layui-col-md9">
<div class="grid-demo grid-demo-bg2">内部列</div>
</div>
<div class="layui-col-md3">
<div class="grid-demo grid-demo-bg3">内部列</div>
</div>
</div>
</div>
</div>
</div>
<div class="layui-fluid">
<fieldset class="layui-elem-field layui-field-title">
<legend>流体容器(宽度自适应,不固定)</legend>
</fieldset>
<div class="layui-row">
<div class="layui-col-sm3">
<div class="grid-demo grid-demo-bg1">25%</div>
</div>
<div class="layui-col-sm3">
<div class="grid-demo">25%</div>
</div>
<div class="layui-col-sm3">
<div class="grid-demo grid-demo-bg1">25%</div>
</div>
<div class="layui-col-sm3">
<div class="grid-demo">25%</div>
</div>
</div>
</div>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<!-- 注意如果你直接复制所有代码到本地上述js路径需要改成你本地的 -->
<script>
</script>
</body>
</html>

@ -0,0 +1,116 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="x-body layui-anim layui-anim-up">
<form class="layui-form">
<div class="layui-form-item">
<label for="L_email" class="layui-form-label">
<span class="x-red">*</span>邮箱
</label>
<div class="layui-input-inline">
<input type="text" id="L_email" name="email" required lay-verify="email"
autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">
<span class="x-red">*</span>将会成为您唯一的登入名
</div>
</div>
<div class="layui-form-item">
<label for="L_username" class="layui-form-label">
<span class="x-red">*</span>昵称
</label>
<div class="layui-input-inline">
<input type="text" id="L_username" name="username" required lay-verify="nikename"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="L_pass" class="layui-form-label">
<span class="x-red">*</span>密码
</label>
<div class="layui-input-inline">
<input type="password" id="L_pass" name="pass" required lay-verify="pass"
autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">
6到16个字符
</div>
</div>
<div class="layui-form-item">
<label for="L_repass" class="layui-form-label">
<span class="x-red">*</span>确认密码
</label>
<div class="layui-input-inline">
<input type="password" id="L_repass" name="repass" required lay-verify="repass"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="L_repass" class="layui-form-label">
</label>
<button class="layui-btn" lay-filter="add" lay-submit="">
增加
</button>
</div>
</form>
</div>
<script>
layui.use(['form','layer'], function(){
$ = layui.jquery;
var form = layui.form
,layer = layui.layer;
//自定义验证规则
form.verify({
nikename: function(value){
if(value.length < 5){
return '昵称至少得5个字符啊';
}
}
,pass: [/(.+){6,12}$/, '密码必须6到12位']
,repass: function(value){
if($('#L_pass').val()!=$('#L_repass').val()){
return '两次密码不一致';
}
}
});
//监听提交
form.on('submit(add)', function(data){
console.log(data);
//发异步把数据提交给php
layer.alert("增加成功", {icon: 6},function () {
// 获得frame索引
var index = parent.layer.getFrameIndex(window.name);
//关闭当前frame
parent.layer.close(index);
});
return false;
});
});
</script>
</body>
</html>

@ -0,0 +1,166 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="x-nav">
<span class="layui-breadcrumb">
<a href="">首页</a>
<a href="">演示</a>
<a>
<cite>导航元素</cite></a>
</span>
<a class="layui-btn layui-btn-primary layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
<i class="layui-icon" style="line-height:38px"></i></a>
</div>
<div class="x-body">
<div class="layui-row">
<form class="layui-form layui-col-md12 x-so">
<input class="layui-input" placeholder="开始日" name="start" id="start">
<input class="layui-input" placeholder="截止日" name="end" id="end">
<input type="text" name="username" placeholder="请输入用户名" autocomplete="off" class="layui-input">
<button class="layui-btn" lay-submit="" lay-filter="sreach"><i class="layui-icon">&#xe615;</i></button>
</form>
</div>
<xblock>
<button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量恢复</button>
<span class="x-right" style="line-height:40px">共有数据88 条</span>
</xblock>
<table class="layui-table">
<thead>
<tr>
<th>
<div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
</th>
<th>ID</th>
<th>用户名</th>
<th>性别</th>
<th>手机</th>
<th>邮箱</th>
<th>地址</th>
<th>加入时间</th>
<th>状态</th>
<th>操作</th></tr>
</thead>
<tbody>
<tr>
<td>
<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i class="layui-icon">&#xe605;</i></div>
</td>
<td>1</td>
<td>小明</td>
<td></td>
<td>13000000000</td>
<td>admin@mail.com</td>
<td>北京市 海淀区</td>
<td>2017-01-01 11:11:42</td>
<td class="td-status">
<span class="layui-btn layui-btn-danger layui-btn-mini">
已删除
</span>
<td class="td-manage">
<a title="恢复" onclick="member_del(this,'要删除的id')" href="javascript:;">
<i class="layui-icon">&#xe618;</i>
</a>
<a title="删除" onclick="member_del(this,'要删除的id')" href="javascript:;">
<i class="layui-icon">&#xe640;</i>
</a>
</td>
</tr>
<tr>
<td>
<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i class="layui-icon">&#xe605;</i></div>
</td>
<td>1</td>
<td>小明</td>
<td></td>
<td>13000000000</td>
<td>admin@mail.com</td>
<td>北京市 海淀区</td>
<td>2017-01-01 11:11:42</td>
<td class="td-status">
<span class="layui-btn layui-btn-danger layui-btn-mini">
已删除
</span>
<td class="td-manage">
<a title="恢复" onclick="member_del(this,'要删除的id')" href="javascript:;">
<i class="layui-icon">&#xe618;</i>
</a>
<a title="删除" onclick="member_del(this,'要删除的id')" href="javascript:;">
<i class="layui-icon">&#xe640;</i>
</a>
</td>
</tr>
</tbody>
</table>
<div class="page">
<div>
<a class="prev" href="">&lt;&lt;</a>
<a class="num" href="">1</a>
<span class="current">2</span>
<a class="num" href="">3</a>
<a class="num" href="">489</a>
<a class="next" href="">&gt;&gt;</a>
</div>
</div>
</div>
<script>
layui.use('laydate', function(){
var laydate = layui.laydate;
//执行一个laydate实例
laydate.render({
elem: '#start' //指定元素
});
//执行一个laydate实例
laydate.render({
elem: '#end' //指定元素
});
});
/*用户-删除*/
function member_del(obj,id){
layer.confirm('确认要删除吗?',function(index){
//发异步删除数据
$(obj).parents("tr").remove();
layer.msg('已删除!',{icon:1,time:1000});
});
}
function delAll (argument) {
var data = tableCheck.getData();
layer.confirm('确认要恢复吗?'+data,function(index){
//捉到所有被选中的,发异步进行删除
layer.msg('恢复成功', {icon: 1});
$(".layui-form-checked").not('.header').parents('tr').remove();
});
}
</script>
</body>
</html>

@ -0,0 +1,116 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="x-body">
<form class="layui-form">
<div class="layui-form-item">
<label for="L_email" class="layui-form-label">
<span class="x-red">*</span>邮箱
</label>
<div class="layui-input-inline">
<input type="text" id="L_email" name="email" required lay-verify="email"
autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">
<span class="x-red">*</span>将会成为您唯一的登入名
</div>
</div>
<div class="layui-form-item">
<label for="L_username" class="layui-form-label">
<span class="x-red">*</span>昵称
</label>
<div class="layui-input-inline">
<input type="text" id="L_username" name="username" required lay-verify="nikename"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="L_pass" class="layui-form-label">
<span class="x-red">*</span>密码
</label>
<div class="layui-input-inline">
<input type="password" id="L_pass" name="pass" required lay-verify="pass"
autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">
6到16个字符
</div>
</div>
<div class="layui-form-item">
<label for="L_repass" class="layui-form-label">
<span class="x-red">*</span>确认密码
</label>
<div class="layui-input-inline">
<input type="password" id="L_repass" name="repass" required lay-verify="repass"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="L_repass" class="layui-form-label">
</label>
<button class="layui-btn" lay-filter="add" lay-submit="">
增加
</button>
</div>
</form>
</div>
<script>
layui.use(['form','layer'], function(){
$ = layui.jquery;
var form = layui.form
,layer = layui.layer;
//自定义验证规则
form.verify({
nikename: function(value){
if(value.length < 5){
return '昵称至少得5个字符啊';
}
}
,pass: [/(.+){6,12}$/, '密码必须6到12位']
,repass: function(value){
if($('#L_pass').val()!=$('#L_repass').val()){
return '两次密码不一致';
}
}
});
//监听提交
form.on('submit(add)', function(data){
console.log(data);
//发异步把数据提交给php
layer.alert("增加成功", {icon: 6},function () {
// 获得frame索引
var index = parent.layer.getFrameIndex(window.name);
//关闭当前frame
parent.layer.close(index);
});
return false;
});
});
</script>
</body>
</html>

File diff suppressed because it is too large Load Diff

@ -0,0 +1,97 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="x-body">
<form class="layui-form">
<div class="layui-form-item">
<label for="L_username" class="layui-form-label">
昵称
</label>
<div class="layui-input-inline">
<input type="text" id="L_username" name="username" disabled="" value="小明" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="L_repass" class="layui-form-label">
<span class="x-red">*</span>旧密码
</label>
<div class="layui-input-inline">
<input type="password" id="L_repass" name="oldpass" required lay-verify="required"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="L_pass" class="layui-form-label">
<span class="x-red">*</span>新密码
</label>
<div class="layui-input-inline">
<input type="password" id="L_pass" name="newpass" required lay-verify="required"
autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">
6到16个字符
</div>
</div>
<div class="layui-form-item">
<label for="L_repass" class="layui-form-label">
<span class="x-red">*</span>确认密码
</label>
<div class="layui-input-inline">
<input type="password" id="L_repass" name="repass" required lay-verify="required"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="L_repass" class="layui-form-label">
</label>
<button class="layui-btn" lay-filter="save" lay-submit="">
增加
</button>
</div>
</form>
</div>
<script>
layui.use(['form','layer'], function(){
$ = layui.jquery;
var form = layui.form
,layer = layui.layer;
//监听提交
form.on('submit(save)', function(data){
console.log(data);
//发异步把数据提交给php
layer.alert("修改成功", {icon: 6},function () {
// 获得frame索引
var index = parent.layer.getFrameIndex(window.name);
//关闭当前frame
parent.layer.close(index);
});
return false;
});
});
</script>
</body>
</html>

@ -0,0 +1,234 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" type="text/css" href="../lib/layui/css/layui.css">
<script src="../js/jquery.min.js"></script>
<script src="../lib/layui/layui.js"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class=" layui-fluid">
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>水平导航菜单</legend>
</fieldset>
<ul class="layui-nav">
<li class="layui-nav-item"><a href="">最新活动</a></li>
<li class="layui-nav-item layui-this">
<a href="javascript:;">产品</a>
<dl class="layui-nav-child">
<dd><a href="">选项1</a></dd>
<dd><a href="">选项2</a></dd>
<dd><a href="">选项3</a></dd>
</dl>
</li>
<li class="layui-nav-item"><a href="">大数据</a></li>
<li class="layui-nav-item">
<a href="javascript:;">解决方案</a>
<dl class="layui-nav-child">
<dd><a href="">移动模块</a></dd>
<dd><a href="">后台模版</a></dd>
<dd class="layui-this"><a href="">选中项</a></dd>
<dd><a href="">电商平台</a></dd>
</dl>
</li>
<li class="layui-nav-item"><a href="">社区</a></li>
</ul>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>导航带徽章和图片</legend>
</fieldset>
<ul class="layui-nav">
<li class="layui-nav-item">
<a href="">控制台<span class="layui-badge">9</span></a>
</li>
<li class="layui-nav-item">
<a href="">个人中心<span class="layui-badge-dot"></span></a>
</li>
<li class="layui-nav-item" lay-unselect="">
<a href="javascript:;"><img src="../images/pic/1.png" class="layui-nav-img"></a>
<dl class="layui-nav-child">
<dd><a href="javascript:;">修改信息</a></dd>
<dd><a href="javascript:;">安全管理</a></dd>
<dd><a href="javascript:;">退了</a></dd>
</dl>
</li>
</ul>
<div style="margin-top: 15px;">
<!-- 示例-970 -->
<ins class="adsbygoogle" style="display:inline-block;width:970px;height:90px" data-ad-client="ca-pub-6111334333458862" data-ad-slot="3820120620"></ins>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>更多导航主题</legend>
</fieldset>
<ul class="layui-nav layui-bg-cyan">
<li class="layui-nav-item"><a href="">藏青导航</a></li>
<li class="layui-nav-item layui-this"><a href="">产品</a></li>
<li class="layui-nav-item"><a href="">大数据</a></li>
<li class="layui-nav-item">
<a href="javascript:;">解决方案</a>
<dl class="layui-nav-child">
<dd><a href="">移动模块</a></dd>
<dd><a href="">后台模版</a></dd>
<dd><a href="">电商平台</a></dd>
</dl>
</li>
<li class="layui-nav-item"><a href="">社区</a></li>
</ul>
<br>
<ul class="layui-nav layui-bg-green">
<li class="layui-nav-item"><a href="">墨绿导航</a></li>
<li class="layui-nav-item layui-this"><a href="">产品</a></li>
<li class="layui-nav-item"><a href="">大数据</a></li>
<li class="layui-nav-item">
<a href="javascript:;">解决方案</a>
<dl class="layui-nav-child">
<dd><a href="">移动模块</a></dd>
<dd><a href="">后台模版</a></dd>
<dd><a href="">电商平台</a></dd>
</dl>
</li>
<li class="layui-nav-item"><a href="">社区</a></li>
</ul>
<br>
<ul class="layui-nav layui-bg-blue">
<li class="layui-nav-item"><a href="">艳蓝导航</a></li>
<li class="layui-nav-item layui-this"><a href="">产品</a></li>
<li class="layui-nav-item"><a href="">大数据</a></li>
<li class="layui-nav-item">
<a href="javascript:;">解决方案</a>
<dl class="layui-nav-child">
<dd><a href="">移动模块</a></dd>
<dd><a href="">后台模版</a></dd>
<dd><a href="">电商平台</a></dd>
</dl>
</li>
<li class="layui-nav-item"><a href="">社区</a></li>
</ul>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>垂直导航菜单</legend>
</fieldset>
<ul class="layui-nav layui-nav-tree layui-inline" lay-filter="demo" style="margin-right: 10px;">
<li class="layui-nav-item layui-nav-itemed">
<a href="javascript:;">默认展开</a>
<dl class="layui-nav-child">
<dd><a href="javascript:;">选项一</a></dd>
<dd><a href="javascript:;">选项二</a></dd>
<dd><a href="javascript:;">选项三</a></dd>
<dd><a href="">跳转项</a></dd>
</dl>
</li>
<li class="layui-nav-item">
<a href="javascript:;">解决方案</a>
<dl class="layui-nav-child">
<dd><a href="">移动模块</a></dd>
<dd><a href="">后台模版</a></dd>
<dd><a href="">电商平台</a></dd>
</dl>
</li>
<li class="layui-nav-item"><a href="">云市场</a></li>
<li class="layui-nav-item"><a href="">社区</a></li>
</ul>
<ul class="layui-nav layui-nav-tree layui-bg-cyan layui-inline" lay-filter="demo">
<li class="layui-nav-item layui-nav-itemed">
<a href="javascript:;">默认展开</a>
<dl class="layui-nav-child">
<dd><a href="javascript:;">选项一</a></dd>
<dd><a href="javascript:;">选项二</a></dd>
<dd><a href="javascript:;">选项三</a></dd>
<dd><a href="">跳转项</a></dd>
</dl>
</li>
<li class="layui-nav-item">
<a href="javascript:;">解决方案</a>
<dl class="layui-nav-child">
<dd><a href="">移动模块</a></dd>
<dd><a href="">后台模版</a></dd>
<dd><a href="">电商平台</a></dd>
</dl>
</li>
<li class="layui-nav-item"><a href="">云市场</a></li>
<li class="layui-nav-item"><a href="">社区</a></li>
</ul>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>侧边固定导航菜单</legend>
</fieldset>
← 囖,就左边那家伙! 带图标神马的那是必须可以的。另外你可能还需要下拉菜单,这个将在下版本推出!
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>默认面包屑</legend>
</fieldset>
<span class="layui-breadcrumb">
<a href="/">首页</a>
<a href="/demo/">演示</a>
<a><cite>导航元素</cite></a>
</span>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>自定义分隔符的面包屑</legend>
</fieldset>
<span class="layui-breadcrumb" lay-separator="—">
<a href="">首页</a>
<a href="">国际新闻</a>
<a href="">亚太地区</a>
<a><cite>正文</cite></a>
</span>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>还可以用于门户频道的面包屑</legend>
</fieldset>
<span class="layui-breadcrumb" lay-separator="|">
<a href="">娱乐</a>
<a href="">八卦</a>
<a href="">体育</a>
<a href="">搞笑</a>
<a href="">视频</a>
<a href="">游戏</a>
<a href="">综艺</a>
</span>
<p class="layui-elem-quote">其实就是自定义了个“|”的分隔符,然后最后一项也可以点。</p>
<script src="../lib/layui/layui.js"></script>
<!-- 注意如果你直接复制所有代码到本地上述js路径需要改成你本地的 -->
<script>
layui.use('element', function(){
var element = layui.element; //导航的hover效果、二级菜单等功能需要依赖element模块
//监听导航点击
element.on('nav(demo)', function(elem){
//console.log(elem)
layer.msg(elem.text());
});
});
</script>
</body>
</html>

@ -0,0 +1,179 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="x-body">
<form class="layui-form">
<div class="layui-form-item">
<label for="username" class="layui-form-label">
<span class="x-red">*</span>用户名
</label>
<div class="layui-input-inline">
<input type="text" id="username" name="username" required lay-verify="required"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="username" class="layui-form-label">
<span class="x-red">*</span>收货人
</label>
<div class="layui-input-inline">
<input type="text" id="username" name="username" required lay-verify="required"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="phone" class="layui-form-label">
<span class="x-red">*</span>手机
</label>
<div class="layui-input-inline">
<input type="text" id="phone" name="phone" required lay-verify="phone"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="username" class="layui-form-label">
<span class="x-red">*</span>收货地址
</label>
<div class="layui-input-inline">
<input type="text" id="username" name="username" required lay-verify="required"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label for="username" class="layui-form-label">
<span class="x-red">*</span>配送物流
</label>
<div class="layui-input-inline">
<select id="shipping" name="shipping" class="valid">
<option value="shentong">申通物流</option>
<option value="shunfeng">顺丰物流</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label for="username" class="layui-form-label">
<span class="x-red">*</span>支付方式
</label>
<div class="layui-input-inline">
<select name="contrller">
<option>支付方式</option>
<option>支付宝</option>
<option>微信</option>
<option>货到付款</option>
</select>
</div>
</div>
<div class="layui-form-item">
<label for="L_email" class="layui-form-label">
<span class="x-red">*</span>发票抬头
</label>
<div class="layui-input-inline">
<input type="text" id="L_email" name="email" required lay-verify="email"
autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid layui-word-aux">
<span class="x-red">*</span>
</div>
</div>
<div class="layui-form-item layui-form-text">
<label for="desc" class="layui-form-label">
商品增加
</label>
<div class="layui-input-block">
<table class="layui-table">
<tbody>
<tr>
<td>haier海尔 BC-93TMPF 93升单门冰箱</td>
<td>0.01</td>
<td>984</td>
<td>1</td>
<td>删除</td>
</tr>
<tr>
<td>haier海尔 BC-93TMPF 93升单门冰箱</td>
<td>0.01</td>
<td>984</td>
<td>1</td>
<td>删除</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="layui-form-item layui-form-text">
<label for="desc" class="layui-form-label">
描述
</label>
<div class="layui-input-block">
<textarea placeholder="请输入内容" id="desc" name="desc" class="layui-textarea"></textarea>
</div>
</div>
<div class="layui-form-item">
<label for="L_repass" class="layui-form-label">
</label>
<button class="layui-btn" lay-filter="add" lay-submit="">
增加
</button>
</div>
</form>
</div>
<script>
layui.use(['form','layer'], function(){
$ = layui.jquery;
var form = layui.form
,layer = layui.layer;
//自定义验证规则
form.verify({
nikename: function(value){
if(value.length < 5){
return '昵称至少得5个字符啊';
}
}
,pass: [/(.+){6,12}$/, '密码必须6到12位']
,repass: function(value){
if($('#L_pass').val()!=$('#L_repass').val()){
return '两次密码不一致';
}
}
});
//监听提交
form.on('submit(add)', function(data){
console.log(data);
//发异步把数据提交给php
layer.alert("增加成功", {icon: 6},function () {
// 获得frame索引
var index = parent.layer.getFrameIndex(window.name);
//关闭当前frame
parent.layer.close(index);
});
return false;
});
});
</script>
</body>
</html>

@ -0,0 +1,194 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script><!-- layui懒人UI -->
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="x-nav">
<span class="layui-breadcrumb">
<a href="">首页</a>
<a href="">演示</a>
<a>
<cite>导航元素</cite></a>
</span>
<a class="layui-btn layui-btn-primary layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
<i class="layui-icon" style="line-height:38px"></i></a>
</div>
<div class="x-body">
<div class="layui-row">
<form class="layui-form layui-col-md12 x-so">
<input class="layui-input" placeholder="开始日" name="start" id="start">
<input class="layui-input" placeholder="截止日" name="end" id="end">
<div class="layui-input-inline">
<select name="contrller">
<option>支付状态</option>
<option>已支付</option>
<option>未支付</option>
</select>
</div>
<div class="layui-input-inline">
<select name="contrller">
<option>支付方式</option>
<option>支付宝</option>
<option>微信</option>
<option>货到付款</option>
</select>
</div>
<div class="layui-input-inline">
<select name="contrller">
<option value="">订单状态</option>
<option value="0">待确认</option>
<option value="1">已确认</option>
<option value="2">已收货</option>
<option value="3">已取消</option>
<option value="4">已完成</option>
<option value="5">已作废</option>
</select>
</div>
<input type="text" name="username" placeholder="请输入订单号" autocomplete="off" class="layui-input">
<button class="layui-btn" lay-submit="" lay-filter="sreach"><i class="layui-icon">&#xe615;</i></button>
</form>
</div>
<xblock>
<button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>
<button class="layui-btn" onclick="x_admin_show('添加用户','./order-add.html')"><i class="layui-icon"></i>添加</button>
<span class="x-right" style="line-height:40px">共有数据88 条</span>
</xblock>
<table class="layui-table">
<thead>
<tr>
<th>
<div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
</th>
<th>订单编号</th>
<th>收货人</th>
<th>总金额</th>
<th>应付金额</th>
<th>订单状态</th>
<th>支付状态</th>
<th>发货状态</th>
<th>支付方式</th>
<th>配送方式</th>
<th>下单时间</th>
<th >操作</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i class="layui-icon">&#xe605;</i></div>
</td>
<td>2017009171822298053</td>
<td>老王:18925139194</td>
<td>7829.10</td>
<td>7854.10</td>
<td>待确认</td>
<td>未支付</td>
<td>未发货</td>
<td>其他方式</td>
<td>申通物流</td>
<td>2017-08-17 18:22</td>
<td class="td-manage">
<a title="查看" onclick="x_admin_show('编辑','order-view.html')" href="javascript:;">
<i class="layui-icon">&#xe63c;</i>
</a>
<a title="删除" onclick="member_del(this,'要删除的id')" href="javascript:;">
<i class="layui-icon">&#xe640;</i>
</a>
</td>
</tr>
</tbody>
</table>
<div class="page">
<div>
<a class="prev" href="">&lt;&lt;</a>
<a class="num" href="">1</a>
<span class="current">2</span>
<a class="num" href="">3</a>
<a class="num" href="">489</a>
<a class="next" href="">&gt;&gt;</a>
</div>
</div>
</div>
<script>
layui.use('laydate', function(){
var laydate = layui.laydate;
//执行一个laydate实例
laydate.render({
elem: '#start' //指定元素
});
//执行一个laydate实例
laydate.render({
elem: '#end' //指定元素
});
});
/*用户-停用*/
function member_stop(obj,id){
layer.confirm('确认要停用吗?',function(index){
if($(obj).attr('title')=='启用'){
//发异步把用户状态进行更改
$(obj).attr('title','停用')
$(obj).find('i').html('&#xe62f;');
$(obj).parents("tr").find(".td-status").find('span').addClass('layui-btn-disabled').html('已停用');
layer.msg('已停用!',{icon: 5,time:1000});
}else{
$(obj).attr('title','启用')
$(obj).find('i').html('&#xe601;');
$(obj).parents("tr").find(".td-status").find('span').removeClass('layui-btn-disabled').html('已启用');
layer.msg('已启用!',{icon: 5,time:1000});
}
});
}
/*用户-删除*/
function member_del(obj,id){
layer.confirm('确认要删除吗?',function(index){
//发异步删除数据
$(obj).parents("tr").remove();
layer.msg('已删除!',{icon:1,time:1000});
});
}
function delAll (argument) {
var data = tableCheck.getData();
layer.confirm('确认要删除吗?'+data,function(index){
//捉到所有被选中的,发异步进行删除
layer.msg('删除成功', {icon: 1});
$(".layui-form-checked").not('.header').parents('tr').remove();
});
}
</script>
</body>
</html>

@ -0,0 +1,274 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class=" layui-fluid"><fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>总页数低于页码总数</legend>
</fieldset>
<div id="demo0"></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>总页数大于页码总数</legend>
</fieldset>
<div id="demo1"></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>自定义主题 - 颜色随意定义</legend>
</fieldset>
<div id="demo2"></div>
<div id="demo2-1"></div>
<div id="demo2-2"></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>自定义首页、尾页、上一页、下一页文本</legend>
</fieldset>
<div id="demo3"></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>不显示首页尾页</legend>
</fieldset>
<div id="demo4"></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>开启HASH</legend>
</fieldset>
<div id="demo5"></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>只显示上一页、下一页</legend>
</fieldset>
<div id="demo6"></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>显示完整功能</legend>
</fieldset>
<div id="demo7"></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>自定义排版</legend>
</fieldset>
<div id="demo8"></div>
<div id="demo9"></div>
<div id="demo10"></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>自定义每页条数的选择项</legend>
</fieldset>
<div id="demo11"></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>将一段已知数组分页展示</legend>
</fieldset>
<div id="demo20"></div>
<ul id="biuuu_city_list"></ul>
<script src="../lib/layui/layui.js"></script>
<!-- 注意如果你直接复制所有代码到本地上述js路径需要改成你本地的 -->
<script>
layui.use(['laypage', 'layer'], function(){
var laypage = layui.laypage
,layer = layui.layer;
//总页数低于页码总数
laypage.render({
elem: 'demo0'
,count: 50 //数据总数
});
//总页数大于页码总数
laypage.render({
elem: 'demo1'
,count: 70 //数据总数
,jump: function(obj){
console.log(obj)
}
});
//自定义样式
laypage.render({
elem: 'demo2'
,count: 100
,theme: '#1E9FFF'
});
laypage.render({
elem: 'demo2-1'
,count: 100
,theme: '#FF5722'
});
laypage.render({
elem: 'demo2-2'
,count: 100
,theme: '#FFB800'
});
//自定义首页、尾页、上一页、下一页文本
laypage.render({
elem: 'demo3'
,count: 100
,first: '首页'
,last: '尾页'
,prev: '<em></em>'
,next: '<em></em>'
});
//不显示首页尾页
laypage.render({
elem: 'demo4'
,count: 100
,first: false
,last: false
});
//开启HASH
laypage.render({
elem: 'demo5'
,count: 500
,curr: location.hash.replace('#!fenye=', '') //获取hash值为fenye的当前页
,hash: 'fenye' //自定义hash值
});
//只显示上一页、下一页
laypage.render({
elem: 'demo6'
,count: 50
,layout: ['prev', 'next']
,jump: function(obj, first){
if(!first){
layer.msg('第 '+ obj.curr +' 页');
}
}
});
//完整功能
laypage.render({
elem: 'demo7'
,count: 100
,layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip']
,jump: function(obj){
console.log(obj)
}
});
//自定义排版
laypage.render({
elem: 'demo8'
,count: 1000
,layout: ['limit', 'prev', 'page', 'next']
});
laypage.render({
elem: 'demo9'
,count: 1000
,layout: ['prev', 'next', 'page']
});
laypage.render({
elem: 'demo10'
,count: 1000
,layout: ['page', 'count']
});
//自定义每页条数的选择项
laypage.render({
elem: 'demo11'
,count: 1000
,limit: 100
,limits: [100, 300, 500]
});
//将一段数组分页展示
//测试数据
var data = [
'北京',
'上海',
'广州',
'深圳',
'杭州',
'长沙',
'合肥',
'宁夏',
'成都',
'西安',
'南昌',
'上饶',
'沈阳',
'济南',
'厦门',
'福州',
'九江',
'宜春',
'赣州',
'宁波',
'绍兴',
'无锡',
'苏州',
'徐州',
'东莞',
'佛山',
'中山',
'成都',
'武汉',
'青岛',
'天津',
'重庆',
'南京',
'九江',
'香港',
'澳门',
'台北'
];
//调用分页
laypage.render({
elem: 'demo20'
,count: data.length
,jump: function(obj){
//模拟渲染
document.getElementById('biuuu_city_list').innerHTML = function(){
var arr = []
,thisData = data.concat().splice(obj.curr*obj.limit - obj.limit, obj.limit);
layui.each(thisData, function(index, item){
arr.push('<li>'+ item +'</li>');
});
return arr.join('');
}();
}
});
});
</script>
</body>
</html>

@ -0,0 +1,207 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" type="text/css" href="../lib/layui/css/layui.css">
<script src="../js/jquery.min.js"></script>
<script src="../lib/layui/layui.js"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class=" layui-fluid"><body>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
<legend>卡片面板</legend>
</fieldset>
<div style="padding: 20px; background-color: #F2F2F2;">
<div class="layui-row layui-col-space15">
<div class="layui-col-md6">
<div class="layui-card">
<div class="layui-card-header">卡片面板</div>
<div class="layui-card-body">
卡片式面板面板通常用于非白色背景色的主体内<br>
从而映衬出边框投影
</div>
</div>
</div>
<div class="layui-col-md6">
<div class="layui-card">
<div class="layui-card-header">卡片面板</div>
<div class="layui-card-body">
结合 layui 的栅格系统<br>
轻松实现响应式布局
</div>
</div>
</div>
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-header">标题</div>
<div class="layui-card-body">
内容
</div>
</div>
</div>
</div>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>常规折叠面板</legend>
</fieldset>
<div class="layui-collapse" lay-filter="test">
<div class="layui-colla-item">
<h2 class="layui-colla-title">为什么JS社区大量采用未发布或者未广泛支持的语言特性</h2>
<div class="layui-colla-content">
<p>有不少其他答案说是因为JS太差。我下面的答案已经说了这不是根本性的原因。但除此之外我还要纠正一些对JS具体问题的误解。JS当初是被作为脚本语言设计的所以某些问题并不是JS设计得差或者是JS设计者的失误。比如var的作用域问题并不是“错误”而是当时绝大部分脚本语言都是这样的如perl/php/sh等。模块的问题也是脚本语言几乎都没有模块/命名空间功能。弱类型、for-in之类的问题也是只不过现在用那些老的脚本语言的人比较少所以很多人都误以为是JS才有的坑。另外有人说JS是半残语言满足不了开发需求1999年就该死。半残这个嘛就夸张了。JS虽然有很多问题但是设计总体还是优秀的。——来自知乎@贺师俊</p>
</div>
</div>
<div class="layui-colla-item">
<h2 class="layui-colla-title">为什么前端工程师多不愿意用 Bootstrap 框架?</h2>
<div class="layui-colla-content">
<p>因为不适合。如果希望开发长期的项目或者制作产品类网站,那么就需要实现特定的设计,为了在维护项目中可以方便地按设计师要求快速修改样式,肯定会逐步编写出各种业务组件、工具类,相当于为项目自行开发一套框架。——来自知乎@Kayo</p>
</div>
</div>
<div class="layui-colla-item">
<h2 class="layui-colla-title">layui 更适合哪些开发者?</h2>
<div class="layui-colla-content">
<p>在前端技术快速变革的今天layui 仍然坚持语义化的组织模式甚至于模块理念都是采用类AMD组织形式并非是有意与时代背道而驰。layui 认为以jQuery为核心的开发方式还没有到完全消亡的时候而早期市面上基于jQuery的UI都普通做得差强人意所以需要有一个新的UI去重新为这一领域注入活力并采用一些更科学的架构方式。
<br><br>
因此准确地说layui 更多是面向那些追求开发简单的前端工程师们,以及所有层次的服务端程序员。</p>
</div>
</div>
<div class="layui-colla-item">
<h2 class="layui-colla-title">贤心是男是女?</h2>
<div class="layui-colla-content">
<p>man 所以这个问题不要再出现了。。。</p>
</div>
</div>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>手风琴折叠</legend>
</fieldset>
<div class="layui-collapse" lay-accordion="">
<div class="layui-colla-item">
<h2 class="layui-colla-title">layui 更适合哪些开发者?</h2>
<div class="layui-colla-content layui-show">
<p>在前端技术快速变革的今天layui 仍然坚持语义化的组织模式甚至于模块理念都是采用类AMD组织形式并非是有意与时代背道而驰。layui 认为以jQuery为核心的开发方式还没有到完全消亡的时候而早期市面上基于jQuery的UI都普通做得差强人意所以需要有一个新的UI去重新为这一领域注入活力并采用一些更科学的架构方式。
<br>
因此准确地说layui 更多是面向那些追求开发简单的前端工程师们,以及所有层次的服务端程序员。</p>
</div>
</div>
<div class="layui-colla-item">
<h2 class="layui-colla-title">为什么JS社区大量采用未发布或者未广泛支持的语言特性</h2>
<div class="layui-colla-content">
<p>有不少其他答案说是因为JS太差。我下面的答案已经说了这不是根本性的原因。但除此之外我还要纠正一些对JS具体问题的误解。JS当初是被作为脚本语言设计的所以某些问题并不是JS设计得差或者是JS设计者的失误。比如var的作用域问题并不是“错误”而是当时绝大部分脚本语言都是这样的如perl/php/sh等。模块的问题也是脚本语言几乎都没有模块/命名空间功能。弱类型、for-in之类的问题也是只不过现在用那些老的脚本语言的人比较少所以很多人都误以为是JS才有的坑。另外有人说JS是半残语言满足不了开发需求1999年就该死。半残这个嘛就夸张了。JS虽然有很多问题但是设计总体还是优秀的。——来自知乎@贺师俊</p>
</div>
</div>
<div class="layui-colla-item">
<h2 class="layui-colla-title">为什么前端工程师多不愿意用 Bootstrap 框架?</h2>
<div class="layui-colla-content">
<p>因为不适合。如果希望开发长期的项目或者制作产品类网站,那么就需要实现特定的设计,为了在维护项目中可以方便地按设计师要求快速修改样式,肯定会逐步编写出各种业务组件、工具类,相当于为项目自行开发一套框架。——来自知乎@Kayo</p>
</div>
</div>
<div class="layui-colla-item">
<h2 class="layui-colla-title">贤心是男是女?</h2>
<div class="layui-colla-content">
<p>man 所以这个问题不要再出现了。。。</p>
</div>
</div>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>面板嵌套</legend>
</fieldset>
<div class="layui-collapse" lay-accordion="">
<div class="layui-colla-item">
<h2 class="layui-colla-title">文豪</h2>
<div class="layui-colla-content layui-show">
<div class="layui-collapse" lay-accordion="">
<div class="layui-colla-item">
<h2 class="layui-colla-title">唐代</h2>
<div class="layui-colla-content layui-show">
<div class="layui-collapse" lay-accordion="">
<div class="layui-colla-item">
<h2 class="layui-colla-title">杜甫</h2>
<div class="layui-colla-content layui-show">
伟大的诗人
</div>
</div>
<div class="layui-colla-item">
<h2 class="layui-colla-title">李白</h2>
<div class="layui-colla-content">
<p>据说是韩国人</p>
</div>
</div>
<div class="layui-colla-item">
<h2 class="layui-colla-title">王勃</h2>
<div class="layui-colla-content">
<p>千古绝唱《滕王阁序》</p>
</div>
</div>
</div>
</div>
</div>
<div class="layui-colla-item">
<h2 class="layui-colla-title">宋代</h2>
<div class="layui-colla-content">
<p>比如苏轼、李清照</p>
</div>
</div>
<div class="layui-colla-item">
<h2 class="layui-colla-title">当代</h2>
<div class="layui-colla-content">
<p>比如贤心</p>
</div>
</div>
</div>
</div>
</div>
<div class="layui-colla-item">
<h2 class="layui-colla-title">科学家</h2>
<div class="layui-colla-content">
<p>伟大的科学家</p>
</div>
</div>
<div class="layui-colla-item">
<h2 class="layui-colla-title">艺术家</h2>
<div class="layui-colla-content">
<p>浑身散发着艺术细胞</p>
</div>
</div>
</div>
<br>
<p>支持无限嵌套,应用场景非常多!</p>
<script src="../lib/layui/layui.js"></script>
<!-- 注意如果你直接复制所有代码到本地上述js路径需要改成你本地的 -->
<script>
layui.use(['element', 'layer'], function(){
var element = layui.element;
var layer = layui.layer;
//监听折叠
element.on('collapse(test)', function(data){
layer.msg('展开状态:'+ data.show);
});
});
</script>
</body>
</html>

@ -0,0 +1,180 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script src="../lib/layui/layui.js"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="form-wrap">
<style>
/* 这段样式只是用于演示 */
.layui-progress{margin: 20px 0;}
</style>
<div class="layui-fluid" id="LAY-component-progress">
<div class="layui-row layui-col-space15">
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-header">默认进度条</div>
<div class="layui-card-body">
<div class="layui-progress">
<div class="layui-progress-bar" lay-percent="50%"></div>
</div>
<div class="layui-row layui-col-space15">
<div class="layui-col-xs6">
<div class="layui-progress">
<div class="layui-progress-bar" lay-percent="50%"></div>
</div>
</div>
<div class="layui-col-xs6">
<div class="layui-progress">
<div class="layui-progress-bar" lay-percent="50%"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-header">更多颜色进度条</div>
<div class="layui-card-body">
<div class="layui-progress">
<div class="layui-progress-bar layui-bg-red" lay-percent="20%"></div>
</div>
<div class="layui-progress">
<div class="layui-progress-bar layui-bg-orange" lay-percent="30%"></div>
</div>
<div class="layui-progress">
<div class="layui-progress-bar layui-bg-green" lay-percent="40%"></div>
</div>
<div class="layui-progress">
<div class="layui-progress-bar layui-bg-blue" lay-percent="50%"></div>
</div>
<div class="layui-progress">
<div class="layui-progress-bar layui-bg-cyan" lay-percent="60%"></div>
</div>
<div class="layui-progress layui-progress-big">
<div class="layui-progress-bar" lay-percent="20%"></div>
</div>
<div class="layui-progress layui-progress-big">
<div class="layui-progress-bar layui-bg-green" lay-percent="35%"></div>
</div>
<div class="layui-progress layui-progress-big">
<div class="layui-progress-bar layui-bg-cyan" lay-percent="75%"></div>
</div>
</div>
</div>
</div>
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-header">动态改变进度</div>
<div class="layui-card-body">
<div class="layui-progress layui-progress-big" lay-showpercent="true" lay-filter="component-progress-demo">
<div class="layui-progress-bar layui-bg-red" lay-percent="0%"></div>
</div>
<div class="layui-btn-container" style="margin-top: 20px; margin-bottom: 0;">
<button class="layui-btn site-demo-active" data-type="setPercent">设置50%</button>
<button class="layui-btn site-demo-active" data-type="loading">模拟loading</button>
</div>
</div>
</div>
</div>
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-header">显示进度比文本</div>
<div class="layui-card-body">
<div class="layui-progress" lay-showpercent="true">
<div class="layui-progress-bar" lay-percent="20%"></div>
</div>
<div class="layui-progress" lay-showpercent="true">
<div class="layui-progress-bar" lay-percent="5 / 10"></div>
</div>
<div class="layui-progress layui-progress-big" lay-showpercent="true">
<div class="layui-progress-bar" lay-percent="70%"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="../lib/layui/layui.js"></script>
<script>
layui.config({
base: '../../../layuiadmin/' //静态资源所在路径
}).extend({
index: 'lib/index' //主入口模块
}).use(['index'], function(){
var $ = layui.$
,admin = layui.admin
,element = layui.element
,router = layui.router();
element.render('progress');
//触发事件
var active = {
setPercent: function(){
//设置50%进度
element.progress('component-progress-demo', '50%')
}
,loading: function(othis){
var DISABLED = 'layui-btn-disabled';
if(othis.hasClass(DISABLED)) return;
//模拟loading
var n = 0, timer = setInterval(function(){
n = n + Math.random()*10|0;
if(n>100){
n = 100;
clearInterval(timer);
othis.removeClass(DISABLED);
}
element.progress('component-progress-demo', n+'%');
}, 300+Math.random()*1000);
othis.addClass(DISABLED);
}
};
$('#LAY-component-progress .site-demo-active').on('click', function(){
var othis = $(this), type = $(this).data('type');
active[type] ? active[type].call(this, othis) : '';
});
});
</script>
</body>
</html>

@ -0,0 +1,129 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="x-body">
<form action="" method="post" class="layui-form layui-form-pane">
<div class="layui-form-item">
<label for="name" class="layui-form-label">
<span class="x-red">*</span>角色名
</label>
<div class="layui-input-inline">
<input type="text" id="name" name="name" required lay-verify="required"
autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">
拥有权限
</label>
<table class="layui-table layui-input-block">
<tbody>
<tr>
<td>
<input type="checkbox" name="like1[write]" lay-skin="primary" title="用户管理">
</td>
<td>
<div class="layui-input-block">
<input name="id[]" lay-skin="primary" type="checkbox" title="用户停用" value="2">
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="用户删除">
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="用户修改">
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="用户改密">
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="用户列表">
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="用户改密">
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="用户列表">
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="用户改密">
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="用户列表">
</div>
</td>
</tr>
<tr>
<td>
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="文章管理">
</td>
<td>
<div class="layui-input-block">
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="文章添加">
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="文章删除">
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="文章修改">
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="文章改密">
<input name="id[]" lay-skin="primary" type="checkbox" value="2" title="文章列表">
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div class="layui-form-item layui-form-text">
<label for="desc" class="layui-form-label">
描述
</label>
<div class="layui-input-block">
<textarea placeholder="请输入内容" id="desc" name="desc" class="layui-textarea"></textarea>
</div>
</div>
<div class="layui-form-item">
<button class="layui-btn" lay-submit="" lay-filter="add">增加</button>
</div>
</form>
</div>
<script>
layui.use(['form','layer'], function(){
$ = layui.jquery;
var form = layui.form
,layer = layui.layer;
//自定义验证规则
form.verify({
nikename: function(value){
if(value.length < 5){
return '昵称至少得5个字符啊';
}
}
,pass: [/(.+){6,12}$/, '密码必须6到12位']
,repass: function(value){
if($('#L_pass').val()!=$('#L_repass').val()){
return '两次密码不一致';
}
}
});
//监听提交
form.on('submit(add)', function(data){
console.log(data);
//发异步把数据提交给php
layer.alert("增加成功", {icon: 6},function () {
// 获得frame索引
var index = parent.layer.getFrameIndex(window.name);
//关闭当前frame
parent.layer.close(index);
});
return false;
});
});
</script>
</body>
</html>

@ -0,0 +1,208 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="form-wrap" >
<div class="layui-fluid" id="component-tabs">
<div class="layui-row">
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-header">默认风格</div>
<div class="layui-card-body">
<div class="layui-tab">
<ul class="layui-tab-title">
<li class="layui-this">网站设置</li>
<li>用户管理</li>
<li>权限分配</li>
<li>商品管理</li>
<li>订单管理</li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">
1. 高度默认自适应,也可以随意固宽。
<br>2. Tab进行了响应式处理所以无需担心数量多少。
</div>
<div class="layui-tab-item">内容2</div>
<div class="layui-tab-item">内容3</div>
<div class="layui-tab-item">内容4</div>
<div class="layui-tab-item">内容5</div>
</div>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">简洁风格</div>
<div class="layui-card-body">
<div class="layui-tab layui-tab-brief" lay-filter="component-tabs-brief">
<ul class="layui-tab-title">
<li class="layui-this">网站设置</li>
<li>用户管理</li>
<li>权限分配</li>
<li>商品管理</li>
<li>订单管理</li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">
你也可以监听 tab 事件
</div>
<div class="layui-tab-item">内容2</div>
<div class="layui-tab-item">内容3</div>
<div class="layui-tab-item">内容4</div>
<div class="layui-tab-item">内容5</div>
</div>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">卡片风格</div>
<div class="layui-card-body">
<div class="layui-tab layui-tab-card">
<ul class="layui-tab-title">
<li class="layui-this">网站设置</li>
<li>用户管理</li>
<li>权限分配</li>
<li>商品管理</li>
<li>订单管理</li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">默认宽度是相对于父元素100%适应的,你也可以固定宽度。</div>
<div class="layui-tab-item">2</div>
<div class="layui-tab-item">3</div>
<div class="layui-tab-item">4</div>
<div class="layui-tab-item">5</div>
<div class="layui-tab-item">6</div>
</div>
</div>
</div>
</div>
</div>
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-header">动态操作</div>
<div class="layui-card-body">
<div class="layui-tab" lay-filter="demo" lay-allowclose="true">
<ul class="layui-tab-title">
<li class="layui-this" lay-id="11">网站设置<i class="layui-icon layui-unselect layui-tab-close"></i></li>
<li lay-id="22">用户管理<i class="layui-icon layui-unselect layui-tab-close"></i></li>
<li lay-id="33">权限分配<i class="layui-icon layui-unselect layui-tab-close"></i></li>
<li lay-id="44">商品管理<i class="layui-icon layui-unselect layui-tab-close"></i></li>
<li lay-id="55">订单管理<i class="layui-icon layui-unselect layui-tab-close"></i></li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">内容1</div>
<div class="layui-tab-item">内容2</div>
<div class="layui-tab-item">内容3</div>
</div>
</div>
<div class="layui-btn-container">
<button class="layui-btn site-demo-active" data-type="tabAdd">新增一个项</button>
<button class="layui-btn site-demo-active" data-type="tabDelete">删除:用户管理</button>
<button class="layui-btn site-demo-active" data-type="tabChange">切换到:权限分配</button>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">记录状态</div>
<div class="layui-card-body">
<div class="layui-tab layui-tab-brief" lay-filter="component-tabs-hash">
<ul class="layui-tab-title">
<li class="layui-this" lay-id="11">网站设置</li>
<li lay-id="22">用户管理</li>
<li lay-id="33">权限分配</li>
<li lay-id="44">商品管理</li>
<li lay-id="55">订单管理</li>
</ul>
<div class="layui-tab-content" style="height: 165px;">
<div class="layui-tab-item layui-show">
点击该Tab的任一标题观察地址栏变化再刷新页面。选项卡将会自动定位到上一次切换的项
</div>
<div class="layui-tab-item">内容2</div>
<div class="layui-tab-item">内容3</div>
<div class="layui-tab-item">内容4</div>
<div class="layui-tab-item">内容5</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
layui.config({
base: '../../../layuiadmin/' //静态资源所在路径
}).extend({
index: 'lib/index' //主入口模块
}).use(['index'], function(){
var $ = layui.$
,admin = layui.admin
,element = layui.element
,router = layui.router();
element.render();
element.on('tab(component-tabs-brief)', function(obj){
layer.msg(obj.index + '' + this.innerHTML);
});
/* 触发事件 */
var active = {
tabAdd: function(){
/* 新增一个Tab项 */
element.tabAdd('demo', {
title: '新选项'+ (Math.random()*1000|0) /* 用于演示 */
,content: '内容'+ (Math.random()*1000|0)
,id: new Date().getTime() /* 实际使用一般是规定好的id这里以时间戳模拟下 */
})
}
,tabDelete: function(othis){
/* 删除指定Tab项 */
element.tabDelete('demo', '22');
othis.addClass('layui-btn-disabled');
}
,tabChange: function(){
/* 切换到指定Tab项 */
element.tabChange('demo', '33');
}
};
$('#component-tabs .site-demo-active').on('click', function(){
var othis = $(this), type = othis.data('type');
active[type] ? active[type].call(this, othis) : '';
});
/* Hash地址的定位 */
var layid = router.hash.replace(/^#layid=/, '');
layid && element.tabChange('component-tabs-hash', layid);
element.on('tab(component-tabs-hash)', function(elem){
location.hash = '/'+ layui.router().path.join('/') + '#layid=' + $(this).attr('lay-id');
});
});
</script>
</div><style id="LAY_layadmin_theme">.layui-side-menu,.layadmin-pagetabs .layui-tab-title li:after,.layadmin-pagetabs .layui-tab-title li.layui-this:after,.layui-layer-admin .layui-layer-title,.layadmin-side-shrink .layui-side-menu .layui-nav>.layui-nav-item>.layui-nav-child{background-color:#20222A !important;}.layui-nav-tree .layui-this,.layui-nav-tree .layui-this>a,.layui-nav-tree .layui-nav-child dd.layui-this,.layui-nav-tree .layui-nav-child dd.layui-this a{background-color:#009688 !important;}.layui-layout-admin .layui-logo{background-color:#20222A !important;}</style></body>
</html>

@ -0,0 +1,318 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" type="text/css" href="../lib/layui/css/layui.css">
<script src="../js/jquery.min.js"></script>
<script src="../lib/layui/layui.js"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="layui-fluid">
<blockquote class="layui-elem-quote" style=" margin-top:20px;">
本页面只是演示静态表格,如果你需要的是数据表格,可前往:
<a class="layui-btn layui-btn-normal" href="table.html" target="_blank">表格模块示例</a>
</blockquote>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
<legend>默认表格</legend>
</fieldset>
<div class="layui-form">
<table class="layui-table">
<colgroup>
<col width="150">
<col width="150">
<col width="200">
<col>
</colgroup>
<thead>
<tr>
<th>人物</th>
<th>民族</th>
<th>出场时间</th>
<th>格言</th>
</tr>
</thead>
<tbody>
<tr>
<td>贤心</td>
<td>汉族</td>
<td>1989-10-14</td>
<td>人生似修行</td>
</tr>
<tr>
<td>张爱玲</td>
<td>汉族</td>
<td>1920-09-30</td>
<td>于千万人之中遇见你所遇见的人,于千万年之中,时间的无涯的荒野里…</td>
</tr>
<tr>
<td>Helen Keller</td>
<td>拉丁美裔</td>
<td>1880-06-27</td>
<td> Life is either a daring adventure or nothing.</td>
</tr>
<tr>
<td>岳飞</td>
<td>汉族</td>
<td>1103-北宋崇宁二年</td>
<td>教科书再滥改,也抹不去“民族英雄”的事实</td>
</tr>
<tr>
<td>孟子</td>
<td>华夏族(汉族)</td>
<td>公元前-372年</td>
<td>猿强,则国强。国强,则猿更强! </td>
</tr>
</tbody>
</table>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>行边框表格</legend>
</fieldset>
<table class="layui-table" lay-skin="line">
<colgroup>
<col width="150">
<col width="150">
<col width="200">
<col>
</colgroup>
<thead>
<tr>
<th>人物</th>
<th>民族</th>
<th>出场时间</th>
<th>格言</th>
</tr>
</thead>
<tbody>
<tr>
<td>贤心</td>
<td>汉族</td>
<td>1989-10-14</td>
<td>人生似修行</td>
</tr>
<tr>
<td>张爱玲</td>
<td>汉族</td>
<td>1920-09-30</td>
<td>于千万人之中遇见你所遇见的人,于千万年之中,时间的无涯的荒野里…</td>
</tr>
<tr>
<td>Helen Keller</td>
<td>拉丁美裔</td>
<td>1880-06-27</td>
<td> Life is either a daring adventure or nothing.</td>
</tr>
<tr>
<td>岳飞</td>
<td>汉族</td>
<td>1103-北宋崇宁二年</td>
<td>教科书再滥改,也抹不去“民族英雄”的事实</td>
</tr>
<tr>
<td>孟子</td>
<td>华夏族(汉族)</td>
<td>公元前-372年</td>
<td>猿强,则国强。国强,则猿更强! </td>
</tr>
</tbody>
</table>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>列边框表格</legend>
</fieldset>
<table class="layui-table" lay-even="" lay-skin="row">
<colgroup>
<col width="150">
<col width="150">
<col width="200">
<col>
</colgroup>
<thead>
<tr>
<th>人物</th>
<th>民族</th>
<th>出场时间</th>
<th>格言</th>
</tr>
</thead>
<tbody>
<tr>
<td>贤心</td>
<td>汉族</td>
<td>1989-10-14</td>
<td>人生似修行</td>
</tr>
<tr>
<td>张爱玲</td>
<td>汉族</td>
<td>1920-09-30</td>
<td>于千万人之中遇见你所遇见的人,于千万年之中,时间的无涯的荒野里…</td>
</tr>
<tr>
<td>Helen Keller</td>
<td>拉丁美裔</td>
<td>1880-06-27</td>
<td> Life is either a daring adventure or nothing.</td>
</tr>
<tr>
<td>岳飞</td>
<td>汉族</td>
<td>1103-北宋崇宁二年</td>
<td>教科书再滥改,也抹不去“民族英雄”的事实</td>
</tr>
<tr>
<td>孟子</td>
<td>华夏族(汉族)</td>
<td>公元前-372年</td>
<td>猿强,则国强。国强,则猿更强! </td>
</tr>
</tbody>
</table>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>无边框表格</legend>
</fieldset>
<table class="layui-table" lay-even="" lay-skin="nob">
<colgroup>
<col width="150">
<col width="150">
<col width="200">
<col>
</colgroup>
<thead>
<tr>
<th>人物</th>
<th>民族</th>
<th>出场时间</th>
<th>格言</th>
</tr>
</thead>
<tbody>
<tr>
<td>贤心</td>
<td>汉族</td>
<td>1989-10-14</td>
<td>人生似修行</td>
</tr>
<tr>
<td>张爱玲</td>
<td>汉族</td>
<td>1920-09-30</td>
<td>于千万人之中遇见你所遇见的人,于千万年之中,时间的无涯的荒野里…</td>
</tr>
<tr>
<td>Helen Keller</td>
<td>拉丁美裔</td>
<td>1880-06-27</td>
<td> Life is either a daring adventure or nothing.</td>
</tr>
<tr>
<td>岳飞</td>
<td>汉族</td>
<td>1103-北宋崇宁二年</td>
<td>教科书再滥改,也抹不去“民族英雄”的事实</td>
</tr>
<tr>
<td>孟子</td>
<td>华夏族(汉族)</td>
<td>公元前-372年</td>
<td>猿强,则国强。国强,则猿更强! </td>
</tr>
</tbody>
</table>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>其它尺寸表格</legend>
</fieldset>
<table class="layui-table" lay-size="lg">
<colgroup>
<col width="150">
<col width="200">
<col>
</colgroup>
<thead>
<tr>
<th>昵称</th>
<th>加入时间</th>
<th>签名</th>
</tr>
</thead>
<tbody>
<tr>
<td>贤心</td>
<td>2016-11-29</td>
<td>人生就像是一场修行</td>
</tr>
<tr>
<td>许闲心</td>
<td>2016-11-28</td>
<td>于千万人之中遇见你所遇见的人,于千万年之中,时间的无涯的荒野里…</td>
</tr>
<tr>
<td>sentsin</td>
<td>2016-11-27</td>
<td> Life is either a daring adventure or nothing.</td>
</tr>
</tbody>
</table>
<table class="layui-table" lay-size="sm">
<colgroup>
<col width="150">
<col width="200">
<col>
</colgroup>
<thead>
<tr>
<th>昵称</th>
<th>加入时间</th>
<th>签名</th>
</tr>
</thead>
<tbody>
<tr>
<td>xxx</td>
<td>2016-11-29</td>
<td>人生就像是一场修行</td>
</tr>
<tr>
<td>许闲心</td>
<td>2016-11-28</td>
<td>于千万人之中遇见你所遇见的人,于千万年之中,时间的无涯的荒野里…</td>
</tr>
<tr>
<td>sentsin</td>
<td>2016-11-27</td>
<td> Life is either a daring adventure or nothing.</td>
</tr>
</tbody>
</table>
<script src="../lib/layui/layui.js"></script>
<!-- 注意如果你直接复制所有代码到本地上述js路径需要改成你本地的 -->
<script>
</script>
</body>
</html>

@ -0,0 +1,112 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" type="text/css" href="../lib/layui/css/layui.css">
<script src="../js/jquery.min.js"></script>
<script src="../lib/layui/layui.js"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
<!-- 让IE8/9支持媒体查询从而兼容栅格 -->
<!--[if lt IE 9]>
<script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
<script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class=" layui-fluid"><fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>常规时间线</legend>
</fieldset>
<ul class="layui-timeline">
<li class="layui-timeline-item">
<i class="layui-icon layui-timeline-axis"></i>
<div class="layui-timeline-content layui-text">
<h3 class="layui-timeline-title">8月18日</h3>
<p>
layui 2.0 的一切准备工作似乎都已到位。发布之弦,一触即发。
<br>不枉近百个日日夜夜与之为伴。因小而大,因弱而强。
<br>无论它能走多远,抑或如何支撑?至少我曾倾注全心,无怨无悔 <i class="layui-icon"></i>
</p>
</div>
</li>
<li class="layui-timeline-item">
<i class="layui-icon layui-timeline-axis"></i>
<div class="layui-timeline-content layui-text">
<h3 class="layui-timeline-title">8月16日</h3>
<p>杜甫的思想核心是儒家的仁政思想,他有<em>“致君尧舜上,再使风俗淳”</em>的宏伟抱负。个人最爱的名篇有:</p>
<ul>
<li>《登高》</li>
<li>《茅屋为秋风所破歌》</li>
</ul>
</div>
</li>
<li class="layui-timeline-item">
<i class="layui-icon layui-timeline-axis"></i>
<div class="layui-timeline-content layui-text">
<h3 class="layui-timeline-title">8月15日</h3>
<p>
中国人民抗日战争胜利日
<br>常常在想,尽管对这个国家有这样那样的抱怨,但我们的确生在了最好的时代
<br>铭记、感恩
<br>所有为中华民族浴血奋战的英雄将士
<br>永垂不朽
</p>
</div>
</li>
<li class="layui-timeline-item">
<i class="layui-icon layui-timeline-axis"></i>
<div class="layui-timeline-content layui-text">
<div class="layui-timeline-title">过去</div>
</div>
</li>
</ul>
<fieldset class="layui-elem-field layui-field-title mar-t30" >
<legend>简约时间线:大事记</legend>
</fieldset>
<ul class="layui-timeline">
<li class="layui-timeline-item">
<i class="layui-icon layui-timeline-axis"></i>
<div class="layui-timeline-content layui-text">
<div class="layui-timeline-title">2018年layui 5.0 发布。并发展成为中国最受欢迎的前端UI框架期望</div>
</div>
</li>
<li class="layui-timeline-item">
<i class="layui-icon layui-timeline-axis"></i>
<div class="layui-timeline-content layui-text">
<div class="layui-timeline-title">2017年layui 里程碑版本 2.0 发布</div>
</div>
</li>
<li class="layui-timeline-item">
<i class="layui-icon layui-timeline-axis"></i>
<div class="layui-timeline-content layui-text">
<div class="layui-timeline-title">2016年layui 首个版本发布</div>
</div>
</li>
<li class="layui-timeline-item">
<i class="layui-icon layui-timeline-axis"></i>
<div class="layui-timeline-content layui-text">
<div class="layui-timeline-title">2015年layui 孵化</div>
</div>
</li>
<li class="layui-timeline-item">
<i class="layui-icon layui-anim layui-anim-rotate layui-anim-loop layui-timeline-axis"></i>
<div class="layui-timeline-content layui-text">
<div class="layui-timeline-title">更久前轮子时代。维护几个独立组件layer等</div>
</div>
</li>
</ul>
<script src="../lib/layui/layui.js"></script>
<!-- 注意如果你直接复制所有代码到本地上述js路径需要改成你本地的 -->
</body>
</html>

File diff suppressed because it is too large Load Diff

@ -0,0 +1,315 @@
<!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 name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="../css/xadmin.css">
<link rel="stylesheet" type="text/css" href="../lib/layui/css/layui.css">
<!-- 注意如果你直接复制所有代码到本地上述css路径需要改成你本地的 -->
</head>
<body class="form-wrap">
<div class=" layui-fluid layui-bg-white">
<blockquote class="layui-elem-quote">为节省服务器开销,以下示例均未配置真实上传接口,所以每次上传都会报提示:请求上传接口出现异常,这属于正常现象。</blockquote>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>常规使用:普通图片上传</legend>
</fieldset>
<div class="layui-upload">
<button type="button" class="layui-btn" id="test1">上传图片</button>
<div class="layui-upload-list">
<img class="layui-upload-img" id="demo1">
<p id="demoText"></p>
</div>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>上传多张图片</legend>
</fieldset>
<div class="layui-upload">
<button type="button" class="layui-btn" id="test2">多图片上传</button>
<blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
预览图:
<div class="layui-upload-list" id="demo2"></div>
</blockquote>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>指定允许上传的文件类型</legend>
</fieldset>
<button type="button" class="layui-btn" id="test3"><i class="layui-icon"></i>上传文件</button>
<button type="button" class="layui-btn layui-btn-primary" id="test4"><i class="layui-icon"></i>只允许压缩文件</button>
<button type="button" class="layui-btn" id="test5"><i class="layui-icon"></i>上传视频</button>
<button type="button" class="layui-btn" id="test6"><i class="layui-icon"></i>上传音频</button>
<div style="margin-top: 10px;">
<!-- 示例-970 -->
<ins class="adsbygoogle" style="display:inline-block;width:970px;height:90px" data-ad-client="ca-pub-6111334333458862" data-ad-slot="3820120620"></ins>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>设定文件大小限制</legend>
</fieldset>
<button type="button" class="layui-btn layui-btn-danger" id="test7"><i class="layui-icon"></i>上传图片</button>
<div class="layui-inline layui-word-aux">
这里以限制 60KB 为例
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>同时绑定多个元素,并将属性设定在元素上</legend>
</fieldset>
<button class="layui-btn demoMore" lay-data="{url: '/a/'}">上传A</button>
<button class="layui-btn demoMore" lay-data="{url: '/b/', size:5}">上传B</button>
<button class="layui-btn demoMore" lay-data="{url: '/c/', accept: 'file',size:10}">上传C</button>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>选完文件后不自动上传</legend>
</fieldset>
<div class="layui-upload">
<button type="button" class="layui-btn layui-btn-normal" id="test8">选择文件</button>
<button type="button" class="layui-btn" id="test9">开始上传</button>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>拖拽上传</legend>
</fieldset>
<div class="layui-upload-drag" id="test10">
<i class="layui-icon"></i>
<p>点击上传,或将文件拖拽到此处</p>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>高级应用:制作一个多文件列表</legend>
</fieldset>
<div class="layui-upload">
<button type="button" class="layui-btn layui-btn-normal" id="testList">选择多文件</button>
<div class="layui-upload-list">
<table class="layui-table">
<thead>
<tr><th>文件名</th>
<th>大小</th>
<th>状态</th>
<th>操作</th>
</tr></thead>
<tbody id="demoList"></tbody>
</table>
</div>
<button type="button" class="layui-btn" id="testListAction">开始上传</button>
</div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
<legend>绑定原始文件域</legend>
</fieldset>
<input type="file" name="file" id="test20">
</div>
<script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
<!-- 注意如果你直接复制所有代码到本地上述js路径需要改成你本地的 -->
<script>
layui.use('upload', function(){
var $ = layui.jquery
,upload = layui.upload;
//普通图片上传
var uploadInst = upload.render({
elem: '#test1'
,url: '/upload/'
,before: function(obj){
//预读本地文件示例不支持ie8
obj.preview(function(index, file, result){
$('#demo1').attr('src', result); //图片链接base64
});
}
,done: function(res){
//如果上传失败
if(res.code > 0){
return layer.msg('上传失败');
}
//上传成功
}
,error: function(){
//演示失败状态,并实现重传
var demoText = $('#demoText');
demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
demoText.find('.demo-reload').on('click', function(){
uploadInst.upload();
});
}
});
//多图片上传
upload.render({
elem: '#test2'
,url: '/upload/'
,multiple: true
,before: function(obj){
//预读本地文件示例不支持ie8
obj.preview(function(index, file, result){
$('#demo2').append('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img">')
});
}
,done: function(res){
//上传完毕
}
});
//指定允许上传的文件类型
upload.render({
elem: '#test3'
,url: '/upload/'
,accept: 'file' //普通文件
,done: function(res){
console.log(res)
}
});
upload.render({ //允许上传的文件后缀
elem: '#test4'
,url: '/upload/'
,accept: 'file' //普通文件
,exts: 'zip|rar|7z' //只允许上传压缩文件
,done: function(res){
console.log(res)
}
});
upload.render({
elem: '#test5'
,url: '/upload/'
,accept: 'video' //视频
,done: function(res){
console.log(res)
}
});
upload.render({
elem: '#test6'
,url: '/upload/'
,accept: 'audio' //音频
,done: function(res){
console.log(res)
}
});
//设定文件大小限制
upload.render({
elem: '#test7'
,url: '/upload/'
,size: 60 //限制文件大小,单位 KB
,done: function(res){
console.log(res)
}
});
//同时绑定多个元素,并将属性设定在元素上
upload.render({
elem: '.demoMore'
,before: function(){
layer.tips('接口地址:'+ this.url, this.item, {tips: 1});
}
,done: function(res, index, upload){
var item = this.item;
console.log(item); //获取当前触发上传的元素layui 2.1.0 新增
}
})
//选完文件后不自动上传
upload.render({
elem: '#test8'
,url: '/upload/'
,auto: false
//,multiple: true
,bindAction: '#test9'
,done: function(res){
console.log(res)
}
});
//拖拽上传
upload.render({
elem: '#test10'
,url: '/upload/'
,done: function(res){
console.log(res)
}
});
//多文件列表示例
var demoListView = $('#demoList')
,uploadListIns = upload.render({
elem: '#testList'
,url: '/upload/'
,accept: 'file'
,multiple: true
,auto: false
,bindAction: '#testListAction'
,choose: function(obj){
var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
//读取本地文件
obj.preview(function(index, file, result){
var tr = $(['<tr id="upload-'+ index +'">'
,'<td>'+ file.name +'</td>'
,'<td>'+ (file.size/1014).toFixed(1) +'kb</td>'
,'<td>等待上传</td>'
,'<td>'
,'<button class="layui-btn layui-btn-xs demo-reload layui-hide">重传</button>'
,'<button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button>'
,'</td>'
,'</tr>'].join(''));
//单个重传
tr.find('.demo-reload').on('click', function(){
obj.upload(index, file);
});
//删除
tr.find('.demo-delete').on('click', function(){
delete files[index]; //删除对应的文件
tr.remove();
uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值,以免删除后出现同名文件不可选
});
demoListView.append(tr);
});
}
,done: function(res, index, upload){
if(res.code == 0){ //上传成功
var tr = demoListView.find('tr#upload-'+ index)
,tds = tr.children();
tds.eq(2).html('<span style="color: #5FB878;">上传成功</span>');
tds.eq(3).html(''); //清空操作
return delete this.files[index]; //删除文件队列已经上传成功的文件
}
this.error(index, upload);
}
,error: function(index, upload){
var tr = demoListView.find('tr#upload-'+ index)
,tds = tr.children();
tds.eq(2).html('<span style="color: #FF5722;">上传失败</span>');
tds.eq(3).find('.demo-reload').removeClass('layui-hide'); //显示重传
}
});
//绑定原始文件域
upload.render({
elem: '#test20'
,url: '/upload/'
,done: function(res){
console.log(res)
}
});
});
</script>
</body>
</html>

@ -0,0 +1,158 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
</head>
<body>
<div class="x-body layui-anim layui-anim-up">
<blockquote class="layui-elem-quote">欢迎管理员:
<span class="x-red">test</span>!当前时间:2021-05-11 08:50:53</blockquote>
<fieldset class="layui-elem-field">
<legend>数据统计</legend>
<div class="layui-field-box">
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-body">
<div class="layui-carousel x-admin-carousel x-admin-backlog" lay-anim="" lay-indicator="inside" lay-arrow="none" style="width: 100%; height: 90px;">
<div carousel-item="">
<ul class="layui-row layui-col-space10 layui-this">
<li class="layui-col-xs2">
<a href="javascript:;" class="x-admin-backlog-body">
<h3>文章数</h3>
<p>
<cite>66</cite></p>
</a>
</li>
<li class="layui-col-xs2">
<a href="javascript:;" class="x-admin-backlog-body">
<h3>会员数</h3>
<p>
<cite>12</cite></p>
</a>
</li>
<li class="layui-col-xs2">
<a href="javascript:;" class="x-admin-backlog-body">
<h3>回复数</h3>
<p>
<cite>99</cite></p>
</a>
</li>
<li class="layui-col-xs2">
<a href="javascript:;" class="x-admin-backlog-body">
<h3>商品数</h3>
<p>
<cite>67</cite></p>
</a>
</li>
<li class="layui-col-xs2">
<a href="javascript:;" class="x-admin-backlog-body">
<h3>文章数</h3>
<p>
<cite>67</cite></p>
</a>
</li>
<li class="layui-col-xs2">
<a href="javascript:;" class="x-admin-backlog-body">
<h3>文章数</h3>
<p>
<cite>6766</cite></p>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</fieldset>
<fieldset class="layui-elem-field">
<legend>系统通知</legend>
<div class="layui-field-box">
<table class="layui-table" lay-skin="line">
<tbody>
<tr>
<td >
<a class="x-a" href="/" target="_blank">新版L-admin 2.0上线了</a>
</td>
</tr>
<tr>
<td >
<a class="x-a" href="/" target="_blank">交流qq:(370946531)</a>
</td>
</tr>
</tbody>
</table>
</div>
</fieldset>
<fieldset class="layui-elem-field">
<legend>系统信息</legend>
<div class="layui-field-box">
<table class="layui-table">
<tbody>
<tr>
<th>xxx版本</th>
<td>1.0.180420</td></tr>
<tr>
<th>服务器地址</th>
<td>#</td></tr>
<tr>
<th>操作系统</th>
<td>WINNT</td></tr>
<tr>
<th>运行环境</th>
<td>Apache/2.4.23 (Win32) OpenSSL/1.0.2j mod_fcgid/2.3.9</td></tr>
<tr>
<th>PHP版本</th>
<td>5.6.27</td></tr>
<tr>
<th>PHP运行方式</th>
<td>cgi-fcgi</td></tr>
<tr>
<th>MYSQL版本</th>
<td>5.5.53</td></tr>
<tr>
<th>ThinkPHP</th>
<td>5.0.18</td></tr>
<tr>
<th>上传附件限制</th>
<td>2M</td></tr>
<tr>
<th>执行时间限制</th>
<td>30s</td></tr>
<tr>
<th>剩余空间</th>
<td>86015.2M</td></tr>
</tbody>
</table>
</div>
</fieldset>
<fieldset class="layui-elem-field">
<legend>开发团队</legend>
<div class="layui-field-box">
<table class="layui-table">
<tbody>
<tr>
<th>版权所有</th>
<td>cdnuti(xuebingsi)
<a href="http://#/" class='x-a' target="_blank">访问官网</a></td>
</tr>
<tr>
<th>开发者</th>
<td>along(370946531@qq.com)</td></tr>
</tbody>
</table>
</div>
</fieldset>
<blockquote class="layui-elem-quote layui-quote-nm">感谢layui,百度Echarts,jquery,本系统由L-admin提供技术支持。</blockquote>
</div>
</body>
</html>

@ -0,0 +1,328 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>欢迎页面-L-admin1.0</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<link rel="stylesheet" href="../css/layuiadmin.css">
</head>
<body>
<div class="layui-fluid">
<div class="layui-row layui-col-space15">
<div class="layui-col-md8">
<div class="layui-row layui-col-space15">
<div class="layui-col-md6">
<div class="layui-card">
<div class="layui-card-header">快捷方式</div>
<div class="layui-card-body">
<div class="layui-carousel layadmin-carousel layadmin-shortcut">
<div carousel-item>
<ul class="layui-row layui-col-space10">
<li class="layui-col-xs3">
<a lay-href="home/homepage1.html">
<i class="layui-icon layui-icon-console"></i>
<cite>主页一</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="home/homepage2.html">
<i class="layui-icon layui-icon-chart"></i>
<cite>主页二</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="component/layer/list.html">
<i class="layui-icon layui-icon-template-1"></i>
<cite>弹层</cite>
</a>
</li>
<li class="layui-col-xs3">
<a layadmin-event="im">
<i class="layui-icon layui-icon-chat"></i>
<cite>聊天</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="component/progress/index.html">
<i class="layui-icon layui-icon-find-fill"></i>
<cite>进度条</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="app/workorder/list.html">
<i class="layui-icon layui-icon-survey"></i>
<cite>工单</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="user/user/list.html">
<i class="layui-icon layui-icon-user"></i>
<cite>用户</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="set/system/website.html">
<i class="layui-icon layui-icon-set"></i>
<cite>设置</cite>
</a>
</li>
</ul>
<ul class="layui-row layui-col-space10">
<li class="layui-col-xs3">
<a lay-href="set/user/info.html">
<i class="layui-icon layui-icon-set"></i>
<cite>我的资料</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="set/user/info.html">
<i class="layui-icon layui-icon-set"></i>
<cite>我的资料</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="set/user/info.html">
<i class="layui-icon layui-icon-set"></i>
<cite>我的资料</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="set/user/info.html">
<i class="layui-icon layui-icon-set"></i>
<cite>我的资料</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="set/user/info.html">
<i class="layui-icon layui-icon-set"></i>
<cite>我的资料</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="set/user/info.html">
<i class="layui-icon layui-icon-set"></i>
<cite>我的资料</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="set/user/info.html">
<i class="layui-icon layui-icon-set"></i>
<cite>我的资料</cite>
</a>
</li>
<li class="layui-col-xs3">
<a lay-href="set/user/info.html">
<i class="layui-icon layui-icon-set"></i>
<cite>我的资料</cite>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="layui-col-md6">
<div class="layui-card">
<div class="layui-card-header">待办事项</div>
<div class="layui-card-body">
<div class="layui-carousel layadmin-carousel layadmin-backlog">
<div carousel-item>
<ul class="layui-row layui-col-space10">
<li class="layui-col-xs6">
<a lay-href="app/content/comment.html" class="layadmin-backlog-body">
<h3>待审评论</h3>
<p><cite>66</cite></p>
</a>
</li>
<li class="layui-col-xs6">
<a lay-href="app/forum/list.html" class="layadmin-backlog-body">
<h3>待审帖子</h3>
<p><cite>12</cite></p>
</a>
</li>
<li class="layui-col-xs6">
<a lay-href="template/goodslist.html" class="layadmin-backlog-body">
<h3>待审商品</h3>
<p><cite>99</cite></p>
</a>
</li>
<li class="layui-col-xs6">
<a href="javascript:;" onclick="layer.tips('不跳转', this, {tips: 3});" class="layadmin-backlog-body">
<h3>待发货</h3>
<p><cite>20</cite></p>
</a>
</li>
</ul>
<ul class="layui-row layui-col-space10">
<li class="layui-col-xs6">
<a href="javascript:;" class="layadmin-backlog-body">
<h3>待审友情链接</h3>
<p><cite style="color: #FF5722;">5</cite></p>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-header">数据概览</div>
<div class="layui-card-body">
<div class="layui-carousel layadmin-carousel layadmin-dataview" data-anim="fade" lay-filter="LAY-index-dataview">
<div carousel-item id="LAY-index-dataview">
<div><i class="layui-icon layui-icon-loading1 layadmin-loading"></i></div>
<div></div>
<div></div>
</div>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-tab layui-tab-brief layadmin-latestData">
<ul class="layui-tab-title">
<li class="layui-this">今日热搜</li>
<li>今日热帖</li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">
<table id="LAY-index-topSearch"></table>
</div>
<div class="layui-tab-item">
<table id="LAY-index-topCard"></table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="layui-col-md4">
<div class="layui-card">
<div class="layui-card-header">版本信息</div>
<div class="layui-card-body layui-text">
<table class="layui-table">
<colgroup>
<col width="100">
<col>
</colgroup>
<tbody>
<tr>
<td>当前版本</td>
<td>
<script type="text/html" template>
v{{ layui.admin.v }}
<a href="http://fly.layui.com/docs/3/" target="_blank" style="padding-left: 15px;">更新日志</a>
</script>
</td>
</tr>
<tr>
<td>基于框架</td>
<td>
<script type="text/html" template>
layui-v{{ layui.v }}
</script>
</td>
</tr>
<tr>
<td>主要特色</td>
<td>零门槛 / 响应式 / 清爽 / 极简</td>
</tr>
<tr>
<td>获取渠道</td>
<td style="padding-bottom: 0;">
<div class="layui-btn-container">
<a href="http://www.layui.com/admin/" target="_blank" class="layui-btn layui-btn-danger">获取授权</a>
<a href="http://fly.layui.com/download/layuiAdmin/" target="_blank" class="layui-btn">立即下载</a>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">效果报告</div>
<div class="layui-card-body layadmin-takerates">
<div class="layui-progress" lay-showPercent="yes">
<h3>转化率(日同比 28% <span class="layui-edge layui-edge-top" lay-tips="增长" lay-offset="-15"></span></h3>
<div class="layui-progress-bar" lay-percent="65%"></div>
</div>
<div class="layui-progress" lay-showPercent="yes">
<h3>签到率(日同比 11% <span class="layui-edge layui-edge-bottom" lay-tips="下降" lay-offset="-15"></span></h3>
<div class="layui-progress-bar" lay-percent="32%"></div>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">实时监控</div>
<div class="layui-card-body layadmin-takerates">
<div class="layui-progress" lay-showPercent="yes">
<h3>CPU使用率</h3>
<div class="layui-progress-bar" lay-percent="58%"></div>
</div>
<div class="layui-progress" lay-showPercent="yes">
<h3>内存占用率</h3>
<div class="layui-progress-bar layui-bg-red" lay-percent="90%"></div>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">产品动态</div>
<div class="layui-card-body">
<div class="layui-carousel layadmin-carousel layadmin-news" data-autoplay="true" data-anim="fade" lay-filter="news">
<div carousel-item>
<div><a href="http://fly.layui.com/docs/2/" target="_blank" class="layui-bg-red">layuiAdmin 快速上手文档</a></div>
<div><a href="http://fly.layui.com/vipclub/list/layuiadmin/" target="_blank" class="layui-bg-green">layuiAdmin 会员讨论专区</a></div>
<div><a href="http://www.layui.com/admin/#get" target="_blank" class="layui-bg-blue">获得 layui 官方后台模板系统</a></div>
</div>
</div>
</div>
</div>
<div class="layui-card">
<div class="layui-card-header">
作者心语
<i class="layui-icon layui-icon-tips" lay-tips="要支持的噢" lay-offset="5"></i>
</div>
<div class="layui-card-body layui-text layadmin-text">
<p>一直以来layui 秉承无偿开源的初心,虔诚致力于服务各层次前后端 Web 开发者,在商业横飞的当今时代,这一信念从未动摇。即便身单力薄,仍然重拾决心,埋头造轮,以尽可能地填补产品本身的缺口。</p>
<p>在过去的一段的时间,我一直在寻求持久之道,已维持你眼前所见的一切。而 layuiAdmin 是我们尝试解决的手段之一。我相信真正有爱于 layui 生态的你,定然不会错过这一拥抱吧。</p>
<p>子曰:君子不用防,小人防不住。请务必通过官网正规渠道,获得 <a href="http://www.layui.com/admin/" target="_blank">layuiAdmin</a></p>
<p>—— 贤心(<a href="http://www.layui.com/" target="_blank">layui.com</a></p>
</div>
</div>
</div>
</div>
</div>
<script src="../lib/layui/layui.js"></script>
<script>
layui.config({
base: '../../layuiadmin/' //静态资源所在路径
}).extend({
index: 'lib/index' //主入口模块
}).use(['index', 'console']);
</script>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 183 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 181 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.0 KiB

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

@ -0,0 +1,208 @@
$(function () {
//加载弹出层
layui.use(['form','element'],
function() {
layer = layui.layer;
element = layui.element;
});
//触发事件
var tab = {
tabAdd: function(title,url,id){
//新增一个Tab项
element.tabAdd('xbs_tab', {
title: title
,content: '<iframe tab-id="'+id+'" frameborder="0" src="'+url+'" scrolling="yes" class="x-iframe"></iframe>'
,id: id
})
}
,tabDelete: function(othis){
//删除指定Tab项
element.tabDelete('xbs_tab', '44'); //删除:“商品管理”
othis.addClass('layui-btn-disabled');
}
,tabChange: function(id){
//切换到指定Tab项
element.tabChange('xbs_tab', id); //切换到:用户管理
}
};
tableCheck = {
init:function () {
$(".layui-form-checkbox").click(function(event) {
if($(this).hasClass('layui-form-checked')){
$(this).removeClass('layui-form-checked');
if($(this).hasClass('header')){
$(".layui-form-checkbox").removeClass('layui-form-checked');
}
}else{
$(this).addClass('layui-form-checked');
if($(this).hasClass('header')){
$(".layui-form-checkbox").addClass('layui-form-checked');
}
}
});
},
getData:function () {
var obj = $(".layui-form-checked").not('.header');
var arr=[];
obj.each(function(index, el) {
arr.push(obj.eq(index).attr('data-id'));
});
return arr;
}
}
//开启表格多选
tableCheck.init();
$('.container .left_open i').click(function(event) {
if($('.left-nav').css('left')=='0px'){
$('.left-nav').animate({left: '-221px'}, 100);
$('.page-content').animate({left: '0px'}, 100);
$('.page-content-bg').hide();
}else{
$('.left-nav').animate({left: '0px'}, 100);
$('.page-content').animate({left: '221px'}, 100);
if($(window).width()<768){
$('.page-content-bg').show();
}
}
});
$('.page-content-bg').click(function(event) {
$('.left-nav').animate({left: '-221px'}, 100);
$('.page-content').animate({left: '0px'}, 100);
$(this).hide();
});
$('.layui-tab-close').click(function(event) {
$('.layui-tab-title li').eq(0).find('i').remove();
});
$("tbody.x-cate tr[fid!='0']").hide();
// 栏目多级显示效果
$('.x-show').click(function () {
if($(this).attr('status')=='true'){
$(this).html('&#xe625;');
$(this).attr('status','false');
cateId = $(this).parents('tr').attr('cate-id');
$("tbody tr[fid="+cateId+"]").show();
}else{
cateIds = [];
$(this).html('&#xe623;');
$(this).attr('status','true');
cateId = $(this).parents('tr').attr('cate-id');
getCateId(cateId);
for (var i in cateIds) {
$("tbody tr[cate-id="+cateIds[i]+"]").hide().find('.x-show').html('&#xe623;').attr('status','true');
}
}
})
//左侧菜单效果
// $('#content').bind("click",function(event){
//点击菜单显示效果
$(document).ready(function() {
$('.left-nav #nav li .sub-menu li ').click(function(){
$(this).addClass('menu-current').siblings().removeClass('menu-current');
})
});
$('.left-nav #nav li').click(function (event) {
if($(this).children('.sub-menu').length){
if($(this).hasClass('open')){
$(this).removeClass('open');
$(this).find('.nav_right').html('&#xe6a7;');
$(this).children('.sub-menu').stop().slideUp();
$(this).siblings().children('.sub-menu').slideUp();
}else{
$(this).addClass('open');
$(this).children('a').find('.nav_right').html('&#xe6a6;');
$(this).children('.sub-menu').stop().slideDown();
$(this).siblings().children('.sub-menu').stop().slideUp();
$(this).siblings().find('.nav_right').html('&#xe6a7;');
$(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));
for (var i = 0; i <$('.x-iframe').length; i++) {
if($('.x-iframe').eq(i).attr('tab-id')==index+1){
tab.tabChange(index+1);
event.stopPropagation();
return;
}
};
tab.tabAdd(title,url,index+1);
tab.tabChange(index+1);
}
event.stopPropagation();
})
})
var cateIds = [];
function getCateId(cateId) {
$("tbody tr[fid="+cateId+"]").each(function(index, el) {
id = $(el).attr('cate-id');
cateIds.push(id);
getCateId(id);
});
}
/*弹出层*/
/*
参数解释
title 标题
url 请求的url
id 需要操作的数据id
w 弹出层宽度缺省调默认值
h 弹出层高度缺省调默认值
*/
function x_admin_show(title,url,w,h){
if (title == null || title == '') {
title=false;
};
if (url == null || url == '') {
url="404.html";
};
if (w == null || w == '') {
w=($(window).width()*0.9);
};
if (h == null || h == '') {
h=($(window).height() - 50);
};
layer.open({
type: 2,
area: [w+'px', h +'px'],
fix: false, //不固定
maxmin: true,
shadeClose: true,
shade:0.4,
title: title,
content: url
});
}
/*关闭弹出框口*/
function x_admin_close(){
var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);
}

@ -0,0 +1,511 @@
$.fn.xcity = function(pName,cName,aName){
var p = $(this).find('select[lay-filter=province]');
var c = $(this).find('select[lay-filter=city]');
var a = $(this).find('select[lay-filter=area]');
var cityList = [];
var areaList = [];
showP(provinceList);
showC(cityList);
showA(areaList);
function showP(provinceList) {
p.html('');
is_pName = false;
for (var i in provinceList) {
if(pName==provinceList[i].name){
is_pName = true;
cityList = provinceList[i].cityList;
p.append("<option selected value='"+provinceList[i].name+"'>"+provinceList[i].name+"</option>")
}else{
p.append("<option value='"+provinceList[i].name+"'>"+provinceList[i].name+"</option>")
}
}
if(!is_pName){
cityList = provinceList[0].cityList;
}
}
function showC(cityList) {
c.html('');
is_cName = false;
for (var i in cityList) {
if(cName==cityList[i].name){
is_cName = true;
areaList = cityList[i].areaList;
c.append("<option selected value='"+cityList[i].name+"'>"+cityList[i].name+"</option>")
}else{
c.append("<option value='"+cityList[i].name+"'>"+cityList[i].name+"</option>")
}
}
if(!is_cName){
areaList = cityList[0].areaList;
}
}
function showA(areaList) {
a.html('');
for (var i in areaList) {
if(aName==areaList[i]){
a.append("<option selected value='"+areaList[i]+"'>"+areaList[i]+"</option>")
}else{
a.append("<option value='"+areaList[i]+"'>"+areaList[i]+"</option>")
}
}
}
form.render('select');
form.on('select(province)', function(data){
pName = data.value;
showP(provinceList);
showC(cityList);
showA(areaList);
form.render('select');
});
form.on('select(city)', function(data){
cName = data.value;
showC(cityList);
showA(areaList);
form.render('select');
});
}
var provinceList = [
{name:'北京', cityList:[
{name:'市辖区', areaList:['东城区','西城区','崇文区','宣武区','朝阳区','丰台区','石景山区','海淀区','门头沟区','房山区','通州区','顺义区','昌平区','大兴区','怀柔区','平谷区']},
{name:'县', areaList:['密云县','延庆县']}
]},
{name:'上海', cityList:[
{name:'市辖区', areaList:['黄浦区','卢湾区','徐汇区','长宁区','静安区','普陀区','闸北区','虹口区','杨浦区','闵行区','宝山区','嘉定区','浦东新区','金山区','松江区','青浦区','南汇区','奉贤区']},
{name:'县', areaList:['崇明县']}
]},
{name:'天津', cityList:[
{name:'市辖区', areaList:['和平区','河东区','河西区','南开区','河北区','红桥区','塘沽区','汉沽区','大港区','东丽区','西青区','津南区','北辰区','武清区','宝坻区']},
{name:'县', areaList:['宁河县','静海县','蓟 县']}
]},
{name:'重庆', cityList:[
{name:'市辖区', areaList:['万州区','涪陵区','渝中区','大渡口区','江北区','沙坪坝区','九龙坡区','南岸区','北碚区','万盛区','双桥区','渝北区','巴南区','黔江区','长寿区']},
{name:'县', areaList:['綦江县','潼南县','铜梁县','大足县','荣昌县','璧山县','梁平县','城口县','丰都县','垫江县','武隆县','忠 县','开 县','云阳县','奉节县','巫山县','巫溪县','石柱土家族自治县','秀山土家族苗族自治县','酉阳土家族苗族自治县','彭水苗族土家族自治县']},
{name:'市', areaList:['江津市','合川市','永川市','南川市']}
]},
{name:'四川', cityList:[
{name:'成都市', areaList:['市辖区','锦江区','青羊区','金牛区','武侯区','成华区','龙泉驿区','青白江区','新都区','温江县','金堂县','双流县','郫 县','大邑县','蒲江县','新津县','都江堰市','彭州市','邛崃市','崇州市']},
{name:'自贡市', areaList:['市辖区','自流井区','贡井区','大安区','沿滩区','荣 县','富顺县']},
{name:'攀枝花市', areaList:['市辖区','东 区','西 区','仁和区','米易县','盐边县']},
{name:'泸州市', areaList:['市辖区','江阳区','纳溪区','龙马潭区','泸 县','合江县','叙永县','古蔺县']},
{name:'德阳市', areaList:['市辖区','旌阳区','中江县','罗江县','广汉市','什邡市','绵竹市']},
{name:'绵阳市', areaList:['市辖区','涪城区','游仙区','三台县','盐亭县','安 县','梓潼县','北川羌族自治县','平武县','江油市']},
{name:'广元市', areaList:['市辖区','市中区','元坝区','朝天区','旺苍县','青川县','剑阁县','苍溪县']},
{name:'遂宁市', areaList:['市辖区','船山区','安居区','蓬溪县','射洪县','大英县']},
{name:'内江市', areaList:['市辖区','市中区','东兴区','威远县','资中县','隆昌县']},
{name:'乐山市', areaList:['市辖区','市中区','沙湾区','五通桥区','金口河区','犍为县','井研县','夹江县','沐川县','峨边彝族自治县','马边彝族自治县','峨眉山市']},
{name:'南充市', areaList:['市辖区','顺庆区','高坪区','嘉陵区','南部县','营山县','蓬安县','仪陇县','西充县','阆中市']},
{name:'眉山市', areaList:['市辖区','东坡区','仁寿县','彭山县','洪雅县','丹棱县','青神县']},
{name:'宜宾市', areaList:['市辖区','翠屏区','宜宾县','南溪县','江安县','长宁县','高 县','珙 县','筠连县','兴文县','屏山县']},
{name:'广安市', areaList:['市辖区','广安区','岳池县','武胜县','邻水县','华莹市']},
{name:'达州市', areaList:['市辖区','通川区','达 县','宣汉县','开江县','大竹县','渠 县','万源市']},
{name:'雅安市', areaList:['市辖区','雨城区','名山县','荥经县','汉源县','石棉县','天全县','芦山县','宝兴县']},
{name:'巴中市', areaList:['市辖区','巴州区','通江县','南江县','平昌县']},
{name:'资阳市', areaList:['市辖区','雁江区','安岳县','乐至县','简阳市']},
{name:'阿坝藏族羌族自治州', areaList:['汶川县','理 县','茂 县','松潘县','九寨沟县','金川县','小金县','黑水县','马尔康县','壤塘县','阿坝县','若尔盖县','红原县']},
{name:'甘孜藏族自治州', areaList:['康定县','泸定县','丹巴县','九龙县','雅江县','道孚县','炉霍县','甘孜县','新龙县','德格县','白玉县','石渠县','色达县','理塘县','巴塘县','乡城县','稻城县','得荣县']},
{name:'凉山彝族自治州', areaList:['西昌市','木里藏族自治县','盐源县','德昌县','会理县','会东县','宁南县','普格县','布拖县','金阳县','昭觉县','喜德县','冕宁县','越西县','甘洛县','美姑县','雷波县']}
]},
{name:'贵州', cityList:[
{name:'贵阳市', areaList:['市辖区','南明区','云岩区','花溪区','乌当区','白云区','小河区','开阳县','息烽县','修文县','清镇市']},
{name:'六盘水市', areaList:['钟山区','六枝特区','水城县','盘 县']},
{name:'遵义市', areaList:['市辖区','红花岗区','汇川区','遵义县','桐梓县','绥阳县','正安县','道真仡佬族苗族自治县','务川仡佬族苗族自治县','凤冈县','湄潭县','余庆县','习水县','赤水市','仁怀市']},
{name:'安顺市', areaList:['市辖区','西秀区','平坝县','普定县','镇宁布依族苗族自治县','关岭布依族苗族自治县','紫云苗族布依族自治县']},
{name:'铜仁地区', areaList:['铜仁市','江口县','玉屏侗族自治县','石阡县','思南县','印江土家族苗族自治县','德江县','沿河土家族自治县','松桃苗族自治县','万山特区']},
{name:'黔西南布依族苗族自治州', areaList:['兴义市','兴仁县','普安县','晴隆县','贞丰县','望谟县','册亨县','安龙县']},
{name:'毕节地区', areaList:['毕节市','大方县','黔西县','金沙县','织金县','纳雍县','威宁彝族回族苗族自治县','赫章县']},
{name:'黔东南苗族侗族自治州', areaList:['凯里市','黄平县','施秉县','三穗县','镇远县','岑巩县','天柱县','锦屏县','剑河县','台江县','黎平县','榕江县','从江县','雷山县','麻江县','丹寨县']},
{name:'黔南布依族苗族自治州', areaList:['都匀市','福泉市','荔波县','贵定县','瓮安县','独山县','平塘县','罗甸县','长顺县','龙里县','惠水县','三都水族自治县']}
]},
{name:'云南', cityList:[
{name:'昆明市', areaList:['市辖区','五华区','盘龙区','官渡区','西山区','东川区','呈贡县','晋宁县','富民县','宜良县','石林彝族自治县','嵩明县','禄劝彝族苗族自治县','寻甸回族彝族自治县','安宁市']},
{name:'曲靖市', areaList:['市辖区','麒麟区','马龙县','陆良县','师宗县','罗平县','富源县','会泽县','沾益县','宣威市']},
{name:'玉溪市', areaList:['市辖区','红塔区','江川县','澄江县','通海县','华宁县','易门县','峨山彝族自治县','新平彝族傣族自治县','元江哈尼族彝族傣族自治县']},
{name:'保山市', areaList:['市辖区','隆阳区','施甸县','腾冲县','龙陵县','昌宁县']},
{name:'昭通市', areaList:['市辖区','昭阳区','鲁甸县','巧家县','盐津县','大关县','永善县','绥江县','镇雄县','彝良县','威信县','水富县']},
{name:'丽江市', areaList:['市辖区','古城区','玉龙纳西族自治县','永胜县','华坪县','宁蒗彝族自治县']},
{name:'思茅市', areaList:['市辖区','翠云区','普洱哈尼族彝族自治县','墨江哈尼族自治县','景东彝族自治县','景谷傣族彝族自治县','镇沅彝族哈尼族拉祜族自治县','江城哈尼族彝族自治县','孟连傣族拉祜族佤族自治县','澜沧拉祜族自治县','西盟佤族自治县']},
{name:'临沧市', areaList:['市辖区','临翔区','凤庆县','云 县','永德县','镇康县','双江拉祜族佤族布朗族傣族自治县','耿马傣族佤族自治县','沧源佤族自治县']},
{name:'楚雄彝族自治州', areaList:['楚雄市','双柏县','牟定县','南华县','姚安县','大姚县','永仁县','元谋县','武定县','禄丰县']},
{name:'红河哈尼族彝族自治州', areaList:['个旧市','开远市','蒙自县','屏边苗族自治县','建水县','石屏县','弥勒县','泸西县','元阳县','红河县','金平苗族瑶族傣族自治县','绿春县','河口瑶族自治县']},
{name:'文山壮族苗族自治州', areaList:['文山县','砚山县','西畴县','麻栗坡县','马关县','丘北县','广南县','富宁县']},
{name:'西双版纳傣族自治州', areaList:['景洪市','勐海县','勐腊县']},
{name:'大理白族自治州', areaList:['大理市','漾濞彝族自治县','祥云县','宾川县','弥渡县','南涧彝族自治县','巍山彝族回族自治县','永平县','云龙县','洱源县','剑川县','鹤庆县']},
{name:'德宏傣族景颇族自治州', areaList:['瑞丽市','潞西市','梁河县','盈江县','陇川县']},
{name:'怒江傈僳族自治州', areaList:['泸水县','福贡县','贡山独龙族怒族自治县','兰坪白族普米族自治县']},
{name:'迪庆藏族自治州', areaList:['香格里拉县','德钦县','维西傈僳族自治县']}
]},
{name:'西藏', cityList:[
{name:'拉萨市', areaList:['市辖区','城关区','林周县','当雄县','尼木县','曲水县','堆龙德庆县','达孜县','墨竹工卡县']},
{name:'昌都地区', areaList:['昌都县','江达县','贡觉县','类乌齐县','丁青县','察雅县','八宿县','左贡县','芒康县','洛隆县','边坝县']},
{name:'山南地区', areaList:['乃东县','扎囊县','贡嘎县','桑日县','琼结县','曲松县','措美县','洛扎县','加查县','隆子县','错那县','浪卡子县']},
{name:'日喀则地区', areaList:['日喀则市','南木林县','江孜县','定日县','萨迦县','拉孜县','昂仁县','谢通门县','白朗县','仁布县','康马县','定结县','仲巴县','亚东县','吉隆县','聂拉木县','萨嘎县','岗巴县']},
{name:'那曲地区', areaList:['那曲县','嘉黎县','比如县','聂荣县','安多县','申扎县','索 县','班戈县','巴青县','尼玛县']},
{name:'阿里地区', areaList:['普兰县','札达县','噶尔县','日土县','革吉县','改则县','措勤县']},
{name:'林芝地区', areaList:['林芝县','工布江达县','米林县','墨脱县','波密县','察隅县','朗 县']}
]},
{name:'河南', cityList:[
{name:'郑州市', areaList:['市辖区','中原区','二七区','管城回族区','金水区','上街区','邙山区','中牟县','巩义市','荥阳市','新密市','新郑市','登封市']},
{name:'开封市', areaList:['市辖区','龙亭区','顺河回族区','鼓楼区','南关区','郊 区','杞 县','通许县','尉氏县','开封县','兰考县']},
{name:'洛阳市', areaList:['市辖区','老城区','西工区','廛河回族区','涧西区','吉利区','洛龙区','孟津县','新安县','栾川县','嵩 县','汝阳县','宜阳县','洛宁县','伊川县','偃师市']},
{name:'平顶山市', areaList:['市辖区','新华区','卫东区','石龙区','湛河区','宝丰县','叶 县','鲁山县','郏 县','舞钢市','汝州市']},
{name:'安阳市', areaList:['市辖区','文峰区','北关区','殷都区','龙安区','安阳县','汤阴县','滑 县','内黄县','林州市']},
{name:'鹤壁市', areaList:['市辖区','鹤山区','山城区','淇滨区','浚 县','淇 县']},
{name:'新乡市', areaList:['市辖区','红旗区','卫滨区','凤泉区','牧野区','新乡县','获嘉县','原阳县','延津县','封丘县','长垣县','卫辉市','辉县市']},
{name:'焦作市', areaList:['市辖区','解放区','中站区','马村区','山阳区','修武县','博爱县','武陟县','温 县','济源市','沁阳市','孟州市']},
{name:'濮阳市', areaList:['市辖区','华龙区','清丰县','南乐县','范 县','台前县','濮阳县']},
{name:'许昌市', areaList:['市辖区','魏都区','许昌县','鄢陵县','襄城县','禹州市','长葛市']},
{name:'漯河市', areaList:['市辖区','源汇区','郾城区','召陵区','舞阳县','临颍县']},
{name:'三门峡市', areaList:['市辖区','湖滨区','渑池县','陕 县','卢氏县','义马市','灵宝市']},
{name:'南阳市', areaList:['市辖区','宛城区','卧龙区','南召县','方城县','西峡县','镇平县','内乡县','淅川县','社旗县','唐河县','新野县','桐柏县','邓州市']},
{name:'商丘市', areaList:['市辖区','梁园区','睢阳区','民权县','睢 县','宁陵县','柘城县','虞城县','夏邑县','永城市']},
{name:'信阳市', areaList:['市辖区','师河区','平桥区','罗山县','光山县','新 县','商城县','固始县','潢川县','淮滨县','息 县']},
{name:'周口市', areaList:['市辖区','川汇区','扶沟县','西华县','商水县','沈丘县','郸城县','淮阳县','太康县','鹿邑县','项城市']},
{name:'驻马店市', areaList:['市辖区','驿城区','西平县','上蔡县','平舆县','正阳县','确山县','泌阳县','汝南县','遂平县','新蔡县']}
]},
{name:'湖北', cityList:[
{name:'武汉市', areaList:['市辖区','江岸区','江汉区','乔口区','汉阳区','武昌区','青山区','洪山区','东西湖区','汉南区','蔡甸区','江夏区','黄陂区','新洲区']},
{name:'黄石市', areaList:['市辖区','黄石港区','西塞山区','下陆区','铁山区','阳新县','大冶市']},
{name:'十堰市', areaList:['市辖区','茅箭区','张湾区','郧 县','郧西县','竹山县','竹溪县','房 县','丹江口市']},
{name:'宜昌市', areaList:['市辖区','西陵区','伍家岗区','点军区','猇亭区','夷陵区','远安县','兴山县','秭归县','长阳土家族自治县','五峰土家族自治县','宜都市','当阳市','枝江市']},
{name:'襄樊市', areaList:['市辖区','襄城区','樊城区','襄阳区','南漳县','谷城县','保康县','老河口市','枣阳市','宜城市']},
{name:'鄂州市', areaList:['市辖区','梁子湖区','华容区','鄂城区']},
{name:'荆门市', areaList:['市辖区','东宝区','掇刀区','京山县','沙洋县','钟祥市']},
{name:'孝感市', areaList:['市辖区','孝南区','孝昌县','大悟县','云梦县','应城市','安陆市','汉川市']},
{name:'荆州市', areaList:['市辖区','沙市区','荆州区','公安县','监利县','江陵县','石首市','洪湖市','松滋市']},
{name:'黄冈市', areaList:['市辖区','黄州区','团风县','红安县','罗田县','英山县','浠水县','蕲春县','黄梅县','麻城市','武穴市']},
{name:'咸宁市', areaList:['市辖区','咸安区','嘉鱼县','通城县','崇阳县','通山县','赤壁市']},
{name:'随州市', areaList:['市辖区','曾都区','广水市']},
{name:'恩施土家族苗族自治州', areaList:['恩施市','利川市','建始县','巴东县','宣恩县','咸丰县','来凤县','鹤峰县']},
{name:'省直辖行政单位', areaList:['仙桃市','潜江市','天门市','神农架林区']}
]},
{name:'湖南', cityList:[
{name:'长沙市', areaList:['市辖区','芙蓉区','天心区','岳麓区','开福区','雨花区','长沙县','望城县','宁乡县','浏阳市']},
{name:'株洲市', areaList:['市辖区','荷塘区','芦淞区','石峰区','天元区','株洲县','攸 县','茶陵县','炎陵县','醴陵市']},
{name:'湘潭市', areaList:['市辖区','雨湖区','岳塘区','湘潭县','湘乡市','韶山市']},
{name:'衡阳市', areaList:['市辖区','珠晖区','雁峰区','石鼓区','蒸湘区','南岳区','衡阳县','衡南县','衡山县','衡东县','祁东县','耒阳市','常宁市']},
{name:'邵阳市', areaList:['市辖区','双清区','大祥区','北塔区','邵东县','新邵县','邵阳县','隆回县','洞口县','绥宁县','新宁县','城步苗族自治县','武冈市']},
{name:'岳阳市', areaList:['市辖区','岳阳楼区','云溪区','君山区','岳阳县','华容县','湘阴县','平江县','汨罗市','临湘市']},
{name:'常德市', areaList:['市辖区','武陵区','鼎城区','安乡县','汉寿县','澧 县','临澧县','桃源县','石门县','津市市']},
{name:'张家界市', areaList:['市辖区','永定区','武陵源区','慈利县','桑植县']},
{name:'益阳市', areaList:['市辖区','资阳区','赫山区','南 县','桃江县','安化县','沅江市']},
{name:'郴州市', areaList:['市辖区','北湖区','苏仙区','桂阳县','宜章县','永兴县','嘉禾县','临武县','汝城县','桂东县','安仁县','资兴市']},
{name:'永州市', areaList:['市辖区','芝山区','冷水滩区','祁阳县','东安县','双牌县','道 县','江永县','宁远县','蓝山县','新田县','江华瑶族自治县']},
{name:'怀化市', areaList:['市辖区','鹤城区','中方县','沅陵县','辰溪县','溆浦县','会同县','麻阳苗族自治县','新晃侗族自治县','芷江侗族自治县','靖州苗族侗族自治县','通道侗族自治县','洪江市']},
{name:'娄底市', areaList:['市辖区','娄星区','双峰县','新化县','冷水江市','涟源市']},
{name:'湘西土家族苗族自治州', areaList:['吉首市','泸溪县','凤凰县','花垣县','保靖县','古丈县','永顺县','龙山县']}
]},
{name:'广东', cityList:[
{name:'广州市', areaList:['市辖区','东山区','荔湾区','越秀区','海珠区','天河区','芳村区','白云区','黄埔区','番禺区','花都区','增城市','从化市']},
{name:'韶关市', areaList:['市辖区','武江区','浈江区','曲江区','始兴县','仁化县','翁源县','乳源瑶族自治县','新丰县','乐昌市','南雄市']},
{name:'深圳市', areaList:['市辖区','罗湖区','福田区','南山区','宝安区','龙岗区','盐田区']},
{name:'珠海市', areaList:['市辖区','香洲区','斗门区','金湾区']},
{name:'汕头市', areaList:['市辖区','龙湖区','金平区','濠江区','潮阳区','潮南区','澄海区','南澳县']},
{name:'佛山市', areaList:['市辖区','禅城区','南海区','顺德区','三水区','高明区']},
{name:'江门市', areaList:['市辖区','蓬江区','江海区','新会区','台山市','开平市','鹤山市','恩平市']},
{name:'湛江市', areaList:['市辖区','赤坎区','霞山区','坡头区','麻章区','遂溪县','徐闻县','廉江市','雷州市','吴川市']},
{name:'茂名市', areaList:['市辖区','茂南区','茂港区','电白县','高州市','化州市','信宜市']},
{name:'肇庆市', areaList:['市辖区','端州区','鼎湖区','广宁县','怀集县','封开县','德庆县','高要市','四会市']},
{name:'惠州市', areaList:['市辖区','惠城区','惠阳区','博罗县','惠东县','龙门县']},
{name:'梅州市', areaList:['市辖区','梅江区','梅 县','大埔县','丰顺县','五华县','平远县','蕉岭县','兴宁市']},
{name:'汕尾市', areaList:['市辖区','城 区','海丰县','陆河县','陆丰市']},
{name:'河源市', areaList:['市辖区','源城区','紫金县','龙川县','连平县','和平县','东源县']},
{name:'阳江市', areaList:['市辖区','江城区','阳西县','阳东县','阳春市']},
{name:'清远市', areaList:['市辖区','清城区','佛冈县','阳山县','连山壮族瑶族自治县','连南瑶族自治县','清新县','英德市','连州市']},
{name:'东莞市', areaList:['东莞市']},
{name:'中山市', areaList:['中山市']},
{name:'潮州市', areaList:['市辖区','湘桥区','潮安县','饶平县']},
{name:'揭阳市', areaList:['市辖区','榕城区','揭东县','揭西县','惠来县','普宁市']},
{name:'云浮市', areaList:['市辖区','云城区','新兴县','郁南县','云安县','罗定市']}
]},
{name:'广西', cityList:[
{name:'南宁市', areaList:['市辖区','兴宁区','青秀区','江南区','西乡塘区','良庆区','邕宁区','武鸣县','隆安县','马山县','上林县','宾阳县','横 县']},
{name:'柳州市', areaList:['市辖区','城中区','鱼峰区','柳南区','柳北区','柳江县','柳城县','鹿寨县','融安县','融水苗族自治县','三江侗族自治县']},
{name:'桂林市', areaList:['市辖区','秀峰区','叠彩区','象山区','七星区','雁山区','阳朔县','临桂县','灵川县','全州县','兴安县','永福县','灌阳县','龙胜各族自治县','资源县','平乐县','荔蒲县','恭城瑶族自治县']},
{name:'梧州市', areaList:['市辖区','万秀区','蝶山区','长洲区','苍梧县','藤 县','蒙山县','岑溪市']},
{name:'北海市', areaList:['市辖区','海城区','银海区','铁山港区','合浦县']},
{name:'防城港市', areaList:['市辖区','港口区','防城区','上思县','东兴市']},
{name:'钦州市', areaList:['市辖区','钦南区','钦北区','灵山县','浦北县']},
{name:'贵港市', areaList:['市辖区','港北区','港南区','覃塘区','平南县','桂平市']},
{name:'玉林市', areaList:['市辖区','玉州区','容 县','陆川县','博白县','兴业县','北流市']},
{name:'百色市', areaList:['市辖区','右江区','田阳县','田东县','平果县','德保县','靖西县','那坡县','凌云县','乐业县','田林县','西林县','隆林各族自治县']},
{name:'贺州市', areaList:['市辖区','八步区','昭平县','钟山县','富川瑶族自治县']},
{name:'河池市', areaList:['市辖区','金城江区','南丹县','天峨县','凤山县','东兰县','罗城仫佬族自治县','环江毛南族自治县','巴马瑶族自治县','都安瑶族自治县','大化瑶族自治县','宜州市']},
{name:'来宾市', areaList:['市辖区','兴宾区','忻城县','象州县','武宣县','金秀瑶族自治县','合山市']},
{name:'崇左市', areaList:['市辖区','江洲区','扶绥县','宁明县','龙州县','大新县','天等县','凭祥市']}
]},
{name:'陕西', cityList:[
{name:'西安市', areaList:['市辖区','新城区','碑林区','莲湖区','灞桥区','未央区','雁塔区','阎良区','临潼区','长安区','蓝田县','周至县','户 县','高陵县']},
{name:'铜川市', areaList:['市辖区','王益区','印台区','耀州区','宜君县']},
{name:'宝鸡市', areaList:['市辖区','渭滨区','金台区','陈仓区','凤翔县','岐山县','扶风县','眉 县','陇 县','千阳县','麟游县','凤 县','太白县']},
{name:'咸阳市', areaList:['市辖区','秦都区','杨凌区','渭城区','三原县','泾阳县','乾 县','礼泉县','永寿县','彬 县','长武县','旬邑县','淳化县','武功县','兴平市']},
{name:'渭南市', areaList:['市辖区','临渭区','华 县','潼关县','大荔县','合阳县','澄城县','蒲城县','白水县','富平县','韩城市','华阴市']},
{name:'延安市', areaList:['市辖区','宝塔区','延长县','延川县','子长县','安塞县','志丹县','吴旗县','甘泉县','富 县','洛川县','宜川县','黄龙县','黄陵县']},
{name:'汉中市', areaList:['市辖区','汉台区','南郑县','城固县','洋 县','西乡县','勉 县','宁强县','略阳县','镇巴县','留坝县','佛坪县']},
{name:'榆林市', areaList:['市辖区','榆阳区','神木县','府谷县','横山县','靖边县','定边县','绥德县','米脂县','佳 县','吴堡县','清涧县','子洲县']},
{name:'安康市', areaList:['市辖区','汉滨区','汉阴县','石泉县','宁陕县','紫阳县','岚皋县','平利县','镇坪县','旬阳县','白河县']},
{name:'商洛市', areaList:['市辖区','商州区','洛南县','丹凤县','商南县','山阳县','镇安县','柞水县']}
]},
{name:'甘肃', cityList:[
{name:'兰州市', areaList:['市辖区','城关区','七里河区','西固区','安宁区','红古区','永登县','皋兰县','榆中县']},
{name:'嘉峪关市', areaList:['市辖区']},
{name:'金昌市', areaList:['市辖区','金川区','永昌县']},
{name:'白银市', areaList:['市辖区','白银区','平川区','靖远县','会宁县','景泰县']},
{name:'天水市', areaList:['市辖区','秦城区','北道区','清水县','秦安县','甘谷县','武山县','张家川回族自治县']},
{name:'武威市', areaList:['市辖区','凉州区','民勤县','古浪县','天祝藏族自治县']},
{name:'张掖市', areaList:['市辖区','甘州区','肃南裕固族自治县','民乐县','临泽县','高台县','山丹县']},
{name:'平凉市', areaList:['市辖区','崆峒区','泾川县','灵台县','崇信县','华亭县','庄浪县','静宁县']},
{name:'酒泉市', areaList:['市辖区','肃州区','金塔县','安西县','肃北蒙古族自治县','阿克塞哈萨克族自治县','玉门市','敦煌市']},
{name:'庆阳市', areaList:['市辖区','西峰区','庆城县','环 县','华池县','合水县','正宁县','宁 县','镇原县']},
{name:'定西市', areaList:['市辖区','安定区','通渭县','陇西县','渭源县','临洮县','漳 县','岷 县']},
{name:'陇南市', areaList:['市辖区','武都区','成 县','文 县','宕昌县','康 县','西和县','礼 县','徽 县','两当县']},
{name:'临夏回族自治州', areaList:['临夏市','临夏县','康乐县','永靖县','广河县','和政县','东乡族自治县','积石山保安族东乡族撒拉族自治县']},
{name:'甘南藏族自治州', areaList:['合作市','临潭县','卓尼县','舟曲县','迭部县','玛曲县','碌曲县','夏河县']}
]},
{name:'青海', cityList:[
{name:'西宁市', areaList:['市辖区','城东区','城中区','城西区','城北区','大通回族土族自治县','湟中县','湟源县']},
{name:'海东地区', areaList:['平安县','民和回族土族自治县','乐都县','互助土族自治县','化隆回族自治县','循化撒拉族自治县']},
{name:'海北藏族自治州', areaList:['门源回族自治县','祁连县','海晏县','刚察县']},
{name:'黄南藏族自治州', areaList:['同仁县','尖扎县','泽库县','河南蒙古族自治县']},
{name:'海南藏族自治州', areaList:['共和县','同德县','贵德县','兴海县','贵南县']},
{name:'果洛藏族自治州', areaList:['玛沁县','班玛县','甘德县','达日县','久治县','玛多县']},
{name:'玉树藏族自治州', areaList:['玉树县','杂多县','称多县','治多县','囊谦县','曲麻莱县']},
{name:'海西蒙古族藏族自治州', areaList:['格尔木市','德令哈市','乌兰县','都兰县','天峻县']}
]},
{name:'宁夏', cityList:[
{name:'银川市', areaList:['市辖区','兴庆区','西夏区','金凤区','永宁县','贺兰县','灵武市']},
{name:'石嘴山市', areaList:['市辖区','大武口区','惠农区','平罗县']},
{name:'吴忠市', areaList:['市辖区','利通区','盐池县','同心县','青铜峡市']},
{name:'固原市', areaList:['市辖区','原州区','西吉县','隆德县','泾源县','彭阳县','海原县']},
{name:'中卫市', areaList:['市辖区','沙坡头区','中宁县']}
]},
{name:'新疆', cityList:[
{name:'乌鲁木齐市', areaList:['市辖区','天山区','沙依巴克区','新市区','水磨沟区','头屯河区','达坂城区','东山区','乌鲁木齐县']},
{name:'克拉玛依市', areaList:['市辖区','独山子区','克拉玛依区','白碱滩区','乌尔禾区']},
{name:'吐鲁番地区', areaList:['吐鲁番市','鄯善县','托克逊县']},
{name:'哈密地区', areaList:['哈密市','巴里坤哈萨克自治县','伊吾县']},
{name:'昌吉回族自治州', areaList:['昌吉市','阜康市','米泉市','呼图壁县','玛纳斯县','奇台县','吉木萨尔县','木垒哈萨克自治县']},
{name:'博尔塔拉蒙古自治州', areaList:['博乐市','精河县','温泉县']},
{name:'巴音郭楞蒙古自治州', areaList:['库尔勒市','轮台县','尉犁县','若羌县','且末县','焉耆回族自治县','和静县','和硕县','博湖县']},
{name:'阿克苏地区', areaList:['阿克苏市','温宿县','库车县','沙雅县','新和县','拜城县','乌什县','阿瓦提县','柯坪县']},
{name:'克孜勒苏柯尔克孜自治州', areaList:['阿图什市','阿克陶县','阿合奇县','乌恰县']},
{name:'喀什地区', areaList:['喀什市','疏附县','疏勒县','英吉沙县','泽普县','莎车县','叶城县','麦盖提县','岳普湖县','伽师县','巴楚县','塔什库尔干塔吉克自治县']},
{name:'和田地区', areaList:['和田市','和田县','墨玉县','皮山县','洛浦县','策勒县','于田县','民丰县']},
{name:'伊犁哈萨克自治州', areaList:['伊宁市','奎屯市','伊宁县','察布查尔锡伯自治县','霍城县','巩留县','新源县','昭苏县','特克斯县','尼勒克县']},
{name:'塔城地区', areaList:['塔城市','乌苏市','额敏县','沙湾县','托里县','裕民县','和布克赛尔蒙古自治县']},
{name:'阿勒泰地区', areaList:['阿勒泰市','布尔津县','富蕴县','福海县','哈巴河县','青河县','吉木乃县']},
{name:'省直辖行政单位', areaList:['石河子市','阿拉尔市','图木舒克市','五家渠市']}
]},
{name:'河北', cityList:[
{name:'石家庄市', areaList:['市辖区','长安区','桥东区','桥西区','新华区','井陉矿区','裕华区','井陉县','正定县','栾城县','行唐县','灵寿县','高邑县','深泽县','赞皇县','无极县','平山县','元氏县','赵 县','辛集市','藁城市','晋州市','新乐市','鹿泉市']},
{name:'唐山市', areaList:['市辖区','路南区','路北区','古冶区','开平区','丰南区','丰润区','滦 县','滦南县','乐亭县','迁西县','玉田县','唐海县','遵化市','迁安市']},
{name:'秦皇岛市', areaList:['市辖区','海港区','山海关区','北戴河区','青龙满族自治县','昌黎县','抚宁县','卢龙县']},
{name:'邯郸市', areaList:['市辖区','邯山区','丛台区','复兴区','峰峰矿区','邯郸县','临漳县','成安县','大名县','涉 县','磁 县','肥乡县','永年县','邱 县','鸡泽县','广平县','馆陶县','魏 县','曲周县','武安市']},
{name:'邢台市', areaList:['市辖区','桥东区','桥西区','邢台县','临城县','内丘县','柏乡县','隆尧县','任 县','南和县','宁晋县','巨鹿县','新河县','广宗县','平乡县','威 县','清河县','临西县','南宫市','沙河市']},
{name:'保定市', areaList:['市辖区','新市区','北市区','南市区','满城县','清苑县','涞水县','阜平县','徐水县','定兴县','唐 县','高阳县','容城县','涞源县','望都县','安新县','易 县','曲阳县','蠡 县','顺平县','博野县','雄 县','涿州市','定州市','安国市','高碑店市']},
{name:'张家口市', areaList:['市辖区','桥东区','桥西区','宣化区','下花园区','宣化县','张北县','康保县','沽源县','尚义县','蔚 县','阳原县','怀安县','万全县','怀来县','涿鹿县','赤城县','崇礼县']},
{name:'承德市', areaList:['市辖区','双桥区','双滦区','鹰手营子矿区','承德县','兴隆县','平泉县','滦平县','隆化县','丰宁满族自治县','宽城满族自治县','围场满族蒙古族自治县']},
{name:'沧州市', areaList:['市辖区','新华区','运河区','沧 县','青 县','东光县','海兴县','盐山县','肃宁县','南皮县','吴桥县','献 县','孟村回族自治县','泊头市','任丘市','黄骅市','河间市']},
{name:'廊坊市', areaList:['市辖区','安次区','广阳区','固安县','永清县','香河县','大城县','文安县','大厂回族自治县','霸州市','三河市']},
{name:'衡水市', areaList:['市辖区','桃城区','枣强县','武邑县','武强县','饶阳县','安平县','故城县','景 县','阜城县','冀州市','深州市']}
]},
{name:'山西', cityList:[
{name:'太原市', areaList:['市辖区','小店区','迎泽区','杏花岭区','尖草坪区','万柏林区','晋源区','清徐县','阳曲县','娄烦县','古交市']},
{name:'大同市', areaList:['市辖区','城 区','矿 区','南郊区','新荣区','阳高县','天镇县','广灵县','灵丘县','浑源县','左云县','大同县']},
{name:'阳泉市', areaList:['市辖区','城 区','矿 区','郊 区','平定县','盂 县']},
{name:'长治市', areaList:['市辖区','城 区','郊 区','长治县','襄垣县','屯留县','平顺县','黎城县','壶关县','长子县','武乡县','沁 县','沁源县','潞城市']},
{name:'晋城市', areaList:['市辖区','城 区','沁水县','阳城县','陵川县','泽州县','高平市']},
{name:'朔州市', areaList:['市辖区','朔城区','平鲁区','山阴县','应 县','右玉县','怀仁县']},
{name:'晋中市', areaList:['市辖区','榆次区','榆社县','左权县','和顺县','昔阳县','寿阳县','太谷县','祁 县','平遥县','灵石县','介休市']},
{name:'运城市', areaList:['市辖区','盐湖区','临猗县','万荣县','闻喜县','稷山县','新绛县','绛 县','垣曲县','夏 县','平陆县','芮城县','永济市','河津市']},
{name:'忻州市', areaList:['市辖区','忻府区','定襄县','五台县','代 县','繁峙县','宁武县','静乐县','神池县','五寨县','岢岚县','河曲县','保德县','偏关县','原平市']},
{name:'临汾市', areaList:['市辖区','尧都区','曲沃县','翼城县','襄汾县','洪洞县','古 县','安泽县','浮山县','吉 县','乡宁县','大宁县','隰 县','永和县','蒲 县','汾西县','侯马市','霍州市']},
{name:'吕梁市', areaList:['市辖区','离石区','文水县','交城县','兴 县','临 县','柳林县','石楼县','岚 县','方山县','中阳县','交口县','孝义市','汾阳市']}
]},
{name:'内蒙古', cityList:[
{name:'呼和浩特市', areaList:['市辖区','新城区','回民区','玉泉区','赛罕区','土默特左旗','托克托县','和林格尔县','清水河县','武川县']},
{name:'包头市', areaList:['市辖区','东河区','昆都仑区','青山区','石拐区','白云矿区','九原区','土默特右旗','固阳县','达尔罕茂明安联合旗']},
{name:'乌海市', areaList:['市辖区','海勃湾区','海南区','乌达区']},
{name:'赤峰市', areaList:['市辖区','红山区','元宝山区','松山区','阿鲁科尔沁旗','巴林左旗','巴林右旗','林西县','克什克腾旗','翁牛特旗','喀喇沁旗','宁城县','敖汉旗']},
{name:'通辽市', areaList:['市辖区','科尔沁区','科尔沁左翼中旗','科尔沁左翼后旗','开鲁县','库伦旗','奈曼旗','扎鲁特旗','霍林郭勒市']},
{name:'鄂尔多斯市', areaList:['东胜区','达拉特旗','准格尔旗','鄂托克前旗','鄂托克旗','杭锦旗','乌审旗','伊金霍洛旗']},
{name:'呼伦贝尔市', areaList:['市辖区','海拉尔区','阿荣旗','莫力达瓦达斡尔族自治旗','鄂伦春自治旗','鄂温克族自治旗','陈巴尔虎旗','新巴尔虎左旗','新巴尔虎右旗','满洲里市','牙克石市','扎兰屯市','额尔古纳市','根河市']},
{name:'巴彦淖尔市', areaList:['市辖区','临河区','五原县','磴口县','乌拉特前旗','乌拉特中旗','乌拉特后旗','杭锦后旗']},
{name:'乌兰察布市', areaList:['市辖区','集宁区','卓资县','化德县','商都县','兴和县','凉城县','察哈尔右翼前旗','察哈尔右翼中旗','察哈尔右翼后旗','四子王旗','丰镇市']},
{name:'兴安盟', areaList:['乌兰浩特市','阿尔山市','科尔沁右翼前旗','科尔沁右翼中旗','扎赉特旗','突泉县']},
{name:'锡林郭勒盟', areaList:['二连浩特市','锡林浩特市','阿巴嘎旗','苏尼特左旗','苏尼特右旗','东乌珠穆沁旗','西乌珠穆沁旗','太仆寺旗','镶黄旗','正镶白旗','正蓝旗','多伦县']},
{name:'阿拉善盟', areaList:['阿拉善左旗','阿拉善右旗','额济纳旗']}
]},
{name:'江苏', cityList:[
{name:'南京市', areaList:['市辖区','玄武区','白下区','秦淮区','建邺区','鼓楼区','下关区','浦口区','栖霞区','雨花台区','江宁区','六合区','溧水县','高淳县']},
{name:'无锡市', areaList:['市辖区','崇安区','南长区','北塘区','锡山区','惠山区','滨湖区','江阴市','宜兴市']},
{name:'徐州市', areaList:['市辖区','鼓楼区','云龙区','九里区','贾汪区','泉山区','丰 县','沛 县','铜山县','睢宁县','新沂市','邳州市']},
{name:'常州市', areaList:['市辖区','天宁区','钟楼区','戚墅堰区','新北区','武进区','溧阳市','金坛市']},
{name:'苏州市', areaList:['市辖区','沧浪区','平江区','金阊区','虎丘区','吴中区','相城区','常熟市','张家港市','昆山市','吴江市','太仓市']},
{name:'南通市', areaList:['市辖区','崇川区','港闸区','海安县','如东县','启东市','如皋市','通州市','海门市']},
{name:'连云港市', areaList:['市辖区','连云区','新浦区','海州区','赣榆县','东海县','灌云县','灌南县']},
{name:'淮安市', areaList:['市辖区','清河区','楚州区','淮阴区','清浦区','涟水县','洪泽县','盱眙县','金湖县']},
{name:'盐城市', areaList:['市辖区','亭湖区','盐都区','响水县','滨海县','阜宁县','射阳县','建湖县','东台市','大丰市']},
{name:'扬州市', areaList:['市辖区','广陵区','邗江区','郊 区','宝应县','仪征市','高邮市','江都市']},
{name:'镇江市', areaList:['市辖区','京口区','润州区','丹徒区','丹阳市','扬中市','句容市']},
{name:'泰州市', areaList:['市辖区','海陵区','高港区','兴化市','靖江市','泰兴市','姜堰市']},
{name:'宿迁市', areaList:['市辖区','宿城区','宿豫区','沭阳县','泗阳县','泗洪县']}
]},
{name:'浙江', cityList:[
{name:'杭州市', areaList:['市辖区','上城区','下城区','江干区','拱墅区','西湖区','滨江区','萧山区','余杭区','桐庐县','淳安县','建德市','富阳市','临安市']},
{name:'宁波市', areaList:['市辖区','海曙区','江东区','江北区','北仑区','镇海区','鄞州区','象山县','宁海县','余姚市','慈溪市','奉化市']},
{name:'温州市', areaList:['市辖区','鹿城区','龙湾区','瓯海区','洞头县','永嘉县','平阳县','苍南县','文成县','泰顺县','瑞安市','乐清市']},
{name:'嘉兴市', areaList:['市辖区','秀城区','秀洲区','嘉善县','海盐县','海宁市','平湖市','桐乡市']},
{name:'湖州市', areaList:['市辖区','吴兴区','南浔区','德清县','长兴县','安吉县']},
{name:'绍兴市', areaList:['市辖区','越城区','绍兴县','新昌县','诸暨市','上虞市','嵊州市']},
{name:'金华市', areaList:['市辖区','婺城区','金东区','武义县','浦江县','磐安县','兰溪市','义乌市','东阳市','永康市']},
{name:'衢州市', areaList:['市辖区','柯城区','衢江区','常山县','开化县','龙游县','江山市']},
{name:'舟山市', areaList:['市辖区','定海区','普陀区','岱山县','嵊泗县']},
{name:'台州市', areaList:['市辖区','椒江区','黄岩区','路桥区','玉环县','三门县','天台县','仙居县','温岭市','临海市']},
{name:'丽水市', areaList:['市辖区','莲都区','青田县','缙云县','遂昌县','松阳县','云和县','庆元县','景宁畲族自治县','龙泉市']}
]},
{name:'安徽', cityList:[
{name:'合肥市', areaList:['市辖区','瑶海区','庐阳区','蜀山区','包河区','长丰县','肥东县','肥西县']},
{name:'芜湖市', areaList:['市辖区','镜湖区','马塘区','新芜区','鸠江区','芜湖县','繁昌县','南陵县']},
{name:'蚌埠市', areaList:['市辖区','龙子湖区','蚌山区','禹会区','淮上区','怀远县','五河县','固镇县']},
{name:'淮南市', areaList:['市辖区','大通区','田家庵区','谢家集区','八公山区','潘集区','凤台县']},
{name:'马鞍山市', areaList:['市辖区','金家庄区','花山区','雨山区','当涂县']},
{name:'淮北市', areaList:['市辖区','杜集区','相山区','烈山区','濉溪县']},
{name:'铜陵市', areaList:['市辖区','铜官山区','狮子山区','郊 区','铜陵县']},
{name:'安庆市', areaList:['市辖区','迎江区','大观区','郊 区','怀宁县','枞阳县','潜山县','太湖县','宿松县','望江县','岳西县','桐城市']},
{name:'黄山市', areaList:['市辖区','屯溪区','黄山区','徽州区','歙 县','休宁县','黟 县','祁门县']},
{name:'滁州市', areaList:['市辖区','琅琊区','南谯区','来安县','全椒县','定远县','凤阳县','天长市','明光市']},
{name:'阜阳市', areaList:['市辖区','颍州区','颍东区','颍泉区','临泉县','太和县','阜南县','颍上县','界首市']},
{name:'宿州市', areaList:['市辖区','墉桥区','砀山县','萧 县','灵璧县','泗 县']},
{name:'巢湖市', areaList:['市辖区','居巢区','庐江县','无为县','含山县','和 县']},
{name:'六安市', areaList:['市辖区','金安区','裕安区','寿 县','霍邱县','舒城县','金寨县','霍山县']},
{name:'亳州市', areaList:['市辖区','谯城区','涡阳县','蒙城县','利辛县']},
{name:'池州市', areaList:['市辖区','贵池区','东至县','石台县','青阳县']},
{name:'宣城市', areaList:['市辖区','宣州区','郎溪县','广德县','泾 县','绩溪县','旌德县','宁国市']}
]},
{name:'福建', cityList:[
{name:'福州市', areaList:['市辖区','鼓楼区','台江区','仓山区','马尾区','晋安区','闽侯县','连江县','罗源县','闽清县','永泰县','平潭县','福清市','长乐市']},
{name:'厦门市', areaList:['市辖区','思明区','海沧区','湖里区','集美区','同安区','翔安区']},
{name:'莆田市', areaList:['市辖区','城厢区','涵江区','荔城区','秀屿区','仙游县']},
{name:'三明市', areaList:['市辖区','梅列区','三元区','明溪县','清流县','宁化县','大田县','尤溪县','沙 县','将乐县','泰宁县','建宁县','永安市']},
{name:'泉州市', areaList:['市辖区','鲤城区','丰泽区','洛江区','泉港区','惠安县','安溪县','永春县','德化县','金门县','石狮市','晋江市','南安市']},
{name:'漳州市', areaList:['市辖区','芗城区','龙文区','云霄县','漳浦县','诏安县','长泰县','东山县','南靖县','平和县','华安县','龙海市']},
{name:'南平市', areaList:['市辖区','延平区','顺昌县','浦城县','光泽县','松溪县','政和县','邵武市','武夷山市','建瓯市','建阳市']},
{name:'龙岩市', areaList:['市辖区','新罗区','长汀县','永定县','上杭县','武平县','连城县','漳平市']},
{name:'宁德市', areaList:['市辖区','蕉城区','霞浦县','古田县','屏南县','寿宁县','周宁县','柘荣县','福安市','福鼎市']}
]},
{name:'江西', cityList:[
{name:'南昌市', areaList:['市辖区','东湖区','西湖区','青云谱区','湾里区','青山湖区','南昌县','新建县','安义县','进贤县']},
{name:'景德镇市', areaList:['市辖区','昌江区','珠山区','浮梁县','乐平市']},
{name:'萍乡市', areaList:['市辖区','安源区','湘东区','莲花县','上栗县','芦溪县']},
{name:'九江市', areaList:['市辖区','庐山区','浔阳区','九江县','武宁县','修水县','永修县','德安县','星子县','都昌县','湖口县','彭泽县','瑞昌市']},
{name:'新余市', areaList:['市辖区','渝水区','分宜县']},
{name:'鹰潭市', areaList:['市辖区','月湖区','余江县','贵溪市']},
{name:'赣州市', areaList:['市辖区','章贡区','赣 县','信丰县','大余县','上犹县','崇义县','安远县','龙南县','定南县','全南县','宁都县','于都县','兴国县','会昌县','寻乌县','石城县','瑞金市','南康市']},
{name:'吉安市', areaList:['市辖区','吉州区','青原区','吉安县','吉水县','峡江县','新干县','永丰县','泰和县','遂川县','万安县','安福县','永新县','井冈山市']},
{name:'宜春市', areaList:['市辖区','袁州区','奉新县','万载县','上高县','宜丰县','靖安县','铜鼓县','丰城市','樟树市','高安市']},
{name:'抚州市', areaList:['市辖区','临川区','南城县','黎川县','南丰县','崇仁县','乐安县','宜黄县','金溪县','资溪县','东乡县','广昌县']},
{name:'上饶市', areaList:['市辖区','信州区','上饶县','广丰县','玉山县','铅山县','横峰县','弋阳县','余干县','鄱阳县','万年县','婺源县','德兴市']}
]},
{name:'山东', cityList:[
{name:'济南市', areaList:['市辖区','历下区','市中区','槐荫区','天桥区','历城区','长清区','平阴县','济阳县','商河县','章丘市']},
{name:'青岛市', areaList:['市辖区','市南区','市北区','四方区','黄岛区','崂山区','李沧区','城阳区','胶州市','即墨市','平度市','胶南市','莱西市']},
{name:'淄博市', areaList:['市辖区','淄川区','张店区','博山区','临淄区','周村区','桓台县','高青县','沂源县']},
{name:'枣庄市', areaList:['市辖区','市中区','薛城区','峄城区','台儿庄区','山亭区','滕州市']},
{name:'东营市', areaList:['市辖区','东营区','河口区','垦利县','利津县','广饶县']},
{name:'烟台市', areaList:['市辖区','芝罘区','福山区','牟平区','莱山区','长岛县','龙口市','莱阳市','莱州市','蓬莱市','招远市','栖霞市','海阳市']},
{name:'潍坊市', areaList:['市辖区','潍城区','寒亭区','坊子区','奎文区','临朐县','昌乐县','青州市','诸城市','寿光市','安丘市','高密市','昌邑市']},
{name:'济宁市', areaList:['市辖区','市中区','任城区','微山县','鱼台县','金乡县','嘉祥县','汶上县','泗水县','梁山县','曲阜市','兖州市','邹城市']},
{name:'泰安市', areaList:['市辖区','泰山区','岱岳区','宁阳县','东平县','新泰市','肥城市']},
{name:'威海市', areaList:['市辖区','环翠区','文登市','荣成市','乳山市']},
{name:'日照市', areaList:['市辖区','东港区','岚山区','五莲县','莒 县']},
{name:'莱芜市', areaList:['市辖区','莱城区','钢城区']},
{name:'临沂市', areaList:['市辖区','兰山区','罗庄区','河东区','沂南县','郯城县','沂水县','苍山县','费 县','平邑县','莒南县','蒙阴县','临沭县']},
{name:'德州市', areaList:['市辖区','德城区','陵 县','宁津县','庆云县','临邑县','齐河县','平原县','夏津县','武城县','乐陵市','禹城市']},
{name:'聊城市', areaList:['市辖区','东昌府区','阳谷县','莘 县','茌平县','东阿县','冠 县','高唐县','临清市']},
{name:'滨州市', areaList:['市辖区','滨城区','惠民县','阳信县','无棣县','沾化县','博兴县','邹平县']},
{name:'荷泽市', areaList:['市辖区','牡丹区','曹 县','单 县','成武县','巨野县','郓城县','鄄城县','定陶县','东明县']}
]},
{name:'辽宁', cityList:[
{name:'沈阳市', areaList:['市辖区','和平区','沈河区','大东区','皇姑区','铁西区','苏家屯区','东陵区','新城子区','于洪区','辽中县','康平县','法库县','新民市']},
{name:'大连市', areaList:['市辖区','中山区','西岗区','沙河口区','甘井子区','旅顺口区','金州区','长海县','瓦房店市','普兰店市','庄河市']},
{name:'鞍山市', areaList:['市辖区','铁东区','铁西区','立山区','千山区','台安县','岫岩满族自治县','海城市']},
{name:'抚顺市', areaList:['市辖区','新抚区','东洲区','望花区','顺城区','抚顺县','新宾满族自治县','清原满族自治县']},
{name:'本溪市', areaList:['市辖区','平山区','溪湖区','明山区','南芬区','本溪满族自治县','桓仁满族自治县']},
{name:'丹东市', areaList:['市辖区','元宝区','振兴区','振安区','宽甸满族自治县','东港市','凤城市']},
{name:'锦州市', areaList:['市辖区','古塔区','凌河区','太和区','黑山县','义 县','凌海市','北宁市']},
{name:'营口市', areaList:['市辖区','站前区','西市区','鲅鱼圈区','老边区','盖州市','大石桥市']},
{name:'阜新市', areaList:['市辖区','海州区','新邱区','太平区','清河门区','细河区','阜新蒙古族自治县','彰武县']},
{name:'辽阳市', areaList:['市辖区','白塔区','文圣区','宏伟区','弓长岭区','太子河区','辽阳县','灯塔市']},
{name:'盘锦市', areaList:['市辖区','双台子区','兴隆台区','大洼县','盘山县']},
{name:'铁岭市', areaList:['市辖区','银州区','清河区','铁岭县','西丰县','昌图县','调兵山市','开原市']},
{name:'朝阳市', areaList:['市辖区','双塔区','龙城区','朝阳县','建平县','喀喇沁左翼蒙古族自治县','北票市','凌源市']},
{name:'葫芦岛市', areaList:['市辖区','连山区','龙港区','南票区','绥中县','建昌县','兴城市']}
]},
{name:'吉林', cityList:[
{name:'长春市', areaList:['市辖区','南关区','宽城区','朝阳区','二道区','绿园区','双阳区','农安县','九台市','榆树市','德惠市']},
{name:'吉林市', areaList:['市辖区','昌邑区','龙潭区','船营区','丰满区','永吉县','蛟河市','桦甸市','舒兰市','磐石市']},
{name:'四平市', areaList:['市辖区','铁西区','铁东区','梨树县','伊通满族自治县','公主岭市','双辽市']},
{name:'辽源市', areaList:['市辖区','龙山区','西安区','东丰县','东辽县']},
{name:'通化市', areaList:['市辖区','东昌区','二道江区','通化县','辉南县','柳河县','梅河口市','集安市']},
{name:'白山市', areaList:['市辖区','八道江区','抚松县','靖宇县','长白朝鲜族自治县','江源县','临江市']},
{name:'松原市', areaList:['市辖区','宁江区','前郭尔罗斯蒙古族自治县','长岭县','乾安县','扶余县']},
{name:'白城市', areaList:['市辖区','洮北区','镇赉县','通榆县','洮南市','大安市']},
{name:'延边朝鲜族自治州', areaList:['延吉市','图们市','敦化市','珲春市','龙井市','和龙市','汪清县','安图县']}
]},
{name:'黑龙江', cityList:[
{name:'哈尔滨市', areaList:['市辖区','道里区','南岗区','道外区','香坊区','动力区','平房区','松北区','呼兰区','依兰县','方正县','宾 县','巴彦县','木兰县','通河县','延寿县','阿城市','双城市','尚志市','五常市']},
{name:'齐齐哈尔市', areaList:['市辖区','龙沙区','建华区','铁锋区','昂昂溪区','富拉尔基区','碾子山区','梅里斯达斡尔族区','龙江县','依安县','泰来县','甘南县','富裕县','克山县','克东县','拜泉县','讷河市']},
{name:'鸡西市', areaList:['市辖区','鸡冠区','恒山区','滴道区','梨树区','城子河区','麻山区','鸡东县','虎林市','密山市']},
{name:'鹤岗市', areaList:['市辖区','向阳区','工农区','南山区','兴安区','东山区','兴山区','萝北县','绥滨县']},
{name:'双鸭山市', areaList:['市辖区','尖山区','岭东区','四方台区','宝山区','集贤县','友谊县','宝清县','饶河县']},
{name:'大庆市', areaList:['市辖区','萨尔图区','龙凤区','让胡路区','红岗区','大同区','肇州县','肇源县','林甸县','杜尔伯特蒙古族自治县']},
{name:'伊春市', areaList:['市辖区','伊春区','南岔区','友好区','西林区','翠峦区','新青区','美溪区','金山屯区','五营区','乌马河区','汤旺河区','带岭区','乌伊岭区','红星区','上甘岭区','嘉荫县','铁力市']},
{name:'佳木斯市', areaList:['市辖区','永红区','向阳区','前进区','东风区','郊 区','桦南县','桦川县','汤原县','抚远县','同江市','富锦市']},
{name:'七台河市', areaList:['市辖区','新兴区','桃山区','茄子河区','勃利县']},
{name:'牡丹江市', areaList:['市辖区','东安区','阳明区','爱民区','西安区','东宁县','林口县','绥芬河市','海林市','宁安市','穆棱市']},
{name:'黑河市', areaList:['市辖区','爱辉区','嫩江县','逊克县','孙吴县','北安市','五大连池市']},
{name:'绥化市', areaList:['市辖区','北林区','望奎县','兰西县','青冈县','庆安县','明水县','绥棱县','安达市','肇东市','海伦市']},
{name:'大兴安岭地区', areaList:['呼玛县','塔河县','漠河县']}
]},
{name:'海南', cityList:[
{name:'海口市', areaList:['市辖区','秀英区','龙华区','琼山区','美兰区']},
{name:'三亚市', areaList:['市辖区']},
{name:'省直辖县级行政单位', areaList:['五指山市','琼海市','儋州市','文昌市','万宁市','东方市','定安县','屯昌县','澄迈县','临高县','白沙黎族自治县','昌江黎族自治县','乐东黎族自治县','陵水黎族自治县','保亭黎族苗族自治县','琼中黎族苗族自治县','西沙群岛','南沙群岛','中沙群岛的岛礁及其海域']}
]},
{name:'台湾', cityList:[
{name:'台湾', areaList:['台湾']}
]},
{name:'香港', cityList:[
{name:'香港', areaList:['香港']}
]},
{name:'澳门', cityList:[
{name:'澳门', areaList:['澳门']}
]}
];

@ -0,0 +1,465 @@
/**
layui
By
*/
h1,h2,h3{font-size: 14px;}
::-webkit-input-placeholder{color: #999}
/* 甯冨眬 */
.site-inline{font-size: 0;}
.site-tree, .site-content{display: inline-block; *display:inline; *zoom:1; vertical-align: top; font-size: 14px;}
.site-tree{width: 220px; min-height: 900px; padding: 5px 0 20px;}
.site-content{width: 899px; min-height: 900px; padding: 20px 0 10px 20px;}
/* 澶撮儴 */
.header{height: 59px; border-bottom: 1px solid #404553; background-color: #393D49;}
.logo{position: absolute; left: 0; top: 16px;}
.logo img{width: 82px; height: 31px;}
.header .layui-nav{position: absolute; right: 0; top: 0; padding: 0; background: none;}
.header .layui-nav .layui-nav-item{margin: 0 20px; }
.header .layui-nav .layui-nav-item[mobile]{display: none;}
.header .layui-container .logo{left: 15px;}
.header .layui-container .layui-nav{right: 15px;}
.menu{position: absolute; right: 0; top: 0; line-height: 65px;}
.menu a{display:inline-block; *display:inline; *zoom:1; vertical-align:top;}
.menu a{position: relative; padding: 0 20px; margin: 0 20px; color: #c2c2c2; font-size: 14px;}
.menu a:hover{color: #fff; transition: all .5s; -webkit-transition: all .5s}
.menu a.this{color: #fff}
.menu a.this::after{content: ''; position: absolute; left: 0; bottom: -1px; width: 100%; height: 5px; background-color: #5FB878;}
.header-index{background-color: #05031A; border: none;}
.header-index .site-banner-bg{}
.header-index[spring]{background-color: #0D1206}
.header-index[summer]{background-color: #0A0E11}
.header-index[autumn]{background-color: #100903}
.header-index[winter]{background-color: #110F25/*#06041C*/}
.header-demo{height: 60px; border-bottom: none;}
.header-demo .logo{left: 40px;}
.header-demo .layui-nav{top: 0;}
.header-demo .layui-nav .layui-nav-item{margin: 0 10px;}
.header-demo .layui-nav .layui-this a{padding: 0 30px;}
.component{position: absolute; width: 160px; left: 120px; top: 16px; }
.component .layui-input{height: 30px; padding-left: 12px; background-color: #424652; background-color: rgba(255,255,255,.05); border: none 0; color: #fff; color: rgba(255,255,255,.5); font-size: 12px;}
.component .layui-form-select .layui-edge{display: none; border-top-color: #999;}
.component .layui-form-select dl{top: 36px; background-color: rgba(255,255,255,.9)}
.header-demo .component{left: 185px;}
/* 瀛愪晶杈<E699B6> */
.layui-side-child{width: 160px!important; left: 200px; bottom: 60px!important; border-right: 1px solid #eee; background-color: #fff;}
.layui-side-child .layui-side-scroll{width: 170px;}
.layui-side-child .layui-nav{padding: 10px 0; width: 160px; border-radius: 0; background: none}
.layui-side-child .layui-nav-child{border-radius: 0;}
.layui-side-child .layui-nav .layui-nav-title a,
.layui-side-child .layui-nav .layui-nav-title a:hover,
.layui-side-child .layui-nav-itemed>a{color: #666 !important;}
.layui-side-child .layui-nav-itemed .layui-nav-child{margin-bottom: 10px; background: none !important;}
.layui-side-child .layui-nav .layui-nav-item a{height: 30px; line-height: 30px; color: #666;}
.layui-side-child .layui-nav .layui-nav-item a:hover{background: none !important;}
.layui-side-child .layui-nav .layui-nav-child a{color: #999 !important;}
.layui-side-child .layui-nav .layui-nav-more{display: none;}
.layui-side-child .layui-nav-tree .layui-this,
.layui-side-child .layui-nav-tree .layui-this>a,
.layui-side-child .layui-nav-tree .layui-nav-child dd.layui-this,
.layui-side-child .layui-nav-tree .layui-nav-child dd.layui-this a{background: none; color: #5FB878 !important;}
.layui-side-child .layui-nav .layui-nav-child a:hover{color: #009688 !important}
.layui-side-child .layui-nav-bar{background-color: #5FB878;}
/* 搴曢儴 */
.footer{padding: 30px 0; line-height: 30px; text-align: center; color: #666; font-weight: 300;}
body .layui-layout-admin .footer-demo{height: 50px; padding: 5px 0;}
.footer a{padding: 0 5px;}
.site-union{margin-top: 10px; color: #999;}
.site-union>*{display: inline-block; vertical-align: middle;}
.site-union a[upyun] img{width: 80px;}
.site-union span{position: relative; top: 3px;}
.site-union span a{padding: 0; display: inline; color: #999;}
.site-union span a:hover{text-decoration: underline;}
.footer-demo p{display: inline-block; vertical-align: middle; height: 50px; padding-right: 10px;}
.footer-demo .site-union{position: relative; top: -9px;}
/* 棣栭〉banner閮ㄥ垎 */
.site-banner{position: relative; height: 600px; text-align: center; overflow: hidden; background-color: #393D49;}
.site-banner-bg
,.site-banner-main{position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.site-banner-bg{background-position: center 0;}
.site-zfj{padding-top: 25px; height: 220px;}
.site-zfj i{position: absolute; left: 50%; top: 50px; width: 200px; height: 200px; margin-left: -100px; font-size: 180px; color: #c2c2c2;}
@-webkit-keyframes site-zfj {
0% {opacity: 1; -webkit-transform: translate3d(0, 0, 0) rotate(0deg) scale(1);}
10% {opacity: 0.8; -webkit-transform: translate3d(-100px, 0px, 0) rotate(10deg) scale(0.7);}
35% {opacity: 0.6; -webkit-transform: translate3d(100px, 0px, 0) rotate(30deg) scale(0.4);}
50% {opacity: 0.4; -webkit-transform: translate3d(0, 0, 0) rotate(360deg) scale(0);}
80% {opacity: 0.2; -webkit-transform: translate3d(0, 0, 0) rotate(720deg) scale(1);}
90% {opacity: 0.1; -webkit-transform: translate3d(0, 0, 0) rotate(3600deg) scale(6);}
100% {opacity: 1; -webkit-transform: translate3d(0, 0, 0) rotate(3600deg) scale(1);}
}
@keyframes site-zfj {
0% {opacity: 1; transform: translate3d(0, 0, 0) rotate(0deg) scale(1);}
10% {opacity: 0.8; transform: translate3d(-100px, 0px, 0) rotate(10deg) scale(0.7);}
35% {opacity: 0.6; transform: translate3d(100px, 0px, 0) rotate(30deg) scale(0.4);}
50% {opacity: 0.4; transform: translate3d(0, 0, 0) rotate(360deg) scale(0);}
80% {opacity: 0.2; transform: translate3d(0, 0, 0) rotate(720deg) scale(1);}
90% {opacity: 0.1; transform: translate3d(0, 0, 0) rotate(3600deg) scale(6);}
100% {opacity: 1; transform: translate3d(0, 0, 0) rotate(3600deg) scale(1);}
}
@-webkit-keyframes site-desc {
0% { -webkit-transform: scale(1.1);}
100% {opacity: 1; -webkit-transform: scale(1);}
}
@keyframes site-desc {
0% { transform: scale(1.1);}
100% {transform: scale(1);}
}
.site-zfj-anim i{-webkit-animation-name: site-zfj; animation-name: site-zfj; -webkit-animation-duration: 5s; animation-duration: 5s; -webkit-animation-timing-function: linear; animation-timing-function: linear;}
/* 鎻忚堪瀛椾綋 */
@font-face {font-family: 'webfont-desc';
src: url('//at.alicdn.com/t/webfont_eovt4pxxy5.eot'); /* IE9*/
src: url('//at.alicdn.com/t/webfont_eovt4pxxy5.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('//at.alicdn.com/t/webfont_eovt4pxxy5.woff') format('woff'), /* chrome銆乫irefox */
url('//at.alicdn.com/t/webfont_eovt4pxxy5.ttf') format('truetype'), /* chrome銆乫irefox銆乷pera銆丼afari, Android, iOS 4.2+*/
url('//at.alicdn.com/t/webfont_eovt4pxxy5.svg#鎬濇簮榛戜綋-鏋佺粏') format('svg'); /* iOS 4.1- */
}
.web-font-desc{
font-family:"webfont-desc" !important;
font-size:16px;font-style:normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.site-desc{position: relative; height: 70px; margin-top: 20px;}
.site-desc .web-font-desc{color: #fff; color: rgba(255,255,255,.8); font-size: 61px;}
.site-desc-anim{-webkit-animation-name: site-desc; animation-name: site-desc;}
.site-desc cite{position: absolute; bottom: -40px; left: 0; width: 100%; color: #c2c2c2; font-style: normal;}
.site-download{margin-top: 80px; font-size: 0;}
.site-download a{position: relative; padding: 0 45px 0 90px; height: 60px; line-height: 60px; border: 1px solid #c2c2c2; border-color: rgba(255,255,255,.2); font-size: 24px; color: #ccc; transition: all .5s; -webkit-transition: all .5s;}
.site-download a:hover{border-color: rgba(255,255,255,.3); color: #fff; background-color: rgba(255,255,255,.05); border-radius: 30px;}
.site-download a cite{position: absolute; left: 45px; font-size: 30px;}
.site-version{position: relative; margin-top: 15px; color: #ccc; font-size: 12px;}
.site-version span{padding: 0 3px;}
.site-version *{font-style: normal;}
.site-version a{color: #e2e2e2; text-decoration: underline;}
.site-banner-other{position: absolute; left: 0; bottom: 35px; width: 100%; text-align: center; font-size: 0;}
.site-banner-other iframe{border: none;}
.site-banner-other a{display: inline-block; vertical-align: middle; height: 28px; line-height: 28px; margin: 0 5px; padding: 0 8px; border-radius: 2px; color: #c2c2c2; color: rgba(255,255,255,.8); border: 1px solid #c2c2c2; border-color: rgba(255,255,255,.2); font-size: 14px; transition: all .5s; -webkit-transition: all .5s;}
.site-banner-other a:hover{color: #fff; background-color: rgba(255,255,255,.1);}
.site-idea{margin: 50px 0; font-size: 0; text-align: center; font-weight: 300;}
.site-idea li{display: inline-block; vertical-align: top; *display: inline; *zoom:1; font-size: 14px; }
.site-idea li{width: 298px; height: 150px; padding: 30px; line-height: 24px; margin-left: 30px; border: 1px solid #d2d2d2; text-align: left;}
.site-idea li:first-child{margin-left: 0}
.site-idea .layui-field-title{border-color: #d2d2d2}
.site-idea .layui-field-title legend{margin: 0 20px 20px 0; padding: 0 20px; text-align: center;}
/* 璧炲姪鍟<E5A7AA> */
.site-sponsor-home{margin-top: 40px; text-align: center;}
.site-sponsor-home .layui-btn{position: relative; width: 233px; height: 65px; line-height: 65px; background: none; border-color: #212121; font-size: 26px; border-radius: 6px; /*padding-left: 55px;*/}
.site-sponsor-home .layui-btn:hover{background: #4A4855; color: #BAB8C3;}
.site-sponsor-home .layui-btn:before{/*position: absolute; left: 15px; top: 15px; content: ''; width: 30px; height: 30px; background: url(http://cdn.layui.com/upload/2018_1/168_1514869467160_26113.png) center; background-repeat: no-repeat; background-size: contain;*/}
.site-sponsor-home p{position: relative; padding-top: 15px; font-size: 22px; color: #212121;}
.site-sponsor-home p:before{content: ''; position: relative; top: -2px; display: inline-block; vertical-align: middle; width: 30px; height: 30px; margin-right: 10px; background: url(http://cdn.layui.com/upload/2018_1/168_1514869467160_26113.png) center; background-repeat: no-repeat; background-size: contain;}
@media screen and (max-width: 750px) {
.site-sponsor-home .layui-btn{width: 180px; height: 45px; line-height: 45px; font-size: 20px;}
.site-sponsor-home p{font-size: 16px;}
.site-sponsor-home p:before{width: 20px; height: 20px;}
}
/* 杈呭姪 */
.site-tips{margin-bottom: 10px; padding: 15px; line-height: 22px; border-left: 5px solid #0078AD; background-color: #f2f2f2;}
body .site-tips p{margin: 0;}
body .layui-layer-notice .layui-layer-content{padding: 20px; line-height: 26px; background-color: #393D49; color: #fff; font-weight: 300;}
.layui-layer-notice .layui-text{color: #f8f8f8;}
.layui-layer-notice .layui-text a{color: #009688;}
/* 鐩綍 */
.site-dir{display: none;}
.site-dir li{line-height: 26px; margin-left: 20px; overflow: visible; list-style-type: disc;}
.site-dir li a{display: block;}
.site-dir li a:active{color: #01AAED;}
.site-dir li a.layui-this{color: #01AAED;}
body .layui-layer-dir{box-shadow: none; border: 1px solid #d2d2d2;}
body .layui-layer-dir .layui-layer-content{padding: 10px;}
.site-dir a em{padding-left: 5px; font-size: 12px; color: #c2c2c2; font-style: normal;}
/* 鏂囨。 */
.site-tree{border-right: 1px solid #eee; }
.site-tree .layui-tree{line-height: 32px;}
.site-tree .layui-tree li i{position: relative; font-size: 22px; color: #000}
.site-tree .layui-tree li a cite{padding: 0 8px;}
.site-tree .layui-tree .site-tree-noicon a cite{padding-left: 15px;}
.site-tree .layui-tree li a em{font-size: 12px; color: #bbb; padding-right: 5px; font-style: normal;}
.site-tree .layui-tree li h2{line-height: 36px; border-left: 5px solid #009E94; margin: 15px 0 5px; padding: 0 10px; background-color: #f2f2f2;}
.site-tree .layui-tree li ul{margin-left: 27px; line-height: 28px;}
.site-tree .layui-tree li ul a,
.site-tree .layui-tree li ul a i{color: #777;}
.site-tree .layui-tree li ul a:hover{color: #333;}
.site-tree .layui-tree li ul li{margin-left: 25px; overflow: visible; list-style-type: disc; /*list-style-position: inside;*/}
.site-tree .layui-tree li ul li cite,
.site-tree .layui-tree .site-tree-noicon ul li cite{padding-left: 0;}
.site-tree .layui-tree .layui-this a{color: #01AAED;}
.site-tree .layui-tree .layui-this .layui-icon{color: #01AAED;}
.site-fix .site-tree{position: fixed; top: 0; bottom: 0; z-index: 666; min-height: 0; overflow: auto; background-color: #fff;}
.site-fix .site-content{margin-left: 220px;}
.site-fix-footer .site-tree{/*margin-bottom: 120px;*/}
.site-title{ margin: 30px 0 20px;}
.site-title fieldset{border: none; padding: 0; border-top: 1px solid #eee;}
.site-title fieldset legend{margin-left: 20px; padding: 0 10px; font-size: 22px; font-weight: 300;}
.site-text a{color: #01AAED;}
.site-h1{margin-bottom: 20px; line-height: 60px; padding-bottom: 10px; color: #393D49; border-bottom: 1px solid #eee; font-size: 28px; font-weight: 300;}
.site-h1 .layui-icon{position: relative; top: 5px; font-size: 35px; margin-right: 10px;}
.site-text{position:relative;}
.site-text p{margin-bottom: 10px; line-height:22px;}
.site-text em{padding: 0 3px; font-weight: 500; font-style: italic; color: #666;}
.site-text code{margin:0 5px; padding: 3px 10px; border: 1px solid #e2e2e2; background-color: #fbfbfb; color: #666; border-radius: 2px;}
.site-table{width: 100%; margin: 10px 0;}
.site-table thead{background-color:#f2f2f2; }
.site-table th,
.site-table td{padding: 6px 15px; min-height: 20px; line-height: 20px; border:1px solid #ddd; font-size: 14px; font-weight: 400;}
.site-table tr:nth-child(even){background: #fbfbfb;}
.site-block{padding: 20px; border: 1px solid #eee;}
.site-block .layui-form{margin-right: 200px;}
/* 鏇存柊鏃ュ織 */
.site-changelog .layui-timeline-title h2{display: inline-block;}
.site-changelog .layui-timeline-title .layui-badge-rim{top: -2px; left: 10px;}
/* 棰滆壊 */
.site-doc-color{font-size: 0;}
.site-doc-color li{display: inline-block; vertical-align: middle; width: 180px; margin-left: 20px; margin-bottom: 20px; padding: 20px 10px; color: #fff; text-align: center; border-radius: 2px; line-height: 22px; font-size: 14px;}
.site-doc-color li p[tips]{opacity: 0.8; font-size: 12px;}
.site-doc-necolor li{width: 108px; margin-top: 15px; margin-left: 0; border-radius: 0;}
.site-doc-bgcolor li{padding: 10px;}
/* 瀹牸 */
.site-doc-icon{margin-bottom: 50px; font-size: 0;}
.site-doc-icon li{display: inline-block; vertical-align: middle; width: 127px; height: 105px; line-height: 25px; padding: 20px 0; margin-right: -1px; margin-bottom: -1px; border: 1px solid #e2e2e2; font-size: 14px; text-align: center; color: #666; transition: all .3s; -webkit-transition: all .3s;}
.site-doc-anim li{height: auto;}
.site-doc-icon li .layui-icon{display: inline-block; font-size: 36px;}
.site-doc-icon li .doc-icon-name,
.site-doc-icon li .doc-icon-code{color: #c2c2c2;}
.site-doc-icon li .doc-icon-fontclass{height: 40px; line-height: 20px; padding: 0 5px; font-size: 13px; color: #333; }
.site-doc-icon li:hover{background-color: #f2f2f2; color: #000;}
/* 鏍呮牸绀轰緥 */
.grid-demo{padding: 10px; line-height: 50px; text-align: center; background-color: #79C48C; color: #fff;}
.grid-demo-bg1{background-color: #63BA79;}
.grid-demo-bg2{background-color: #49A761;}
.grid-demo-bg3{background-color: #38814A;}
/* 婕旂ず */
body .layui-layout-admin .site-demo{bottom: 60px; padding: 0;}
body .site-demo-nav .layui-nav-item{line-height: 40px}
.layui-nav-item .layui-icon{position: relative; font-size: 20px;}
.layui-nav-item a cite{padding: 0 10px;}
.site-demo .layui-main{margin: 15px; line-height: 22px;}
.site-demo-editor{position: absolute; top: 0; bottom: 0; left: 0; width: 50%; }
.site-demo-area{position: absolute; top: 0; bottom: 0; width: 100%;}
.site-demo-editor textarea{position: absolute; width: 100%; height: 100%; padding: 10px; border: none; resize: none; background-color: #F7FBFF; background-color: #13151A; color: #999; font-family: Courier New; font-size: 12px; -webkit-box-sizing: border-box !important; -moz-box-sizing: border-box !important; box-sizing: border-box !important;}
.site-demo-btn{position: absolute; bottom: 15px; right: 20px;}
.site-demo-zanzhu{position: absolute; bottom: 0; left: 0; width: 100%; height: 90px; text-align: center; background-color: #e2e2e2; overflow: hidden;}
.site-demo-zanzhu>*{position: relative; z-index: 1;}
.site-demo-zanzhu:before{content: ""; position: absolute; z-index: 0; top: 50%; left: 50%; width: 120px; margin: -10px 0px 0px -60px; text-align: center; color: rgb(170, 170, 170); font-size: 18px; font-weight: 300; }
.site-demo-result{position: absolute; right: 0; top: 0; bottom: 0; width: 50%;}
.site-demo-result iframe{position: absolute; width: 100%; height: 100%;}
.site-demo-button{margin-bottom: 30px;}
.site-demo-button div{margin: 20px 30px 10px;}
.site-demo-button .layui-btn+.layui-btn{margin-left: 0;}
.site-demo-button .layui-btn{margin: 0 7px 10px 0; }
.site-demo-text a{color: #01AAED;}
.site-demo-laytpl{text-align: center;}
.site-demo-laytpl textarea,
.site-demo-laytpl div span{width: 40%; padding: 15px; margin: 0 15px;}
.site-demo-laytpl textarea{height: 300px; border: none; background-color: #3F3F3F; color: #E3CEAB; font-family: Courier New; resize: none;}
.site-demo-laytpl div span{display: inline-block; text-align: center; background: #101010; color: #fff;}
.site-demo-tplres{margin: 10px 0; text-align: center}
.site-demo-tplres .site-demo-tplh2,
.site-demo-tplres .site-demo-tplview{display: inline-block; width: 50%;}
.site-demo-tplres h2{padding: 15px; background: #e2e2e2;}
.site-demo-tplres h3{font-weight: 700;}
.site-demo-tplres div{padding: 14px; border: 1px solid #e2e2e2; text-align: left;}
.site-demo-upload,
.site-demo-upload img{width: 200px; height: 200px; border-radius: 100%;}
.site-demo-upload{position: relative; background: #e2e2e2;}
.site-demo-upload .site-demo-upbar{position: absolute; top: 50%; left: 50%; margin: -18px 0 0 -56px;}
.site-demo-upload .layui-upload-button{background-color: rgba(0,0,0,.2); color: rgba(255,255,255,1);}
.site-demo-util{position: relative; width: 300px;}
.site-demo-util img{width: 300px; border-radius: 100%;}
.site-demo-util span{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #333; cursor: pointer;}
@-webkit-keyframes demo-fengjie {
0% {-webkit-filter: blur(0); opacity: 1; background: #fff; height: 300px; border-radius: 100%;}
80% {-webkit-filter: blur(50px); opacity: 0.95;}
100% {-webkit-filter: blur(20px); opacity: 0; background: #fff;}
}
@keyframes demo-fengjie {
0% {filter: blur(0); opacity: 1; background: #fff; height: 300px; border-radius: 100%;}
80% {filter: blur(50px); opacity: 0.95;}
100% {filter: blur(20px); opacity: 0; background: #fff;}
}
.site-demo-fengjie{-webkit-animation-name: demo-fengjie; animation-name: demo-fengjie; -webkit-animation-duration: 5s; animation-duration: 5s;}
.layui-layout-admin .site-demo-body{top: 106px;}
.site-demo-title{position: fixed; left: 200px; right: 0; top: 65px;}
.site-demo-code{position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: none; padding: 10px; resize: none; font-size: 12px; background-color: #F7FBFF; color: #881280; font-family: Courier New;}
.site-demo-overflow{overflow: hidden;}
/* 鍏跺畠 */
#trans-tooltip,
#tip-arrow-bottom,
#tip-arrow-top{display: none !important;}
/* 鐙珛缁勪欢 涓<> 涓婚〉 */
.alone{text-align: center; background-color: #009688; color: #fff; font-weight: 300; transition: all .3s; -webkit-transition: all .3s;}
.alone:hover{background-color: #5FB878;}
.alone a{display: block; padding: 50px 20px; color: #fff; font-size: 30px;}
.alone a cite{display: block; padding-top: 10px; font-size: 14px;}
.alone-banner{height: 190px; text-align: center; font-weight: 300; background-color: #009688; color:#fff;}
.alone-banner h1{padding-top: 60px; line-height: 32px; font-size: 30px; font-weight: 300;}
.alone-banner p{padding-top: 20px; color: #e2e2e2; color: rgba(255,255,255,.8);}
.alone-nav .layui-tab-title li{margin-right: 30px; padding: 0; color: #666;}
.alone-nav .layui-tab-title li a{ padding: 0 20px;}
.alone-download{margin: 30px 0;}
.alone-download .layui-btn{margin-right: 10px;}
.alone-download span{display: inline-block; line-height: 44px; padding-right: 20px;}
.alone-download span em{color: #999;}
.alone-title{margin-top: 20px;}
.alone-download-btn{text-align: center; margin-top: 50px; font-size: 0;}
.alone-download-btn .layui-btn{position: relative; width: 206px; height: 60px; line-height: 60px; font-size: 26px; font-weight: 300;}
.alone-download-btn .layui-btn+.layui-btn{margin: 0;}
.alone-download-btn .alone-download-right{margin-left: 20px !important; border-color: #009688; background: none; color: #009688;}
.alone-download-btn .layui-btn img{position: relative; top: -3px; width: 118px;}
/* 閫傞厤澶氳澶<EE8695> */
@media screen and (max-width: 750px) {
.layui-main{width: auto; margin: 0 10px;}
.logo,
.header-demo .logo{left: 10px;}
.component{display: none}
.header .layui-nav-child{left: auto; right: 0;}
.site-demo-overflow{overflow: auto;}
.site-nav-layim{display: none !important;}
.header .layui-nav .layui-nav-item{margin: 0;}
.header .layui-nav .layui-nav-item a{padding: 0 20px;}
.header .layui-nav .layui-nav-item[pc]{display: none;}
.header .layui-nav .layui-nav-item[mobile]{display: inline-block;}
.site-banner{height: 300px;}
.site-banner-bg{background-size: cover;}
.site-zfj{height: 100px; padding-top: 5px;}
.site-zfj i{top: 10px; width: 100px; height: 100px; margin-left: -50px; font-size: 100px;}
.site-desc{background-size: 70%; margin: 0;}
.site-desc .web-font-desc{padding-top: 20px; font-size: 30px;}
.site-desc cite{display: none;}
.site-download{margin-top: 0; }
.site-download a{height: 40px; line-height: 40px; padding: 0 25px 0 60px; border-radius: 30px; color: #fff; font-size: 16px;}
.site-download a cite{left: 20px;}
.site-banner-other{bottom: 10px;}
.site-idea{margin: 20px 0;}
.site-idea li{margin: 0 0 20px 0; width: 100%; height: auto; -webkit-box-sizing: border-box !important; -moz-box-sizing: border-box !important; box-sizing: border-box !important;}
.site-hengfu img{max-width: 100%}
.site-block .layui-form{margin-right: 0;}
.layui-layer-dir{display: none;}
.site-tree{position: fixed; top: 0; bottom: 0; min-height: 0; overflow: auto; z-index: 1000; left: -260px; background-color: #fff; transition: all .3s; -webkit-transition: all .3s;}
.site-content{width: 100%; padding: 0; overflow: auto;}
.site-content img{max-width: 100%;}
.site-tree-mobile{display: block!important; position: fixed; z-index: 100000; bottom: 15px; left: 15px; width: 50px; height: 50px; line-height: 50px; border-radius: 2px; text-align: center; background-color: rgba(0,0,0,.7); color: #fff;}
.site-home .site-tree-mobile{display: none!important;}
.site-mobile .site-tree-mobile{display: none !important;}
.site-mobile .site-tree{left: 0;}
.site-mobile .site-mobile-shade{content: ''; position: fixed; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0,0,0,.8); z-index: 999;}
.site-tree-mobile i{font-size: 20px;}
.layui-code-view{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.layui-layout-admin .layui-side{position: fixed; top: 0; left: -260px; transition: all .3s; -webkit-transition: all .3s; z-index: 10000;}
.layui-body{position: static; bottom: 0; left: 0;}
.site-mobile .layui-side{left: 0;}
.site-mobile .layui-side-child{top: 50%; left: 200px; height: 300px; margin-top: -100px;}
body .layui-layout-admin .footer-demo{position: static; height: auto; line-height: 30px;}
.footer-demo p{height: auto;}
.site-demo-area,
.site-demo-editor,
.site-demo-result,
.site-demo-editor textarea,
.site-demo-result iframe{position: static; width: 100%;}
.site-demo-editor textarea{height: 350px;}
.site-demo-zanzhu{display: none;}
.site-demo-btn{bottom: auto; top: 370px;}
.site-demo-result iframe{height: 500px;}
.site-demo-laytpl textarea, .site-demo-laytpl div span{margin: 0;}
.site-demo-tplres .site-demo-tplh2, .site-demo-tplres .site-demo-tplview{width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.site-demo-title{position: static; left: 0;}
body .layui-layout-admin .site-demo{}
.site-demo-code{position: static; height: 350px;}
}
@-webkit-keyframes site-anim-closeup{ /* 鐗瑰啓 */
from {-webkit-transform: translate3d(0, 0, 0) scale(1); opacity: 1;}
to { -webkit-transform: translate3d(0, 400px, 0) scale(2); opacity: 0.5;}
}
@keyframes site-anim-closeup{
from {transform: translate3d(0, 0, 0) scale(1); opacity: 1;}
to {transform: translate3d(0, 400px, 0) scale(2); opacity: 0.5;}
}
.site-out-up{-webkit-animation-duration: 3s; animation-duration: 3s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: site-anim-closeup; animation-name: site-anim-closeup; overflow: hidden;}

File diff suppressed because one or more lines are too long

Some files were not shown because too many files have changed in this diff Show More

Loading…
Cancel
Save