diff --git a/apps/nowait-admin/src/pages/AdminOrders/OrderCard.tsx b/apps/nowait-admin/src/pages/AdminOrders/OrderCard.tsx index feff7c19..ab0fbe2e 100644 --- a/apps/nowait-admin/src/pages/AdminOrders/OrderCard.tsx +++ b/apps/nowait-admin/src/pages/AdminOrders/OrderCard.tsx @@ -2,6 +2,7 @@ import ArrowRight from "../../assets/arrow_back.svg?react"; import { useState } from "react"; import { PaymentCheckModal, CookedModal } from "./OrderPageModal"; import type { MenuNamesAndQuantities } from "../../types/order"; +import { getTableBackgroundColor } from "../../utils/tableColors"; interface PaymentCardProps { orderId: number; @@ -40,7 +41,10 @@ const PaymentCard = ({ onClick={onClick} >
-
+
{tableNumber}
@@ -135,7 +139,10 @@ const PaymentDetail = ({
-
+
{tableNumber}
@@ -238,7 +245,10 @@ const CookCard = ({ tableNumber, menuNamesAndQuantities }: CookCardProps) => { }`} >
-
+
{tableNumber}
diff --git a/apps/nowait-admin/src/pages/AdminOrders/OrderPageModal.tsx b/apps/nowait-admin/src/pages/AdminOrders/OrderPageModal.tsx index dfdd12a7..0bceba3f 100644 --- a/apps/nowait-admin/src/pages/AdminOrders/OrderPageModal.tsx +++ b/apps/nowait-admin/src/pages/AdminOrders/OrderPageModal.tsx @@ -1,4 +1,5 @@ import { useUpdateOrderStatus } from "../../hooks/useUpdateOrderStatus"; +import { getTableBackgroundColor } from "../../utils/tableColors"; // Payment Check Modal interface PaymentCheckModalProps { @@ -54,7 +55,10 @@ const PaymentCheckModal = ({
-
+
{tableNumber}
diff --git a/apps/nowait-admin/src/utils/tableColors.ts b/apps/nowait-admin/src/utils/tableColors.ts new file mode 100644 index 00000000..f9d69a5a --- /dev/null +++ b/apps/nowait-admin/src/utils/tableColors.ts @@ -0,0 +1,42 @@ +// 테이블 번호별 색상 정의 (1번-30번) +const tableColors = [ + "#576376", + "#CEB4F0", + "#A5B8D6", + "#84A6AD", + "#788FB6", + "#99a3b4", + "#6C707A", + "#898BBC", + "#95C8BC", + "#B4B4B4", + "#3C485C", + "#A27FCF", + "#849CC3", + "#5F8992", + "#5472A3", + "#6B7C99", + "#4B4F59", + "#6B6D9B", + "#6FA99B", + "#929292", + "#3C485C", + "#875FBB", + "#6484B7", + "#4C6E75", + "#3F5A86", + "#52637F", + "#3E4045", + "#4C4E75", + "#507F74", + "#767676", +]; + +export const getTableBackgroundColor = (tableNumber: number): string => { + // 1-30번 범위 체크 + if (tableNumber < 1 || tableNumber > 30) { + return "#6C707A"; // 범위 외 색상 + } + + return tableColors[tableNumber - 1]; +};