From 11fb28dc5801e3c6655213b1c453e459298ca110 Mon Sep 17 00:00:00 2001 From: Nastya Date: Thu, 25 May 2023 15:09:58 +0300 Subject: [PATCH] start of custom --- .idea/workspace.xml | 27 ++- src/components/wideTemplCard.tsx | 1 - src/model/cutsomTariffs.ts | 13 ++ src/pages/CustomTariff/CustomTariff.tsx | 55 +++-- .../CustomTariff/TariffConstructorCard.tsx | 189 ------------------ .../CustomTariff/generalSettingsPanel.tsx | 52 +++++ .../CustomTariff/tariffConstructorCard.tsx | 74 +++++++ src/pages/Tariffs/TariffCard.tsx | 89 +++++---- src/pages/Tariffs/Tariffs.tsx | 2 +- src/stores/customTariffs.tsx | 37 ++++ 10 files changed, 284 insertions(+), 255 deletions(-) create mode 100644 src/model/cutsomTariffs.ts delete mode 100644 src/pages/CustomTariff/TariffConstructorCard.tsx create mode 100644 src/pages/CustomTariff/generalSettingsPanel.tsx create mode 100644 src/pages/CustomTariff/tariffConstructorCard.tsx create mode 100644 src/stores/customTariffs.tsx diff --git a/.idea/workspace.xml b/.idea/workspace.xml index 37de947..5c8f722 100644 --- a/.idea/workspace.xml +++ b/.idea/workspace.xml @@ -2,10 +2,13 @@ + + - - - + + + + @@ -50,7 +62,12 @@ - + + + + + + diff --git a/src/components/wideTemplCard.tsx b/src/components/wideTemplCard.tsx index 01b5fdb..ecbd771 100644 --- a/src/components/wideTemplCard.tsx +++ b/src/components/wideTemplCard.tsx @@ -16,7 +16,6 @@ interface Props { export default function ({light = true, sx}: Props) { const theme = useTheme(); const upMd = useMediaQuery(theme.breakpoints.up("md")); - console.log("я широкий") return state.values); + const [customTariffs, setCustomTariffs] = React.useState< Record | {}>({}); +// const putPrivilegies = () => { +// axios({ +// method: "get", +// url: "https://admin.pena.digital/strator/privilege/service" +// }) +// .then((e) => { +// setCustomTariffs(e.data) +// console.log(e.data) +// }) +// .catch(() => { +// enqueueSnackbar("произошла ошибка") +// }) +// }; + // putPrivilegies() return ( - + {/*{*/} + {/* Object.keys(customTariffs).map((e:string, i:number) => {*/} + {/* return*/} + {/* */} + {/* })*/} + {/*}*/} - + {/**/} - {time} - - ); - const quantityLabel = ( - - {quantity} - - ); - - return ( - - - - Текст-заполнитель — это текст, который имеет{" "} - - - - - - Время - - {upMd && timeLabel} - - - {!upMd && timeLabel} - - - - - - Объем - - {upMd && quantityLabel} - - - {!upMd && quantityLabel} - - - {!upMd && } - - - Чем больше пакеты, тем дешевле подписки и опции - - {discountText} - - - - Сумма с учетом скидки - - - {totalText} - - {totalWithoutDiscountText} - - - - Выбрать - - - - ); -} diff --git a/src/pages/CustomTariff/generalSettingsPanel.tsx b/src/pages/CustomTariff/generalSettingsPanel.tsx new file mode 100644 index 0000000..f2ad7f9 --- /dev/null +++ b/src/pages/CustomTariff/generalSettingsPanel.tsx @@ -0,0 +1,52 @@ +import {Box, Divider, IconButton, Typography, useMediaQuery, useTheme} from "@mui/material"; +import CalendarIcon from "@components/icons/CalendarIcon"; +import CustomSlider from "@components/CustomSlider"; +import CustomButton from "@components/CustomButton"; +import TariffConstructorCard from "./tariffConstructorCard"; +import ComplexHeader from "@components/ComplexHeader"; +import {SourceTariff} from "@root/model/cutsomTariffs"; + +interface Props { + header: string + values: SourceTariff[] +} + +export default function ({ +header, +values +}: Props) { + const theme = useTheme(); + const upMd = useMediaQuery(theme.breakpoints.up("md")); +console.log(values) + return ( + <> + + + { + values.map((e:SourceTariff, i:number) => { + return + }) + } + + + + ) +} \ No newline at end of file diff --git a/src/pages/CustomTariff/tariffConstructorCard.tsx b/src/pages/CustomTariff/tariffConstructorCard.tsx new file mode 100644 index 0000000..3e19d37 --- /dev/null +++ b/src/pages/CustomTariff/tariffConstructorCard.tsx @@ -0,0 +1,74 @@ +import {Box, Divider, Typography, useMediaQuery, useTheme} from "@mui/material"; +import CustomButton from "../../components/CustomButton"; +import CustomSlider from "../../components/CustomSlider"; +import CalendarIcon from "../../components/icons/CalendarIcon"; + +interface Props { + name: string, + desc: string +} + +export default function TariffConstructorCard({ + name, + desc +}: Props) { + const theme = useTheme(); + const upMd = useMediaQuery(theme.breakpoints.up("md")); + + const timeLabel = ( + + s + + ); + const quantityLabel = ( + + w + + ); + + return ( + + + {desc} + + + + + + {name} + + {upMd && timeLabel} + + console.log(e)}/> + {!upMd && timeLabel} + + + ); +} diff --git a/src/pages/Tariffs/TariffCard.tsx b/src/pages/Tariffs/TariffCard.tsx index 59d8a4f..6bb4fea 100644 --- a/src/pages/Tariffs/TariffCard.tsx +++ b/src/pages/Tariffs/TariffCard.tsx @@ -1,54 +1,55 @@ -import { Box, SxProps, Theme, useTheme } from "@mui/material"; -import { useNavigate } from "react-router-dom"; +import {Box, SxProps, Theme, useTheme} from "@mui/material"; +import {useNavigate} from "react-router-dom"; import Typography from "@mui/material/Typography"; import CustomButton from "@components/CustomButton"; interface Props { - icon: React.ReactNode; - headerText: string; - text: string; - sx?: SxProps; - href: string; + icon: React.ReactNode; + headerText: string; + text: string; + sx?: SxProps; + href: string; } -export default function TariffCard({ icon, headerText, text, sx, href }: Props) { - const theme = useTheme(); - const navigate = useNavigate(); +export default function TariffCard({icon, headerText, text, sx, href}: Props) { + const theme = useTheme(); + const navigate = useNavigate(); - return ( - - {icon} - - {headerText} - - {text} + return ( + + {icon} + + {headerText} + + {text} - navigate(href)} - variant="outlined" - sx={{ - color: theme.palette.brightPurple.main, - borderColor: theme.palette.brightPurple.main, - mt: "33px", - }} - > - Подробнее - - - ); + + navigate(href)} + variant="outlined" + sx={{ + color: theme.palette.brightPurple.main, + borderColor: theme.palette.brightPurple.main, + mt: "33px", + }} + > + Подробнее + + + ); } diff --git a/src/pages/Tariffs/Tariffs.tsx b/src/pages/Tariffs/Tariffs.tsx index 4ea97c2..609b3b0 100644 --- a/src/pages/Tariffs/Tariffs.tsx +++ b/src/pages/Tariffs/Tariffs.tsx @@ -54,7 +54,7 @@ export default function Tariffs() { icon={} headerText="Кастом" text="Текст-заполнитель — это текст, который имеет " - href="#" + href="/tariffconstructor" /> diff --git a/src/stores/customTariffs.tsx b/src/stores/customTariffs.tsx new file mode 100644 index 0000000..e67c357 --- /dev/null +++ b/src/stores/customTariffs.tsx @@ -0,0 +1,37 @@ +import { create } from "zustand"; +import { persist } from "zustand/middleware"; + + +interface CustomTariffsStore { + values: {string: { + value: number + }} | {} +} + +export const useCustomTariffsStore = create()( + persist( + (set, get) => ({ + values: {} + }), + { + name: "customTariffs" + } + ) +); + +// export const setTicketCount = (ticketCount: number) => useTicketStore.setState({ ticketCount }); +// +// export const setTicketsFetchState = (fetchState: TicketStore["fetchState"]) => useTicketStore.setState({ fetchState }); +// +// export const setTicketApiPage = (apiPage: number) => useTicketStore.setState({ apiPage: apiPage }); +// +// export const updateTickets = (receivedTickets: Ticket[]) => { +// const state = useTicketStore.getState(); +// const ticketIdToTicketMap: { [ticketId: string]: Ticket; } = {}; +// +// [...state.tickets, ...receivedTickets].forEach(ticket => ticketIdToTicketMap[ticket.id] = ticket); +// +// useTicketStore.setState({ tickets: Object.values(ticketIdToTicketMap) }); +// }; +// +// export const clearTickets = () => useTicketStore.setState({ tickets: [] }); \ No newline at end of file