danak/dmenu-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

list of orders

Browse Source
This commit is contained in:
hamid zarghami
2025-12-07 14:54:19 +03:30
parent 456f1a234f
commit 96650106a0
10 changed files with 463 additions and 206 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/orders/List.tsx
+27 -206
View File
@@ -1,231 +1,52 @@
import { type FC, useState } from 'react'
import Button from '@/components/Button'
import { type FC } from 'react'
import { useTranslation } from 'react-i18next'
import Table from '@/components/Table'
import Filters from '@/components/Filters'
import { Add, Eye } from 'iconsax-react'
import type { RowDataType, ActionType } from '@/components/types/TableTypes'
import type { FilterValues } from '@/components/Filters'
import { Link } from 'react-router-dom'
import { Pages } from '@/config/Pages'
interface OrderData extends RowDataType {
id: number
orderNumber: string
customerName: string
orderAmount: string
orderTime: string
deliveryType: string
paymentType: string
status: string
}
import { useGetOrders } from './hooks/useGetOrders'
import { useOrderFilters } from './hooks/useOrderFilters'
import { getOrderTableColumns } from './components/OrderTableColumns'
import { useOrderFiltersFields } from './components/OrderFiltersFields'
import type { Order } from './types/Types'
import type { RowDataType } from '@/components/types/TableTypes'
const OrdersList: FC = () => {
const [currentPage, setCurrentPage] = useState(1)
const totalPages = 2
const { t } = useTranslation('global')
const {
filters,
currentPage,
apiParams,
handleFiltersChange,
handlePageChange,
limit,
} = useOrderFilters()
const handlePageChange = (page: number) => {
setCurrentPage(page)
}
const { data: ordersData, isLoading } = useGetOrders(apiParams)
const handleFiltersChange = (newFilters: FilterValues) => {
console.log('فیلترها:', newFilters)
}
const orders = ordersData?.data || []
const columns = getOrderTableColumns({ t })
const filterFields = useOrderFiltersFields()
const handleRowActions = (item: OrderData): ActionType[] => {
return [
{
label: 'ویرایش',
onClick: () => {
console.log('ویرایش سفارش:', item.id)
},
},
{
label: 'حذف',
onClick: () => {
console.log('حذف سفارش:', item.id)
},
},
]
}
const getStatusColor = (status: string) => {
switch (status) {
case 'در حال آماده سازی':
return 'text-orange-500'
case 'تایید نشده':
return 'text-red-500'
case 'تحویل داده شده':
return 'text-green-500'
default:
return ''
}
}
const columns = [
{
key: 'orderNumber',
title: 'شماره سفارش',
},
{
key: 'customerName',
title: 'نام مشتری',
},
{
key: 'orderAmount',
title: 'مبلغ سفارش',
},
{
key: 'orderTime',
title: 'زمان سفارش',
},
{
key: 'deliveryType',
title: 'نوع تحویل',
},
{
key: 'paymentType',
title: 'نوع پرداخت',
},
{
key: 'status',
title: 'وضعیت',
render: (item: OrderData) => {
return (
<span className={getStatusColor(item.status)}>
{item.status}
</span>
)
},
},
{
key: 'details',
title: 'جزییات',
render: (item: OrderData) => {
return (
<Link to={Pages.orders.detail + item.id}>
<Eye size={20} color="#8C90A3" />
</Link>
)
},
},
]
const data: OrderData[] = [
{
id: 1,
orderNumber: '12345',
customerName: 'مهرداد مظفری',
orderAmount: '۴۲۰۰۰۰ تومان',
orderTime: '۱۴۰۳/۱۱/۲۵ ۱۳:۰۰:۰۰',
deliveryType: 'تحویل با پیک',
paymentType: 'پرداخت آنلاین',
status: 'در حال آماده سازی',
},
{
id: 2,
orderNumber: '12345',
customerName: 'مهرداد مظفری',
orderAmount: '۴۲۰۰۰۰ تومان',
orderTime: '۱۴۰۳/۱۱/۲۵ ۱۳:۰۰:۰۰',
deliveryType: 'تحویل با پیک',
paymentType: 'پرداخت آنلاین',
status: 'در انتظار تایید',
},
{
id: 3,
orderNumber: '12345',
customerName: 'مهرداد مظفری',
orderAmount: '۴۲۰۰۰۰ تومان',
orderTime: '۱۴۰۳/۱۱/۲۵ ۱۳:۰۰:۰۰',
deliveryType: 'تحویل با پیک',
paymentType: 'پرداخت آنلاین',
status: 'تایید نشده',
},
{
id: 4,
orderNumber: '12345',
customerName: 'مهرداد مظفری',
orderAmount: '۴۲۰۰۰۰ تومان',
orderTime: '۱۴۰۳/۱۱/۲۵ ۱۳:۰۰:۰۰',
deliveryType: 'تحویل با پیک',
paymentType: 'پرداخت با کیف پول',
status: 'تحویل داده شده',
},
{
id: 5,
orderNumber: '12345',
customerName: 'مهرداد مظفری',
orderAmount: '۴۲۰۰۰۰ تومان',
orderTime: '۱۴۰۳/۱۱/۲۵ ۱۳:۰۰:۰۰',
deliveryType: 'سرو در رستوران',
paymentType: 'پرداخت در محل',
status: 'تحویل داده شده',
},
{
id: 6,
orderNumber: '12345',
customerName: 'مهرداد مظفری',
orderAmount: '۴۲۰۰۰۰ تومان',
orderTime: '۱۴۰۳/۱۱/۲۵ ۱۳:۰۰:۰۰',
deliveryType: 'تحویل در ماشین',
paymentType: 'پرداخت آنلاین',
status: 'تحویل داده شده',
},
]
const totalPages = Math.ceil(orders.length / limit) || 1
return (
<div className='mt-5'>
<div className='flex justify-between items-center'>
<h1 className='text-lg font-light'>لیست سفارشات</h1>
<Button className='w-fit px-6'>
<div className='flex gap-2 items-center'>
<Add color='#fff' size={20} />
<span>افزودن سفارش</span>
</div>
</Button>
</div>
<div className='mt-8'>
<Filters
fields={[
{
type: 'input',
name: 'search',
placeholder: 'جستجو',
},
{
type: 'select',
name: 'status',
placeholder: 'وضعیت',
options: [
{ value: '', label: 'همه' },
{ value: 'در حال آماده سازی', label: 'در حال آماده سازی' },
{ value: 'در انتظار تایید', label: 'در انتظار تایید' },
{ value: 'تایید نشده', label: 'تایید نشده' },
{ value: 'تحویل داده شده', label: 'تحویل داده شده' },
],
},
{
type: 'select',
name: 'deliveryType',
placeholder: 'نوع تحویل',
options: [
{ value: '', label: 'همه' },
{ value: 'تحویل با پیک', label: 'تحویل با پیک' },
{ value: 'سرو در رستوران', label: 'سرو در رستوران' },
{ value: 'تحویل در ماشین', label: 'تحویل در ماشین' },
],
},
]}
fields={filterFields}
onChange={handleFiltersChange}
initialValues={filters}
searchField="search"
/>
</div>
<Table
<Table<Order & RowDataType>
columns={columns}
data={data}
rowActions={handleRowActions}
data={orders as (Order & RowDataType)[]}
isloading={isLoading}
pagination={{
currentPage,
totalPages,