change shipment methods

src/langs/fa.json

@@ -66,6 +66,11 @@
     "admins": "مدیران",
     "shipment_methods": "روش های ارسال"
   },
+  "shipment": {
+    "dineIn": "سرو در محل",
+    "pickup": "دریافت از محل",
+    "deliveryCourier": "بیرون بر"
+  },
   "slider": {
     "new_slider": "اسلایدر جدید",
     "submit": "ثبت اسلایدر",

src/pages/shipmentMethod/Create.tsx

@@ -8,34 +8,45 @@ import Button from '@/components/Button'
 import Input from '@/components/Input'
 import Select from '@/components/Select'
 import Switch from '@/components/Switch'
-import type { CreateShipmentMethodType, ShipmentMethod } from './types/Types'
+import Textarea from '@/components/Textarea'
-import { useCreateRestaurantShipmentMethod, useGetShipmentMethods } from './hooks/useShipmentMethodData'
+import type { CreateShipmentMethodType } from './types/Types'
+import { useCreateRestaurantShipmentMethod } from './hooks/useShipmentMethodData'
+import { DeliveryMethodEnum } from './enum/Enum'
 import { Pages } from '@/config/Pages'
 import type { ErrorType } from '@/helpers/types'
 import { extractErrorMessage } from '@/config/func'
+import { useTranslation } from 'react-i18next'
 
 const CreateShipmentMethod: FC = () => {
+
+    const { t } = useTranslation('global')
     const navigate = useNavigate()
     const { mutate: createRestaurantShipmentMethod, isPending } = useCreateRestaurantShipmentMethod()
-    const { data: shipmentMethodsData } = useGetShipmentMethods()
 
-    const shipmentMethods = shipmentMethodsData?.data?.map((method: ShipmentMethod) => ({
+    const shipmentMethods = [
-        label: method.title,
+        { label: t(`shipment.${DeliveryMethodEnum.DineIn}`), value: DeliveryMethodEnum.DineIn },
-        value: method.id
+        { label: t(`shipment.${DeliveryMethodEnum.Pickup}`), value: DeliveryMethodEnum.Pickup },
-    })) || []
+        { label: t(`shipment.${DeliveryMethodEnum.DeliveryCourier}`), value: DeliveryMethodEnum.DeliveryCourier },
+    ]
 
     const formik = useFormik<CreateShipmentMethodType>({
         initialValues: {
-            shipmentMethodId: '',
+            method: '',
-            price: null,
+            title: '',
-            minOrderPrice: null,
+            deliveryFee: 0,
-            isActive: true,
+            minOrderPrice: 0,
+            description: '',
+            enabled: true,
+            order: 0,
         },
         validationSchema: Yup.object().shape({
-            shipmentMethodId: Yup.string().required('روش ارسال الزامی است'),
+            method: Yup.string().required('روش ارسال الزامی است'),
-            price: Yup.number().nullable().required('قیمت الزامی است').min(0, 'قیمت باید مثبت باشد'),
+            title: Yup.string().required('عنوان الزامی است'),
-            minOrderPrice: Yup.number().nullable().required('حداقل قیمت سفارش الزامی است').min(0, 'حداقل قیمت سفارش باید مثبت باشد'),
+            deliveryFee: Yup.number().required('هزینه ارسال الزامی است').min(0, 'هزینه ارسال باید مثبت باشد'),
-            isActive: Yup.boolean(),
+            minOrderPrice: Yup.number().required('حداقل قیمت سفارش الزامی است').min(0, 'حداقل قیمت سفارش باید مثبت باشد'),
+            description: Yup.string().required('توضیحات الزامی است'),
+            enabled: Yup.boolean(),
+            order: Yup.number().required('ترتیب الزامی است').min(0, 'ترتیب باید مثبت باشد'),
         }),
         onSubmit: (values) => {
             createRestaurantShipmentMethod(values, {
@@ -75,25 +86,34 @@ const CreateShipmentMethod: FC = () => {
                     <div className='mb-4'>
                         <Select
                             label='روش ارسال'
-                            name='shipmentMethodId'
+                            name='method'
-                            value={formik.values.shipmentMethodId}
+                            value={formik.values.method}
                             onChange={formik.handleChange}
                             items={shipmentMethods}
                             placeholder='روش ارسال را انتخاب کنید'
-                            error_text={formik.touched.shipmentMethodId && formik.errors.shipmentMethodId ? formik.errors.shipmentMethodId : ''}
+                            error_text={formik.touched.method && formik.errors.method ? formik.errors.method : ''}
                         />
                     </div>
                     <div className='mt-6'>
                         <Input
-                            label='قیمت'
+                            label='عنوان'
-                            name='price'
+                            name='title'
+                            value={formik.values.title}
+                            onChange={formik.handleChange}
+                            error_text={formik.touched.title && formik.errors.title ? formik.errors.title : ''}
+                        />
+                    </div>
+                    <div className='mt-6'>
+                        <Input
+                            label='هزینه ارسال'
+                            name='deliveryFee'
                             type='number'
-                            value={formik.values.price ?? ''}
+                            value={formik.values.deliveryFee ?? ''}
                             onChange={(e) => {
-                                const value = e.target.value === '' ? null : Number(e.target.value)
+                                const value = e.target.value === '' ? 0 : Number(e.target.value)
-                                formik.setFieldValue('price', value)
+                                formik.setFieldValue('deliveryFee', value)
                             }}
-                            error_text={formik.touched.price && formik.errors.price ? formik.errors.price : ''}
+                            error_text={formik.touched.deliveryFee && formik.errors.deliveryFee ? formik.errors.deliveryFee : ''}
                         />
                     </div>
                     <div className='mt-6'>
@@ -103,16 +123,38 @@ const CreateShipmentMethod: FC = () => {
                             type='number'
                             value={formik.values.minOrderPrice ?? ''}
                             onChange={(e) => {
-                                const value = e.target.value === '' ? null : Number(e.target.value)
+                                const value = e.target.value === '' ? 0 : Number(e.target.value)
                                 formik.setFieldValue('minOrderPrice', value)
                             }}
                             error_text={formik.touched.minOrderPrice && formik.errors.minOrderPrice ? formik.errors.minOrderPrice : ''}
                         />
                     </div>
+                    <div className='mt-6'>
+                        <Textarea
+                            label='توضیحات'
+                            name='description'
+                            value={formik.values.description}
+                            onChange={formik.handleChange}
+                            error_text={formik.touched.description && formik.errors.description ? formik.errors.description : ''}
+                        />
+                    </div>
+                    <div className='mt-6'>
+                        <Input
+                            label='ترتیب'
+                            name='order'
+                            type='number'
+                            value={formik.values.order ?? ''}
+                            onChange={(e) => {
+                                const value = e.target.value === '' ? 0 : Number(e.target.value)
+                                formik.setFieldValue('order', value)
+                            }}
+                            error_text={formik.touched.order && formik.errors.order ? formik.errors.order : ''}
+                        />
+                    </div>
                     <div className='mt-6'>
                         <Switch
-                            active={formik.values.isActive}
+                            active={formik.values.enabled}
-                            onChange={(value) => formik.setFieldValue('isActive', value)}
+                            onChange={(value) => formik.setFieldValue('enabled', value)}
                             label='فعال'
                         />
                     </div>

src/pages/shipmentMethod/List.tsx

@@ -1,4 +1,5 @@
 import { type FC } from 'react'
+import { useTranslation } from 'react-i18next'
 import Table from '@/components/Table'
 import Filters from '@/components/Filters'
 import { useGetRestaurantShipmentMethods, useDeleteRestaurantShipmentMethod } from './hooks/useShipmentMethodData'
@@ -11,6 +12,7 @@ import { Pages } from '@/config/Pages'
 import Button from '@/components/Button'
 
 const ShipmentMethodList: FC = () => {
+    const { t } = useTranslation('global')
     const {
         filters,
         currentPage,
@@ -26,7 +28,8 @@ const ShipmentMethodList: FC = () => {
     const shipmentMethods = shipmentMethodsData?.data || []
     const columns = getShipmentMethodTableColumns({
         onDelete: (id: string) => deleteShipmentMethod(id),
-        isDeleting
+        isDeleting,
+        t
     })
     const filterFields = useShipmentMethodFiltersFields()
 

src/pages/shipmentMethod/Update.tsx

@@ -8,39 +8,50 @@ import Button from '@/components/Button'
 import Input from '@/components/Input'
 import Select from '@/components/Select'
 import Switch from '@/components/Switch'
-import type { CreateShipmentMethodType, ShipmentMethod } from './types/Types'
+import Textarea from '@/components/Textarea'
-import { useUpdateRestaurantShipmentMethod, useGetRestaurantShipmentMethod, useGetShipmentMethods } from './hooks/useShipmentMethodData'
+import type { CreateShipmentMethodType } from './types/Types'
+import { useUpdateRestaurantShipmentMethod, useGetRestaurantShipmentMethod } from './hooks/useShipmentMethodData'
+import { DeliveryMethodEnum } from './enum/Enum'
 import { Pages } from '@/config/Pages'
 import type { ErrorType } from '@/helpers/types'
 import { extractErrorMessage } from '@/config/func'
+import { useTranslation } from 'react-i18next'
 
 const UpdateShipmentMethod: FC = () => {
+
+    const { t } = useTranslation('global')
     const navigate = useNavigate()
     const { id } = useParams<{ id: string }>()
     const { mutate: updateRestaurantShipmentMethod, isPending } = useUpdateRestaurantShipmentMethod()
     const { data: shipmentMethodData, isLoading } = useGetRestaurantShipmentMethod(id || '')
-    const { data: shipmentMethodsData } = useGetShipmentMethods()
 
-    const shipmentMethods = shipmentMethodsData?.data?.map((method: ShipmentMethod) => ({
+    const shipmentMethods = [
-        label: method.title,
+        { label: t(`shipment.${DeliveryMethodEnum.DineIn}`), value: DeliveryMethodEnum.DineIn },
-        value: method.id
+        { label: t(`shipment.${DeliveryMethodEnum.Pickup}`), value: DeliveryMethodEnum.Pickup },
-    })) || []
+        { label: t(`shipment.${DeliveryMethodEnum.DeliveryCourier}`), value: DeliveryMethodEnum.DeliveryCourier },
+    ]
 
     const initialValues = useMemo<CreateShipmentMethodType>(() => {
         if (shipmentMethodData?.data) {
             const data = shipmentMethodData.data
             return {
-                shipmentMethodId: data.shipmentMethod.id,
+                method: data.method,
-                price: data.price,
+                title: data.title,
+                deliveryFee: data.deliveryFee,
                 minOrderPrice: data.minOrderPrice,
-                isActive: data.isActive,
+                description: data.description,
+                enabled: data.enabled,
+                order: data.order,
             }
         }
         return {
-            shipmentMethodId: '',
+            method: '',
-            price: null,
+            title: '',
-            minOrderPrice: null,
+            deliveryFee: 0,
-            isActive: true,
+            minOrderPrice: 0,
+            description: '',
+            enabled: true,
+            order: 0,
         }
     }, [shipmentMethodData])
 
@@ -48,10 +59,13 @@ const UpdateShipmentMethod: FC = () => {
         initialValues,
         enableReinitialize: true,
         validationSchema: Yup.object().shape({
-            shipmentMethodId: Yup.string().required('روش ارسال الزامی است'),
+            method: Yup.string().required('روش ارسال الزامی است'),
-            price: Yup.number().nullable().required('قیمت الزامی است').min(0, 'قیمت باید مثبت باشد'),
+            title: Yup.string().required('عنوان الزامی است'),
-            minOrderPrice: Yup.number().nullable().required('حداقل قیمت سفارش الزامی است').min(0, 'حداقل قیمت سفارش باید مثبت باشد'),
+            deliveryFee: Yup.number().required('هزینه ارسال الزامی است').min(0, 'هزینه ارسال باید مثبت باشد'),
-            isActive: Yup.boolean(),
+            minOrderPrice: Yup.number().required('حداقل قیمت سفارش الزامی است').min(0, 'حداقل قیمت سفارش باید مثبت باشد'),
+            description: Yup.string().required('توضیحات الزامی است'),
+            enabled: Yup.boolean(),
+            order: Yup.number().required('ترتیب الزامی است').min(0, 'ترتیب باید مثبت باشد'),
         }),
         onSubmit: (values) => {
             if (!id) return
@@ -103,25 +117,34 @@ const UpdateShipmentMethod: FC = () => {
                     <div className='mb-4'>
                         <Select
                             label='روش ارسال'
-                            name='shipmentMethodId'
+                            name='method'
-                            value={formik.values.shipmentMethodId}
+                            value={formik.values.method}
                             onChange={formik.handleChange}
                             items={shipmentMethods}
                             placeholder='روش ارسال را انتخاب کنید'
-                            error_text={formik.touched.shipmentMethodId && formik.errors.shipmentMethodId ? formik.errors.shipmentMethodId : ''}
+                            error_text={formik.touched.method && formik.errors.method ? formik.errors.method : ''}
                         />
                     </div>
                     <div className='mt-6'>
                         <Input
-                            label='قیمت'
+                            label='عنوان'
-                            name='price'
+                            name='title'
+                            value={formik.values.title}
+                            onChange={formik.handleChange}
+                            error_text={formik.touched.title && formik.errors.title ? formik.errors.title : ''}
+                        />
+                    </div>
+                    <div className='mt-6'>
+                        <Input
+                            label='هزینه ارسال'
+                            name='deliveryFee'
                             type='number'
-                            value={formik.values.price ?? ''}
+                            value={formik.values.deliveryFee ?? ''}
                             onChange={(e) => {
-                                const value = e.target.value === '' ? null : Number(e.target.value)
+                                const value = e.target.value === '' ? 0 : Number(e.target.value)
-                                formik.setFieldValue('price', value)
+                                formik.setFieldValue('deliveryFee', value)
                             }}
-                            error_text={formik.touched.price && formik.errors.price ? formik.errors.price : ''}
+                            error_text={formik.touched.deliveryFee && formik.errors.deliveryFee ? formik.errors.deliveryFee : ''}
                         />
                     </div>
                     <div className='mt-6'>
@@ -131,16 +154,38 @@ const UpdateShipmentMethod: FC = () => {
                             type='number'
                             value={formik.values.minOrderPrice ?? ''}
                             onChange={(e) => {
-                                const value = e.target.value === '' ? null : Number(e.target.value)
+                                const value = e.target.value === '' ? 0 : Number(e.target.value)
                                 formik.setFieldValue('minOrderPrice', value)
                             }}
                             error_text={formik.touched.minOrderPrice && formik.errors.minOrderPrice ? formik.errors.minOrderPrice : ''}
                         />
                     </div>
+                    <div className='mt-6'>
+                        <Textarea
+                            label='توضیحات'
+                            name='description'
+                            value={formik.values.description}
+                            onChange={formik.handleChange}
+                            error_text={formik.touched.description && formik.errors.description ? formik.errors.description : ''}
+                        />
+                    </div>
+                    <div className='mt-6'>
+                        <Input
+                            label='ترتیب'
+                            name='order'
+                            type='number'
+                            value={formik.values.order ?? ''}
+                            onChange={(e) => {
+                                const value = e.target.value === '' ? 0 : Number(e.target.value)
+                                formik.setFieldValue('order', value)
+                            }}
+                            error_text={formik.touched.order && formik.errors.order ? formik.errors.order : ''}
+                        />
+                    </div>
                     <div className='mt-6'>
                         <Switch
-                            active={formik.values.isActive}
+                            active={formik.values.enabled}
-                            onChange={(value) => formik.setFieldValue('isActive', value)}
+                            onChange={(value) => formik.setFieldValue('enabled', value)}
                             label='فعال'
                         />
                     </div>

src/pages/shipmentMethod/components/ShipmentMethodTableColumns.tsx

@@ -6,33 +6,42 @@ import { Link } from 'react-router-dom'
 import { Pages } from '@/config/Pages'
 import Status from '@/components/Status'
 import { formatFaNumber } from '@/helpers/func'
+import type { TFunction } from 'i18next'
 
 interface GetShipmentMethodTableColumnsParams {
     onDelete?: (id: string) => void
     isDeleting?: boolean
+    t: TFunction
 }
 
-export const getShipmentMethodTableColumns = ({ onDelete, isDeleting }: GetShipmentMethodTableColumnsParams = {}): ColumnType<RestaurantShipmentMethod>[] => {
+export const getShipmentMethodTableColumns = ({ onDelete, isDeleting, t }: GetShipmentMethodTableColumnsParams): ColumnType<RestaurantShipmentMethod>[] => {
     return [
         {
             key: 'title',
             title: 'عنوان',
             render: (item: RestaurantShipmentMethod) => {
-                return item.shipmentMethod?.title || '-'
+                return item.title || '-'
+            }
+        },
+        {
+            key: 'method',
+            title: 'روش ارسال',
+            render: (item: RestaurantShipmentMethod) => {
+                return t(`shipment.${item.method}`)
             }
         },
         {
             key: 'description',
             title: 'توضیحات',
             render: (item: RestaurantShipmentMethod) => {
-                return item.shipmentMethod?.description || '-'
+                return item.description || '-'
             }
         },
         {
-            key: 'price',
+            key: 'deliveryFee',
-            title: 'قیمت',
+            title: 'هزینه ارسال',
             render: (item: RestaurantShipmentMethod) => {
-                return item.price ? `${formatFaNumber(item.price)} تومان` : 'رایگان'
+                return item.deliveryFee ? `${formatFaNumber(item.deliveryFee)} تومان` : 'رایگان'
             }
         },
         {
@@ -43,13 +52,13 @@ export const getShipmentMethodTableColumns = ({ onDelete, isDeleting }: GetShipm
             }
         },
         {
-            key: 'isActive',
+            key: 'enabled',
             title: 'وضعیت',
             render: (item: RestaurantShipmentMethod) => {
                 return (
                     <Status
-                        variant={item.isActive ? 'success' : 'error'}
+                        variant={item.enabled ? 'success' : 'error'}
-                        label={item.isActive ? 'فعال' : 'غیرفعال'}
+                        label={item.enabled ? 'فعال' : 'غیرفعال'}
                     />
                 )
             }

src/pages/shipmentMethod/enum/Enum.ts

@@ -0,0 +1,6 @@
+export const enum DeliveryMethodEnum {
+  DineIn = "dineIn", // سرو در محل
+  Pickup = "pickup", // برداشت از محل
+  //   DeliveryCar = "deliveryCar", // ارسال با ماشین
+  DeliveryCourier = "deliveryCourier", // پیک
+}

src/pages/shipmentMethod/hooks/useShipmentMethodData.ts

@@ -3,24 +3,18 @@ import * as api from "../service/ShipmentMethodService";
 import type {
   CreateShipmentMethodType,
   GetRestaurantShipmentMethodsParams,
+  GetRestaurantShipmentMethodsResponseType,
 } from "../types/Types";
 
 export const useGetRestaurantShipmentMethods = (
   params?: GetRestaurantShipmentMethodsParams
 ) => {
-  return useQuery({
+  return useQuery<GetRestaurantShipmentMethodsResponseType>({
     queryKey: ["restaurant-shipment-methods", params],
     queryFn: () => api.getRestaurantShipmentMethods(params),
   });
 };
 
-export const useGetShipmentMethods = () => {
-  return useQuery({
-    queryKey: ["shipment-methods"],
-    queryFn: api.getShipmentMethods,
-  });
-};
-
 export const useCreateRestaurantShipmentMethod = () => {
   const queryClient = useQueryClient();
   return useMutation({

src/pages/shipmentMethod/service/ShipmentMethodService.ts

@@ -1,23 +1,15 @@
 import axios from "@/config/axios";
 import type {
   CreateShipmentMethodType,
-  GetShipmentMethodsResponseType,
   GetRestaurantShipmentMethodsResponseType,
   GetRestaurantShipmentMethodResponseType,
   GetRestaurantShipmentMethodsParams,
 } from "../types/Types";
 
-export const getShipmentMethods = async (): Promise<
-  GetShipmentMethodsResponseType
-> => {
-  const { data } = await axios.get(`/admin/shipment-methods`);
-  return data;
-};
-
 export const getRestaurantShipmentMethods = async (
   params?: GetRestaurantShipmentMethodsParams
 ): Promise<GetRestaurantShipmentMethodsResponseType> => {
-  const { data } = await axios.get("/admin/shipment-methods/restaurant", {
+  const { data } = await axios.get("/admin/delivery-methods/restaurant", {
     params,
   });
   return data;
@@ -27,7 +19,7 @@ export const createRestaurantShipmentMethod = async (
   params: CreateShipmentMethodType
 ) => {
   const { data } = await axios.post(
-    "/admin/shipment-methods/restaurant",
+    "/admin/delivery-methods/restaurant",
     params
   );
   return data;
@@ -35,7 +27,7 @@ export const createRestaurantShipmentMethod = async (
 
 export const deleteRestaurantShipmentMethod = async (id: string) => {
   const { data } = await axios.delete(
-    `/admin/shipment-methods/restaurant/${id}`
+    `/admin/delivery-methods/restaurant/${id}`
   );
   return data;
 };
@@ -43,7 +35,7 @@ export const deleteRestaurantShipmentMethod = async (id: string) => {
 export const getRestaurantShipmentMethod = async (
   id: string
 ): Promise<GetRestaurantShipmentMethodResponseType> => {
-  const { data } = await axios.get(`/admin/shipment-methods/restaurant/${id}`);
+  const { data } = await axios.get(`/admin/delivery-methods/restaurant/${id}`);
   return data;
 };
 
@@ -52,7 +44,7 @@ export const updateRestaurantShipmentMethod = async (
   params: CreateShipmentMethodType
 ) => {
   const { data } = await axios.patch(
-    `/admin/shipment-methods/restaurant/${id}`,
+    `/admin/delivery-methods/restaurant/${id}`,
     params
   );
   return data;

src/pages/shipmentMethod/types/Types.ts

@@ -14,10 +14,13 @@ export type ShipmentMethod = {
 export type GetShipmentMethodsResponseType = IResponse<ShipmentMethod[]>;
 
 export type CreateShipmentMethodType = {
-  shipmentMethodId: string;
+  method: string;
-  price: number | null;
+  title: string;
-  minOrderPrice: number | null;
+  deliveryFee: number;
-  isActive: boolean;
+  minOrderPrice: number;
+  description: string;
+  enabled: boolean;
+  order: number;
 };
 
 export type RestaurantShipmentMethod = {
@@ -26,10 +29,13 @@ export type RestaurantShipmentMethod = {
   createdAt: string;
   updatedAt: string;
   deletedAt: string | null;
-  shipmentMethod: ShipmentMethod;
+  method: string;
-  price: number | null;
+  title: string;
-  minOrderPrice: number | null;
+  deliveryFee: number;
-  isActive: boolean;
+  minOrderPrice: number;
+  description: string;
+  enabled: boolean;
+  order: number;
 };
 
 export type GetRestaurantShipmentMethodsResponseType = IResponse<