Files
easy-admin/web/admin/index.html
2024-12-27 21:55:26 +08:00

222 lines
9.3 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title> Easy Admin</title>
<!-- 依 赖 样 式 -->
<link rel="stylesheet" href="component/pear/css/pear.css"/>
<!-- 加 载 样 式-->
<link rel="stylesheet" href="admin/css/load.css"/>
<!-- 布 局 样 式 -->
<link rel="stylesheet" href="admin/css/admin.css"/>
</head>
<!-- 结 构 代 码 -->
<body class="layui-layout-body pear-admin">
<!-- 布 局 框 架 -->
<div class="layui-layout layui-layout-admin">
<div class="layui-header">
<!-- 顶 部 左 侧 功 能 -->
<ul class="layui-nav layui-layout-left">
<li class="collaspe layui-nav-item"><a href="#" class="layui-icon layui-icon-shrink-right"></a></li>
<li class="refresh layui-nav-item"><a href="#" class="layui-icon layui-icon-refresh-1" loading=600></a></li>
</ul>
<!-- 多 系 统 菜 单 -->
<div id="control" class="layui-layout-control"></div>
<!-- 顶 部 右 侧 菜 单 -->
<ul class="layui-nav layui-layout-right">
<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.com"-->
<!-- class="layui-icon layui-icon-website"></a></li>-->
<li class="layui-nav-item layui-hide-xs message"></li>
<li class="layui-nav-item user">
<!-- 头 像 -->
<a href="javascript:;">
<img src="admin/images/avatar.jpg" class="layui-nav-img">
</a>
<!-- 功 能 菜 单 -->
<dl class="layui-nav-child">
<dd><a user-menu-url="view/system/user/center.html" user-menu-id="5555"
user-menu-title="基本资料">基本资料</a>
</dd>
<dd><a user-menu-url="view/system/user/password.html" user-menu-id="6666"
user-menu-title="修改密码">修改密码</a>
</dd>
<dd><a href="javascript:void(0);" class="logout">注销登录</a></dd>
</dl>
</li>
<!-- 主 题 配 置 -->
<li class="layui-nav-item setting"><a href="#" class="layui-icon layui-icon-more-vertical"></a></li>
</ul>
</div>
<!-- 侧 边 区 域 -->
<div class="layui-side layui-bg-black">
<!-- 菜 单 顶 部 -->
<div class="layui-logo">
<!-- 图 标 -->
<img class="logo"></img>
<!-- 标 题 -->
<span class="title"></span>
</div>
<!-- 菜 单 内 容 -->
<div class="layui-side-scroll">
<div id="sideMenu"></div>
</div>
</div>
<!-- 视 图 页 面 -->
<div class="layui-body">
<!-- 内 容 页 面 -->
<div id="content"></div>
</div>
<!-- 遮 盖 层 -->
<div class="pear-cover"></div>
<!-- 加 载 动 画-->
<div class="loader-main">
<div class="loader"></div>
</div>
</div>
<!-- 移 动 端 便 捷 操 作 -->
<div class="pear-collasped-pe collaspe">
<a href="#" class="layui-icon layui-icon-shrink-right"></a>
</div>
<!-- 依 赖 脚 本 -->
<script src="component/layui/layui.js"></script>
<script src="component/pear/pear.js"></script>
<script src="https://cdn.jsdelivr.net/sockjs/1/sockjs.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/stomp.js/2.3.3/stomp.min.js"></script>
<!-- 框 架 初 始 化 -->
<script>
layui.use(['admin', 'jquery', 'notice', 'popup', 'easyAdmin', 'util'], function () {
var admin = layui.admin;
var $ = layui.jquery;
var notice = layui.notice;
var popup = layui.popup;
var easyAdmin = layui.easyAdmin;
let util = layui.util;//引入util
// 在登录的时候塞入的值
const user = layui.data('user');
// 用于判断未登录跳转到登录页
if (JSON.stringify(user) === "{}") {
location.href = "login.html";
}
// 获取用户信息,用户名、昵称、头像等
easyAdmin.http({
url: "/sys/auth/v1/userInfo",
dataType: 'json',
success: function (data) {
admin.setAvatar(data.data.avatar, data.data.nickName);
}
// error: function () {
// // 用于验证前端信息 对应到不对的会话情况
// // 清空本地存储
// console.log("当前浏览器存储中没有用户信息,清空本地存储,讲跳转到login.html")
// layui.data('user', null);
// location.href = "login.html";
// }
});
// 读取配置文件yml、json2种方式
admin.setConfigType("yml");
admin.setConfigPath("config/pear.config.yml");
// 动态设置配置文件中菜单树接口地址
let readConfig = admin.readConfig();
// 动态加载菜单树
easyAdmin.httpGet("/sys/menu/tree", function (data) {
readConfig.menu.data = data;
}, true, false);
// 渲染
admin.render(readConfig);
// 登出逻辑
admin.logout(function () {
easyAdmin.httpGet("/sys/auth/v1/logout");
popup.success("注销成功", function () {
// 清空本地存储
layui.data('user', null);
location.href = "login.html";
})
// 注销逻辑 返回 true / false
return true;
})
// 初始化消息回调
admin.message();
// 实现消息回调 [消息列表点击事件]
// admin.message(function(id, title, context, form) {});
//固定块
util.fixbar({
bar1: true
, bar2: true
, css: {right: 20, bottom: 20}
, bgcolor: '#393D49'
, click: function (type) {
if (type === 'bar1') {
layer.msg("功能开发中,敬请期待");
} else if (type === 'bar2') {
// 公告层
layer.open({
type: 1,
title: false, //不显示标题栏
closeBtn: false,
area: '300px;',
shade: 0.8,
id: 'LAY_layuipro', //设定一个id防止重复弹出
btn: ['火速支援', '残忍拒绝'],
btnAlign: 'c',
moveType: 1, //拖拽模式0或者1
content: '<div style="padding: 50px; line-height: 22px; background-color: #393D49; color: #fff; font-weight: 200;">' +
'工作时间久了' +
'<br> 总想搞点骚东西,这是即' +
'<br>写博客csdn:【lakernote】' +
'<br>搞公众号【Java大厂面试官】的又一个尝试' +
'<br>拒绝白嫖,从我做起<br>' +
'<br>来点个<a style="color: red">star</a>支持下作者吧' +
'</div>'
,
success: function (layero) {
const btn = layero.find('.layui-layer-btn');
btn.find('.layui-layer-btn0').attr({
href: 'https://gitee.com/lakernote/easy-admin'
, target: '_blank'
});
}
});
}
}
});
// 初始化配置,同一样式只需要配置一次,非必须初始化,有默认配置
notice.options = {
closeButton: true,//显示关闭按钮
debug: false,//启用debug
positionClass: "toast-top-right",//弹出的位置,
showDuration: "1000",//显示的时间
hideDuration: "1000",//消失的时间
timeOut: "10000",//停留的时间
extendedTimeOut: "1000",//控制时间
showEasing: "swing",//显示时的动画缓冲方式
hideEasing: "linear",//消失时的动画缓冲方式
iconClass: 'toast-info', // 自定义图标,有内置,如不需要则传空 支持layui内置图标/自定义iconfont类名
onclick: null, // 点击关闭回调
};
var url = easyAdmin.GetAdminServerUrl() + '/chatroom?' + easyAdmin.GetTokenQueryString();
var sock = new SockJS(url); //创建SockJS连接。
var stomp = Stomp.over(sock);//创建STOMP客户端实例。实际上封装了SockJS,这样就能在WebSocket连接上发送STOMP消息。
stomp.connect({}, function (frame) {
stomp.subscribe('/topic/status', function (message) {
notice.info(JSON.parse(message.body).content);
});
}, function (frame) {
notice.error(frame);
});
})
</script>
</body>
</html>