0.0.8.5

app/tree/page.tsx

@@ -19,6 +19,8 @@ import { Badge } from "@/components/ui/badge"
 import { ZoomIn, ZoomOut, Move, Download, LayoutGrid, ChevronDown, Users, Network } from "lucide-react"
 import { useState, useRef, useEffect, useCallback } from "react"
 import { useRouter, useSearchParams } from "next/navigation"
+import { MemberNameWithStatus } from "@/components/member-name-with-status"
+import { RelationshipPathDisplay } from "@/components/relationship-path-display"
 
 type ViewMode = "traditional" | "d3-org-chart"
 
@@ -225,7 +227,8 @@ export default function TreePage() {
       }
     } else {
       console.log('Navigating to member detail')
-      router.push(`/members/${id}`)
+      const params = new URLSearchParams(window.location.search)
+      router.push(`/members/${id}?${params.toString()}`)
     }
   }, [router, calculateRelationship, treeData.members])
 
@@ -504,7 +507,10 @@ export default function TreePage() {
               <div className="flex items-center justify-center gap-4 p-6 bg-muted rounded-lg">
                 <div className="text-center">
                   <div className="text-2xl font-bold font-serif mb-1">
-                    {relationResult.from.fullName}
+                    <MemberNameWithStatus 
+                      name={relationResult.from.fullName}
+                      isDead={!!relationResult.from.deathDate}
+                    />
                   </div>
                   <div className="text-sm text-muted-foreground">
                     第{relationResult.from.generation}世
@@ -519,7 +525,10 @@ export default function TreePage() {
 
                 <div className="text-center">
                   <div className="text-2xl font-bold font-serif mb-1">
-                    {relationResult.to.fullName}
+                    <MemberNameWithStatus 
+                      name={relationResult.to.fullName}
+                      isDead={!!relationResult.to.deathDate}
+                    />
                   </div>
                   <div className="text-sm text-muted-foreground">
                     第{relationResult.to.generation}世
@@ -531,7 +540,7 @@ export default function TreePage() {
               <div id="relation-description" className="p-4 bg-blue-50 dark:bg-blue-950 rounded-lg">
                 <div className="text-sm font-medium mb-1">关系说明：</div>
                 <div className="text-muted-foreground">
-                  <strong>{relationResult.from.fullName}</strong> 是 <strong>{relationResult.to.fullName}</strong> 的 <strong className="text-primary">{relationResult.relationship.term}</strong>
+                  <strong><MemberNameWithStatus name={relationResult.from.fullName} isDead={!!relationResult.from.deathDate} /></strong> 是 <strong><MemberNameWithStatus name={relationResult.to.fullName} isDead={!!relationResult.to.deathDate} /></strong> 的 <strong className="text-primary">{relationResult.relationship.term}</strong>
                 </div>
               </div>
 
@@ -539,9 +548,10 @@ export default function TreePage() {
               {relationResult.relationship.path && (
                 <div className="p-4 bg-muted rounded-lg">
                   <div className="text-sm font-medium mb-2">关系路径：</div>
-                  <div className="text-xs text-muted-foreground break-all">
-                    {relationResult.relationship.path}
-                  </div>
+                  <RelationshipPathDisplay 
+                    path={relationResult.relationship.path}
+                    className="text-xs"
+                  />
                 </div>
               )}
             </div>