add adminns

2025-12-30 10:32:28 +03:30
parent 342326432d
commit bc61ea6a20
6 changed files with 307 additions and 38 deletions
@@ -0,0 +1,125 @@
+import { FC } from 'react'
+import { useFormik } from 'formik'
+import * as Yup from 'yup'
+import { useTranslation } from 'react-i18next'
+import { AddAdminRestaurantType } from '../../types/Types'
+import Input from '../../../../components/Input'
+import Select from '../../../../components/Select'
+import Button from '../../../../components/Button'
+import { useAddAdminRestaurant, useGetSystemRoles } from '../../hooks/useIconData'
+import { SystemRoleType } from '../../types/Types'
+import { ErrorType } from '../../../../helpers/types'
+import { toast } from 'react-toastify'
+import { TickCircle } from 'iconsax-react'
+
+interface AddRestaurantAdminFormProps {
+    restaurantId: string
+    onSuccess: () => void
+    onClose: () => void
+}
+
+const AddRestaurantAdminForm: FC<AddRestaurantAdminFormProps> = ({
+    restaurantId,
+    onSuccess,
+    onClose
+}) => {
+    const { t } = useTranslation('global')
+    const { mutate: addAdmin, isPending } = useAddAdminRestaurant()
+    const { data: rolesData } = useGetSystemRoles()
+
+    const rolesList = rolesData?.data || []
+
+    const formik = useFormik<AddAdminRestaurantType>({
+        initialValues: {
+            restaurantId: restaurantId,
+            phone: '',
+            firstName: '',
+            lastName: '',
+            roleId: ''
+        },
+        validationSchema: Yup.object({
+            phone: Yup.string().required(t('errors.required')),
+            firstName: Yup.string().required(t('errors.required')),
+            lastName: Yup.string().required(t('errors.required')),
+            roleId: Yup.string().required(t('errors.required'))
+        }),
+        onSubmit: (values) => {
+            addAdmin(values, {
+                onSuccess: () => {
+                    toast.success(t('success'))
+                    formik.resetForm()
+                    onSuccess()
+                    onClose()
+                },
+                onError: (error: ErrorType) => {
+                    toast.error(error.response?.data?.error?.message[0])
+                }
+            })
+        }
+    })
+
+    return (
+        <form onSubmit={formik.handleSubmit} className='mt-6'>
+            <div className='flex flex-col gap-6'>
+                <div className='rowTwoInput'>
+                    <Input
+                        label={t('user.name')}
+                        {...formik.getFieldProps('firstName')}
+                        error_text={formik.touched.firstName && formik.errors.firstName ? formik.errors.firstName : ''}
+                    />
+                    <Input
+                        label={t('user.family')}
+                        {...formik.getFieldProps('lastName')}
+                        error_text={formik.touched.lastName && formik.errors.lastName ? formik.errors.lastName : ''}
+                    />
+                </div>
+
+                <div className='rowTwoInput'>
+                    <Input
+                        label={t('restaurant.phone')}
+                        {...formik.getFieldProps('phone')}
+                        error_text={formik.touched.phone && formik.errors.phone ? formik.errors.phone : ''}
+                    />
+                    <Select
+                        label={t('user.role')}
+                        placeholder={t('select')}
+                        items={rolesList.map((item: SystemRoleType) => ({
+                            value: item.id,
+                            label: item.name
+                        }))}
+                        {...formik.getFieldProps('roleId')}
+                        error_text={formik.touched.roleId && formik.errors.roleId ? formik.errors.roleId : ''}
+                    />
+                </div>
+
+                <div className='flex gap-4 justify-end mt-4'>
+                    <Button
+                        type='button'
+                        onClick={onClose}
+                        className='px-6 bg-gray-200 text-gray-700 hover:bg-gray-300'
+                    >
+                        {t('cancel')}
+                    </Button>
+                    <Button
+                        type='submit'
+                        isLoading={isPending}
+                        className='px-6'
+                    >
+                        <div className='flex gap-2'>
+                            <TickCircle
+                                className='size-5'
+                                color='white'
+                            />
+                            <div className='text-sm'>
+                                {t('restaurant.add_admin')}
+                            </div>
+                        </div>
+                    </Button>
+                </div>
+            </div>
+        </form>
+    )
+}
+
+export default AddRestaurantAdminForm
+