i dont remember what

This commit is contained in:
1ilit 2023-09-19 15:47:10 +03:00
parent 91a18e2338
commit 65a33e1fc3
3 changed files with 19 additions and 5 deletions

View File

@ -55,6 +55,11 @@ export default function Canvas(props) {
label: `rect ${props.rectangles.length + 1}`, label: `rect ${props.rectangles.length + 1}`,
}; };
props.setRectangles([...props.rectangles, newRectangle]); props.setRectangles([...props.rectangles, newRectangle]);
props.setCode((prev) =>
prev === ""
? `CREATE TABLE \`${newRectangle.label}\`;`
: `${prev}\n\nCREATE TABLE \`${newRectangle.label}\`;`
);
}, },
collect: (monitor) => ({ collect: (monitor) => ({
isOver: !!monitor.isOver(), isOver: !!monitor.isOver(),

View File

@ -57,6 +57,11 @@ export default function EditorPanel(props) {
label: `rect ${props.rectangles.length + 1}`, label: `rect ${props.rectangles.length + 1}`,
}; };
props.setRectangles([...props.rectangles, newRectangle]); props.setRectangles([...props.rectangles, newRectangle]);
props.setCode((prev) =>
prev === ""
? `CREATE TABLE \`${newRectangle.label}\`;`
: `${prev}\n\nCREATE TABLE \`${newRectangle.label}\`;`
);
}} }}
> >
add add

View File

@ -1,9 +1,10 @@
import React from "react"; import React from "react";
import { Button } from "@arco-design/web-react";
const Rect = (props) => { const Rect = (props) => {
return ( return (
<g> <g>
<rect <foreignObject
key={props.id} key={props.id}
x={props.x} x={props.x}
y={props.y} y={props.y}
@ -11,13 +12,16 @@ const Rect = (props) => {
height={props.height} height={props.height}
style={{ fill: "blue", cursor: "move" }} style={{ fill: "blue", cursor: "move" }}
onMouseDown={props.onMouseDown} onMouseDown={props.onMouseDown}
/> >
<foreignObject x={props.x + 10} y={props.y + 25} width={80} height={50}> <div xmlns="http://www.w3.org/1999/xhtml" className="bg-blue p-3">
<body xmlns="http://www.w3.org/1999/xhtml"> <div className="text-white">{props.label}</div>
<form onSubmit={(e) => e.preventDefault()}> <form onSubmit={(e) => e.preventDefault()}>
<input type="text" className="w-full" /> <input type="text" className="w-full" />
</form> </form>
</body> <Button type="secondary" onClick={(e) => console.log("sup")}>
sup
</Button>
</div>
</foreignObject> </foreignObject>
</g> </g>
); );