root
/
Pear-Admin-Layui
mirror of https://gitee.com/zhang_1334717033/Pear-Admin-Layui
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

构建 数据菜单 文档

develop
就眠仪式 2021-01-18 02:34:33 +08:00
parent 72120752af
commit 19ca7d82b7
13 changed files with 149 additions and 116 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
admin/css/other/result.css
View File

@ -2,33 +2,28 @@
text-align: center; text-align: center;
} }
.result .success svg { .result .success svg {
color: #32C682; color: #32C682;
text-align: center; text-align: center;
margin-top: 40px; margin-top: 40px;
} }
.result .error svg { .result .error svg {
color: #f56c6c; color: #f56c6c;
text-align: center; text-align: center;
margin-top: 40px; margin-top: 40px;
} }
.result .title { .result .title {
margin-top: 25px; margin-top: 25px;
} }
.result .desc { .result .desc {
margin-top: 25px; margin-top: 25px;
width: 60%; width: 60%;
margin-left: 20%; margin-left: 20%;
color: rgba(0, 0, 0, .45); color: rgba(0, 0, 0, .45);
} }
.result .content { .result .content {
margin-top: 20px; margin-top: 20px;
width: 80%; width: 80%;
@ -37,10 +32,8 @@
height: 200px; height: 200px;
margin-left: 10%; margin-left: 10%;
} }
.result .action { .result .action {
padding-top: 10px; padding-top: 10px;
border-top: 1px whitesmoke solid; border-top: 1px whitesmoke solid;
margin-top: 25px; margin-top: 25px;
} }

7
admin/data/menu.json
View File

@ -175,6 +175,13 @@
"type": 1, "type": 1,
"openType": "_iframe", "openType": "_iframe",
"href": "view/document/tab.html" "href": "view/document/tab.html"
},{
"id": 60132,
"title": "数据菜单",
"icon": "layui-icon layui-icon-face-cry",
"type": 1,
"openType": "_iframe",
"href": "view/document/menu.html"
}] }]
}, { }, {
"id": 204, "id": 204,

41
component/pear/css/pear-module/button.css
View File

@ -44,51 +44,14 @@
background-color: #f56c6c !important background-color: #f56c6c !important
} }
.pear-btn-warming { .pear-btn-warming {
background-color: #e6a23c !important background-color: #f6ad55 !important
} }
.pear-btn-success { .pear-btn-success {
background-color: #67c23a !important background-color: #5FB878 !important
} }
.pear-btn[round] { .pear-btn[round] {
border-radius: 50px; border-radius: 50px;
} }
.pear-btn-primary[plain] {
color: #409eff !important;
background: #ecf5ff !important;
border-color: #b3d8ff !important;
}
.pear-btn-primary[plain]:hover {
color: #fff !important;
background-color: #2d8cf0 !important
}
.pear-btn-success[plain] {
color: #67c23a !important;
background: #f0f9eb !important;
border-color: #c2e7b0 !important;
}
.pear-btn-success[plain]:hover {
color: white !important;
background-color: #67c23a !important
}
.pear-btn-warming[plain] {
color: #e6a23c !important;
background: #fdf6ec !important;
border-color: #f5dab1 !important;
}
.pear-btn-warming[plain]:hover {
color: white !important;
background-color: #e6a23c !important
}
.pear-btn-danger[plain] {
color: #f56c6c !important;
background: #fef0f0 !important;
border-color: #fbc4c4 !important;
}
.pear-btn-danger[plain]:hover {
color: white !important;
background-color: #f56c6c !important
}
/** Button Group */ /** Button Group */
.pear-btn-group { .pear-btn-group {
display: inline-block; display: inline-block;

13
component/pear/css/pear-module/form.css
View File

@ -12,19 +12,6 @@ textarea::-webkit-input-placeholder {
.layui-input:focus, .layui-input:focus,
.layui-textarea:focus { .layui-textarea:focus {
border-color: #5FB878!important; border-color: #5FB878!important;
box-shadow: 0 0 0 3px rgba(95, 184, 120, 0.2)!important;
}
.layui-input[success],
.layui-textarea[success] {
border-color: #5FB878!important;
box-shadow: 0 0 0 3px rgba(95, 184, 120, 0.2)!important;
}
.layui-input[failure],
.layui-textarea[failure] {
border-color: #f56c6c !important;
box-shadow: 0 0 0 3px rgba(245,108,108, 0.2)!important;
} }
.layui-input, .layui-input,

12
component/pear/css/pear-module/select.css
View File

@ -439,27 +439,27 @@ div[xm-select-skin=default].xm-form-selected .xm-select:hover {
} }
div[xm-select-skin=primary] .xm-select-title div.xm-select-label>span { div[xm-select-skin=primary] .xm-select-title div.xm-select-label>span {
background-color: #67c23a!important background-color: #5FB878!important
color: #FFF; color: #FFF;
border: 1px solid #67c23a!important border: 1px solid #5FB878!important
} }
div[xm-select-skin=primary] .xm-select-title div.xm-select-label>span i { div[xm-select-skin=primary] .xm-select-title div.xm-select-label>span i {
background-color: #67c23a!important background-color: #5FB878!important
color: #FFF color: #FFF
} }
div[xm-select-skin=primary] dl dd:not(.xm-dis-disabled) i { div[xm-select-skin=primary] dl dd:not(.xm-dis-disabled) i {
border-color: #67c23a!important border-color: #5FB878!important
} }
div[xm-select-skin=primary] dl dd.xm-select-this:not(.xm-dis-disabled) i { div[xm-select-skin=primary] dl dd.xm-select-this:not(.xm-dis-disabled) i {
color: #67c23a!important color: #5FB878!important
} }
div[xm-select-skin=primary].xm-form-selected .xm-select, div[xm-select-skin=primary].xm-form-selected .xm-select,
div[xm-select-skin=primary].xm-form-selected .xm-select:hover { div[xm-select-skin=primary].xm-form-selected .xm-select:hover {
border-color: #67c23a!important border-color: #5FB878!important
} }
div[xm-select-skin=normal] .xm-select-title div.xm-select-label>span { div[xm-select-skin=normal] .xm-select-title div.xm-select-label>span {

4
component/pear/css/pear-module/step.css
View File

@ -26,7 +26,7 @@
.step-item-tail i { .step-item-tail i {
display: inline-block; display: inline-block;
width: 100%; width: 100%;
height: 2px; height: 3px;
margin-top: 4px; margin-top: 4px;
vertical-align: top; vertical-align: top;
background: #5FB878; background: #5FB878;
@ -47,7 +47,7 @@
text-align: center; text-align: center;
vertical-align: top; vertical-align: top;
color: #5FB878; color: #5FB878;
border: 2px solid #5FB878; border: 3px solid #5FB878;
border-radius: 50%; border-radius: 50%;
background: #ffffff; background: #ffffff;
} }

7
component/pear/css/pear-module/tag.css
View File

@ -10,7 +10,6 @@
.tag .layui-btn .tag-close:hover { .tag .layui-btn .tag-close:hover {
border-radius: 2px; border-radius: 2px;
background-color: #FF5722;
color: #fff; color: #fff;
} }
@ -20,7 +19,7 @@
-webkit-transition: all .2s; -webkit-transition: all .2s;
} }
.tag-item { .tag-item {
background-color: #67c23a; background-color: #5FB878;
color: white; color: white;
border: none; border: none;
} }
@ -31,13 +30,13 @@
} }
.tag-item-normal { .tag-item-normal {
background-color: #2D8CF0; background-color: #5FB878;
color: white; color: white;
border: none; border: none;
} }
.tag-item-warm { .tag-item-warm {
background-color: #e6a23c; background-color: #f6ad55;
color: white; color: white;
border: none; border: none;
} }

12
component/pear/modules/theme.js
View File

@ -40,13 +40,13 @@ layui.define(["jquery","layer"], function (exports) {
if(this.autoHead){ if(this.autoHead){
style += '.pear-admin .layui-header{background-color:' + color + '!important;}.pear-admin .layui-header .layui-nav .layui-nav-item>a{color:white!important;}'; style += '.pear-admin .layui-header{background-color:' + color + '!important;}.pear-admin .layui-header .layui-nav .layui-nav-item>a{color:white!important;}';
} }
style += '.pear-btn.pear-btn-primary {background-color:' + color + '!important}'; style += '.pear-btn-primary {background-color:' + color + '!important}';
style += '.layui-input:focus,.layui-textarea:focus {border-color: '+ color +'!important;box-shadow: 0 0 0 3px rgba(95, 184, 120, 0.2)!important;}' style += '.layui-input:focus,.layui-textarea:focus {border-color: '+ color +'!important;}'
style += '.layui-form-checked[lay-skin=primary] i {border-color: '+ color +'!important;background-color: ' + color + ';}' style += '.layui-form-checked[lay-skin=primary] i {border-color: '+ color +'!important;background-color: ' + color + ';}'
style += '.layui-form-onswitch { border-color: ' + color + '; background-color: '+color+';}' style += '.layui-form-onswitch { border-color: ' + color + '; background-color: '+color+';}'
style += '.layui-form-radio>i:hover, .layui-form-radioed>i {color: ' + color + ';}' style += '.layui-form-radio>i:hover, .layui-form-radioed>i {color: ' + color + ';}'
style += '.layui-laypage .layui-laypage-curr .layui-laypage-em{background-color:'+ color +'!important}' style += '.layui-laypage .layui-laypage-curr .layui-laypage-em{background-color:'+ color +'!important}'
style += '.layui-tab-brief>.layui-tab-more li.layui-this:after, .layui-tab-brief>.layui-tab-title .layui-this:after{border-bottom: 2px solid '+color+'!important}' style += '.layui-tab-brief>.layui-tab-more li.layui-this:after, .layui-tab-brief>.layui-tab-title .layui-this:after{border-bottom: 3px solid '+color+'!important}'
style += '.layui-tab-brief>.layui-tab-title .layui-this{color:'+color+'!important}' style += '.layui-tab-brief>.layui-tab-title .layui-this{color:'+color+'!important}'
style += '.layui-progress-bar{background-color:'+color+'}'; style += '.layui-progress-bar{background-color:'+color+'}';
style += '.layui-elem-quote{border-left: 5px solid '+ color +'}'; style += '.layui-elem-quote{border-left: 5px solid '+ color +'}';
@ -55,6 +55,12 @@ layui.define(["jquery","layer"], function (exports) {
style += '.pear-text{color:' + color + '!important}'; style += '.pear-text{color:' + color + '!important}';
style += '.pear-collasped-pe{background-color:'+color+'!important}' style += '.pear-collasped-pe{background-color:'+color+'!important}'
style += '.layui-form-select dl dd.layui-this{background-color:'+color+'}' style += '.layui-form-select dl dd.layui-this{background-color:'+color+'}'
style += '.tag-item-normal{background:'+color+'!important}';
style += '.step-item-head.step-item-head-active{background-color:'+color+'}'
style += '.step-item-head{border: 3px solid '+color+';}'
style += '.step-item-tail i{background-color:'+color+'}'
style += '.step-item-head{color:' + color + '}'
var colorPane = $("#pear-admin-color"); var colorPane = $("#pear-admin-color");
if(colorPane.length>0){ if(colorPane.length>0){
colorPane.html(style); colorPane.html(style);

2
component/pear/pear.all.js
View File

@ -11,7 +11,7 @@ window.rootPath = (function(src) {
* */ * */
layui.config({ layui.config({
base: rootPath + "modules/", base: rootPath + "modules/",
version: "3.4.2.Release" version: "3.4.3.Release"
}).extend({ }).extend({
admin: "admin", // 框架布局组件 admin: "admin", // 框架布局组件
menu: "menu", // 数据菜单组件 menu: "menu", // 数据菜单组件

2
component/pear/pear.js
View File

@ -11,7 +11,7 @@ window.rootPath = (function(src) {
* */ * */
layui.config({ layui.config({
base: rootPath + "modules/", base: rootPath + "modules/",
version: "3.4.2.Release" version: "3.4.3.Release"
}).extend({ }).extend({
admin: "admin", // 框架布局组件 admin: "admin", // 框架布局组件
menu: "menu", // 数据菜单组件 menu: "menu", // 数据菜单组件

18
view/console/console1.html
View File

@ -164,7 +164,7 @@
<div class="layui-status-img"><a href="javascript:;"><img style="width: 32px;height: 32px;border-radius: 50px;" <div class="layui-status-img"><a href="javascript:;"><img style="width: 32px;height: 32px;border-radius: 50px;"
src="../../admin/images/avatar.jpg"></a></div> src="../../admin/images/avatar.jpg"></a></div>
<div> <div>
<p>七彩枫叶 在 <a lay-href="https://gitee.com/Jmysy/Pear-Admin-Layui">Pear Admin 专区</a> 回答问题</p> <p>七彩枫叶 在 <a class="pear-text" lay-href="https://gitee.com/Jmysy/Pear-Admin-Layui">Pear Admin 专区</a> 回答问题</p>
<span>几秒前</span> <span>几秒前</span>
</div> </div>
</dd> </dd>
@ -172,7 +172,7 @@
<div class="layui-status-img"><a href="javascript:;"><img style="width: 32px;height: 32px;border-radius: 50px;" <div class="layui-status-img"><a href="javascript:;"><img style="width: 32px;height: 32px;border-radius: 50px;"
src="../../admin/images/avatar.jpg"></a></div> src="../../admin/images/avatar.jpg"></a></div>
<div> <div>
<p>简 在 <a lay-href="https://gitee.com/Jmysy/Pear-Admin-Layui">Pear Admin 专区</a> 进行了 <a lay-href="http://fly.layui.com/vipclub/list/layuiadmin/column/quiz/">提问</a></p> <p>简 在 <a class="pear-text" lay-href="https://gitee.com/Jmysy/Pear-Admin-Layui">Pear Admin 专区</a> 进行了 <a class="pear-text" lay-href="http://fly.layui.com/vipclub/list/layuiadmin/column/quiz/">提问</a></p>
<span>2天前</span> <span>2天前</span>
</div> </div>
</dd> </dd>
@ -180,7 +180,7 @@
<div class="layui-status-img"><a href="javascript:;"><img style="width: 32px;height: 32px;border-radius: 50px;" <div class="layui-status-img"><a href="javascript:;"><img style="width: 32px;height: 32px;border-radius: 50px;"
src="../../admin/images/avatar.jpg"></a></div> src="../../admin/images/avatar.jpg"></a></div>
<div> <div>
<p>恒宇少年 将 <a lay-href="https://gitee.com/Jmysy/Pear-Admin-Layui">Pear Admin </a> 更新至 2.3.0 版本</p> <p>恒宇少年 将 <a class="pear-text" lay-href="https://gitee.com/Jmysy/Pear-Admin-Layui">Pear Admin </a> 更新至 2.3.0 版本</p>
<span>7天前</span> <span>7天前</span>
</div> </div>
</dd> </dd>
@ -188,7 +188,7 @@
<div class="layui-status-img"><a href="javascript:;"><img style="width: 32px;height: 32px;border-radius: 50px;" <div class="layui-status-img"><a href="javascript:;"><img style="width: 32px;height: 32px;border-radius: 50px;"
src="../../admin/images/avatar.jpg"></a></div> src="../../admin/images/avatar.jpg"></a></div>
<div> <div>
<p>如花 在 <a lay-href="https://gitee.com/Jmysy/Pear-Admin-Layui">Pear Admin 社区</a> 发布了 <a lay-href="http://fly.layui.com/column/suggest/">建议</a></p> <p>如花 在 <a class="pear-text" lay-href="https://gitee.com/Jmysy/Pear-Admin-Layui">Pear Admin 社区</a> 发布了 <a class="pear-text" lay-href="http://fly.layui.com/column/suggest/">建议</a></p>
<span>7天前</span> <span>7天前</span>
</div> </div>
</dd> </dd>
@ -196,7 +196,7 @@
<div class="layui-status-img"><a href="javascript:;"><img style="width: 32px;height: 32px;border-radius: 50px;" <div class="layui-status-img"><a href="javascript:;"><img style="width: 32px;height: 32px;border-radius: 50px;"
src="../../admin/images/avatar.jpg"></a></div> src="../../admin/images/avatar.jpg"></a></div>
<div> <div>
<p>就眠仪式 在 <a lay-href="https://gitee.com/Jmysy/Pear-Admin-Layui">Pear Admin 社区</a> 发布了 <a lay-href="http://fly.layui.com/column/suggest/">建议</a></p> <p>就眠仪式 在 <a class="pear-text" lay-href="https://gitee.com/Jmysy/Pear-Admin-Layui">Pear Admin 社区</a> 发布了 <a class="pear-text" lay-href="http://fly.layui.com/column/suggest/">建议</a></p>
<span>8天前</span> <span>8天前</span>
</div> </div>
</dd> </dd>
@ -204,7 +204,7 @@
<div class="layui-status-img"><a href="javascript:;"><img style="width: 32px;height: 32px;border-radius: 50px;" <div class="layui-status-img"><a href="javascript:;"><img style="width: 32px;height: 32px;border-radius: 50px;"
src="../../admin/images/avatar.jpg"></a></div> src="../../admin/images/avatar.jpg"></a></div>
<div> <div>
<p>贤心 在 <a lay-href="https://gitee.com/Jmysy/Pear-Admin-Layui">Pear Admin 专区</a> 进行了 <a lay-href="http://fly.layui.com/vipclub/list/layuiadmin/column/quiz/">提问</a></p> <p>贤心 在 <a class="pear-text" lay-href="https://gitee.com/Jmysy/Pear-Admin-Layui">Pear Admin 专区</a> 进行了 <a class="pear-text" lay-href="http://fly.layui.com/vipclub/list/layuiadmin/column/quiz/">提问</a></p>
<span>8天前</span> <span>8天前</span>
</div> </div>
</dd> </dd>
@ -233,11 +233,11 @@
链接 链接
</div> </div>
<div class="layui-card-body"> <div class="layui-card-body">
<a target="_blank" href="http://www.pearadmin.com" class="pear-btn pear-btn-success layui-btn-fluid" style="height: 50px;line-height: 50px;">官 网</a> <a target="_blank" href="http://www.pearadmin.com" class="pear-btn pear-btn-primary layui-btn-fluid" style="margin-top: 8px;height: 50px;line-height: 50px;">官 网</a>
<br/>
<a target="_blank" href="http://www.pearadmin.com/doc/" class="pear-btn pear-btn-primary layui-btn-fluid" style="margin-top: 8px;height: 50px;line-height: 50px;">文 档</a>
<br/> <br/>
<a target="_blank" href="https://gitee.com/pear-admin/Pear-Admin-Layui" class="pear-btn pear-btn-warming layui-btn-fluid" style="margin-top: 8px;height: 50px;line-height: 50px;">下 载</a> <a target="_blank" href="https://gitee.com/pear-admin/Pear-Admin-Layui" class="pear-btn pear-btn-warming layui-btn-fluid" style="margin-top: 8px;height: 50px;line-height: 50px;">下 载</a>
<br/>
<a target="_blank" href="https://gitee.com/pear-admin/Pear-Admin-Layui" class="pear-btn pear-btn-danger layui-btn-fluid" style="margin-top: 8px;height: 50px;line-height: 50px;">后 端</a>
</div> </div>
</div> </div>
</div> </div>

31
view/document/button.html
View File

@ -138,37 +138,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">
<button class="pear-btn pear-btn-primary" plain> Button-One</button>
<button class="pear-btn pear-btn-success" plain> Button-Two</button>
<button class="pear-btn pear-btn-danger" plain> Button-Three</button>
<br>
<br>
<button class="pear-btn pear-btn-primary" round plain> Button-One</button>
<button class="pear-btn pear-btn-success" round plain> Button-Two</button>
<button class="pear-btn pear-btn-danger" round plain> Button-Three</button>
</div>
</div>
</div>
<div class="layui-col-md12">
<div class="layui-collapse">
<div class="layui-colla-item">
<h2 class="layui-colla-title">显示代码</h2>
<div class="layui-colla-content">
<pre class="layui-code" lay-encode="true">
<button class="pear-btn pear-btn-primary" plain> Button-One </button>
<button class="pear-btn pear-btn-success" plain> Button-Two </button>
<button class="pear-btn pear-btn-danger" plain> Button-Three </button>
</pre>
</div>
</div>
</div>
</div>
<div class="layui-col-md12"> <div class="layui-col-md12">
<div class="layui-card"> <div class="layui-card">
<div class="layui-card-header"> <div class="layui-card-header">

109
view/document/menu.html Normal file
View File

@ -0,0 +1,109 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="../../component/pear/css/pear.css"/>
</head>
<body class="pear-container">
<div class="layui-row layui-col-space10">
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-header">开发环境</div>
<div class="layui-card-body">
Menu 数据菜单对侧边菜单的便捷封装
</div>
</div>
</div>
<div class="layui-col-md12">
<div class="layui-collapse">
<div class="layui-colla-item">
<h2 class="layui-colla-title">显示代码</h2>
<div class="layui-colla-content">
<pre class="layui-code" lay-encode="true">
<link rel="stylesheet" href="component/pear/css/pear.css" />
并
<script src="component/layui/layui.js"></script>
并
<script src="component/pear/pear.js"></script>
</pre>
</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 id="sideMenu"></div>
</div>
</div>
</div>
<div class="layui-col-md6">
<div class="layui-collapse">
<div class="layui-colla-item">
<h2 class="layui-colla-title">显示代码</h2>
<div class="layui-colla-content layui-show">
<pre class="layui-code" lay-encode="true">
var sideMenu = menu.render({
elem: 'sideMenu',
async: true,
theme: "dark-theme",
height: '300px',
control: false,
defaultMenu: 0,
accordion: true,
url: "../../admin/data/menu.json",
parseData: false,
done: function() {
layer.msg("加载完成")
}
});
sideMenu.click(function(dom, data) {
layer.msg("菜单点击 : " + JSON.stringify(data));
})
</pre>
</div>
</div>
</div>
</div>
</div>
</body>
<script src="../../component/layui/layui.js"></script>
<script src="../../component/pear/pear.js"></script>
<script>
layui.use(['layer', 'form',
'element', 'menu', 'code','jquery'
], function() {
var layer = layui.layer,
menu = layui.menu,
$ = layui.jquery,
form = layui.form;
layui.code();
var sideMenu = menu.render({
elem: 'sideMenu',
async: true,
theme: "dark-theme",
height: '300px',
control: false,
defaultMenu: 0,
accordion: true,
url: "../../admin/data/menu.json",
parseData: false,
done: function() {
layer.msg("加载完成")
}
});
sideMenu.click(function(dom, data) {
layer.msg("菜单点击 : " + JSON.stringify(data));
})
});
</script>
</html>