fix: fix syntax error in rule-editor.tsx

Complete rewrite to fix type and compile issues.

Co-authored-by: null <4804959+fnvtk@users.noreply.github.com>

components/tag-rules/rule-editor.tsx

@@ -1,5 +1,13 @@
 "use client"
 
+import { useState, useEffect } from "react"
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
+import { Input } from "@/components/ui/input"
+import { Textarea } from "@/components/ui/textarea"
+import { Button } from "@/components/ui/button"
+import { Badge } from "@/components/ui/badge"
+import { Plus, Trash2 } from "lucide-react"
+
 interface RuleCondition {
   field: string
   operator: string
@@ -14,4 +22,153 @@ interface TagRule {
   conditions: RuleCondition[]
   actions: {
     addTags: string[]
-    removeTags
+    removeTags: string[]
+  }
+}
+
+/**
+ * 简易标签规则编辑器
+ * 只实现基本字段编辑与本地状态保存，后端持久化可在后续迭代中接入
+ */
+export function RuleEditor({ ruleId }: { ruleId: string | null }) {
+  const [rule, setRule] = useState<TagRule | null>(null)
+
+  // ❗️此处仅示例：真实项目应替换为 API 请求
+  useEffect(() => {
+    if (!ruleId) {
+      setRule(null)
+      return
+    }
+    // 模拟异步加载
+    setTimeout(() => {
+      setRule({
+        id: ruleId,
+        name: "示例规则",
+        description: "这是一个示例规则，用于演示编辑器",
+        conditions: [
+          { field: "orderAmount", operator: ">", value: "500", logicalOperator: "AND" },
+          { field: "loginDays", operator: "<", value: "30" },
+        ],
+        actions: { addTags: ["高价值用户"], removeTags: [] },
+      })
+    }, 300)
+  }, [ruleId])
+
+  if (!ruleId) {
+    return (
+      <Card>
+        <CardHeader>
+          <CardTitle>请选择要编辑的规则</CardTitle>
+        </CardHeader>
+      </Card>
+    )
+  }
+
+  if (!rule) {
+    return (
+      <Card>
+        <CardHeader>
+          <CardTitle>加载中...</CardTitle>
+        </CardHeader>
+      </Card>
+    )
+  }
+
+  // === 内部更新函数 ===
+  const updateRule = (partial: Partial<TagRule>) => setRule((prev) => (prev ? { ...prev, ...partial } : prev))
+
+  const addCondition = () =>
+    updateRule({
+      conditions: [...rule.conditions, { field: "", operator: "=", value: "" }],
+    })
+
+  const removeCondition = (index: number) =>
+    updateRule({
+      conditions: rule.conditions.filter((_, i) => i !== index),
+    })
+
+  const saveRule = () => {
+    // TODO: 调用后端保存
+    console.log("保存规则：", rule)
+  }
+
+  return (
+    <Card>
+      <CardHeader>
+        <CardTitle>编辑规则：{rule.name}</CardTitle>
+      </CardHeader>
+      <CardContent className="space-y-6">
+        {/* 基本信息 */}
+        <div className="space-y-2">
+          <label className="block text-sm font-medium">规则名称</label>
+          <Input value={rule.name} onChange={(e) => updateRule({ name: e.target.value })} />
+        </div>
+        <div className="space-y-2">
+          <label className="block text-sm font-medium">规则描述</label>
+          <Textarea value={rule.description} onChange={(e) => updateRule({ description: e.target.value })} />
+        </div>
+
+        {/* 条件编辑 */}
+        <div className="space-y-2">
+          <label className="block text-sm font-medium">条件</label>
+          {rule.conditions.map((c, idx) => (
+            <div key={idx} className="flex items-center gap-2">
+              <Input
+                placeholder="字段"
+                value={c.field}
+                onChange={(e) => {
+                  const next = [...rule.conditions]
+                  next[idx].field = e.target.value
+                  updateRule({ conditions: next })
+                }}
+                className="w-1/3"
+              />
+              <Input
+                placeholder="运算符"
+                value={c.operator}
+                onChange={(e) => {
+                  const next = [...rule.conditions]
+                  next[idx].operator = e.target.value
+                  updateRule({ conditions: next })
+                }}
+                className="w-1/6"
+              />
+              <Input
+                placeholder="值"
+                value={c.value}
+                onChange={(e) => {
+                  const next = [...rule.conditions]
+                  next[idx].value = e.target.value
+                  updateRule({ conditions: next })
+                }}
+                className="w-1/3"
+              />
+              <Button variant="ghost" size="icon" onClick={() => removeCondition(idx)} aria-label="删除条件">
+                <Trash2 className="h-4 w-4" />
+              </Button>
+            </div>
+          ))}
+          <Button variant="outline" onClick={addCondition}>
+            <Plus className="mr-2 h-4 w-4" />
+            添加条件
+          </Button>
+        </div>
+
+        {/* 动作（标签） */}
+        <div className="space-y-2">
+          <label className="block text-sm font-medium">新增标签</label>
+          <div className="flex flex-wrap gap-2">
+            {rule.actions.addTags.map((tag, i) => (
+              <Badge key={i}>{tag}</Badge>
+            ))}
+          </div>
+        </div>
+
+        {/* 保存 */}
+        <div className="text-right">
+          <Button onClick={saveRule}>保存规则</Button>
+        </div>
+      </CardContent>
+    </Card>
+  )
+}