Merge pull request #179 from Shinku-Chen/tg-proxy

增加TG代理选项

src/web/pages/NotificationSettings.test.tsx

@@ -43,6 +43,7 @@ describe('NotificationSettings', () => {
       telegramApiBaseUrl: 'https://tg-proxy.example.com',
       telegramChatId: '-1001234567890',
       telegramBotTokenMasked: '1234****token',
+      telegramUseSystemProxy: false,
       smtpEnabled: false,
       smtpHost: '',
       smtpPort: 587,
@@ -105,4 +106,73 @@ describe('NotificationSettings', () => {
       root?.unmount();
     }
   });
+
+  it('loads and saves telegram use system proxy toggle', async () => {
+    apiMock.getRuntimeSettings.mockResolvedValue({
+      webhookUrl: '',
+      barkUrl: '',
+      webhookEnabled: true,
+      barkEnabled: true,
+      serverChanEnabled: false,
+      telegramEnabled: true,
+      telegramApiBaseUrl: 'https://api.telegram.org',
+      telegramChatId: '-1001234567890',
+      telegramBotTokenMasked: '1234****token',
+      telegramUseSystemProxy: false,
+      smtpEnabled: false,
+      smtpHost: '',
+      smtpPort: 587,
+      smtpSecure: false,
+      smtpUser: '',
+      smtpFrom: '',
+      smtpTo: '',
+      notifyCooldownSec: 300,
+    });
+
+    let root: ReturnType<typeof create> | null = null;
+    try {
+      await act(async () => {
+        root = create(
+          <MemoryRouter>
+            <ToastProvider>
+              <NotificationSettings />
+            </ToastProvider>
+          </MemoryRouter>,
+        );
+      });
+      await flushMicrotasks();
+
+      const allCheckboxes = root.root.findAll((node) => (
+        node.type === 'input' && node.props.type === 'checkbox'
+      ));
+      const proxyCheckbox = allCheckboxes.find((node) => {
+        const parent = node.parent;
+        if (!parent) return false;
+        const text = collectText(parent);
+        return text.includes('使用系统代理');
+      });
+      expect(proxyCheckbox).toBeTruthy();
+      expect(proxyCheckbox!.props.checked).toBe(false);
+
+      await act(async () => {
+        proxyCheckbox!.props.onChange({ target: { checked: true } });
+      });
+
+      const saveButton = root.root.find((node) => (
+        node.type === 'button'
+        && typeof node.props.onClick === 'function'
+        && collectText(node).includes('保存通知设置')
+      ));
+      await act(async () => {
+        saveButton.props.onClick();
+      });
+      await flushMicrotasks();
+
+      expect(apiMock.updateRuntimeSettings).toHaveBeenCalledWith(expect.objectContaining({
+        telegramUseSystemProxy: true,
+      }));
+    } finally {
+      root?.unmount();
+    }
+  });
 });

src/web/pages/NotificationSettings.tsx

@@ -12,6 +12,7 @@ type RuntimeSettings = {
     telegramEnabled: boolean;
     telegramApiBaseUrl: string;
     telegramChatId: string;
+    telegramUseSystemProxy: boolean;
     smtpEnabled: boolean;
     smtpHost: string;
     smtpPort: number;
@@ -35,6 +36,7 @@ export default function NotificationSettings() {
         telegramEnabled: false,
         telegramApiBaseUrl: 'https://api.telegram.org',
         telegramChatId: '',
+        telegramUseSystemProxy: false,
         smtpEnabled: false,
         smtpHost: '',
         smtpPort: 587,
@@ -78,6 +80,7 @@ export default function NotificationSettings() {
                 telegramEnabled: !!runtimeInfo.telegramEnabled,
                 telegramApiBaseUrl: runtimeInfo.telegramApiBaseUrl || 'https://api.telegram.org',
                 telegramChatId: runtimeInfo.telegramChatId || '',
+                telegramUseSystemProxy: !!runtimeInfo.telegramUseSystemProxy,
                 smtpEnabled: !!runtimeInfo.smtpEnabled,
                 smtpHost: runtimeInfo.smtpHost || '',
                 smtpPort: Number(runtimeInfo.smtpPort) || 587,
@@ -115,6 +118,7 @@ export default function NotificationSettings() {
                 telegramEnabled: runtime.telegramEnabled,
                 telegramApiBaseUrl: runtime.telegramApiBaseUrl,
                 telegramChatId: runtime.telegramChatId,
+                telegramUseSystemProxy: runtime.telegramUseSystemProxy,
                 smtpEnabled: runtime.smtpEnabled,
                 smtpHost: runtime.smtpHost,
                 smtpPort: runtime.smtpPort,
@@ -317,15 +321,26 @@ export default function NotificationSettings() {
                             </div>
                         </div>
 
-                        <label style={{ display: 'flex', alignItems: 'center', gap: 8, cursor: 'pointer' }}>
-                            <span style={{ fontSize: 13, fontWeight: 500, color: runtime.telegramEnabled ? 'var(--color-primary)' : 'var(--color-text-muted)' }}>启用 Telegram</span>
-                            <input
-                                type="checkbox"
-                                style={{ width: 16, height: 16, cursor: 'pointer' }}
-                                checked={runtime.telegramEnabled}
-                                onChange={(e) => setRuntime((prev) => ({ ...prev, telegramEnabled: e.target.checked }))}
-                            />
-                        </label>
+                        <div style={{ display: 'flex', gap: 16 }}>
+                            <label style={{ display: 'flex', alignItems: 'center', gap: 8, cursor: 'pointer' }}>
+                                <span style={{ fontSize: 13, fontWeight: 500, color: runtime.telegramUseSystemProxy ? 'var(--color-primary)' : 'var(--color-text-muted)' }}>使用系统代理</span>
+                                <input
+                                    type="checkbox"
+                                    style={{ width: 16, height: 16, cursor: 'pointer' }}
+                                    checked={runtime.telegramUseSystemProxy}
+                                    onChange={(e) => setRuntime((prev) => ({ ...prev, telegramUseSystemProxy: e.target.checked }))}
+                                />
+                            </label>
+                            <label style={{ display: 'flex', alignItems: 'center', gap: 8, cursor: 'pointer' }}>
+                                <span style={{ fontSize: 13, fontWeight: 500, color: runtime.telegramEnabled ? 'var(--color-primary)' : 'var(--color-text-muted)' }}>启用 Telegram</span>
+                                <input
+                                    type="checkbox"
+                                    style={{ width: 16, height: 16, cursor: 'pointer' }}
+                                    checked={runtime.telegramEnabled}
+                                    onChange={(e) => setRuntime((prev) => ({ ...prev, telegramEnabled: e.target.checked }))}
+                                />
+                            </label>
+                        </div>
                     </div>
 
                     <div style={{ display: 'grid', gridTemplateColumns: 'minmax(0, 1fr) minmax(0, 1fr)', gap: '16px 20px', opacity: runtime.telegramEnabled ? 1 : 0.6, transition: 'opacity 0.2s' }}>