diff options
Diffstat (limited to 'lib/basic-contract/template')
3 files changed, 912 insertions, 324 deletions
diff --git a/lib/basic-contract/template/add-basic-contract-template-dialog.tsx b/lib/basic-contract/template/add-basic-contract-template-dialog.tsx index cf0986f0..3a83d50f 100644 --- a/lib/basic-contract/template/add-basic-contract-template-dialog.tsx +++ b/lib/basic-contract/template/add-basic-contract-template-dialog.tsx @@ -18,6 +18,8 @@ import { } from "@/components/ui/form";
import { Input } from "@/components/ui/input";
import { Button } from "@/components/ui/button";
+import { Checkbox } from "@/components/ui/checkbox";
+import { Switch } from "@/components/ui/switch";
import {
Select,
SelectContent,
@@ -34,17 +36,31 @@ import { DropzoneInput
} from "@/components/ui/dropzone";
import { Progress } from "@/components/ui/progress";
-import { useRouter } from "next/navigation"
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
+import { Separator } from "@/components/ui/separator";
+import { useRouter } from "next/navigation";
+import { BUSINESS_UNITS } from "@/config/basicContractColumnsConfig";
-// 유효기간 필드가 추가된 계약서 템플릿 스키마 정의
+// 업데이트된 계약서 템플릿 스키마 정의
const templateFormSchema = z.object({
+ templateCode: z.string()
+ .min(1, "템플릿 코드는 필수입니다.")
+ .max(50, "템플릿 코드는 50자 이하여야 합니다.")
+ .regex(/^[A-Z0-9_-]+$/, "템플릿 코드는 영문 대문자, 숫자, '_', '-'만 사용 가능합니다."),
templateName: z.string().min(1, "템플릿 이름은 필수입니다."),
- validityPeriod: z.coerce
- .number({ invalid_type_error: "유효기간은 숫자여야 합니다." })
- .int("유효기간은 정수여야 합니다.")
- .min(1, "유효기간은 최소 1개월 이상이어야 합니다.")
- .max(120, "유효기간은 최대 120개월(10년)을 초과할 수 없습니다.")
- .default(12),
+ revision: z.coerce.number().int().min(1).default(1),
+ legalReviewRequired: z.boolean().default(false),
+
+ // 적용 범위
+ shipBuildingApplicable: z.boolean().default(false),
+ windApplicable: z.boolean().default(false),
+ pcApplicable: z.boolean().default(false),
+ nbApplicable: z.boolean().default(false),
+ rcApplicable: z.boolean().default(false),
+ gyApplicable: z.boolean().default(false),
+ sysApplicable: z.boolean().default(false),
+ infraApplicable: z.boolean().default(false),
+
file: z
.instanceof(File, { message: "파일을 업로드해주세요." })
.refine((file) => file.size <= 100 * 1024 * 1024, {
@@ -55,6 +71,15 @@ const templateFormSchema = z.object({ { message: "PDF 파일만 업로드 가능합니다." }
),
status: z.enum(["ACTIVE", "DISPOSED"]).default("ACTIVE"),
+}).refine((data) => {
+ // 적어도 하나의 적용 범위는 선택되어야 함
+ const hasAnyScope = BUSINESS_UNITS.some(unit =>
+ data[unit.key as keyof typeof data] as boolean
+ );
+ return hasAnyScope;
+}, {
+ message: "적어도 하나의 적용 범위를 선택해야 합니다.",
+ path: ["shipBuildingApplicable"], // 에러를 첫 번째 체크박스에 표시
});
type TemplateFormValues = z.infer<typeof templateFormSchema>;
@@ -65,12 +90,22 @@ export function AddTemplateDialog() { const [selectedFile, setSelectedFile] = React.useState<File | null>(null);
const [uploadProgress, setUploadProgress] = React.useState(0);
const [showProgress, setShowProgress] = React.useState(false);
- const router = useRouter()
+ const router = useRouter();
// 기본값 설정
const defaultValues: Partial<TemplateFormValues> = {
+ templateCode: "",
templateName: "",
- validityPeriod: 12, // 기본값 1년
+ revision: 1,
+ legalReviewRequired: false,
+ shipBuildingApplicable: false,
+ windApplicable: false,
+ pcApplicable: false,
+ nbApplicable: false,
+ rcApplicable: false,
+ gyApplicable: false,
+ sysApplicable: false,
+ infraApplicable: false,
status: "ACTIVE",
};
@@ -81,11 +116,6 @@ export function AddTemplateDialog() { mode: "onChange",
});
- // 폼 값 감시
- const templateName = form.watch("templateName");
- const validityPeriod = form.watch("validityPeriod");
- const file = form.watch("file");
-
// 파일 선택 핸들러
const handleFileChange = (files: File[]) => {
if (files.length > 0) {
@@ -95,6 +125,13 @@ export function AddTemplateDialog() { }
};
+ // 모든 적용 범위 선택/해제
+ const handleSelectAllScopes = (checked: boolean) => {
+ BUSINESS_UNITS.forEach(unit => {
+ form.setValue(unit.key as keyof TemplateFormValues, checked);
+ });
+ };
+
// 청크 크기 설정 (1MB)
const CHUNK_SIZE = 1 * 1024 * 1024;
@@ -161,15 +198,25 @@ export function AddTemplateDialog() { throw new Error("파일 업로드에 실패했습니다.");
}
- // 메타데이터 저장
+ // 메타데이터 저장 (업데이트된 필드들 포함)
const saveResponse = await fetch('/api/upload/basicContract/complete', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
+ templateCode: formData.templateCode,
templateName: formData.templateName,
- validityPeriod: formData.validityPeriod, // 유효기간 추가
+ revision: formData.revision,
+ legalReviewRequired: formData.legalReviewRequired,
+ shipBuildingApplicable: formData.shipBuildingApplicable,
+ windApplicable: formData.windApplicable,
+ pcApplicable: formData.pcApplicable,
+ nbApplicable: formData.nbApplicable,
+ rcApplicable: formData.rcApplicable,
+ gyApplicable: formData.gyApplicable,
+ sysApplicable: formData.sysApplicable,
+ infraApplicable: formData.infraApplicable,
status: formData.status,
fileName: uploadResult.fileName,
filePath: uploadResult.filePath,
@@ -215,15 +262,10 @@ export function AddTemplateDialog() { setOpen(nextOpen);
}
- // 유효기간 선택 옵션
- const validityOptions = [
- { value: "3", label: "3개월" },
- { value: "6", label: "6개월" },
- { value: "12", label: "1년" },
- { value: "24", label: "2년" },
- { value: "36", label: "3년" },
- { value: "60", label: "5년" },
- ];
+ // 현재 선택된 적용 범위 수
+ const selectedScopesCount = BUSINESS_UNITS.filter(unit =>
+ form.watch(unit.key as keyof TemplateFormValues)
+ ).length;
return (
<Dialog open={open} onOpenChange={handleDialogOpenChange}>
@@ -232,108 +274,215 @@ export function AddTemplateDialog() { 템플릿 추가
</Button>
</DialogTrigger>
- <DialogContent className="sm:max-w-[500px]">
+ <DialogContent className="sm:max-w-[600px] max-h-[90vh] overflow-y-auto">
<DialogHeader>
<DialogTitle>새 기본계약서 템플릿 추가</DialogTitle>
<DialogDescription>
- 템플릿 이름을 입력하고 계약서 파일을 업로드하세요.
+ 템플릿 정보를 입력하고 계약서 파일을 업로드하세요.
<span className="text-red-500 mt-1 block text-sm">* 표시된 항목은 필수 입력사항입니다.</span>
</DialogDescription>
</DialogHeader>
<Form {...form}>
- <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
- <FormField
- control={form.control}
- name="templateName"
- render={({ field }) => (
- <FormItem>
- <FormLabel>
- 템플릿 이름 <span className="text-red-500">*</span>
- </FormLabel>
- <FormControl>
- <Input placeholder="템플릿 이름을 입력하세요" {...field} />
- </FormControl>
- <FormMessage />
- </FormItem>
- )}
- />
+ <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-6">
+ {/* 기본 정보 */}
+ <Card>
+ <CardHeader>
+ <CardTitle className="text-lg">기본 정보</CardTitle>
+ </CardHeader>
+ <CardContent className="space-y-4">
+ <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+ <FormField
+ control={form.control}
+ name="templateCode"
+ render={({ field }) => (
+ <FormItem>
+ <FormLabel>
+ 템플릿 코드 <span className="text-red-500">*</span>
+ </FormLabel>
+ <FormControl>
+ <Input
+ placeholder="TEMPLATE_001"
+ {...field}
+ style={{ textTransform: 'uppercase' }}
+ onChange={(e) => field.onChange(e.target.value.toUpperCase())}
+ />
+ </FormControl>
+ <FormDescription>
+ 영문 대문자, 숫자, '_', '-'만 사용 가능
+ </FormDescription>
+ <FormMessage />
+ </FormItem>
+ )}
+ />
- <FormField
- control={form.control}
- name="validityPeriod"
- render={({ field }) => (
- <FormItem>
- <FormLabel>
- 계약 유효기간 <span className="text-red-500">*</span>
- </FormLabel>
- <Select
- value={field.value?.toString()}
- onValueChange={(value) => field.onChange(parseInt(value))}
- >
- <FormControl>
- <SelectTrigger>
- <SelectValue placeholder="유효기간을 선택하세요" />
- </SelectTrigger>
- </FormControl>
- <SelectContent>
- {validityOptions.map(option => (
- <SelectItem key={option.value} value={option.value}>
- {option.label}
- </SelectItem>
- ))}
- </SelectContent>
- </Select>
- <FormDescription>
- 계약서의 유효 기간을 설정합니다. 이 기간이 지나면 재계약이 필요합니다.
- </FormDescription>
- <FormMessage />
- </FormItem>
- )}
- />
+ <FormField
+ control={form.control}
+ name="revision"
+ render={({ field }) => (
+ <FormItem>
+ <FormLabel>리비전</FormLabel>
+ <FormControl>
+ <Input
+ type="number"
+ min="1"
+ {...field}
+ onChange={(e) => field.onChange(parseInt(e.target.value) || 1)}
+ />
+ </FormControl>
+ <FormDescription>
+ 템플릿 버전 (기본값: 1)
+ </FormDescription>
+ <FormMessage />
+ </FormItem>
+ )}
+ />
+ </div>
- <FormField
- control={form.control}
- name="file"
- render={() => (
- <FormItem>
- <FormLabel>
- 계약서 파일 <span className="text-red-500">*</span>
- </FormLabel>
- <FormControl>
- <Dropzone
- onDrop={handleFileChange}
- accept={{
- 'application/pdf': ['.pdf']
- }}
- >
- <DropzoneZone>
- <DropzoneUploadIcon className="h-10 w-10 text-muted-foreground" />
- <DropzoneTitle>
- {selectedFile ? selectedFile.name : "PDF 파일을 여기에 드래그하세요"}
- </DropzoneTitle>
- <DropzoneDescription>
- {selectedFile
- ? `파일 크기: ${(selectedFile.size / (1024 * 1024)).toFixed(2)} MB`
- : "또는 클릭하여 PDF 파일을 선택하세요 (최대 100MB)"}
- </DropzoneDescription>
- <DropzoneInput />
- </DropzoneZone>
- </Dropzone>
- </FormControl>
- <FormMessage />
- </FormItem>
- )}
- />
-
- {showProgress && (
- <div className="space-y-2">
- <div className="flex justify-between text-sm">
- <span>업로드 진행률</span>
- <span>{uploadProgress}%</span>
+ <FormField
+ control={form.control}
+ name="templateName"
+ render={({ field }) => (
+ <FormItem>
+ <FormLabel>
+ 템플릿 이름 <span className="text-red-500">*</span>
+ </FormLabel>
+ <FormControl>
+ <Input placeholder="기본 계약서 템플릿" {...field} />
+ </FormControl>
+ <FormMessage />
+ </FormItem>
+ )}
+ />
+
+ <FormField
+ control={form.control}
+ name="legalReviewRequired"
+ render={({ field }) => (
+ <FormItem className="flex flex-row items-center justify-between rounded-lg border p-3 shadow-sm">
+ <div className="space-y-0.5">
+ <FormLabel>법무검토 필요</FormLabel>
+ <FormDescription>
+ 법무팀 검토가 필요한 템플릿인지 설정
+ </FormDescription>
+ </div>
+ <FormControl>
+ <Switch
+ checked={field.value}
+ onCheckedChange={field.onChange}
+ />
+ </FormControl>
+ </FormItem>
+ )}
+ />
+ </CardContent>
+ </Card>
+
+ {/* 적용 범위 */}
+ <Card>
+ <CardHeader>
+ <CardTitle className="text-lg">적용 범위</CardTitle>
+ <CardDescription>
+ 이 템플릿이 적용될 사업부를 선택하세요. ({selectedScopesCount}개 선택됨)
+ </CardDescription>
+ </CardHeader>
+ <CardContent className="space-y-4">
+ <div className="flex items-center space-x-2">
+ <Checkbox
+ id="select-all"
+ checked={selectedScopesCount === BUSINESS_UNITS.length}
+ onCheckedChange={handleSelectAllScopes}
+ />
+ <label htmlFor="select-all" className="text-sm font-medium">
+ 전체 선택
+ </label>
</div>
- <Progress value={uploadProgress} />
- </div>
- )}
+
+ <Separator />
+
+ <div className="grid grid-cols-2 md:grid-cols-4 gap-4">
+ {BUSINESS_UNITS.map((unit) => (
+ <FormField
+ key={unit.key}
+ control={form.control}
+ name={unit.key as keyof TemplateFormValues}
+ render={({ field }) => (
+ <FormItem className="flex flex-row items-start space-x-3 space-y-0">
+ <FormControl>
+ <Checkbox
+ checked={field.value as boolean}
+ onCheckedChange={field.onChange}
+ />
+ </FormControl>
+ <div className="space-y-1 leading-none">
+ <FormLabel className="text-sm font-normal">
+ {unit.label}
+ </FormLabel>
+ </div>
+ </FormItem>
+ )}
+ />
+ ))}
+ </div>
+
+ {form.formState.errors.shipBuildingApplicable && (
+ <p className="text-sm text-destructive">
+ {form.formState.errors.shipBuildingApplicable.message}
+ </p>
+ )}
+ </CardContent>
+ </Card>
+
+ {/* 파일 업로드 */}
+ <Card>
+ <CardHeader>
+ <CardTitle className="text-lg">파일 업로드</CardTitle>
+ </CardHeader>
+ <CardContent>
+ <FormField
+ control={form.control}
+ name="file"
+ render={() => (
+ <FormItem>
+ <FormLabel>
+ 계약서 파일 <span className="text-red-500">*</span>
+ </FormLabel>
+ <FormControl>
+ <Dropzone
+ onDrop={handleFileChange}
+ accept={{
+ 'application/pdf': ['.pdf']
+ }}
+ >
+ <DropzoneZone>
+ <DropzoneUploadIcon className="h-10 w-10 text-muted-foreground" />
+ <DropzoneTitle>
+ {selectedFile ? selectedFile.name : "PDF 파일을 여기에 드래그하세요"}
+ </DropzoneTitle>
+ <DropzoneDescription>
+ {selectedFile
+ ? `파일 크기: ${(selectedFile.size / (1024 * 1024)).toFixed(2)} MB`
+ : "또는 클릭하여 PDF 파일을 선택하세요 (최대 100MB)"}
+ </DropzoneDescription>
+ <DropzoneInput />
+ </DropzoneZone>
+ </Dropzone>
+ </FormControl>
+ <FormMessage />
+ </FormItem>
+ )}
+ />
+
+ {showProgress && (
+ <div className="space-y-2 mt-4">
+ <div className="flex justify-between text-sm">
+ <span>업로드 진행률</span>
+ <span>{uploadProgress}%</span>
+ </div>
+ <Progress value={uploadProgress} />
+ </div>
+ )}
+ </CardContent>
+ </Card>
<DialogFooter>
<Button
@@ -346,7 +495,7 @@ export function AddTemplateDialog() { </Button>
<Button
type="submit"
- disabled={isLoading || !templateName || !validityPeriod || !file}
+ disabled={isLoading || !form.formState.isValid}
>
{isLoading ? "처리 중..." : "추가"}
</Button>
diff --git a/lib/basic-contract/template/basic-contract-template-columns.tsx b/lib/basic-contract/template/basic-contract-template-columns.tsx index 5f4433d1..3be46791 100644 --- a/lib/basic-contract/template/basic-contract-template-columns.tsx +++ b/lib/basic-contract/template/basic-contract-template-columns.tsx @@ -3,7 +3,7 @@ import * as React from "react"
import { type DataTableRowAction } from "@/types/table"
import { type ColumnDef } from "@tanstack/react-table"
-import { Download, Ellipsis, Paperclip } from "lucide-react"
+import { Download, Ellipsis, Paperclip, CheckCircle, XCircle } from "lucide-react"
import { toast } from "sonner"
import { getErrorMessage } from "@/lib/handle-error"
@@ -24,9 +24,10 @@ import { DropdownMenuSubTrigger,
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu"
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"
import { DataTableColumnHeaderSimple } from "@/components/data-table/data-table-column-simple-header"
-import { basicContractTemplateColumnsConfig } from "@/config/basicContractColumnsConfig"
+import { scopeHelpers } from "@/config/basicContractColumnsConfig"
import { BasicContractTemplate } from "@/db/schema"
interface GetColumnsProps {
@@ -40,7 +41,7 @@ const handleFileDownload = (filePath: string, fileName: string) => { try {
// 전체 URL 생성
const fullUrl = `${window.location.origin}${filePath}`;
-
+
// a 태그를 생성하여 다운로드 실행
const link = document.createElement('a');
link.href = fullUrl;
@@ -48,7 +49,7 @@ const handleFileDownload = (filePath: string, fileName: string) => { document.body.appendChild(link);
link.click();
document.body.removeChild(link);
-
+
toast.success("파일 다운로드를 시작합니다.");
} catch (error) {
console.error("파일 다운로드 오류:", error);
@@ -97,7 +98,7 @@ export function getColumns({ setRowAction }: GetColumnsProps): ColumnDef<BasicCo header: "",
cell: ({ row }) => {
const template = row.original;
-
+
return (
<Button
variant="ghost"
@@ -123,6 +124,7 @@ export function getColumns({ setRowAction }: GetColumnsProps): ColumnDef<BasicCo enableHiding: false,
cell: function Cell({ row }) {
const [isUpdatePending, startUpdateTransition] = React.useTransition()
+ const template = row.original;
return (
<DropdownMenu>
@@ -142,6 +144,22 @@ export function getColumns({ setRowAction }: GetColumnsProps): ColumnDef<BasicCo Edit
</DropdownMenuItem>
+ {template.status === 'ACTIVE' && (
+ <DropdownMenuItem
+ onSelect={() => setRowAction({ row, type: "dispose" })}
+ >
+ Dispose
+ </DropdownMenuItem>
+ )}
+
+ {template.status === 'DISPOSED' && template.disposedAt && (
+ <DropdownMenuItem
+ onSelect={() => setRowAction({ row, type: "restore" })}
+ >
+ Restore
+ </DropdownMenuItem>
+ )}
+
<DropdownMenuSeparator />
<DropdownMenuItem
onSelect={() => setRowAction({ row, type: "delete" })}
@@ -157,88 +175,341 @@ export function getColumns({ setRowAction }: GetColumnsProps): ColumnDef<BasicCo }
// ----------------------------------------------------------------
- // 4) 일반 컬럼들을 "그룹"별로 묶어 중첩 columns 생성
+ // 4) 직접 컬럼 정의 (그룹별로 중첩)
// ----------------------------------------------------------------
- // 4-1) groupMap: { [groupName]: ColumnDef<BasicContractTemplate>[] }
- const groupMap: Record<string, ColumnDef<BasicContractTemplate>[]> = {}
-
- basicContractTemplateColumnsConfig.forEach((cfg) => {
- // 만약 group가 없으면 "_noGroup" 처리
- const groupName = cfg.group || "_noGroup"
-
- if (!groupMap[groupName]) {
- groupMap[groupName] = []
- }
-
- // child column 정의
- const childCol: ColumnDef<BasicContractTemplate> = {
- accessorKey: cfg.id,
- enableResizing: true,
- header: ({ column }) => (
- <DataTableColumnHeaderSimple column={column} title={cfg.label} />
- ),
- meta: {
- excelHeader: cfg.excelHeader,
- group: cfg.group,
- type: cfg.type,
- },
- cell: ({ row, cell }) => {
- // 날짜 형식 처리
- if (cfg.id === "createdAt" || cfg.id === "updatedAt") {
- const dateVal = cell.getValue() as Date
- return formatDateTime(dateVal, "KR")
- }
-
- // Status 컬럼에 Badge 적용
- if (cfg.id === "status") {
- const status = row.getValue(cfg.id) as string
- const isActive = status === "ACTIVE"
-
- return (
- <Badge
- variant={isActive ? "default" : "secondary"}
- >
- {isActive ? "활성" : "비활성"}
- </Badge>
- )
- }
- // 나머지 컬럼은 그대로 값 표시
- return row.getValue(cfg.id) ?? ""
+ // 기본 정보 그룹
+ const basicInfoColumns: ColumnDef<BasicContractTemplate>[] = [
+ {
+ accessorKey: "status",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="상태" />,
+ cell: ({ row }) => {
+ const status = row.getValue("status") as string;
+ const isActive = status === "ACTIVE";
+ return (
+ <Badge variant={isActive ? "default" : "secondary"}>
+ {isActive ? "활성" : "폐기"}
+ </Badge>
+ );
},
- minSize:80
- }
+ size: 80,
+ enableResizing: true,
+ },
- groupMap[groupName].push(childCol)
- })
+ {
+ accessorKey: "templateName",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="계약문서명" />,
+ cell: ({ row }) => {
+ const template = row.original;
+ const scopeText = scopeHelpers.getScopeDisplayText(template);
+ return (
+ <div className="flex flex-col min-w-0">
+ <span className="truncate">{template.templateName}</span>
+ <TooltipProvider>
+ <Tooltip>
+ <TooltipTrigger asChild>
+ <span className="text-xs text-muted-foreground cursor-help truncate">
+ {scopeText}
+ </span>
+ </TooltipTrigger>
+ <TooltipContent>
+ <div className="space-y-1">
+ <p className="font-medium">적용 범위:</p>
+ {scopeHelpers.getApplicableScopeLabels(template).map(label => (
+ <p key={label} className="text-xs">• {label}</p>
+ ))}
+ </div>
+ </TooltipContent>
+ </Tooltip>
+ </TooltipProvider>
+ </div>
+ );
+ },
+ size: 250,
+ enableResizing: true,
+ },
+ {
+ accessorKey: "templateCode",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="계약문서 번호" />,
+ cell: ({ row }) => {
+ const template = row.original;
+ return (
+ <span className="font-medium">{template.templateCode}</span>
+ );
+ },
+ size: 120,
+ enableResizing: true,
+ },
+ {
+ accessorKey: "revision",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="Rev." />,
+ cell: ({ row }) => {
+ const template = row.original;
+ return (
+ <span className="text-xs text-muted-foreground">v{template.revision}</span>
+ );
+ },
+ size: 60,
+ enableResizing: true,
+ },
+ {
+ accessorKey: "legalReviewRequired",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="법무검토" />,
+ cell: ({ row }) => {
+ const required = row.getValue("legalReviewRequired") as boolean;
+ return (
+ <Badge variant={required ? "destructive" : "secondary"}>
+ {required ? "필요" : "불필요"}
+ </Badge>
+ );
+ },
+ size: 100,
+ enableResizing: true,
+ },
+ ];
- // ----------------------------------------------------------------
- // 4-2) groupMap에서 실제 상위 컬럼(그룹)을 만들기
- // ----------------------------------------------------------------
- const nestedColumns: ColumnDef<BasicContractTemplate>[] = []
-
- // 순서를 고정하고 싶다면 group 순서를 미리 정의하거나 sort해야 함
- // 여기서는 그냥 Object.entries 순서
- Object.entries(groupMap).forEach(([groupName, colDefs]) => {
- if (groupName === "_noGroup") {
- // 그룹 없음 → 그냥 최상위 레벨 컬럼
- nestedColumns.push(...colDefs)
- } else {
- // 상위 컬럼
- nestedColumns.push({
- id: groupName,
- header: groupName, // "Basic Info", "Metadata" 등
- columns: colDefs,
- })
- }
- })
+ // 적용 범위 그룹
+ const scopeColumns: ColumnDef<BasicContractTemplate>[] = [
+ {
+ accessorKey: "shipBuildingApplicable",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="조선해양" />,
+ cell: ({ row }) => {
+ const applicable = row.getValue("shipBuildingApplicable") as boolean;
+ return (
+ <div className="flex justify-center">
+ {applicable ? (
+ <CheckCircle className="h-4 w-4 text-green-500" />
+ ) : (
+ <XCircle className="h-4 w-4 text-gray-300" />
+ )}
+ </div>
+ );
+ },
+ size: 80,
+ enableResizing: true,
+ },
+ {
+ accessorKey: "windApplicable",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="풍력" />,
+ cell: ({ row }) => {
+ const applicable = row.getValue("windApplicable") as boolean;
+ return (
+ <div className="flex justify-center">
+ {applicable ? (
+ <CheckCircle className="h-4 w-4 text-green-500" />
+ ) : (
+ <XCircle className="h-4 w-4 text-gray-300" />
+ )}
+ </div>
+ );
+ },
+ size: 60,
+ enableResizing: true,
+ },
+ {
+ accessorKey: "pcApplicable",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="PC" />,
+ cell: ({ row }) => {
+ const applicable = row.getValue("pcApplicable") as boolean;
+ return (
+ <div className="flex justify-center">
+ {applicable ? (
+ <CheckCircle className="h-4 w-4 text-green-500" />
+ ) : (
+ <XCircle className="h-4 w-4 text-gray-300" />
+ )}
+ </div>
+ );
+ },
+ size: 50,
+ enableResizing: true,
+ },
+ {
+ accessorKey: "nbApplicable",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="NB" />,
+ cell: ({ row }) => {
+ const applicable = row.getValue("nbApplicable") as boolean;
+ return (
+ <div className="flex justify-center">
+ {applicable ? (
+ <CheckCircle className="h-4 w-4 text-green-500" />
+ ) : (
+ <XCircle className="h-4 w-4 text-gray-300" />
+ )}
+ </div>
+ );
+ },
+ size: 50,
+ enableResizing: true,
+ },
+ {
+ accessorKey: "rcApplicable",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="RC" />,
+ cell: ({ row }) => {
+ const applicable = row.getValue("rcApplicable") as boolean;
+ return (
+ <div className="flex justify-center">
+ {applicable ? (
+ <CheckCircle className="h-4 w-4 text-green-500" />
+ ) : (
+ <XCircle className="h-4 w-4 text-gray-300" />
+ )}
+ </div>
+ );
+ },
+ size: 50,
+ enableResizing: true,
+ },
+ {
+ accessorKey: "gyApplicable",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="GY" />,
+ cell: ({ row }) => {
+ const applicable = row.getValue("gyApplicable") as boolean;
+ return (
+ <div className="flex justify-center">
+ {applicable ? (
+ <CheckCircle className="h-4 w-4 text-green-500" />
+ ) : (
+ <XCircle className="h-4 w-4 text-gray-300" />
+ )}
+ </div>
+ );
+ },
+ size: 50,
+ enableResizing: true,
+ },
+ {
+ accessorKey: "sysApplicable",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="S&Sys" />,
+ cell: ({ row }) => {
+ const applicable = row.getValue("sysApplicable") as boolean;
+ return (
+ <div className="flex justify-center">
+ {applicable ? (
+ <CheckCircle className="h-4 w-4 text-green-500" />
+ ) : (
+ <XCircle className="h-4 w-4 text-gray-300" />
+ )}
+ </div>
+ );
+ },
+ size: 60,
+ enableResizing: true,
+ },
+ {
+ accessorKey: "infraApplicable",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="Infra" />,
+ cell: ({ row }) => {
+ const applicable = row.getValue("infraApplicable") as boolean;
+ return (
+ <div className="flex justify-center">
+ {applicable ? (
+ <CheckCircle className="h-4 w-4 text-green-500" />
+ ) : (
+ <XCircle className="h-4 w-4 text-gray-300" />
+ )}
+ </div>
+ );
+ },
+ size: 60,
+ enableResizing: true,
+ },
+ ];
+
+ // 파일 정보 그룹
+ const fileInfoColumns: ColumnDef<BasicContractTemplate>[] = [
+ {
+ accessorKey: "fileName",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="파일명" />,
+ cell: ({ row }) => {
+ const fileName = row.getValue("fileName") as string;
+ return (
+ <div className="min-w-0 max-w-full">
+ <span className="block truncate" title={fileName}>
+ {fileName}
+ </span>
+ </div>
+ );
+ },
+ size: 200,
+ enableResizing: true,
+ },
+ ];
+
+ // 감사 정보 그룹
+ const auditColumns: ColumnDef<BasicContractTemplate>[] = [
+ {
+ accessorKey: "createdAt",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="생성일" />,
+ cell: ({ row }) => {
+ const date = row.getValue("createdAt") as Date;
+ return date ? formatDateTime(date, "KR") : "-";
+ },
+ size: 120,
+ enableResizing: true,
+ },
+ {
+ accessorKey: "updatedAt",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="수정일" />,
+ cell: ({ row }) => {
+ const date = row.getValue("updatedAt") as Date;
+ return date ? formatDateTime(date, "KR") : "-";
+ },
+ size: 120,
+ enableResizing: true,
+ },
+ {
+ accessorKey: "disposedAt",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="폐기일" />,
+ cell: ({ row }) => {
+ const date = row.getValue("disposedAt") as Date;
+ return date ? formatDateTime(date, "KR") : "-";
+ },
+ size: 120,
+ enableResizing: true,
+ },
+ {
+ accessorKey: "restoredAt",
+ header: ({ column }) => <DataTableColumnHeaderSimple column={column} title="복구일" />,
+ cell: ({ row }) => {
+ const date = row.getValue("restoredAt") as Date;
+ return date ? formatDateTime(date, "KR") : "-";
+ },
+ size: 120,
+ enableResizing: true,
+ },
+ ];
+
+ // 중첩 컬럼 그룹 생성
+ const nestedColumns: ColumnDef<BasicContractTemplate>[] = [
+ {
+ id: "기본 정보",
+ header: "기본 정보",
+ columns: basicInfoColumns,
+ },
+ {
+ id: "적용 범위",
+ header: "적용 범위",
+ columns: scopeColumns,
+ },
+ {
+ id: "파일 정보",
+ header: "파일 정보",
+ columns: fileInfoColumns,
+ },
+ {
+ id: "감사 정보",
+ header: "감사 정보",
+ columns: auditColumns,
+ },
+ ]
// ----------------------------------------------------------------
// 5) 최종 컬럼 배열: select, download, nestedColumns, actions
// ----------------------------------------------------------------
return [
selectColumn,
- downloadColumn, // 다운로드 컬럼 추가
+ downloadColumn,
...nestedColumns,
actionsColumn,
]
diff --git a/lib/basic-contract/template/update-basicContract-sheet.tsx b/lib/basic-contract/template/update-basicContract-sheet.tsx index 2c6efc9b..810e1b77 100644 --- a/lib/basic-contract/template/update-basicContract-sheet.tsx +++ b/lib/basic-contract/template/update-basicContract-sheet.tsx @@ -8,6 +8,8 @@ import { toast } from "sonner" import * as z from "zod" import { Button } from "@/components/ui/button" +import { Checkbox } from "@/components/ui/checkbox" +import { Switch } from "@/components/ui/switch" import { Form, FormControl, @@ -43,23 +45,44 @@ import { DropzoneDescription, DropzoneInput } from "@/components/ui/dropzone" +import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" +import { Separator } from "@/components/ui/separator" +import { Badge } from "@/components/ui/badge" import { updateTemplate } from "../service" import { BasicContractTemplate } from "@/db/schema" +import { BUSINESS_UNITS, scopeHelpers } from "@/config/basicContractColumnsConfig" -// 업데이트 템플릿 스키마 정의 (유효기간 필드 추가) +// 업데이트 템플릿 스키마 정의 export const updateTemplateSchema = z.object({ + templateCode: z.string().min(1, "템플릿 코드는 필수입니다."), // readonly로 처리 templateName: z.string().min(1, "템플릿 이름은 필수입니다."), - validityPeriod: z.coerce - .number({ invalid_type_error: "유효기간은 숫자여야 합니다." }) - .int("유효기간은 정수여야 합니다.") - .min(1, "유효기간은 최소 1개월 이상이어야 합니다.") - .max(120, "유효기간은 최대 120개월(10년)을 초과할 수 없습니다.") - .default(12), - status: z.enum(["ACTIVE", "INACTIVE"], { + revision: z.coerce.number().int().min(1, "리비전은 1 이상이어야 합니다."), + legalReviewRequired: z.boolean(), + + // 적용 범위 + shipBuildingApplicable: z.boolean(), + windApplicable: z.boolean(), + pcApplicable: z.boolean(), + nbApplicable: z.boolean(), + rcApplicable: z.boolean(), + gyApplicable: z.boolean(), + sysApplicable: z.boolean(), + infraApplicable: z.boolean(), + + status: z.enum(["ACTIVE", "DISPOSED"], { required_error: "상태는 필수 선택사항입니다.", }), file: z.instanceof(File, { message: "파일을 업로드해주세요." }).optional(), -}) +}).refine((data) => { + // 적어도 하나의 적용 범위는 선택되어야 함 + const hasAnyScope = BUSINESS_UNITS.some(unit => + data[unit.key as keyof typeof data] as boolean + ); + return hasAnyScope; +}, { + message: "적어도 하나의 적용 범위를 선택해야 합니다.", + path: ["shipBuildingApplicable"], +}); export type UpdateTemplateSchema = z.infer<typeof updateTemplateSchema> @@ -73,15 +96,22 @@ export function UpdateTemplateSheet({ template, onSuccess, ...props }: UpdateTem const [isUpdatePending, startUpdateTransition] = React.useTransition() const [selectedFile, setSelectedFile] = React.useState<File | null>(null) - // 템플릿 데이터 확인을 위한 로그 - console.log(template) - const form = useForm<UpdateTemplateSchema>({ resolver: zodResolver(updateTemplateSchema), defaultValues: { + templateCode: template?.templateCode ?? "", templateName: template?.templateName ?? "", - validityPeriod: template?.validityPeriod ?? 12, // 기본값 12개월 - status: (template?.status as "ACTIVE" | "INACTIVE") || "ACTIVE" + revision: template?.revision ?? 1, + legalReviewRequired: template?.legalReviewRequired ?? false, + shipBuildingApplicable: template?.shipBuildingApplicable ?? false, + windApplicable: template?.windApplicable ?? false, + pcApplicable: template?.pcApplicable ?? false, + nbApplicable: template?.nbApplicable ?? false, + rcApplicable: template?.rcApplicable ?? false, + gyApplicable: template?.gyApplicable ?? false, + sysApplicable: template?.sysApplicable ?? false, + infraApplicable: template?.infraApplicable ?? false, + status: (template?.status as "ACTIVE" | "DISPOSED") || "ACTIVE" }, mode: "onChange" }) @@ -95,26 +125,38 @@ export function UpdateTemplateSheet({ template, onSuccess, ...props }: UpdateTem } }; + // 모든 적용 범위 선택/해제 + const handleSelectAllScopes = (checked: boolean) => { + BUSINESS_UNITS.forEach(unit => { + form.setValue(unit.key as keyof UpdateTemplateSchema, checked); + }); + }; + // 템플릿 변경 시 폼 값 업데이트 React.useEffect(() => { if (template) { form.reset({ + templateCode: template.templateCode, templateName: template.templateName, - validityPeriod: template.validityPeriod ?? 12, // 기존 값이 없으면 기본값 12개월 - status: template.status as "ACTIVE" | "INACTIVE", + revision: template.revision ?? 1, + legalReviewRequired: template.legalReviewRequired ?? false, + shipBuildingApplicable: template.shipBuildingApplicable ?? false, + windApplicable: template.windApplicable ?? false, + pcApplicable: template.pcApplicable ?? false, + nbApplicable: template.nbApplicable ?? false, + rcApplicable: template.rcApplicable ?? false, + gyApplicable: template.gyApplicable ?? false, + sysApplicable: template.sysApplicable ?? false, + infraApplicable: template.infraApplicable ?? false, + status: template.status as "ACTIVE" | "DISPOSED", }); } }, [template, form]); - // 유효기간 선택 옵션 - const validityOptions = [ - { value: "3", label: "3개월" }, - { value: "6", label: "6개월" }, - { value: "12", label: "1년" }, - { value: "24", label: "2년" }, - { value: "36", label: "3년" }, - { value: "60", label: "5년" }, - ]; + // 현재 선택된 적용 범위 수 + const selectedScopesCount = BUSINESS_UNITS.filter(unit => + form.watch(unit.key as keyof UpdateTemplateSchema) + ).length; function onSubmit(input: UpdateTemplateSchema) { startUpdateTransition(async () => { @@ -122,8 +164,17 @@ export function UpdateTemplateSheet({ template, onSuccess, ...props }: UpdateTem // FormData 객체 생성하여 파일과 데이터를 함께 전송 const formData = new FormData(); + formData.append("templateCode", input.templateCode); formData.append("templateName", input.templateName); - formData.append("validityPeriod", input.validityPeriod.toString()); // 유효기간 추가 + formData.append("revision", input.revision.toString()); + formData.append("legalReviewRequired", input.legalReviewRequired.toString()); + + // 적용 범위 추가 + BUSINESS_UNITS.forEach(unit => { + const value = input[unit.key as keyof UpdateTemplateSchema] as boolean; + formData.append(unit.key, value.toString()); + }); + formData.append("status", input.status); if (input.file) { @@ -154,124 +205,241 @@ export function UpdateTemplateSheet({ template, onSuccess, ...props }: UpdateTem }); } + if (!template) return null; + return ( <Sheet {...props}> - <SheetContent className="flex flex-col gap-6 sm:max-w-md"> + <SheetContent className="flex flex-col gap-6 sm:max-w-[600px] overflow-y-auto"> <SheetHeader className="text-left"> <SheetTitle>템플릿 업데이트</SheetTitle> <SheetDescription> 템플릿 정보를 수정하고 변경사항을 저장하세요 </SheetDescription> </SheetHeader> + <Form {...form}> <form onSubmit={form.handleSubmit(onSubmit)} - className="flex flex-col gap-4" + className="flex flex-col gap-6" > - <FormField - control={form.control} - name="templateName" - render={({ field }) => ( - <FormItem> - <FormLabel>템플릿 이름</FormLabel> - <FormControl> - <Input placeholder="템플릿 이름을 입력하세요" {...field} /> - </FormControl> - <FormMessage /> - </FormItem> - )} - /> + {/* 기본 정보 */} + <Card> + <CardHeader> + <CardTitle className="text-lg">기본 정보</CardTitle> + <CardDescription> + 현재 적용 범위: {scopeHelpers.getScopeDisplayText(template)} + </CardDescription> + </CardHeader> + <CardContent className="space-y-4"> + <div className="grid grid-cols-1 md:grid-cols-2 gap-4"> + <FormField + control={form.control} + name="templateCode" + render={({ field }) => ( + <FormItem> + <FormLabel>템플릿 코드</FormLabel> + <FormControl> + <Input + {...field} + readOnly + className="bg-muted" + /> + </FormControl> + <FormDescription> + 템플릿 코드는 수정할 수 없습니다. + </FormDescription> + </FormItem> + )} + /> + + <FormField + control={form.control} + name="revision" + render={({ field }) => ( + <FormItem> + <FormLabel>리비전</FormLabel> + <FormControl> + <Input + type="number" + min="1" + {...field} + onChange={(e) => field.onChange(parseInt(e.target.value) || 1)} + /> + </FormControl> + <FormDescription> + 템플릿 버전을 업데이트하세요. + </FormDescription> + <FormMessage /> + </FormItem> + )} + /> + </div> + + <FormField + control={form.control} + name="templateName" + render={({ field }) => ( + <FormItem> + <FormLabel>템플릿 이름</FormLabel> + <FormControl> + <Input placeholder="템플릿 이름을 입력하세요" {...field} /> + </FormControl> + <FormMessage /> + </FormItem> + )} + /> - <FormField - control={form.control} - name="validityPeriod" - render={({ field }) => ( - <FormItem> - <FormLabel>계약 유효기간</FormLabel> - <Select - value={field.value?.toString()} - onValueChange={(value) => field.onChange(parseInt(value))} - > - <FormControl> - <SelectTrigger> - <SelectValue placeholder="유효기간을 선택하세요" /> - </SelectTrigger> - </FormControl> - <SelectContent> - {validityOptions.map(option => ( - <SelectItem key={option.value} value={option.value}> - {option.label} - </SelectItem> - ))} - </SelectContent> - </Select> - <FormDescription> - 계약서의 유효 기간을 설정합니다. 이 기간이 지나면 재계약이 필요합니다. - </FormDescription> - <FormMessage /> - </FormItem> - )} - /> + <div className="grid grid-cols-1 md:grid-cols-2 gap-4"> + <FormField + control={form.control} + name="status" + render={({ field }) => ( + <FormItem> + <FormLabel>상태</FormLabel> + <Select + defaultValue={field.value} + onValueChange={field.onChange} + > + <FormControl> + <SelectTrigger> + <SelectValue placeholder="템플릿 상태 선택" /> + </SelectTrigger> + </FormControl> + <SelectContent> + <SelectGroup> + <SelectItem value="ACTIVE">활성</SelectItem> + <SelectItem value="DISPOSED">폐기</SelectItem> + </SelectGroup> + </SelectContent> + </Select> + <FormMessage /> + </FormItem> + )} + /> + </div> + + <FormField + control={form.control} + name="legalReviewRequired" + render={({ field }) => ( + <FormItem className="flex flex-row items-center justify-between rounded-lg border p-3 shadow-sm"> + <div className="space-y-0.5"> + <FormLabel>법무검토 필요</FormLabel> + <FormDescription> + 법무팀 검토가 필요한 템플릿인지 설정 + </FormDescription> + </div> + <FormControl> + <Switch + checked={field.value} + onCheckedChange={field.onChange} + /> + </FormControl> + </FormItem> + )} + /> + </CardContent> + </Card> - <FormField - control={form.control} - name="status" - render={({ field }) => ( - <FormItem> - <FormLabel>상태</FormLabel> - <Select - defaultValue={field.value} - onValueChange={field.onChange} - > - <FormControl> - <SelectTrigger> - <SelectValue placeholder="템플릿 상태 선택" /> - </SelectTrigger> - </FormControl> - <SelectContent> - <SelectGroup> - <SelectItem value="ACTIVE">활성</SelectItem> - <SelectItem value="INACTIVE">비활성</SelectItem> - </SelectGroup> - </SelectContent> - </Select> - <FormMessage /> - </FormItem> - )} - /> + {/* 적용 범위 */} + <Card> + <CardHeader> + <CardTitle className="text-lg">적용 범위</CardTitle> + <CardDescription> + 이 템플릿이 적용될 사업부를 선택하세요. ({selectedScopesCount}개 선택됨) + </CardDescription> + </CardHeader> + <CardContent className="space-y-4"> + <div className="flex items-center space-x-2"> + <Checkbox + id="select-all" + checked={selectedScopesCount === BUSINESS_UNITS.length} + onCheckedChange={handleSelectAllScopes} + /> + <label htmlFor="select-all" className="text-sm font-medium"> + 전체 선택 + </label> + </div> + + <Separator /> + + <div className="grid grid-cols-2 md:grid-cols-4 gap-4"> + {BUSINESS_UNITS.map((unit) => ( + <FormField + key={unit.key} + control={form.control} + name={unit.key as keyof UpdateTemplateSchema} + render={({ field }) => ( + <FormItem className="flex flex-row items-start space-x-3 space-y-0"> + <FormControl> + <Checkbox + checked={field.value as boolean} + onCheckedChange={field.onChange} + /> + </FormControl> + <div className="space-y-1 leading-none"> + <FormLabel className="text-sm font-normal"> + {unit.label} + </FormLabel> + </div> + </FormItem> + )} + /> + ))} + </div> + + {form.formState.errors.shipBuildingApplicable && ( + <p className="text-sm text-destructive"> + {form.formState.errors.shipBuildingApplicable.message} + </p> + )} + </CardContent> + </Card> - <FormField - control={form.control} - name="file" - render={() => ( - <FormItem> - <FormLabel>템플릿 파일 (선택사항)</FormLabel> - <FormControl> - <Dropzone - onDrop={handleFileChange} - > - <DropzoneZone> - <DropzoneUploadIcon className="h-10 w-10 text-muted-foreground" /> - <DropzoneTitle> - {selectedFile - ? selectedFile.name - : template?.fileName - ? `현재 파일: ${template.fileName}` - : "새 파일을 드래그하세요"} - </DropzoneTitle> - <DropzoneDescription> - {selectedFile - ? `파일 크기: ${(selectedFile.size / 1024).toFixed(2)} KB` - : "또는 클릭하여 파일을 선택하세요 (선택사항)"} - </DropzoneDescription> - <DropzoneInput /> - </DropzoneZone> - </Dropzone> - </FormControl> - <FormMessage /> - </FormItem> - )} - /> + {/* 파일 업데이트 */} + <Card> + <CardHeader> + <CardTitle className="text-lg">파일 업데이트</CardTitle> + <CardDescription> + 현재 파일: {template.fileName} + </CardDescription> + </CardHeader> + <CardContent> + <FormField + control={form.control} + name="file" + render={() => ( + <FormItem> + <FormLabel>템플릿 파일 (선택사항)</FormLabel> + <FormControl> + <Dropzone + onDrop={handleFileChange} + accept={{ + 'application/pdf': ['.pdf'] + }} + > + <DropzoneZone> + <DropzoneUploadIcon className="h-10 w-10 text-muted-foreground" /> + <DropzoneTitle> + {selectedFile + ? selectedFile.name + : "새 파일을 드래그하세요 (선택사항)"} + </DropzoneTitle> + <DropzoneDescription> + {selectedFile + ? `파일 크기: ${(selectedFile.size / (1024 * 1024)).toFixed(2)} MB` + : "또는 클릭하여 파일을 선택하세요"} + </DropzoneDescription> + <DropzoneInput /> + </DropzoneZone> + </Dropzone> + </FormControl> + <FormMessage /> + </FormItem> + )} + /> + </CardContent> + </Card> <SheetFooter className="gap-2 pt-2 sm:space-x-0"> <SheetClose asChild> |