424 lines
13 KiB
PHP
424 lines
13 KiB
PHP
<!DOCTYPE html>
|
||
<html>
|
||
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<title>{$config['web_title']}</title>
|
||
<meta name="renderer" content="webkit">
|
||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||
<meta name="viewport"
|
||
content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
|
||
<link rel="stylesheet" type="text/css" href="/static/third/layui/css/layui.css" media="all">
|
||
<link rel="stylesheet" type="text/css" href="/static/css/index.css" media="all">
|
||
<script type="text/javascript" src="/static/third/layui/layui.js"></script>
|
||
<script type="text/javascript" src="/static/js/admin.js"></script>
|
||
<style>
|
||
.layadmin-side-shrink .layui-layout-admin .layui-logo {
|
||
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>
|
||
|
||
<body layadmin-themealias="default" class="layui-layout-body">
|
||
<div id="LAY_app" class="layadmin-tabspage-none">
|
||
<div class="layui-layout layui-layout-admin">
|
||
<div class="layui-header">
|
||
<!-- 头部区域 -->
|
||
<div style="display: flex;align-items: center;height:70px;">
|
||
<ul class="layui-nav layui-layout-left">
|
||
<li class="layui-nav-item layadmin-flexible" lay-unselect onclick="shrink()">
|
||
<a href="javascript:;" layadmin-event="flexible" title="侧边伸缩">
|
||
<i class="layui-icon layui-icon-shrink-right" id="LAY_app_flexible"></i>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
<ul class="layui-nav layui-layout-right" lay-filter="layadmin-layout-right">
|
||
<li class="layui-nav-item layui-hide-xs" lay-unselect title="前端站点" onclick="gotoFront()">
|
||
<a href="javascript:;" layadmin-event="gotoFront">
|
||
<i class="layui-icon layui-icon-website"></i>
|
||
</a>
|
||
</li>
|
||
<li class="layui-nav-item layui-hide-xs" lay-unselect title="全屏" onclick="fullScreen()">
|
||
<a href="javascript:;" layadmin-event="fullscreen">
|
||
<i class="layui-icon layui-icon-screen-full"></i>
|
||
</a>
|
||
</li>
|
||
<li class="layui-nav-item" lay-unselect>
|
||
<a href="javascript:;">
|
||
<cite>{$aUser['name']}</cite>
|
||
</a>
|
||
<dl class="layui-nav-child">
|
||
<dd><a lay-href="" onclick="menuFire('yunzeradmin/admininfo',1)">个人中心</a></dd>
|
||
<hr>
|
||
<dd layadmin-event="logout" style="text-align:center;" onclick="logout()">
|
||
<a>退出</a>
|
||
</dd>
|
||
</dl>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<!-- 侧边菜单 -->
|
||
<div class="layui-side layui-side-menu">
|
||
<div class="layui-side-scroll">
|
||
<!-- <div class="layui-logo" lay-href="" style="display: flex;align-items: center;">
|
||
<img src="/static/images/logo-l-w.png" alt="{$config['web_title']}"
|
||
style="max-width: 100%; max-height: 100%;">
|
||
</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: -20px;"></i>
|
||
<cite>工作台</cite>
|
||
</a>
|
||
</li>
|
||
<!-- 下面是原有的菜单循环 -->
|
||
{volist name="menu" id="vo"}
|
||
<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>
|
||
{if (isset($vo['children']) && $vo['children'])}
|
||
<dl class="layui-nav-child">
|
||
{volist name="vo.children" id="cvo"}
|
||
<dd data-name="" data-jump="/">
|
||
{if $cvo['type'] == 1}
|
||
<a href="javascript:;" onclick="menuFire('{$cvo.src}',1)">
|
||
<i class="layui-icon layui-icons {$cvo.icon_class}"></i>{$cvo.label}
|
||
</a>
|
||
{elseif $cvo['type'] == 2 /}
|
||
<a href="{$cvo.src}" target="_blank">
|
||
<i class="layui-icon layui-icons {$cvo.icon_class}"></i>{$cvo.label}
|
||
</a>
|
||
{/if}
|
||
</dd>
|
||
{/volist}
|
||
</dl>
|
||
{/if}
|
||
</li>
|
||
{/volist}
|
||
</ul>
|
||
<div style="position: absolute;bottom:20px;width:200px;display:flex;justify-content: center;">
|
||
<a style="color:#848484" href="https://www.yunzer.cn/">POWER BY 云泽网</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 主体内容 -->
|
||
<div class="layui-body" id="LAY_app_body">
|
||
<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>
|
||
<!-- 辅助元素，一般用于移动设备下遮罩 -->
|
||
<div class="layadmin-body-shade" layadmin-event="shade" onclick="shrink()"></div>
|
||
</div>
|
||
</div>
|
||
<!-- 辅助元素，一般用于移动设备下遮罩 -->
|
||
<div class="layadmin-body-shade" layadmin-event="shade"></div>
|
||
</div>
|
||
</div>
|
||
<script type="text/javascript">
|
||
layui.use(['element', 'layer', 'jquery'], function () {
|
||
var element = layui.element;
|
||
$ = layui.jquery;
|
||
layer = layui.layer;
|
||
setter = layui.setter;
|
||
|
||
// 保存标签状态
|
||
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('');
|
||
$(this).children('.sub-menu').stop().slideUp();
|
||
$(this).siblings().children('.sub-menu').slideUp();
|
||
} else {
|
||
$(this).addClass('open');
|
||
$(this).children('a').find('.nav_right').html('');
|
||
$(this).children('.sub-menu').stop().slideDown();
|
||
$(this).siblings().children('.sub-menu').stop().slideUp();
|
||
$(this).siblings().find('.nav_right').html('');
|
||
$(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);
|
||
});
|
||
});
|
||
});
|
||
|
||
// 菜单点击
|
||
function menuFire(obj, num) {
|
||
if (num == 1) {
|
||
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('确定要退出吗？', {
|
||
icon: 3,
|
||
btn: ['确定', '取消']
|
||
}, function () {
|
||
$.get("{$config['admin_route']}login/logout", function (res) {
|
||
if (res.code > 0) {
|
||
layer.msg(res.msg, { 'icon': 2 });
|
||
} else {
|
||
layer.msg(res.msg, { 'icon': 1 });
|
||
setTimeout(function () { window.location.href = "{$config['admin_route']}login/index"; }, 1000);
|
||
}
|
||
}, 'json');
|
||
});
|
||
}
|
||
|
||
//跳转前端站点
|
||
function gotoFront() {
|
||
window.open("//{$config['admin_domain']}", "_blank");
|
||
}
|
||
</script>
|
||
</body>
|
||
|
||
</html> |