优化后端

This commit is contained in:
2025-05-16 13:04:17 +08:00
parent 4f8f621c2c
commit 9df71d0faf
19 changed files with 1835 additions and 694 deletions
+268 -27
View File
@@ -17,6 +17,43 @@
width: 60px;
background-image: url("/static/images/logob32.jpg");
}
.main-content {
height: 100%;
background: #fff;
}
#mainWorkspace {
height: 100%;
}
#mainTabs.layui-tab {
margin: 0;
height: 100%;
}
.layui-tab-content {
padding: 0;
height: calc(100% - 41px);
}
.layui-tab-item {
height: 100%;
}
.main-iframe {
width: 100%;
height: 100%;
border: none;
/* background-color: #f2f2f2; */
}
.layui-tab-title {
background: #fff;
box-shadow: 0 1px 2px 0 rgba(0,0,0,.1);
}
.layui-tab-title .layui-this:after {
border-bottom-color: #009688;
}
#LAY_app_body {
overflow: hidden;
}
.layui-tab-content .layui-tab-item {
position: relative;
}
</style>
</head>
@@ -68,9 +105,20 @@
</div>
<ul class="layui-nav layui-nav-tree" lay-shrink="all" id="LAY-system-side-menu"
lay-filter="layadmin-system-side-menu">
<!-- 固定的工作台菜单项 -->
<li class="layui-nav-item" data-name="index/welcome">
<a href="javascript:;" lay-tips="工作台" lay-direction="2"
onclick="menuFire('index/welcome',1)">
<i class="layui-icon layui-icon-home" style="margin-top: -30px;"></i>
<cite>工作台</cite>
</a>
</li>
<!-- 下面是原有的菜单循环 -->
{volist name="menu" id="vo"}
<li data-name="" data-jump="" class="layui-nav-item">
<a href="javascript:;" lay-tips="{$vo['label']}" lay-direction="2">
<li data-name="{$vo.src}" data-jump="" class="layui-nav-item">
<!-- 修改一级菜单的点击事件,只有当有src时才跳转 -->
<a href="javascript:;" lay-tips="{$vo['label']}" lay-direction="2" {if isset($vo['src']) &&
$vo['src']}onclick="menuFire('{$vo.src}',1)" {/if}>
<i class="layui-icon layui-icons {$vo['icon_class']}"></i>
<cite>{$vo['label']}</cite>
</a>
@@ -101,12 +149,15 @@
</div>
<!-- 主体内容 -->
<div class="layui-body" id="LAY_app_body">
<div class="layadmin-tabsbody-item layui-show">
<div class="layui-fluid">
<div class="layui-card">
<iframe src="{$config['admin_route']}index/welcome" onload="resetMainHeight(this)"
style="width:100%;height:100%;" frameborder="0" scrolling="0"></iframe>
</div>
<div class="main-content">
<!-- 默认工作台界面 -->
<div id="mainWorkspace">
<iframe src="{$config['admin_route']}index/welcome" class="main-iframe" frameborder="0" scrolling="0"></iframe>
</div>
<!-- 动态标签页 -->
<div id="mainTabs" class="layui-tab" lay-allowClose="true" lay-filter="mainTabs" style="margin-top: 10px;">
<ul class="layui-tab-title"></ul>
<div class="layui-tab-content"></div>
</div>
</div>
</div>
@@ -124,38 +175,228 @@
$ = layui.jquery;
layer = layui.layer;
setter = layui.setter;
$('#clearcache').on('click', function () {
$.ajax({
url: "{$config['admin_route']}index/clear",
success: function (res) {
if (res.code > 0) {
layer.msg(res.msg, { 'icon': 2 });
} else {
layer.msg(res.msg, { 'icon': 1 });
setTimeout(function () { parent.window.location.reload(); }, 1000);
// 保存标签状态
function saveTabState(layid, title, url) {
var tabState = {
layid: layid,
title: title,
url: url
};
sessionStorage.setItem('currentTab', JSON.stringify(tabState));
}
// 恢复标签状态
function restoreTabState() {
var tabState = sessionStorage.getItem('currentTab');
if (tabState) {
try {
var tab = JSON.parse(tabState);
if (tab.url && tab.title) {
addTab(tab.title, tab.url, tab.layid);
}
} catch (e) {
console.error('Failed to restore tab state:', e);
}
}
}
// 在页面加载完成后执行
$(document).ready(function () {
// 获取URL参数
var urlParams = new URLSearchParams(window.location.search);
var page = urlParams.get('page');
if (page) {
// 如果有page参数,加载对应页面到iframe
$('iframe').attr('src', "{$config['admin_route']}" + page);
} else {
// 否则加载默认页面
$('iframe').attr('src', "{$config['admin_route']}index/welcome");
}
// 恢复标签状态
restoreTabState();
});
// 添加或切换到标签页
window.addTab = function(title, url, id) {
var element = layui.element;
var $ = layui.jquery;
var layid = id || url.replace(/\//g, '_');
// 如果是首页/工作台,直接显示主工作区
if(url.indexOf('index/welcome') > -1 || url.indexOf('welcome') > -1) {
$('#mainTabs').hide();
$('#mainWorkspace').show();
$('#mainWorkspace iframe').attr('src', url);
sessionStorage.removeItem('currentTab');
return;
}
// 显示标签区域
$('#mainWorkspace').hide();
$('#mainTabs').show();
// 如果标签已存在,直接切换
if($('.layui-tab-title li[lay-id="'+ layid +'"]').length > 0) {
element.tabChange('mainTabs', layid);
saveTabState(layid, title, url);
return;
}
// 添加新标签
element.tabAdd('mainTabs', {
title: title,
content: '<iframe src="' + url + '" class="main-iframe" frameborder="0"></iframe>',
id: layid
});
// 切换到新标签页
element.tabChange('mainTabs', layid);
// 保存当前标签状态
saveTabState(layid, title, url);
};
// 监听标签切换事件
element.on('tab(mainTabs)', function(data){
var layid = $(this).attr('lay-id');
// 确保当前标签页内容可见
$('.layui-tab-content .layui-tab-item').eq(data.index).addClass('layui-show')
.siblings().removeClass('layui-show');
// 更新保存的标签状态
var title = $(this).text();
var url = $('.layui-tab-content .layui-tab-item').eq(data.index).find('iframe').attr('src');
saveTabState(layid, title, url);
});
// 监听标签删除事件
element.on('tabDelete(mainTabs)', function(data){
// 如果没有标签了,显示工作台
if($('.layui-tab-title li').length === 0) {
$('#mainTabs').hide();
$('#mainWorkspace').show();
sessionStorage.removeItem('currentTab');
}
});
// 左侧菜单点击事件
$('.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('&#xe697;');
$(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('&#xe697;');
$(this).siblings().removeClass('open');
}
} else {
var url = $(this).children('a').attr('_href');
var title = $(this).children('a').html();
title = title.replace(/<[^>]+>/g, "").trim(); // 移除HTML标签
if (url) {
window.addTab(title, url);
}
}
event.stopPropagation();
})
// 修改resetMainHeight函数
function resetMainHeight(iframe) {
if (!iframe) return;
try {
// 获取视口高度
var clientHeight = document.documentElement.clientHeight;
// 计算iframe应该的高度(减去头部和tab标签的高度)
var iframeHeight = clientHeight - 60 - 40; // 60px是头部高度,40px是tab标签高度
$(iframe).css({
'height': iframeHeight + 'px',
'width': '100%',
'display': 'block'
});
} catch(e) {
console.error('Reset iframe height failed:', e);
}
}
// 在窗口大小改变时重置所有iframe高度
$(window).on('resize', function() {
$('.main-iframe').each(function() {
resetMainHeight(this);
});
return false;
});
});
// 重新设置主操作页面高度
function resetMainHeight(obj) {
// parent 上级
// clientHeight 元素的像素高度,包含元素的高度+内边距,不包含水平滚动条,边框和外边距
var height = parent.document.documentElement.clientHeight - 80;
$(obj).parent('div').height(height);
}
// 菜单点击
function menuFire(obj, num) {
if (num == 1) {
$('iframe').attr('src', "{$config['admin_route']}" + obj);
var title = '';
// 获取菜单标题
$('.layui-nav-item a').each(function() {
if($(this).attr('onclick') && $(this).attr('onclick').indexOf(obj) > -1) {
title = $(this).text().trim();
return false;
}
});
// 如果没找到标题,使用子菜单查找
if(!title) {
$('.layui-nav-child a').each(function() {
if($(this).attr('onclick') && $(this).attr('onclick').indexOf(obj) > -1) {
title = $(this).text().trim();
return false;
}
});
}
// 添加或切换到标签页
window.addTab(title || '新页面', "{$config['admin_route']}" + obj, obj.replace(/\//g, '_'));
// 更新浏览器URL,但保持在index页面
window.history.pushState({}, '', "{$config['admin_route']}index/index?page=" + obj);
// 如果是子菜单,确保父菜单展开
if (obj.indexOf('/') > -1) {
var parentMenu = obj.split('/')[0];
$('.layui-nav-item').each(function () {
var menuSrc = $(this).find('a').attr('onclick');
if (menuSrc && menuSrc.indexOf(parentMenu) > -1) {
$(this).addClass('layui-nav-itemed');
}
});
}
}
var width = screen();
if (width < 2) {
shrink();
}
}
// 监听浏览器前进后退按钮
window.addEventListener('popstate', function (event) {
// 获取URL参数
var urlParams = new URLSearchParams(window.location.search);
var page = urlParams.get('page');
if (page) {
// 如果有page参数,通过标签系统加载页面
var title = '新页面';
window.addTab(title, "{$config['admin_route']}" + page, page.replace(/\//g, '_'));
} else {
// 否则加载默认页面
element.tabChange('mainTabs', 'welcome');
}
});
// 退出
function logout() {
layer.confirm('确定要退出吗?', {
@@ -174,7 +415,7 @@
}
//跳转前端站点
function gotoFront(){
function gotoFront() {
window.open("//{$config['admin_domain']}", "_blank");
}
</script>