diff --git a/src/pages/laptop/laptop.page.tsx b/src/pages/laptop/laptop.page.tsx index b75011d..adaa957 100644 --- a/src/pages/laptop/laptop.page.tsx +++ b/src/pages/laptop/laptop.page.tsx @@ -32,7 +32,12 @@ const LaptopPredictPage = () => { const handleGetPredict = async (event: FormEvent) => { event.preventDefault(); - console.log(request); + if (response.predicted_price) { + setResponse({ + predicted_price: undefined, + }); + return; + } const newResponse = await apiLaptop.predictPrice(request); setResponse(newResponse); }; diff --git a/src/pages/tv/tv.page.tsx b/src/pages/tv/tv.page.tsx index db61d38..3fc5b51 100644 --- a/src/pages/tv/tv.page.tsx +++ b/src/pages/tv/tv.page.tsx @@ -31,7 +31,12 @@ const TVPredictPage = () => { const handleGetPredict = async (event: FormEvent) => { event.preventDefault(); - console.log(request); + if (response.predicted_price) { + setResponse({ + predicted_price: undefined, + }); + return; + } const newResponse = await apiTV.predictPrice(request); setResponse(newResponse); }; diff --git a/src/widgets/form/form.widget.tsx b/src/widgets/form/form.widget.tsx index e60ff53..2ba2b2c 100644 --- a/src/widgets/form/form.widget.tsx +++ b/src/widgets/form/form.widget.tsx @@ -1,5 +1,5 @@ import { PredictResponseType } from '@/shared/types/predict'; -import { FormEvent } from 'react'; +import { FormEvent, useMemo } from 'react'; import classes from './styles.module.scss'; import { Button } from '@/shared/components/button'; import { Selector } from '@/shared/components/selector'; @@ -22,26 +22,35 @@ const Form = >({ ? (Object.keys(selectorsData) as Array) : []; + const buttonLabel = useMemo( + () => (response.predicted_price ? 'Back to build' : 'Submit'), + [response.predicted_price], + ); + return (
-
- {fields.map((field) => ( - - - - ))} -
-
- - {response.predicted_price !== undefined && ( - - Ответ: {response.predicted_price} - + {!response.predicted_price ? ( +
+ {fields.map((field) => ( + + + + ))} +
+ ) : ( +
+

Estimated price:

+

{response.predicted_price} руб

+
)} +
+ ); }; diff --git a/src/widgets/form/styles.module.scss b/src/widgets/form/styles.module.scss index bab487c..be7c7dc 100644 --- a/src/widgets/form/styles.module.scss +++ b/src/widgets/form/styles.module.scss @@ -1,4 +1,5 @@ -@use '../../shared/assets/styles/adaptive' as adaptive; +@use '@shared/assets/styles/adaptive' as adaptive; +@use '@shared/assets/styles/fonts' as fonts; .form { display: flex; @@ -15,6 +16,25 @@ gap: 8px; } + .response { + display: flex; + flex-direction: column; + padding: 16px; + gap: 16px; + background-color: var(--primary-white); + border-radius: 16px; + + .title { + margin: 0; + @include fonts.urbanist-font(28px, 600); + } + + .price { + margin: 0; + @include fonts.urbanist-font(20px, 500); + } + } + .divider { height: 4px; width: 100%;