Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- public render(): JSX.Element {
- const { label, onSkeletonSubmit } = this.props;
- const isSkeleton = !!onSkeletonSubmit;
- return (
- <Form
- initialValues={{
- name: label?.name || '',
- type: label?.type || (isSkeleton ? LabelType.SKELETON : LabelType.ANY),
- color: label?.color || undefined,
- attributes: (label?.attributes || []).map((attr) => ({
- id: attr.id,
- name: attr.name,
- type: attr.input_type,
- values: attr.values,
- mutable: attr.mutable,
- default_value: attr.default_value,
- })),
- }}
- onFinish={this.handleSubmit}
- layout='vertical'
- ref={this.formRef}
- >
- <Row justify='start' align='top'>
- <Col span={8}>{this.renderLabelNameInput()}</Col>
- <Col span={3} offset={1}>{this.renderLabelTypeInput()}</Col>
- <Col span={3} offset={1}>
- {this.renderChangeColorButton()}
- </Col>
- <Col offset={1}>
- {this.renderNewAttributeButton()}
- </Col>
- </Row>
- <Row justify='start' align='top'>
- <Col span={24}>
- <Form.List name='attributes'>
- {(fieldInstances) => {
- const layout = fieldInstances.map((field, index) => ({
- i: field.key.toString(),
- x: 0,
- y: index,
- h: 1,
- w: 1,
- }));
- return (
- <ReactGridLayout
- layout={layout}
- rowHeight={30}
- cols={1}
- width={600}
- >
- {fieldInstances.map(this.renderAttribute)}
- </ReactGridLayout>
- );
- }}
- </Form.List>
- </Col>
- </Row>
- <Row justify='start' align='middle'>
- <Col>{this.renderSaveButton()}</Col>
- <Col offset={1}>{this.renderCancelButton()}</Col>
- </Row>
- </Form>
- );
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement