377 lines
18 KiB
TypeScript
377 lines
18 KiB
TypeScript
"use client";
|
|
|
|
import {
|
|
Button,
|
|
Dialog,
|
|
DialogContent,
|
|
DialogFooter,
|
|
DialogHeader,
|
|
DialogTitle,
|
|
Input,
|
|
Table,
|
|
TableBody,
|
|
TableCell,
|
|
TableHead,
|
|
TableRow,
|
|
} from "@common/components";
|
|
import { CodeSelect } from "@/entities/code/ui/code-select";
|
|
import type { VerificationTargetManagementResponse } from "@/entities/statistics/model/verification-target-management-interface";
|
|
import {
|
|
verificationTargetManagementSchema,
|
|
type VerificationTargetManagementFormData,
|
|
} from "@/entities/statistics/model/verification-target-management-schema";
|
|
import { useEffect } from "react";
|
|
import { useForm, Controller } from "react-hook-form";
|
|
import { zodResolver } from "@hookform/resolvers/zod";
|
|
import type { TabValue } from "./VerificationArticleManagement";
|
|
|
|
interface VerificationTargetDialogProps {
|
|
tabValue: TabValue;
|
|
open: boolean;
|
|
onOpenChange: (open: boolean) => void;
|
|
data: VerificationTargetManagementResponse | null;
|
|
onSave: (data: VerificationTargetManagementResponse) => void;
|
|
onDelete: (vrfcTrgtSn: number) => void;
|
|
}
|
|
|
|
export function VerificationTargetDialog({
|
|
tabValue,
|
|
open,
|
|
onOpenChange,
|
|
data,
|
|
onSave,
|
|
onDelete,
|
|
}: VerificationTargetDialogProps) {
|
|
const {
|
|
control,
|
|
handleSubmit,
|
|
reset,
|
|
formState: { errors },
|
|
} = useForm<VerificationTargetManagementFormData>({
|
|
resolver: zodResolver(verificationTargetManagementSchema),
|
|
defaultValues: data || undefined,
|
|
});
|
|
|
|
useEffect(() => {
|
|
if (data && open) reset(data);
|
|
}, [data, open, reset]);
|
|
|
|
function onSubmit(formData: VerificationTargetManagementFormData) {
|
|
if (!data) return;
|
|
onSave({
|
|
...data,
|
|
...formData,
|
|
} as VerificationTargetManagementResponse);
|
|
}
|
|
|
|
function handleDelete() {
|
|
if (data?.vrfcTrgtSn) {
|
|
onDelete(data.vrfcTrgtSn);
|
|
}
|
|
}
|
|
|
|
if (!data) return null;
|
|
|
|
return (
|
|
<Dialog open={open} onOpenChange={onOpenChange}>
|
|
<DialogContent className="max-w-[800px]">
|
|
<DialogHeader>
|
|
<DialogTitle>검증 항목 상세</DialogTitle>
|
|
</DialogHeader>
|
|
|
|
<form onSubmit={handleSubmit(onSubmit)}>
|
|
<Table variant="secondary">
|
|
<TableBody>
|
|
<TableRow>
|
|
<TableHead
|
|
className="w-[150px] bg-muted font-medium"
|
|
data-required
|
|
>
|
|
통계항목
|
|
</TableHead>
|
|
<TableCell>
|
|
<Controller
|
|
name="statsCd"
|
|
control={control}
|
|
render={({ field }) => (
|
|
<div className="space-y-1">
|
|
<CodeSelect
|
|
upCd="STITEM"
|
|
value={field.value}
|
|
onValueChange={
|
|
field.onChange
|
|
}
|
|
placeholder="선택"
|
|
/>
|
|
</div>
|
|
)}
|
|
/>
|
|
</TableCell>
|
|
<TableHead
|
|
className="w-[150px] bg-muted font-medium"
|
|
data-required
|
|
>
|
|
검증명
|
|
</TableHead>
|
|
<TableCell>
|
|
<Controller
|
|
name="vrfcTrgtNm"
|
|
control={control}
|
|
render={({ field }) => (
|
|
<Input
|
|
{...field}
|
|
value={field.value || ""}
|
|
placeholder="검증명"
|
|
/>
|
|
)}
|
|
/>
|
|
</TableCell>
|
|
</TableRow>
|
|
|
|
<TableRow>
|
|
<TableHead
|
|
className="bg-muted font-medium"
|
|
data-required
|
|
>
|
|
스키마명
|
|
</TableHead>
|
|
<TableCell>
|
|
<Controller
|
|
name="schmNm"
|
|
control={control}
|
|
render={({ field }) => (
|
|
<div className="space-y-1">
|
|
<Input
|
|
{...field}
|
|
placeholder="스키마명"
|
|
/>
|
|
</div>
|
|
)}
|
|
/>
|
|
</TableCell>
|
|
<TableHead
|
|
className="bg-muted font-medium"
|
|
data-required
|
|
>
|
|
테이블명
|
|
</TableHead>
|
|
<TableCell>
|
|
<Controller
|
|
name="tblNm"
|
|
control={control}
|
|
render={({ field }) => (
|
|
<div className="space-y-1">
|
|
<Input
|
|
{...field}
|
|
placeholder="테이블명"
|
|
/>
|
|
</div>
|
|
)}
|
|
/>
|
|
</TableCell>
|
|
</TableRow>
|
|
|
|
<TableRow>
|
|
<TableHead
|
|
className="bg-muted font-medium"
|
|
data-required
|
|
>
|
|
컬럼명
|
|
</TableHead>
|
|
<TableCell>
|
|
<Controller
|
|
name="colNm"
|
|
control={control}
|
|
render={({ field }) => (
|
|
<div className="space-y-1">
|
|
<Input
|
|
{...field}
|
|
placeholder="컬럼명"
|
|
/>
|
|
</div>
|
|
)}
|
|
/>
|
|
</TableCell>
|
|
<TableHead
|
|
className="bg-muted font-medium"
|
|
data-required
|
|
>
|
|
PK 키
|
|
</TableHead>
|
|
<TableCell>
|
|
<Controller
|
|
name="pkColNm"
|
|
control={control}
|
|
render={({ field }) => (
|
|
<div className="space-y-1">
|
|
<Input
|
|
{...field}
|
|
placeholder="PK 키"
|
|
/>
|
|
</div>
|
|
)}
|
|
/>
|
|
</TableCell>
|
|
</TableRow>
|
|
|
|
{tabValue !== "IMR" && (
|
|
<TableRow>
|
|
<TableHead className="bg-muted font-medium">
|
|
중요도 계수(μ)
|
|
</TableHead>
|
|
<TableCell>
|
|
<Controller
|
|
name="ipcrCntVl"
|
|
control={control}
|
|
render={({ field }) => (
|
|
<div className="space-y-1">
|
|
<Input
|
|
type="number"
|
|
min="0"
|
|
max="1"
|
|
step="0.1"
|
|
value={field.value ?? ""}
|
|
onChange={(e) =>
|
|
field.onChange(
|
|
e.target.value
|
|
? Number(
|
|
e.target
|
|
.value,
|
|
)
|
|
: null,
|
|
)
|
|
}
|
|
placeholder="(0 ~ 1, 0.1 단위)"
|
|
/>
|
|
</div>
|
|
)}
|
|
/>
|
|
</TableCell>
|
|
<TableHead className="bg-muted font-medium">
|
|
백분위수 기준값(pct)
|
|
</TableHead>
|
|
<TableCell>
|
|
<Controller
|
|
name="pctlCrtrVl"
|
|
control={control}
|
|
render={({ field }) => (
|
|
<div className="space-y-1">
|
|
<Input
|
|
type="number"
|
|
min="0"
|
|
max="0.5"
|
|
step="0.1"
|
|
value={field.value ?? ""}
|
|
onChange={(e) =>
|
|
field.onChange(
|
|
e.target.value
|
|
? Number(
|
|
e.target
|
|
.value,
|
|
)
|
|
: null,
|
|
)
|
|
}
|
|
placeholder="(0 ~ 0.5, 0.1 단위)"
|
|
/>
|
|
</div>
|
|
)}
|
|
/>
|
|
</TableCell>
|
|
</TableRow>
|
|
)}
|
|
|
|
{tabValue !== "IMR" && (
|
|
<TableRow>
|
|
<TableHead className="bg-muted font-medium">
|
|
스케일 조정 계수(A)
|
|
</TableHead>
|
|
<TableCell>
|
|
<Controller
|
|
name="scopCntCntVl"
|
|
control={control}
|
|
render={({ field }) => (
|
|
<div className="space-y-1">
|
|
<Input
|
|
type="number"
|
|
min="0"
|
|
max="1"
|
|
step="0.01"
|
|
value={field.value ?? ""}
|
|
onChange={(e) =>
|
|
field.onChange(
|
|
e.target.value
|
|
? Number(
|
|
e.target
|
|
.value,
|
|
)
|
|
: null,
|
|
)
|
|
}
|
|
placeholder="(0 ~ 1, 0.01 단위)"
|
|
/>
|
|
</div>
|
|
)}
|
|
/>
|
|
</TableCell>
|
|
<TableHead className="bg-muted font-medium">
|
|
임계 계수(c)
|
|
</TableHead>
|
|
<TableCell>
|
|
<Controller
|
|
name="thrsCntVl"
|
|
control={control}
|
|
render={({ field }) => (
|
|
<div className="space-y-1">
|
|
<Input
|
|
type="number"
|
|
min="0"
|
|
max="100"
|
|
step="1"
|
|
value={field.value ?? ""}
|
|
onChange={(e) =>
|
|
field.onChange(
|
|
e.target.value
|
|
? Number(
|
|
e.target
|
|
.value,
|
|
)
|
|
: null,
|
|
)
|
|
}
|
|
placeholder="(0 ~ 100, 1 단위)"
|
|
/>
|
|
</div>
|
|
)}
|
|
/>
|
|
</TableCell>
|
|
</TableRow>
|
|
)}
|
|
</TableBody>
|
|
</Table>
|
|
|
|
<DialogFooter className="mt-6">
|
|
<Button
|
|
type="button"
|
|
color="gray"
|
|
onClick={() => onOpenChange(false)}
|
|
>
|
|
취소
|
|
</Button>
|
|
<Button
|
|
type="button"
|
|
color="red"
|
|
onClick={handleDelete}
|
|
>
|
|
삭제
|
|
</Button>
|
|
<Button type="submit" color="green">
|
|
저장
|
|
</Button>
|
|
</DialogFooter>
|
|
</form>
|
|
</DialogContent>
|
|
</Dialog>
|
|
);
|
|
}
|