import {ContextModalProps} from "@mantine/modals";
import BaseFormModal, {CreateEditFormProps} from "../../ClientsPage/modals/BaseFormModal/BaseFormModal.tsx";
import {DealServiceSchema} from "../../../client";
import {useForm} from "@mantine/form";
import {NumberInput} from "@mantine/core";
import ServiceSelect from "../../../components/ServiceSelect/ServiceSelect.tsx";

type Props = CreateEditFormProps<Partial<DealServiceSchema>>;
const AddDealServiceModal = ({
                                 context,
                                 id,
                                 innerProps
                             }: ContextModalProps<Props>) => {
    const form = useForm<Partial<DealServiceSchema>>({
        initialValues: {
            service: undefined,
            quantity: 0,
        },
        validate: {
            service: (service?: DealServiceSchema['service']) => service !== undefined ? null : "Необходимо выбрать услугу",
            quantity: (quantity?: number) => (quantity && quantity > 0) ? null : "Количество должно быть больше 0"
        }
    });
    const onClose = () => {
        context.closeContextModal(id);
    }


    return (
        <BaseFormModal
            {...innerProps}
            form={form}
            closeOnSubmit
            onClose={onClose}>
            <BaseFormModal.Body>
                <>
                    <ServiceSelect
                        placeholder={"Выберите услугу"}
                        label={"Услуга"}
                        {...form.getInputProps('service')}
                    />
                    <NumberInput
                        placeholder={"Введите количество"}
                        label={"Количество"}
                        min={1}
                        {...form.getInputProps('quantity')}
                    />
                </>

            </BaseFormModal.Body>
        </BaseFormModal>
    )
}

export default AddDealServiceModal;