feat(theme): 配色专属标准皮肤,清爽全包观感与面板交互重构

This commit is contained in:
augushong
2026-09-27 02:18:41 +00:00
parent 5d1bc69fdf
commit 842641763a
4 changed files with 236 additions and 48 deletions

View File

@@ -452,12 +452,12 @@
var listElemStyle = [
{
title: '清爽',
className: 'fresh',
defaultColorConfig: '12'
className: 'fresh'
},
{
title: '标准',
className: 'normal'
className: 'normal',
defaultColorConfig: '0'
},
{
title: '原型',
@@ -470,7 +470,8 @@
},
{
title: 'GTK',
className: 'gtk'
className: 'gtk',
defaultColorConfig: '0'
},
{
title: '像素',
@@ -510,14 +511,12 @@
var html = '';
$.each(listElemStyle, function (key, val) {
if (typeof val.defaultColorConfig == 'undefined') {
val.defaultColorConfig = '0'
}
var dcc = (typeof val.defaultColorConfig == 'undefined') ? '' : val.defaultColorConfig;
if (val.className === elemStyleName) {
html += '<li class="layui-this style-item" data-select-style="' + val.className + '" data-default-color-config="' + val.defaultColorConfig + '">\n';
html += '<li class="layui-this style-item" data-select-style="' + val.className + '" data-default-color-config="' + dcc + '">\n';
} else {
html += '<li class="style-item" data-select-style="' + val.className + '" data-default-color-config="' + val.defaultColorConfig + '">\n';
html += '<li class="style-item" data-select-style="' + val.className + '" data-default-color-config="' + dcc + '">\n';
}
html +=
val.title +
@@ -537,19 +536,20 @@
var clientHeight = (document.documentElement.clientHeight) - 60;
var bgColorHtml = miniTheme.buildBgColorHtml(options);
var elemStyleHtml = miniTheme.buildElemStyleHtml(options);
var currentElemStyle = localStorage.getItem('layuiminiElemStyleName') || options.elemStyleDefault;
var html = '<div class="layuimini-color">\n' +
'<div class="color-title">\n' +
'<span>配色方案</span>\n' +
'</div>\n' +
'<div class="color-content">\n' +
'<ul>\n' + bgColorHtml + '</ul>\n' +
'</div>\n' +
'<div class="elem-title">\n' +
'<span>元素风格</span>\n' +
'</div>\n' +
'<div class="elem-content">\n' +
'<ul>\n' + elemStyleHtml + '</ul>\n' +
'</div>\n' +
'<div class="color-title">\n' +
'<span>配色方案</span>' + (currentElemStyle !== 'normal' ? '<span class="layui-word-aux" style="position:static;margin-left:8px;font-size:12px;color:#5f6368">标准皮肤支持</span>' : '') + '\n' +
'</div>\n' +
'<div class="color-content">\n' +
'<ul>\n' + bgColorHtml + '</ul>\n' +
'</div>\n' +
'<div class="more-menu-list">\n' +
'<a class="more-menu-item" href="http://doc.ulthon.com/home/read/ulthon_admin/home.html" target="_blank"><i class="layui-icon layui-icon-read" style="font-size: 19px;"></i> 开发文档</a>\n' +
'<a class="more-menu-item" href="https://gitee.com/ulthon/ulthon_admin" target="_blank"><i class="layui-icon layui-icon-tabs" style="font-size: 16px;"></i> 开源地址</a>\n' +
@@ -584,6 +584,13 @@
$('body').on('click', '[data-select-bgcolor]', function () {
var bgcolorId = $(this).attr('data-select-bgcolor');
var currentElemStyle = localStorage.getItem('layuiminiElemStyleName') || 'fresh';
if (currentElemStyle !== 'normal') {
localStorage.setItem('layuiminiElemStyleName', 'normal');
$('.elem-content li[data-select-style]').removeClass('layui-this');
$('.elem-content li[data-select-style="normal"]').addClass('layui-this');
}
$(this).attr('class', 'layui-this').siblings().removeClass('layui-this');
localStorage.setItem('layuiminiBgcolorId', bgcolorId);
miniTheme.render({