84 lines
2.0 KiB
TypeScript
84 lines
2.0 KiB
TypeScript
import { Form } from './Form';
|
|
import { Layout } from './Layout';
|
|
import { Output } from './Output';
|
|
import { Settings } from './Settings';
|
|
import { Component as Validation } from './Validation';
|
|
import { Notification } from '@/Components/Common';
|
|
import { NavigationBar, Tabs } from '@/Components/Layout/Navigation';
|
|
import { NavigationProvider } from '@/context/navigation';
|
|
import { useErrors } from '@/stores/hooks';
|
|
import { Media } from '@/styles/media';
|
|
import { getPageTitle } from '@/utils/page';
|
|
import Head from 'next/head';
|
|
import {
|
|
BarChartOutlined,
|
|
CalculatorOutlined,
|
|
ProfileOutlined,
|
|
WarningOutlined,
|
|
} from 'ui/elements/icons';
|
|
|
|
const defaultIconStyle = { fontSize: '1.2rem' };
|
|
|
|
export const tabs = [
|
|
{
|
|
Component: Settings,
|
|
icon: <ProfileOutlined style={defaultIconStyle} />,
|
|
key: 'settings',
|
|
title: 'Интерес/Расчет',
|
|
},
|
|
{
|
|
Component: Form,
|
|
icon: <CalculatorOutlined style={defaultIconStyle} />,
|
|
key: 'form',
|
|
title: 'Параметры',
|
|
},
|
|
{
|
|
Component: Output,
|
|
icon: <BarChartOutlined style={defaultIconStyle} />,
|
|
key: 'output',
|
|
title: 'Результаты',
|
|
},
|
|
{
|
|
Component: Validation,
|
|
icon: <WarningOutlined style={defaultIconStyle} />,
|
|
key: 'errors',
|
|
title: 'Ошибки',
|
|
useShowBadge: () => {
|
|
const { hasErrors } = useErrors();
|
|
|
|
return hasErrors;
|
|
},
|
|
},
|
|
];
|
|
|
|
type ContentProps = {
|
|
readonly initHooks: () => void;
|
|
readonly title: string;
|
|
};
|
|
|
|
export function Content({ initHooks, title }: ContentProps) {
|
|
initHooks();
|
|
|
|
return (
|
|
<>
|
|
<Head>
|
|
<title>{getPageTitle(title)}</title>
|
|
</Head>
|
|
<Notification />
|
|
<Media lessThan="laptop">
|
|
<NavigationProvider>
|
|
<Tabs tabs={tabs} />
|
|
<NavigationBar />
|
|
</NavigationProvider>
|
|
</Media>
|
|
<Media greaterThanOrEqual="laptop">
|
|
<Layout>
|
|
<Form />
|
|
<Settings />
|
|
<Output />
|
|
</Layout>
|
|
</Media>
|
|
</>
|
|
);
|
|
}
|