reason return
This commit is contained in:
@@ -1,29 +1,21 @@
|
||||
import { type FC, useState } from 'react'
|
||||
import { type FC } from 'react'
|
||||
import ModalCreateReturnReason from './components/ModalCreateReturnReason'
|
||||
import { useGetReturnReasons, useDeleteReturnReason } from './hooks/useOrderData'
|
||||
import { type ReturnReasonType } from './types/Types'
|
||||
import PageLoading from '../../components/PageLoading'
|
||||
import Error from '../../components/Error'
|
||||
import PaginationUi from '../../components/PaginationUi'
|
||||
import Td from '../../components/Td'
|
||||
import TrashWithConfrim from '../../components/TrashWithConfrim'
|
||||
import { Edit } from 'iconsax-react'
|
||||
import { Link } from 'react-router-dom'
|
||||
import Button from '@/components/Button'
|
||||
import { useNavigate } from 'react-router-dom'
|
||||
import { type ReturnCategoryType, type PagerType } from './types/Types'
|
||||
|
||||
const ReturnCategories: FC = () => {
|
||||
const [currentPage, setCurrentPage] = useState(1);
|
||||
// TODO: Add category data fetching hook
|
||||
const isLoading = false;
|
||||
const error = null;
|
||||
const refetch = () => { };
|
||||
// TODO: Add delete mutation
|
||||
const deleteCategoryMutation = { isPending: false, mutateAsync: async (_id: string) => { } };
|
||||
|
||||
const navigate = useNavigate();
|
||||
const { data: returnReasonsData, isLoading, error, refetch } = useGetReturnReasons()
|
||||
const deleteReturnReasonMutation = useDeleteReturnReason();
|
||||
|
||||
// Mock data for now
|
||||
const categories: ReturnCategoryType[] = [];
|
||||
const pager: PagerType = { page: currentPage, limit: 10, totalPages: 1, totalItems: 0, prevPage: null, nextPage: null };
|
||||
const handleDeleteReturnReason = async (reasonId: string) => {
|
||||
await deleteReturnReasonMutation.mutateAsync(reasonId);
|
||||
refetch()
|
||||
};
|
||||
|
||||
if (isLoading) {
|
||||
return (
|
||||
@@ -36,63 +28,52 @@ const ReturnCategories: FC = () => {
|
||||
if (error) {
|
||||
return (
|
||||
<div className="flex justify-center items-center min-h-[400px]">
|
||||
<Error errorText="خطا در بارگذاری دستهبندی مرجوعیها" />
|
||||
<Error errorText="خطا در بارگذاری دلایل بازگشت" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const handleDeleteCategory = async (categoryId: string) => {
|
||||
await deleteCategoryMutation.mutateAsync(categoryId);
|
||||
refetch()
|
||||
};
|
||||
const returnReasons = returnReasonsData?.results?.reasons || [];
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className='flex justify-end mt-5'>
|
||||
<Button
|
||||
label='افزودن دستهبندی مرجوعی'
|
||||
onClick={() => navigate('/orders/return-categories/create')}
|
||||
className='w-fit'
|
||||
/>
|
||||
<ModalCreateReturnReason />
|
||||
</div>
|
||||
<div className='relative overflow-x-auto rounded-3xl mt-5 w-full'>
|
||||
<table className='w-full text-sm'>
|
||||
<thead className='thead'>
|
||||
<tr>
|
||||
<Td text={'عنوان'} />
|
||||
<Td text={'توضیحات'} />
|
||||
<Td text={'قانون جریمه'} />
|
||||
<Td text={'وضعیت'} />
|
||||
<Td text={'عملیات'} />
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{categories.length === 0 ? (
|
||||
{returnReasons.length === 0 ? (
|
||||
<tr className='tr'>
|
||||
<td colSpan={4} className="text-center py-8 text-gray-500">
|
||||
هیچ دستهبندی مرجوعی یافت نشد
|
||||
هیچ دلیل بازگشتی یافت نشد
|
||||
</td>
|
||||
</tr>
|
||||
) : (
|
||||
categories.map((category: any) => (
|
||||
<tr key={category.id} className='tr'>
|
||||
<Td text={category.title} />
|
||||
<Td text={category.description} />
|
||||
returnReasons.map((reason: ReturnReasonType) => (
|
||||
<tr key={reason._id} className='tr'>
|
||||
<Td text={reason.title} />
|
||||
<Td text={reason.fineRule?.title || 'بدون جریمه'} />
|
||||
<Td text="">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className={`px-2 py-1 rounded-full text-xs`}>
|
||||
{category.status}
|
||||
<span className="px-2 py-1 rounded-full text-xs bg-green-100 text-green-800">
|
||||
فعال
|
||||
</span>
|
||||
</div>
|
||||
</Td>
|
||||
<Td text="">
|
||||
<div className="flex items-center gap-2">
|
||||
<Link to={`/orders/return-categories/${category.id}`}>
|
||||
<Edit color='#8C90A3' size={16} className="cursor-pointer hover:text-blue-500" />
|
||||
</Link>
|
||||
|
||||
<TrashWithConfrim
|
||||
onDelete={() => handleDeleteCategory(category.id)}
|
||||
isLoading={deleteCategoryMutation.isPending}
|
||||
onDelete={() => handleDeleteReturnReason(reason._id)}
|
||||
isLoading={deleteReturnReasonMutation.isPending}
|
||||
/>
|
||||
</div>
|
||||
</Td>
|
||||
@@ -102,13 +83,6 @@ const ReturnCategories: FC = () => {
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<PaginationUi
|
||||
pager={pager}
|
||||
onPageChange={(page) => {
|
||||
setCurrentPage(page);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -0,0 +1,106 @@
|
||||
import Button from '@/components/Button'
|
||||
import DefaulModal from '@/components/DefaulModal'
|
||||
import Input from '@/components/Input'
|
||||
import Select from '@/components/Select'
|
||||
import Switch from '@/components/Switch'
|
||||
import { useState, type FC } from 'react'
|
||||
import type { CreateReturnReasonType } from '../types/Types'
|
||||
import { useCreateReturnReason } from '../hooks/useOrderData'
|
||||
import { useFormik } from 'formik'
|
||||
import * as Yup from 'yup'
|
||||
import { useGetFines } from '@/pages/payment/hooks/usePaymentData'
|
||||
|
||||
const ModalCreateReturnReason: FC = () => {
|
||||
|
||||
const [open, setOpen] = useState<boolean>(false)
|
||||
const createReturnReasonMutation = useCreateReturnReason()
|
||||
const { data: finesData } = useGetFines()
|
||||
|
||||
const formik = useFormik<CreateReturnReasonType>({
|
||||
initialValues: {
|
||||
fineRule: '',
|
||||
title: '',
|
||||
is_mandatory_picture: false,
|
||||
},
|
||||
validationSchema: Yup.object({
|
||||
fineRule: Yup.string().required('انتخاب قانون جریمه الزامی است'),
|
||||
title: Yup.string().required('عنوان دلیل بازگشت الزامی است'),
|
||||
is_mandatory_picture: Yup.boolean(),
|
||||
}),
|
||||
onSubmit: async (values) => {
|
||||
try {
|
||||
await createReturnReasonMutation.mutateAsync(values)
|
||||
setOpen(false)
|
||||
formik.resetForm()
|
||||
} catch (error) {
|
||||
console.error('خطا در ایجاد دلیل بازگشت:', error)
|
||||
}
|
||||
},
|
||||
})
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Button
|
||||
label='افزودن دلیل بازگشت'
|
||||
onClick={() => setOpen(true)}
|
||||
className='w-fit px-5 whitespace-nowrap'
|
||||
/>
|
||||
<DefaulModal
|
||||
open={open}
|
||||
close={() => setOpen(false)}
|
||||
title_header='افزودن دلیل بازگشت'
|
||||
isHeader
|
||||
>
|
||||
<form onSubmit={formik.handleSubmit} className='space-y-4 w-[400px] mt-6'>
|
||||
<Input
|
||||
label='عنوان دلیل بازگشت'
|
||||
placeholder='عنوان دلیل بازگشت را وارد کنید'
|
||||
name='title'
|
||||
value={formik.values.title}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
error_text={formik.touched.title && formik.errors.title ? formik.errors.title : undefined}
|
||||
/>
|
||||
|
||||
<Select
|
||||
label='قانون جریمه'
|
||||
placeholder='قانون جریمه را انتخاب کنید'
|
||||
name='fineRule'
|
||||
value={formik.values.fineRule}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
error_text={formik.touched.fineRule && formik.errors.fineRule ? formik.errors.fineRule : undefined}
|
||||
items={finesData?.results?.fineRules?.map(fine => ({
|
||||
value: fine._id,
|
||||
label: `${fine.title} (${fine.fine_percentage}%)`
|
||||
})) || []}
|
||||
/>
|
||||
|
||||
<Switch
|
||||
label='تصویر اجباری'
|
||||
active={formik.values.is_mandatory_picture}
|
||||
onChange={(checked) => formik.setFieldValue('is_mandatory_picture', checked)}
|
||||
/>
|
||||
|
||||
<div className='flex gap-2 pt-4'>
|
||||
<Button
|
||||
type='submit'
|
||||
label={createReturnReasonMutation.isPending ? 'در حال ذخیره...' : 'ذخیره'}
|
||||
disabled={createReturnReasonMutation.isPending}
|
||||
className='flex-1'
|
||||
/>
|
||||
<Button
|
||||
type='button'
|
||||
label='لغو'
|
||||
variant='outline'
|
||||
onClick={() => setOpen(false)}
|
||||
className='flex-1'
|
||||
/>
|
||||
</div>
|
||||
</form>
|
||||
</DefaulModal>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default ModalCreateReturnReason
|
||||
@@ -49,3 +49,22 @@ export const useDeleteCancelReason = () => {
|
||||
mutationFn: api.deleteCancelReason,
|
||||
});
|
||||
};
|
||||
|
||||
export const useCreateReturnReason = () => {
|
||||
return useMutation({
|
||||
mutationFn: api.createReturnReason,
|
||||
});
|
||||
};
|
||||
|
||||
export const useGetReturnReasons = () => {
|
||||
return useQuery({
|
||||
queryKey: ["return-reasons"],
|
||||
queryFn: api.getReturnReasons,
|
||||
});
|
||||
};
|
||||
|
||||
export const useDeleteReturnReason = () => {
|
||||
return useMutation({
|
||||
mutationFn: api.deleteReturnReason,
|
||||
});
|
||||
};
|
||||
|
||||
@@ -2,8 +2,10 @@ import axios from "../../../config/axios";
|
||||
import type {
|
||||
CancelReasonsResponseType,
|
||||
CreateCancelReasonType,
|
||||
CreateReturnReasonType,
|
||||
NativeOrdersResponseType,
|
||||
OrderDetailResponseType,
|
||||
ReturnReasonsResponseType,
|
||||
} from "../types/Types";
|
||||
|
||||
export const getNativeOrders = async (
|
||||
@@ -46,6 +48,23 @@ export const getCancelReasons = async (): Promise<
|
||||
};
|
||||
|
||||
export const deleteCancelReason = async (id: string) => {
|
||||
const { data } = await axios.delete(`/cancel/reasons/${id}`);
|
||||
const { data } = await axios.delete(`/admin/orders/reasons/${id}/delete`);
|
||||
return data;
|
||||
};
|
||||
|
||||
export const createReturnReason = async (params: CreateReturnReasonType) => {
|
||||
const { data } = await axios.post(`/admin/orders/returns/reasons`, params);
|
||||
return data;
|
||||
};
|
||||
|
||||
export const getReturnReasons = async (): Promise<
|
||||
ReturnReasonsResponseType
|
||||
> => {
|
||||
const { data } = await axios.get(`/returns/reasons`);
|
||||
return data;
|
||||
};
|
||||
|
||||
export const deleteReturnReason = async (id: string) => {
|
||||
const { data } = await axios.delete(`/admin/orders/returns/reasons/${id}`);
|
||||
return data;
|
||||
};
|
||||
|
||||
@@ -197,6 +197,9 @@ export type ReturnCategoryType = {
|
||||
description: string;
|
||||
status: string;
|
||||
deleted: boolean;
|
||||
fineRule?: FineRuleType;
|
||||
createdAt?: string;
|
||||
updatedAt?: string;
|
||||
};
|
||||
|
||||
// تایپهای صفحهبندی
|
||||
@@ -311,3 +314,26 @@ export type CancelReasonsResponseType = {
|
||||
reasons: CancelReasonType[];
|
||||
};
|
||||
};
|
||||
|
||||
export type ReturnReasonType = {
|
||||
_id: string;
|
||||
title: string;
|
||||
is_mandatory_picture: boolean;
|
||||
fineRule: FineRuleType;
|
||||
createdAt: string;
|
||||
updatedAt: string;
|
||||
};
|
||||
|
||||
export type ReturnReasonsResponseType = {
|
||||
status: number;
|
||||
success: boolean;
|
||||
results: {
|
||||
reasons: ReturnReasonType[];
|
||||
};
|
||||
};
|
||||
|
||||
export type CreateReturnReasonType = {
|
||||
title: string;
|
||||
is_mandatory_picture: boolean;
|
||||
fineRule: string;
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user