drawdb-io/drawdb
1
0
Fork 0
mirror of https://github.com/drawdb-io/drawdb.git synced 2026-01-12 07:01:40 +08:00
Code Issues Packages Projects Releases Wiki Activity

Allow importing from sql without uploading a file (#700)

Browse Source
This commit is contained in:
1ilit
2025-11-15 22:42:08 +04:00
committed by GitHub
parent c4e57596c4
commit ee542bd8eb
2 changed files with 60 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
src/components/EditorHeader/Modal/ImportSource.jsx
View File

@@ -1,6 +1,7 @@
import { Upload, Checkbox, Banner } from "@douyinfe/semi-ui";
import { Upload, Checkbox, Banner, Tabs, TabPane } from "@douyinfe/semi-ui";
import { STATUS } from "../../../data/constants";
import { useTranslation } from "react-i18next";
import CodeEditor from "../../CodeEditor";
export default function ImportSource({
importData,
@@ -12,45 +13,63 @@ export default function ImportSource({
return (
<div>
<Upload
action="#"
beforeUpload={({ file, fileList }) => {
const f = fileList[0].fileInstance;
if (!f) {
return;
}
const reader = new FileReader();
reader.onload = async (e) => {
setImportData((prev) => ({ ...prev, src: e.target.result }));
};
reader.readAsText(f);
<Tabs>
<TabPane tab={t("insert_sql")} itemKey="text-import">
<CodeEditor
className="h-56"
language="sql"
onChange={(value) => {
setImportData((prev) => ({ ...prev, src: value }));
setError({
type: STATUS.NONE,
message: "",
});
}}
/>
</TabPane>
<TabPane tab={t("upload_file")} itemKey="file-import">
<Upload
action="#"
beforeUpload={({ file, fileList }) => {
const f = fileList[0].fileInstance;
if (!f) {
return;
}
const reader = new FileReader();
reader.onload = async (e) => {
setImportData((prev) => ({ ...prev, src: e.target.result }));
};
reader.readAsText(f);
return {
autoRemove: false,
fileInstance: file.fileInstance,
status: "success",
shouldUpload: false,
};
}}
draggable={true}
dragMainText={t("drag_and_drop_files")}
dragSubText={t("upload_sql_to_generate_diagrams")}
accept=".sql"
onRemove={() => {
setError({
type: STATUS.NONE,
message: "",
});
setImportData((prev) => ({ ...prev, src: "" }));
}}
onFileChange={() =>
setError({
type: STATUS.NONE,
message: "",
})
}
limit={1}
/>
</TabPane>
</Tabs>
return {
autoRemove: false,
fileInstance: file.fileInstance,
status: "success",
shouldUpload: false,
};
}}
draggable={true}
dragMainText={t("drag_and_drop_files")}
dragSubText={t("upload_sql_to_generate_diagrams")}
accept=".sql"
onRemove={() => {
setError({
type: STATUS.NONE,
message: "",
});
setImportData((prev) => ({ ...prev, src: "" }));
}}
onFileChange={() =>
setError({
type: STATUS.NONE,
message: "",
})
}
limit={1}
/>
<div className="mt-2">
<Checkbox
aria-label="overwrite checkbox"

2
src/i18n/locales/en.js
View File

@@ -279,6 +279,8 @@ const en = {
failed_to_record_version: "Failed to record version",
failed_to_load_diagram: "Failed to load diagram",
see_all: "See all",
insert_sql: "Insert SQL",
upload_file: "Upload file",
},
};