From b0d262e2a0272496f72cc03b8bcb6f6664397881 Mon Sep 17 00:00:00 2001 From: 1ilit Date: Sun, 21 Jan 2024 09:05:43 +0200 Subject: [PATCH] Handle simple sql table parsing --- src/components/ControlPanel.jsx | 222 +++++++++++++++++++++++++++----- 1 file changed, 191 insertions(+), 31 deletions(-) diff --git a/src/components/ControlPanel.jsx b/src/components/ControlPanel.jsx index b203faf..e67c57f 100644 --- a/src/components/ControlPanel.jsx +++ b/src/components/ControlPanel.jsx @@ -29,6 +29,8 @@ import { Toast, SideSheet, List, + Select, + Checkbox, } from "@douyinfe/semi-ui"; import timeLine from "../assets/process.png"; import timeLineDark from "../assets/process_dark.png"; @@ -830,7 +832,10 @@ export default function ControlPanel({ shortcut: "Ctrl+I", }, "Import from source": { - function: () => setVisible(MODAL.IMPORT_SRC) + function: () => { + setData({ src: "", overwrite: true, dbms: "MySQL" }); + setVisible(MODAL.IMPORT_SRC) + } }, "Export as": { children: [ @@ -1217,6 +1222,165 @@ export default function ControlPanel({ } }; + /** + * + * { + "id": 0, + "name": "table_4", + "x": 50, + "y": 83, + "fields": [ + { + "name": "id", + "type": "INT", + "default": "", + "check": "", + "primary": true, + "unique": true, + "notNull": true, + "increment": true, + "comment": "", + "id": 0 + }, + { + "name": "name", + "type": "NUMERIC", + "default": "", + "check": "", + "primary": false, + "unique": false, + "notNull": false, + "increment": false, + "comment": "", + "id": 1, + "size": "" + } + ], + "comment": "", + "indices": [], + "color": "#175e7a" + }, + { + "id": 1, + "name": "table_1", + "x": 360, + "y": 181, + "fields": [ + { + "name": "id", + "type": "INT", + "default": "", + "check": "", + "primary": true, + "unique": true, + "notNull": true, + "increment": true, + "comment": "", + "id": 0 + }, + { + "name": "kk", + "type": "INT", + "default": "", + "check": "", + "primary": false, + "unique": false, + "notNull": false, + "increment": false, + "comment": "", + "id": 1 + }, + { + "id": 2, + "size": "12" + } + ], + "comment": "", + "indices": [], + "color": "#175e7a" + } + */ + + const parseSQLAndLoadDiagram = () => { + const parser = new Parser(); + let ast = null; + try { + console.log(data.dbms) + ast = parser.astify(data.src, { database: data.dbms }); + } catch (err) { + Toast.error("Could not parse the sql file. Make sure there are no syntax errors."); + console.log(err); + return; + } + const tables = []; + + ast.forEach(((e) => { + console.log(JSON.stringify(e)) + if (e.type === "create" && e.keyword === "table") { + const table = {}; + table.name = e.table[0].table; + table.color = "#175e7a"; + table.fields = []; + table.indices = []; + table.x = 0; + table.y = 0; + e.create_definitions.forEach((d) => { + if (d.resource === "column") { + const field = {}; + field.name = d.column.column; + field.type = d.definition.dataType; + field.comment = ""; + field.unique = false; + if (d.unique) field.unique = true; + field.auto_increment = false; + if (d.auto_increment) field.auto_increment = true; + field.notNull = false; + if (d.nullable) field.notNull = true; + field.primary = false; + if (d.primary_key) field.primary = true; + field.default = ""; + if (d.default_val) field.default = d.default_val.value.value; + if (d.definition["length"]) field.size = d.definition["length"]; + + if (d.check) { + let check = ""; + if (d.check.definition[0].left.column) { + check = d.check.definition[0].left.column + " " + d.check.definition[0].operator + " " + d.check.definition[0].right.value; + } else { + check = d.check.definition[0].left.value + " " + d.check.definition[0].operator + " " + d.check.definition[0].right.column; + } + field.check = check; + } + + table.fields.push(field); + } else if (d.resource === "constraint") { + if (d.constraint_type === "primary key") { + d.definition.forEach(c => { + table.fields.forEach((f) => { + if (f.name === c.column && !f.primary) { + f.primary = true; + } + }) + }); + } + } + }); + + tables.push(table); + } + })) + + tables.forEach((e, i) => { + e.id = i; + e.fields.forEach((f, j) => { + f.id = j; + }) + }) + + setTables(tables) + console.log(tables); + } + const getModalOnOk = async () => { switch (visible) { case MODAL.IMG: @@ -1243,6 +1407,7 @@ export default function ControlPanel({ } return; case MODAL.IMPORT_SRC: + parseSQLAndLoadDiagram(); setVisible(MODAL.NONE) return; case MODAL.OPEN: @@ -1395,10 +1560,7 @@ export default function ControlPanel({ } const reader = new FileReader(); reader.onload = async (e) => { - console.log(e.target.result); - const parser = new Parser(); - const ast = parser.astify(e.target.result); - console.log(ast); + setData(prev => ({ ...prev, src: e.target.result })) }; reader.readAsText(f); @@ -1413,11 +1575,13 @@ export default function ControlPanel({ dragMainText="Drag and drop the file here or click to upload." dragSubText="Upload an sql file to autogenerate your tables and columns." accept=".sql" - onRemove={() => + onRemove={() => { setError({ type: STATUS.NONE, message: "", - }) + }); + setData(prev => ({ ...prev, src: "" })); + } } onFileChange={() => setError({ @@ -1427,28 +1591,23 @@ export default function ControlPanel({ } limit={1} > - - {error.type === STATUS.ERROR ? ( - {error.message}} - /> - ) : error.type === STATUS.OK ? ( - {error.message}} - /> - ) : ( - error.type === STATUS.WARNING && ( - {error.message}} - /> - ) - )} +
+
Select DBMS
+ + setData(prev => ({ ...prev, overwrite: e.target.checked }))} + className="my-2"> + Overwrite existing diagram + +
); }; @@ -1642,13 +1801,14 @@ export default function ControlPanel({ closeOnEsc={true} okText={getOkText()} okButtonProps={{ - disabled: + disabled: (error && error.type && error.type === STATUS.ERROR) || (visible === MODAL.IMPORT && (error.type === STATUS.ERROR || !data)) || ((visible === MODAL.IMG || visible === MODAL.CODE) && !exportData.data) || (visible === MODAL.RENAME && title === "") || - (visible === MODAL.SAVEAS && saveAsTitle === ""), + (visible === MODAL.SAVEAS && saveAsTitle === "") || + (visible === MODAL.IMPORT_SRC && data.src === ""), }} cancelText="Cancel" width={600}