feat(csms): 充电桩添加 deviceName 字段，区别于 identifier 用于区分设备

apps/web/app/dashboard/topology/topology-flow.tsx

@@ -17,6 +17,7 @@ import {
 } from "@xyflow/react";
 import "@xyflow/react/dist/style.css";
 import { api, type ChargePoint, type ConnectorSummary } from "@/lib/api";
+import { useSession } from "@/lib/auth-client";
 import dayjs from "@/lib/dayjs";
 import { Clock, EvCharger, Plug, Zap } from "lucide-react";
 
@@ -101,10 +102,10 @@ function CsmsHubNode({ data }: NodeProps) {
 
 // ── Charge Point Node ─────────────────────────────────────────────────────
 
-type ChargePointNodeData = { cp: ChargePoint; status: ConnectionStatus };
+type ChargePointNodeData = { cp: ChargePoint; status: ConnectionStatus; isAdmin: boolean };
 
 function ChargePointNode({ data }: NodeProps) {
-  const { cp, status } = data as ChargePointNodeData;
+  const { cp, status, isAdmin } = data as ChargePointNodeData;
   const cfg = STATUS_CONFIG[status];
   const hbText = cp.lastHeartbeatAt ? dayjs(cp.lastHeartbeatAt).fromNow() : "从未";
 
@@ -123,9 +124,14 @@ function ChargePointNode({ data }: NodeProps) {
       <div className="flex items-center justify-between">
         <div className="flex items-center gap-1">
           <EvCharger className="size-4 shrink-0 text-muted" />
-          <span className="text-[13px] font-semibold tracking-tight text-foreground">
-            {cp.chargePointIdentifier}
-          </span>
+          <div className="flex flex-col">
+            <span className="text-[13px] font-semibold tracking-tight text-foreground">
+              {cp.deviceName ?? cp.chargePointIdentifier}
+            </span>
+            {isAdmin && cp.deviceName && (
+              <span className="font-mono text-[10px] text-muted">{cp.chargePointIdentifier}</span>
+            )}
+          </div>
         </div>
         <span
           className="flex items-center gap-1 rounded-md px-1.5 py-0.5 text-[10px] font-medium"
@@ -217,6 +223,7 @@ function slotWidth(cp: ChargePoint): number {
 function buildGraph(
   chargePoints: ChargePoint[],
   connectedIdentifiers: string[],
+  isAdmin: boolean,
 ): { nodes: Node[]; edges: Edge[] } {
   // Group into rows
   const rows: ChargePoint[][] = [];
@@ -267,7 +274,7 @@ function buildGraph(
         id: cp.id,
         type: "chargePoint",
         position: { x: cpX, y: cpY },
-        data: { cp, status },
+        data: { cp, status, isAdmin },
         draggable: true,
         width: CP_W,
         height: CP_H,
@@ -356,11 +363,14 @@ export default function TopologyFlow() {
     refetchInterval: 10_000,
   });
 
+  const { data: sessionData } = useSession();
+  const isAdmin = sessionData?.user?.role === "admin";
+
   const connectedIds = connections?.connectedIdentifiers ?? [];
 
   const { nodes, edges } = useMemo(
-    () => buildGraph(chargePoints, connectedIds),
-    [chargePoints, connectedIds],
+    () => buildGraph(chargePoints, connectedIds, isAdmin),
+    [chargePoints, connectedIds, isAdmin],
   );
 
   if (isLoading) {