create attibute value

2026-01-25 11:43:57 +03:30
parent 69fb2786bc
commit d3eab9ed75
8 changed files with 189 additions and 1 deletions
@@ -0,0 +1,99 @@
+import { useState, type FC } from 'react'
+import Button from '@/components/Button'
+import { AddSquare, TickCircle } from 'iconsax-react'
+import DefaulModal from '@/components/DefaulModal'
+import { useFormik } from 'formik'
+import type { CreateAttributeValueType } from '../types/Types'
+import * as Yup from 'yup'
+import Input from '@/components/Input'
+import { useCreateAttributeValue } from '../hooks/useProductData'
+import { extractErrorMessage } from '@/config/func'
+import { toast } from 'react-toastify'
+
+type Props = {
+    id: number,
+    refetch: () => void,
+}
+
+const CreateValue: FC<Props> = ({ id, refetch }) => {
+
+
+    const { mutate: createValue } = useCreateAttributeValue()
+    const [showModal, setShowModal] = useState<boolean>(false)
+
+    const formik = useFormik<CreateAttributeValueType>({
+        initialValues: {
+            value: '',
+            order: 1
+        },
+        validationSchema: Yup.object({
+            value: Yup.string().required('این فیلد اجباری است')
+        }),
+        onSubmit: (values) => {
+            createValue({ id: id, params: values }, {
+                onSuccess: () => {
+                    refetch()
+                    setShowModal(false)
+                },
+                onError: (error) => {
+                    toast.error(extractErrorMessage(error))
+                }
+
+            })
+        }
+    })
+
+    return (
+        <div>
+            <Button
+                className='w-fit px-6'
+                onClick={() => setShowModal(true)}
+            >
+                <div className='flex gap-1.5'>
+                    <AddSquare size={18} color='black' />
+                    <div className='text-[13px] font-light'>مقدار جدید</div>
+                </div>
+            </Button>
+
+            <DefaulModal
+                open={showModal}
+                close={() => setShowModal(false)}
+                isHeader
+                title_header='ساخت مقدار جدید'
+            >
+                <div className='mt-5'>
+                    <Input
+                        label='مقدار'
+                        {...formik.getFieldProps('value')}
+                        error_text={formik.touched.value && formik.errors.value ? formik.errors.value : ''}
+                    />
+                </div>
+
+                <div className='mt-5'>
+                    <Input
+                        label='ترتیب اولویت'
+                        {...formik.getFieldProps('order')}
+                    />
+                </div>
+
+                <div className='mt-6 flex justify-end'>
+                    <Button
+                        className='w-fit px-6'
+                        onClick={() => formik.handleSubmit()}
+                    >
+                        <div className='flex gap-2 items-center'>
+                            <TickCircle
+                                size={18}
+                                color='black'
+                            />
+                            <div>ذخیره</div>
+                        </div>
+                    </Button>
+                </div>
+
+            </DefaulModal>
+        </div>
+    )
+}
+
+export default CreateValue