From d4fede1016f1fddf5b876548baf8c8476dfd618f Mon Sep 17 00:00:00 2001 From: Tamara Date: Tue, 28 Nov 2023 22:41:09 +0300 Subject: [PATCH] =?UTF-8?q?=D1=84=D0=BE=D1=80=D0=BC=D0=B8=D0=BA=20=D0=B4?= =?UTF-8?q?=D0=BB=D1=8F=20=D1=81=D1=82=D1=80=D0=B0=D0=BD=D0=B8=D1=86=20?= =?UTF-8?q?=D1=82=D0=B0=D1=80=D0=B8=D1=84=D0=BE=D0=B2=20=D0=B8=20=D1=81?= =?UTF-8?q?=D0=BA=D0=B8=D0=B4=D0=BE=D0=BA=20=D0=B3=D0=BE=D1=82=D0=BE=D0=B2?= =?UTF-8?q?=D0=BE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../DiscountManagement/CreateDiscount.tsx | 148 +++++++++++++----- .../Content/Tariffs/CreateTariff.tsx | 91 +++++++---- 2 files changed, 175 insertions(+), 64 deletions(-) diff --git a/src/pages/dashboard/Content/DiscountManagement/CreateDiscount.tsx b/src/pages/dashboard/Content/DiscountManagement/CreateDiscount.tsx index 68689a3..5e2b677 100644 --- a/src/pages/dashboard/Content/DiscountManagement/CreateDiscount.tsx +++ b/src/pages/dashboard/Content/DiscountManagement/CreateDiscount.tsx @@ -12,9 +12,7 @@ import { } from "@mui/material"; import MenuItem from "@mui/material/MenuItem"; import Select, { SelectChangeEvent } from "@mui/material/Select"; -import { useState } from "react"; import { SERVICE_LIST, ServiceType } from "@root/model/tariff"; -import { CustomTextField } from "@root/kitUI/CustomTextField"; import { resetPrivilegeArray, usePrivilegeStore, @@ -25,7 +23,6 @@ import { DiscountType, discountTypes } from "@root/model/discount"; import { createDiscount } from "@root/api/discounts"; import usePrivileges from "@root/utils/hooks/usePrivileges"; import { Formik, Field, Form, FormikHelpers } from "formik"; -import OutlinedInput from "@kitUI/outlinedInput"; interface Values { discountNameField: string, @@ -42,32 +39,9 @@ interface Values { export default function CreateDiscount() { const theme = useTheme(); const privileges = usePrivilegeStore((state) => state.privileges); - const [serviceType, setServiceType] = useState("templategen"); - const [discountType, setDiscountType] = - useState("purchasesAmount"); - const [discountNameField, setDiscountNameField] = useState(""); - const [discountDescriptionField, setDiscountDescriptionField] = - useState(""); - const [privilegeIdField, setPrivilegeIdField] = useState(""); - const [discountFactorField, setDiscountFactorField] = useState("0"); - const [purchasesAmountField, setPurchasesAmountField] = useState("0"); - const [cartPurchasesAmountField, setCartPurchasesAmountField] = - useState("0"); - const [discountMinValueField, setDiscountMinValueField] = - useState("0"); usePrivileges({ onNewPrivileges: resetPrivilegeArray }); - const handleDiscountTypeChange = ( - event: React.ChangeEvent - ) => { - setDiscountType(event.target.value as DiscountType); - }; - - const handleServiceTypeChange = (event: SelectChangeEvent) => { - setServiceType(event.target.value as ServiceType); - }; - const initialValues: Values = { discountNameField: "", discountDescriptionField: "", @@ -135,8 +109,12 @@ export default function CreateDiscount() { if (!isFinite(((100 - parseFloat(values.discountFactorField.replace(",", "."))) / 100))) { errors.discountFactorField = 'Поле "Процент скидки" не число' } - if (values.discountType === "privilege" && !values.privilegeIdField) + if (values.discountType === "privilege" && !values.privilegeIdField) { errors.privilegeIdField = "Привилегия не выбрана" + } + if (values.discountType === "service" && !values.serviceType) { + errors.serviceType = "Сервис не выбран" + } if (values.discountType === "purchasesAmount" && !isFinite(parseFloat(values.purchasesAmountField.replace(",", ".")))) { errors.purchasesAmountField = 'Поле "Внесено больше" не число' } @@ -173,9 +151,10 @@ export default function CreateDiscount() { }} > } + InputProps={{ + style: { + backgroundColor: theme.palette.content.main, + color: theme.palette.secondary.main, + } + }} + InputLabelProps={{ + style: { + color: theme.palette.secondary.main + } + }} /> Условия: - { - props.setFieldValue("discountFactorField", e.target.value.replace(/[^\d]/g, '')) + helperText={ + + {props.errors.discountFactorField} + + } + InputProps={{ + style: { + backgroundColor: theme.palette.content.main, + color: theme.palette.secondary.main, + } + }} + InputLabelProps={{ + style: { + color: theme.palette.secondary.main + } }} - onBlur={props.handleBlur} /> {props.values.discountType === "purchasesAmount" && ( - { @@ -279,13 +284,30 @@ export default function CreateDiscount() { sx={{ marginTop: "15px", }} + helperText={ + + {props.errors.purchasesAmountField} + + } + InputProps={{ + style: { + backgroundColor: theme.palette.content.main, + color: theme.palette.secondary.main, + } + }} + InputLabelProps={{ + style: { + color: theme.palette.secondary.main + } + }} /> )} {props.values.discountType === "cartPurchasesAmount" && ( - { props.setFieldValue("cartPurchasesAmountField", e.target.value.replace(/[^\d]/g, '')) @@ -295,6 +317,22 @@ export default function CreateDiscount() { sx={{ marginTop: "15px", }} + helperText={ + + {props.errors.cartPurchasesAmountField} + + } + InputProps={{ + style: { + backgroundColor: theme.palette.content.main, + color: theme.palette.secondary.main, + } + }} + InputLabelProps={{ + style: { + color: theme.palette.secondary.main + } + }} /> )} {props.values.discountType === "service" && ( @@ -325,10 +363,12 @@ export default function CreateDiscount() { ))} - { props.setFieldValue("discountMinValueField", e.target.value.replace(/[^\d]/g, '')) }} @@ -337,6 +377,22 @@ export default function CreateDiscount() { sx={{ marginTop: "15px", }} + helperText={ + + {props.errors.discountMinValueField} + + } + InputProps={{ + style: { + backgroundColor: theme.palette.content.main, + color: theme.palette.secondary.main, + } + }} + InputLabelProps={{ + style: { + color: theme.palette.secondary.main + } + }} /> )} @@ -393,18 +449,36 @@ export default function CreateDiscount() { ))} - { props.setFieldValue("discountMinValueField", e.target.value.replace(/[^\d]/g, '')) }} - error={props.touched.discountMinValueField && !!props.errors.discountMinValueField} value={props.values.discountMinValueField} + error={props.touched.discountMinValueField && !!props.errors.discountMinValueField} sx={{ marginTop: "15px", }} + helperText={ + + {props.errors.discountMinValueField} + + } + InputProps={{ + style: { + backgroundColor: theme.palette.content.main, + color: theme.palette.secondary.main, + } + }} + InputLabelProps={{ + style: { + color: theme.palette.secondary.main + } + }} /> )} diff --git a/src/pages/dashboard/Content/Tariffs/CreateTariff.tsx b/src/pages/dashboard/Content/Tariffs/CreateTariff.tsx index 703bc77..5f16b66 100644 --- a/src/pages/dashboard/Content/Tariffs/CreateTariff.tsx +++ b/src/pages/dashboard/Content/Tariffs/CreateTariff.tsx @@ -1,4 +1,3 @@ -import { useState } from "react"; import { Typography, Container, @@ -8,11 +7,9 @@ import { FormControl, InputLabel, useTheme, - Box, + Box, TextField, } from "@mui/material"; import { enqueueSnackbar } from "notistack"; -import OutlinedInput from "@kitUI/outlinedInput"; -import { CustomTextField } from "@root/kitUI/CustomTextField"; import { requestTariffs } from "@root/services/tariffs.service"; import { createTariff } from "@root/api/tariffs"; @@ -20,6 +17,7 @@ import { findPrivilegeById, usePrivilegeStore, } from "@root/stores/privilegesStore"; +import { PrivilegeWithAmount } from "@frontend/kitui"; import { currencyFormatter } from "@root/utils/currencyFormatter"; import { Formik, Field, Form, FormikHelpers } from "formik"; @@ -28,6 +26,7 @@ interface Values { amountField: string, customPriceField: string, privilegeIdField: string, + privilege: PrivilegeWithAmount | null } export default function CreateTariff() { @@ -35,13 +34,6 @@ export default function CreateTariff() { const privileges = usePrivilegeStore((store) => store.privileges); - // const [nameField, setNameField] = useState(""); - // const [amountField, setAmountField] = useState(""); - // const [customPriceField, setCustomPriceField] = useState(""); - const [privilegeIdField, setPrivilegeIdField] = useState(""); - - const privilege = findPrivilegeById(privilegeIdField); - const checkFulledFields = (values: Values) => { const errors = {} as any; @@ -64,26 +56,27 @@ export default function CreateTariff() { amountField: "", customPriceField: "", privilegeIdField: "", + privilege: null }; const createTariffBackend = async ( values: Values, formikHelpers: FormikHelpers ) => { - if (privilege !== null) { + if (values.privilege !== null) { const [_, createdTariffError] = await createTariff({ name: values.nameField, price: Number(values.customPriceField) * 100, isCustom: false, privileges: [ { - name: privilege.name, - privilegeId: privilege.privilegeId ?? "", - serviceKey: privilege.serviceKey, - description: privilege.description, - type: privilege.type, - value: privilege.value ?? "", - price: privilege.price, + name: values.privilege.name, + privilegeId: values.privilege.privilegeId ?? "", + serviceKey: values.privilege.serviceKey, + description: values.privilege.description, + type: values.privilege.type, + value: values.privilege.value ?? "", + price: values.privilege.price, amount: Number(values.amountField), }, ], @@ -165,6 +158,9 @@ export default function CreateTariff() { error={props.touched.privilegeIdField && !!props.errors.privilegeIdField} onChange={(e) => { props.setFieldValue("privilegeIdField", e.target.value) + props.setFieldValue("privilege", findPrivilegeById(e.target.value)) + if (props.values.privilege === null) + return enqueueSnackbar("Привилегия не найдена"); }} onBlur={props.handleBlur} sx={{ @@ -191,7 +187,7 @@ export default function CreateTariff() { ))} - {privilege && ( + {props.values.privilege && ( - Имя: {privilege.name} + Имя: {props.values.privilege.name} - Сервис: {privilege.serviceKey} + Сервис: {props.values.privilege.serviceKey} - Единица: {privilege.type} + Единица: {props.values.privilege.type} - Стандартная цена за единицу: {currencyFormatter.format(privilege.price / 100)} + Стандартная цена за единицу: {currencyFormatter.format(props.values.privilege.price / 100)} )} } + InputProps={{ + style: { + backgroundColor: theme.palette.content.main, + color: theme.palette.secondary.main, + } + }} + InputLabelProps={{ + style: { + color: theme.palette.secondary.main + } + }} /> - { props.setFieldValue("amountField", e.target.value.replace(/[^\d]/g,'')) }} value={props.values.amountField} onBlur={props.handleBlur} label="Кол-во единиц привилегии" + error={props.touched.amountField && !!props.errors.amountField} + helperText={ + + {props.errors.amountField} + + } + InputProps={{ + style: { + backgroundColor: theme.palette.content.main, + color: theme.palette.secondary.main, + } + }} + InputLabelProps={{ + style: { + color: theme.palette.secondary.main + } + }} /> - { props.setFieldValue("customPriceField", e.target.value.replace(/[^\d]/g,'')) }} value={props.values.customPriceField} onBlur={props.handleBlur} label="Кастомная цена (не обязательно)" + InputProps={{ + style: { + backgroundColor: theme.palette.content.main, + color: theme.palette.secondary.main, + } + }} + InputLabelProps={{ + style: { + color: theme.palette.secondary.main + } + }} />