124 lines
3.7 KiB
TypeScript
124 lines
3.7 KiB
TypeScript
import { Tariff, calcTariffPrice } from "@frontend/kitui";
|
|
import TariffCard from "./TariffCard";
|
|
import NumberIcon from "@icons/NumberIcon";
|
|
import { currencyFormatter } from "./currencyFormatter";
|
|
import FreeTariffCard from "./FreeTariffCard";
|
|
import { Box, Icon, Typography } from "@mui/material";
|
|
import { startCC } from "@/stores/cc";
|
|
import { FC, ReactNode } from "react";
|
|
|
|
export const createTariffElements = (
|
|
filteredTariffs: Tariff[],
|
|
addFreeTariff = false,
|
|
user: any,
|
|
discounts: any,
|
|
onclick: any,
|
|
sendRequest?: () => void,
|
|
cc?: boolean,
|
|
icon?: ReactNode
|
|
) => {
|
|
console.log("start work createTariffElements")
|
|
console.log("filteredTariffs ", filteredTariffs)
|
|
console.log("user ", user)
|
|
console.log("user.isUserNko, ", user.isUserNko)
|
|
const tariffElements = filteredTariffs
|
|
.filter((tariff) => tariff.privileges.length > 0)
|
|
.map((tariff, index) => {
|
|
const { priceBeforeDiscounts, priceAfterDiscounts } = calcTariffPrice(
|
|
tariff,
|
|
discounts,
|
|
user.wallet.spent,
|
|
[],
|
|
user.status === "nko",
|
|
user.userId,
|
|
);
|
|
|
|
return (
|
|
<TariffCard
|
|
key={tariff._id}
|
|
discount={
|
|
priceBeforeDiscounts - priceAfterDiscounts
|
|
? `${(
|
|
(priceBeforeDiscounts - priceAfterDiscounts) /
|
|
(Math.trunc(priceBeforeDiscounts) / 100)
|
|
).toFixed(0)}%`
|
|
: ""
|
|
}
|
|
icon={
|
|
icon ?
|
|
<Box
|
|
sx={{
|
|
backgroundColor: "#EEE4FC",
|
|
width: "36px",
|
|
height: "36px",
|
|
borderRadius: "6px",
|
|
display: "flex",
|
|
alignItems: "center",
|
|
justifyContent: "center",
|
|
flexShrink: 0,
|
|
}}>
|
|
{icon}
|
|
</Box>
|
|
:
|
|
<NumberIcon
|
|
number={index + 1}
|
|
color={"#7e2aea"}
|
|
backgroundColor={"#EEE4FC"}
|
|
/>
|
|
}
|
|
buttonProps={{
|
|
text: "Купить",
|
|
onClick: () => {
|
|
if (cc) startCC() //пометка что это запрос на создание квиза
|
|
onclick({
|
|
id: tariff._id,
|
|
price: Math.trunc(priceAfterDiscounts) / 100,
|
|
})
|
|
}
|
|
}}
|
|
sendRequest={sendRequest}
|
|
headerText={tariff.name}
|
|
text={tariff.description}
|
|
price={
|
|
<>
|
|
{priceBeforeDiscounts !== priceAfterDiscounts && (
|
|
<Typography
|
|
sx={{
|
|
textDecorationLine: "line-through",
|
|
color: "#FB5607",
|
|
fontSize: "15px",
|
|
lineHeight: "21px",
|
|
}}
|
|
>
|
|
{currencyFormatter.format(
|
|
Math.trunc(priceBeforeDiscounts) / 100,
|
|
)}
|
|
</Typography>
|
|
)}
|
|
<Typography
|
|
sx={{
|
|
fontWeight: 500,
|
|
fontSize: "20px",
|
|
lineHeight: "24px",
|
|
color: "#4D4D4D",
|
|
}}
|
|
>
|
|
{currencyFormatter.format(
|
|
Math.trunc(priceAfterDiscounts) / 100,
|
|
)}
|
|
</Typography>
|
|
</>
|
|
}
|
|
/>
|
|
);
|
|
});
|
|
|
|
if (addFreeTariff) {
|
|
if (tariffElements.length < 6)
|
|
tariffElements.push(<FreeTariffCard key="free_tariff_card" />);
|
|
else tariffElements.splice(5, 0, <FreeTariffCard key="free_tariff_card" />);
|
|
}
|
|
|
|
return tariffElements;
|
|
};
|