fix: 카테고리 배지 표시 개선 및 디버깅 로그 추가
- 매핑이 없어도 항상 배지로 표시 - 매핑 없을 시 코드값 그대로 + 기본 slate 색상 사용 - 카테고리 매핑 로드 과정 로그 추가 - 기존 데이터에 기본 색상 추가하는 마이그레이션 스크립트 생성
This commit is contained in:
parent
7581cd1582
commit
b526d8ea2c
|
|
@ -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":
|
||||
|
|
|
|||
Loading…
Reference in New Issue