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

фильтрация тарифов шильдика от базовых

Browse Source
This commit is contained in:
Tamara 2024-03-30 21:54:28 +03:00
parent 93ddfb8570
commit af70d8b2c6
17 changed files with 200 additions and 111 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/api/statistic.ts
View File

@ -33,7 +33,7 @@ export const getDevices = async (
method: "POST",
url: `${apiUrl}/${quizId}/devices`,
withCredentials: true,
body: {to, from}
body: { to, from },
});
return [devicesResponse];
@ -54,7 +54,7 @@ export const getGeneral = async (
method: "POST",
url: `${apiUrl}/${quizId}/general`,
withCredentials: true,
body: {to, from}
body: { to, from },
});
return [generalResponse];
@ -75,7 +75,7 @@ export const getQuestions = async (
method: "POST",
url: `${apiUrl}/${quizId}/questions`,
withCredentials: true,
body: {to, from}
body: { to, from },
});
return [questionsResponse];

34
src/assets/icons/ChartIcon.tsx
View File

@ -2,13 +2,35 @@ import { Box, SxProps, Theme } from "@mui/material";
export default function ChartLineUp(sx: SxProps<Theme>) {
return (
<Box
sx={sx}
<Box sx={sx}>
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M21 19.5H3V4.5" stroke="#7E2AEA" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
<path d="M19.5 6L12 13.5L9 10.5L3 16.5" stroke="#7E2AEA" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
<path d="M19.5 9.75V6H15.75" stroke="#7E2AEA" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
<path
d="M21 19.5H3V4.5"
stroke="#7E2AEA"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M19.5 6L12 13.5L9 10.5L3 16.5"
stroke="#7E2AEA"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M19.5 9.75V6H15.75"
stroke="#7E2AEA"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
</Box>
);

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

@ -32,15 +32,19 @@ export default function Analytics() {
const [to, setTo] = useState(null);
const [from, setFrom] = useState(null);
const { devices, general, questions } = useAnalytics({quizId: editQuizId?.toString(), to, from})
const { devices, general, questions } = useAnalytics({
quizId: editQuizId?.toString(),
to,
from,
});
const resetTime = () => {
setTo(null);
setFrom(null);
}
};
useLayoutEffect(() => {
if (editQuizId === undefined) redirect("/list")
}, [editQuizId])
if (editQuizId === undefined) redirect("/list");
}, [editQuizId]);
const theme = useTheme();
const isTablet = useMediaQuery(theme.breakpoints.down(1000));
const isMobile = useMediaQuery(theme.breakpoints.down(600));
@ -70,9 +74,9 @@ export default function Analytics() {
handleClose();
}
};
console.log("questions",questions)
console.log("general",general)
console.log("devices",devices)
console.log("questions", questions);
console.log("general", general);
console.log("devices", devices);
const now = moment();
return (

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

@ -188,9 +188,14 @@ const Pagination = () => {
export const Answers = (props) => {
const theme = useTheme();
console.log(props.data)
console.log(props.data);
if (Object.keys(props.data).length === 0) return <Typography textAlign="center" m="10px 0">нет данных об ответах</Typography>
if (Object.keys(props.data).length === 0)
return (
<Typography textAlign="center" m="10px 0">
нет данных об ответах
</Typography>
);
return (
<Box sx={{ flexGrow: 1 }}>
<Paper

15
src/pages/Analytics/Answers/Funnel.tsx
View File

@ -104,7 +104,7 @@ export const Funnel = (props) => {
const theme = useTheme();
const isSmallMonitor = useMediaQuery(theme.breakpoints.down(1150));
const isMobile = useMediaQuery(theme.breakpoints.down(850));
console.log(props)
console.log(props);
useEffect(() => {
// const requestFunnel = async () => {
// const [funnelResponse, funnelError] = await getGeneral("14761");
@ -121,7 +121,12 @@ console.log(props)
// requestFunnel();
}, []);
if (Object.keys(props.data).length === 0) return <Typography textAlign="center" m="10px 0">нет данных о разделах</Typography>
if (Object.keys(props.data).length === 0)
return (
<Typography textAlign="center" m="10px 0">
нет данных о разделах
</Typography>
);
return (
<Paper
sx={{
@ -133,7 +138,11 @@ console.log(props)
}}
>
{Object.entries(FUNNEL_MOCK).map(([title, percent], index) => (
<FunnelItem key={title} title={title} percent={index > 0 ? props.data[index-1] : percent} />
<FunnelItem
key={title}
title={title}
percent={index > 0 ? props.data[index - 1] : percent}
/>
))}
</Paper>
);

7
src/pages/Analytics/Answers/Results.tsx
View File

@ -72,7 +72,12 @@ const Result = ({ title, percent, highlight }: ResultProps) => {
export const Results = (props) => {
const theme = useTheme();
if (Object.keys(props.data).length === 0) return <Typography margin="20px 0 0 0" textAlign="center" m="10px 0">нет данных о результатах</Typography>
if (Object.keys(props.data).length === 0)
return (
<Typography margin="20px 0 0 0" textAlign="center" m="10px 0">
нет данных о результатах
</Typography>
);
return (
<Box>
<Typography

2
src/pages/Analytics/Answers/index.tsx
View File

@ -17,7 +17,7 @@ export const AnswersStatistics = (props) => {
const isSmallMonitor = useMediaQuery(theme.breakpoints.down(1150));
const isMobile = useMediaQuery(theme.breakpoints.down(850));
console.log(props)
console.log(props);
return (
<Box sx={{ marginTop: "120px" }}>

5
src/pages/Analytics/Devices.tsx
View File

@ -27,8 +27,9 @@ const DEVICES_MOCK: DevicesResponse = {
const Device = ({ title, devices }: DeviceProps) => {
const theme = useTheme();
console.log("devices ", devices)
if (devices === undefined || Object.keys(devices).length === 0) return <Typography>{title} - нет данных</Typography>
console.log("devices ", devices);
if (devices === undefined || Object.keys(devices).length === 0)
return <Typography>{title} - нет данных</Typography>;
const data = Object.entries(devices).map(([id, value], index) => ({
id,
value,

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

@ -38,11 +38,7 @@ const GeneralItem = ({ title, general, color, numberType }: GeneralProps) => {
: Object.entries(general).reduce(
(total, [key, value]) => total + (value / Number(key)) * 100,
0,
) / Object.keys(general).length
||
Number(0)
;
) / Object.keys(general).length || Number(0);
return (
<Paper
sx={{
@ -70,12 +66,16 @@ const GeneralItem = ({ title, general, color, numberType }: GeneralProps) => {
};
export const General = (props: any) => {
const theme = useTheme();
const isTablet = useMediaQuery(theme.breakpoints.down(1000));
const isMobile = useMediaQuery(theme.breakpoints.down(700));
if (Object.keys(props.data).length === 0) return <Typography textAlign="center" m="10px 0">нет данных о ключевых метриках</Typography>
if (Object.keys(props.data).length === 0)
return (
<Typography textAlign="center" m="10px 0">
нет данных о ключевых метриках
</Typography>
);
return (
<Box sx={{ marginTop: "45px" }}>
<Typography

4
src/pages/Questions/DraggableList/index.tsx
View File

@ -28,8 +28,8 @@ export const DraggableList = ({
useEffect(() => {
if (!isLoading && quiz && !filteredQuestions.length) {
console.log("useEffect", quiz)
console.log(Number(quiz.backendId))
console.log("useEffect", quiz);
console.log(Number(quiz.backendId));
createUntypedQuestion(Number(quiz.backendId));
}
}, [quiz, filteredQuestions]);

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

@ -36,7 +36,7 @@ export default function QuestionsPage({
updateEditSomeQuestion();
}, []);
console.log("quiz", quiz)
console.log("quiz", quiz);
if (!quiz) return null;
return (

6
src/pages/Tariffs/Tabs.tsx
View File

@ -4,8 +4,8 @@ import { CustomTab } from "./CustomTab";
type TabsProps = {
names: string[];
items: string[];
selectedItem: "count" | "day";
setSelectedItem: (num: "count" | "day") => void;
selectedItem: "count" | "day" | "dop";
setSelectedItem: (num: "count" | "day" | "dop") => void;
};
export const Tabs = ({
@ -18,7 +18,7 @@ export const Tabs = ({
sx={{ m: "25px" }}
TabIndicatorProps={{ sx: { display: "none" } }}
value={selectedItem}
onChange={(event, newValue: "count" | "day") => {
onChange={(event, newValue: "count" | "day" | "dop") => {
setSelectedItem(newValue);
}}
variant="scrollable"

52
src/pages/Tariffs/Tariffs.tsx
View File

@ -38,6 +38,7 @@ import { activatePromocode } from "@api/promocode";
const StepperText: Record<string, string> = {
count: "Тарифы на объём",
day: "Тарифы на время",
dop: "Доп. услуги",
};
function TariffPage() {
@ -156,6 +157,19 @@ function TariffPage() {
);
});
const filteredBadgeTariffs = tariffs.filter((tariff) => {
return (
tariff.privileges[0].serviceKey === "squiz" &&
!tariff.isDeleted &&
!tariff.isCustom &&
tariff.privileges[0].privilegeId === "squizHideBadge" &&
tariff.privileges[0]?.type === "day"
);
});
const filteredBaseTariffs = filteredTariffs.filter((tariff) => {
return tariff.privileges[0].privilegeId !== "squizHideBadge";
});
async function handleLogoutClick() {
const [, logoutError] = await logout();
@ -251,6 +265,37 @@ function TariffPage() {
setSelectedItem={setSelectedItem}
/>
<Box
sx={{
justifyContent: "left",
display: selectedItem === "dop" ? "flex" : "grid",
gap: "40px",
p: "20px",
gridTemplateColumns: `repeat(auto-fit, minmax(300px, ${
isTablet ? "436px" : "360px"
}))`,
flexDirection: selectedItem === "dop" ? "column" : undefined,
}}
>
{selectedItem === "day" &&
createTariffElements(
filteredBaseTariffs,
true,
user,
discounts,
openModalHC,
)}
{selectedItem === "count" &&
createTariffElements(
filteredTariffs,
true,
user,
discounts,
openModalHC,
)}
{selectedItem === "dop" && (
<>
<Typography fontWeight={500}>Убрать логотип "PenaQuiz"</Typography>
<Box
sx={{
justifyContent: "left",
@ -263,13 +308,16 @@ function TariffPage() {
}}
>
{createTariffElements(
filteredTariffs,
true,
filteredBadgeTariffs,
false,
user,
discounts,
openModalHC,
)}
</Box>
</>
)}
</Box>
<Modal
open={Object.values(openModal).length > 0}
onClose={() => setOpenModal({})}

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

@ -197,7 +197,7 @@ export default function QuizCard({
height: "44px",
width: "44px",
border: `${theme.palette.brightPurple.main} 1px solid`,
borderRadius: "6px"
borderRadius: "6px",
}}
>
<ChartIcon />

8
src/stores/questions/actions.ts
View File

@ -44,7 +44,7 @@ export const createUntypedQuestion = (
) =>
setProducedState(
(state) => {
console.log("createUntypedQuestion", quizId)
console.log("createUntypedQuestion", quizId);
const newUntypedQuestion = {
id: nanoid(),
quizId,
@ -278,7 +278,7 @@ export const updateQuestion = async <T = AnyTypedQuizQuestion>(
if (!q) return;
if (q.type === null)
throw new Error("Cannot send update request for untyped question");
console.log("отправляемый квешен", q)
console.log("отправляемый квешен", q);
try {
const response = await questionApi.edit(
questionToEditQuestionRequest(replaceEmptyLinesToSpace(q)),
@ -449,8 +449,8 @@ export const createTypedQuestion = async (
requestQueue.enqueue(`createTypedQuestion-${questionId}`, async () => {
const questions = useQuestionsStore.getState().questions;
const question = questions.find((q) => q.id === questionId);
console.log("createTypedQuestion", question)
console.log("createTypedQuestion", question?.quizId)
console.log("createTypedQuestion", question);
console.log("createTypedQuestion", question?.quizId);
if (!question) return;
if (question.type !== null)
throw new Error("Cannot upgrade already typed question");

11
src/ui_kit/Modal/CropModal.tsx
View File

@ -67,7 +67,7 @@ export const CropModal: FC<Props> = ({
setCropModalImageBlob,
onSaveImageClick,
onClose,
questionId
questionId,
}) => {
const theme = useTheme();
const [percentCrop, setPercentCrop] = useState<PercentCrop>();
@ -297,13 +297,13 @@ export const CropModal: FC<Props> = ({
onChange={(_, newValue) => setDarken(newValue as number)}
/>
</Box>
{questionId !== undefined &&
{questionId !== undefined && (
<IconButton
onClick={() => {
updateQuestion(questionId, (question) => {
question.content.back = null;
question.content.originalBack = null;
})
});
onClose();
}}
sx={{
@ -316,7 +316,7 @@ export const CropModal: FC<Props> = ({
>
<DeleteIcon />
</IconButton>
}
)}
</Box>
<Box
sx={{
@ -351,7 +351,8 @@ export const CropModal: FC<Props> = ({
background: theme.palette.brightPurple.main,
fontSize: "18px",
color: "#7E2AEA",
border: `1px solid ${!completedCrop ? "rgba(0, 0, 0, 0.26)" : "#7E2AEA"
border: `1px solid ${
!completedCrop ? "rgba(0, 0, 0, 0.26)" : "#7E2AEA"
}`,
backgroundColor: "transparent",
}}

30
src/utils/hooks/useAnalytics.ts
View File

@ -8,30 +8,24 @@ interface Props {
from: number;
}
export function useAnalytics({
quizId,
to,
from,
}: Props) {
const formatTo = to === null ? 0 : moment(to).unix()
const formatFrom = from === null ? 0 : moment(from).unix()
console.log(
to,
from,)
if (quizId === undefined) return {}
export function useAnalytics({ quizId, to, from }: Props) {
const formatTo = to === null ? 0 : moment(to).unix();
const formatFrom = from === null ? 0 : moment(from).unix();
console.log(to, from);
if (quizId === undefined) return {};
const [devices, setDevices] = useState({});
const [general, setGeneral] = useState({});
const [questions, setQuestions] = useState({});
useEffect(() => {
(async () => {
const gottenGeneral = await getGeneral(quizId, formatTo, formatFrom)
const gottenDevices = await getDevices(quizId, formatTo, formatFrom)
const gottenQuestions = await getQuestions(quizId, formatTo, formatFrom)
setDevices(gottenGeneral[0])
setGeneral(gottenDevices[0])
setQuestions(gottenQuestions[0])
})()
const gottenGeneral = await getGeneral(quizId, formatTo, formatFrom);
const gottenDevices = await getDevices(quizId, formatTo, formatFrom);
const gottenQuestions = await getQuestions(quizId, formatTo, formatFrom);
setDevices(gottenGeneral[0]);
setGeneral(gottenDevices[0]);
setQuestions(gottenQuestions[0]);
})();
}, [to, from]);
return { devices, general, questions };