fix: 删除画像特征增加二次确认弹窗

web2/src/pages/MyProfile.tsx

@@ -435,6 +435,7 @@ export function MyProfile() {
   const [addingFact, setAddingFact] = useState(false)
   const [newFactKey, setNewFactKey] = useState('')
   const [newFactValue, setNewFactValue] = useState('')
+  const [deletingFact, setDeletingFact] = useState<{ key: string; label: string } | null>(null)
 
   const load = useCallback(async () => {
     setLoading(true)
@@ -495,15 +496,20 @@ export function MyProfile() {
     }
   }
 
-  /** 删除画像特征 */
-  const handleDeleteFact = async (key: string) => {
-    if (!profile) return
+  /** 删除画像特征(确认后执行) */
+  const handleDeleteFact = (key: string, label: string) => {
+    setDeletingFact({ key, label })
+  }
+
+  /** 确认删除 */
+  const confirmDeleteFact = async () => {
+    if (!deletingFact || !profile) return
     try {
-      // 通过更新空值来删除
       const newFacts = { ...profile.key_facts }
-      delete newFacts[key]
+      delete newFacts[deletingFact.key]
       await api.updateProfile({ key_facts: newFacts })
       setProfile((prev) => prev ? { ...prev, key_facts: newFacts } : prev)
+      setDeletingFact(null)
     } catch (e) {
       setError(e instanceof Error ? e.message : '删除失败')
     }
@@ -687,7 +693,7 @@ export function MyProfile() {
                                 <Pencil className="h-3 w-3 text-muted-foreground hover:text-primary" />
                               </button>
                               <button
-                                onClick={() => handleDeleteFact(k)}
+                                onClick={() => handleDeleteFact(k, translateFactKey(k))}
                                 className="opacity-0 transition-opacity group-hover:opacity-100"
                                 aria-label={`删除${translateFactKey(k)}`}
                               >
@@ -875,6 +881,22 @@ export function MyProfile() {
           </DialogFooter>
         </DialogContent>
       </Dialog>
+
+      {/* 删除确认弹窗 */}
+      <Dialog open={!!deletingFact} onOpenChange={(open) => !open && setDeletingFact(null)}>
+        <DialogContent className="max-w-sm">
+          <DialogHeader>
+            <DialogTitle>删除画像特征</DialogTitle>
+            <DialogDescription>
+              确定要删除「{deletingFact?.label}」吗?此操作不可撤销。
+            </DialogDescription>
+          </DialogHeader>
+          <DialogFooter>
+            <Button variant="outline" onClick={() => setDeletingFact(null)}>取消</Button>
+            <Button variant="destructive" onClick={confirmDeleteFact}>删除</Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
     </PageLayout>
   )
 }