fixed: 优化
parent
0e63b711fd
commit
d7738fdba7
|
|
@ -2,6 +2,14 @@
|
|||
display: none!important;
|
||||
}
|
||||
|
||||
/**占满屏幕**/
|
||||
.page-fill{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/**card**/
|
||||
.ok-card-body{
|
||||
padding: 20px;
|
||||
|
|
@ -96,48 +104,54 @@
|
|||
}
|
||||
|
||||
|
||||
/**滚动条样式**/
|
||||
.not-scroll::-webkit-scrollbar{
|
||||
/*********************美化滚动条样式*********************/
|
||||
|
||||
.not-scroll::-webkit-scrollbar{ /*不显示滚动条*/
|
||||
height: 0;
|
||||
width: 0;
|
||||
background: transparent;
|
||||
display: none;
|
||||
}
|
||||
.scrollBody::-webkit-scrollbar{
|
||||
.scrollBody::-webkit-scrollbar{/*不显示滚动条*/
|
||||
display: none;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar,
|
||||
.scrollBody::-webkit-scrollbar{
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
background-color: #F5F5F5;
|
||||
}
|
||||
/*定义滚动条轨道 内阴影+圆角*/
|
||||
::-webkit-scrollbar-track,
|
||||
.scrollBody::-webkit-scrollbar-track {
|
||||
border-radius: 10px;
|
||||
/*border-radius: 10px;*/
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.1);
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
|
||||
/*定义滑块 内阴影+圆角*/
|
||||
::-webkit-scrollbar-thumb,
|
||||
.scrollBody::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
/*border-radius: 10px;*/
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
|
||||
background-color: #A8A8A8;
|
||||
}
|
||||
|
||||
|
||||
/**内页body滚动条样式**/
|
||||
::-webkit-scrollbar,
|
||||
.ok-body-scroll::-webkit-scrollbar{
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
::-webkit-scrollbar-track,
|
||||
.ok-body-scroll::-webkit-scrollbar-track{/*定义滚动条轨道 内阴影+圆角*/
|
||||
border-radius: 10px;
|
||||
/*border-radius: 10px;*/
|
||||
background-color: #FFFFFF;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.2);
|
||||
}
|
||||
::-webkit-scrollbar-thumb,
|
||||
.ok-body-scroll::-webkit-scrollbar-thumb{/*定义滑块 内阴影+圆角*/
|
||||
border-radius: 10px;
|
||||
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.1);
|
||||
|
|
|
|||
68
css/home.css
68
css/home.css
|
|
@ -98,3 +98,71 @@
|
|||
-webkit-box-shadow: 0 0 20px rgba(0,0,0,.08);
|
||||
box-shadow: 0 0 20px rgba(0,0,0,.08);
|
||||
}
|
||||
|
||||
/************home2样式************/
|
||||
.data-body {
|
||||
display: flex;
|
||||
padding:20px;
|
||||
padding-bottom: 0;
|
||||
color:#333333;
|
||||
}
|
||||
.data-body .media-cont {
|
||||
-ms-flex-align: center !important;
|
||||
align-items: center !important;
|
||||
-ms-flex: 1 1 auto;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
.data-body .media-cont .tit{
|
||||
font-size: 16px;
|
||||
padding-bottom:5px;
|
||||
}
|
||||
.data-body .media-cont .num{
|
||||
font-size: 24px;
|
||||
line-height: 22px;
|
||||
}
|
||||
.data-body .w-img{
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
}
|
||||
.data-body .w-img img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.line-home-a{
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
.cart-data .stat-text {
|
||||
color: #455a64;
|
||||
font-size: 24px;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
.extra-small-font {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.cart-data .stat-heading {
|
||||
color: #99abb4;
|
||||
}
|
||||
|
||||
.cart-data .img-box {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.cart-data .img-box img {
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.cart-data .cart-r {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.my-card-title {
|
||||
color: #212529;
|
||||
font-size: 16px;
|
||||
padding-bottom: 20px;
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
|
|
|||
143
css/home2.css
143
css/home2.css
|
|
@ -1,143 +0,0 @@
|
|||
@import "./common.css";
|
||||
@import "../lib/layui/css/layui.css";
|
||||
|
||||
.data-body {
|
||||
display: flex;
|
||||
padding:20px;
|
||||
padding-bottom: 0;
|
||||
color:#333333;
|
||||
}
|
||||
.data-body .media-cont {
|
||||
-ms-flex-align: center !important;
|
||||
align-items: center !important;
|
||||
-ms-flex: 1 1 auto;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
.data-body .media-cont .tit{
|
||||
font-size: 16px;
|
||||
padding-bottom:5px;
|
||||
}
|
||||
.data-body .media-cont .num{
|
||||
font-size: 24px;
|
||||
line-height: 22px;
|
||||
}
|
||||
.data-body .w-img{
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
}
|
||||
.data-body .w-img img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.line-home-a{
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.cart-data .stat-text {
|
||||
color: #455a64;
|
||||
font-size: 24px;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
.extra-small-font {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.cart-data .stat-heading {
|
||||
color: #99abb4;
|
||||
}
|
||||
|
||||
.cart-data .img-box {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.cart-data .img-box img {
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.cart-data .cart-r {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.my-card-title {
|
||||
color: #212529;
|
||||
font-size: 16px;
|
||||
padding-bottom: 20px;
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
/**图表样式**/
|
||||
.map-body {
|
||||
height: 360px;
|
||||
}
|
||||
|
||||
.map-china {
|
||||
height: 360px;
|
||||
}
|
||||
|
||||
/***进度条***/
|
||||
.progress-box {
|
||||
margin-bottom: 20px;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.progress-box .por-title {
|
||||
font-weight: 600;
|
||||
color: #868e96;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
.progress-box .por-txt {
|
||||
font-size: 13px;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
.progress-box .pro-head {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
float: left;
|
||||
overflow: hidden;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.progress-box .pro-head img {
|
||||
background: #BEA8AB;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
.progress-box .pro-data {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
flex: 1;
|
||||
/*float: left;*/
|
||||
/*width: 70%;*/
|
||||
}
|
||||
|
||||
/**日历**/
|
||||
#calendar .layui-laydate {
|
||||
border-radius: 5px;
|
||||
border: 0;
|
||||
-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .08);
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, .08);
|
||||
}
|
||||
116
css/login.css
116
css/login.css
|
|
@ -1,116 +0,0 @@
|
|||
#app,
|
||||
body,
|
||||
html {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.layui-icon{ font-size:16px !important;}
|
||||
.mag0{ margin:0 !important; }
|
||||
::selection { background: #ff5722; color: #fff; }
|
||||
.layui-red{ color:#f00 !important; font-weight:bold;}
|
||||
.layui-blue{ color:#01AAED !important;}
|
||||
#app .layui-form-item.layui-input-focus input{ border-color:#ff6700 !important;}
|
||||
.layui-block {
|
||||
width: 100% !important;
|
||||
}
|
||||
#app {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image: url('../images/login-bg.jpg');
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#app form.layui-form {
|
||||
padding: 0 20px 20px 20px;
|
||||
width: 300px;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
margin: -150px 0 0 -150px;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
-o-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
-webkit-border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 0 50px #009688;
|
||||
}
|
||||
|
||||
#app .login_face {
|
||||
margin: -55px auto 20px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
-webkit-border-radius: 50%;
|
||||
-moz-border-radius: 50%;
|
||||
border-radius: 50%;
|
||||
border: 5px solid #fff;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 0 30px #009688;
|
||||
background: #FFF;
|
||||
}
|
||||
|
||||
#app .login_face img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#app .layui-form-item {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#app .layui-form-item label {
|
||||
position: absolute;
|
||||
color: #757575;
|
||||
left: 10px;
|
||||
top: 9px;
|
||||
line-height: 20px;
|
||||
background: transparent;
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
cursor: text;
|
||||
}
|
||||
#code{
|
||||
padding-right: 110px;
|
||||
}
|
||||
#imgCode .img {
|
||||
position: absolute;
|
||||
top: 1px;
|
||||
bottom: 1px;
|
||||
right: 1px;
|
||||
cursor: pointer;
|
||||
width: 100px;
|
||||
background: #C4E1CE;
|
||||
}
|
||||
#app .layui-form-item input{
|
||||
background: #FFF!important;
|
||||
}
|
||||
#app .layui-form-item input,
|
||||
#app .layui-form-item label{
|
||||
transition: all 0.3s ease-in-out;
|
||||
-webkit-transition: all 0.3s ease-in-out;
|
||||
}
|
||||
#app .layui-form-item input::placeholder{
|
||||
color: transparent!important;
|
||||
}
|
||||
#app .layui-form-item.layui-input-focus input::placeholder{
|
||||
color: #757575!important;
|
||||
}
|
||||
#app .layui-form-item.layui-input-focus label,
|
||||
#app .layui-form-item.layui-input-active label{
|
||||
top: -10px;
|
||||
font-size: 12px;
|
||||
color: #ff6700;
|
||||
background: #fff!important;
|
||||
}
|
||||
|
||||
#codeImg canvas{
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -611,6 +611,115 @@
|
|||
left: 0;
|
||||
}
|
||||
|
||||
/**********登录页的样式**********/
|
||||
.page-fill{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
#login .layui-icon{ font-size:16px !important;}
|
||||
#login .mag0{ margin:0 !important; }
|
||||
#login ::selection { background: #ff5722; color: #fff; }
|
||||
#login .layui-red{ color:#f00 !important; font-weight:bold;}
|
||||
#login .layui-blue{ color:#01AAED !important;}
|
||||
#login .layui-form-item.layui-input-focus input{ border-color:#ff6700 !important;}
|
||||
#login .layui-block {
|
||||
width: 100% !important;
|
||||
}
|
||||
#login {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image: url('../images/login-bg.jpg');
|
||||
position: relative;
|
||||
}
|
||||
#login form.layui-form {
|
||||
padding: 0 20px 20px 20px;
|
||||
width: 300px;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
margin: -150px 0 0 -150px;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
-o-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
background: #fff;
|
||||
-webkit-border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
box-shadow: 0 0 50px #009688;
|
||||
}
|
||||
|
||||
#login .login_face {
|
||||
margin: -55px auto 20px;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
-webkit-border-radius: 50%;
|
||||
-moz-border-radius: 50%;
|
||||
border-radius: 50%;
|
||||
border: 5px solid #fff;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 0 30px #009688;
|
||||
background: #FFF;
|
||||
}
|
||||
|
||||
#login .login_face img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#login .layui-form-item {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#login .layui-form-item label {
|
||||
position: absolute;
|
||||
color: #757575;
|
||||
left: 10px;
|
||||
top: 9px;
|
||||
line-height: 20px;
|
||||
background: transparent;
|
||||
padding: 0 5px;
|
||||
font-size: 14px;
|
||||
cursor: text;
|
||||
}
|
||||
#login #code{
|
||||
padding-right: 110px;
|
||||
}
|
||||
#login #imgCode .img {
|
||||
position: absolute;
|
||||
top: 1px;
|
||||
bottom: 1px;
|
||||
right: 1px;
|
||||
cursor: pointer;
|
||||
width: 100px;
|
||||
background: #C4E1CE;
|
||||
}
|
||||
#login .layui-form-item input{
|
||||
background: #FFF!important;
|
||||
}
|
||||
#login .layui-form-item input,
|
||||
#login .layui-form-item label{
|
||||
transition: all 0.3s ease-in-out;
|
||||
-webkit-transition: all 0.3s ease-in-out;
|
||||
}
|
||||
#login .layui-form-item input::placeholder{
|
||||
color: transparent!important;
|
||||
}
|
||||
#login .layui-form-item.layui-input-focus input::placeholder{
|
||||
color: #757575!important;
|
||||
}
|
||||
#login .layui-form-item.layui-input-focus label,
|
||||
#login .layui-form-item.layui-input-active label{
|
||||
top: -10px;
|
||||
font-size: 12px;
|
||||
color: #ff6700;
|
||||
background: #fff!important;
|
||||
}
|
||||
#login #codeImg canvas{
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
/*
|
||||
* 以下都是移动端的处理响应
|
||||
*/
|
||||
|
|
@ -1,42 +0,0 @@
|
|||
/*==============================================美化滚动条代码==============================================*/
|
||||
/*滚动条整体部分*/
|
||||
::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
/*滚动条的轨道的两端按钮,允许通过点击微调小方块的位置。*/
|
||||
::-webkit-scrollbar-button:vertical {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/*滚动条的轨道(里面装有Thumb)*/
|
||||
::-webkit-scrollbar-track:vertical {
|
||||
background-color: black;
|
||||
}
|
||||
|
||||
/*内层轨道,滚动条中间部分(除去)*/
|
||||
::-webkit-scrollbar-track-piece {
|
||||
background-color: #F5F5F5;
|
||||
}
|
||||
|
||||
/*滚动条里面的小方块,能向上向下移动(或往左往右移动,取决于是垂直滚动条还是水平滚动条)*/
|
||||
/*如何只控制横向滚动条样式则应该写成: ::-webkit-scrollbar-thumb:vertical */
|
||||
::-webkit-scrollbar-thumb {
|
||||
margin-right: 10px;
|
||||
background-color: #A6A6A6;
|
||||
}
|
||||
|
||||
/*如何只控制横向滚动条样式则应该写成: ::-webkit-scrollbar-thumb:vertical:hover */
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background-color: #aaa;
|
||||
}
|
||||
|
||||
/*边角,即两个滚动条的交汇处*/
|
||||
::-webkit-scrollbar-corner:vertical {
|
||||
background-color: #535353;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-resizer:vertical {
|
||||
background-color: #FF6E00;
|
||||
}
|
||||
28
index.html
28
index.html
|
|
@ -7,7 +7,7 @@
|
|||
<meta name="keywords" content="ok-admin v2.0,ok-admin网站后台模版,后台模版下载,后台管理系统模版,HTML后台模版下载">
|
||||
<meta name="description" content="ok-admin v2.0,顾名思义,很赞的后台模版,它是一款基于Layui框架的轻量级扁平化且完全免费开源的网站后台管理系统模板,适合中小型CMS后台系统。">
|
||||
<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"/>
|
||||
<link rel="stylesheet" href="css/okadmin-v2.css"/>
|
||||
<link rel="stylesheet" href="css/okadmin.css"/>
|
||||
</head>
|
||||
<body class="layui-layout-body">
|
||||
<div class="layui-layout layui-layout-admin okadmin">
|
||||
|
|
@ -15,12 +15,12 @@
|
|||
<div class="layui-header okadmin-header">
|
||||
<ul class="layui-nav layui-layout-left">
|
||||
<li class="layui-nav-item">
|
||||
<a class="ok-menu ok-show-menu" href="javascript:;" title="菜单切换">
|
||||
<a class="ok-menu ok-show-menu" href="javascript:" title="菜单切换">
|
||||
<i class="layui-icon layui-icon-shrink-right"></i>
|
||||
</a>
|
||||
</li>
|
||||
<li class="layui-nav-item">
|
||||
<a class="ok-refresh" href="javascript:;" title="刷新">
|
||||
<a class="ok-refresh" href="javascript:" title="刷新">
|
||||
<i class="layui-icon layui-icon-refresh-3"></i>
|
||||
</a>
|
||||
</li>
|
||||
|
|
@ -37,33 +37,33 @@
|
|||
</ul>
|
||||
<ul class="layui-nav layui-layout-right">
|
||||
<li class="no-line layui-nav-item layui-hide-xs">
|
||||
<a id="notice" class="flex-vc pr10 pl10" href="javascript:;">
|
||||
<a id="notice" class="flex-vc pr10 pl10" href="javascript:">
|
||||
<i class="ok-iconbell icon-head-i"></i><cite>系统公告</cite>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="no-line layui-nav-item layui-hide-xs">
|
||||
<a id="lock" class="flex-vc pr10 pl10" href="javascript:;">
|
||||
<a id="lock" class="flex-vc pr10 pl10" href="javascript:">
|
||||
<i class="ok-iconlock_outline icon-head-i"></i><cite>锁屏</cite>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="layui-nav-item layui-hide-xs">
|
||||
<a id="fullScreen" class=" pr10 pl10" href="javascript:;">
|
||||
<a id="fullScreen" class=" pr10 pl10" href="javascript:">
|
||||
<i class="layui-icon layui-icon-screen-full"></i>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="no-line layui-nav-item">
|
||||
<a href="javascript:;">
|
||||
<a href="javascript:">
|
||||
<img src="images/head.png" class="layui-nav-img">
|
||||
bobi
|
||||
</a>
|
||||
<dl id="userInfo" class="layui-nav-child">
|
||||
<dd><a lay-id="u-1" href="javascript:;" data-url="pages/user/user.html">个人中心<span
|
||||
<dd><a lay-id="u-1" href="javascript:" data-url="pages/user/user.html">个人中心<span
|
||||
class="layui-badge-dot"></span></a></dd>
|
||||
<dd><a lay-id="u-2" href="javascript:;" data-url="pages/user/user-info.html">基本资料</a></dd>
|
||||
<dd><a lay-id="u-3" href="javascript:;" data-url="pages/user/changePwd.html">安全设置</a></dd>
|
||||
<dd><a lay-id="u-2" href="javascript:" data-url="pages/user/user-info.html">基本资料</a></dd>
|
||||
<dd><a lay-id="u-3" href="javascript:" data-url="pages/user/changePwd.html">安全设置</a></dd>
|
||||
<dd>
|
||||
<hr/>
|
||||
</dd>
|
||||
|
|
@ -87,7 +87,7 @@
|
|||
<!--左侧导航菜单-->
|
||||
<ul id="navBar" class="layui-nav okadmin-nav okadmin-bg-20222A layui-nav-tree">
|
||||
<li class="layui-nav-item layui-this">
|
||||
<a href="javascript:;" lay-id="1" data-url="pages/home.html">
|
||||
<a href="javascript:" lay-id="1" data-url="pages/home.html">
|
||||
<i is-close=false class="ok-icon ok-iconairplay"></i>
|
||||
主页一
|
||||
</a>
|
||||
|
|
@ -108,9 +108,9 @@
|
|||
<li class="no-line okadmin-nav-item">
|
||||
<div class="okadmin-link layui-icon-down" href="javascript:;"></div>
|
||||
<dl id="tabAction" class="okadmin-nav-child layui-anim-upbit layui-anim">
|
||||
<dd><a data-num="1" href="javascript:;">关闭当前标签页</a></dd>
|
||||
<dd><a data-num="2" href="javascript:;">关闭其他标签页</a></dd>
|
||||
<dd><a data-num="3" href="javascript:;">关闭所有标签页</a></dd>
|
||||
<dd><a data-num="1" href="javascript:">关闭当前标签页</a></dd>
|
||||
<dd><a data-num="2" href="javascript:">关闭其他标签页</a></dd>
|
||||
<dd><a data-num="3" href="javascript:">关闭所有标签页</a></dd>
|
||||
</dl>
|
||||
</li>
|
||||
</ul>
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@
|
|||
<meta name="apple-mobile-web-app-status-bar-style" content="black">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="format-detection" content="telephone=no">
|
||||
<link rel="stylesheet" href="../css/home2.css" media="all"/>
|
||||
<link rel="stylesheet" href="../css/home.css" media="all"/>
|
||||
<script type="text/javascript" src="../lib/echarts/echarts.min.js"></script>
|
||||
<script type="text/javascript" src="../lib/echarts/echarts.themez.js"></script>
|
||||
</head>
|
||||
|
|
|
|||
103
pages/login.html
103
pages/login.html
|
|
@ -1,5 +1,5 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html lang="en" class="page-fill">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>ok-admin v2.0 | 很赞的后台模版</title>
|
||||
|
|
@ -8,11 +8,20 @@
|
|||
<meta name="description" content="ok-admin v2.0,顾名思义,很赞的后台模版,它是一款基于Layui框架的轻量级扁平化且完全免费开源的网站后台管理系统模板,适合中小型CMS后台系统。">
|
||||
<link rel="shortcut icon" href="../images/favicon.ico" type="image/x-icon"/>
|
||||
<link rel="stylesheet" href="../lib/layui/css/layui.css">
|
||||
<link rel="stylesheet" href="../css/okadmin-v2.css"/>
|
||||
<link rel="stylesheet" href="../css/login.css"/>
|
||||
<link rel="stylesheet" href="../css/okadmin.css"/>
|
||||
<style>
|
||||
#login,
|
||||
body,
|
||||
html {
|
||||
/*width: 100%;*/
|
||||
/*height: 100%;*/
|
||||
/*display: block;*/
|
||||
/*box-sizing: border-box;*/
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app">
|
||||
<body class="page-fill">
|
||||
<div class="page-fill" id="login">
|
||||
<form class="layui-form">
|
||||
<div class="login_face"><img src="../images/a.png" class="userAvatar"></div>
|
||||
<div class="layui-form-item input-item">
|
||||
|
|
@ -40,50 +49,50 @@
|
|||
<!--js逻辑-->
|
||||
<script src="../lib/layui/layui.js"></script>
|
||||
<script>
|
||||
layui.config({
|
||||
base: "/lib/okplugins/"
|
||||
}).use(['form', 'jquery', 'okGVerify'], function () {
|
||||
var form = layui.form;
|
||||
var $ = layui.jquery;
|
||||
var okGVerify = layui.okGVerify;
|
||||
var verifyCode = new okGVerify("#codeImg");
|
||||
// var res = verifyCode.validate(document.getElementById("code").value);
|
||||
form.verify({
|
||||
pass: [
|
||||
/^[\S]{6,12}$/,
|
||||
'密码必须6到12位,且不能出现空格'
|
||||
],
|
||||
yzmCode: function (val) {
|
||||
if (verifyCode.validate(val) != "true") {
|
||||
return verifyCode.validate(val)
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
form.on('submit(login)', function (data) {
|
||||
layer.msg("登陆中...", {icon: 6, time: 1000, anim: 0}, function () {
|
||||
window.location = "../index.html";
|
||||
layui.config({
|
||||
base: "/lib/okplugins/"
|
||||
}).use(['form', 'jquery', 'okGVerify'], function () {
|
||||
var form = layui.form;
|
||||
var $ = layui.jquery;
|
||||
var okGVerify = layui.okGVerify;
|
||||
var verifyCode = new okGVerify("#codeImg");
|
||||
// var res = verifyCode.validate(document.getElementById("code").value);
|
||||
form.verify({
|
||||
pass: [
|
||||
/^[\S]{6,12}$/,
|
||||
'密码必须6到12位,且不能出现空格'
|
||||
],
|
||||
yzmCode: function (val) {
|
||||
if (verifyCode.validate(val) != "true") {
|
||||
return verifyCode.validate(val)
|
||||
}
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
|
||||
//表单输入效果
|
||||
$("#app .input-item .layui-input").click(function (e) {
|
||||
e.stopPropagation();
|
||||
$(this).addClass("layui-input-focus").find(".layui-input").focus();
|
||||
})
|
||||
$("#app .layui-form-item .layui-input").focus(function () {
|
||||
$(this).parent().addClass("layui-input-focus");
|
||||
})
|
||||
$("#app .layui-form-item .layui-input").blur(function () {
|
||||
$(this).parent().removeClass("layui-input-focus");
|
||||
if ($(this).val() != '') {
|
||||
$(this).parent().addClass("layui-input-active");
|
||||
} else {
|
||||
$(this).parent().removeClass("layui-input-active");
|
||||
}
|
||||
})
|
||||
});
|
||||
form.on('submit(login)', function (data) {
|
||||
layer.msg("登陆中...", {icon: 6, time: 1000, anim: 0}, function () {
|
||||
window.location = "../index.html";
|
||||
});
|
||||
return false;
|
||||
});
|
||||
|
||||
//表单输入效果
|
||||
$("#app .input-item .layui-input").click(function (e) {
|
||||
e.stopPropagation();
|
||||
$(this).addClass("layui-input-focus").find(".layui-input").focus();
|
||||
});
|
||||
$("#app .layui-form-item .layui-input").focus(function () {
|
||||
$(this).parent().addClass("layui-input-focus");
|
||||
});
|
||||
$("#app .layui-form-item .layui-input").blur(function () {
|
||||
$(this).parent().removeClass("layui-input-focus");
|
||||
if ($(this).val() != '') {
|
||||
$(this).parent().addClass("layui-input-active");
|
||||
} else {
|
||||
$(this).parent().removeClass("layui-input-active");
|
||||
}
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -5,9 +5,8 @@
|
|||
<title>添加用户</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
<link rel="stylesheet" href="../../lib/layui/css/layui.css">
|
||||
<link rel="stylesheet" href="../../css/scroll-bar.css">
|
||||
<link rel="stylesheet" href="../../css/sub-page.css">
|
||||
<link rel="stylesheet" href="//at.alicdn.com/t/font_693759_wytlyqhtdtj1nhfr.css">
|
||||
<!--<link rel="stylesheet" href="//at.alicdn.com/t/font_693759_wytlyqhtdtj1nhfr.css">-->
|
||||
</head>
|
||||
<body>
|
||||
<div class="ok-body">
|
||||
|
|
|
|||
|
|
@ -5,7 +5,6 @@
|
|||
<title>用户列表</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
<link rel="stylesheet" href="../../lib/layui/css/layui.css">
|
||||
<link rel="stylesheet" href="../../css/scroll-bar.css">
|
||||
<link rel="stylesheet" href="../../css/sub-page.css">
|
||||
<link rel="stylesheet" href="../../lib/nprogress/nprogress.css">
|
||||
</head>
|
||||
|
|
@ -59,7 +58,7 @@
|
|||
NProgress.start();
|
||||
window.onload = function () {
|
||||
NProgress.done();
|
||||
}
|
||||
};
|
||||
layui.use(['element', 'table', 'form', 'jquery', 'laydate'], function () {
|
||||
var element = layui.element;
|
||||
var table = layui.table;
|
||||
|
|
@ -149,7 +148,7 @@
|
|||
});
|
||||
}
|
||||
});
|
||||
})
|
||||
});
|
||||
|
||||
$("#batchDisabled").click(function () {
|
||||
layer.confirm("确定要批量停用吗?", {skin: 'layui-layer-lan', icon: 3, title: '提示', anim: 2}, function () {
|
||||
|
|
@ -171,7 +170,7 @@
|
|||
});
|
||||
}
|
||||
});
|
||||
})
|
||||
});
|
||||
|
||||
$("#batchDel").click(function () {
|
||||
layer.confirm("确定要批量删除吗?", {skin: 'layui-layer-lan', icon: 2, title: '提示', anim: 6}, function () {
|
||||
|
|
@ -193,7 +192,7 @@
|
|||
});
|
||||
}
|
||||
});
|
||||
})
|
||||
});
|
||||
|
||||
$("#addUser").click(function () {
|
||||
layer.open({
|
||||
|
|
@ -222,8 +221,8 @@
|
|||
{{ d.role == 0 ? '管理员' : '普通用户 '}}
|
||||
</script>
|
||||
<script type="text/html" id="operationTpl">
|
||||
<a href="javascript:;" title="编辑" lay-event="edit"><i class="layui-icon"></i></a>
|
||||
<a href="javascript:;" title="删除" lay-event="del"><i class="layui-icon"></i></a>
|
||||
<a href="javascript:" title="编辑" lay-event="edit"><i class="layui-icon"></i></a>
|
||||
<a href="javascript:" title="删除" lay-event="del"><i class="layui-icon"></i></a>
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Reference in New Issue