import {ContextModalProps} from "@mantine/modals";
import {Fieldset, TextInput} from "@mantine/core";
import {useForm} from "@mantine/form";
import {ClientSchema} from "../../../../client";
import BaseFormModal, {CreateEditFormProps} from "../BaseFormModal/BaseFormModal.tsx";
import BarcodeTemplateSelect from "../../../../components/Selects/BarcodeTemplateSelect/BarcodeTemplateSelect.tsx";


type Props = CreateEditFormProps<ClientSchema>;

const ClientFormModal = ({
                             context,
                             id,
                             innerProps,
                         }: ContextModalProps<Props>) => {
    const isEditing = 'onChange' in innerProps;

    const initialValues: ClientSchema = isEditing ? innerProps.element : {
        id: -1,
        name: '',
        companyName: '',
        details: {
            telegram: '',
            phoneNumber: '',
            email: '',
            inn: undefined,
        }
    }
    const form = useForm<ClientSchema>({
        initialValues: initialValues,
        validate: {
            name: (name: string) => name.trim() !== '' ? null : "Необходимо ввести название клиента",
            // details: {
            // telegram: (address: string | undefined | null) => (address && address.trim() !== '') ? null : "Необходимо ввести телеграм",
            // phoneNumber: (phoneNumber: string | undefined | null) => (phoneNumber && phoneNumber.trim() !== '') ? null : "Необходимо ввести номер телефона",
            // email: (email: string | undefined | null) => (email && email.trim() !== '') ? null : "Необходимо ввести почту",
            // inn: (inn: string | undefined | null) => (inn && getDigitsCount(parseInt(inn)) >= 10) ? null : "ИНН должен содержать не менее 10 цифр",
            // }
        }
    })


    const onClose = () => {
        context.closeContextModal(id);
    }
    return (
        <BaseFormModal
            {...innerProps}
            closeOnSubmit
            form={form}
            onClose={onClose}
        >
            <BaseFormModal.Body>
                <>
                    <Fieldset legend={"Основная информация"}>
                        <TextInput
                            required
                            label={"Название клиента"}
                            placeholder={"Введите название клиента"}
                            {...form.getInputProps('name')}
                        />
                    </Fieldset>
                    <Fieldset legend={"Дополнительная информация"}>
                        <TextInput
                            label={"Телеграм"}
                            placeholder={"Введите телеграм"}
                            {...form.getInputProps('details.telegram')}
                        />
                        <TextInput
                            label={"Номер телефона"}
                            placeholder={"Введите номер телефона"}
                            {...form.getInputProps('details.phoneNumber')}
                        />
                        <TextInput
                            label={"Почта"}
                            placeholder={"Введите почту"}
                            {...form.getInputProps('details.email')}
                        />
                        <TextInput
                            label={"ИНН"}
                            placeholder={"Введите ИНН"}
                            {...form.getInputProps('details.inn')}
                        />
                        <TextInput
                            label={"Название компании"}
                            placeholder={"Введите название компании"}
                            {...form.getInputProps('companyName')}/>
                    </Fieldset>
                    <Fieldset legend={'Настройки'}>
                        <BarcodeTemplateSelect
                            label={'Шаблон штрихкодов'}
                            placeholder={'Выберите шаблон штрихкодов'}
                            {...form.getInputProps('barcodeTemplate')}
                        />
                    </Fieldset>
                </>

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

export default ClientFormModal;