SQuiz/frontPanel
2
0
Fork 0
Code Issues 10 Pull Requests Actions Packages Projects Releases Wiki Activity

fix: SliderOptions from logic

Browse Source
This commit is contained in:
IlyaDoronin 2023-09-13 11:15:02 +03:00
parent a8be01c737
commit a07b8014bd
2 changed files with 65 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
src/pages/Questions/SliderOptions/SliderOptions.tsx
View File

@ -52,6 +52,7 @@ export default function SliderOptions({ totalIndex }: Props) {
});
}}
onBlur={({ target }) => {
const start = listQuestions[quizId][totalIndex].content.start;
const min = Number(target.value);
const max = Number(
listQuestions[quizId][totalIndex].content.range.split("—")[1]
@ -68,6 +69,15 @@ export default function SliderOptions({ totalIndex }: Props) {
content: clonContent,
});
}
if (start < min) {
updateQuestionsList(quizId, totalIndex, {
content: {
...listQuestions[quizId][totalIndex].content,
start: min,
},
});
}
}}
/>
<Typography>—</Typography>
@ -88,10 +98,13 @@ export default function SliderOptions({ totalIndex }: Props) {
});
}}
onBlur={({ target }) => {
const start = listQuestions[quizId][totalIndex].content.start;
const step = listQuestions[quizId][totalIndex].content.step;
const min = Number(
listQuestions[quizId][totalIndex].content.range.split("—")[0]
);
const max = Number(target.value);
const range = max - min;
if (max <= min) {
const clonContent = listQuestions[quizId][totalIndex].content;
@ -104,6 +117,34 @@ export default function SliderOptions({ totalIndex }: Props) {
content: clonContent,
});
}
if (start > max) {
updateQuestionsList(quizId, totalIndex, {
content: {
...listQuestions[quizId][totalIndex].content,
start: max,
},
});
}
if (step > max) {
updateQuestionsList(quizId, totalIndex, {
content: {
...listQuestions[quizId][totalIndex].content,
step: max,
},
});
if (range % step) {
setStepError(
`Шаг должен делить без остатка диапазон ${max} - ${min} = ${
max - min
}`
);
} else {
setStepError("");
}
}
}}
/>
</Box>
@ -120,7 +161,12 @@ export default function SliderOptions({ totalIndex }: Props) {
<Typography>Начальное значение</Typography>
<CustomNumberField
placeholder={"50"}
min={0}
min={Number(
listQuestions[quizId][totalIndex].content.range.split("—")[0]
)}
max={Number(
listQuestions[quizId][totalIndex].content.range.split("—")[1]
)}
value={String(listQuestions[quizId][totalIndex].content.start)}
onChange={({ target }) => {
const clonContent = listQuestions[quizId][totalIndex].content;
@ -129,21 +175,6 @@ 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,
},
});
}
}}
/>
</Box>
<Box sx={{ width: "100%" }}>

22
src/ui_kit/CustomNumberField.tsx
View File

@ -30,16 +30,28 @@ export default function CustomNumberField({
const inputValue = event.target.value;
if (
Number(inputValue) >= min &&
Number(inputValue) <= max &&
(inputValue === "" ||
inputValue === "" ||
inputValue.match(/^\d*$/) ||
(inputValue[0] === "-" && inputValue.slice(1).match(/^\d*$/)))
(inputValue[0] === "-" && inputValue.slice(1).match(/^\d*$/))
) {
onChange?.({ ...event, target: { ...event.target, value: inputValue } });
}
};
const onInputBlur = (event: FocusEvent<HTMLInputElement>) => {
const inputValue = event.target.value;
if (Number(inputValue) < min) {
onChange?.({ ...event, target: { ...event.target, value: String(min) } });
}
if (Number(inputValue) > max) {
onChange?.({ ...event, target: { ...event.target, value: String(max) } });
}
onBlur?.(event);
};
return (
<CustomTextField
placeholder={placeholder}
@ -47,7 +59,7 @@ export default function CustomNumberField({
error={error}
onChange={onInputChange}
onKeyDown={onKeyDown}
onBlur={onBlur}
onBlur={onInputBlur}
value={value}
/>
);