titor/drawDB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

uuuugh

Browse Source
This commit is contained in:
1ilit 2023-09-19 15:50:45 +03:00
parent 2760f458af
commit ab0dc2c44e
6 changed files with 129 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/reference_overview.jsx
View File

@ -201,7 +201,7 @@ export default function ReferenceOverview(props) {
</label> </label>
<Checkbox <Checkbox
value="mandetory" value="mandetory"
defaultChecked={r.mandetory} checked={r.mandetory}
onChange={(checkedValues) => onChange={(checkedValues) =>
setRelationships((prev) => setRelationships((prev) =>
prev.map((e, idx) => prev.map((e, idx) =>

51
src/components/table.jsx
View File

@ -350,7 +350,7 @@ export default function Table(props) {
value === "SMALLINT"); value === "SMALLINT");
updateField(props.tableData.id, j, { updateField(props.tableData.id, j, {
type: value, type: value,
length: value === "VARCHAR" ? 255 : "n/a", length: value === "VARCHAR" ? 255 : "",
increment: incr, increment: incr,
}); });
}} }}
@ -522,6 +522,7 @@ export default function Table(props) {
className="my-2" className="my-2"
placeholder="Set constraint" placeholder="Set constraint"
value={f.check} value={f.check}
disabled={f.increment}
onChange={(value) => onChange={(value) =>
updateField(props.tableData.id, j, { check: value }) updateField(props.tableData.id, j, { check: value })
} }
@ -547,7 +548,7 @@ export default function Table(props) {
<div className="font-medium">Unique</div> <div className="font-medium">Unique</div>
<Checkbox <Checkbox
value="unique" value="unique"
defaultChecked={f.unique} checked={f.unique}
onChange={(checkedValues) => { onChange={(checkedValues) => {
setUndoStack((prev) => [ setUndoStack((prev) => [
...prev, ...prev,
@ -579,7 +580,7 @@ export default function Table(props) {
<div className="font-medium">Autoincrement</div> <div className="font-medium">Autoincrement</div>
<Checkbox <Checkbox
value="increment" value="increment"
defaultChecked={f.increment} checked={f.increment}
disabled={ disabled={
!( !(
f.type === "INT" || f.type === "INT" ||
@ -735,12 +736,51 @@ export default function Table(props) {
<Popover <Popover
content={ content={
<div className="px-1"> <div className="px-1">
<div className="font-semibold mb-1">Index name: </div>
<Input <Input
className="my-2"
value={idx.name} value={idx.name}
placeholder="Index name" placeholder="Index name"
disabled disabled
/> />
<div className="flex justify-between items-center my-3">
<div className="font-medium">Unique</div>
<Checkbox
value="unique"
checked={idx.unique}
onChange={(checkedValues) => {
setUndoStack((prev) => [
...prev,
{
action: Action.EDIT,
element: ObjectType.TABLE,
component: "index",
tid: props.tableData.id,
iid: k,
undo: {
[checkedValues.target.value]:
!checkedValues.target.checked,
},
redo: {
[checkedValues.target.value]:
checkedValues.target.checked,
},
},
]);
setRedoStack([]);
updateTable(props.tableData.id, {
indices: props.tableData.indices.map((index) =>
index.id === k
? {
...index,
[checkedValues.target.value]:
checkedValues.target.checked,
}
: index
),
});
}}
></Checkbox>
</div>
<Button <Button
icon={<IconDeleteStroked />} icon={<IconDeleteStroked />}
type="danger" type="danger"
@ -945,6 +985,7 @@ export default function Table(props) {
{ {
id: props.tableData.indices.length, id: props.tableData.indices.length,
name: `index_${props.tableData.indices.length}`, name: `index_${props.tableData.indices.length}`,
unique: false,
fields: [], fields: [],
}, },
], ],
@ -975,7 +1016,7 @@ export default function Table(props) {
type: "", type: "",
default: "", default: "",
check: "", check: "",
length: "n/a", length: "",
primary: false, primary: false,
unique: false, unique: false,
notNull: false, notNull: false,

54
src/components/table_overview.jsx
View File

@ -185,7 +185,7 @@ export default function TableOverview(props) {
value === "SMALLINT"); value === "SMALLINT");
updateField(i, j, { updateField(i, j, {
type: value, type: value,
length: value === "VARCHAR" ? 255 : "n/a", length: value === "VARCHAR" ? 255 : "",
increment: incr, increment: incr,
}); });
}} }}
@ -359,6 +359,7 @@ export default function TableOverview(props) {
className="my-2" className="my-2"
placeholder="Set constraint" placeholder="Set constraint"
value={f.check} value={f.check}
disabled={f.increment}
onChange={(value) => onChange={(value) =>
updateField(i, j, { check: value }) updateField(i, j, { check: value })
} }
@ -386,7 +387,7 @@ export default function TableOverview(props) {
<div className="font-medium">Unique</div> <div className="font-medium">Unique</div>
<Checkbox <Checkbox
value="unique" value="unique"
defaultChecked={f.unique} checked={f.unique}
onChange={(checkedValues) => { onChange={(checkedValues) => {
setUndoStack((prev) => [ setUndoStack((prev) => [
...prev, ...prev,
@ -418,7 +419,7 @@ export default function TableOverview(props) {
<div className="font-medium">Autoincrement</div> <div className="font-medium">Autoincrement</div>
<Checkbox <Checkbox
value="increment" value="increment"
defaultChecked={f.increment} checked={f.increment}
disabled={ disabled={
!( !(
f.type === "INT" || f.type === "INT" ||
@ -583,12 +584,54 @@ export default function TableOverview(props) {
<Popover <Popover
content={ content={
<div className="px-1"> <div className="px-1">
<div className="font-semibold mb-1">
Index name:{" "}
</div>
<Input <Input
className="my-2"
value={idx.name} value={idx.name}
placeholder="Index name" placeholder="Index name"
disabled disabled
/> />
<div className="flex justify-between items-center my-3">
<div className="font-medium">Unique</div>
<Checkbox
value="unique"
checked={idx.unique}
onChange={(checkedValues) => {
setUndoStack((prev) => [
...prev,
{
action: Action.EDIT,
element: ObjectType.TABLE,
component: "index",
tid: i,
iid: k,
undo: {
[checkedValues.target.value]:
!checkedValues.target.checked,
},
redo: {
[checkedValues.target.value]:
checkedValues.target.checked,
},
},
]);
setRedoStack([]);
updateTable(i, {
indices: t.indices.map((index) =>
index.id === k
? {
...index,
[checkedValues.target.value]:
checkedValues.target
.checked,
}
: index
),
});
}}
></Checkbox>
</div>
<Button <Button
icon={<IconDeleteStroked />} icon={<IconDeleteStroked />}
type="danger" type="danger"
@ -804,6 +847,7 @@ export default function TableOverview(props) {
{ {
id: t.indices.length, id: t.indices.length,
name: `index_${t.indices.length}`, name: `index_${t.indices.length}`,
unique: false,
fields: [], fields: [],
}, },
], ],
@ -835,7 +879,7 @@ export default function TableOverview(props) {
default: "", default: "",
check: "", check: "",
primary: false, primary: false,
length: "n/a", length: "",
unique: false, unique: false,
notNull: false, notNull: false,
increment: false, increment: false,

2
src/pages/editor.jsx
View File

@ -87,7 +87,7 @@ export default function Editor(props) {
unique: true, unique: true,
notNull: true, notNull: true,
increment: true, increment: true,
length: "n/a", length: "",
comment: "", comment: "",
id: 0, id: 0,
}, },

3
src/schemas/index.js
View File

@ -43,12 +43,13 @@ const tableSchema = {
type: "object", type: "object",
properties: { properties: {
name: { type: "string" }, name: { type: "string" },
unique: { type: "boolean" },
fields: { fields: {
type: "array", type: "array",
items: { type: "string" }, items: { type: "string" },
}, },
}, },
required: ["name", "fields"], required: ["name", "unique", "fields"],
}, },
}, },
color: { type: "string", pattern: "^#[0-9a-fA-F]{6}$" }, color: { type: "string", pattern: "^#[0-9a-fA-F]{6}$" },

38
src/utils/index.js
View File

@ -59,7 +59,7 @@ function jsonToSQL(obj) {
`${field.comment === "" ? "" : `\t-- ${field.comment}\n`}\t\`${ `${field.comment === "" ? "" : `\t-- ${field.comment}\n`}\t\`${
field.name field.name
}\` ${field.type}${ }\` ${field.type}${
field.length !== "n/a" field.length !== ""
? `(${field.length})` ? `(${field.length})`
: field.type === "ENUM" || field.type === "SET" : field.type === "ENUM" || field.type === "SET"
? `(${field.values.map((v) => `"${v}"`).join(", ")})` ? `(${field.values.map((v) => `"${v}"`).join(", ")})`
@ -67,15 +67,37 @@ function jsonToSQL(obj) {
}${field.notNull ? " NOT NULL" : ""}${ }${field.notNull ? " NOT NULL" : ""}${
field.increment ? " AUTO_INCREMENT" : "" field.increment ? " AUTO_INCREMENT" : ""
}${field.unique ? " UNIQUE" : ""}${ }${field.unique ? " UNIQUE" : ""}${
field.default !== "" ? ` DEFAULT ${field.default}` : "" field.default !== ""
},` ? ` DEFAULT ${
(field.type === "VARCHAR" || field.type === "ENUM") &&
field.default.toLowerCase() !== "null"
? `"${field.default}"`
: `${field.default}`
}`
: ""
}${field.check === "" ? "" : ` CHECK (${field.check})`}`
) )
.join("\n")}\n\tPRIMARY KEY(${table.fields .join(",\n")}${
.filter((f) => f.primary) table.fields.filter((f) => f.primary).length > 0
.map((f) => `\`${f.name}\``) ? `,\n\tPRIMARY KEY(${table.fields
.join(", ")})\n);` .filter((f) => f.primary)
.map((f) => `\`${f.name}\``)
.join(", ")})`
: ""
}\n);\n${
table.indices.length > 0
? `${table.indices.map(
(i) =>
`\nCREATE ${i.unique ? "UNIQUE " : ""}INDEX \`${
i.name
}\`\nON \`${table.name}\` (${i.fields
.map((f) => `\`${f}\``)
.join(", ")});`
)}`
: ""
}`
) )
.join("\n"); .join("\n\n");
} }
export { export {