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
就眠仪式 2020-07-23 13:37:18 +08:00
parent 46f44399ba
commit 6b909a520f
7 changed files with 154 additions and 131 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

75
component/pear/module/admin.js
View File

@ -41,7 +41,7 @@ layui.define(['table', 'jquery', 'element', 'form', 'tab', 'menu', 'frame'],
control: option.control ? 'control' : false, // control
defaultMenu: 1,
defaultOpen: 0, //默认打开菜单
accordion: true,
accordion: option.accordion,
url: option.data, //数据地址
parseData: false, //请求后是否进行数据解析 函数
change: option.change
@ -147,10 +147,27 @@ layui.define(['table', 'jquery', 'element', 'form', 'tab', 'menu', 'frame'],
}
this.themeRender = function(option) {
if(option.allowCustom == false){
$(".setting").remove();
}
var colorId = localStorage.getItem("theme-color");
var menu = localStorage.getItem("theme-menu");
var color = getColorById(colorId);
if(menu=="null"){
menu = option.defaultMenu;
}else{
if(option.allowCustom == false){
menu = option.defaultMenu;
}
}
localStorage.setItem("theme-color",color.id);
localStorage.setItem("theme-menu",menu);
this.colorSet(getColorById(colorId).color);
this.colorSet(color.color);
this.menuSkin(menu);
}
@ -315,7 +332,7 @@ layui.define(['table', 'jquery', 'element', 'form', 'tab', 'menu', 'frame'],
'<div><span style="display:block; width: 20%; float: left; height: 40px; background: white;"></span><span style="display:block; width: 80%; float: left; height: 40px; background: #f4f5f7;"></span></div>' +
'</a>' +
'</li>';
bgColorHtml +=
'<li data-select-bgcolor="night-theme" >' +
'<a href="javascript:;" data-skin="skin-blue" style="" class="clearfix full-opacity-hover">' +
@ -350,7 +367,7 @@ layui.define(['table', 'jquery', 'element', 'form', 'tab', 'menu', 'frame'],
var color = localStorage.getItem("theme-color");
var menu = localStorage.getItem("theme-menu");
if (color != "null") {
$(".select-color-item").removeClass("layui-icon")
.removeClass("layui-icon-ok");
@ -358,13 +375,13 @@ layui.define(['table', 'jquery', 'element', 'form', 'tab', 'menu', 'frame'],
$("*[color-id='" + color + "']").addClass("layui-icon")
.addClass("layui-icon-ok");
}
if (menu!="null"){
if (menu != "null") {
$("*[data-select-bgcolor]").removeClass("layui-this");
$("[data-select-bgcolor='"+menu+"']").addClass("layui-this");
$("[data-select-bgcolor='" + menu + "']").addClass("layui-this");
}
$('#layui-layer-shade' + index).click(function() {
var $layero = $('#layui-layer' + index);
$layero.animate({
@ -383,7 +400,7 @@ layui.define(['table', 'jquery', 'element', 'form', 'tab', 'menu', 'frame'],
$.ajaxSettings.async = false;
var data = null;
$.get("setting.json", function(result) {
$.getJSON("setting.json", function(result) {
data = result;
});
@ -402,7 +419,6 @@ layui.define(['table', 'jquery', 'element', 'form', 'tab', 'menu', 'frame'],
});
$('body').on('click', '.select-color-item', function() {
$(".select-color-item").removeClass("layui-icon").removeClass("layui-icon-ok");
$(this).addClass("layui-icon").addClass("layui-icon-ok");
var colorId = $(".select-color-item.layui-icon-ok").attr("color-id");
@ -411,25 +427,30 @@ layui.define(['table', 'jquery', 'element', 'form', 'tab', 'menu', 'frame'],
pearAdmin.colorSet(color.color);
});
function getThemeById(id) {
var theme;
$.each(getData().theme, function(i, value) {
if (value.id == id) {
theme = value;
}
})
return theme;
}
function getColorById(id) {
var color;
$.each(getData().colors, function(i, value) {
var flag = false;
var data = getData();
$.each(data.colors, function(i, value) {
if (value.id == id) {
color = value;
flag = true;
}
})
if(flag==false || data.allowCustom == false){
$.each(data.colors, function(i, value) {
if (value.id == data.defaultColor) {
color = value;
}
})
}
return color;
}
@ -452,13 +473,9 @@ layui.define(['table', 'jquery', 'element', 'form', 'tab', 'menu', 'frame'],
var colors = "";
$.each(getData().colors, function(i, value) {
colors += "<span class='select-color-item' color-id='" + value.id + "' style='background-color:" + value.color +
";'></span>";
colors += "<span class='select-color-item' color-id='" + value.id + "' style='background-color:" + value.color + ";'></span>";
})
return "<div class='select-color'><div class='select-color-title'>主题色</div><div class='select-color-content'>" +
colors + "</div></div>"
return "<div class='select-color'><div class='select-color-title'>主题色</div><div class='select-color-content'>" + colors + "</div></div>"
}

7
component/pear/module/menu.js
View File

@ -139,9 +139,10 @@ layui.define(['table', 'jquery', 'element'], function(exports) {
// 根 据 菜 单 Id 选 中 菜 单 项 目
$("#" + this.option.elem + " a[menu-id='" + pearId + "']").parents(".pear-nav-tree").find(".layui-nav-itemed").removeClass(
"layui-nav-itemed");
if (this.option.accordion == true) {
$("#" + this.option.elem + " a[menu-id='" + pearId + "']").parents(".pear-nav-tree").find(".layui-nav-itemed").removeClass(
"layui-nav-itemed");
}
$("#" + this.option.elem + " a[menu-id='" + pearId + "']").parents(".pear-nav-tree").find(".layui-this").removeClass(
"layui-this");

2
index.html
View File

@ -26,7 +26,7 @@
<li class="layui-nav-item layui-hide-xs"><a href="#" class="fullScreen layui-icon layui-icon-screen-full"></a></li>
<li class="layui-nav-item layui-hide-xs"><a href="http://www.pearadmin.cn" class="layui-icon layui-icon-website"></a></li>
<li class="layui-nav-item">
<a href="javascript:;">
<a href="javascript:;" >
<img src="admin/images/avatar.jpg" class="layui-nav-img">
就眠仪式
</a>

11
setting.json
View File

@ -5,12 +5,16 @@
"control": false,
"index": "view/console/console1.html",
"indexTitle": "首页",
"accordion": true,
"data": "admin/data/menu.json",
"select": "0",
"logoTitle": "Pear Admin",
"logoImage": "admin/images/logo.png",
"themeColor": "1",
"colors": [{
"defaultColor": "2",
"defaultMenu": "dark-theme",
"allowCustom": true,
"colors": [
{
"id": "1",
"color": "#FF5722"
},
@ -29,7 +33,8 @@
"color": "darkgray"
}
],
"links": [{
"links": [
{
"icon": "layui-icon layui-icon-auz",
"title": "官方网站",
"href": "http://www.pearadmin.com"

24
view/console/console1.html
View File

@ -253,31 +253,31 @@
echarts = layui.echarts;
count.up("value1", {
time: 5000,
num: 4540.34,
time: 4000,
num: 440.34,
bit: 2,
regulator: 100
regulator: 50
})
count.up("value2", {
time: 5000,
num: 2436.30,
time: 4000,
num: 236.30,
bit: 2,
regulator: 100
regulator: 50
})
count.up("value3", {
time: 5000,
num: 6314.43,
time: 4000,
num: 634.43,
bit: 2,
regulator: 100
regulator: 50
})
count.up("value4", {
time: 5000,
time: 4000,
bit: 2,
num: 3743.23,
regulator: 100
num: 373.23,
regulator: 50
})
var echartsRecords = echarts.init(document.getElementById('echarts-records'), 'walden');

2
view/console/console2.html
View File

@ -133,7 +133,7 @@
<ul class="pear-card-status">
<li>
<h3>就眠仪式</h3>
<p>闭上眼睛进入秘密的宇宙，与最思念的那张脸打一场照面。</p>
<p>快乐的时候不敢尽兴，频繁警戒自己保持清醒。</p>
<span>4月30日 22:43</span>
<a href="javascript:;" data-id="1" class="pear-btn pear-btn-xs pear-btn-success pear-reply">回复</a>
</li>

164
view/document/area.html
View File

@ -1,72 +1,72 @@
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>layarea</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">
Area 省市级联 选择组件
</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>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>layarea</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">
Area 省市级联 选择组件
</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-form">
<div class="layui-form-item" id="area-picker">
<div class="layui-form-label">网点地址</div>
<div class="layui-input-inline" style="width: 200px;">
<select name="province" class="province-selector" data-value="广东省" lay-filter="province-1">
<option value="">请选择省</option>
</select>
</div>
<div class="layui-input-inline" style="width: 200px;">
<select name="city" class="city-selector" data-value="深圳市" lay-filter="city-1">
<option value="">请选择市</option>
</select>
</div>
<div class="layui-input-inline" style="width: 200px;">
<select name="county" class="county-selector" data-value="龙岗区" lay-filter="county-1">
<option value="">请选择区</option>
</select>
</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>
<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">
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-header">
基本使用
</div>
<div class="layui-card-body">
<div class="layui-form">
<div class="layui-form-item" id="area-picker">
<div class="layui-form-label">网点地址</div>
<div class="layui-input-inline" style="width: 200px;">
<select name="province" class="province-selector" data-value="广东省" lay-filter="province-1">
<option value="">请选择省</option>
</select>
</div>
<div class="layui-input-inline" style="width: 200px;">
<select name="city" class="city-selector" data-value="深圳市" lay-filter="city-1">
<option value="">请选择市</option>
</select>
</div>
<div class="layui-input-inline" style="width: 200px;">
<select name="county" class="county-selector" data-value="龙岗区" lay-filter="county-1">
<option value="">请选择区</option>
</select>
</div>
</div>
</div>
</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">
layui.use(['area'], function () {
var area = layui.area;
@ -78,30 +78,30 @@
});
});
</pre>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="../../component/layui/layui.js"></script>
<script src="../../component/pear/pear.js"></script>
<script>
layui.use(['layer', 'form', 'area','element','code'], function () {
var layer = layui.layer
, form = layui.form
, area = layui.area;
<script src="../../component/layui/layui.js"></script>
<script src="../../component/pear/pear.js"></script>
<script>
layui.use(['layer', 'form', 'area', 'element', 'code'], function() {
var layer = layui.layer,
form = layui.form,
area = layui.area;
layui.code();
area.render({
elem: '#area-picker',
change: function (res) {
//选择结果
console.log(res);
}
});
});
</script>
</body>
area.render({
elem: '#area-picker',
change: function(res) {
//选择结果
console.log(res);
}
});
});
</script>
</body>
</html>
</html>