Requests

2026-02-22 16:30:11 +03:30
parent 0d25091e71
commit b308150303
20 changed files with 890 additions and 263 deletions
@@ -0,0 +1,132 @@
+import Tabs from '@/components/Tabs'
+import { useState, type FC } from 'react'
+import { TabMyRequestsEnum } from './enum/RequestEnum'
+import Filters from '@/components/Filters'
+import Button from '@/components/Button'
+import { AddSquare, Eye } from 'iconsax-react'
+import Table from '@/components/Table'
+import { useGetMyRequests } from './hooks/useRequestData'
+import moment from 'moment-jalaali'
+import { Link } from 'react-router-dom'
+import { Paths } from '@/config/Paths'
+
+const MyRequests: FC = () => {
+    const [page, setPage] = useState<number>(1)
+    const [activeTab, setActiveTab] = useState<TabMyRequestsEnum>(TabMyRequestsEnum.ALL)
+    const { data } = useGetMyRequests(page, activeTab)
+
+    return (
+        <div className='mt-5'>
+            <h1>
+                سفارشات من
+            </h1>
+
+            <div className='mt-10'>
+                <Tabs
+                    items={[
+                        { label: 'همه', value: TabMyRequestsEnum.ALL },
+                        { label: 'در حال انجام', value: TabMyRequestsEnum.IN_PROGRESS },
+                        { label: 'تکمیل داده شده', value: TabMyRequestsEnum.DELIVERED },
+                        { label: 'کنسل شده', value: TabMyRequestsEnum.CANCELLED },
+                    ]}
+                    activeTab={activeTab}
+                    onTabChange={(tab) => setActiveTab(tab as TabMyRequestsEnum)}
+                />
+            </div>
+
+            <div className='mt-16 flex justify-between items-center'>
+                <Filters
+                    fields={[
+                        { type: 'input', name: 'search', placeholder: 'جستجو' },
+                        { type: 'date', name: 'date', placeholder: 'تاریخ' },
+                        {
+                            type: 'select', name: 'status', placeholder: 'وضعیت', options: [
+                                { label: 'همه', value: 'all' },
+                                { label: 'در حال انجام', value: 'in_progress' },
+                                { label: 'تایید شده', value: 'confirmed' },
+                                { label: 'تحویل داده شده', value: 'delivered' },
+                                { label: 'کنسل شده', value: 'cancelled' },
+                            ]
+                        },
+                    ]}
+                    onChange={() => { }}
+                />
+
+                <Link to={Paths.newRequest}>
+                    <Button
+                        className='w-fit px-5'
+                    >
+                        <div className='flex items-center gap-2'>
+                            <AddSquare
+                                size={16}
+                                color='#000000'
+                            />
+                            <span>
+                                سفارش جدید
+                            </span>
+                        </div>
+                    </Button>
+                </Link>
+            </div>
+
+            <div className='mt-10'>
+                <Table
+                    columns={[
+                        {
+                            key: 'orderNumber',
+                            title: 'شماره',
+                        },
+                        {
+                            key: 'items',
+                            title: 'تعداد اقلام',
+                            render: (item) => {
+                                return (
+                                    <div>{item.items.length}</div>
+                                )
+                            }
+                        },
+                        {
+                            key: 'createdAt',
+                            title: 'زمان ثبت سفارش',
+                            render: (item) => {
+                                return (
+                                    <div>{moment(item.createdAt).format('jYYYY-jMM-jDD')}</div>
+                                )
+                            }
+                        },
+                        {
+                            key: 'designer',
+                            title: 'طراح',
+                        },
+                        {
+                            key: 'status',
+                            title: 'وضعیت سفارش',
+                        },
+                        {
+                            key: 'actions',
+                            title: '',
+                            render: (item) => {
+                                return (
+                                    <Link to={Paths.requestDetails + item.id}>
+                                        <Eye
+                                            size={20}
+                                            color='#000000'
+                                        />
+                                    </Link>
+                                )
+                            }
+                        }
+                    ]}
+                    data={data?.data}
+                    pagination={{
+                        currentPage: page,
+                        onPageChange: setPage,
+                        totalPages: data?.meta?.totalPages || 1
+                    }}
+                />
+            </div>
+        </div>
+    )
+}
+
+export default MyRequests