diff --git a/src/pages/Questions/SliderOptions/SliderOptions.tsx b/src/pages/Questions/SliderOptions/SliderOptions.tsx index dfad17a3..3bcb433f 100644 --- a/src/pages/Questions/SliderOptions/SliderOptions.tsx +++ b/src/pages/Questions/SliderOptions/SliderOptions.tsx @@ -36,7 +36,9 @@ export default function SliderOptions({ totalIndex }: Props) { { @@ -48,11 +50,31 @@ export default function SliderOptions({ totalIndex }: Props) { content: clonContent, }); }} + onBlur={({ target }) => { + const min = Number(target.value); + const max = Number( + listQuestions[quizId][totalIndex].content.range.split("—")[1] + ); + + if (min >= max) { + const clonContent = listQuestions[quizId][totalIndex].content; + clonContent.range = `${max - 1 >= 0 ? max - 1 : 0}—${ + listQuestions[quizId][totalIndex].content.range.split( + "—" + )[1] + }`; + updateQuestionsList(quizId, totalIndex, { + content: clonContent, + }); + } + }} /> { @@ -64,6 +86,24 @@ export default function SliderOptions({ totalIndex }: Props) { content: clonContent, }); }} + onBlur={({ target }) => { + const min = Number( + listQuestions[quizId][totalIndex].content.range.split("—")[0] + ); + const max = Number(target.value); + + if (max <= min) { + const clonContent = listQuestions[quizId][totalIndex].content; + clonContent.range = `${ + listQuestions[quizId][totalIndex].content.range.split( + "—" + )[0] + }—${min + 1 >= 100 ? 100 : min + 1}`; + updateQuestionsList(quizId, totalIndex, { + content: clonContent, + }); + } + }} /> @@ -79,7 +119,8 @@ export default function SliderOptions({ totalIndex }: Props) { Начальное значение { const clonContent = listQuestions[quizId][totalIndex].content; clonContent.start = Number(target.value); @@ -87,13 +128,30 @@ export default function SliderOptions({ totalIndex }: Props) { content: clonContent, }); }} + onBlur={({ target }) => { + const start = Number(target.value); + const min = Number( + listQuestions[quizId][totalIndex].content.range.split("—")[0] + ); + + if (start < min) { + updateQuestionsList(quizId, totalIndex, { + content: { + ...listQuestions[quizId][totalIndex].content, + start: min, + }, + }); + } + }} /> Шаг { const clonContent = listQuestions[quizId][totalIndex].content; clonContent.step = Number(target.value); @@ -101,6 +159,25 @@ export default function SliderOptions({ totalIndex }: Props) { content: clonContent, }); }} + onBlur={({ target }) => { + const min = Number( + listQuestions[quizId][totalIndex].content.range.split("—")[0] + ); + const max = Number( + listQuestions[quizId][totalIndex].content.range.split("—")[1] + ); + const range = max - min; + const step = Number(target.value); + + if (step > range) { + updateQuestionsList(quizId, totalIndex, { + content: { + ...listQuestions[quizId][totalIndex].content, + step: range, + }, + }); + } + }} /> diff --git a/src/stores/questions.ts b/src/stores/questions.ts index c639925f..0159d4a1 100644 --- a/src/stores/questions.ts +++ b/src/stores/questions.ts @@ -30,7 +30,6 @@ export interface Question { required: boolean; deleted: true; page: number; - completed: boolean; content: { variants: Variants[]; hint: Hint; @@ -141,7 +140,6 @@ export const createQuestion = (quizId: number) => { required: true, deleted: true, page: 0, - completed: false, content: { largeCheck: false, large: "", diff --git a/src/ui_kit/CustomNumberField.tsx b/src/ui_kit/CustomNumberField.tsx index 7022ee53..2b124c72 100644 --- a/src/ui_kit/CustomNumberField.tsx +++ b/src/ui_kit/CustomNumberField.tsx @@ -1,4 +1,3 @@ -import { useState } from "react"; import CustomTextField from "./CustomTextField"; import type { ChangeEvent, KeyboardEvent, FocusEvent } from "react"; @@ -9,7 +8,7 @@ interface CustomNumberFieldProps { onChange?: (event: ChangeEvent) => void; onKeyDown?: (event: KeyboardEvent) => void; onBlur?: (event: FocusEvent) => void; - text?: string; + value: string; sx?: SxProps; min?: number; max?: number; @@ -17,7 +16,7 @@ interface CustomNumberFieldProps { export default function CustomNumberField({ placeholder, - text, + value, sx, onChange, onKeyDown, @@ -25,8 +24,6 @@ export default function CustomNumberField({ min = -999999999, max = 999999999, }: CustomNumberFieldProps) { - const [value, setValue] = useState(""); - const onInputChange = (event: ChangeEvent) => { const inputValue = event.target.value; @@ -37,8 +34,6 @@ export default function CustomNumberField({ inputValue.match(/^\d*$/) || (inputValue[0] === "-" && inputValue.slice(1).match(/^\d*$/))) ) { - setValue(inputValue); - onChange?.({ ...event, target: { ...event.target, value: inputValue } }); } }; @@ -46,7 +41,6 @@ export default function CustomNumberField({ return (