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

Merge branch 'dev' into 'staging'

Browse Source 
Dev

See merge request frontend/squiz!248
This commit is contained in:
Nastya 2024-04-10 23:35:16 +00:00
commit 4992737e9e
5 changed files with 127 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/pages/Analytics/Analytics.tsx
View File

@ -113,6 +113,7 @@ export default function Analytics() {
}
};
console.log(general);
const now = moment();
return (
<LocalizationProvider dateAdapter={AdapterMoment}>

3
src/pages/Analytics/Answers/Answers.tsx
View File

@ -270,7 +270,8 @@ export const Answers: FC<AnswersProps> = ({ data }) => {
color: theme.palette.brightPurple.main,
},
}}
>Заголовок вопроса.
>
Заголовок вопроса.
{currentAnswer?.[0].split("(")[0].trim()
? ` ${currentAnswer?.[0]}`
: "Без заголовка"}

153
src/pages/Analytics/General.tsx
View File

@ -11,6 +11,7 @@ type GeneralItemsProps = {
color: string;
numberType: "sum" | "percent" | "time";
calculateTime?: boolean;
conversionValue?: number;
};
type GeneralProps = {
@ -33,12 +34,20 @@ const dateParser = (object: Record<string, number>): Record<string, number> => {
return result;
};
const getCalculatedTime = (time: number) => {
const hours = String(Math.floor(time / 3600)).padStart(2, "0");
const minutes = String(Math.floor((time % 3600) / 60)).padStart(2, "0");
const seconds = String(Math.floor((time % 3600) % 60)).padStart(2, "0");
return `${hours}:${minutes}:${seconds}`;
};
const GeneralItem = ({
title,
general,
color,
numberType,
calculateTime = false,
conversionValue,
}: GeneralItemsProps) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down(700));
@ -46,13 +55,14 @@ const GeneralItem = ({
const numberValue =
numberType === "sum"
? Object.values(general).reduce((total, item) => total + item, 0)
: 0;
Object.entries(general).reduce(
(total, [key, value]) => total + (value / Number(key)) * 100,
0,
) / Object.keys(general).length || Number(0);
: title === "Конверсия"
? conversionValue
: 0;
if (Object.keys(general).length === 0) {
if (
Object.keys(general).length === 0 ||
Object.values(general).every((x) => x === 0)
) {
return (
<Typography textAlign="center">{`${title} - нет данных`}</Typography>
);
@ -76,7 +86,7 @@ const GeneralItem = ({
>
<Typography sx={{ margin: "20px 20px 0" }}>{title}</Typography>
<Typography sx={{ margin: "10px 20px 0", fontWeight: "bold" }}>
{numberType === "percent" ? `${numberValue.toFixed()}%` : numberValue}
{numberType === "percent" ? `${numberValue.toFixed(2)}%` : numberValue}
</Typography>
<LineChart
xAxis={[
@ -90,10 +100,100 @@ const GeneralItem = ({
{
data: Object.values(general),
valueFormatter: (value) =>
calculateTime ? getCalculatedTime(value) : String(value),
calculateTime ? getCalculatedTime(value) : String(value.toFixed(2)),
},
]}
// dataset={Object.entries(general).map(([, v]) => moment.unix(v).format("ss/mm/HH")).reduce((acc, [k, v]) => ({ ...acc, [k]: v }), {})}
// dataset={Object.entries(general).map(([, v]) => moment.unix(v).format("ss:mm:HH")).reduce((acc, [k, v]) => ({ ...acc, [k]: v }), {})}
height={220}
colors={[color]}
sx={{
transform: isMobile ? "scale(1.1)" : "scale(1.2)",
"& .MuiChartsAxis-tickContainer": { display: "none" },
}}
/>
</Paper>
);
};
const GeneralItemTimeConv = ({
title,
general,
color,
numberType,
calculateTime = false,
conversionValue,
}: GeneralItemsProps) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down(700));
const data = Object.entries(general)
.sort((a, b) => a[0] - b[0]);
const days = [...data].map(e => e[0])
let buffer = 0
const time = [...data].map(e => {
if (e[1] > 0) {
buffer = e[1]
}
return buffer
})
console.log("data", data)
console.log("time", time.reduce((a, b) => (Number(a) + Number(b)), 0))
console.log("time", getCalculatedTime(time.reduce((a, b) => (Number(a) + Number(b)), 0)))
console.log("days", days.length)
const numberValue = calculateTime ?
(
(time.reduce((a, b) => (Number(a) + Number(b)), 0))
/
(days.length)
) || 0
:
conversionValue
if (
Object.keys(general).length === 0 ||
Object.values(general).every((x) => x === 0)
) {
return (
<Typography textAlign="center">{`${title} - нет данных`}</Typography>
);
}
return (
<Paper
sx={{
overflow: "hidden",
borderRadius: "12px",
boxShadow: "0 0 20px rgba(0, 0, 0, 0.15)",
}}
>
<Typography sx={{ margin: "20px 20px 0" }}>{title}</Typography>
<Typography sx={{ margin: "10px 20px 0", fontWeight: "bold" }}>
{calculateTime ? `${getCalculatedTime(numberValue)} с` : `${numberValue.toFixed(2)}%`}
</Typography>
<LineChart
xAxis={[
{
data: days,
valueFormatter: (value) =>
moment.utc(Number(value) * 1000).format("DD/MM/YYYY"),
},
]}
series={[
{
data: Object.values(time),
valueFormatter: (value) => {
console.log("log", value)
return calculateTime ? getCalculatedTime(value) : String(value.toFixed(2))
}
,
},
]}
// dataset={Object.entries(general).map(([, v]) => moment.unix(v).format("ss:mm:HH")).reduce((acc, [k, v]) => ({ ...acc, [k]: v }), {})}
height={220}
colors={[color]}
sx={{
@ -117,7 +217,13 @@ export const General: FC<GeneralProps> = ({ data }) => {
</Typography>
);
}
const conversionValue =
(Object.values(data.Result).reduce((total, item) => total + item, 0) /
Object.values(data.Open).reduce((total, item) => total + item, 0)) *
100;
console.log(conversionValue);
// console.log(data.Result)
return (
<Box sx={{ marginTop: "45px" }}>
<Typography
@ -145,42 +251,27 @@ export const General: FC<GeneralProps> = ({ data }) => {
<GeneralItem
title="Открыли квиз"
numberType="sum"
general={
Object.entries(data.Open)
.filter(([, v]) => v > 0)
.reduce((acc, [k, v]) => ({ ...acc, [k]: v }), {}) || { 0: 0 }
}
general={data.Open}
color={COLORS[0]}
/>
<GeneralItem
title="Получено заявок"
numberType="sum"
general={
Object.entries(data.Result)
.filter(([, v]) => v > 0)
.reduce((acc, [k, v]) => ({ ...acc, [k]: v }), {}) || { 0: 0 }
}
general={data.Result}
color={COLORS[1]}
/>
<GeneralItem
<GeneralItemTimeConv
title="Конверсия"
numberType="percent"
general={
Object.entries(data.Conversion)
.filter(([, v]) => v > 0)
.reduce((acc, [k, v]) => ({ ...acc, [k]: v }), {}) || { 0: 0 }
}
conversionValue={conversionValue}
general={data.Conversion}
color={COLORS[2]}
/>
<GeneralItem
<GeneralItemTimeConv
title="Среднее время прохождения квиза"
numberType="time"
calculateTime
general={
Object.entries(data.AvTime)
.filter(([, v]) => v > 0)
.reduce((acc, [k, v]) => ({ ...acc, [k]: v }), {}) || { 0: 0 }
}
general={data.AvTime}
color={COLORS[3]}
/>
</Box>

2
src/pages/Questions/PageOptions/PageOptions.tsx
View File

@ -66,7 +66,7 @@ export default function PageOptions({ disableInput, question }: Props) {
placeholder={"Можно добавить текст"}
value={question.content.text}
onChange={({ target }) => setText(target.value)}
maxLength={50}
maxLength={700}
/>
</Box>

2
src/pages/createQuize/MyQuizzesFull.tsx
View File

@ -108,7 +108,7 @@ export default function MyQuizzesFull({
(
(quiz.passed_count / quiz.session_count) *
100
).toFixed(1),
).toFixed(2),
)
: 0
}