up

src/pages/order/List.tsx

@@ -11,6 +11,7 @@ import Button from '@/components/Button'
 import UserSearch from '../user/UserSearch'
 import DesignerSearch from '../designer/DesignerSearch'
 import CategoriesSelect from '../product/components/CategoriesSelect'
+import { getOrderStatusBadgeClass, getOrderStatusLabel } from './constants/orderStatus'
 
 const OrdersList: FC = () => {
 
@@ -132,13 +133,13 @@ const OrdersList: FC = () => {
                         {
                             key: 'status',
                             title: 'وضعیت',
-                            render: (item) => {
+                            render: (item) => (
-                                return (
+                                <span
-                                    <div className='h-6 w-fit flex items-center bg-[#FFEDCA] text-[#FF7B00]  rounded-full px-2.5 text-xs'>
+                                    className={`inline-flex h-6 items-center rounded-full px-2.5 text-xs ${getOrderStatusBadgeClass(item.status)}`}
-                                        {item.status}
+                                >
-                                    </div>
+                                    {getOrderStatusLabel(item.status)}
-                                )
+                                </span>
-                            }
+                            ),
                         },
                         {
                             key: 'createdAt',

src/pages/order/constants/orderStatus.ts

@@ -0,0 +1,43 @@
+import { OrderStatusEnum } from '../enum/OrderEnum'
+
+export const orderStatusLabels: Record<OrderStatusEnum, string> = {
+  [OrderStatusEnum.CREATED]: 'ایجاد شده',
+  [OrderStatusEnum.INVOICED]: 'فاکتور شده',
+  [OrderStatusEnum.WAITING_to_CONFIRM_INVOICE]: 'در انتظار تایید فاکتور',
+  [OrderStatusEnum.DESIGN_INITIATED]: 'شروع طراحی',
+  [OrderStatusEnum.DESIGN_FINISHED]: 'طراحی تمام شده',
+  [OrderStatusEnum.DESIGN_REVISION]: 'بازنگری طراحی',
+  [OrderStatusEnum.READY_TO_PRINTING]: 'آماده چاپ',
+  [OrderStatusEnum.IN_PRINTING]: 'در حال چاپ',
+  [OrderStatusEnum.AFTER_PRINT_COVER]: 'پس از چاپ جلد',
+  [OrderStatusEnum.AFTER_PRINT_BOXING]: 'بسته‌بندی',
+  [OrderStatusEnum.AFTER_PRINT_CARTONING]: 'کارتن‌سازی',
+  [OrderStatusEnum.READY_FOR_DELIVERY]: 'آماده ارسال',
+  [OrderStatusEnum.DELIVERED]: 'تحویل شده',
+  [OrderStatusEnum.FINISHED]: 'پایان یافته',
+  [OrderStatusEnum.CANCELED]: 'لغو شده',
+}
+
+export const orderStatusBadgeClass: Record<OrderStatusEnum, string> = {
+  [OrderStatusEnum.CREATED]: 'bg-blue-100 text-blue-800',
+  [OrderStatusEnum.INVOICED]: 'bg-green-100 text-green-800',
+  [OrderStatusEnum.WAITING_to_CONFIRM_INVOICE]: 'bg-amber-100 text-amber-800',
+  [OrderStatusEnum.DESIGN_INITIATED]: 'bg-blue-100 text-blue-800',
+  [OrderStatusEnum.DESIGN_FINISHED]: 'bg-green-100 text-green-800',
+  [OrderStatusEnum.DESIGN_REVISION]: 'bg-amber-100 text-amber-800',
+  [OrderStatusEnum.READY_TO_PRINTING]: 'bg-indigo-100 text-indigo-800',
+  [OrderStatusEnum.IN_PRINTING]: 'bg-purple-100 text-purple-800',
+  [OrderStatusEnum.AFTER_PRINT_COVER]: 'bg-sky-100 text-sky-800',
+  [OrderStatusEnum.AFTER_PRINT_BOXING]: 'bg-sky-100 text-sky-800',
+  [OrderStatusEnum.AFTER_PRINT_CARTONING]: 'bg-sky-100 text-sky-800',
+  [OrderStatusEnum.READY_FOR_DELIVERY]: 'bg-teal-100 text-teal-800',
+  [OrderStatusEnum.DELIVERED]: 'bg-green-100 text-green-800',
+  [OrderStatusEnum.FINISHED]: 'bg-green-100 text-green-800',
+  [OrderStatusEnum.CANCELED]: 'bg-red-100 text-red-800',
+}
+
+export const getOrderStatusLabel = (status: string) =>
+  orderStatusLabels[status as OrderStatusEnum] ?? status
+
+export const getOrderStatusBadgeClass = (status: string) =>
+  orderStatusBadgeClass[status as OrderStatusEnum] ?? 'bg-gray-100 text-gray-800'