From 5313bc9a3a84f4a20ace3c12cf2c191b11ef95e2 Mon Sep 17 00:00:00 2001
From: publ <publ@cnbugs.com>
Date: Tue, 23 Jun 2026 10:51:28 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E9=80=89=20InfluxDB?=
 =?UTF-8?q?=20=E6=95=B0=E6=8D=AE=E6=BA=90=E6=97=B6=E7=99=BD=E5=B1=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Form.useWatch('influx_version', form) 在 JSX 中内联调用，
违反 React hooks 规则（条件性调用 hooks），导致组件渲染时崩溃。

修复：将 watch 提到组件顶部，与 jobType 一起声明。

Co-Authored-By: Claude <noreply@anthropic.com>
---
 frontend/src/pages/Jobs/JobForm.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/frontend/src/pages/Jobs/JobForm.tsx b/frontend/src/pages/Jobs/JobForm.tsx
index ef8e707..98ea05e 100644
--- a/frontend/src/pages/Jobs/JobForm.tsx
+++ b/frontend/src/pages/Jobs/JobForm.tsx
@@ -116,6 +116,7 @@ export function JobForm({ mode }: { mode: 'create' | 'edit' }) {
   const [loading, setLoading] = useState(false)
   const [existing, setExisting] = useState<JobWithLastRun | null>(null)
   const jobType = Form.useWatch('type', form)
+  const influxVersion = Form.useWatch('influx_version', form)
 
   useEffect(() => {
     storageApi.list().then(setStorages)
@@ -297,7 +298,7 @@ export function JobForm({ mode }: { mode: 'create' | 'edit' }) {
                 </Form.Item>
               </Space.Compact>
 
-              {Form.useWatch('influx_version', form) === '1' ? (
+              {influxVersion === '1' ? (
                 <>
                   <Form.Item name="influx_database" label="数据库名" rules={[{ required: true }]}>
                     <Input placeholder="telegraf" />