drawdb-io/drawdb
1
0
Fork 0
mirror of https://github.com/drawdb-io/drawdb.git synced 2025-10-17 07:54:01 +00:00
Code Issues Packages Projects Releases Wiki Activity

Handle check expressions

Browse Source
This commit is contained in:
1ilit
2023-09-19 15:51:25 +03:00
parent 028e80a487
commit 69aabaefa9
3 changed files with 118 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
src/components/table.jsx
View File

@@ -41,7 +41,7 @@ import {
TableContext,
UndoRedoContext,
} from "../pages/editor";
import { getSize, hasPrecision, isSized } from "../utils";
import { getSize, hasCheck, hasPrecision, isSized } from "../utils";
export default function Table(props) {
const [isHovered, setIsHovered] = useState(false);
@@ -405,6 +405,12 @@ export default function Table(props) {
size: "",
values: [],
});
} else if (hasCheck(value)) {
updateField(props.tableData.id, j, {
type: value,
check: "",
increment: incr,
});
} else {
updateField(props.tableData.id, j, {
type: value,
@@ -633,34 +639,45 @@ export default function Table(props) {
/>
</>
)}
<div className="font-semibold">Check Expression</div>
<Input
className="my-2"
placeholder="Set constraint"
value={f.check}
disabled={f.increment}
onChange={(value) =>
updateField(props.tableData.id, j, { check: value })
}
onFocus={(e) => setEditField({ check: e.target.value })}
onBlur={(e) => {
if (e.target.value === editField.check) return;
setUndoStack((prev) => [
...prev,
{
action: Action.EDIT,
element: ObjectType.TABLE,
component: "field",
tid: props.tableData.id,
fid: j,
undo: editField,
redo: { check: e.target.value },
message: `Edit table field check expression to "${e.target.value}"`,
},
]);
setRedoStack([]);
}}
/>
{hasCheck(f.type) && (
<>
<div className="font-semibold">Check Expression</div>
<Input
className="my-2"
placeholder="Set constraint"
value={f.check}
disabled={f.increment}
onChange={(value) =>
updateField(props.tableData.id, j, {
check: value,
})
}
onFocus={(e) =>
setEditField({ check: e.target.value })
}
onBlur={(e) => {
if (e.target.value === editField.check) return;
setUndoStack((prev) => [
...prev,
{
action: Action.EDIT,
element: ObjectType.TABLE,
component: "field",
tid: props.tableData.id,
fid: j,
undo: editField,
redo: { check: e.target.value },
message: `Edit table field check expression to ${e.target.value}`,
},
]);
setRedoStack([]);
}}
/>
<div className="text-xs mt-1">
*This will be in the script as is.
</div>
</>
)}
<div className="flex justify-between items-center my-3">
<div className="font-medium">Unique</div>
<Checkbox
@@ -732,8 +749,8 @@ export default function Table(props) {
]);
setRedoStack([]);
updateField(props.tableData.id, j, {
[checkedValues.target.value]:
checkedValues.target.checked,
increment: !f.increment,
check: f.increment ? f.check : "",
});
}}
></Checkbox>

84
src/components/table_overview.jsx
View File

@@ -36,7 +36,7 @@ import {
IllustrationNoContentDark,
} from "@douyinfe/semi-illustrations";
import { SelectContext, TableContext, UndoRedoContext } from "../pages/editor";
import { getSize, hasPrecision, isSized } from "../utils";
import { getSize, hasCheck, hasPrecision, isSized } from "../utils";
export default function TableOverview(props) {
const [indexActiveKey, setIndexActiveKey] = useState("");
@@ -251,6 +251,12 @@ export default function TableOverview(props) {
size: "",
values: [],
});
} else if (hasCheck(value)) {
updateField(i, j, {
type: value,
check: "",
increment: incr,
});
} else {
updateField(i, j, {
type: value,
@@ -478,38 +484,46 @@ export default function TableOverview(props) {
/>
</>
)}
<div className="font-semibold">
Check Expression
</div>
<Input
className="my-2"
placeholder="Set constraint"
value={f.check}
disabled={f.increment}
onChange={(value) =>
updateField(i, j, { check: value })
}
onFocus={(e) =>
setEditField({ check: e.target.value })
}
onBlur={(e) => {
if (e.target.value === editField.check) return;
setUndoStack((prev) => [
...prev,
{
action: Action.EDIT,
element: ObjectType.TABLE,
component: "field",
tid: i,
fid: j,
undo: editField,
redo: { check: e.target.value },
message: `Edit table field check expression to ${e.target.value}`,
},
]);
setRedoStack([]);
}}
/>
{hasCheck(f.type) && (
<>
<div className="font-semibold">
Check Expression
</div>
<Input
className="mt-2"
placeholder="Set constraint"
value={f.check}
disabled={f.increment}
onChange={(value) =>
updateField(i, j, { check: value })
}
onFocus={(e) =>
setEditField({ check: e.target.value })
}
onBlur={(e) => {
if (e.target.value === editField.check)
return;
setUndoStack((prev) => [
...prev,
{
action: Action.EDIT,
element: ObjectType.TABLE,
component: "field",
tid: i,
fid: j,
undo: editField,
redo: { check: e.target.value },
message: `Edit table field check expression to ${e.target.value}`,
},
]);
setRedoStack([]);
}}
/>
<div className="text-xs mt-1">
*This will be in the script as is.
</div>
</>
)}
<div className="flex justify-between items-center my-3">
<div className="font-medium">Unique</div>
<Checkbox
@@ -578,8 +592,8 @@ export default function TableOverview(props) {
]);
setRedoStack([]);
updateField(i, j, {
[checkedValues.target.value]:
checkedValues.target.checked,
increment: !f.increment,
check: f.increment ? f.check : "",
});
}}
></Checkbox>