Add input validators

This commit is contained in:
1ilit 2023-09-19 15:51:17 +03:00
parent 1016c3536e
commit 953af7e0d7
2 changed files with 30 additions and 3 deletions

View File

@ -288,6 +288,7 @@ export default function Table(props) {
<div className="text-md font-semibold">Name: </div>
<Input
value={props.tableData.name}
validateStatus={props.tableData.name === "" ? "error" : "default"}
placeholder="Name"
className="mx-2 mb-1"
onChange={(value) =>
@ -345,7 +346,7 @@ export default function Table(props) {
<Col span={8}>
<Select
className="w-full"
optionList={sqlDataTypes.map((value, index) => {
optionList={sqlDataTypes.map((value) => {
return {
label: value,
value: value,
@ -353,6 +354,7 @@ export default function Table(props) {
})}
filter
value={f.type}
validateStatus={f.type === "" ? "error" : "default"}
placeholder="Type"
onChange={(value) => {
if (value === f.type) return;
@ -486,6 +488,11 @@ export default function Table(props) {
<TagInput
separator={[",", ", ", " ,"]}
value={f.values}
validateStatus={
!f.values || f.values.length === 0
? "error"
: "default"
}
className="my-2"
placeholder="Use ',' for batch input"
onChange={(v) =>
@ -527,6 +534,9 @@ export default function Table(props) {
className="my-2 w-full"
placeholder="Set length"
value={f.length}
validateStatus={
f.length === "" ? "error" : "default"
}
onChange={(value) =>
updateField(props.tableData.id, j, {
length: value,
@ -754,6 +764,9 @@ export default function Table(props) {
<Select
placeholder="Select fields"
multiple
validateStatus={
idx.fields.length === 0 ? "error" : "default"
}
optionList={props.tableData.fields.map((e) => ({
value: e.name,
label: e.name,

View File

@ -134,10 +134,11 @@ export default function TableOverview(props) {
tables.map((t, i) => (
<div id={`scroll_table_${t.id}`} key={t.id}>
<Collapse.Panel header={<div>{t.name}</div>} itemKey={`${t.id}`}>
<div className="flex items-center mb-2">
<div className="flex items-center mb-2.5">
<div className="text-md font-semibold">Name: </div>
<Input
value={t.name}
validateStatus={t.name === "" ? "error" : "default"}
placeholder="Name"
className="ms-2"
onChange={(value) => updateTable(t.id, { name: value })}
@ -165,6 +166,7 @@ export default function TableOverview(props) {
<Col span={7}>
<Input
value={f.name}
validateStatus={f.name === "" ? "error" : "default"}
placeholder="Name"
onChange={(value) => updateField(i, j, { name: value })}
onFocus={(e) => setEditField({ name: e.target.value })}
@ -190,7 +192,7 @@ export default function TableOverview(props) {
<Col span={8}>
<Select
className="w-full"
optionList={sqlDataTypes.map((value, index) => {
optionList={sqlDataTypes.map((value) => {
return {
label: value,
value: value,
@ -198,6 +200,7 @@ export default function TableOverview(props) {
})}
filter
value={f.type}
validateStatus={f.type === "" ? "error" : "default"}
placeholder="Type"
onChange={(value) => {
if (value === f.type) return;
@ -332,6 +335,11 @@ export default function TableOverview(props) {
<TagInput
separator={[",", ", ", " ,"]}
value={f.values}
validateStatus={
!f.values || f.values.length === 0
? "error"
: "default"
}
className="my-2"
placeholder="Use ',' for batch input"
onChange={(v) =>
@ -372,6 +380,9 @@ export default function TableOverview(props) {
<InputNumber
className="my-2 w-full"
placeholder="Set length"
validateStatus={
f.length === "" ? "error" : "default"
}
value={f.length}
onChange={(value) =>
updateField(i, j, { length: value })
@ -611,6 +622,9 @@ export default function TableOverview(props) {
<Select
placeholder="Select fields"
multiple
validateStatus={
idx.fields.length === 0 ? "error" : "default"
}
optionList={t.fields.map((e) => ({
value: e.name,
label: e.name,