Files
SecMPS/gb28181_web-main/app/components/nodes/zlm-node.tsx
T

31 lines
1.0 KiB
TypeScript

import type { Node, NodeProps } from "@xyflow/react";
import { Position } from "@xyflow/react";
import { CardHeader, CardTitle } from "~/components/ui/card";
import { BaseNode } from "./base-node";
import { LabeledHandle } from "./labeled-handle";
export type ZlmNodeData = {
label: string;
ip?: string;
};
export type ZlmNode = Node<ZlmNodeData>;
export function ZlmNode({ data }: NodeProps<ZlmNode>) {
return (
<BaseNode className="w-32">
<CardHeader className="p-3">
<CardTitle className="text-sm font-medium">{data.label}</CardTitle>
</CardHeader>
<div className="px-3 pb-3">
<div className="text-xs text-muted-foreground">{data.ip}</div>
</div>
<div className="absolute bottom-0 left-0 right-0 flex justify-between p-2 bg-gray-50">
<LabeledHandle id="x" type="target" position={Position.Left} />
<LabeledHandle id="y" type="target" position={Position.Left} />
<LabeledHandle id="out" type="source" position={Position.Right} />
</div>
</BaseNode>
);
}