fix: 카테고리 배지 표시 개선 및 디버깅 로그 추가

- 매핑이 없어도 항상 배지로 표시
- 매핑 없을 시 코드값 그대로 + 기본 slate 색상 사용
- 카테고리 매핑 로드 과정 로그 추가
- 기존 데이터에 기본 색상 추가하는 마이그레이션 스크립트 생성
This commit is contained in:
kjs 2025-11-06 12:15:47 +09:00
parent 7581cd1582
commit b526d8ea2c
1 changed files with 22 additions and 18 deletions

View File

@ -226,12 +226,14 @@ export const InteractiveDataTable: React.FC<InteractiveDataTableProps> = ({
};
});
mappings[col.columnName] = mapping;
console.log(`✅ 카테고리 매핑 로드 성공 [${col.columnName}]:`, mapping);
}
} catch (error) {
// 카테고리 값 로드 실패 시 무시
console.error(`❌ 카테고리 값 로드 실패 [${col.columnName}]:`, error);
}
}
console.log("📊 전체 카테고리 매핑:", mappings);
setCategoryMappings(mappings);
} catch (error) {
console.error("카테고리 매핑 로드 실패:", error);
@ -1915,24 +1917,26 @@ export const InteractiveDataTable: React.FC<InteractiveDataTableProps> = ({
switch (actualWebType) {
case "category": {
// 카테고리 타입: 배지로 표시
if (!value) return "";
const mapping = categoryMappings[column.columnName];
if (mapping && value) {
const categoryData = mapping[String(value)];
if (categoryData) {
return (
<Badge
style={{
backgroundColor: categoryData.color || "#3b82f6",
borderColor: categoryData.color || "#3b82f6"
}}
className="text-white"
>
{categoryData.label}
</Badge>
);
}
}
return String(value || "");
const categoryData = mapping?.[String(value)];
// 매핑 데이터가 있으면 라벨과 색상 사용, 없으면 코드값과 기본색상
const displayLabel = categoryData?.label || String(value);
const displayColor = categoryData?.color || "#64748b"; // 기본 slate 색상
return (
<Badge
style={{
backgroundColor: displayColor,
borderColor: displayColor
}}
className="text-white"
>
{displayLabel}
</Badge>
);
}
case "date":