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

placeholders

Browse Source
This commit is contained in:
1ilit 2023-09-19 15:47:56 +03:00
parent c020a40e20
commit 52ed3a88b7
1 changed files with 102 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

194
src/components/diagram_overview.jsx
View File

@ -8,7 +8,6 @@ import {
Form, Form,
Button, Button,
Card, Card,
TextArea,
Popover, Popover,
Checkbox, Checkbox,
Select, Select,
@ -44,97 +43,98 @@ export default function DiagramOverview(props) {
> >
{t.fields.map((f, j) => ( {t.fields.map((f, j) => (
<Form key={j}> <Form key={j}>
<div> <Row
<Row type="flex"
type="flex" justify="start"
justify="start" align="middle"
align="middle" gutter={6}
gutter={6} className="hover:bg-slate-100"
className="hover:bg-slate-100" >
> <Col span={7}>
<Col span={7}> <Form.Input
<Form.Input field={`name-${j}`}
field={`name-${j}`} noLabel={true}
noLabel={true} initValue={f.name}
initValue={f.name} className="m-0"
className="m-0" placeholder="Name"
/> />
</Col> </Col>
<Col span={8}> <Col span={8}>
<Form.Select <Form.Select
className="w-full" className="w-full"
field={`type-${j}`} field={`type-${j}`}
noLabel={true} noLabel={true}
optionList={sqlDataTypes.map((value, index) => { optionList={sqlDataTypes.map((value, index) => {
return { return {
label: value, label: value,
value: value, value: value,
}; };
})} })}
filter filter
initValue={f.type} initValue={f.type}
></Form.Select> ></Form.Select>
</Col> </Col>
<Col span={3}> <Col span={3}>
<Button type="tertiary" title="Nullable"> <Button type="tertiary" title="Nullable">
? ?
</Button> </Button>
</Col> </Col>
<Col span={3}> <Col span={3}>
<Button type="tertiary" icon={<IconKeyStroked />}></Button> <Button type="tertiary" icon={<IconKeyStroked />}></Button>
</Col> </Col>
<Col span={3}> <Col span={3}>
<Popover <Popover
content={ content={
<div className="px-1"> <div className="px-1">
<Form> <Form>
<Form.Input <Form.Input
field="default" field="default"
label="Default" label="Default"
initValue={f.default} initValue={f.default}
trigger="blur" trigger="blur"
/> placeholder="Set default"
<Form.Input />
field="check" <Form.Input
label="Check Expression" field="check"
trigger="blur" label="Check Expression"
/> trigger="blur"
<div className="flex justify-between items-center my-3"> placeholder="Set constraint"
<label />
htmlFor="increment" <div className="flex justify-between items-center my-3">
className="font-medium" <label htmlFor="increment" className="font-medium">
> Autoincrement
Autoincrement </label>
</label> <Checkbox
<Checkbox value="increment"
value="increment" defaultChecked={f.increment}
defaultChecked={f.increment} ></Checkbox>
></Checkbox>
</div>
<Form.TextArea
field="comment"
label="Comment"
initValue={f.comment}
autosize
rows={2}
/>
</Form>
<div className="flex justify-end mt-2">
<Button icon={<IconDeleteStroked />} type="danger">
Delete
</Button>
</div> </div>
</div> <Form.TextArea
} field="comment"
trigger="click" label="Comment"
position="rightTop" placeholder="Add comment"
showArrow initValue={f.comment}
> autosize
<Button type="tertiary" icon={<IconMore />}></Button> rows={2}
</Popover> />
</Col> </Form>
</Row> <Button
</div> icon={<IconDeleteStroked />}
type="danger"
block
>
Delete
</Button>
</div>
}
trigger="click"
position="rightTop"
showArrow
>
<Button type="tertiary" icon={<IconMore />}></Button>
</Popover>
</Col>
</Row>
</Form> </Form>
))} ))}
{t.indices.length > 0 && ( {t.indices.length > 0 && (
@ -185,6 +185,7 @@ export default function DiagramOverview(props) {
label="Name" label="Name"
initValue={idx.name} initValue={idx.name}
trigger="blur" trigger="blur"
placeholder="Index name"
/> />
</Form> </Form>
<Button <Button
@ -229,7 +230,16 @@ export default function DiagramOverview(props) {
> >
<Collapse> <Collapse>
<Collapse.Panel header="Comment" itemKey="1"> <Collapse.Panel header="Comment" itemKey="1">
<TextArea autosize rows={1} /> <Form>
<Form.TextArea
field="comment"
noLabel={true}
initValue={t.comment}
autosize
placeholder="Add comment"
rows={1}
/>
</Form>
</Collapse.Panel> </Collapse.Panel>
</Collapse> </Collapse>
</Card> </Card>