change shipment methods

This commit is contained in:
hamid zarghami
2025-12-03 09:58:34 +03:30
parent 2479f5d1da
commit 66a3eaef67
9 changed files with 198 additions and 96 deletions
+5
View File
@@ -66,6 +66,11 @@
"admins": "مدیران",
"shipment_methods": "روش های ارسال"
},
"shipment": {
"dineIn": "سرو در محل",
"pickup": "دریافت از محل",
"deliveryCourier": "بیرون بر"
},
"slider": {
"new_slider": "اسلایدر جدید",
"submit": "ثبت اسلایدر",
+69 -27
View File
@@ -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 { useCreateRestaurantShipmentMethod, useGetShipmentMethods } from './hooks/useShipmentMethodData'
import Textarea from '@/components/Textarea'
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) => ({
label: method.title,
value: method.id
})) || []
const shipmentMethods = [
{ label: t(`shipment.${DeliveryMethodEnum.DineIn}`), value: DeliveryMethodEnum.DineIn },
{ label: t(`shipment.${DeliveryMethodEnum.Pickup}`), value: DeliveryMethodEnum.Pickup },
{ label: t(`shipment.${DeliveryMethodEnum.DeliveryCourier}`), value: DeliveryMethodEnum.DeliveryCourier },
]
const formik = useFormik<CreateShipmentMethodType>({
initialValues: {
shipmentMethodId: '',
price: null,
minOrderPrice: null,
isActive: true,
method: '',
title: '',
deliveryFee: 0,
minOrderPrice: 0,
description: '',
enabled: true,
order: 0,
},
validationSchema: Yup.object().shape({
shipmentMethodId: Yup.string().required('روش ارسال الزامی است'),
price: Yup.number().nullable().required('قیمت الزامی است').min(0, 'قیمت باید مثبت باشد'),
minOrderPrice: Yup.number().nullable().required('حداقل قیمت سفارش الزامی است').min(0, 'حداقل قیمت سفارش باید مثبت باشد'),
isActive: Yup.boolean(),
method: Yup.string().required('روش ارسال الزامی است'),
title: Yup.string().required('عنوان الزامی است'),
deliveryFee: Yup.number().required('هزینه ارسال الزامی است').min(0, 'هزینه ارسال باید مثبت باشد'),
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'
value={formik.values.shipmentMethodId}
name='method'
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='قیمت'
name='price'
label='عنوان'
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)
formik.setFieldValue('price', value)
const value = e.target.value === '' ? 0 : Number(e.target.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}
onChange={(value) => formik.setFieldValue('isActive', value)}
active={formik.values.enabled}
onChange={(value) => formik.setFieldValue('enabled', value)}
label='فعال'
/>
</div>
+4 -1
View File
@@ -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()
+75 -30
View File
@@ -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 { useUpdateRestaurantShipmentMethod, useGetRestaurantShipmentMethod, useGetShipmentMethods } from './hooks/useShipmentMethodData'
import Textarea from '@/components/Textarea'
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) => ({
label: method.title,
value: method.id
})) || []
const shipmentMethods = [
{ label: t(`shipment.${DeliveryMethodEnum.DineIn}`), value: DeliveryMethodEnum.DineIn },
{ 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,
price: data.price,
method: data.method,
title: data.title,
deliveryFee: data.deliveryFee,
minOrderPrice: data.minOrderPrice,
isActive: data.isActive,
description: data.description,
enabled: data.enabled,
order: data.order,
}
}
return {
shipmentMethodId: '',
price: null,
minOrderPrice: null,
isActive: true,
method: '',
title: '',
deliveryFee: 0,
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('روش ارسال الزامی است'),
price: Yup.number().nullable().required('قیمت الزامی است').min(0, 'قیمت باید مثبت باشد'),
minOrderPrice: Yup.number().nullable().required('حداقل قیمت سفارش الزامی است').min(0, 'حداقل قیمت سفارش باید مثبت باشد'),
isActive: Yup.boolean(),
method: Yup.string().required('روش ارسال الزامی است'),
title: Yup.string().required('عنوان الزامی است'),
deliveryFee: Yup.number().required('هزینه ارسال الزامی است').min(0, 'هزینه ارسال باید مثبت باشد'),
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'
value={formik.values.shipmentMethodId}
name='method'
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='قیمت'
name='price'
label='عنوان'
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)
formik.setFieldValue('price', value)
const value = e.target.value === '' ? 0 : Number(e.target.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}
onChange={(value) => formik.setFieldValue('isActive', value)}
active={formik.values.enabled}
onChange={(value) => formik.setFieldValue('enabled', value)}
label='فعال'
/>
</div>
@@ -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',
title: 'قیمت',
key: 'deliveryFee',
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'}
label={item.isActive ? 'فعال' : 'غیرفعال'}
variant={item.enabled ? 'success' : 'error'}
label={item.enabled ? 'فعال' : 'غیرفعال'}
/>
)
}
+6
View File
@@ -0,0 +1,6 @@
export const enum DeliveryMethodEnum {
DineIn = "dineIn", // سرو در محل
Pickup = "pickup", // برداشت از محل
// DeliveryCar = "deliveryCar", // ارسال با ماشین
DeliveryCourier = "deliveryCourier", // پیک
}
@@ -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({
@@ -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;
+14 -8
View File
@@ -14,10 +14,13 @@ export type ShipmentMethod = {
export type GetShipmentMethodsResponseType = IResponse<ShipmentMethod[]>;
export type CreateShipmentMethodType = {
shipmentMethodId: string;
price: number | null;
minOrderPrice: number | null;
isActive: boolean;
method: string;
title: string;
deliveryFee: number;
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;
price: number | null;
minOrderPrice: number | null;
isActive: boolean;
method: string;
title: string;
deliveryFee: number;
minOrderPrice: number;
description: string;
enabled: boolean;
order: number;
};
export type GetRestaurantShipmentMethodsResponseType = IResponse<