-
Mini Room Count: {data.miniRoomCount}
-
Standard Room Count: {data.standardRoomCount}
-
Medium Room Count: {data.mediumRoomCount}
-
State Room Count: {data.stateRoomCount}
+ const meetingRooms = [
+ { type: 'mini', label: '미니', capacity: '1~4명', description: '적은 인원 수가 빠르게 회의 진행할 수 있는 공간', count: data.miniRoomCount },
+ { type: 'standard', label: '스탠다드', capacity: '5~8명', description: '적은 인원 수가 빠르게 회의 진행할 수 있는 공간', count: data.standardRoomCount },
+ { type: 'medium', label: '미디움', capacity: '9~12명', description: '적은 인원 수가 빠르게 회의 진행할 수 있는 공간', count: data.mediumRoomCount },
+ { type: 'state', label: '스테이트', capacity: '13~15명', description: '여러 팀의 협업 또는 화상회의가 편한 공간', count: data.stateRoomCount },
+ ] as const;
+
+ if (activeTab === 'meetingRoom') {
+ return (
+
+ {meetingRooms.map((room, index) => (
+
+
+
+
+
+
{room.label}
+
{room.count}개
+
+
+
+
{room.capacity} 수용 가능
+
+
{room.description}
+
+
+
+ ))}
+
+ );
+ }
+
+ if (activeTab === 'rechargingRoom') {
+ return (
+
+
+
+
+
+
리차징룸
+
{data.rechargingRoomCount}개
+
+
+
+
휴대폰 고속 충전기 및 리클라이너가 구비되어 있어
업무 중 휴식이 필요할 때 편리하게 이용할 수 있습니다.
+
- );
- case 'rechargingRoom':
- return
Recharging Room Count: {data.rechargingRoomCount}
;
- case 'focusZone':
- return
Focus Desk Count: {data.focusDeskCount}
;
- default:
- return null;
+
+ );
+ }
+
+ if (activeTab === 'focusZone') {
+ return (
+
+
+
+
+
+
포커스존
+
{data.focusDeskCount}개
+
+
+
+
개인 오피스 안에서 업무를 효율적으로 볼 수 있습니다.
+
+
+
+ );
}
};
diff --git a/src/components/reservation/ReservationIndex.tsx b/src/components/reservation/ReservationIndex.tsx
index 8ba79b7..af143bf 100644
--- a/src/components/reservation/ReservationIndex.tsx
+++ b/src/components/reservation/ReservationIndex.tsx
@@ -1,13 +1,28 @@
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
import CurrentRoom from './shared/CurrentRoom';
import ChangeRoomType from './shared/ChangeRoomType';
import FocuszoneIndex from './focuszone/FocuszoneIndex';
import MeetingRoomIndex from './meetingRoom/MeetingRoomIndex';
import RechargingRoomIndex from './rechargingRoom/RechargingRoomIndex';
-const ReservationIndex = () => {
+interface ReservationIndexProps {
+ initialTab: string;
+}
+
+const ReservationIndex: React.FC
= ({ initialTab }) => {
const [currentRoom, setCurrentRoom] = useState('meeting');
+ useEffect(() => {
+ if (initialTab) {
+ const tabMapping: { [key: string]: string } = {
+ meetingRoom: 'meeting',
+ rechargingRoom: 'recharging',
+ focusZone: 'focus'
+ };
+ setCurrentRoom(tabMapping[initialTab] || 'meeting');
+ }
+ }, [initialTab]);
+
return (
{/* 현재 지정된 오피스 */}
diff --git a/src/components/reservation/focuszone/AvailavleCount.tsx b/src/components/reservation/focuszone/AvailavleCount.tsx
index a2ec927..f51e982 100644
--- a/src/components/reservation/focuszone/AvailavleCount.tsx
+++ b/src/components/reservation/focuszone/AvailavleCount.tsx
@@ -11,13 +11,11 @@ const AvailavleCount = () => {
const updatedTimeReserved = useBranchStore2((state) => state.updatedTimeReserved);
const currentBranch =
- updatedTimeSelected &&
- updatedTimeReserved &&
- updatedTimeSelected > updatedTimeReserved
- ? selectedBranch
- : reservedBranch;
+ updatedTimeSelected && updatedTimeReserved && updatedTimeSelected > updatedTimeReserved
+ ? selectedBranch
+ : reservedBranch || selectedBranch;
- const branchId = currentBranch!.branchId as number;
+ const branchId = currentBranch?.branchId as number;
const { data } = useQuery(
['availableCount', branchId],
diff --git a/src/components/reservation/focuszone/FocuszoneHead.tsx b/src/components/reservation/focuszone/FocuszoneHead.tsx
index 3bf1bac..913a90b 100644
--- a/src/components/reservation/focuszone/FocuszoneHead.tsx
+++ b/src/components/reservation/focuszone/FocuszoneHead.tsx
@@ -14,9 +14,9 @@ const FocuszoneHead = () => {
const updatedTimeReserved = useBranchStore2((state) => state.updatedTimeReserved);
const currentBranch =
- updatedTimeSelected && updatedTimeReserved && updatedTimeSelected > updatedTimeReserved
- ? selectedBranch
- : reservedBranch;
+ updatedTimeSelected && updatedTimeReserved && updatedTimeSelected > updatedTimeReserved
+ ? selectedBranch
+ : reservedBranch || selectedBranch;
const branchId = currentBranch?.branchId;
diff --git a/src/components/reservation/focuszone/selectSeat/ConfirmModal.tsx b/src/components/reservation/focuszone/selectSeat/ConfirmModal.tsx
index ffb9564..b607acd 100644
--- a/src/components/reservation/focuszone/selectSeat/ConfirmModal.tsx
+++ b/src/components/reservation/focuszone/selectSeat/ConfirmModal.tsx
@@ -20,11 +20,9 @@ const ConfirmModal = ({ setModalOpen, modalDeskNumber }: ConfirmModalType) => {
const updatedTimeReserved = useBranchStore2((state) => state.updatedTimeReserved);
const currentBranch =
- updatedTimeSelected &&
- updatedTimeReserved &&
- updatedTimeSelected > updatedTimeReserved
- ? selectedBranch
- : reservedBranch;
+ updatedTimeSelected && updatedTimeReserved && updatedTimeSelected > updatedTimeReserved
+ ? selectedBranch
+ : reservedBranch || selectedBranch;
const branchName = currentBranch?.branchName;
const now = new Date();
diff --git a/src/components/reservation/focuszone/selectSeat/SelectSeatIndex.tsx b/src/components/reservation/focuszone/selectSeat/SelectSeatIndex.tsx
index 0b53c2d..d3f7d76 100644
--- a/src/components/reservation/focuszone/selectSeat/SelectSeatIndex.tsx
+++ b/src/components/reservation/focuszone/selectSeat/SelectSeatIndex.tsx
@@ -20,9 +20,9 @@ const SelectSeatIndex = () => {
const updatedTimeReserved = useBranchStore2((state) => state.updatedTimeReserved);
const currentBranch =
- updatedTimeSelected && updatedTimeReserved && updatedTimeSelected > updatedTimeReserved
- ? selectedBranch
- : reservedBranch;
+ updatedTimeSelected && updatedTimeReserved && updatedTimeSelected > updatedTimeReserved
+ ? selectedBranch
+ : reservedBranch || selectedBranch;
const branchId = currentBranch?.branchId;
diff --git a/src/components/reservation/focuszone/selectSeat/SelectSeatNav.tsx b/src/components/reservation/focuszone/selectSeat/SelectSeatNav.tsx
index 4bf9749..862ef7a 100644
--- a/src/components/reservation/focuszone/selectSeat/SelectSeatNav.tsx
+++ b/src/components/reservation/focuszone/selectSeat/SelectSeatNav.tsx
@@ -11,11 +11,9 @@ const SelectSeatNav = () => {
const updatedTimeReserved = useBranchStore2((state) => state.updatedTimeReserved);
const currentBranch =
- updatedTimeSelected &&
- updatedTimeReserved &&
- updatedTimeSelected > updatedTimeReserved
- ? selectedBranch
- : reservedBranch;
+ updatedTimeSelected && updatedTimeReserved && updatedTimeSelected > updatedTimeReserved
+ ? selectedBranch
+ : reservedBranch || selectedBranch;
const [currentTime, setCurrentTime] = useState(format(new Date(), 'HH:mm'));
const queryClient = useQueryClient();
diff --git a/src/components/reservation/meetingRoom/DatePickerModal.tsx b/src/components/reservation/meetingRoom/DatePickerModal.tsx
index 1fb0ddb..b077a7e 100644
--- a/src/components/reservation/meetingRoom/DatePickerModal.tsx
+++ b/src/components/reservation/meetingRoom/DatePickerModal.tsx
@@ -148,7 +148,7 @@ const DatePickerModal: React.FC
= ({
return (
-
+
-
- {meetingRooms.map((room) => (
-
handleRoomClick(room.meetingRoomId)}>
-
-
-
-
-
- {room.meetingRoomName}
-
-
-
-
- {room.meetingRoomFloor < 0 ? `B${Math.abs(room.meetingRoomFloor)}` : `${room.meetingRoomFloor}`}층
+ {meetingRooms.length === 0 ? (
+
+ 조건에 맞는 미팅룸이 없습니다.
+
+ ) : (
+
+ {meetingRooms.map((room) => (
+
handleRoomClick(room.meetingRoomId)}>
+
+
+
+
+
+ {room.meetingRoomName}
+
+
+
+
+ {room.meetingRoomFloor < 0 ? `B${Math.abs(room.meetingRoomFloor)}` : `${room.meetingRoomFloor}`}층
+
+
+
1~{room.meetingRoomCapacity}명
+
-
-
1~{room.meetingRoomCapacity}명
-
+ ))}
- ))}
-
+ )}
{startTime && endTime && (
{
{showSearch && (
<>
- {addedMembers.length > 0 && (
-
- {addedMembers.map(member => (
-
-
-
- {member.memberName}
-
-
handleRemoveMember(member)} />
-
-
- ))}
-
- )}
+ {addedMembers.length > 0 && (
+
+
+ {addedMembers.map(member => (
+
+
+
+ {member.memberName}
+
+
handleRemoveMember(member)} />
+
+
+ ))}
+
+
+)}
+
+
+
+