多语言
This commit is contained in:
@@ -1,9 +1,9 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-cn">
|
||||
<html lang="<?= session('lang', 'zh-cn') ?>">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
||||
<title>主页</title>
|
||||
<title><?= $translations['title'] ?? '主页' ?></title>
|
||||
<!-- 依 赖 样 式 -->
|
||||
<link rel="stylesheet" href="/app/admin/component/pear/css/pear.css" />
|
||||
<!-- 加 载 样 式 -->
|
||||
@@ -12,6 +12,27 @@
|
||||
<link rel="stylesheet" href="/app/admin/admin/css/admin.css" />
|
||||
<!-- 重置样式 -->
|
||||
<link rel="stylesheet" href="/app/admin/admin/css/reset.css" />
|
||||
<style>
|
||||
.language-selector {
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.language-selector .layui-form-item {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.language-selector .layui-select {
|
||||
width: 100px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
color: #fff;
|
||||
}
|
||||
.language-selector .layui-select option {
|
||||
background-color: #fff;
|
||||
color: #333;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<!-- 结 构 代 码 -->
|
||||
<body class="layui-layout-body pear-admin">
|
||||
@@ -24,7 +45,7 @@
|
||||
<!-- 图 标 -->
|
||||
<img class="logo">
|
||||
<!-- 标 题 -->
|
||||
<span class="title"></span>
|
||||
<span class="title"><?= $translations['system_name'] ?? 'Vehicle Data Platform' ?></span>
|
||||
</div>
|
||||
<!-- 顶 部 左 侧 功 能 -->
|
||||
<ul class="layui-nav layui-layout-left">
|
||||
@@ -38,13 +59,27 @@
|
||||
<li class="layui-nav-item layui-hide-xs"><a href="#" class="menuSearch layui-icon layui-icon-search"></a></li>
|
||||
<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 message"></li>
|
||||
<!-- 语言切换 -->
|
||||
<li class="layui-nav-item layui-hide-xs">
|
||||
<div class="language-selector">
|
||||
<form class="layui-form">
|
||||
<div class="layui-form-item">
|
||||
<select name="language" id="language-select" lay-filter="language-select" class="layui-select">
|
||||
<option value="zh-cn" <?= session('lang', 'zh-cn') === 'zh-cn' ? 'selected' : '' ?>>中文</option>
|
||||
<option value="en" <?= session('lang', 'zh-cn') === 'en' ? 'selected' : '' ?>>English</option>
|
||||
<option value="ru" <?= session('lang', 'zh-cn') === 'ru' ? 'selected' : '' ?>>Русский</option>
|
||||
<option value="ar" <?= session('lang', 'zh-cn') === 'ar' ? 'selected' : '' ?>>العربية</option>
|
||||
</select>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</li>
|
||||
<li class="layui-nav-item user">
|
||||
<!-- 头 像 -->
|
||||
<a class="layui-icon layui-icon-username" href="javascript:;"></a>
|
||||
<!-- 功 能 菜 单 -->
|
||||
<dl class="layui-nav-child">
|
||||
<dd><a user-menu-url="/app/admin/account/index" user-menu-id="10" user-menu-title="基本资料">基本资料</a></dd>
|
||||
<dd><a href="javascript:void(0);" class="logout">注销登录</a></dd>
|
||||
<dd><a href="javascript:void(0);" class="logout"><?= $translations['logout'] ?? '注销登录' ?></a></dd>
|
||||
</dl>
|
||||
</li>
|
||||
<!-- 主 题 配 置 -->
|
||||
@@ -58,7 +93,7 @@
|
||||
<!-- 图 标 -->
|
||||
<img class="logo">
|
||||
<!-- 标 题 -->
|
||||
<a href="/"><span class="title"></span></a>
|
||||
<a href="/"><span class="title"><?= $translations['system_name'] ?? 'Vehicle Data Platform' ?></span></a>
|
||||
</div>
|
||||
<!-- 菜 单 内 容 -->
|
||||
<div class="layui-side-scroll">
|
||||
@@ -73,7 +108,7 @@
|
||||
<!-- 页脚 -->
|
||||
<div class="layui-footer layui-text">
|
||||
<span class="left">
|
||||
Released under the MIT license.
|
||||
<?= $translations['footer_text'] ?? 'Released under the MIT license.' ?>
|
||||
</span>
|
||||
<span class="center"></span>
|
||||
</div>
|
||||
@@ -96,18 +131,197 @@
|
||||
<script>
|
||||
// Admin
|
||||
window.Admin = {
|
||||
Account: {}
|
||||
Account: {},
|
||||
Translations: <?= json_encode($translations ?? []) ?>
|
||||
};
|
||||
|
||||
layui.use(["admin","jquery","popup","drawer"], function() {
|
||||
layui.use(["admin","jquery","popup","drawer","form","tab"], function() {
|
||||
var $ = layui.$;
|
||||
var admin = layui.admin;
|
||||
var popup = layui.popup;
|
||||
var drawer = layui.drawer;
|
||||
var form = layui.form;
|
||||
var tab = layui.tab;
|
||||
|
||||
// 设置菜单配置
|
||||
admin.setConfigType("json");
|
||||
admin.setConfigPath("/app/admin/config/get");
|
||||
admin.setConfigPath("/app/admin/rule/get");
|
||||
|
||||
// 初始化菜单
|
||||
var config = {
|
||||
logo: {
|
||||
title: "<?= $translations['system_name'] ?? 'Vehicle Data Platform' ?>",
|
||||
image: "/app/admin/admin/images/logo.png",
|
||||
href: "/"
|
||||
},
|
||||
menu: {
|
||||
data: "/app/admin/rule/get",
|
||||
method: "GET",
|
||||
accordion: true,
|
||||
collapse: false,
|
||||
control: false,
|
||||
controlWidth: 2000,
|
||||
select: "1",
|
||||
async: true,
|
||||
click: function(data) {
|
||||
// 更新标签页标题
|
||||
if (data.title) {
|
||||
// 获取当前标签页
|
||||
var currentTab = $('.layui-tab-title .layui-this');
|
||||
if (currentTab.length) {
|
||||
// 保存完整的菜单信息
|
||||
currentTab.find('span')
|
||||
.data('menu-id', data.id)
|
||||
.data('menu-key', data.key)
|
||||
.data('menu-pid', data.pid)
|
||||
.text(data.title);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
tab: {
|
||||
enable: true,
|
||||
keepState: true,
|
||||
session: true,
|
||||
preload: false,
|
||||
max: "30",
|
||||
index: {
|
||||
id: "1",
|
||||
href: "/app/admin/vehicle/index",
|
||||
title: "<?= $translations['vehicle_management'] ?? '车辆管理' ?>"
|
||||
},
|
||||
close: function(layid) {
|
||||
// 获取当前标签页
|
||||
var currentTab = $('.layui-tab-title li[lay-id="' + layid + '"]');
|
||||
if (currentTab.length) {
|
||||
// 移除标签页
|
||||
currentTab.remove();
|
||||
// 移除对应的内容
|
||||
$('.layui-tab-content .layui-tab-item[lay-id="' + layid + '"]').remove();
|
||||
// 如果还有其他标签页，激活最后一个
|
||||
var lastTab = $('.layui-tab-title li:last');
|
||||
if (lastTab.length) {
|
||||
lastTab.addClass('layui-this');
|
||||
$('.layui-tab-content .layui-tab-item:last').addClass('layui-show');
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
theme: {
|
||||
defaultColor: "2",
|
||||
defaultMenu: "light-theme",
|
||||
defaultHeader: "light-theme",
|
||||
allowCustom: true,
|
||||
banner: false
|
||||
},
|
||||
colors: [
|
||||
{
|
||||
id: "1",
|
||||
color: "#36b368",
|
||||
second: "#f0f9eb"
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
color: "#2d8cf0",
|
||||
second: "#ecf5ff"
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
color: "#f6ad55",
|
||||
second: "#fdf6ec"
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
color: "#f56c6c",
|
||||
second: "#fef0f0"
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
color: "#3963bc",
|
||||
second: "#ecf5ff"
|
||||
}
|
||||
],
|
||||
other: {
|
||||
keepLoad: "500",
|
||||
autoHead: false,
|
||||
footer: false
|
||||
},
|
||||
header: {
|
||||
message: false
|
||||
}
|
||||
};
|
||||
|
||||
admin.render();
|
||||
// 初始化 admin
|
||||
admin.render(config, function() {
|
||||
// 获取菜单数据
|
||||
$.ajax({
|
||||
url: '/app/admin/rule/get',
|
||||
method: 'GET',
|
||||
success: function(res) {
|
||||
if (res.code === 0) {
|
||||
// 创建菜单映射
|
||||
var menuMap = {};
|
||||
function processMenuItems(items) {
|
||||
items.forEach(function(item) {
|
||||
menuMap[item.id] = item;
|
||||
if (item.children) {
|
||||
processMenuItems(item.children);
|
||||
}
|
||||
});
|
||||
}
|
||||
processMenuItems(res.data);
|
||||
|
||||
// 更新所有标签页标题
|
||||
$('.layui-tab-title li').each(function() {
|
||||
var $tab = $(this);
|
||||
var menuId = $tab.find('span').data('menu-id');
|
||||
if (menuId && menuMap[menuId]) {
|
||||
var menuItem = menuMap[menuId];
|
||||
$tab.find('span')
|
||||
.data('menu-id', menuItem.id)
|
||||
.data('menu-key', menuItem.key)
|
||||
.data('menu-pid', menuItem.pid)
|
||||
.text(menuItem.title);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// 语言切换处理
|
||||
form.on('select(language-select)', function(data) {
|
||||
var lang = data.value;
|
||||
$.ajax({
|
||||
url: '/app/admin/language/switch',
|
||||
method: 'POST',
|
||||
data: { lang: lang },
|
||||
success: function(res) {
|
||||
if (res.code === 0) {
|
||||
// 关闭所有非首页标签页
|
||||
$('.layui-tab-title li').each(function() {
|
||||
var layId = $(this).attr('lay-id');
|
||||
if (layId && layId !== '1') { // 保留车辆管理标签
|
||||
var closeBtn = $(this).find('.layui-tab-close');
|
||||
if (closeBtn.length) {
|
||||
closeBtn.trigger('click');
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// 等待标签页关闭后刷新页面
|
||||
setTimeout(function() {
|
||||
window.location.reload();
|
||||
}, 100);
|
||||
} else {
|
||||
popup.failure(res.msg);
|
||||
}
|
||||
},
|
||||
error: function() {
|
||||
popup.failure('切换语言失败');
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// 登出逻辑
|
||||
admin.logout(function(){
|
||||
@@ -118,13 +332,13 @@
|
||||
if (res.code) {
|
||||
return popup.error(res.msg);
|
||||
}
|
||||
popup.success("注销成功",function(){
|
||||
popup.success(Admin.Translations['logout_success'] || "注销成功", function(){
|
||||
location.reload();
|
||||
})
|
||||
}
|
||||
});
|
||||
return false;
|
||||
})
|
||||
});
|
||||
|
||||
$.ajax({
|
||||
url: "/app/admin/account/info",
|
||||
@@ -134,10 +348,9 @@
|
||||
}
|
||||
});
|
||||
|
||||
// 消息点击回调
|
||||
//admin.message(function(id, title, context, form) {});
|
||||
// 重新渲染表单
|
||||
form.render();
|
||||
});
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user