47 lines
1.4 KiB
TypeScript
47 lines
1.4 KiB
TypeScript
import type { ResponseGetData, ResponseMetaData } from '@/api/ius/types';
|
||
import { mapFieldTypeElement } from '@/config/elements';
|
||
import { Background, Button, Divider, ElementContainer } from 'ui';
|
||
|
||
type Props = {
|
||
readonly data: ResponseGetData;
|
||
readonly metaData: ResponseMetaData;
|
||
};
|
||
|
||
export function Form({ data, metaData }: Props) {
|
||
return (
|
||
<Background>
|
||
<div className="grid auto-rows-auto grid-cols-1 gap-2 md:grid-cols-2 lg:grid-cols-3 ">
|
||
{Object.keys(metaData).map((name) => {
|
||
const { fieldType, visible } = metaData[name];
|
||
|
||
if (!visible) return false;
|
||
|
||
const Element = mapFieldTypeElement[fieldType];
|
||
|
||
return (
|
||
<ElementContainer
|
||
key={name}
|
||
id={name}
|
||
title={fieldType === 'CHECKBOX' ? '' : metaData[name].label}
|
||
>
|
||
<Element
|
||
id={name}
|
||
required={metaData[name].required}
|
||
defaultValue={data[name]}
|
||
disabled={metaData[name].disabled}
|
||
title={metaData[name].label}
|
||
/>
|
||
</ElementContainer>
|
||
);
|
||
})}
|
||
</div>
|
||
<Divider />
|
||
<div className="grid grid-cols-1 gap-2 lg:grid-cols-3">
|
||
<Button>Сохранить</Button>
|
||
<Button>Возврат на доработку</Button>
|
||
<Button color="danger">Отмена</Button>
|
||
</div>
|
||
</Background>
|
||
);
|
||
}
|