Files
Fulfillment-Frontend/src/pages/LeadsPage/modals/AddDealProductModal.tsx
2024-05-18 07:01:08 +03:00

84 lines
3.3 KiB
TypeScript

import {ContextModalProps} from "@mantine/modals";
import BaseFormModal, {CreateEditFormProps} from "../../ClientsPage/modals/BaseFormModal/BaseFormModal.tsx";
import {DealProductSchema, DealProductServiceSchema} from "../../../client";
import {useForm} from "@mantine/form";
import {Fieldset, NumberInput} from "@mantine/core";
import ProductSelect from "../../../components/ProductSelect/ProductSelect.tsx";
import DealProductServiceTable from "../components/DealProductsTable/DealProductServiceTable.tsx";
import {omit} from "lodash";
import {BaseFormInputProps} from "../../../types/utils.ts";
type RestProps = {
clientId: number
}
type Props = CreateEditFormProps<DealProductSchema> & RestProps;
const AddDealProductModal = ({
context,
id,
innerProps
}: ContextModalProps<Props>) => {
const isEditing = 'element' in innerProps;
const restProps = omit(innerProps, ['clientId']);
const validateServices = (services?: DealProductServiceSchema[]) => {
if (!services || services.length == 0) return null;
console.log("validating...");
console.log( services.filter(service => service.service === undefined))
return services.find(service => service.service === undefined) ? "Удалите пустые услуги" : null;
}
const form = useForm<Partial<DealProductSchema>>({
initialValues: isEditing ? innerProps.element : {
product: undefined,
services: [],
quantity: 1
},
validate: {
product: (product?: DealProductSchema['product']) => product !== undefined ? null : "Необходимо выбрать товар",
quantity: (quantity?: number) => (quantity && quantity > 0) ? null : "Количество должно быть больше 0",
services: validateServices
}
});
const onClose = () => {
context.closeContextModal(id);
}
console.log(form.values)
return (
<BaseFormModal
{...restProps as CreateEditFormProps<DealProductSchema>}
form={form}
closeOnSubmit
onClose={onClose}>
<BaseFormModal.Body>
<>
<ProductSelect
placeholder={"Выберите товар"}
label={"Товар"}
clientId={innerProps.clientId}
{...form.getInputProps('product')}
/>
<NumberInput
placeholder={"Введите количество"}
label={"Количество"}
min={1}
{...form.getInputProps('quantity')}
/>
<Fieldset legend={'Услуги'}>
<DealProductServiceTable
quantity={form.values.quantity || 1}
{...form.getInputProps('services') as
BaseFormInputProps<DealProductServiceSchema[]>}
/>
</Fieldset>
</>
</BaseFormModal.Body>
</BaseFormModal>
)
}
export default AddDealProductModal;