{readinessItems.map((item) => (
@@ -43,7 +43,7 @@ export function DashboardOverview() {
+ );
+ }
+
+ if (activeTab === 'system') {
+ return (
+
-
+
(`/file/?p=${page}`);
+}
+
+export function searchFiles(keyword: string) {
+ return apiRequest(`/file/search?keyword=${encodeURIComponent(keyword)}`);
+}
+
+export function deleteFile(id: number) {
+ return apiRequest(`/file/${id}`, {
+ method: 'DELETE',
+ });
+}
+
+export function buildFileDownloadUrl(link: string) {
+ return `/upload/${link}`;
+}
+
+export function buildFileAbsoluteUrl(link: string) {
+ if (typeof window === 'undefined') {
+ return buildFileDownloadUrl(link);
+ }
+
+ return new URL(buildFileDownloadUrl(link), window.location.origin).toString();
+}
+
+export async function uploadFiles(files: File[], description?: string) {
+ const formData = new FormData();
+
+ files.forEach((file) => {
+ formData.append('file', file);
+ });
+
+ if (description) {
+ formData.append('description', description);
+ }
+
+ const response = await fetch(getApiUrl('/file/'), {
+ method: 'POST',
+ credentials: 'include',
+ body: formData,
+ });
+
+ const payload = (await response.json()) as {
+ success: boolean;
+ message: string;
+ };
+
+ if (!response.ok || !payload.success) {
+ throw new Error(payload.message || `上传失败（${response.status}）`);
+ }
+}
diff --git a/atsf_server/web/features/files/components/files-page.tsx b/atsf_server/web/features/files/components/files-page.tsx
new file mode 100644
index 00000000..e1abed4b
--- /dev/null
+++ b/atsf_server/web/features/files/components/files-page.tsx
@@ -0,0 +1,374 @@
+'use client';
+
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
+import { useMemo, useState } from 'react';
+
+import { EmptyState } from '@/components/feedback/empty-state';
+import { ErrorState } from '@/components/feedback/error-state';
+import { InlineMessage } from '@/components/feedback/inline-message';
+import { LoadingState } from '@/components/feedback/loading-state';
+import { useAuth } from '@/components/providers/auth-provider';
+import { PageHeader } from '@/components/layout/page-header';
+import { AppCard } from '@/components/ui/app-card';
+import {
+ buildFileAbsoluteUrl,
+ buildFileDownloadUrl,
+ deleteFile,
+ getFiles,
+ searchFiles,
+ uploadFiles,
+} from '@/features/files/api/files';
+import type { FileItem } from '@/features/files/types';
+import {
+ DangerButton,
+ PrimaryButton,
+ ResourceField,
+ ResourceInput,
+ SecondaryButton,
+} from '@/features/shared/components/resource-primitives';
+import { formatDateTime, formatRelativeTime } from '@/lib/utils/date';
+
+const ITEMS_PER_PAGE = 10;
+const filesQueryKey = ['files', 'list'] as const;
+
+type FeedbackState = {
+ tone: 'info' | 'success' | 'danger';
+ message: string;
+};
+
+function getErrorMessage(error: unknown) {
+ return error instanceof Error ? error.message : '请求失败，请稍后重试。';
+}
+
+async function copyToClipboard(value: string) {
+ await navigator.clipboard.writeText(value);
+}
+
+export function FilesPage() {
+ const queryClient = useQueryClient();
+ const { user } = useAuth();
+ const [page, setPage] = useState(0);
+ const [searchInput, setSearchInput] = useState('');
+ const [searchKeyword, setSearchKeyword] = useState('');
+ const [description, setDescription] = useState('');
+ const [selectedFiles, setSelectedFiles] = useState([]);
+ const [feedback, setFeedback] = useState(null);
+
+ const isAdmin = (user?.role ?? 0) >= 10;
+
+ const filesPageQuery = useQuery({
+ queryKey: [...filesQueryKey, page],
+ queryFn: () => getFiles(page),
+ enabled: isAdmin && searchKeyword.length === 0,
+ });
+
+ const filesSearchQuery = useQuery({
+ queryKey: [...filesQueryKey, 'search', searchKeyword],
+ queryFn: () => searchFiles(searchKeyword),
+ enabled: isAdmin && searchKeyword.length > 0,
+ });
+
+ const uploadMutation = useMutation({
+ mutationFn: async () => uploadFiles(selectedFiles, description.trim()),
+ onSuccess: async () => {
+ setFeedback({ tone: 'success', message: `已上传 ${selectedFiles.length} 个文件。` });
+ setSelectedFiles([]);
+ setDescription('');
+ await queryClient.invalidateQueries({ queryKey: filesQueryKey });
+ },
+ onError: (error) => {
+ setFeedback({ tone: 'danger', message: getErrorMessage(error) });
+ },
+ });
+
+ const deleteMutation = useMutation({
+ mutationFn: deleteFile,
+ onSuccess: async () => {
+ setFeedback({ tone: 'success', message: '文件已删除。' });
+ await queryClient.invalidateQueries({ queryKey: filesQueryKey });
+ },
+ onError: (error) => {
+ setFeedback({ tone: 'danger', message: getErrorMessage(error) });
+ },
+ });
+
+ const activeQuery = searchKeyword.length > 0 ? filesSearchQuery : filesPageQuery;
+ const files = activeQuery.data ?? [];
+
+ const summary = useMemo(() => {
+ return [
+ { label: searchKeyword ? '搜索结果' : '当前页文件', value: files.length },
+ { label: '当前上传批次', value: selectedFiles.length },
+ {
+ label: '下载总次数',
+ value: files.reduce((total, item) => total + (item.download_counter || 0), 0),
+ },
+ {
+ label: '上传者数',
+ value: new Set(files.map((item) => item.uploader_id)).size,
+ },
+ ];
+ }, [files, searchKeyword, selectedFiles.length]);
+
+ const handleUpload = () => {
+ if (selectedFiles.length === 0) {
+ setFeedback({ tone: 'info', message: '请先选择要上传的文件。' });
+ return;
+ }
+
+ setFeedback(null);
+ uploadMutation.mutate();
+ };
+
+ const handleDelete = (file: FileItem) => {
+ if (!window.confirm(`确认删除文件“${file.filename}”吗？`)) {
+ return;
+ }
+
+ setFeedback(null);
+ deleteMutation.mutate(file.id);
+ };
+
+ const handleCopy = async (link: string) => {
+ try {
+ await copyToClipboard(buildFileAbsoluteUrl(link));
+ setFeedback({ tone: 'success', message: '文件链接已复制到剪贴板。' });
+ } catch (error) {
+ setFeedback({ tone: 'danger', message: getErrorMessage(error) });
+ }
+ };
+
+ const handleSearchSubmit = () => {
+ setFeedback(null);
+ setPage(0);
+ setSearchKeyword(searchInput.trim());
+ };
+
+ const handleResetSearch = () => {
+ setSearchInput('');
+ setSearchKeyword('');
+ setPage(0);
+ setFeedback(null);
+ };
+
+ if (!isAdmin) {
+ return (
+ ('/option/');
+}
+
+export function updateOption(key: string, value: string) {
+ return apiRequest('/option/', {
+ method: 'PUT',
+ body: JSON.stringify({ key, value }),
+ });
+}
+
+export function getBootstrapToken() {
+ return apiRequest('/nodes/bootstrap-token');
+}
+
+export function rotateBootstrapToken() {
+ return apiRequest('/nodes/bootstrap-token/rotate', {
+ method: 'POST',
+ });
+}
+
+export function getLatestRelease() {
+ return apiRequest('/update/latest-release');
+}
+
+export function getSettingsProfile() {
+ return apiRequest('/user/self');
+}
+
+export function updateSelf(payload: UpdateSelfPayload) {
+ return apiRequest('/user/self', {
+ method: 'PUT',
+ body: JSON.stringify(payload),
+ });
+}
+
+export function generateAccessToken() {
+ return apiRequest('/user/token');
+}
+
+export function bindWeChat(code: string) {
+ return apiRequest(`/oauth/wechat/bind?code=${encodeURIComponent(code)}`);
+}
+
+export function bindEmail(email: string, code: string) {
+ const searchParams = new URLSearchParams({ email, code });
+ return apiRequest(`/oauth/email/bind?${searchParams.toString()}`);
+}
+
+export function getAboutContent() {
+ return apiRequest('/about');
+}
diff --git a/atsf_server/web/features/settings/components/settings-page.tsx b/atsf_server/web/features/settings/components/settings-page.tsx
new file mode 100644
index 00000000..9f0b3f26
--- /dev/null
+++ b/atsf_server/web/features/settings/components/settings-page.tsx
@@ -0,0 +1,1224 @@
+'use client';
+
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
+import { marked } from 'marked';
+import { useEffect, useMemo, useState } from 'react';
+
+import { EmptyState } from '@/components/feedback/empty-state';
+import { ErrorState } from '@/components/feedback/error-state';
+import { InlineMessage } from '@/components/feedback/inline-message';
+import { LoadingState } from '@/components/feedback/loading-state';
+import { useAuth } from '@/components/providers/auth-provider';
+import { PageHeader } from '@/components/layout/page-header';
+import { AppCard } from '@/components/ui/app-card';
+import { StatusBadge } from '@/components/ui/status-badge';
+import { sendEmailVerification } from '@/features/auth/api/auth';
+import { getPublicStatus } from '@/features/auth/api/public';
+import {
+ bindEmail,
+ bindWeChat,
+ generateAccessToken,
+ getBootstrapToken,
+ getLatestRelease,
+ getOptions,
+ getSettingsProfile,
+ rotateBootstrapToken,
+ updateOption,
+ updateSelf,
+} from '@/features/settings/api/settings';
+import type {
+ LatestReleaseInfo,
+ OptionItem,
+ UpdateSelfPayload,
+} from '@/features/settings/types';
+import {
+ CodeBlock,
+ PrimaryButton,
+ ResourceField,
+ ResourceInput,
+ ResourceTextarea,
+ SecondaryButton,
+ ToggleField,
+} from '@/features/shared/components/resource-primitives';
+import { publicEnv } from '@/lib/env/public-env';
+import { formatDateTime, formatRelativeTime } from '@/lib/utils/date';
+
+const installerScriptUrl = 'https://raw.githubusercontent.com/Rain-kl/ATSFlare/main/scripts/install-agent.sh';
+const settingsQueryKey = ['settings', 'options'] as const;
+
+const defaultSystemFields = {
+ ServerAddress: '',
+ PasswordLoginEnabled: true,
+ PasswordRegisterEnabled: true,
+ EmailVerificationEnabled: false,
+ GitHubOAuthEnabled: false,
+ WeChatAuthEnabled: false,
+ TurnstileCheckEnabled: false,
+ RegisterEnabled: true,
+ SMTPServer: '',
+ SMTPPort: '587',
+ SMTPAccount: '',
+ SMTPToken: '',
+ GitHubClientId: '',
+ GitHubClientSecret: '',
+ WeChatServerAddress: '',
+ WeChatServerToken: '',
+ WeChatAccountQRCodeImageURL: '',
+ TurnstileSiteKey: '',
+ TurnstileSecretKey: '',
+};
+
+const defaultOperationFields = {
+ AgentHeartbeatInterval: '30000',
+ AgentSyncInterval: '30000',
+ NodeOfflineThreshold: '120000',
+ AgentUpdateRepo: 'Rain-kl/ATSFlare',
+ ServerAddress: '',
+};
+
+const defaultOtherFields = {
+ Notice: '',
+ SystemName: '',
+ HomePageLink: '',
+ About: '',
+ Footer: '',
+};
+
+const defaultProfileFields: UpdateSelfPayload = {
+ username: '',
+ display_name: '',
+ password: '',
+};
+
+type FeedbackState = {
+ tone: 'info' | 'success' | 'danger';
+ message: string;
+};
+
+type SettingsTab = 'personal' | 'operation' | 'system' | 'other';
+
+function getErrorMessage(error: unknown) {
+ return error instanceof Error ? error.message : '请求失败，请稍后重试。';
+}
+
+function optionsToMap(options: OptionItem[] | undefined) {
+ return (options ?? []).reduce>((accumulator, option) => {
+ accumulator[option.key] = option.value;
+ return accumulator;
+ }, {});
+}
+
+function toBoolean(value: string | undefined, fallback: boolean) {
+ if (value === undefined) {
+ return fallback;
+ }
+
+ return value === 'true';
+}
+
+function normalizeServerUrl(value: string) {
+ return value.trim().replace(/\/+$/, '');
+}
+
+function formatDurationLabel(value: string) {
+ const milliseconds = Number.parseInt(value, 10);
+ if (Number.isNaN(milliseconds)) {
+ return value;
+ }
+
+ if (milliseconds >= 60000) {
+ return `${milliseconds / 60000} 分钟`;
+ }
+
+ return `${milliseconds / 1000} 秒`;
+}
+
+function buildDiscoveryCommand(serverUrl: string, discoveryToken: string) {
+ return [
+ `curl -fsSL ${installerScriptUrl} | bash -s -- \\`,
+ ` --server-url ${normalizeServerUrl(serverUrl)} \\`,
+ ` --discovery-token ${discoveryToken}`,
+ ].join('\n');
+}
+
+async function copyToClipboard(value: string) {
+ await navigator.clipboard.writeText(value);
+}
+
+export function SettingsPage() {
+ const queryClient = useQueryClient();
+ const { refreshUser, user } = useAuth();
+ const [activeTab, setActiveTab] = useState('personal');
+ const [feedback, setFeedback] = useState(null);
+ const [busyKey, setBusyKey] = useState(null);
+ const [profileFields, setProfileFields] = useState(defaultProfileFields);
+ const [systemFields, setSystemFields] = useState(defaultSystemFields);
+ const [operationFields, setOperationFields] = useState(defaultOperationFields);
+ const [otherFields, setOtherFields] = useState(defaultOtherFields);
+ const [accessToken, setAccessToken] = useState('');
+ const [wechatCode, setWeChatCode] = useState('');
+ const [emailAddress, setEmailAddress] = useState('');
+ const [emailCode, setEmailCode] = useState('');
+ const [latestRelease, setLatestRelease] = useState(null);
+
+ const isRoot = (user?.role ?? 0) >= 100;
+
+ const publicStatusQuery = useQuery({
+ queryKey: ['public-status'],
+ queryFn: getPublicStatus,
+ });
+
+ const profileQuery = useQuery({
+ queryKey: ['settings', 'profile'],
+ queryFn: getSettingsProfile,
+ });
+
+ const optionsQuery = useQuery({
+ queryKey: settingsQueryKey,
+ queryFn: getOptions,
+ enabled: isRoot,
+ });
+
+ const bootstrapQuery = useQuery({
+ queryKey: ['settings', 'bootstrap-token'],
+ queryFn: getBootstrapToken,
+ enabled: isRoot,
+ });
+
+ useEffect(() => {
+ if (profileQuery.data) {
+ setProfileFields({
+ username: profileQuery.data.username,
+ display_name: profileQuery.data.display_name || '',
+ password: '',
+ });
+ setEmailAddress(profileQuery.data.email || '');
+ }
+ }, [profileQuery.data]);
+
+ useEffect(() => {
+ const publicStatus = publicStatusQuery.data;
+ if (!publicStatus) {
+ return;
+ }
+
+ setSystemFields((previous) => ({
+ ...previous,
+ ServerAddress: publicStatus.server_address || previous.ServerAddress,
+ GitHubClientId: publicStatus.github_client_id || previous.GitHubClientId,
+ WeChatAccountQRCodeImageURL: publicStatus.wechat_qrcode || previous.WeChatAccountQRCodeImageURL,
+ TurnstileSiteKey: publicStatus.turnstile_site_key || previous.TurnstileSiteKey,
+ }));
+ setOtherFields((previous) => ({
+ ...previous,
+ SystemName: publicStatus.system_name || previous.SystemName,
+ HomePageLink: publicStatus.home_page_link || previous.HomePageLink,
+ Footer: publicStatus.footer_html || previous.Footer,
+ }));
+ setOperationFields((previous) => ({
+ ...previous,
+ ServerAddress: publicStatus.server_address || previous.ServerAddress,
+ }));
+ }, [publicStatusQuery.data]);
+
+ useEffect(() => {
+ if (!optionsQuery.data) {
+ return;
+ }
+
+ const optionMap = optionsToMap(optionsQuery.data);
+
+ setSystemFields({
+ ServerAddress: optionMap.ServerAddress ?? '',
+ PasswordLoginEnabled: toBoolean(optionMap.PasswordLoginEnabled, true),
+ PasswordRegisterEnabled: toBoolean(optionMap.PasswordRegisterEnabled, true),
+ EmailVerificationEnabled: toBoolean(optionMap.EmailVerificationEnabled, false),
+ GitHubOAuthEnabled: toBoolean(optionMap.GitHubOAuthEnabled, false),
+ WeChatAuthEnabled: toBoolean(optionMap.WeChatAuthEnabled, false),
+ TurnstileCheckEnabled: toBoolean(optionMap.TurnstileCheckEnabled, false),
+ RegisterEnabled: toBoolean(optionMap.RegisterEnabled, true),
+ SMTPServer: optionMap.SMTPServer ?? '',
+ SMTPPort: optionMap.SMTPPort ?? '587',
+ SMTPAccount: optionMap.SMTPAccount ?? '',
+ SMTPToken: '',
+ GitHubClientId: optionMap.GitHubClientId ?? '',
+ GitHubClientSecret: '',
+ WeChatServerAddress: optionMap.WeChatServerAddress ?? '',
+ WeChatServerToken: '',
+ WeChatAccountQRCodeImageURL: optionMap.WeChatAccountQRCodeImageURL ?? '',
+ TurnstileSiteKey: optionMap.TurnstileSiteKey ?? '',
+ TurnstileSecretKey: '',
+ });
+
+ setOperationFields({
+ AgentHeartbeatInterval: optionMap.AgentHeartbeatInterval ?? '30000',
+ AgentSyncInterval: optionMap.AgentSyncInterval ?? '30000',
+ NodeOfflineThreshold: optionMap.NodeOfflineThreshold ?? '120000',
+ AgentUpdateRepo: optionMap.AgentUpdateRepo ?? 'Rain-kl/ATSFlare',
+ ServerAddress: optionMap.ServerAddress ?? publicStatusQuery.data?.server_address ?? '',
+ });
+
+ setOtherFields({
+ Notice: optionMap.Notice ?? '',
+ SystemName: optionMap.SystemName ?? '',
+ HomePageLink: optionMap.HomePageLink ?? '',
+ About: optionMap.About ?? '',
+ Footer: optionMap.Footer ?? '',
+ });
+ }, [optionsQuery.data, publicStatusQuery.data?.server_address]);
+
+ const rotateTokenMutation = useMutation({
+ mutationFn: rotateBootstrapToken,
+ onSuccess: async (data) => {
+ setFeedback({ tone: 'success', message: 'Discovery Token 已重新生成。' });
+ await queryClient.invalidateQueries({ queryKey: ['settings', 'bootstrap-token'] });
+ if (data.discovery_token) {
+ try {
+ await copyToClipboard(data.discovery_token);
+ } catch {
+ // ignore clipboard errors
+ }
+ }
+ },
+ onError: (error) => {
+ setFeedback({ tone: 'danger', message: getErrorMessage(error) });
+ },
+ });
+
+ const accessTokenMutation = useMutation({
+ mutationFn: generateAccessToken,
+ onSuccess: (token) => {
+ setAccessToken(token);
+ setFeedback({ tone: 'success', message: '访问令牌已重置，并已在当前页面展示。' });
+ },
+ onError: (error) => {
+ setFeedback({ tone: 'danger', message: getErrorMessage(error) });
+ },
+ });
+
+ const discoveryToken = bootstrapQuery.data?.discovery_token ?? '';
+ const discoveryCommand =
+ isRoot && operationFields.ServerAddress && discoveryToken
+ ? buildDiscoveryCommand(operationFields.ServerAddress, discoveryToken)
+ : '';
+
+ const tabs = useMemo(
+ () => [
+ { key: 'personal' as const, label: '个人设置', description: '更新个人资料、绑定账号与访问令牌。' },
+ ...(isRoot
+ ? [
+ { key: 'operation' as const, label: '运维设置', description: 'Agent 参数、Discovery Token 与部署命令。' },
+ { key: 'system' as const, label: '系统设置', description: '登录注册、SMTP、OAuth 与风控开关。' },
+ { key: 'other' as const, label: '其他设置', description: '公告、关于、品牌信息与版本检查。' },
+ ]
+ : []),
+ ],
+ [isRoot],
+ );
+
+ const runBusyAction = async (key: string, action: () => Promise) => {
+ setBusyKey(key);
+ setFeedback(null);
+
+ try {
+ await action();
+ } catch (error) {
+ setFeedback({ tone: 'danger', message: getErrorMessage(error) });
+ } finally {
+ setBusyKey(null);
+ }
+ };
+
+ const saveOptionEntries = async (entries: Array<[string, string]>, successMessage: string) => {
+ for (const [key, value] of entries) {
+ await updateOption(key, value);
+ }
+
+ await queryClient.invalidateQueries({ queryKey: settingsQueryKey });
+ await queryClient.invalidateQueries({ queryKey: ['public-status'] });
+ setFeedback({ tone: 'success', message: successMessage });
+ };
+
+ const handleProfileSave = () => {
+ void runBusyAction('profile', async () => {
+ await updateSelf({
+ username: profileFields.username.trim(),
+ display_name: profileFields.display_name.trim(),
+ password: profileFields.password,
+ });
+ await Promise.all([
+ queryClient.invalidateQueries({ queryKey: ['settings', 'profile'] }),
+ refreshUser(),
+ ]);
+ setProfileFields((previous) => ({ ...previous, password: '' }));
+ setFeedback({ tone: 'success', message: '个人资料已更新。' });
+ });
+ };
+
+ const handleEmailVerification = () => {
+ if (!emailAddress.trim()) {
+ setFeedback({ tone: 'danger', message: '请输入要绑定的邮箱地址。' });
+ return;
+ }
+
+ void runBusyAction('email-send', async () => {
+ await sendEmailVerification(emailAddress.trim());
+ setFeedback({ tone: 'success', message: '验证码已发送，请检查邮箱。' });
+ });
+ };
+
+ const handleBindEmail = () => {
+ if (!emailAddress.trim() || !emailCode.trim()) {
+ setFeedback({ tone: 'danger', message: '请输入邮箱地址和验证码。' });
+ return;
+ }
+
+ void runBusyAction('email-bind', async () => {
+ await bindEmail(emailAddress.trim(), emailCode.trim());
+ setEmailCode('');
+ await Promise.all([
+ queryClient.invalidateQueries({ queryKey: ['settings', 'profile'] }),
+ refreshUser(),
+ ]);
+ setFeedback({ tone: 'success', message: '邮箱已绑定。' });
+ });
+ };
+
+ const handleBindWeChat = () => {
+ if (!wechatCode.trim()) {
+ setFeedback({ tone: 'danger', message: '请输入微信验证码。' });
+ return;
+ }
+
+ void runBusyAction('wechat-bind', async () => {
+ await bindWeChat(wechatCode.trim());
+ setWeChatCode('');
+ await Promise.all([
+ queryClient.invalidateQueries({ queryKey: ['settings', 'profile'] }),
+ refreshUser(),
+ ]);
+ setFeedback({ tone: 'success', message: '微信账号已绑定。' });
+ });
+ };
+
+ const handleToggleOption = (key: keyof typeof systemFields, nextValue: boolean) => {
+ setSystemFields((previous) => ({ ...previous, [key]: nextValue }));
+
+ void runBusyAction(`toggle-${key}`, async () => {
+ await saveOptionEntries([[key, String(nextValue)]], '系统开关已更新。');
+ });
+ };
+
+ const handleCheckLatestRelease = () => {
+ void runBusyAction('latest-release', async () => {
+ const release = await getLatestRelease();
+ setLatestRelease(release);
+ setFeedback({ tone: 'success', message: `已获取最新版本信息：${release.tag_name}` });
+ });
+ };
+
+ const renderTabContent = () => {
+ if (profileQuery.isLoading || publicStatusQuery.isLoading) {
+ return
+
+
+
+
+
{dashboardNavigation.slice(1).map((item) => (
-
+
diff --git a/atsf_server/web/features/files/api/files.ts b/atsf_server/web/features/files/api/files.ts
new file mode 100644
index 00000000..11e9a1eb
--- /dev/null
+++ b/atsf_server/web/features/files/api/files.ts
@@ -0,0 +1,56 @@
+import { apiRequest, getApiUrl } from '@/lib/api/client';
+
+import type { FileItem } from '@/features/files/types';
+
+export function getFiles(page: number) {
+ return apiRequest-
-
- 1. 继续迁移节点、域名、证书与应用记录页面。 -
- 2. 为核心动作补齐确认、反馈与错误提示的一致体验。 -
- 3. 补充模块测试与静态构建回归验证。 +
- 1. 对照旧前端完成设置、用户、文件与关于页的联调回归。 +
- 2. 补齐关键页面的测试覆盖与构建验收。 +
- 3. 评估默认入口切换与旧前端回滚预案。
+
+ );
+ }
+
+ return (
+
+ void queryClient.invalidateQueries({ queryKey: filesQueryKey })}
+ >
+ 刷新
+
+ }
+ >
+
+
+ );
+}
diff --git a/atsf_server/web/features/files/types.ts b/atsf_server/web/features/files/types.ts
new file mode 100644
index 00000000..1fd5dbca
--- /dev/null
+++ b/atsf_server/web/features/files/types.ts
@@ -0,0 +1,10 @@
+export interface FileItem {
+ id: number;
+ filename: string;
+ description: string;
+ uploader: string;
+ uploader_id: number;
+ link: string;
+ upload_time: string;
+ download_counter: number;
+}
diff --git a/atsf_server/web/features/settings/api/settings.ts b/atsf_server/web/features/settings/api/settings.ts
new file mode 100644
index 00000000..e0d4e1b2
--- /dev/null
+++ b/atsf_server/web/features/settings/api/settings.ts
@@ -0,0 +1,62 @@
+import { apiRequest } from '@/lib/api/client';
+
+import type {
+ BootstrapTokenPayload,
+ LatestReleaseInfo,
+ OptionItem,
+ SettingsProfile,
+ UpdateSelfPayload,
+} from '@/features/settings/types';
+
+export function getOptions() {
+ return apiRequest
+
+
+
+
+ {uploadMutation.isPending ? '上传中...' : '开始上传'}
+
+ }
+ >
+
+
+
+
+ {summary.map((item) => (
+
+
+
+ ))}
+ + {item.label} +
+{item.value}
+
+
+ setDescription(event.target.value)}
+ placeholder='例如：节点安装包 / 测试证书 / 宣传素材'
+ />
+
+
+
+ setSelectedFiles(Array.from(event.target.files ?? []))}
+ className='block w-full rounded-2xl border border-dashed border-[var(--border-default)] bg-[var(--surface-muted)] px-4 py-6 text-sm text-[var(--foreground-secondary)] file:mr-4 file:rounded-xl file:border-0 file:bg-[var(--brand-primary)] file:px-4 file:py-2 file:text-sm file:font-medium file:text-[var(--foreground-inverse)]'
+ />
+
+
+ {selectedFiles.length > 0 ? (
+
+
+
+ ) : (
+ 待上传文件
+-
+ {selectedFiles.map((file) => (
+
- + {file.name} · {(file.size / 1024).toFixed(1)} KB + + ))} +
+
+
+
+
+ {activeQuery.isLoading ? (
+
+ setSearchInput(event.target.value)}
+ placeholder='搜索文件名、上传者或上传者 ID'
+ className='md:max-w-xl'
+ />
+
+
+ {searchKeyword.length === 0 ? (
+
+
+ 搜索
+
+
+ 清空
+
+
+
+ setPage((value) => Math.max(value - 1, 0))} disabled={page === 0 || activeQuery.isLoading}>
+ 上一页
+
+ setPage((value) => value + 1)}
+ disabled={activeQuery.isLoading || files.length < ITEMS_PER_PAGE}
+ >
+ 下一页
+
+
+ ) : null}
+
+
+
+
+
+ )}
+ | 文件 | +上传者 | +上传时间 | +下载量 | +操作 | +
|---|---|---|---|---|
| + + | +
+
+
+ {file.uploader} +上传者 ID：{file.uploader_id} + |
+ + {formatRelativeTime(file.upload_time)} · {formatDateTime(file.upload_time)} + | ++ {file.download_counter || 0} + | +
+
+
+ |
+
+
+
+
+ );
+ }
+
+ if (!isRoot) {
+ return
+
+ {busyKey === 'profile' ? '保存中...' : '保存资料'}
+
+ }
+ >
+
+
+ accessTokenMutation.mutate()}
+ disabled={accessTokenMutation.isPending}
+ >
+ {accessTokenMutation.isPending ? '生成中...' : '重置令牌'}
+
+ }
+ >
+
+
+
+
+
+
+ setProfileFields((previous) => ({ ...previous, username: event.target.value }))
+ }
+ placeholder='请输入用户名'
+ />
+
+
+
+
+ setProfileFields((previous) => ({ ...previous, display_name: event.target.value }))
+ }
+ placeholder='请输入显示名称'
+ />
+
+
+
+
+ setProfileFields((previous) => ({ ...previous, password: event.target.value }))
+ }
+ placeholder='请输入新密码'
+ />
+
+
+
+
+
+
+
+ {accessToken ? (
+
+
+ 当前角色
+
+
+
+
+ 已绑定邮箱
++ {profile.email || '未绑定'} +
+
+ {accessToken}
+ void copyToClipboard(accessToken)}
+ >
+ 复制令牌
+
+
+ ) : (
+
+
+
+
+ window.open(
+ `https://github.com/login/oauth/authorize?client_id=${publicStatus.github_client_id}&scope=user:email`,
+ '_blank',
+ 'noopener,noreferrer',
+ )
+ }
+ disabled={!publicStatus.github_oauth || !publicStatus.github_client_id}
+ >
+ {publicStatus.github_oauth ? '绑定 GitHub' : '未启用 GitHub OAuth'}
+
+
+
+
+
+ GitHub 账号
++ 当前状态：{profile.github_id ? `已绑定 ${profile.github_id}` : '未绑定'} +
+
+ 
+ ) : null}
+
+ setWeChatCode(event.target.value)}
+ placeholder='请输入微信验证码'
+ />
+
+
+ {busyKey === 'wechat-bind' ? '绑定中...' : '绑定微信'}
+
+
+
+
+
+ {publicStatus.wechat_login && publicStatus.wechat_qrcode ? (
+ 微信账号
++ 当前状态：{profile.wechat_id ? `已绑定 ${profile.wechat_id}` : '未绑定'} +
+
+
+
+
+ {publicStatus.turnstile_check ? (
+ 邮箱地址
++ 当前状态：{profile.email ? `已绑定 ${profile.email}` : '未绑定'} +
+
+
+ setEmailAddress(event.target.value)}
+ placeholder='请输入邮箱地址'
+ />
+
+
+ setEmailCode(event.target.value)}
+ placeholder='请输入邮箱验证码'
+ />
+
+
+ )}
+
+
+ {busyKey === 'email-send' ? '发送中...' : '发送验证码'}
+
+
+ {busyKey === 'email-bind' ? '绑定中...' : '绑定邮箱'}
+
+
+
+
+ void runBusyAction('operation-repo', async () => {
+ await saveOptionEntries(
+ [['AgentUpdateRepo', operationFields.AgentUpdateRepo.trim()]],
+ 'Agent 更新仓库已保存。',
+ );
+ })
+ }
+ disabled={busyKey === 'operation-repo'}
+ >
+ {busyKey === 'operation-repo' ? '保存中...' : '保存更新仓库'}
+
+ }
+ >
+
+
+ setOperationFields((previous) => ({ ...previous, AgentUpdateRepo: event.target.value }))
+ }
+ placeholder='Rain-kl/ATSFlare'
+ />
+
+
+
+
+
+
+ window.open('/swagger/index.html', '_blank', 'noopener,noreferrer')}>
+ 打开接口文档
+
+
+ void runBusyAction('operation-intervals', async () => {
+ const heartbeat = Number.parseInt(operationFields.AgentHeartbeatInterval, 10);
+ const sync = Number.parseInt(operationFields.AgentSyncInterval, 10);
+ const offline = Number.parseInt(operationFields.NodeOfflineThreshold, 10);
+
+ if (Number.isNaN(heartbeat) || heartbeat < 5000) {
+ throw new Error('心跳间隔不能小于 5000 毫秒。');
+ }
+ if (Number.isNaN(sync) || sync < 5000) {
+ throw new Error('同步间隔不能小于 5000 毫秒。');
+ }
+ if (Number.isNaN(offline) || offline < 10000) {
+ throw new Error('离线阈值不能小于 10000 毫秒。');
+ }
+
+ await saveOptionEntries(
+ [
+ ['AgentHeartbeatInterval', String(heartbeat)],
+ ['AgentSyncInterval', String(sync)],
+ ['NodeOfflineThreshold', String(offline)],
+ ],
+ 'Agent 运行参数已保存。',
+ );
+ })
+ }
+ disabled={busyKey === 'operation-intervals'}
+ >
+ {busyKey === 'operation-intervals' ? '保存中...' : '保存运行参数'}
+
+
+ }
+ >
+
+
+
+ setOperationFields((previous) => ({ ...previous, AgentHeartbeatInterval: event.target.value }))
+ }
+ />
+
+
+
+ setOperationFields((previous) => ({ ...previous, AgentSyncInterval: event.target.value }))
+ }
+ />
+
+
+
+ setOperationFields((previous) => ({ ...previous, NodeOfflineThreshold: event.target.value }))
+ }
+ />
+
+
+
+
+
+
+ rotateTokenMutation.mutate()}
+ disabled={rotateTokenMutation.isPending}
+ >
+ {rotateTokenMutation.isPending ? '生成中...' : '重新生成 Token'}
+
+ {discoveryCommand ? (
+ void copyToClipboard(discoveryCommand)}>
+ 复制命令
+
+ ) : null}
+
+ }
+ >
+ {bootstrapQuery.isLoading ? (
+
+
+
+ setOperationFields((previous) => ({ ...previous, ServerAddress: event.target.value }))
+ }
+ />
+
+ {discoveryCommand} : null}
+
+ )}
+
+
+ {discoveryCommand ? Discovery Token
++ {discoveryToken || '未生成'} +
+
+
+
+
+ 前端版本
+{publicEnv.appVersion}
+
+
+ 服务端版本
+{publicStatus.version}
+
+
+ Server 启动时间
++ {formatDateTime(new Date(publicStatus.start_time * 1000))} +
+
+
+ 运行模式
+静态导出 + Go Server 托管
+
+
+
+
+
+ );
+ }
+
+ return (
+
+ handleToggleOption('PasswordLoginEnabled', checked)}
+ disabled={busyKey === 'toggle-PasswordLoginEnabled'}
+ />
+ handleToggleOption('PasswordRegisterEnabled', checked)}
+ disabled={busyKey === 'toggle-PasswordRegisterEnabled'}
+ />
+ handleToggleOption('EmailVerificationEnabled', checked)}
+ disabled={busyKey === 'toggle-EmailVerificationEnabled'}
+ />
+ handleToggleOption('GitHubOAuthEnabled', checked)}
+ disabled={busyKey === 'toggle-GitHubOAuthEnabled'}
+ />
+ handleToggleOption('WeChatAuthEnabled', checked)}
+ disabled={busyKey === 'toggle-WeChatAuthEnabled'}
+ />
+ handleToggleOption('TurnstileCheckEnabled', checked)}
+ disabled={busyKey === 'toggle-TurnstileCheckEnabled'}
+ />
+ handleToggleOption('RegisterEnabled', checked)}
+ disabled={busyKey === 'toggle-RegisterEnabled'}
+ />
+
+
+
+ void runBusyAction('system-core', async () => {
+ await saveOptionEntries(
+ [
+ ['ServerAddress', normalizeServerUrl(systemFields.ServerAddress)],
+ ['SMTPServer', systemFields.SMTPServer.trim()],
+ ['SMTPPort', systemFields.SMTPPort.trim()],
+ ['SMTPAccount', systemFields.SMTPAccount.trim()],
+ ['SMTPToken', systemFields.SMTPToken.trim()],
+ ],
+ '通用与 SMTP 设置已保存。',
+ );
+ })
+ }
+ disabled={busyKey === 'system-core'}
+ >
+ {busyKey === 'system-core' ? '保存中...' : '保存通用设置'}
+
+ }
+ >
+
+
+
+ void runBusyAction('system-integrations', async () => {
+ await saveOptionEntries(
+ [
+ ['GitHubClientId', systemFields.GitHubClientId.trim()],
+ ['GitHubClientSecret', systemFields.GitHubClientSecret.trim()],
+ ['WeChatServerAddress', normalizeServerUrl(systemFields.WeChatServerAddress)],
+ ['WeChatServerToken', systemFields.WeChatServerToken.trim()],
+ ['WeChatAccountQRCodeImageURL', systemFields.WeChatAccountQRCodeImageURL.trim()],
+ ['TurnstileSiteKey', systemFields.TurnstileSiteKey.trim()],
+ ['TurnstileSecretKey', systemFields.TurnstileSecretKey.trim()],
+ ],
+ '第三方集成设置已保存。',
+ );
+ })
+ }
+ disabled={busyKey === 'system-integrations'}
+ >
+ {busyKey === 'system-integrations' ? '保存中...' : '保存集成设置'}
+
+ }
+ >
+
+
+
+
+
+ setSystemFields((previous) => ({ ...previous, ServerAddress: event.target.value }))
+ }
+ placeholder='https://yourdomain.com'
+ />
+
+
+
+
+
+ setSystemFields((previous) => ({ ...previous, SMTPServer: event.target.value }))
+ }
+ placeholder='smtp.qq.com'
+ />
+
+
+
+ setSystemFields((previous) => ({ ...previous, SMTPPort: event.target.value }))
+ }
+ placeholder='587'
+ />
+
+
+
+ setSystemFields((previous) => ({ ...previous, SMTPAccount: event.target.value }))
+ }
+ placeholder='name@example.com'
+ />
+
+
+
+ setSystemFields((previous) => ({ ...previous, SMTPToken: event.target.value }))
+ }
+ placeholder='请输入新的 SMTP 凭证'
+ />
+
+
+
+
+
+
+
+ setSystemFields((previous) => ({ ...previous, GitHubClientId: event.target.value }))
+ }
+ />
+
+
+
+ setSystemFields((previous) => ({ ...previous, GitHubClientSecret: event.target.value }))
+ }
+ />
+
+
+
+ setSystemFields((previous) => ({ ...previous, WeChatServerAddress: event.target.value }))
+ }
+ />
+
+
+
+ setSystemFields((previous) => ({ ...previous, WeChatServerToken: event.target.value }))
+ }
+ />
+
+
+
+ setSystemFields((previous) => ({ ...previous, WeChatAccountQRCodeImageURL: event.target.value }))
+ }
+ />
+
+
+
+ setSystemFields((previous) => ({ ...previous, TurnstileSiteKey: event.target.value }))
+ }
+ />
+
+
+
+ setSystemFields((previous) => ({ ...previous, TurnstileSecretKey: event.target.value }))
+ }
+ />
+
+
+
+
+
+
+ void runBusyAction('other-brand', async () => {
+ await saveOptionEntries(
+ [
+ ['Notice', otherFields.Notice],
+ ['SystemName', otherFields.SystemName.trim()],
+ ['HomePageLink', otherFields.HomePageLink.trim()],
+ ['Footer', otherFields.Footer],
+ ],
+ '公告与品牌设置已保存。',
+ );
+ })
+ }
+ disabled={busyKey === 'other-brand'}
+ >
+ {busyKey === 'other-brand' ? '保存中...' : '保存基础信息'}
+
+ }
+ >
+
+
+
+
+ {busyKey === 'latest-release' ? '检查中...' : '检查更新'}
+
+
+ void runBusyAction('other-about', async () => {
+ await saveOptionEntries([['About', otherFields.About]], '关于页内容已保存。');
+ })
+ }
+ disabled={busyKey === 'other-about'}
+ >
+ {busyKey === 'other-about' ? '保存中...' : '保存关于内容'}
+
+
+ }
+ >
+
+
+
+ setOtherFields((previous) => ({ ...previous, SystemName: event.target.value }))
+ }
+ placeholder='ATSFlare'
+ />
+
+
+
+ setOtherFields((previous) => ({ ...previous, HomePageLink: event.target.value }))
+ }
+ placeholder='https://example.com'
+ />
+
+
+
+ setOtherFields((previous) => ({ ...previous, Notice: event.target.value }))
+ }
+ placeholder='可在此编写首页公告内容'
+ />
+
+
+
+ setOtherFields((previous) => ({ ...previous, Footer: event.target.value }))
+ }
+ placeholder='留空则使用默认页脚'
+ />
+
+
+
+
+
+ setOtherFields((previous) => ({ ...previous, About: event.target.value }))
+ }
+ placeholder='在这里编写关于 ATSFlare 的介绍内容'
+ className='min-h-48'
+ />
+
+
+ {latestRelease ? (
+
+
+
+
+ ) : (
+
+
+ 最新版本：{latestRelease.tag_name}
++ 发布时间：{formatRelativeTime(latestRelease.published_at)} · {formatDateTime(latestRelease.published_at)} +
+ + + 查看发布详情 + +