b06a35c512
## GUARDiA Manager (frontend) - pages/DrConsole.tsx — DR 재해복구 관제 (시나리오/RTO-RPO/테스트 실행) - pages/NetworkConsole.tsx — 네트워크 장비 관제 (백업/diff/상태) - pages/CsapConsole.tsx — CSAP 준수율 대시보드 (점검/Excel 다운로드) - App.tsx — 3개 라우트 추가 (/dr, /network, /csap) - Sidebar.tsx — '운영 관제' 그룹 메뉴 추가 - AppLayout.tsx — 페이지 타이틀 3개 추가 ## GUARDiA Messenger (React Native) - app/(tabs)/dr.tsx — DR 모니터링 화면 (M-01) - app/(tabs)/network.tsx — 네트워크 장비 현황 화면 (M-02) - app/(tabs)/_layout.tsx — DR·네트워크 탭 추가 - services/api.ts — DR/네트워크/CSAP API 함수 추가 - hooks/useBiometric.ts — 생체인증 훅 (M-03) - hooks/useOfflineCache.ts — 오프라인 캐시 훅 (M-04) ## 매뉴얼 - 16_API_명세서.md — v2.2.0 업데이트 - 39_DR_네트워크장비_CSAP_운영가이드.md — Manager/Messenger UI 연동 현황 추가 Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
85 lines
2.5 KiB
TypeScript
85 lines
2.5 KiB
TypeScript
import { Tabs } from 'expo-router'
|
|
import { View, Text, StyleSheet } from 'react-native'
|
|
import { COLORS } from '../../constants/Config'
|
|
|
|
function TabIcon({ icon, label, focused }: { icon: string; label: string; focused: boolean }) {
|
|
return (
|
|
<View style={[tab.wrap, focused && tab.active]}>
|
|
<Text style={tab.icon}>{icon}</Text>
|
|
<Text style={[tab.label, focused && tab.labelActive]}>{label}</Text>
|
|
</View>
|
|
)
|
|
}
|
|
|
|
const tab = StyleSheet.create({
|
|
wrap: { alignItems: 'center', paddingTop: 4 },
|
|
active: {},
|
|
icon: { fontSize: 22 },
|
|
label: { fontSize: 10, color: COLORS.muted, marginTop: 2 },
|
|
labelActive: { color: COLORS.accent, fontWeight: '600' },
|
|
})
|
|
|
|
export default function TabLayout() {
|
|
return (
|
|
<Tabs
|
|
screenOptions={{
|
|
headerStyle: { backgroundColor: COLORS.gnbBg },
|
|
headerTintColor: '#fff',
|
|
headerTitleStyle: { fontWeight: '700' },
|
|
tabBarStyle: { backgroundColor: '#fff', borderTopColor: COLORS.border, height: 60 },
|
|
tabBarShowLabel: false,
|
|
}}
|
|
>
|
|
<Tabs.Screen
|
|
name="index"
|
|
options={{
|
|
title: '대시보드',
|
|
tabBarIcon: ({ focused }) => <TabIcon icon="📊" label="대시보드" focused={focused} />,
|
|
}}
|
|
/>
|
|
<Tabs.Screen
|
|
name="sr"
|
|
options={{
|
|
title: '서비스 요청',
|
|
tabBarIcon: ({ focused }) => <TabIcon icon="📋" label="SR" focused={focused} />,
|
|
}}
|
|
/>
|
|
<Tabs.Screen
|
|
name="chat"
|
|
options={{
|
|
title: 'AI 챗봇',
|
|
tabBarIcon: ({ focused }) => <TabIcon icon="🤖" label="AI" focused={focused} />,
|
|
}}
|
|
/>
|
|
<Tabs.Screen
|
|
name="notifications"
|
|
options={{
|
|
title: '알림',
|
|
tabBarIcon: ({ focused }) => <TabIcon icon="🔔" label="알림" focused={focused} />,
|
|
}}
|
|
/>
|
|
<Tabs.Screen
|
|
name="dr"
|
|
options={{
|
|
title: 'DR 관제',
|
|
tabBarIcon: ({ focused }) => <TabIcon icon="🛡️" label="DR" focused={focused} />,
|
|
}}
|
|
/>
|
|
<Tabs.Screen
|
|
name="network"
|
|
options={{
|
|
title: '네트워크',
|
|
tabBarIcon: ({ focused }) => <TabIcon icon="🔀" label="네트워크" focused={focused} />,
|
|
}}
|
|
/>
|
|
<Tabs.Screen
|
|
name="settings"
|
|
options={{
|
|
title: '설정',
|
|
tabBarIcon: ({ focused }) => <TabIcon icon="⚙️" label="설정" focused={focused} />,
|
|
}}
|
|
/>
|
|
</Tabs>
|
|
)
|
|
}
|