2023-01-10 14:46:27 +03:00

52 lines
1.2 KiB
JavaScript

import Background from 'Components/Layout/Background';
import styled from 'styled-components';
import { min } from 'styles/mq';
import Tabs from 'ui/elements/layout/Tabs';
import AddProduct from './AddProduct';
import CreateKP from './CreateKP';
import Insurance from './Insurance';
import Leasing from './Leasing';
import LeasingObject from './LeasingObject';
import Payments from './Payments';
import SupplierAgent from './SupplierAgent';
const formTabs = [Leasing, Payments, LeasingObject, SupplierAgent, Insurance, AddProduct, CreateKP];
const Wrapper = styled(Background)`
padding: 4px 6px;
${min('tablet')} {
min-height: 790px;
}
${min('laptop')} {
padding: 4px 6px 10px;
}
`;
const ComponentWrapper = styled.div`
padding: 0 4px;
${min('laptop')} {
padding: 0 12px;
}
`;
function Form() {
return (
<Wrapper>
<Tabs type="card" tabBarGutter="5px">
{formTabs.map(({ id, title, Component }) => (
<Tabs.TabPane tab={title} key={id}>
<ComponentWrapper>
<Component />
</ComponentWrapper>
</Tabs.TabPane>
))}
</Tabs>
</Wrapper>
);
}
export default Form;