Vorkout/connect
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(client): move components

Browse Source
This commit is contained in:
Vladislav Syrochkin
2025-07-22 08:05:20 +05:00
parent 8b0659fc89
commit 5966b7d6f1
4 changed files with 408 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
client/src/components/nodes/AppropriationNode.tsx
View File

@@ -1,11 +1,13 @@
import { Handle, Node, NodeProps, Position } from "@xyflow/react";
import DEFAULT_HANDLE_STYLE from "./defaultHandleStyle";
import { useTranslation } from "react-i18next";
type AppropriationNodeData = { value: string };
export default function AppropriationNode({
data,
}: NodeProps<Node & AppropriationNodeData>) {
const { t } = useTranslation();
return (
<div
style={{
@@ -30,8 +32,8 @@ export default function AppropriationNode({
style={{ height: "24px", width: "24px" }}
src="/icons/node/calculate.svg"
alt="appropriation logo"
/>{" "}
ПРИСВОЕНИЕ
/>
{t("appropriationNode")}
</div>
<div style={{ height: "1px", backgroundColor: "#E2E2E2" }}></div>
<div

135
client/src/components/nodes/IfElseNode.tsx
View File

@@ -1,82 +1,83 @@
import { Handle, NodeProps, Position, Node } from "@xyflow/react";
import DEFAULT_HANDLE_STYLE from "./defaultHandleStyle";
import { useTranslation } from "react-i18next";
type IfElseNodeData = {
interface IfElseNodeProps extends Node {
condition: string;
};
}
export default function IfElseNode({ data }: NodeProps<Node & IfElseNodeData>) {
export default function IfElseNode({ id, data }: NodeProps<IfElseNodeProps>) {
const { t } = useTranslation();
return (
<div
style={{
border: "0px solid",
borderRadius: 8,
backgroundColor: "white",
width: "248px",
height: "144px",
}}
>
<>
<div
style={{
display: "flex",
alignItems: "center",
paddingLeft: "12px",
height: "48px",
fontWeight: "600px",
fontSize: "16px",
gap: "12px",
border: "0px solid",
borderRadius: 8,
backgroundColor: "white",
width: "248px",
height: "144px",
}}
>
<img
style={{ height: "24px", width: "24px" }}
src="/icons/node/ifElse.svg"
alt="if else logo"
/>{" "}
ЕСЛИ - ТО
</div>
<div style={{ height: "1px", backgroundColor: "#E2E2E2" }}></div>
<div
style={{
display: "flex",
alignItems: "center",
paddingLeft: "12px",
height: "48px",
fontWeight: "600px",
fontSize: "16px",
gap: "12px",
}}
>
<img
style={{ height: "24px", width: "24px" }}
src="/icons/node/ifElse.svg"
alt="if else logo"
/>
{t("ifElseNode")}
</div>
<div style={{ height: "1px", backgroundColor: "#E2E2E2" }}></div>
<div
style={{
display: "flex",
alignItems: "center",
paddingLeft: "12px",
fontSize: "14px",
height: "48px",
}}
>
Если {data.condition as string}, то
</div>
<div style={{ height: "1px", backgroundColor: "#E2E2E2" }}></div>
<div
style={{
display: "flex",
alignItems: "center",
paddingLeft: "12px",
fontSize: "14px",
height: "48px",
}}
>
{t("conditionIf", { condition: data.condition })}
</div>
<div style={{ height: "1px", backgroundColor: "#E2E2E2" }}></div>
<div
style={{
display: "flex",
alignItems: "center",
paddingLeft: "12px",
fontSize: "14px",
height: "48px",
}}
>
Иначе
</div>
<div
style={{
display: "flex",
alignItems: "center",
paddingLeft: "12px",
fontSize: "14px",
height: "48px",
}}
>
{t("conditionElse")}
</div>
<Handle type="target" position={Position.Top} id="input" />
<Handle
type="source"
position={Position.Right}
id="true"
style={{ ...DEFAULT_HANDLE_STYLE }}
/>
<Handle
onClick={() => {
console.log("click");
}}
type="source"
position={Position.Bottom}
id="false"
style={{ ...DEFAULT_HANDLE_STYLE }}
/>
</div>
<Handle type="target" position={Position.Top} id="input" />
<Handle
type="source"
position={Position.Right}
id="1"
style={{ ...DEFAULT_HANDLE_STYLE }}
/>
<Handle
type="source"
position={Position.Bottom}
id="2"
style={{ ...DEFAULT_HANDLE_STYLE }}
/>
</div>
</>
);
}