Components/Calculation: rename load-addon -> irr-addon
config/elements-render: move irr functional to irr-addon
This commit is contained in:
parent
524f0105e1
commit
72560b3e8a
31
apps/web/Components/Calculation/addons/irr-addon.tsx
Normal file
31
apps/web/Components/Calculation/addons/irr-addon.tsx
Normal file
@ -0,0 +1,31 @@
|
||||
import { useStore } from '@/stores/hooks';
|
||||
import { observer } from 'mobx-react-lite';
|
||||
import styled from 'styled-components';
|
||||
import { LoadingOutlined } from 'ui/elements/icons';
|
||||
|
||||
const TextAddon = styled.span`
|
||||
font-size: 14px;
|
||||
`;
|
||||
|
||||
const formatter = Intl.NumberFormat('ru', {
|
||||
minimumFractionDigits: 2,
|
||||
}).format;
|
||||
|
||||
export const IRRAddon = observer(() => {
|
||||
const { $calculation, $process } = useStore();
|
||||
|
||||
if ($process.has('Tarif')) {
|
||||
return (
|
||||
<TextAddon>
|
||||
<LoadingOutlined rev="" />
|
||||
{' Подбирается тариф...'}
|
||||
</TextAddon>
|
||||
);
|
||||
}
|
||||
|
||||
const tarif = $calculation.element('selectTarif').getValue();
|
||||
if (!tarif) return <TextAddon>Тариф не найден</TextAddon>;
|
||||
|
||||
const { min, max } = $calculation.$values.getValue('irrInfo');
|
||||
return <TextAddon>{`${formatter(min)}% - ${formatter(max)}%`}</TextAddon>;
|
||||
});
|
||||
@ -1,15 +0,0 @@
|
||||
import styled from 'styled-components';
|
||||
import { LoadingOutlined } from 'ui/elements/icons';
|
||||
|
||||
const TextAddon = styled.span`
|
||||
font-size: 14px;
|
||||
`;
|
||||
|
||||
export function LoaderAddon() {
|
||||
return (
|
||||
<TextAddon>
|
||||
<LoadingOutlined rev="" />
|
||||
{' идет загрузка тарифов...'}
|
||||
</TextAddon>
|
||||
);
|
||||
}
|
||||
@ -1,4 +1,4 @@
|
||||
import { LoaderAddon } from '../../addons/loader-addon';
|
||||
import { IRRAddon } from '../../addons/irr-addon';
|
||||
import { ProductAddon } from '../../addons/product-addon';
|
||||
import { buildLink } from '../../builders';
|
||||
import components from '../elements-components';
|
||||
@ -12,7 +12,6 @@ import { useErrors, useStore } from '@/stores/hooks';
|
||||
import { useIsFetching } from '@tanstack/react-query';
|
||||
import { observer } from 'mobx-react-lite';
|
||||
import type { ComponentProps } from 'react';
|
||||
import styled from 'styled-components';
|
||||
import { Link, Tooltip } from 'ui/elements';
|
||||
import { LoadingOutlined } from 'ui/elements/icons';
|
||||
|
||||
@ -23,14 +22,6 @@ const defaultLinkProps: ComponentProps<typeof Link> = {
|
||||
type: 'link',
|
||||
};
|
||||
|
||||
const formatter = Intl.NumberFormat('ru', {
|
||||
minimumFractionDigits: 2,
|
||||
}).format;
|
||||
|
||||
const TextAddon = styled.span`
|
||||
font-size: 14px;
|
||||
`;
|
||||
|
||||
const overrideRender: Partial<Record<keyof typeof map, RenderProps>> = {
|
||||
btnCalculate: {
|
||||
render: () => {
|
||||
@ -340,18 +331,12 @@ const overrideRender: Partial<Record<keyof typeof map, RenderProps>> = {
|
||||
});
|
||||
|
||||
const RenderedComponent = observer(() => {
|
||||
const { $calculation, $process } = useStore();
|
||||
const { $calculation } = useStore();
|
||||
const { min, max } = $calculation.$values.getValue('irrInfo');
|
||||
|
||||
const addon = <TextAddon>{`${formatter(min)}% - ${formatter(max)}%`}</TextAddon>;
|
||||
|
||||
return (
|
||||
<Container>
|
||||
<Head
|
||||
htmlFor={elementName}
|
||||
title={title}
|
||||
addon={$process.has('Tarif') ? <LoaderAddon /> : addon}
|
||||
/>
|
||||
<Head htmlFor={elementName} title={title} addon={<IRRAddon />} />
|
||||
<Element {...props} min={min > 0 ? min : undefined} max={max > 0 ? max : undefined} />
|
||||
</Container>
|
||||
);
|
||||
|
||||
@ -77,7 +77,7 @@ export function createValidationSchema({ apolloClient }: ValidationContext) {
|
||||
if (!tarifId) {
|
||||
ctx.addIssue({
|
||||
code: z.ZodIssueCode.custom,
|
||||
message: 'Тариф не выбран',
|
||||
message: 'Не заполнено поле',
|
||||
path: ['selectTarif'],
|
||||
});
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user