Unify charge point command channel status

apps/web/app/dashboard/charge-points/[id]/page.tsx

@@ -180,8 +180,16 @@ export default function ChargePointDetailPage({ params }: { params: Promise<{ id
 
   // Online if last heartbeat within 3× interval
   const isOnline =
+    cp?.transportStatus === "online" &&
     cp?.lastHeartbeatAt != null &&
     dayjs().diff(dayjs(cp.lastHeartbeatAt), "second") < (cp.heartbeatInterval ?? 60) * 3;
+  const commandChannelUnavailable = cp?.transportStatus === "unavailable";
+  const statusLabel = isOnline ? "在线" : commandChannelUnavailable ? "通道异常" : "离线";
+  const statusDotClass = isOnline
+    ? "bg-success animate-pulse"
+    : commandChannelUnavailable
+      ? "bg-warning"
+      : "bg-muted";
 
   const { data: sessionData } = useSession();
   const isAdmin = sessionData?.user?.role === "admin";
@@ -245,9 +253,9 @@ export default function ChargePointDetailPage({ params }: { params: Promise<{ id
             </Chip>
             <div className="flex items-center gap-1.5">
               <span
-                className={`size-2 rounded-full ${isOnline ? "bg-success animate-pulse" : "bg-muted"}`}
+                className={`size-2 rounded-full ${statusDotClass}`}
               />
-              <span className="text-xs text-muted">{isOnline ? "在线" : "离线"}</span>
+              <span className="text-xs text-muted">{statusLabel}</span>
             </div>
           </div>
           {(cp.chargePointVendor || cp.chargePointModel) && (
@@ -437,9 +445,9 @@ export default function ChargePointDetailPage({ params }: { params: Promise<{ id
                 <dd>
                   <div className="flex items-center gap-1.5">
                     <span
-                      className={`size-2 rounded-full ${isOnline ? "bg-success animate-pulse" : "bg-muted"}`}
+                      className={`size-2 rounded-full ${statusDotClass}`}
                     />
-                    <span className="text-sm text-foreground">{isOnline ? "在线" : "离线"}</span>
+                    <span className="text-sm text-foreground">{statusLabel}</span>
                   </div>
                 </dd>
               </div>