P0安全: SECRET_KEY/ADMIN_PASSWORD/CORS环境变量化, seed仅admin P1Mock: mock.ts 301->88行, 删8数据mock+5generateMock, net-1300行 P2组件: useToast/useFetchList+ConfirmDialog/FormDialog P3菜单: menuSections/menuItems->constants/menu.ts P4API: NotificationsPage/WorkflowPage重写+RolesPage演示 测试: 1050passed, tsc clean
57 lines
2.0 KiB
TypeScript
57 lines
2.0 KiB
TypeScript
import { useState } from 'react';
|
|
import PlatformConfigPage from './PlatformConfigPage';
|
|
import AuditRulesPage from './AuditRulesPage';
|
|
import AnnouncementPage from './AnnouncementPage';
|
|
import NotificationPage from './NotificationPage';
|
|
import LdapConfigPage from './LdapConfigPage';
|
|
|
|
const tabs = [
|
|
{ id: 'platform', label: '平台配置', icon: '⚙️' },
|
|
{ id: 'rules', label: '审核规则', icon: '🛡️' },
|
|
{ id: 'announcement', label: '公告管理', icon: '📢' },
|
|
{ id: 'notification', label: '消息推送', icon: '🔔' },
|
|
{ id: 'ldap', label: 'LDAP', icon: '🔐' },
|
|
] as const;
|
|
|
|
type TabId = typeof tabs[number]['id'];
|
|
|
|
export default function SettingsPage() {
|
|
const [activeTab, setActiveTab] = useState<TabId>('platform');
|
|
|
|
return (
|
|
<div className="space-y-5">
|
|
<div>
|
|
<h1 className="text-xl font-semibold">系统设置</h1>
|
|
<p className="text-sm text-[var(--dg-text-muted)] mt-1">管理平台配置、审核规则、消息推送和 LDAP 认证</p>
|
|
</div>
|
|
|
|
{/* Tab 导航 */}
|
|
<div className="flex gap-1 p-1 bg-[var(--dg-bg-tertiary)] rounded-xl w-fit">
|
|
{tabs.map(tab => (
|
|
<button
|
|
key={tab.id}
|
|
onClick={() => setActiveTab(tab.id)}
|
|
className={`flex items-center gap-2 px-4 py-2 rounded-lg text-sm font-medium transition-all ${
|
|
activeTab === tab.id
|
|
? 'bg-[var(--dg-bg-primary)] text-[var(--dg-text-primary)] shadow-sm'
|
|
: 'text-[var(--dg-text-muted)] hover:text-[var(--dg-text-secondary)]'
|
|
}`}
|
|
>
|
|
<span>{tab.icon}</span>
|
|
{tab.label}
|
|
</button>
|
|
))}
|
|
</div>
|
|
|
|
{/* 内容区 */}
|
|
<div>
|
|
{activeTab === 'platform' && <PlatformConfigPage />}
|
|
{activeTab === 'rules' && <AuditRulesPage />}
|
|
{activeTab === 'announcement' && <AnnouncementPage />}
|
|
{activeTab === 'notification' && <NotificationPage />}
|
|
{activeTab === 'ldap' && <LdapConfigPage />}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|