更新 announcement.html

This commit is contained in:
lantern 2025-04-29 02:59:12 +08:00
parent 2875a58d6d
commit b72dcf3750
1 changed files with 85 additions and 57 deletions

View File

@ -4,50 +4,78 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>系统公告</title> <title>系统公告</title>
<link href="https://cdn.bootcdn.net/ajax/libs/ant-design/4.24.8/antd.min.css" rel="stylesheet"> <script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/moment.js/2.29.1/moment.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/ant-design/4.24.8/antd.min.js"></script>
</head> </head>
<body> <body class="bg-gray-100">
<div id="app"> <main class="container mx-auto px-4 py-8">
<a-layout> <h1 class="text-3xl font-bold text-gray-800 mb-6"
<a-layout-header style="background: #fff; padding: 0 24px"> aria-label="系统最新公告">
<a-page-header 📢 系统公告
title="📢 系统公告" </h1>
style="padding:0"
aria-label="系统最新公告">
</a-page-header>
</a-layout-header>
<a-layout-content style="padding: 24px; background: #f0f2f5"> <div class="bg-white rounded-lg shadow-md p-6">
<a-list item-layout="horizontal" :grid="{ gutter: 16, column: 1 }"> <ul class="space-y-4">
<a-list-item> <li class="border-l-4 border-blue-500 pl-4">
<a-card :bordered="false"> <h2 class="text-xl font-semibold text-gray-700 mb-2">
<a-list-item-meta 系统维护通知
title="系统维护通知" </h2>
description="将于2024年6月15日 00:00-04:00进行系统维护期间服务可能中断。" <p class="text-gray-600 mb-2">
class="announcement-item" 将于2024年6月15日 00:00-04:00进行系统维护期间服务可能中断。
tabindex="0" </p>
@click="handleItemClick" <time class="text-sm text-gray-500" datetime="2024-06-14">
@keydown.enter="handleItemClick"> 2024年6月14日
<template #extra> </time>
<span class="ant-typography"> </li>
<time datetime="2024-06-14">2024年6月14日</time> <li class="border-l-4 border-green-500 pl-4">
</span> <h2 class="text-xl font-semibold text-gray-700 mb-2">
</template> 版本更新公告
</a-list-item-meta> </h2>
</a-card> <p class="text-gray-600 mb-2">
</a-list-item> 新版本v2.1.0已发布,优化了系统性能并修复了已知问题。
</a-list> </p>
</a-layout-content> <time class="text-sm text-gray-500" datetime="2024-06-12">
</a-layout> 2024年6月12日
</div> </time>
</li>
<li class="border-l-4 border-yellow-500 pl-4">
<h2 class="text-xl font-semibold text-gray-700 mb-2">
服务器命名规范
</h2>
<p class="text-gray-600 mb-2">
LP名称需使用服务器缩写例如BW服务器应命名为bw
</p>
<time class="text-sm text-gray-500" datetime="2024-06-10">
2024年6月10日
</time>
</li>
<li class="border-l-4 border-purple-500 pl-4">
<h2 class="text-xl font-semibold text-gray-700 mb-2">
OP指令管理
</h2>
<p class="text-gray-600 mb-2">
LP需配置无OP权限指令确保操作权限分离
</p>
<time class="text-sm text-gray-500" datetime="2024-06-08">
2024年6月8日
</time>
</li>
<li class="border-l-4 border-red-500 pl-4">
<h2 class="text-xl font-semibold text-gray-700 mb-2">
数据库安全
</h2>
<p class="text-gray-600 mb-2">
MySQL数据库禁止开启外网访问仅允许内网连接
</p>
<time class="text-sm text-gray-500" datetime="2024-06-05">
2024年6月5日
</time>
</li>
</ul>
</div>
</main>
<!-- 无障碍键盘导航 -->
<script> <script>
const handleItemClick = () => {
// 处理公告项点击事件
};
document.addEventListener('keydown', (event) => { document.addEventListener('keydown', (event) => {
if (event.key === 'Enter') { if (event.key === 'Enter') {
event.target.click?.(); event.target.click?.();