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

fix: Number

Browse Source
This commit is contained in:
IlyaDoronin 2023-12-12 16:13:27 +03:00
parent 4a13a02ddf
commit 28c43d662c
1 changed files with 30 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
src/pages/ViewPublicationPage/questions/Number.tsx
View File

@ -37,16 +37,14 @@ export const Number = ({ currentQuestion }: NumberProps) => {
},
1000
);
const { answer } =
answers.find(
({ questionId }) => questionId === currentQuestion.content.id
) ?? {};
const answer = answers.find(
({ questionId }) => questionId === currentQuestion.content.id
)?.answer as string;
const min = window.Number(currentQuestion.content.range.split("—")[0]);
const max = window.Number(currentQuestion.content.range.split("—")[1]);
useEffect(() => {
console.log("ans", currentQuestion.content.start);
if (answer) {
setMinRange(answer.split("—")[0]);
setMaxRange(answer.split("—")[1]);
@ -76,8 +74,7 @@ export const Number = ({ currentQuestion }: NumberProps) => {
marginTop: "20px",
}}
>
<Slider
<Slider
value={
currentQuestion.content.chooseRange
? answer?.split("—").length || 0 > 1
@ -89,34 +86,35 @@ export const Number = ({ currentQuestion }: NumberProps) => {
max={max}
step={currentQuestion.content.step || 1}
sx={{
marginBottom: "20px",
color: theme.palette.brightPurple.main,
padding: "0",
marginTop: "75px",
"& .MuiSlider-valueLabel":{
background: theme.palette.brightPurple.main,
borderRadius: "8px",
width: "60px",
height: "36px"
"& .MuiSlider-valueLabel": {
background: theme.palette.brightPurple.main,
borderRadius: "8px",
width: "60px",
height: "36px",
},
"& .MuiSlider-valueLabel::before": {
width: "6px",
height: "2px",
transform: "translate(-50%, 50%) rotate(90deg)",
bottom: "-5px"
width: "6px",
height: "2px",
transform: "translate(-50%, 50%) rotate(90deg)",
bottom: "-5px",
},
"& .MuiSlider-rail": {
backgroundColor: "#F2F3F7",
border: `1px solid #9A9AAF`,
height: "12px",
},
"& .MuiSlider-thumb": {
border: "3px #f2f3f7 solid",
height: "23px",
width: "23px",
},
"& .MuiSlider-track": {
height: "12px",
},
"& .MuiSlider-rail": {
backgroundColor: "#F2F3F7",
border: `1px solid #9A9AAF`,
height: "12px"
},
"& .MuiSlider-thumb": {
border: "3px #f2f3f7 solid",
height: "23px",
width: "23px"
},
"& .MuiSlider-track": {
height: "12px"
}
}}
onChange={(_, value) => {
const range = String(value).replace(",", "—");
@ -152,12 +150,13 @@ export const Number = ({ currentQuestion }: NumberProps) => {
}}
/>
)}
{currentQuestion.content.chooseRange && (
<Box
sx={{
display: "flex",
gap: "15px",
alignItems: "center",
"& .MuiFormControl-root": { width: "auto" },
}}
>
@ -180,9 +179,7 @@ export const Number = ({ currentQuestion }: NumberProps) => {
"& .MuiInputBase-input": { textAlign: "center" },
}}
/>
до
<Typography>до</Typography>
<CustomTextField
placeholder="0"
value={maxRange}
@ -204,7 +201,6 @@ export const Number = ({ currentQuestion }: NumberProps) => {
/>
</Box>
)}
</Box>
</Box>
);