jskim/vexplor_dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

테이블 추가기능 수정사항

Browse Source
This commit is contained in:
kjs
2025-09-23 10:40:21 +09:00
parent 474cc33aee
commit e653effac0
19 changed files with 1931 additions and 201 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
frontend/components/admin/ColumnDefinitionTable.tsx
View File

@@ -17,11 +17,11 @@ import { Alert, AlertDescription } from "@/components/ui/alert";
import {
CreateColumnDefinition,
ColumnDefinitionTableProps,
WEB_TYPE_OPTIONS,
VALIDATION_RULES,
RESERVED_WORDS,
RESERVED_COLUMNS,
} from "../../types/ddl";
import { INPUT_TYPE_OPTIONS } from "../../types/input-types";
export function ColumnDefinitionTable({ columns, onChange, disabled = false }: ColumnDefinitionTableProps) {
const [validationErrors, setValidationErrors] = useState<Record<number, string[]>>({});
@@ -105,14 +105,14 @@ export function ColumnDefinitionTable({ columns, onChange, disabled = false }: C
}
}
// 웹타입 검증
if (!column.webType) {
errors.push("웹타입을 선택해주세요");
// 입력타입 검증
if (!column.inputType) {
errors.push("입력타입을 선택해주세요");
}
// 길이 검증 (길이를 지원하는 타입인 경우)
const webTypeOption = WEB_TYPE_OPTIONS.find((opt) => opt.value === column.webType);
if (webTypeOption?.supportsLength && column.length !== undefined) {
const inputTypeOption = INPUT_TYPE_OPTIONS.find((opt) => opt.value === column.inputType);
if (inputTypeOption?.supportsLength && column.length !== undefined) {
if (column.length < VALIDATION_RULES.columnLength.min || column.length > VALIDATION_RULES.columnLength.max) {
errors.push(VALIDATION_RULES.columnLength.errorMessage);
}
@@ -128,19 +128,19 @@ export function ColumnDefinitionTable({ columns, onChange, disabled = false }: C
};
/**
* 웹타입 변경 시 길이 기본값 설정
* 입력타입 변경 시 길이 기본값 설정
*/
const handleWebTypeChange = (index: number, webType: string) => {
const webTypeOption = WEB_TYPE_OPTIONS.find((opt) => opt.value === webType);
const updates: Partial<CreateColumnDefinition> = { webType: webType as any };
const handleInputTypeChange = (index: number, inputType: string) => {
const inputTypeOption = INPUT_TYPE_OPTIONS.find((opt) => opt.value === inputType);
const updates: Partial<CreateColumnDefinition> = { inputType: inputType as any };
// 길이를 지원하는 타입이고 현재 길이가 없으면 기본값 설정
if (webTypeOption?.supportsLength && !columns[index].length && webTypeOption.defaultLength) {
updates.length = webTypeOption.defaultLength;
if (inputTypeOption?.supportsLength && !columns[index].length && inputTypeOption.defaultLength) {
updates.length = inputTypeOption.defaultLength;
}
// 길이를 지원하지 않는 타입이면 길이 제거
if (!webTypeOption?.supportsLength) {
if (!inputTypeOption?.supportsLength) {
updates.length = undefined;
}
@@ -172,7 +172,7 @@ export function ColumnDefinitionTable({ columns, onChange, disabled = false }: C
</TableHead>
<TableHead className="w-[150px]">라벨</TableHead>
<TableHead className="w-[120px]">
웹타입 <span className="text-red-500">*</span>
입력타입 <span className="text-red-500">*</span>
</TableHead>
<TableHead className="w-[80px]">필수</TableHead>
<TableHead className="w-[100px]">길이</TableHead>
@@ -183,7 +183,7 @@ export function ColumnDefinitionTable({ columns, onChange, disabled = false }: C
</TableHeader>
<TableBody>
{columns.map((column, index) => {
const webTypeOption = WEB_TYPE_OPTIONS.find((opt) => opt.value === column.webType);
const inputTypeOption = INPUT_TYPE_OPTIONS.find((opt) => opt.value === column.inputType);
const rowErrors = validationErrors[index] || [];
const hasRowError = rowErrors.length > 0;
@@ -219,15 +219,15 @@ export function ColumnDefinitionTable({ columns, onChange, disabled = false }: C
<TableCell>
<Select
value={column.webType}
onValueChange={(value) => handleWebTypeChange(index, value)}
value={column.inputType}
onValueChange={(value) => handleInputTypeChange(index, value)}
disabled={disabled}
>
<SelectTrigger>
<SelectValue placeholder="선택" />
<SelectValue placeholder="입력 타입 선택" />
</SelectTrigger>
<SelectContent>
{WEB_TYPE_OPTIONS.map((option) => (
{INPUT_TYPE_OPTIONS.map((option) => (
<SelectItem key={option.value} value={option.value}>
<div>
<div className="font-medium">{option.label}</div>
@@ -260,8 +260,8 @@ export function ColumnDefinitionTable({ columns, onChange, disabled = false }: C
length: e.target.value ? parseInt(e.target.value) : undefined,
})
}
placeholder={webTypeOption?.defaultLength?.toString() || ""}
disabled={disabled || !webTypeOption?.supportsLength}
placeholder={inputTypeOption?.defaultLength?.toString() || ""}
disabled={disabled || !inputTypeOption?.supportsLength}
min={1}
max={65535}
/>