formbuilder

src/config/Paths.tsx

@@ -20,6 +20,11 @@ export const Paths = {
             list: '/product/attribute-value/'
         }
     },
+    formBuilder: {
+        list: '/form-builder/list/',
+        create: '/form-builder/create/',
+        update: '/form-builder/update/',
+    },
     order: {
         list: '/order/list'
     },

src/pages/formBuilder/Create.tsx

@@ -1,40 +1,42 @@
 import { useFormik } from 'formik'
 import { type FC } from 'react'
-import type { CreateAttributeType } from '../types/Types'
-import { FieldTypeEnum } from '../enum/Enum'
+import type { CreateFieldType } from './types/Types'
+import { FieldTypeEnum } from './enum/Enum'
 import * as Yup from 'yup'
 import Button from '@/components/Button'
 import { AddSquare } from 'iconsax-react'
 import Input from '@/components/Input'
 import Select from '@/components/Select'
 import SwitchComponent from '@/components/Switch'
-import { useCreateAttribute } from '../hooks/useProductData'
+import { useCreateField } from './hooks/useFormBuilderData'
 import { useNavigate, useParams } from 'react-router-dom'
 import { toast } from 'react-toastify'
 import { extractErrorMessage } from '@/config/func'
 import { Paths } from '@/config/Paths'
 
-const CreateAttribute: FC = () => {
+const FormBuilderCreate: FC = () => {
 
-    const { id } = useParams()
+    const { id, type } = useParams()
     const navigate = useNavigate()
-    const { mutate: createAttribute, isPending } = useCreateAttribute()
+    const { mutate: createField, isPending } = useCreateField()
 
-    const formik = useFormik<CreateAttributeType>({
+    const formik = useFormik<CreateFieldType>({
         initialValues: {
             name: '',
             isRequired: true,
             order: 1,
             type: FieldTypeEnum.text,
+            entityType: 'product',
+            multiple: false,
         },
         validationSchema: Yup.object({
             name: Yup.string().required('این فیلد اجباری می باشد')
         }),
         onSubmit: (values) => {
-            createAttribute({ id: Number(id), params: values }, {
+            createField({ id: Number(id), params: values }, {
                 onSuccess: () => {
                     toast.success('با موفقیت ذخیره شد')
-                    navigate(Paths.product.attribute.list + id)
+                    navigate(Paths.formBuilder.list + `${id}/${type} `)
                 },
                 onError: (error) => {
                     toast.error(extractErrorMessage(error))
@@ -124,4 +126,4 @@ const CreateAttribute: FC = () => {
     )
 }
 
-export default CreateAttribute
+export default FormBuilderCreate

src/pages/formBuilder/List.tsx

@@ -3,20 +3,20 @@ import { Paths } from '@/config/Paths'
 import { AddSquare, Edit } from 'iconsax-react'
 import { type FC } from 'react'
 import { Link, useParams } from 'react-router-dom'
-import { useDeleteAttribute, useGetAttributes } from '../hooks/useProductData'
+import { useDeleteField, useGetFields } from './hooks/useFormBuilderData'
 import Table from '@/components/Table'
 import TrashWithConfrim from '@/components/TrashWithConfrim'
 import { toast } from 'react-toastify'
 import { extractErrorMessage } from '@/config/func'
 
-const AttributeList: FC = () => {
+const FormBuilderList: FC = () => {
 
     const { id } = useParams()
-    const { mutate: deleteAttribute, isPending } = useDeleteAttribute()
-    const { data, refetch } = useGetAttributes(Number(id))
+    const { mutate: deleteField, isPending } = useDeleteField()
+    const { data, refetch } = useGetFields(Number(id))
 
     const handleDelete = (id: number) => {
-        deleteAttribute(id, {
+        deleteField(id, {
             onSuccess: () => {
                 refetch()
             },
@@ -33,7 +33,7 @@ const AttributeList: FC = () => {
                 <h1 className='text-lg font-light'>ویژگی ها</h1>
 
                 <Link
-                    to={Paths.product.attribute.create + id}
+                    to={Paths.formBuilder.create + id}
                 >
                     <Button
                         className='w-fit px-6'
@@ -71,7 +71,7 @@ const AttributeList: FC = () => {
                             title: 'مقادیر',
                             render: (item) => {
                                 return (
-                                    <Link to={Paths.product.attributeValue.list + item.id}>
+                                    <Link to={Paths.formBuilder.list + item.id}>
                                         <Button className='w-fit px-5'>
                                             میدیریت مقادیر
                                         </Button>
@@ -85,7 +85,7 @@ const AttributeList: FC = () => {
                             render: (item) => {
                                 return (
                                     <div className='flex gap-2 items-center'>
-                                        <Link to={Paths.product.attribute.update + item.id}>
+                                        <Link to={Paths.formBuilder.update + item.id}>
                                             <Edit
                                                 color='#0037FF'
                                                 size={20}
@@ -110,4 +110,4 @@ const AttributeList: FC = () => {
     )
 }
 
-export default AttributeList
+export default FormBuilderList

src/pages/formBuilder/Update.tsx

@@ -1,37 +1,39 @@
 import { useFormik } from 'formik'
 import { useEffect, type FC } from 'react'
-import type { CreateAttributeType } from '../types/Types'
-import { FieldTypeEnum } from '../enum/Enum'
+import type { CreateFieldType } from './types/Types'
+import { FieldTypeEnum } from './enum/Enum'
 import * as Yup from 'yup'
 import Button from '@/components/Button'
 import { AddSquare } from 'iconsax-react'
 import Input from '@/components/Input'
 import Select from '@/components/Select'
 import SwitchComponent from '@/components/Switch'
-import { useGetAttributeDetail, useUpdateAttribute } from '../hooks/useProductData'
+import { useGetFieldDetail, useUpdateField } from './hooks/useFormBuilderData'
 import { useNavigate, useParams } from 'react-router-dom'
 import { toast } from 'react-toastify'
 import { extractErrorMessage } from '@/config/func'
 
-const UpdateAttribute: FC = () => {
+const FormBuilderUpdate: FC = () => {
 
     const { id } = useParams()
     const navigate = useNavigate()
-    const { data, refetch } = useGetAttributeDetail(Number(id))
-    const { mutate: createAttribute, isPending } = useUpdateAttribute()
+    const { data, refetch } = useGetFieldDetail(Number(id))
+    const { mutate: createField, isPending } = useUpdateField()
 
-    const formik = useFormik<CreateAttributeType>({
+    const formik = useFormik<CreateFieldType>({
         initialValues: {
             name: '',
             isRequired: true,
             order: 1,
             type: FieldTypeEnum.text,
+            entityType: 'product',
+            multiple: false
         },
         validationSchema: Yup.object({
             name: Yup.string().required('این فیلد اجباری می باشد')
         }),
         onSubmit: (values) => {
-            createAttribute({ id: Number(id), params: values }, {
+            createField({ id: Number(id), params: values }, {
                 onSuccess: () => {
                     toast.success('با موفقیت ذخیره شد')
                     refetch()
@@ -51,7 +53,9 @@ const UpdateAttribute: FC = () => {
                 isRequired: data?.data?.isRequired,
                 name: data?.data?.name,
                 order: data?.data?.order,
-                type: data?.data?.type
+                type: data?.data?.type,
+                entityType: data?.data?.entityType,
+                multiple: data?.data?.multiple
             })
         }
 
@@ -140,4 +144,4 @@ const UpdateAttribute: FC = () => {
     )
 }
 
-export default UpdateAttribute
+export default FormBuilderUpdate

src/pages/product/List.tsx

@@ -75,7 +75,7 @@ const ProductList: FC = () => {
                             title: 'ویژگی ها',
                             render: (item) => {
                                 return (
-                                    <Link to={Paths.product.attribute.list + item.id} className='flex text-[#0037FF] gap-2 items-center'>
+                                    <Link to={Paths.formBuilder.list + item.id + `/product`} className='flex text-[#0037FF] gap-2 items-center'>
                                         <More2 size={18} color='#0037FF' />
                                         <div className='text-[13px]'>ویژگی ها</div>
                                     </Link>

src/router/MainRouter.tsx

@@ -33,6 +33,9 @@ import CreateAttribute from '@/pages/product/attribute/Create'
 import AttributeList from '@/pages/product/attribute/List'
 import UpdateAttribute from '@/pages/product/attribute/Update'
 import AttributeValues from '@/pages/product/attribute/AttributeValues'
+import FormBuilderList from '@/pages/formBuilder/List'
+import FormBuilderCreate from '@/pages/formBuilder/Create'
+import FormBuilderUpdate from '@/pages/formBuilder/Update'
 
 const MainRouter: FC = () => {
     return (
@@ -61,6 +64,10 @@ const MainRouter: FC = () => {
                             <Route path={Paths.product.category.create} element={<CreateCategory />} />
                             <Route path={Paths.product.category.update + ':id'} element={<UpdateCategory />} />
 
+                            <Route path={Paths.formBuilder.list + ':id/:type'} element={<FormBuilderList />} />
+                            <Route path={Paths.formBuilder.create + ':id/:type'} element={<FormBuilderCreate />} />
+                            <Route path={Paths.formBuilder.update + ':id'} element={<FormBuilderUpdate />} />
+
                             <Route path={Paths.order.list} element={<OrdersList />} />
                             <Route path={Paths.features.list} element={<FeaturesList />} />
                             <Route path={Paths.features.create} element={<CreateFeature />} />