81 lines
3.5 KiB
TypeScript
81 lines
3.5 KiB
TypeScript
import React, { useState, useCallback } from 'react'
|
|
import { View, Text, ScrollView, TouchableOpacity, StyleSheet, Alert, RefreshControl } from 'react-native'
|
|
import { useFocusEffect } from 'expo-router'
|
|
import { COLORS } from '../../constants/Config'
|
|
import { getPatchStatus, getPIITypes, applyPatch } from '../../services/api'
|
|
|
|
const SEV_COLOR: Record<string, string> = {
|
|
critical: COLORS.danger,
|
|
high: '#F97316',
|
|
medium: COLORS.warning,
|
|
low: COLORS.success,
|
|
}
|
|
|
|
export default function PIIStatusScreen() {
|
|
const [piiTypes, setPiiTypes] = useState<any[]>([])
|
|
const [servers, setServers] = useState<any[]>([])
|
|
const [loading, setLoading] = useState(false)
|
|
|
|
const load = useCallback(async () => {
|
|
setLoading(true)
|
|
try {
|
|
const [p, s] = await Promise.all([getPIITypes(), getPatchStatus()])
|
|
setPiiTypes(p.data?.items ?? [])
|
|
setServers(s.data?.servers ?? [])
|
|
} catch {} finally { setLoading(false) }
|
|
}, [])
|
|
|
|
useFocusEffect(useCallback(() => { load() }, [load]))
|
|
|
|
return (
|
|
<ScrollView style={s.container} refreshControl={<RefreshControl refreshing={loading} onRefresh={load} />}>
|
|
|
|
{/* PII 유형 */}
|
|
<Text style={s.section}>PII 데이터 처리 현황</Text>
|
|
{piiTypes.map((p, i) => (
|
|
<View key={i} style={s.card}>
|
|
<View style={s.row}>
|
|
<Text style={s.piiName}>{p.name}</Text>
|
|
<View style={[s.badge, { backgroundColor: p.status === 'compliant' ? COLORS.success : COLORS.danger }]}>
|
|
<Text style={s.badgeText}>{p.status === 'compliant' ? '준수' : '미준수'}</Text>
|
|
</View>
|
|
</View>
|
|
<Text style={s.meta}>저장 방식: {p.storage} · 보존: {p.retention}</Text>
|
|
</View>
|
|
))}
|
|
|
|
{/* 서버별 패치율 */}
|
|
<Text style={s.section}>서버 패치 적용 현황</Text>
|
|
{servers.map((srv, i) => (
|
|
<View key={i} style={s.card}>
|
|
<View style={s.row}>
|
|
<Text style={s.srvName}>{srv.name} <Text style={s.role}>({srv.role})</Text></Text>
|
|
<Text style={[s.rate, { color: srv.patch_rate >= 80 ? COLORS.success : COLORS.danger }]}>{srv.patch_rate}%</Text>
|
|
</View>
|
|
<View style={s.barBg}>
|
|
<View style={[s.barFill, { width: `${srv.patch_rate}%`, backgroundColor: srv.patch_rate >= 80 ? COLORS.success : COLORS.warning }]} />
|
|
</View>
|
|
<Text style={s.pending}>미적용: {srv.pending}건</Text>
|
|
</View>
|
|
))}
|
|
</ScrollView>
|
|
)
|
|
}
|
|
|
|
const s = StyleSheet.create({
|
|
container: { flex: 1, backgroundColor: COLORS.bg },
|
|
section: { fontSize: 15, fontWeight: '700', color: COLORS.text, padding: 16, paddingBottom: 8 },
|
|
card: { backgroundColor: '#fff', borderRadius: 10, marginHorizontal: 12, marginBottom: 8, padding: 14, elevation: 1 },
|
|
row: { flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', marginBottom: 4 },
|
|
piiName: { fontSize: 14, fontWeight: '600', color: COLORS.text },
|
|
badge: { borderRadius: 4, paddingHorizontal: 6, paddingVertical: 2 },
|
|
badgeText: { fontSize: 11, color: '#fff', fontWeight: '700' },
|
|
meta: { fontSize: 12, color: COLORS.muted },
|
|
srvName: { fontSize: 14, fontWeight: '600', color: COLORS.text },
|
|
role: { fontWeight: '400', color: COLORS.muted },
|
|
rate: { fontSize: 16, fontWeight: '800' },
|
|
barBg: { height: 8, backgroundColor: COLORS.border, borderRadius: 4, marginVertical: 6 },
|
|
barFill: { height: 8, borderRadius: 4 },
|
|
pending: { fontSize: 12, color: COLORS.muted },
|
|
})
|