更新 announcement.html
This commit is contained in:
parent
2875a58d6d
commit
b72dcf3750
|
@ -4,50 +4,78 @@
|
|||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>系统公告</title>
|
||||
<link href="https://cdn.bootcdn.net/ajax/libs/ant-design/4.24.8/antd.min.css" rel="stylesheet">
|
||||
<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>
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app">
|
||||
<a-layout>
|
||||
<a-layout-header style="background: #fff; padding: 0 24px">
|
||||
<a-page-header
|
||||
title="📢 系统公告"
|
||||
style="padding:0"
|
||||
<body class="bg-gray-100">
|
||||
<main class="container mx-auto px-4 py-8">
|
||||
<h1 class="text-3xl font-bold text-gray-800 mb-6"
|
||||
aria-label="系统最新公告">
|
||||
</a-page-header>
|
||||
</a-layout-header>
|
||||
📢 系统公告
|
||||
</h1>
|
||||
|
||||
<a-layout-content style="padding: 24px; background: #f0f2f5">
|
||||
<a-list item-layout="horizontal" :grid="{ gutter: 16, column: 1 }">
|
||||
<a-list-item>
|
||||
<a-card :bordered="false">
|
||||
<a-list-item-meta
|
||||
title="系统维护通知"
|
||||
description="将于2024年6月15日 00:00-04:00进行系统维护,期间服务可能中断。"
|
||||
class="announcement-item"
|
||||
tabindex="0"
|
||||
@click="handleItemClick"
|
||||
@keydown.enter="handleItemClick">
|
||||
<template #extra>
|
||||
<span class="ant-typography">
|
||||
<time datetime="2024-06-14">2024年6月14日</time>
|
||||
</span>
|
||||
</template>
|
||||
</a-list-item-meta>
|
||||
</a-card>
|
||||
</a-list-item>
|
||||
</a-list>
|
||||
</a-layout-content>
|
||||
</a-layout>
|
||||
<div class="bg-white rounded-lg shadow-md p-6">
|
||||
<ul class="space-y-4">
|
||||
<li class="border-l-4 border-blue-500 pl-4">
|
||||
<h2 class="text-xl font-semibold text-gray-700 mb-2">
|
||||
系统维护通知
|
||||
</h2>
|
||||
<p class="text-gray-600 mb-2">
|
||||
将于2024年6月15日 00:00-04:00进行系统维护,期间服务可能中断。
|
||||
</p>
|
||||
<time class="text-sm text-gray-500" datetime="2024-06-14">
|
||||
2024年6月14日
|
||||
</time>
|
||||
</li>
|
||||
<li class="border-l-4 border-green-500 pl-4">
|
||||
<h2 class="text-xl font-semibold text-gray-700 mb-2">
|
||||
版本更新公告
|
||||
</h2>
|
||||
<p class="text-gray-600 mb-2">
|
||||
新版本v2.1.0已发布,优化了系统性能并修复了已知问题。
|
||||
</p>
|
||||
<time class="text-sm text-gray-500" datetime="2024-06-12">
|
||||
2024年6月12日
|
||||
</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>
|
||||
const handleItemClick = () => {
|
||||
// 处理公告项点击事件
|
||||
};
|
||||
|
||||
document.addEventListener('keydown', (event) => {
|
||||
if (event.key === 'Enter') {
|
||||
event.target.click?.();
|
||||
|
|
Loading…
Reference in New Issue