diff --git a/src/assets/icons/NotebookWithPencil.tsx b/src/assets/icons/NotebookWithPencil.tsx new file mode 100644 index 00000000..c4581d1b --- /dev/null +++ b/src/assets/icons/NotebookWithPencil.tsx @@ -0,0 +1,22 @@ +import { useLocation } from "react-router-dom"; +import { Box, SxProps, Theme } from "@mui/material"; + +interface Props { + sx?: SxProps; +} +export default function NotebookWithPencil({ sx }: Props) { + return ( + + + + + + + + ); +} \ No newline at end of file diff --git a/src/assets/icons/SmallIconPena.tsx b/src/assets/icons/SmallIconPena.tsx new file mode 100644 index 00000000..44b3f0a9 --- /dev/null +++ b/src/assets/icons/SmallIconPena.tsx @@ -0,0 +1,23 @@ +import { useLocation } from "react-router-dom"; +import { Box, SxProps, Theme } from "@mui/material"; + +interface Props { + sx?: SxProps; +} +export default function SmallIconPena({ sx }: Props) { + return ( + + + + + + + + + ); +} \ No newline at end of file diff --git a/src/pages/Tariffs/pages/Other.tsx b/src/pages/Tariffs/pages/Other.tsx index ce9070dd..5373da51 100644 --- a/src/pages/Tariffs/pages/Other.tsx +++ b/src/pages/Tariffs/pages/Other.tsx @@ -1,6 +1,7 @@ import { Box, useMediaQuery, useTheme } from "@mui/material" import { NavCard } from "../components/NavCard" import { createTariffElements } from "../tariffsUtils/createTariffElements" +import SmallIconPena from "@/assets/icons/SmallIconPena" interface Props { content: { @@ -23,7 +24,7 @@ export const Other = ({ }: any) => { const theme = useTheme() const isTablet = useMediaQuery(theme.breakpoints.down(1000)); -const sendRequestToCreate = userPrivilegies?.quizManual?.amount > 0 ? startRequestCreate : undefined +const sendRequest = userPrivilegies?.quizManual?.amount > 0 ? startRequestCreate : undefined switch (selectedItem) { case "hide": @@ -78,8 +79,9 @@ const sendRequestToCreate = userPrivilegies?.quizManual?.amount > 0 ? startReque user, discounts, openModalHC, - sendRequestToCreate, - true + sendRequest, + true, + )} default: @@ -92,4 +94,4 @@ const sendRequestToCreate = userPrivilegies?.quizManual?.amount > 0 ? startReque {content.map(data => )} } -} \ No newline at end of file +} diff --git a/src/pages/Tariffs/tariffsUtils/TariffCard.tsx b/src/pages/Tariffs/tariffsUtils/TariffCard.tsx index 95b1d4af..a9f1f2f6 100644 --- a/src/pages/Tariffs/tariffsUtils/TariffCard.tsx +++ b/src/pages/Tariffs/tariffsUtils/TariffCard.tsx @@ -1,13 +1,13 @@ +import NotebookWithPencil from "@/assets/icons/NotebookWithPencil"; import { Box, Typography, - Tooltip, SxProps, Theme, Button, - Badge, useTheme, useMediaQuery, + IconButton, } from "@mui/material"; import { MouseEventHandler, ReactNode } from "react"; @@ -23,7 +23,7 @@ interface Props { text?: string; }; price?: ReactNode; - sendRequestToCreate?: () => void + sendRequest?: () => void } export default function TariffCard({ @@ -34,7 +34,7 @@ export default function TariffCard({ price, buttonProps, discount, - sendRequestToCreate, + sendRequest, }: Props) { text = Array.isArray(text) ? text : [text]; const theme = useTheme(); @@ -97,34 +97,34 @@ export default function TariffCard({ )} - - {headerText} - - - {text.map((line, index) => ( - - {line} - - ))} - + + {headerText} + + + {text.map((line, index) => ( + + {line} + + ))} + )} - {Boolean(sendRequestToCreate) && ( - + {isMobile ? + + + + : + + } + )} diff --git a/src/pages/Tariffs/tariffsUtils/createTariffElements.tsx b/src/pages/Tariffs/tariffsUtils/createTariffElements.tsx index bd3e0b79..704dd138 100644 --- a/src/pages/Tariffs/tariffsUtils/createTariffElements.tsx +++ b/src/pages/Tariffs/tariffsUtils/createTariffElements.tsx @@ -3,8 +3,9 @@ import TariffCard from "./TariffCard"; import NumberIcon from "@icons/NumberIcon"; import { currencyFormatter } from "./currencyFormatter"; import FreeTariffCard from "./FreeTariffCard"; -import { Typography } from "@mui/material"; +import { Box, Icon, Typography } from "@mui/material"; import { startCC } from "@/stores/cc"; +import { FC, ReactNode } from "react"; export const createTariffElements = ( filteredTariffs: Tariff[], @@ -12,8 +13,9 @@ export const createTariffElements = ( user: any, discounts: any, onclick: any, - sendRequestToCreate?: () => void, - cc?: boolean + sendRequest?: () => void, + cc?: boolean, + icon?: ReactNode ) => { const tariffElements = filteredTariffs .filter((tariff) => tariff.privileges.length > 0) @@ -39,11 +41,26 @@ export const createTariffElements = ( : "" } icon={ - + icon ? + + {icon} + + : + } buttonProps={{ text: "Купить", @@ -55,7 +72,7 @@ export const createTariffElements = ( }) } }} - sendRequestToCreate={sendRequestToCreate} + sendRequest={sendRequest} headerText={tariff.name} text={tariff.description} price={