feat: 飞书单点登录和通知功能

This commit is contained in:
2026-02-03 11:38:16 +08:00
parent c657fbe01a
commit 78ebc67e2a
18 changed files with 2136 additions and 105 deletions

View File

@@ -107,10 +107,14 @@
</head>
<body class="min-h-screen bg-slate-50 text-slate-900">
<div class="flex">
<div class="flex relative">
<!-- 移动端遮罩 -->
<div id="sidebar-overlay" onclick="toggleSidebar()"
class="fixed inset-0 bg-gray-900/50 z-20 hidden transition-opacity opacity-0"></div>
<!-- 侧边栏 -->
<div
class="w-64 bg-slate-900 text-slate-300 flex flex-col h-screen fixed left-0 top-0 border-r border-slate-800">
<div id="sidebar"
class="w-64 bg-slate-900 text-slate-300 flex flex-col h-screen fixed left-0 top-0 border-r border-slate-800 z-30 transform -translate-x-full md:translate-x-0 transition-transform duration-300 ease-in-out">
<div class="h-16 flex items-center px-6 border-b border-slate-800 bg-slate-950">
<svg class="w-6 h-6 text-indigo-500 mr-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
@@ -147,6 +151,24 @@
</svg>
映射配置
</button>
<button onclick="switchTab('lark')" id="tab-lark"
class="tab-btn w-full flex items-center px-3 py-2.5 text-sm font-medium rounded-md transition-colors duration-150 group">
<svg class="w-4 h-4 mr-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9">
</path>
</svg>
飞书提醒
</button>
<button onclick="switchTab('guide')" id="tab-guide"
class="tab-btn w-full flex items-center px-3 py-2.5 text-sm font-medium rounded-md transition-colors duration-150 group">
<svg class="w-4 h-4 mr-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253">
</path>
</svg>
使用指南
</button>
<button onclick="switchTab('settings')" id="tab-settings"
class="tab-btn w-full flex items-center px-3 py-2.5 text-sm font-medium rounded-md transition-colors duration-150 group">
<svg class="w-4 h-4 mr-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -158,15 +180,6 @@
</svg>
系统设置
</button>
<button onclick="switchTab('guide')" id="tab-guide"
class="tab-btn w-full flex items-center px-3 py-2.5 text-sm font-medium rounded-md transition-colors duration-150 group">
<svg class="w-4 h-4 mr-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253">
</path>
</svg>
使用指南
</button>
</nav>
<div class="p-4 border-t border-slate-800">
@@ -178,15 +191,28 @@
</div>
<!-- 主内容区 -->
<main class="flex-1 ml-64 p-8 overflow-y-auto">
<main class="flex-1 ml-0 md:ml-64 p-4 md:p-8 overflow-y-auto w-full">
<!-- 移动端顶部导航 -->
<div class="md:hidden flex items-center justify-between mb-6">
<button onclick="toggleSidebar()" class="p-2 -ml-2 text-slate-600 hover:bg-slate-100 rounded-md">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M4 6h16M4 12h16M4 18h16"></path>
</svg>
</button>
<span class="font-bold text-slate-900">TaskBot控制台</span>
<div class="w-8"></div> <!-- 占位保持居中 -->
</div>
<!-- Dashboard 标签页 -->
<div id="content-dashboard" class="tab-content">
<header class="mb-8 flex justify-between items-end">
<header class="mb-6 md:mb-8 flex flex-col md:flex-row md:justify-between md:items-end gap-4">
<div>
<h1 class="text-2xl font-bold text-slate-900 tracking-tight">运维概览</h1>
<p class="text-sm text-slate-500 mt-1">Jira-Gitea双向同步机器人控制中心</p>
<h1 class="text-xl md:text-2xl font-bold text-slate-900 tracking-tight hidden md:block">运维概览
</h1>
<p class="text-sm text-slate-500 mt-1 hidden md:block">Jira-Gitea双向同步机器人控制中心</p>
</div>
<div class="flex items-center space-x-2">
<div class="flex items-center space-x-2 self-end md:self-auto">
<span class="w-2 h-2 rounded-full bg-emerald-500"></span>
<span class="text-sm font-medium text-slate-600" id="uptime">加载中...</span>
</div>
@@ -261,9 +287,9 @@
</span>
</div>
<div class="grid grid-cols-3 gap-3">
<div class="grid grid-cols-1 md:grid-cols-3 gap-3">
<button onclick="controlBot('restart')"
class="flex items-center justify-center px-4 py-2 border border-slate-300 text-sm font-medium rounded-md text-slate-700 bg-white hover:bg-slate-50 transition-colors">
class="flex items-center justify-center px-4 py-3 md:py-2 border border-slate-300 text-sm font-medium rounded-md text-slate-700 bg-white hover:bg-slate-50 transition-colors">
<svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15">
@@ -272,7 +298,7 @@
重启服务
</button>
<button onclick="clearLogs()"
class="flex items-center justify-center px-4 py-2 border border-slate-300 text-sm font-medium rounded-md text-slate-700 bg-white hover:bg-slate-50 transition-colors">
class="flex items-center justify-center px-4 py-3 md:py-2 border border-slate-300 text-sm font-medium rounded-md text-slate-700 bg-white hover:bg-slate-50 transition-colors">
<svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16">
@@ -281,7 +307,7 @@
清空日志
</button>
<button onclick="refreshStatus()"
class="flex items-center justify-center px-4 py-2 border border-slate-300 text-sm font-medium rounded-md text-slate-700 bg-white hover:bg-slate-50 transition-colors">
class="flex items-center justify-center px-4 py-3 md:py-2 border border-slate-300 text-sm font-medium rounded-md text-slate-700 bg-white hover:bg-slate-50 transition-colors">
<svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15">
@@ -414,11 +440,50 @@
</div>
</div>
</div>
<!-- 飞书提醒标签页 -->
<div id="content-lark" class="tab-content hidden">
<iframe src="/editor/larkReminder.html" class="w-full border-0 rounded-lg shadow-sm bg-white"
style="height: calc(100vh - 100px);"></iframe>
</div>
</main>
</div>
<script src="/editor/dashboard-app.js"></script>
<script>
// 侧边栏切换逻辑
function toggleSidebar() {
const sidebar = document.getElementById('sidebar');
const overlay = document.getElementById('sidebar-overlay');
const isClosed = sidebar.classList.contains('-translate-x-full');
if (isClosed) {
// 打开
sidebar.classList.remove('-translate-x-full');
overlay.classList.remove('hidden');
setTimeout(() => overlay.classList.remove('opacity-0'), 10);
} else {
// 关闭
sidebar.classList.add('-translate-x-full');
overlay.classList.add('opacity-0');
setTimeout(() => overlay.classList.add('hidden'), 300);
}
}
// 覆盖原始 switchTab 以在移动端自动关闭侧边栏
const originalSwitchTab = window.switchTab;
window.switchTab = function (tabId) {
if (originalSwitchTab) originalSwitchTab(tabId);
// 如果是移动端(屏幕宽度小于 768px点击后关闭侧边栏
if (window.innerWidth < 768) {
const sidebar = document.getElementById('sidebar');
if (!sidebar.classList.contains('-translate-x-full')) {
toggleSidebar();
}
}
};
//页面加载完成后初始化
document.addEventListener('DOMContentLoaded', () => {
//默认显示运维概览