Merge branch 'statistic' into 'dev'

отсечение будущего у статистики

See merge request frontend/squiz!252
This commit is contained in:
Nastya 2024-04-11 15:58:56 +00:00
commit e9faf37bdd
2 changed files with 49 additions and 16 deletions

@ -38,6 +38,9 @@ export default function Analytics() {
const [isOpenEnd, setOpenEnd] = useState<boolean>(false);
const [from, setFrom] = useState<Moment | null>(null);
const [to, setTo] = useState<Moment | null>(moment().add(1, "days"));
console.log(moment(to).unix() - moment(from).unix())
console.log((86400 - (moment(to).unix() - moment(from).unix())) )
console.log((86400 - (moment(to).unix() - moment(from).unix())) > 0)
const theme = useTheme();
const isTablet = useMediaQuery(theme.breakpoints.down(1000));
@ -248,7 +251,7 @@ export default function Analytics() {
{isMobile ? <ResetIcon /> : "Сбросить"}
</Button>
</Box>
<General data={general} />
<General data={general} day={(86400 - moment(to).unix() - moment(from).unix()) > 0}/>
<AnswersStatistics data={questions} />
<Devices data={devices} />
</SectionWrapper>

@ -12,10 +12,12 @@ type GeneralItemsProps = {
numberType: "sum" | "percent" | "time";
calculateTime?: boolean;
conversionValue?: number;
day: boolean;
};
type GeneralProps = {
data: GeneralResponse | null;
day: boolean;
};
const COLORS: Record<number, string> = {
@ -28,7 +30,7 @@ const COLORS: Record<number, string> = {
const dateParser = (object: Record<string, number>): Record<string, number> => {
const result = {} as Record<string, number>;
for (var key in object) {
result[moment.utc(Number(key) * 1000).format("DD/MM/YYYY")] = object[key];
result[moment.unix(Number(key) * 1000).format("DD/MM/YYYY")] = object[key];
console.log(result);
}
return result;
@ -48,6 +50,7 @@ const GeneralItem = ({
numberType,
calculateTime = false,
conversionValue,
day
}: GeneralItemsProps) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down(700));
@ -93,7 +96,7 @@ const GeneralItem = ({
{
data: Object.keys(general),
valueFormatter: (value) =>
moment.utc(Number(value) * 1000).format("DD/MM/YYYY"),
moment.unix(Number(value)).format("DD/MM/YYYY HH") + "ч",
},
]}
series={[
@ -121,10 +124,13 @@ const GeneralItemTimeConv = ({
numberType,
calculateTime = false,
conversionValue,
day
}: GeneralItemsProps) => {
const theme = useTheme();
const isMobile = useMediaQuery(theme.breakpoints.down(700));
console.log("day", day)
const data = Object.entries(general)
.sort((a, b) => a[0] - b[0]);
@ -138,7 +144,7 @@ const GeneralItemTimeConv = ({
}
return buffer
})
console.log("data", data)
console.log("time", time.reduce((a, b) => (Number(a) + Number(b)), 0))
@ -179,8 +185,7 @@ const GeneralItemTimeConv = ({
xAxis={[
{
data: days,
valueFormatter: (value) =>
moment.utc(Number(value) * 1000).format("DD/MM/YYYY"),
valueFormatter: (value) => moment.unix(Number(value)).format("DD/MM/YYYY HH") + "ч",
},
]}
series={[
@ -188,9 +193,9 @@ const GeneralItemTimeConv = ({
data: Object.values(time),
valueFormatter: (value) => {
console.log("log", value)
return calculateTime ? getCalculatedTime(value) : String((value*100).toFixed(2)) + "%"
return calculateTime ? getCalculatedTime(value) : String((value * 100).toFixed(2)) + "%"
}
,
,
},
]}
// dataset={Object.entries(general).map(([, v]) => moment.unix(v).format("ss:mm:HH")).reduce((acc, [k, v]) => ({ ...acc, [k]: v }), {})}
@ -205,7 +210,7 @@ const GeneralItemTimeConv = ({
);
};
export const General: FC<GeneralProps> = ({ data }) => {
export const General: FC<GeneralProps> = ({ data, day }) => {
const theme = useTheme();
const isTablet = useMediaQuery(theme.breakpoints.down(1000));
const isMobile = useMediaQuery(theme.breakpoints.down(700));
@ -217,13 +222,34 @@ export const General: FC<GeneralProps> = ({ data }) => {
</Typography>
);
}
const DATA = {} as GeneralResponse
const currentDate = moment().unix()
const futureCutter = ({ fatherKey, values }: {fatherKey: string, values: Record<string,number>}) => {
const buffer = {} as Record<string,number>
for (let key in values) {
console.log(Number(key))
console.log(currentDate)
console.log((Number(key) - currentDate))
console.log((Number(key) - currentDate) < 0)
console.log(moment.unix(key).format("HH"))
if ((Number(key) - currentDate) < 0) buffer[key] = values[key]
}
DATA[fatherKey] = buffer
}
for (let key in data) {
futureCutter({ fatherKey: key, values: data[key] })
}
console.log(DATA)
const conversionValue =
(Object.values(data.Result).reduce((total, item) => total + item, 0) /
Object.values(data.Open).reduce((total, item) => total + item, 0)) *
(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)
// console.log(DATA.Result)
return (
<Box sx={{ marginTop: "45px" }}>
<Typography
@ -251,28 +277,32 @@ export const General: FC<GeneralProps> = ({ data }) => {
<GeneralItem
title="Открыли квиз"
numberType="sum"
general={data.Open}
general={DATA.Open}
color={COLORS[0]}
day={day}
/>
<GeneralItem
title="Получено заявок"
numberType="sum"
general={data.Result}
general={DATA.Result}
color={COLORS[1]}
day={day}
/>
<GeneralItemTimeConv
title="Конверсия"
numberType="percent"
conversionValue={conversionValue}
general={data.Conversion}
general={DATA.Conversion}
color={COLORS[2]}
day={day}
/>
<GeneralItemTimeConv
title="Среднее время прохождения квиза"
numberType="time"
calculateTime
general={data.AvTime}
general={DATA.AvTime}
color={COLORS[3]}
day={day}
/>
</Box>
</Box>