diff --git a/src/pages/order/MyOrders.tsx b/src/pages/order/MyOrders.tsx index dce86a0..4b970bc 100644 --- a/src/pages/order/MyOrders.tsx +++ b/src/pages/order/MyOrders.tsx @@ -6,11 +6,12 @@ import Button from '@/components/Button' import { AddSquare } from 'iconsax-react' import Table from '@/components/Table' import { useGetMyOrders } from './hooks/useOrderData' +import moment from 'moment-jalaali' const MyOrders: FC = () => { - + const [page, setPage] = useState(1) const [activeTab, setActiveTab] = useState(TabMyOrdersEnum.ALL) - const { data } = useGetMyOrders() + const { data } = useGetMyOrders(page, activeTab) return (
@@ -23,8 +24,7 @@ const MyOrders: FC = () => { items={[ { label: 'همه', value: TabMyOrdersEnum.ALL }, { label: 'در حال انجام', value: TabMyOrdersEnum.IN_PROGRESS }, - { label: 'تایید شده', value: TabMyOrdersEnum.CONFIRMED }, - { label: 'تحویل داده شده', value: TabMyOrdersEnum.DELIVERED }, + { label: 'تکمیل داده شده', value: TabMyOrdersEnum.DELIVERED }, { label: 'کنسل شده', value: TabMyOrdersEnum.CANCELLED }, ]} activeTab={activeTab} @@ -69,29 +69,31 @@ const MyOrders: FC = () => { { + return ( +
{item.items.length}
+ ) + } }, { key: 'createdAt', title: 'زمان ثبت سفارش', + render: (item) => { + return ( +
{moment(item.createdAt).format('jYYYY-jMM-jDD')}
+ ) + } }, { key: 'designer', title: 'طراح', }, - { - key: 'type', - title: 'نوع سفارش', - }, - { - key: 'itemsCount', - title: 'تعداد اقلام', - }, { key: 'status', title: 'وضعیت سفارش', @@ -101,17 +103,12 @@ const MyOrders: FC = () => { title: '', } ]} - data={[ - { - id: 1, - title: 'سفارش 1', - createdAt: '2021-01-01', - designer: 'طراح 1', - type: 'نوع 1', - itemsCount: 10, - status: 'در حال انجام', - }, - ]} + data={data?.data} + pagination={{ + currentPage: page, + onPageChange: setPage, + totalPages: data?.meta?.totalPages || 1 + }} /> diff --git a/src/pages/order/enum/OrderEnum.ts b/src/pages/order/enum/OrderEnum.ts index 376ba6e..153cf35 100644 --- a/src/pages/order/enum/OrderEnum.ts +++ b/src/pages/order/enum/OrderEnum.ts @@ -15,3 +15,28 @@ export const enum FieldTypeEnum { checkbox = "checkbox", date = "date", } + +export enum OrderStatusEnum { + CREATED = "created", + + INVOICED = "invoiced", + WAITING_to_CONFIRM_INVOICE = "waiting_to_confirm_invoice", + + DESIGN_INITIATED = "design_initiated", + DESIGN_FINISHED = "design_finished", + DESIGN_REVISION = "design_revision", + + READY_TO_PRINTING = "ready_to_printing", + IN_PRINTING = "in_printing", + + READY_FOR_DELIVERY = "ready_for_delivery", + DELIVERED = "delivered", + + AFTER_PRINT_COVER = "after_print_cover", + AFTER_PRINT_BOXING = "after_print_boxing", + AFTER_PRINT_CARTONING = "after_print_cartoning", + + FINISHED = "finished", + + CANCELED = "canceled", +} diff --git a/src/pages/order/hooks/useOrderData.ts b/src/pages/order/hooks/useOrderData.ts index 8cfaa5b..6b82df8 100644 --- a/src/pages/order/hooks/useOrderData.ts +++ b/src/pages/order/hooks/useOrderData.ts @@ -1,5 +1,6 @@ import { useMutation, useQuery } from "@tanstack/react-query"; import * as api from "../service/OrderService"; +import type { TabMyOrdersEnum } from "../enum/OrderEnum"; export const useGetProducts = () => { return useQuery({ @@ -14,9 +15,9 @@ export const useSubmitOrder = () => { }); }; -export const useGetMyOrders = () => { +export const useGetMyOrders = (page: number = 1, statuses: TabMyOrdersEnum) => { return useQuery({ queryKey: ["products"], - queryFn: api.getMyOrders, + queryFn: () => api.getMyOrders(page, statuses), }); }; diff --git a/src/pages/order/service/OrderService.ts b/src/pages/order/service/OrderService.ts index 76803ae..18bbde2 100644 --- a/src/pages/order/service/OrderService.ts +++ b/src/pages/order/service/OrderService.ts @@ -1,5 +1,10 @@ import axios from "@/config/axios"; -import type { OrderType, ProductsResponseType } from "../type/Types"; +import type { + MyOrdersResponseType, + OrderType, + ProductsResponseType, +} from "../type/Types"; +import { OrderStatusEnum, TabMyOrdersEnum } from "../enum/OrderEnum"; export const getProducts = async () => { const { data } = await axios.get(`/public/products`); @@ -11,7 +16,35 @@ export const submitOrder = async (params: OrderType[]) => { return data; }; -export const getMyOrders = async () => { - const { data } = await axios.get(`/public/orders`); +export const getMyOrders = async ( + page: number = 1, + active: TabMyOrdersEnum, +) => { + const statuses = + active === TabMyOrdersEnum.IN_PROGRESS + ? [ + OrderStatusEnum.DESIGN_FINISHED, + OrderStatusEnum.DESIGN_INITIATED, + OrderStatusEnum.DESIGN_REVISION, + OrderStatusEnum.IN_PRINTING, + OrderStatusEnum.AFTER_PRINT_BOXING, + OrderStatusEnum.AFTER_PRINT_CARTONING, + OrderStatusEnum.AFTER_PRINT_COVER, + OrderStatusEnum.READY_FOR_DELIVERY, + OrderStatusEnum.READY_TO_PRINTING, + ] + : active === TabMyOrdersEnum.CANCELLED + ? [OrderStatusEnum.CANCELED] + : active === TabMyOrdersEnum.DELIVERED + ? [OrderStatusEnum.DELIVERED] + : undefined; + + let query = `?page=${page}`; + if (statuses) { + query += `statuses=${statuses}`; + } + const { data } = await axios.get( + `/public/orders${query}`, + ); return data; }; diff --git a/src/pages/order/type/Types.ts b/src/pages/order/type/Types.ts index 7de56ec..69c9612 100644 --- a/src/pages/order/type/Types.ts +++ b/src/pages/order/type/Types.ts @@ -1,5 +1,6 @@ import type { BaseResponse } from "@/shared/types/Types"; import type { FieldTypeEnum } from "../enum/OrderEnum"; +import type { RowDataType } from "@/components/types/TableTypes"; export type CategoryType = { avatarUrl?: string; @@ -66,3 +67,33 @@ export type StoreType = { items: OrderType[]; setItems: (value: OrderType[]) => void; }; + +export interface MyOrderType extends RowDataType { + balance: number; + createdAt: string; + discount: number; + enableTax: boolean; + estimatedDays?: number; + orderNumber: number; + paidAmount: number; + paymentMethod: string; + status: string; + subTotal: number; + taxAmount: number; + total: number; + items: { + adminDescription?: string; + attachments: { + type: string; + url: string; + }[]; + description: string; + product: ProductType; + quantity: number; + subTotal: number; + total: number; + unitPrice: number; + }[]; +} + +export type MyOrdersResponseType = BaseResponse;