- {toasts.map((t) => {
+ {visibles.map((t) => {
const tableId = t.meta?.tableId as number | undefined;
const orderName = t.meta?.orderName ?? "신규 주문";
const menuDetails = (t.meta?.menuDetails ?? {}) as Record<
@@ -134,7 +151,14 @@ export default function NewOrderToast() {
removeToast(t.id)}
- onTap={() => navigate(`/admin/orders/${storeId}`)} // ← 클릭 이동은 여기서!
+ onTap={() => {
+ const params = new URLSearchParams();
+ params.set("order", String(t.orderId));
+ navigate({
+ pathname: `/admin/orders/${storeId}`,
+ search: params.toString(),
+ });
+ }}
>
o.status === "WAITING_FOR_PAYMENT"; // 필요 시 조건 조절
+const isInitialStatus = (o: Order) => o.status === "WAITING_FOR_PAYMENT";
export function useDetectNewOrders(orders: Order[] | undefined) {
const seenIdsRef = useRef
>(new Set());
@@ -18,7 +18,6 @@ export function useDetectNewOrders(orders: Order[] | undefined) {
useEffect(() => {
if (!orders) return;
- // 첫 로딩은 베이스라인만 세팅(알림 X)
if (!initializedRef.current) {
seenIdsRef.current = new Set(orders.map((o) => o.id));
const maxCreated = Math.max(
@@ -44,6 +43,7 @@ export function useDetectNewOrders(orders: Order[] | undefined) {
pushToast({
id: String(o.id),
orderId: o.id,
+ status: o.status,
title: "신규 주문 도착",
body: `테이블 ${o.tableId} / ${o.depositorName ?? "고객"}`,
meta: {
diff --git a/apps/nowait-admin/src/hooks/useNewOrderToastStore.tsx b/apps/nowait-admin/src/hooks/useNewOrderToastStore.tsx
index 900336ef..f93857a8 100644
--- a/apps/nowait-admin/src/hooks/useNewOrderToastStore.tsx
+++ b/apps/nowait-admin/src/hooks/useNewOrderToastStore.tsx
@@ -1,8 +1,11 @@
import { create } from "zustand";
+type OrderStatus = "WAITING_FOR_PAYMENT" | "COOKING" | "COOKED";
+
type Toast = {
id: string;
orderId: number;
+ status: OrderStatus;
title: string;
body: string;
meta?: {
@@ -45,8 +48,9 @@ export const useNewOrderToastStore = create((set, get) => ({
if (dismissed.has(t.id)) return;
// 중복 방지
if (get().toasts.some((x) => x.id === t.id)) return;
- set((s) => ({ toasts: [t, ...s.toasts].slice(0, 3) }));
-
+ set((s) => ({
+ toasts: [...s.toasts, t],
+ }));
// 사운드 (선택)
try {
const audio =
diff --git a/apps/nowait-admin/src/pages/AdminOrders/AdminOrders.tsx b/apps/nowait-admin/src/pages/AdminOrders/AdminOrders.tsx
index bfdbd4aa..006208cf 100644
--- a/apps/nowait-admin/src/pages/AdminOrders/AdminOrders.tsx
+++ b/apps/nowait-admin/src/pages/AdminOrders/AdminOrders.tsx
@@ -1,5 +1,5 @@
import { useState, useRef, useEffect } from "react";
-import { useParams } from "react-router";
+import { useLocation, useNavigate, useParams } from "react-router";
import { PaymentCard, CookCard, CookedCard } from "./OrderCard";
import { DetailCard } from "./DetailCard";
import refreshIcon from "../../assets/refresh.svg";
@@ -27,6 +27,15 @@ const AdminOrders = () => {
const windowWidth = useWindowWidth();
const isMobile = windowWidth <= 450;
const storeId = Number(storeIdParam);
+ const { search } = useLocation();
+ const qs = new URLSearchParams(search); // ← 추가\
+ const navigate = useNavigate();
+ const queryOrderId = qs.get("order"); // ← 추가
+ const queryStatus = qs.get("status") as
+ | "WAITING_FOR_PAYMENT"
+ | "COOKING"
+ | "COOKED"
+ | null;
// API에서 주문 데이터 가져오기
const {
@@ -87,14 +96,17 @@ const AdminOrders = () => {
// PaymentDetail 닫기 핸들러
const handleClosePaymentDetail = () => {
setSelectedPayment(null);
- // 약간의 딜레이 후 스크롤 위치 복원
setTimeout(() => {
if (scrollContainerRef.current) {
scrollContainerRef.current.scrollTop = savedScrollPosition;
}
}, 0);
+ const p = new URLSearchParams(location.search);
+ p.delete("order");
+ // status는 유지하고 싶으면 남겨도 됨. 지우고 싶다면 다음 줄도 활성화:
+ // p.delete("status");
+ navigate({ search: p.toString() }, { replace: true });
};
-
// CookedCard 클릭 핸들러
const handleCookedCardClick = (cooked: Order) => {
if (scrollContainerRef.current) {
@@ -106,10 +118,49 @@ const AdminOrders = () => {
setSelectedPayment(cooked);
};
+ const openDetail = (order: Order) => {
+ if (scrollContainerRef.current) {
+ setSavedScrollPosition(scrollContainerRef.current.scrollTop);
+ scrollContainerRef.current.scrollTop = 0;
+ }
+ setSelectedPayment(order);
+
+ const p = new URLSearchParams(location.search);
+ p.set("order", String(order.id));
+ p.set("status", order.status); // 상태 동기화
+ navigate({ search: p.toString() }, { replace: true });
+ };
+
+ useEffect(() => {
+ if (!queryStatus) return;
+
+ // 데스크톱 탭
+ if (queryStatus === "COOKED") {
+ setActiveTab("조리 완료");
+ } else {
+ setActiveTab("전체");
+ }
+
+ // 모바일 탭
+ if (queryStatus === "WAITING_FOR_PAYMENT") setMobileActiveTab("입금 대기");
+ else if (queryStatus === "COOKING") setMobileActiveTab("조리 중");
+ else if (queryStatus === "COOKED") setMobileActiveTab("조리 완료");
+ }, [queryStatus]);
+
+ useEffect(() => {
+ if (!orders?.length || !queryOrderId) return;
+
+ const found = orders.find((o) => String(o.id) === queryOrderId);
+ if (!found) return;
+
+ openDetail(found);
+ }, [orders, queryOrderId]);
+
// 탭 변경 시 Detail 닫기
useEffect(() => {
+ if (queryOrderId) return;
setSelectedPayment(null);
- }, [activeTab, mobileActiveTab]);
+ }, [activeTab, mobileActiveTab, queryOrderId]);
return (
{
)}
- {/* */}
- {/*
*/}