summaryrefslogtreecommitdiff
path: root/lib/basic-contract
diff options
context:
space:
mode:
Diffstat (limited to 'lib/basic-contract')
-rw-r--r--lib/basic-contract/service.ts88
-rw-r--r--lib/basic-contract/template/add-basic-contract-template-dialog.tsx364
-rw-r--r--lib/basic-contract/template/basic-contract-template-columns.tsx314
-rw-r--r--lib/basic-contract/template/create-revision-dialog.tsx21
-rw-r--r--lib/basic-contract/template/template-editor-wrapper.tsx106
-rw-r--r--lib/basic-contract/template/update-basicContract-sheet.tsx245
-rw-r--r--lib/basic-contract/validations.ts17
-rw-r--r--lib/basic-contract/vendor-table/basic-contract-columns.tsx96
-rw-r--r--lib/basic-contract/vendor-table/basic-contract-sign-dialog.tsx313
-rw-r--r--lib/basic-contract/vendor-table/basic-contract-table.tsx98
-rw-r--r--lib/basic-contract/vendor-table/basicContract-table-toolbar-actions.tsx43
-rw-r--r--lib/basic-contract/viewer/AutoSignatureFieldDetector.tsx493
-rw-r--r--lib/basic-contract/viewer/basic-contract-sign-viewer.tsx1679
13 files changed, 2922 insertions, 955 deletions
diff --git a/lib/basic-contract/service.ts b/lib/basic-contract/service.ts
index 03b27f96..64a50d14 100644
--- a/lib/basic-contract/service.ts
+++ b/lib/basic-contract/service.ts
@@ -4,13 +4,14 @@ import { revalidateTag, unstable_noStore } from "next/cache";
import db from "@/db/db";
import { getErrorMessage } from "@/lib/handle-error";
import { unstable_cache } from "@/lib/unstable-cache";
-import { asc, desc, ilike, inArray, and, gte, lte, not, or, sql, eq, isNull, ne, isNotNull, count } from "drizzle-orm";
+import { asc, desc, ilike, inArray, and, gte, lte, not, or, sql, eq, isNull, ne, isNotNull, count,like } from "drizzle-orm";
import { v4 as uuidv4 } from "uuid";
import {
basicContract,
BasicContractTemplate,
basicContractTemplates,
basicContractView,
+ vendorAttachments,
vendors,
type BasicContractTemplate as DBBasicContractTemplate,
} from "@/db/schema";
@@ -195,15 +196,6 @@ export async function createBasicContractTemplate(input: CreateBasicContractTemp
const [row] = await insertBasicContractTemplate(tx, {
templateName: input.templateName,
revision: input.revision || 1,
- legalReviewRequired: input.legalReviewRequired,
- shipBuildingApplicable: input.shipBuildingApplicable,
- windApplicable: input.windApplicable,
- pcApplicable: input.pcApplicable,
- nbApplicable: input.nbApplicable,
- rcApplicable: input.rcApplicable,
- gyApplicable: input.gyApplicable,
- sysApplicable: input.sysApplicable,
- infraApplicable: input.infraApplicable,
status: input.status || "ACTIVE",
// πŸ“ null 처리 μΆ”κ°€
@@ -675,8 +667,8 @@ export async function getBasicContractsByVendorId(
input: GetBasciContractsSchema,
vendorId: number
) {
- return unstable_cache(
- async () => {
+ // return unstable_cache(
+ // async () => {
try {
const offset = (input.page - 1) * input.perPage;
@@ -743,13 +735,13 @@ export async function getBasicContractsByVendorId(
// μ—λŸ¬ λ°œμƒ μ‹œ λ””ν΄νŠΈ
return { data: [], pageCount: 0 };
}
- },
- [JSON.stringify(input), String(vendorId)], // 캐싱 킀에 vendorId μΆ”κ°€
- {
- revalidate: 3600,
- tags: ["basicContractView-vendor"], // revalidateTag("basicContractView") 호좜 μ‹œ λ¬΄νš¨ν™”
- }
- )();
+ // },
+ // [JSON.stringify(input), String(vendorId)], // 캐싱 킀에 vendorId μΆ”κ°€
+ // {
+ // revalidate: 3600,
+ // tags: ["basicContractView-vendor"], // revalidateTag("basicContractView") 호좜 μ‹œ λ¬΄νš¨ν™”
+ // }
+ // )();
}
export async function getAllTemplates(): Promise<BasicContractTemplate[]> {
@@ -1120,15 +1112,25 @@ export async function getALLBasicContractTemplates() {
// 2) λ“±λ‘λœ templateName만 쀑볡 없이 κ°€μ Έμ˜€κΈ°
export async function getExistingTemplateNames(): Promise<string[]> {
- const rows = await db
- .select({
- templateName: basicContractTemplates.templateName,
- })
- .from(basicContractTemplates)
- .where(eq(basicContractTemplates.status,"ACTIVE"))
- .groupBy(basicContractTemplates.templateName);
-
- return rows.map((r) => r.templateName);
+ try {
+ const templates = await db
+ .select({
+ templateName: basicContractTemplates.templateName
+ })
+ .from(basicContractTemplates)
+ .where(
+ and(
+ eq(basicContractTemplates.status, 'ACTIVE'),
+ // GTCκ°€ μ•„λ‹Œ κ²ƒλ“€λ§Œ 쀑볡 체크 (GTCλŠ” ν”„λ‘œμ νŠΈλ³„λ‘œ μ—¬λŸ¬ 개 ν—ˆμš©)
+ not(like(basicContractTemplates.templateName, '% GTC'))
+ )
+ );
+
+ return templates.map(t => t.templateName);
+ } catch (error) {
+ console.error('Failed to fetch existing template names:', error);
+ throw new Error('κΈ°μ‘΄ ν…œν”Œλ¦Ώ 이름을 κ°€μ Έμ˜€λŠ”λ° μ‹€νŒ¨ν–ˆμŠ΅λ‹ˆλ‹€.');
+ }
}
export async function getExistingTemplateNamesById(id:number): Promise<string> {
@@ -1141,4 +1143,32 @@ export async function getExistingTemplateNamesById(id:number): Promise<string> {
.limit(1)
return rows[0].templateName;
-} \ No newline at end of file
+}
+
+export async function getVendorAttachments(vendorId: number) {
+ try {
+ const attachments = await db
+ .select()
+ .from(vendorAttachments)
+ .where(
+ and(
+ eq(vendorAttachments.vendorId, vendorId),
+ eq(vendorAttachments.attachmentType, "NDA_ATTACHMENT")
+ )
+ );
+
+ console.log(attachments,"attachments")
+
+ return {
+ success: true,
+ data: attachments
+ };
+ } catch (error) {
+ console.error("Error fetching vendor attachments:", error);
+ return {
+ success: false,
+ data: [],
+ error: "Failed to fetch vendor attachments"
+ };
+ }
+}
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 43c19e67..141cb1e3 100644
--- a/lib/basic-contract/template/add-basic-contract-template-dialog.tsx
+++ b/lib/basic-contract/template/add-basic-contract-template-dialog.tsx
@@ -16,9 +16,7 @@ import {
FormMessage,
FormDescription,
} 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,
@@ -37,21 +35,18 @@ import {
} from "@/components/ui/dropzone";
import { Progress } from "@/components/ui/progress";
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";
import { getExistingTemplateNames } from "../service";
+import { getAvailableProjectsForGtc } from "@/lib/gtc-contract/service";
-// βœ… μ„œλ²„ μ•‘μ…˜ import
-
-// 전체 ν…œν”Œλ¦Ώ 후보
-const TEMPLATE_NAME_OPTIONS = [
+// κ³ μ • ν…œν”Œλ¦Ώ μ˜΅μ…˜λ“€ (GTC μ œμ™Έ)
+const FIXED_TEMPLATE_OPTIONS = [
"μ€€λ²•μ„œμ•½ (ν•œκΈ€)",
"μ€€λ²•μ„œμ•½ (영문)",
"기술자료 μš”κ΅¬μ„œ",
"λΉ„λ°€μœ μ§€ κ³„μ•½μ„œ",
"ν‘œμ€€ν•˜λ„κΈ‰κΈ°λ³Έ κ³„μ•½μ„œ",
- "GTC",
+ "General GTC", // κΈ°λ³Έ GTC (ν•˜λ‚˜λ§Œ)
"μ•ˆμ „λ³΄κ±΄κ΄€λ¦¬ μ•½μ •μ„œ",
"λ™λ°˜μ„±μž₯",
"μœ€λ¦¬κ·œλ²” μ€€μˆ˜ μ„œμ•½μ„œ",
@@ -60,28 +55,33 @@ const TEMPLATE_NAME_OPTIONS = [
"μ§λ‚©μžμž¬ ν•˜λ„κΈ‰λŒ€κΈ‰λ“± μ—°λ™μ œ 의ν–₯μ„œ"
] as const;
+// ν”„λ‘œμ νŠΈ νƒ€μž… μ •μ˜
+type ProjectForFilter = {
+ id: number;
+ code: string;
+ name: string;
+};
+
const templateFormSchema = z.object({
- templateName: z.enum(TEMPLATE_NAME_OPTIONS, {
- required_error: "ν…œν”Œλ¦Ώ 이름을 μ„ νƒν•΄μ£Όμ„Έμš”.",
+ templateType: z.enum(['FIXED', 'PROJECT_GTC'], {
+ required_error: "ν…œν”Œλ¦Ώ νƒ€μž…μ„ μ„ νƒν•΄μ£Όμ„Έμš”.",
}),
+ templateName: z.string().min(1, "ν…œν”Œλ¦Ώ 이름을 μ„ νƒν•˜κ±°λ‚˜ μž…λ ₯ν•΄μ£Όμ„Έμš”."),
+ selectedProjectId: z.number().optional(),
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).optional(),
+ file: z.instanceof(File, {
+ message: "νŒŒμΌμ„ μ—…λ‘œλ“œν•΄μ£Όμ„Έμš”.",
+ }),
})
.refine((data) => {
- if (data.templateName !== "General GTC" && !data.file) return false;
+ // PROJECT_GTC νƒ€μž…μΈ 경우 ν”„λ‘œμ νŠΈ 선택 ν•„μˆ˜
+ if (data.templateType === 'PROJECT_GTC' && !data.selectedProjectId) {
+ return false;
+ }
return true;
}, {
- message: "νŒŒμΌμ„ μ—…λ‘œλ“œν•΄μ£Όμ„Έμš”.",
- path: ["file"],
+ message: "ν”„λ‘œμ νŠΈλ₯Ό μ„ νƒν•΄μ£Όμ„Έμš”.",
+ path: ["selectedProjectId"],
})
.refine((data) => {
if (data.file && data.file.size > 100 * 1024 * 1024) return false;
@@ -100,16 +100,6 @@ const templateFormSchema = z.object({
}, {
message: "μ›Œλ“œ 파일(.doc, .docx)만 μ—…λ‘œλ“œ κ°€λŠ₯ν•©λ‹ˆλ‹€.",
path: ["file"],
-})
-.refine((data) => {
- const scopeFields = [
- 'shipBuildingApplicable', 'windApplicable', 'pcApplicable', 'nbApplicable',
- 'rcApplicable', 'gyApplicable', 'sysApplicable', 'infraApplicable'
- ];
- return scopeFields.some(field => data[field as keyof typeof data] === true);
-}, {
- message: "적어도 ν•˜λ‚˜μ˜ 적용 λ²”μœ„λ₯Ό 선택해야 ν•©λ‹ˆλ‹€.",
- path: ["shipBuildingApplicable"],
});
type TemplateFormValues = z.infer<typeof templateFormSchema>;
@@ -120,21 +110,16 @@ export function AddTemplateDialog() {
const [selectedFile, setSelectedFile] = React.useState<File | null>(null);
const [uploadProgress, setUploadProgress] = React.useState(0);
const [showProgress, setShowProgress] = React.useState(false);
- const [availableTemplateNames, setAvailableTemplateNames] = React.useState<typeof TEMPLATE_NAME_OPTIONS[number][]>(TEMPLATE_NAME_OPTIONS);
+ const [availableFixedTemplates, setAvailableFixedTemplates] = React.useState<typeof FIXED_TEMPLATE_OPTIONS[number][]>([]);
+ const [availableProjects, setAvailableProjects] = React.useState<ProjectForFilter[]>([]);
const router = useRouter();
// κΈ°λ³Έκ°’
const defaultValues: Partial<TemplateFormValues> = {
- templateName: undefined,
+ templateType: 'FIXED',
+ templateName: '',
+ selectedProjectId: undefined,
legalReviewRequired: false,
- shipBuildingApplicable: false,
- windApplicable: false,
- pcApplicable: false,
- nbApplicable: false,
- rcApplicable: false,
- gyApplicable: false,
- sysApplicable: false,
- infraApplicable: false,
};
const form = useForm<TemplateFormValues>({
@@ -143,24 +128,38 @@ export function AddTemplateDialog() {
mode: "onChange",
});
- // πŸ”Έ 마운트 μ‹œ 이미 λ“±λ‘λœ templateName λͺ©λ‘ κ°€μ Έμ™€μ„œ 필터링
+ // πŸ”Έ 마운트 μ‹œ μ‚¬μš© κ°€λŠ₯ν•œ κ³ μ • ν…œν”Œλ¦Ώλ“€κ³Ό ν”„λ‘œμ νŠΈλ“€ κ°€μ Έμ˜€κΈ°
React.useEffect(() => {
let cancelled = false;
- (async () => {
+
+ const loadData = async () => {
try {
- const usedNames = await getExistingTemplateNames();
+ // κ³ μ • ν…œν”Œλ¦Ώ 쀑 이미 μ‚¬μš©λœ 것듀 μ œμ™Έ
+ const usedTemplateNames = await getExistingTemplateNames();
if (cancelled) return;
- // 이미 μžˆλŠ” 이름 μ œμ™Έ
- const filtered = TEMPLATE_NAME_OPTIONS.filter(name => !usedNames.includes(name));
- setAvailableTemplateNames(filtered);
+ const filteredFixedTemplates = FIXED_TEMPLATE_OPTIONS.filter(
+ name => !usedTemplateNames.includes(name)
+ );
+ setAvailableFixedTemplates(filteredFixedTemplates);
+
+ // GTC 생성 κ°€λŠ₯ν•œ ν”„λ‘œμ νŠΈλ“€ κ°€μ Έμ˜€κΈ°
+ const projects = await getAvailableProjectsForGtc();
+ if (cancelled) return;
+
+ setAvailableProjects(projects);
} catch (err) {
- console.error("Failed to fetch existing template names", err);
- // μ‹€νŒ¨ μ‹œ 전체 μ˜΅μ…˜ λ³΄μ—¬μ£Όκ±°λ‚˜, 였λ₯˜ μ•Œλ €μ£ΌκΈ°
+ console.error("Failed to load template data", err);
+ toast.error("ν…œν”Œλ¦Ώ 정보λ₯Ό λΆˆλŸ¬μ˜€λŠ”λ° μ‹€νŒ¨ν–ˆμŠ΅λ‹ˆλ‹€.");
}
- })();
+ };
+
+ if (open) {
+ loadData();
+ }
+
return () => { cancelled = true; };
- }, []);
+ }, [open]);
const handleFileChange = (files: File[]) => {
if (files.length > 0) {
@@ -170,10 +169,13 @@ export function AddTemplateDialog() {
}
};
- const handleSelectAllScopes = (checked: boolean) => {
- BUSINESS_UNITS.forEach(unit => {
- form.setValue(unit.key as keyof TemplateFormValues, checked);
- });
+ // ν”„λ‘œμ νŠΈ 선택 μ‹œ ν…œν”Œλ¦Ώ 이름 μžλ™ μ„€μ •
+ const handleProjectChange = (projectId: string) => {
+ const project = availableProjects.find(p => p.id === parseInt(projectId));
+ if (project) {
+ form.setValue("selectedProjectId", project.id);
+ form.setValue("templateName", `${project.code} GTC`);
+ }
};
// 청크 μ—…λ‘œλ“œ μ„€μ •
@@ -218,22 +220,14 @@ export function AddTemplateDialog() {
async function onSubmit(formData: TemplateFormValues) {
setIsLoading(true);
try {
- let uploadResult = null;
-
- // πŸ“ 파일 μ—…λ‘œλ“œκ°€ ν•„μš”ν•œ κ²½μš°μ—λ§Œ μ—…λ‘œλ“œ 진행
- if (formData.file) {
- const fileId = uuidv4();
- uploadResult = await uploadFileInChunks(formData.file, fileId);
-
- if (!uploadResult?.success) {
- throw new Error("파일 μ—…λ‘œλ“œμ— μ‹€νŒ¨ν–ˆμŠ΅λ‹ˆλ‹€.");
- }
+ // 파일 μ—…λ‘œλ“œ 진행
+ const fileId = uuidv4();
+ const uploadResult = await uploadFileInChunks(formData.file, fileId);
+
+ if (!uploadResult?.success) {
+ throw new Error("파일 μ—…λ‘œλ“œμ— μ‹€νŒ¨ν–ˆμŠ΅λ‹ˆλ‹€.");
}
-
- // πŸ“ General GTC이고 파일이 μ—†λŠ” κ²½μš°μ™€ λ‹€λ₯Έ 경우 ꡬ뢄 처리
- const isGeneralGTC = formData.templateName === "General GTC";
- const hasFile = uploadResult && uploadResult.success;
-
+
const saveResponse = await fetch('/api/upload/basicContract/complete', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
@@ -241,37 +235,19 @@ export function AddTemplateDialog() {
templateName: formData.templateName,
revision: 1,
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: "ACTIVE",
-
- // πŸ“ 파일이 μžˆλŠ” κ²½μš°μ—λ§Œ fileNameκ³Ό filePath 전솑
- ...(hasFile && {
- fileName: uploadResult.fileName,
- filePath: uploadResult.filePath,
- }),
-
- // πŸ“ 파일이 μ—†λŠ” 경우 null 전솑 (μŠ€ν‚€λ§ˆκ°€ nullable이어야 함)
- ...(!hasFile && {
- fileName: null,
- filePath: null,
- })
+ fileName: uploadResult.fileName,
+ filePath: uploadResult.filePath,
}),
next: { tags: ["basic-contract-templates"] },
});
-
+
const saveResult = await saveResponse.json();
if (!saveResult.success) {
console.log(saveResult.error);
throw new Error(saveResult.error || "ν…œν”Œλ¦Ώ 정보 μ €μž₯에 μ‹€νŒ¨ν–ˆμŠ΅λ‹ˆλ‹€.");
}
-
+
toast.success('ν…œν”Œλ¦Ώμ΄ μ„±κ³΅μ μœΌλ‘œ μΆ”κ°€λ˜μ—ˆμŠ΅λ‹ˆλ‹€.');
form.reset();
setSelectedFile(null);
@@ -302,16 +278,15 @@ export function AddTemplateDialog() {
setOpen(nextOpen);
}
- const selectedScopesCount = BUSINESS_UNITS.filter(unit =>
- form.watch(unit.key as keyof TemplateFormValues)
- ).length;
-
- const templateNameIsRequired = form.watch("templateName") !== "General GTC";
+ const templateType = form.watch("templateType");
+ const selectedProjectId = form.watch("selectedProjectId");
+ const templateName = form.watch("templateName");
const isSubmitDisabled = isLoading ||
- !form.watch("templateName") ||
- (templateNameIsRequired && !form.watch("file")) ||
- !BUSINESS_UNITS.some(unit => form.watch(unit.key as keyof TemplateFormValues));
+ !templateType ||
+ !templateName ||
+ !form.watch("file") ||
+ (templateType === 'PROJECT_GTC' && !selectedProjectId);
return (
<Dialog open={open} onOpenChange={handleDialogOpenChange}>
@@ -332,13 +307,61 @@ export function AddTemplateDialog() {
<div className="flex-1 overflow-y-auto px-6">
<Form {...form}>
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-6 py-4">
+ {/* ν…œν”Œλ¦Ώ νƒ€μž… 선택 */}
+ <Card>
+ <CardHeader>
+ <CardTitle className="text-lg">ν…œν”Œλ¦Ώ μ’…λ₯˜</CardTitle>
+ <CardDescription>
+ μΆ”κ°€ν•  ν…œν”Œλ¦Ώμ˜ μ’…λ₯˜λ₯Ό μ„ νƒν•˜μ„Έμš”
+ </CardDescription>
+ </CardHeader>
+ <CardContent>
+ <FormField
+ control={form.control}
+ name="templateType"
+ render={({ field }) => (
+ <FormItem>
+ <FormLabel>
+ ν…œν”Œλ¦Ώ μ’…λ₯˜ <span className="text-red-500">*</span>
+ </FormLabel>
+ <Select
+ onValueChange={(value) => {
+ field.onChange(value);
+ // νƒ€μž… λ³€κ²½ μ‹œ κ΄€λ ¨ ν•„λ“œ μ΄ˆκΈ°ν™”
+ form.setValue("templateName", "");
+ form.setValue("selectedProjectId", undefined);
+ }}
+ value={field.value}
+ >
+ <FormControl>
+ <SelectTrigger>
+ <SelectValue placeholder="ν…œν”Œλ¦Ώ μ’…λ₯˜λ₯Ό μ„ νƒν•˜μ„Έμš”" />
+ </SelectTrigger>
+ </FormControl>
+ <SelectContent>
+ <SelectItem value="FIXED">ν‘œμ€€ ν…œν”Œλ¦Ώ</SelectItem>
+ <SelectItem value="PROJECT_GTC">ν”„λ‘œμ νŠΈ GTC</SelectItem>
+ </SelectContent>
+ </Select>
+ <FormDescription>
+ {templateType === 'FIXED' && "미리 μ •μ˜λœ ν‘œμ€€ ν…œν”Œλ¦Ώ μ€‘μ—μ„œ μ„ νƒν•©λ‹ˆλ‹€."}
+ {templateType === 'PROJECT_GTC' && "νŠΉμ • ν”„λ‘œμ νŠΈμš© GTC ν…œν”Œλ¦Ώμ„ μƒμ„±ν•©λ‹ˆλ‹€."}
+ </FormDescription>
+ <FormMessage />
+ </FormItem>
+ )}
+ />
+ </CardContent>
+ </Card>
+
{/* κΈ°λ³Έ 정보 */}
<Card>
<CardHeader>
<CardTitle className="text-lg">κΈ°λ³Έ 정보</CardTitle>
</CardHeader>
<CardContent className="space-y-4">
- <div className="grid grid-cols-1 gap-4">
+ {/* ν‘œμ€€ ν…œν”Œλ¦Ώ 선택 */}
+ {templateType === 'FIXED' && (
<FormField
control={form.control}
name="templateName"
@@ -349,16 +372,16 @@ export function AddTemplateDialog() {
</FormLabel>
<Select onValueChange={field.onChange} value={field.value}>
<FormControl>
- <SelectTrigger disabled={availableTemplateNames.length === 0}>
+ <SelectTrigger disabled={availableFixedTemplates.length === 0}>
<SelectValue placeholder={
- availableTemplateNames.length === 0
+ availableFixedTemplates.length === 0
? "μ‚¬μš© κ°€λŠ₯ν•œ ν…œν”Œλ¦Ώμ΄ μ—†μŠ΅λ‹ˆλ‹€"
: "ν…œν”Œλ¦Ώ 이름을 μ„ νƒν•˜μ„Έμš”"
} />
</SelectTrigger>
</FormControl>
<SelectContent>
- {availableTemplateNames.map((option) => (
+ {availableFixedTemplates.map((option) => (
<SelectItem key={option} value={option}>
{option}
</SelectItem>
@@ -372,7 +395,57 @@ export function AddTemplateDialog() {
</FormItem>
)}
/>
- </div>
+ )}
+
+ {/* ν”„λ‘œμ νŠΈ GTC */}
+ {templateType === 'PROJECT_GTC' && (
+ <>
+ <FormField
+ control={form.control}
+ name="selectedProjectId"
+ render={({ field }) => (
+ <FormItem>
+ <FormLabel>
+ ν”„λ‘œμ νŠΈ 선택 <span className="text-red-500">*</span>
+ </FormLabel>
+ <Select
+ onValueChange={handleProjectChange}
+ value={field.value?.toString()}
+ >
+ <FormControl>
+ <SelectTrigger disabled={availableProjects.length === 0}>
+ <SelectValue placeholder={
+ availableProjects.length === 0
+ ? "GTC 생성 κ°€λŠ₯ν•œ ν”„λ‘œμ νŠΈκ°€ μ—†μŠ΅λ‹ˆλ‹€"
+ : "ν”„λ‘œμ νŠΈλ₯Ό μ„ νƒν•˜μ„Έμš”"
+ } />
+ </SelectTrigger>
+ </FormControl>
+ <SelectContent>
+ {availableProjects.map((project) => (
+ <SelectItem key={project.id} value={project.id.toString()}>
+ {project.code} - {project.name}
+ </SelectItem>
+ ))}
+ </SelectContent>
+ </Select>
+ <FormDescription>
+ 아직 GTCκ°€ μƒμ„±λ˜μ§€ μ•Šμ€ ν”„λ‘œμ νŠΈλ§Œ ν‘œμ‹œλ©λ‹ˆλ‹€.
+ </FormDescription>
+ <FormMessage />
+ </FormItem>
+ )}
+ />
+
+ {/* 생성될 ν…œν”Œλ¦Ώ 이름 미리보기 */}
+ {templateName && (
+ <div className="rounded-lg border p-3 bg-muted/50">
+ <div className="text-sm font-medium">생성될 ν…œν”Œλ¦Ώ 이름</div>
+ <div className="text-lg font-semibold text-primary">{templateName}</div>
+ </div>
+ )}
+ </>
+ )}
<FormField
control={form.control}
@@ -397,71 +470,12 @@ export function AddTemplateDialog() {
</CardContent>
</Card>
- {/* 적용 λ²”μœ„ */}
- <Card>
- <CardHeader>
- <CardTitle className="text-lg">
- 적용 λ²”μœ„ <span className="text-red-500">*</span>
- </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 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>
<CardDescription>
- {form.watch("templateName") === "General GTC"
- ? "General GTCλŠ” 파일 μ—…λ‘œλ“œκ°€ μ„ νƒμ‚¬ν•­μž…λ‹ˆλ‹€"
- : "ν…œν”Œλ¦Ώ νŒŒμΌμ„ μ—…λ‘œλ“œν•˜μ„Έμš”"}
+ ν…œν”Œλ¦Ώ νŒŒμΌμ„ μ—…λ‘œλ“œν•˜μ„Έμš”
</CardDescription>
</CardHeader>
<CardContent>
@@ -471,13 +485,7 @@ export function AddTemplateDialog() {
render={() => (
<FormItem>
<FormLabel>
- ν…œν”Œλ¦Ώ 파일
- {form.watch("templateName") !== "General GTC" && (
- <span className="text-red-500"> *</span>
- )}
- {form.watch("templateName") === "General GTC" && (
- <span className="text-muted-foreground"> (선택사항)</span>
- )}
+ ν…œν”Œλ¦Ώ 파일 <span className="text-red-500">*</span>
</FormLabel>
<FormControl>
<Dropzone
@@ -495,9 +503,7 @@ export function AddTemplateDialog() {
<DropzoneDescription>
{selectedFile
? `파일 크기: ${(selectedFile.size / (1024 * 1024)).toFixed(2)} MB`
- : form.watch("templateName") === "General GTC"
- ? "λ˜λŠ” ν΄λ¦­ν•˜μ—¬ μ›Œλ“œ 파일(.doc, .docx)을 μ„ νƒν•˜μ„Έμš” (선택사항, μ΅œλŒ€ 100MB)"
- : "λ˜λŠ” ν΄λ¦­ν•˜μ—¬ μ›Œλ“œ 파일(.doc, .docx)을 μ„ νƒν•˜μ„Έμš” (μ΅œλŒ€ 100MB)"}
+ : "λ˜λŠ” ν΄λ¦­ν•˜μ—¬ μ›Œλ“œ 파일(.doc, .docx)을 μ„ νƒν•˜μ„Έμš” (μ΅œλŒ€ 100MB)"}
</DropzoneDescription>
<DropzoneInput />
</DropzoneZone>
@@ -543,4 +549,4 @@ export function AddTemplateDialog() {
</DialogContent>
</Dialog>
);
-}
+} \ No newline at end of file
diff --git a/lib/basic-contract/template/basic-contract-template-columns.tsx b/lib/basic-contract/template/basic-contract-template-columns.tsx
index 446112db..a0bef7bf 100644
--- a/lib/basic-contract/template/basic-contract-template-columns.tsx
+++ b/lib/basic-contract/template/basic-contract-template-columns.tsx
@@ -119,13 +119,7 @@ export function getColumns({ setRowAction, router }: GetColumnsProps): ColumnDef
const template = row.original;
const handleViewDetails = () => {
- // templateName이 "General GTC"인 경우 νŠΉλ³„ν•œ λΌμš°νŒ…
- if (template.templateName === "GTC") {
- router.push(`/evcp/basic-contract-template/gtc`);
- } else {
- // 일반적인 κ²½μš°λŠ” κΈ°μ‘΄κ³Ό 동일
router.push(`/evcp/basic-contract-template/${template.id}`);
- }
};
return (
@@ -221,12 +215,10 @@ export function getColumns({ setRowAction, router }: GetColumnsProps): ColumnDef
const template = row.original;
const handleClick = () => {
- if (template.templateName === "GTC") {
- router.push(`/evcp/basic-contract-template/gtc`);
- } else {
+
// 일반적인 κ²½μš°λŠ” κΈ°μ‘΄κ³Ό 동일
router.push(`/evcp/basic-contract-template/${template.id}`);
- }
+
};
return (
@@ -277,152 +269,152 @@ export function getColumns({ setRowAction, router }: GetColumnsProps): ColumnDef
];
// 적용 λ²”μœ„ κ·Έλ£Ή
- 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 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>[] = [
@@ -495,11 +487,11 @@ export function getColumns({ setRowAction, router }: GetColumnsProps): ColumnDef
header: "κΈ°λ³Έ 정보",
columns: basicInfoColumns,
},
- {
- id: "적용 λ²”μœ„",
- header: "적용 λ²”μœ„",
- columns: scopeColumns,
- },
+ // {
+ // id: "적용 λ²”μœ„",
+ // header: "적용 λ²”μœ„",
+ // columns: scopeColumns,
+ // },
{
id: "파일 정보",
header: "파일 정보",
diff --git a/lib/basic-contract/template/create-revision-dialog.tsx b/lib/basic-contract/template/create-revision-dialog.tsx
index 262df6ba..6ae03cc2 100644
--- a/lib/basic-contract/template/create-revision-dialog.tsx
+++ b/lib/basic-contract/template/create-revision-dialog.tsx
@@ -65,15 +65,6 @@ const createRevisionSchema = z.object({
revision: z.coerce.number().int().min(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: "νŒŒμΌμ„ μ—…λ‘œλ“œν•΄μ£Όμ„Έμš”." })
@@ -86,18 +77,6 @@ const createRevisionSchema = z.object({
file.type === 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
{ message: "μ›Œλ“œ 파일(.doc, .docx)만 μ—…λ‘œλ“œ κ°€λŠ₯ν•©λ‹ˆλ‹€." }
),
-}).refine((data) => {
- // 적어도 ν•˜λ‚˜μ˜ 적용 λ²”μœ„λŠ” μ„ νƒλ˜μ–΄μ•Ό 함
- const scopeFields = [
- 'shipBuildingApplicable', 'windApplicable', 'pcApplicable', 'nbApplicable',
- 'rcApplicable', 'gyApplicable', 'sysApplicable', 'infraApplicable'
- ];
-
- const hasAnyScope = scopeFields.some(field => data[field as keyof typeof data] === true);
- return hasAnyScope;
-}, {
- message: "적어도 ν•˜λ‚˜μ˜ 적용 λ²”μœ„λ₯Ό 선택해야 ν•©λ‹ˆλ‹€.",
- path: ["shipBuildingApplicable"],
});
type CreateRevisionFormValues = z.infer<typeof createRevisionSchema>;
diff --git a/lib/basic-contract/template/template-editor-wrapper.tsx b/lib/basic-contract/template/template-editor-wrapper.tsx
index 96e2330f..af5d42a8 100644
--- a/lib/basic-contract/template/template-editor-wrapper.tsx
+++ b/lib/basic-contract/template/template-editor-wrapper.tsx
@@ -6,6 +6,7 @@ import { toast } from "sonner";
import { Save, RefreshCw, Type, FileText, AlertCircle } from "lucide-react";
import type { WebViewerInstance } from "@pdftron/webviewer";
import { Badge } from "@/components/ui/badge";
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
import { BasicContractTemplateViewer } from "./basic-contract-template-viewer";
import { getExistingTemplateNamesById, saveTemplateFile } from "../service";
@@ -16,20 +17,57 @@ interface TemplateEditorWrapperProps {
refreshAction?: () => Promise<void>;
}
-// ν…œν”Œλ¦Ώ 이름별 λ³€μˆ˜ 맀핑 (영문 λ³€μˆ˜λͺ… μ‚¬μš©)
+const getVariablesForTemplate = (templateName: string): string[] => {
+ // μ •ν™•ν•œ 맀치 λ¨Όμ € 확인
+ if (TEMPLATE_VARIABLES_MAP[templateName as keyof typeof TEMPLATE_VARIABLES_MAP]) {
+ return [...TEMPLATE_VARIABLES_MAP[templateName as keyof typeof TEMPLATE_VARIABLES_MAP]];
+ }
+
+ // GTCκ°€ ν¬ν•¨λœ 경우 확인
+ if (templateName.includes("GTC")) {
+ return [...TEMPLATE_VARIABLES_MAP["GTC"]];
+ }
+
+ // λ‹€λ₯Έ ν‚€μ›Œλ“œλ“€λ„ 포함 κ΄€κ³„λ‘œ 확인
+ for (const [key, variables] of Object.entries(TEMPLATE_VARIABLES_MAP)) {
+ if (templateName.includes(key)) {
+ return [...variables];
+ }
+ }
+
+ // κΈ°λ³Έκ°’ λ°˜ν™˜
+ return ["company_name", "company_address", "representative_name", "signature_date"];
+};
+
+// ν…œν”Œλ¦Ώ 이름별 λ³€μˆ˜ 맀핑
const TEMPLATE_VARIABLES_MAP = {
- "μ€€λ²•μ„œμ•½ (ν•œκΈ€)": ["vendor_name", "address", "representative_name", "today_date"],
- "μ€€λ²•μ„œμ•½ (영문)": ["vendor_name", "address", "representative_name", "today_date"],
- "기술자료 μš”κ΅¬μ„œ": ["vendor_name", "address", "representative_name", "today_date"],
- "λΉ„λ°€μœ μ§€ κ³„μ•½μ„œ": ["vendor_name", "address", "representative_name", "today_date"],
- "ν‘œμ€€ν•˜λ„κΈ‰κΈ°λ³Έ κ³„μ•½μ„œ": ["vendor_name", "address", "representative_name", "today_date"],
- "GTC": ["vendor_name", "address", "representative_name", "today_date"],
- "μ•ˆμ „λ³΄κ±΄κ΄€λ¦¬ μ•½μ •μ„œ": ["vendor_name", "address", "representative_name", "today_date"],
- "λ™λ°˜μ„±μž₯": ["vendor_name", "address", "representative_name", "today_date"],
- "μœ€λ¦¬κ·œλ²” μ€€μˆ˜ μ„œμ•½μ„œ": ["vendor_name", "address", "representative_name", "today_date"],
- "기술자료 λ™μ˜μ„œ": ["vendor_name", "address", "representative_name", "today_date"],
- "λ‚΄κ΅­μ‹ μš©μž₯ λ―Έκ°œμ„€ ν•©μ˜μ„œ": ["vendor_name", "address", "representative_name", "today_date"],
- "μ§λ‚©μžμž¬ ν•˜λ„κΈ‰λŒ€κΈ‰λ“± μ—°λ™μ œ 의ν–₯μ„œ": ["vendor_name", "address", "representative_name", "today_date"]
+ "μ€€λ²•μ„œμ•½ (ν•œκΈ€)": ["company_name", "company_address", "representative_name", "signature_date"],
+ "μ€€λ²•μ„œμ•½ (영문)": ["company_name", "company_address", "representative_name", "signature_date"],
+ "기술자료 μš”κ΅¬μ„œ": ["company_name", "company_address", "representative_name", "signature_date", 'tax_id', 'phone_number'],
+ "λΉ„λ°€μœ μ§€ κ³„μ•½μ„œ": ["company_name", "company_address", "representative_name", "signature_date"],
+ "ν‘œμ€€ν•˜λ„κΈ‰κΈ°λ³Έ κ³„μ•½μ„œ": ["company_name", "company_address", "representative_name", "signature_date"],
+ "GTC": ["company_name", "company_address", "representative_name", "signature_date"],
+ "μ•ˆμ „λ³΄κ±΄κ΄€λ¦¬ μ•½μ •μ„œ": ["company_name", "company_address", "representative_name", "signature_date"],
+ "λ™λ°˜μ„±μž₯": ["company_name", "company_address", "representative_name", "signature_date"],
+ "μœ€λ¦¬κ·œλ²” μ€€μˆ˜ μ„œμ•½μ„œ": ["company_name", "company_address", "representative_name", "signature_date"],
+ "기술자료 λ™μ˜μ„œ": ["company_name", "company_address", "representative_name", "signature_date", 'tax_id', 'phone_number'],
+ "λ‚΄κ΅­μ‹ μš©μž₯ λ―Έκ°œμ„€ ν•©μ˜μ„œ": ["company_name", "company_address", "representative_name", "signature_date"],
+ "μ§λ‚©μžμž¬ ν•˜λ„κΈ‰λŒ€κΈ‰λ“± μ—°λ™μ œ 의ν–₯μ„œ": ["company_name", "company_address", "representative_name", "signature_date"]
+} as const;
+
+// λ³€μˆ˜λ³„ ν•œκΈ€ μ„€λͺ… 맀핑
+const VARIABLE_DESCRIPTION_MAP = {
+ "company_name": "ν˜‘λ ₯νšŒμ‚¬λͺ…",
+ "vendor_name": "ν˜‘λ ₯νšŒμ‚¬λͺ…",
+ "company_address": "νšŒμ‚¬μ£Όμ†Œ",
+ "address": "νšŒμ‚¬μ£Όμ†Œ",
+ "representative_name": "λŒ€ν‘œμžλͺ…",
+ "signature_date": "μ„œλͺ…λ‚ μ§œ",
+ "today_date": "μ˜€λŠ˜λ‚ μ§œ",
+ "tax_id": "μ‚¬μ—…μžλ“±λ‘λ²ˆν˜Έ",
+ "phone_number": "μ „ν™”λ²ˆν˜Έ",
+ "phone": "μ „ν™”λ²ˆν˜Έ",
+ "email": "이메일"
} as const;
// λ³€μˆ˜ νŒ¨ν„΄ 감지λ₯Ό μœ„ν•œ μ •κ·œμ‹
@@ -49,8 +87,6 @@ export function TemplateEditorWrapper({
const [templateName, setTemplateName] = React.useState<string>("");
const [predefinedVariables, setPredefinedVariables] = React.useState<string[]>([]);
- console.log(templateId, "templateId");
-
// ν…œν”Œλ¦Ώ 이름 λ‘œλ“œ 및 λ³€μˆ˜ μ„€μ •
React.useEffect(() => {
const loadTemplateInfo = async () => {
@@ -59,15 +95,15 @@ export function TemplateEditorWrapper({
setTemplateName(name);
// ν…œν”Œλ¦Ώ 이름에 λ”°λ₯Έ λ³€μˆ˜ μ„€μ •
- const variables = TEMPLATE_VARIABLES_MAP[name as keyof typeof TEMPLATE_VARIABLES_MAP] || [];
- setPredefinedVariables(variables);
+ const variables = getVariablesForTemplate(name);
+ setPredefinedVariables([...variables]);
console.log("🏷️ ν…œν”Œλ¦Ώ 이름:", name);
console.log("πŸ“ ν• λ‹Ήλœ λ³€μˆ˜λ“€:", variables);
} catch (error) {
console.error("ν…œν”Œλ¦Ώ 정보 λ‘œλ“œ 였λ₯˜:", error);
// κΈ°λ³Έ λ³€μˆ˜ μ„€μ •
- setPredefinedVariables(["νšŒμ‚¬λͺ…", "μ£Όμ†Œ", "λŒ€ν‘œμžλͺ…", "μ˜€λŠ˜λ‚ μ§œ"]);
+ setPredefinedVariables(["company_name", "company_address", "representative_name", "signature_date"]);
}
};
@@ -358,19 +394,27 @@ export function TemplateEditorWrapper({
<p className="text-xs text-muted-foreground mb-2">
{templateName ? `${templateName}에 ꢌμž₯λ˜λŠ” λ³€μˆ˜` : "자주 μ‚¬μš©ν•˜λŠ” λ³€μˆ˜"} (ν΄λ¦­ν•˜μ—¬ 볡사):
</p>
- <div className="flex flex-wrap gap-1">
- {predefinedVariables.map((variable, index) => (
- <Button
- key={index}
- variant="ghost"
- size="sm"
- className="h-6 px-2 text-xs hover:bg-blue-50"
- onClick={() => insertVariable(variable)}
- >
- {`{{${variable}}}`}
- </Button>
- ))}
- </div>
+ <TooltipProvider>
+ <div className="flex flex-wrap gap-1">
+ {predefinedVariables.map((variable, index) => (
+ <Tooltip key={index}>
+ <TooltipTrigger asChild>
+ <Button
+ variant="ghost"
+ size="sm"
+ className="h-6 px-2 text-xs hover:bg-blue-50"
+ onClick={() => insertVariable(variable)}
+ >
+ {`{{${variable}}}`}
+ </Button>
+ </TooltipTrigger>
+ <TooltipContent>
+ <p>{VARIABLE_DESCRIPTION_MAP[variable as keyof typeof VARIABLE_DESCRIPTION_MAP] || variable}</p>
+ </TooltipContent>
+ </Tooltip>
+ ))}
+ </div>
+ </TooltipProvider>
</div>
)}
</div>
diff --git a/lib/basic-contract/template/update-basicContract-sheet.tsx b/lib/basic-contract/template/update-basicContract-sheet.tsx
index 07bac31b..0236fda5 100644
--- a/lib/basic-contract/template/update-basicContract-sheet.tsx
+++ b/lib/basic-contract/template/update-basicContract-sheet.tsx
@@ -8,7 +8,6 @@ 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,
@@ -20,14 +19,6 @@ import {
FormDescription,
} from "@/components/ui/form"
import {
- Select,
- SelectContent,
- SelectGroup,
- SelectItem,
- SelectTrigger,
- SelectValue,
-} from "@/components/ui/select"
-import {
Sheet,
SheetClose,
SheetContent,
@@ -45,45 +36,14 @@ import {
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"
-
-// ν…œν”Œλ¦Ώ 이름 μ˜΅μ…˜ μ •μ˜
-const TEMPLATE_NAME_OPTIONS = [
- "μ€€λ²•μ„œμ•½ (ν•œκΈ€)",
- "μ€€λ²•μ„œμ•½ (영문)",
- "기술자료 μš”κ΅¬μ„œ",
- "λΉ„λ°€μœ μ§€ κ³„μ•½μ„œ",
- "ν‘œμ€€ν•˜λ„κΈ‰κΈ°λ³Έ κ³„μ•½μ„œ",
- "GTC",
- "μ•ˆμ „λ³΄κ±΄κ΄€λ¦¬ μ•½μ •μ„œ",
- "λ™λ°˜μ„±μž₯",
- "μœ€λ¦¬κ·œλ²” μ€€μˆ˜ μ„œμ•½μ„œ",
- "기술자료 λ™μ˜μ„œ",
- "λ‚΄κ΅­μ‹ μš©μž₯ λ―Έκ°œμ„€ ν•©μ˜μ„œ",
- "μ§λ‚©μžμž¬ ν•˜λ„κΈ‰λŒ€κΈ‰λ“± μ—°λ™μ œ 의ν–₯μ„œ"
-] as const;
+import { scopeHelpers } from "@/config/basicContractColumnsConfig"
-// μ—…λ°μ΄νŠΈ ν…œν”Œλ¦Ώ μŠ€ν‚€λ§ˆ μ •μ˜ (리비전 ν•„λ“œ 제거, μ›Œλ“œνŒŒμΌλ§Œ ν—ˆμš©)
+// μ—…λ°μ΄νŠΈ ν…œν”Œλ¦Ώ μŠ€ν‚€λ§ˆ μ •μ˜ (파일 μ—…λ°μ΄νŠΈ 쀑심)
export const updateTemplateSchema = z.object({
- templateName: z.enum(TEMPLATE_NAME_OPTIONS, {
- required_error: "ν…œν”Œλ¦Ώ 이름을 μ„ νƒν•΄μ£Όμ„Έμš”.",
- }),
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(),
-
file: z
.instanceof(File, { message: "νŒŒμΌμ„ μ—…λ‘œλ“œν•΄μ£Όμ„Έμš”." })
.refine((file) => file.size <= 100 * 1024 * 1024, {
@@ -96,15 +56,6 @@ export const updateTemplateSchema = z.object({
{ message: "μ›Œλ“œ 파일(.doc, .docx)만 μ—…λ‘œλ“œ κ°€λŠ₯ν•©λ‹ˆλ‹€." }
)
.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>
@@ -122,16 +73,7 @@ export function UpdateTemplateSheet({ template, onSuccess, ...props }: UpdateTem
const form = useForm<UpdateTemplateSchema>({
resolver: zodResolver(updateTemplateSchema),
defaultValues: {
- templateName: template?.templateName as typeof TEMPLATE_NAME_OPTIONS[number] ?? "μ€€λ²•μ„œμ•½ (ν•œκΈ€)",
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,
},
mode: "onChange"
})
@@ -145,52 +87,23 @@ export function UpdateTemplateSheet({ template, onSuccess, ...props }: UpdateTem
}
};
- // λͺ¨λ“  적용 λ²”μœ„ 선택/ν•΄μ œ
- const handleSelectAllScopes = (checked: boolean | "indeterminate") => {
- const value = checked === true;
- BUSINESS_UNITS.forEach(unit => {
- form.setValue(unit.key as keyof UpdateTemplateSchema, value);
- });
- };
-
// ν…œν”Œλ¦Ώ λ³€κ²½ μ‹œ 폼 κ°’ μ—…λ°μ΄νŠΈ
React.useEffect(() => {
if (template) {
form.reset({
- templateName: template.templateName as typeof TEMPLATE_NAME_OPTIONS[number],
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,
});
}
}, [template, form]);
- // ν˜„μž¬ μ„ νƒλœ 적용 λ²”μœ„ 수
- const selectedScopesCount = BUSINESS_UNITS.filter(unit =>
- form.watch(unit.key as keyof UpdateTemplateSchema)
- ).length;
-
function onSubmit(input: UpdateTemplateSchema) {
startUpdateTransition(async () => {
if (!template) return
// FormData 객체 μƒμ„±ν•˜μ—¬ 파일과 데이터λ₯Ό ν•¨κ»˜ 전솑
const formData = new FormData();
- formData.append("templateName", input.templateName);
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());
- });
-
if (input.file) {
formData.append("file", input.file);
}
@@ -221,24 +134,14 @@ export function UpdateTemplateSheet({ template, onSuccess, ...props }: UpdateTem
if (!template) return null;
- const scopeSelected = BUSINESS_UNITS.some(
- (unit) => form.watch(unit.key as keyof UpdateTemplateSchema)
- );
-
- const isDisabled =
- isUpdatePending ||
- !form.watch("templateName") ||
- !scopeSelected;
-
return (
<Sheet {...props}>
- <SheetContent className="sm:max-w-[600px] h-[100vh] flex flex-col p-0">
+ <SheetContent className="sm:max-w-[500px] h-[100vh] flex flex-col p-0">
{/* κ³ μ •λœ 헀더 */}
<SheetHeader className="p-6 pb-4 border-b">
<SheetTitle>ν…œν”Œλ¦Ώ μ—…λ°μ΄νŠΈ</SheetTitle>
<SheetDescription>
- ν…œν”Œλ¦Ώ 정보λ₯Ό μˆ˜μ •ν•˜κ³  변경사항을 μ €μž₯ν•˜μ„Έμš”
- <span className="text-red-500 mt-1 block text-sm">* ν‘œμ‹œλœ ν•­λͺ©μ€ ν•„μˆ˜ μž…λ ₯μ‚¬ν•­μž…λ‹ˆλ‹€.</span>
+ ν…œν”Œλ¦Ώ νŒŒμΌμ„ μ—…λ°μ΄νŠΈν•˜κ³  섀정을 λ³€κ²½ν•˜μ„Έμš”
</SheetDescription>
</SheetHeader>
@@ -249,51 +152,49 @@ export function UpdateTemplateSheet({ template, onSuccess, ...props }: UpdateTem
onSubmit={form.handleSubmit(onSubmit)}
className="space-y-6 py-4"
>
- {/* κΈ°λ³Έ 정보 */}
+ {/* ν…œν”Œλ¦Ώ 정보 ν‘œμ‹œ */}
<Card>
<CardHeader>
- <CardTitle className="text-lg">κΈ°λ³Έ 정보</CardTitle>
+ <CardTitle className="text-lg">ν…œν”Œλ¦Ώ 정보</CardTitle>
<CardDescription>
- ν˜„μž¬ 리비전: <Badge variant="outline">v{template.revision}</Badge>
- <br />
- ν˜„μž¬ 적용 λ²”μœ„: {scopeHelpers.getScopeDisplayText(template)}
+ ν˜„μž¬ ν…œν”Œλ¦Ώμ˜ κΈ°λ³Έ μ •λ³΄μž…λ‹ˆλ‹€
</CardDescription>
</CardHeader>
<CardContent className="space-y-4">
<div className="grid grid-cols-1 gap-4">
- <FormField
- control={form.control}
- name="templateName"
- render={({ field }) => (
- <FormItem>
- <FormLabel>
- ν…œν”Œλ¦Ώ 이름 <span className="text-red-500">*</span>
- </FormLabel>
- <Select onValueChange={field.onChange} defaultValue={field.value}>
- <FormControl>
- <SelectTrigger>
- <SelectValue placeholder="ν…œν”Œλ¦Ώ 이름을 μ„ νƒν•˜μ„Έμš”" />
- </SelectTrigger>
- </FormControl>
- <SelectContent>
- <SelectGroup>
- {TEMPLATE_NAME_OPTIONS.map((option) => (
- <SelectItem key={option} value={option}>
- {option}
- </SelectItem>
- ))}
- </SelectGroup>
- </SelectContent>
- </Select>
- <FormDescription>
- 미리 μ •μ˜λœ ν…œν”Œλ¦Ώ μ€‘μ—μ„œ 선택
- </FormDescription>
- <FormMessage />
- </FormItem>
- )}
- />
+ <div className="space-y-2">
+ <label className="text-sm font-medium">ν…œν”Œλ¦Ώ 이름</label>
+ <div className="px-3 py-2 border rounded-md bg-gray-50">
+ {template.templateName}
+ </div>
+ </div>
+
+ <div className="space-y-2">
+ <label className="text-sm font-medium">ν˜„μž¬ 리비전</label>
+ <div className="px-3 py-2 border rounded-md bg-gray-50">
+ <Badge variant="outline">v{template.revision}</Badge>
+ </div>
+ </div>
+
+ <div className="space-y-2">
+ <label className="text-sm font-medium">ν˜„μž¬ 파일</label>
+ <div className="px-3 py-2 border rounded-md bg-gray-50">
+ {template.fileName}
+ </div>
+ </div>
</div>
+ </CardContent>
+ </Card>
+ {/* μ„€μ • */}
+ <Card>
+ <CardHeader>
+ <CardTitle className="text-lg">μ„€μ •</CardTitle>
+ <CardDescription>
+ ν…œν”Œλ¦Ώ κ΄€λ ¨ 섀정을 λ³€κ²½ν•  수 μžˆμŠ΅λ‹ˆλ‹€
+ </CardDescription>
+ </CardHeader>
+ <CardContent>
<FormField
control={form.control}
name="legalReviewRequired"
@@ -317,69 +218,12 @@ export function UpdateTemplateSheet({ template, onSuccess, ...props }: UpdateTem
</CardContent>
</Card>
- {/* 적용 λ²”μœ„ */}
- <Card>
- <CardHeader>
- <CardTitle className="text-lg">
- 적용 λ²”μœ„ <span className="text-red-500">*</span>
- </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>
-
{/* 파일 μ—…λ°μ΄νŠΈ */}
<Card>
<CardHeader>
<CardTitle className="text-lg">파일 μ—…λ°μ΄νŠΈ</CardTitle>
<CardDescription>
- ν˜„μž¬ 파일: {template.fileName}
+ μƒˆλ‘œμš΄ ν…œν”Œλ¦Ώ νŒŒμΌμ„ μ—…λ‘œλ“œν•˜μ„Έμš”
</CardDescription>
</CardHeader>
<CardContent>
@@ -388,7 +232,7 @@ export function UpdateTemplateSheet({ template, onSuccess, ...props }: UpdateTem
name="file"
render={() => (
<FormItem>
- <FormLabel>ν…œν”Œλ¦Ώ 파일 (선택사항)</FormLabel>
+ <FormLabel>μƒˆ ν…œν”Œλ¦Ώ 파일 (선택사항)</FormLabel>
<FormControl>
<Dropzone
onDrop={handleFileChange}
@@ -402,7 +246,7 @@ export function UpdateTemplateSheet({ template, onSuccess, ...props }: UpdateTem
<DropzoneTitle>
{selectedFile
? selectedFile.name
- : "μƒˆ μ›Œλ“œ νŒŒμΌμ„ λ“œλž˜κ·Έν•˜μ„Έμš” (선택사항)"}
+ : "μƒˆ μ›Œλ“œ νŒŒμΌμ„ λ“œλž˜κ·Έν•˜μ„Έμš”"}
</DropzoneTitle>
<DropzoneDescription>
{selectedFile
@@ -413,6 +257,9 @@ export function UpdateTemplateSheet({ template, onSuccess, ...props }: UpdateTem
</DropzoneZone>
</Dropzone>
</FormControl>
+ <FormDescription>
+ νŒŒμΌμ„ μ—…λ‘œλ“œν•˜μ§€ μ•ŠμœΌλ©΄ κΈ°μ‘΄ 파일이 μœ μ§€λ©λ‹ˆλ‹€
+ </FormDescription>
<FormMessage />
</FormItem>
)}
@@ -433,12 +280,12 @@ export function UpdateTemplateSheet({ template, onSuccess, ...props }: UpdateTem
<Button
type="button"
onClick={form.handleSubmit(onSubmit)}
- disabled={isDisabled}
+ disabled={isUpdatePending}
>
{isUpdatePending && (
<Loader className="mr-2 size-4 animate-spin" aria-hidden="true" />
)}
- μ €μž₯
+ μ—…λ°μ΄νŠΈ
</Button>
</SheetFooter>
</SheetContent>
diff --git a/lib/basic-contract/validations.ts b/lib/basic-contract/validations.ts
index e8b28e73..bb9e3b8d 100644
--- a/lib/basic-contract/validations.ts
+++ b/lib/basic-contract/validations.ts
@@ -65,16 +65,7 @@ export const BUSINESS_UNIT_KEYS = [
export const createBasicContractTemplateSchema = z.object({
templateName: z.string().min(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),
-
+
status: z.enum(["ACTIVE", "DISPOSED"]).default("ACTIVE"),
fileName: z.string().nullable().optional(),
filePath: z.string().nullable().optional(),
@@ -82,12 +73,6 @@ export const createBasicContractTemplateSchema = z.object({
// 기쑴에 μ“°μ‹œλ˜ validityPeriod λ₯Ό 계속 μ“°μ‹€ 거라면 남기고, μ•„λ‹ˆλΌλ©΄ μ§€μš°μ„Έμš”.
// 예: λ¬Έμžμ—΄(YYYY-MM-DD ~ YYYY-MM-DD) λ˜λŠ” number(κ°œμ›” 수) λ“± ꡬ체화 ν•„μš”
validityPeriod: z.string().optional(),
-}).refine((data) => {
- // μ΅œμ†Œ 1개 이상 사업뢀 선택
- return BUSINESS_UNIT_KEYS.some((k) => data[k] === true);
-}, {
- message: "적어도 ν•˜λ‚˜μ˜ 적용 λ²”μœ„λ₯Ό 선택해야 ν•©λ‹ˆλ‹€.",
- path: ["shipBuildingApplicable"], // 첫 μ²΄ν¬λ°•μŠ€μ— μ—λŸ¬ ν‘œμ‹œ μœ λ„
});
export type CreateBasicContractTemplateSchema = z.infer<typeof createBasicContractTemplateSchema>;
diff --git a/lib/basic-contract/vendor-table/basic-contract-columns.tsx b/lib/basic-contract/vendor-table/basic-contract-columns.tsx
index c9e8da53..1b11285c 100644
--- a/lib/basic-contract/vendor-table/basic-contract-columns.tsx
+++ b/lib/basic-contract/vendor-table/basic-contract-columns.tsx
@@ -32,14 +32,65 @@ import { BasicContractView } from "@/db/schema"
interface GetColumnsProps {
setRowAction: React.Dispatch<React.SetStateAction<DataTableRowAction<BasicContractView> | null>>
+ locale?: string
+ t: (key: string) => string // λ²ˆμ—­ ν•¨μˆ˜
}
+// κΈ°λ³Έ λ²ˆμ—­κ°’λ“€ (fallback)
+const fallbackTranslations = {
+ ko: {
+ download: "λ‹€μš΄λ‘œλ“œ",
+ selectAll: "전체 선택",
+ selectRow: "ν–‰ 선택",
+ fileInfoMissing: "파일 정보가 μ—†μŠ΅λ‹ˆλ‹€.",
+ fileDownloadError: "파일 λ‹€μš΄λ‘œλ“œ 쀑 였λ₯˜κ°€ λ°œμƒν–ˆμŠ΅λ‹ˆλ‹€.",
+ statusValues: {
+ PENDING: "μ„œλͺ…λŒ€κΈ°",
+ COMPLETED: "μ„œλͺ…μ™„λ£Œ"
+ }
+ },
+ en: {
+ download: "Download",
+ selectAll: "Select all",
+ selectRow: "Select row",
+ fileInfoMissing: "File information is missing.",
+ fileDownloadError: "An error occurred while downloading the file.",
+ statusValues: {
+ PENDING: "Pending",
+ COMPLETED: "Completed"
+ }
+ }
+};
+
+// μ•ˆμ „ν•œ λ²ˆμ—­ ν•¨μˆ˜
+const safeTranslate = (t: (key: string) => string, key: string, locale: string = 'ko', fallback?: string): string => {
+ try {
+ const translated = t(key);
+ // λ²ˆμ—­ ν‚€κ°€ κ·ΈλŒ€λ‘œ λ°˜ν™˜λ˜λŠ” 경우 (λ²ˆμ—­ μ‹€νŒ¨) fallback μ‚¬μš©
+ if (translated === key && fallback) {
+ return fallback;
+ }
+ return translated || fallback || key;
+ } catch (error) {
+ console.warn(`Translation failed for key: ${key}`, error);
+ return fallback || key;
+ }
+};
+
/**
* 파일 λ‹€μš΄λ‘œλ“œ ν•¨μˆ˜
*/
-const handleFileDownload = async (filePath: string | null, fileName: string | null) => {
+const handleFileDownload = async (
+ filePath: string | null,
+ fileName: string | null,
+ t: (key: string) => string,
+ locale: string = 'ko'
+) => {
+ const fallback = fallbackTranslations[locale as keyof typeof fallbackTranslations] || fallbackTranslations.ko;
+
if (!filePath || !fileName) {
- toast.error("파일 정보가 μ—†μŠ΅λ‹ˆλ‹€.");
+ const message = safeTranslate(t, "basicContracts.fileInfoMissing", locale, fallback.fileInfoMissing);
+ toast.error(message);
return;
}
@@ -57,14 +108,17 @@ const handleFileDownload = async (filePath: string | null, fileName: string | nu
}
} catch (error) {
console.error("파일 λ‹€μš΄λ‘œλ“œ 였λ₯˜:", error);
- toast.error("파일 λ‹€μš΄λ‘œλ“œ 쀑 였λ₯˜κ°€ λ°œμƒν–ˆμŠ΅λ‹ˆλ‹€.");
+ const message = safeTranslate(t, "basicContracts.fileDownloadError", locale, fallback.fileDownloadError);
+ toast.error(message);
}
};
/**
* tanstack table 컬럼 μ •μ˜ (쀑첩 헀더 버전)
*/
-export function getColumns({ setRowAction }: GetColumnsProps): ColumnDef<BasicContractView>[] {
+export function getColumns({ setRowAction, locale = 'ko', t }: GetColumnsProps): ColumnDef<BasicContractView>[] {
+ const fallback = fallbackTranslations[locale as keyof typeof fallbackTranslations] || fallbackTranslations.ko;
+
// ----------------------------------------------------------------
// 1) select 컬럼 (μ²΄ν¬λ°•μŠ€)
// ----------------------------------------------------------------
@@ -77,7 +131,7 @@ export function getColumns({ setRowAction }: GetColumnsProps): ColumnDef<BasicCo
(table.getIsSomePageRowsSelected() && "indeterminate")
}
onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}
- aria-label="Select all"
+ aria-label={safeTranslate(t, "basicContracts.selectAll", locale, fallback.selectAll)}
className="translate-y-0.5"
/>
),
@@ -85,7 +139,7 @@ export function getColumns({ setRowAction }: GetColumnsProps): ColumnDef<BasicCo
<Checkbox
checked={row.getIsSelected()}
onCheckedChange={(value) => row.toggleSelected(!!value)}
- aria-label="Select row"
+ aria-label={safeTranslate(t, "basicContracts.selectRow", locale, fallback.selectRow)}
className="translate-y-0.5"
/>
),
@@ -105,18 +159,19 @@ export function getColumns({ setRowAction }: GetColumnsProps): ColumnDef<BasicCo
// PENDING μƒνƒœμΌ λ•ŒλŠ” 원본 PDF 파일 (signedFilePath), COMPLETED일 λ•ŒλŠ” μ„œλͺ…λœ 파일 (signedFilePath)
const filePath = contract.signedFilePath;
const fileName = contract.signedFileName;
+ const downloadText = safeTranslate(t, "basicContracts.download", locale, fallback.download);
return (
<Button
variant="ghost"
size="icon"
- onClick={() => handleFileDownload(filePath, fileName)}
- title={`${fileName} λ‹€μš΄λ‘œλ“œ`}
+ onClick={() => handleFileDownload(filePath, fileName, t, locale)}
+ title={`${fileName} ${downloadText}`}
className="hover:bg-muted"
disabled={!filePath || !fileName}
>
<Paperclip className="h-4 w-4" />
- <span className="sr-only">λ‹€μš΄λ‘œλ“œ</span>
+ <span className="sr-only">{downloadText}</span>
</Button>
);
},
@@ -124,7 +179,6 @@ export function getColumns({ setRowAction }: GetColumnsProps): ColumnDef<BasicCo
enableSorting: false,
}
-
// ----------------------------------------------------------------
// 4) 일반 μ»¬λŸΌλ“€μ„ "κ·Έλ£Ή"λ³„λ‘œ λ¬Άμ–΄ 쀑첩 columns 생성
// ----------------------------------------------------------------
@@ -152,22 +206,28 @@ export function getColumns({ setRowAction }: GetColumnsProps): ColumnDef<BasicCo
type: cfg.type,
},
cell: ({ row, cell }) => {
- // λ‚ μ§œ ν˜•μ‹ 처리
+ // λ‚ μ§œ ν˜•μ‹ 처리 - λ‘œμΌ€μΌ 적용
if (cfg.id === "createdAt" || cfg.id === "updatedAt" || cfg.id === "completedAt") {
const dateVal = cell.getValue() as Date
- return formatDateTime(dateVal)
+ return formatDateTime(dateVal, locale)
}
- // Status μ»¬λŸΌμ— Badge 적용
+ // Status μ»¬λŸΌμ— Badge 적용 - λ‹€κ΅­μ–΄ 적용
if (cfg.id === "status") {
const status = row.getValue(cfg.id) as string
const isPending = status === "PENDING"
+ const statusText = safeTranslate(
+ t,
+ `basicContracts.statusValues.${status}`,
+ locale,
+ fallback.statusValues[status as keyof typeof fallback.statusValues] || status
+ );
return (
<Badge
variant={!isPending ? "default" : "secondary"}
>
- {status}
+ {statusText}
</Badge>
)
}
@@ -175,8 +235,7 @@ export function getColumns({ setRowAction }: GetColumnsProps): ColumnDef<BasicCo
// λ‚˜λ¨Έμ§€ μ»¬λŸΌμ€ κ·ΈλŒ€λ‘œ κ°’ ν‘œμ‹œ
return row.getValue(cfg.id) ?? ""
},
- minSize: 80,
-
+ minSize: 80,
}
groupMap[groupName].push(childCol)
@@ -194,10 +253,11 @@ export function getColumns({ setRowAction }: GetColumnsProps): ColumnDef<BasicCo
// κ·Έλ£Ή μ—†μŒ β†’ κ·Έλƒ₯ μ΅œμƒμœ„ 레벨 컬럼
nestedColumns.push(...colDefs)
} else {
- // μƒμœ„ 컬럼
+ // μƒμœ„ 컬럼 - κ·Έλ£Ήλͺ… λ‹€κ΅­μ–΄ 적용
+ const translatedGroupName = t(`basicContracts.groups.${groupName}`) || groupName;
nestedColumns.push({
id: groupName,
- header: groupName, // "Basic Info", "Metadata" λ“±
+ header: translatedGroupName,
columns: colDefs,
})
}
diff --git a/lib/basic-contract/vendor-table/basic-contract-sign-dialog.tsx b/lib/basic-contract/vendor-table/basic-contract-sign-dialog.tsx
index 7bffdac9..7d828a7e 100644
--- a/lib/basic-contract/vendor-table/basic-contract-sign-dialog.tsx
+++ b/lib/basic-contract/vendor-table/basic-contract-sign-dialog.tsx
@@ -7,7 +7,6 @@ import { ScrollArea } from "@/components/ui/scroll-area";
import { formatDate } from "@/lib/utils";
import { toast } from "sonner";
import { cn } from "@/lib/utils";
-import { BasicContractSignViewer } from "@/lib/basic-contract/viewer/basic-contract-sign-viewer";
import type { WebViewerInstance } from "@pdftron/webviewer";
import type { BasicContractView } from "@/db/schema";
import {
@@ -19,45 +18,82 @@ import {
FileText,
User,
AlertCircle,
- Calendar
+ Calendar,
+ Loader2
} from "lucide-react";
-import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
import { Input } from "@/components/ui/input";
import { Badge } from "@/components/ui/badge";
import { Separator } from "@/components/ui/separator";
import { useRouter } from "next/navigation"
+import { BasicContractSignViewer } from "../viewer/basic-contract-sign-viewer";
+import { getVendorAttachments } from "../service";
-// μˆ˜μ •λœ props μΈν„°νŽ˜μ΄μŠ€
interface BasicContractSignDialogProps {
contracts: BasicContractView[];
onSuccess?: () => void;
+ hasSelectedRows?: boolean;
+ t: (key: string) => string;
}
-export function BasicContractSignDialog({ contracts, onSuccess }: BasicContractSignDialogProps) {
+export function BasicContractSignDialog({
+ contracts,
+ onSuccess,
+ hasSelectedRows = false,
+ t
+}: BasicContractSignDialogProps) {
const [open, setOpen] = React.useState(false);
const [selectedContract, setSelectedContract] = React.useState<BasicContractView | null>(null);
const [instance, setInstance] = React.useState<null | WebViewerInstance>(null);
const [searchTerm, setSearchTerm] = React.useState("");
const [isSubmitting, setIsSubmitting] = React.useState(false);
+
+ // μΆ”κ°€λœ stateλ“€
+ const [additionalFiles, setAdditionalFiles] = React.useState<any[]>([]);
+ const [isLoadingAttachments, setIsLoadingAttachments] = React.useState(false);
+
const router = useRouter()
+ console.log(selectedContract,"selectedContract")
+ console.log(additionalFiles,"additionalFiles")
+
+ // λ²„νŠΌ λΉ„ν™œμ„±ν™” 쑰건
+ const isButtonDisabled = !hasSelectedRows || contracts.length === 0;
+
+ // λΉ„ν™œμ„±ν™” 이유 ν…μŠ€νŠΈ
+ const getDisabledReason = () => {
+ if (!hasSelectedRows) {
+ return t("basicContracts.toolbar.selectRows");
+ }
+ if (contracts.length === 0) {
+ return t("basicContracts.toolbar.noPendingContracts");
+ }
+ return "";
+ };
+
// λ‹€μ΄μ–Όλ‘œκ·Έ μ—΄κΈ°/λ‹«κΈ° ν•Έλ“€λŸ¬
const handleOpenChange = (isOpen: boolean) => {
setOpen(isOpen);
- // λ‹€μ΄μ–Όλ‘œκ·Έκ°€ 열릴 λ•Œ 첫 번째 κ³„μ•½μ„œ μžλ™ 선택
- if (isOpen && contracts.length > 0 && !selectedContract) {
- setSelectedContract(contracts[0]);
- }
-
if (!isOpen) {
+ // λ‹€μ΄μ–Όλ‘œκ·Έ 닫을 λ•Œ μƒνƒœ μ΄ˆκΈ°ν™”
setSelectedContract(null);
setSearchTerm("");
+ setAdditionalFiles([]); // μΆ”κ°€ 파일 μƒνƒœ μ΄ˆκΈ°ν™”
+ // WebViewer μΈμŠ€ν„΄μŠ€ 정리
+ if (instance) {
+ try {
+ instance.UI.dispose();
+ } catch (error) {
+ console.log("WebViewer dispose error:", error);
+ }
+ setInstance(null);
+ }
}
};
// κ³„μ•½μ„œ 선택 ν•Έλ“€λŸ¬
const handleSelectContract = (contract: BasicContractView) => {
+ console.log("κ³„μ•½μ„œ 선택:", contract.id, contract.templateName);
setSelectedContract(contract);
};
@@ -79,6 +115,40 @@ export function BasicContractSignDialog({ contracts, onSuccess }: BasicContractS
}
}, [open, contracts, selectedContract]);
+ // μΆ”κ°€ 파일 κ°€μ Έμ˜€κΈ° useEffect
+ React.useEffect(() => {
+ const fetchAdditionalFiles = async () => {
+ if (!selectedContract) {
+ setAdditionalFiles([]);
+ return;
+ }
+
+ // "λΉ„λ°€μœ μ§€ κ³„μ•½μ„œ"인 κ²½μš°μ—λ§Œ μΆ”κ°€ 파일 κ°€μ Έμ˜€κΈ°
+ if (selectedContract.templateName === "λΉ„λ°€μœ μ§€ κ³„μ•½μ„œ") {
+ setIsLoadingAttachments(true);
+ try {
+ const result = await getVendorAttachments(selectedContract.vendorId);
+ if (result.success) {
+ setAdditionalFiles(result.data);
+ console.log("μΆ”κ°€ 파일 λ‘œλ“œλ¨:", result.data);
+ } else {
+ console.error("Failed to fetch attachments:", result.error);
+ setAdditionalFiles([]);
+ }
+ } catch (error) {
+ console.error("Error fetching attachments:", error);
+ setAdditionalFiles([]);
+ } finally {
+ setIsLoadingAttachments(false);
+ }
+ } else {
+ setAdditionalFiles([]);
+ }
+ };
+
+ fetchAdditionalFiles();
+ }, [selectedContract]);
+
// μ„œλͺ… μ™„λ£Œ ν•Έλ“€λŸ¬
const completeSign = async () => {
if (!instance || !selectedContract) return;
@@ -89,29 +159,57 @@ export function BasicContractSignDialog({ contracts, onSuccess }: BasicContractS
const doc = documentViewer.getDocument();
const xfdfString = await annotationManager.exportAnnotations();
+ // 폼 ν•„λ“œ 데이터 μˆ˜μ§‘
+ const fieldManager = annotationManager.getFieldManager();
+ const fields = fieldManager.getFields();
+ const formData: any = {};
+ fields.forEach((field: any) => {
+ formData[field.name] = field.value;
+ });
+
const data = await doc.getFileData({
xfdfString,
downloadType: "pdf",
});
// FormData 생성 및 파일 μΆ”κ°€
- const formData = new FormData();
- formData.append('file', new Blob([data], { type: 'application/pdf' }));
- formData.append('tableRowId', selectedContract.id.toString());
- formData.append('templateName', selectedContract.signedFileName || '');
+ const submitFormData = new FormData();
+ submitFormData.append('file', new Blob([data], { type: 'application/pdf' }));
+ submitFormData.append('tableRowId', selectedContract.id.toString());
+ submitFormData.append('templateName', selectedContract.signedFileName || '');
+
+ // 폼 ν•„λ“œ 데이터 μΆ”κ°€
+ if (Object.keys(formData).length > 0) {
+ submitFormData.append('formData', JSON.stringify(formData));
+ }
+
+ // 쀀법 ν…œν”Œλ¦ΏμΈ 경우 ν•„μˆ˜ ν•„λ“œ 검증
+ if (selectedContract.templateName?.includes('쀀법')) {
+ const requiredFields = ['compliance_agreement', 'legal_review', 'risk_assessment'];
+ const missingFields = requiredFields.filter(field => !formData[field]);
+
+ if (missingFields.length > 0) {
+ toast.error("ν•„μˆ˜ 쀀법 ν•­λͺ©μ΄ λˆ„λ½λ˜μ—ˆμŠ΅λ‹ˆλ‹€.", {
+ description: `λ‹€μŒ ν•­λͺ©μ„ μ™„λ£Œν•΄μ£Όμ„Έμš”: ${missingFields.join(', ')}`,
+ icon: <AlertCircle className="h-5 w-5 text-red-500" />
+ });
+ setIsSubmitting(false);
+ return;
+ }
+ }
// API 호좜
const response = await fetch('/api/upload/signed-contract', {
method: 'POST',
- body: formData,
+ body: submitFormData,
next: { tags: ["basicContractView-vendor"] },
});
const result = await response.json();
if (result.result) {
- toast.success("μ„œλͺ…이 μ„±κ³΅μ μœΌλ‘œ μ™„λ£Œλ˜μ—ˆμŠ΅λ‹ˆλ‹€.", {
- description: "λ¬Έμ„œκ°€ μ„±κ³΅μ μœΌλ‘œ μ²˜λ¦¬λ˜μ—ˆμŠ΅λ‹ˆλ‹€.",
+ toast.success(t("basicContracts.messages.signSuccess"), {
+ description: t("basicContracts.messages.documentProcessed"),
icon: <CheckCircle2 className="h-5 w-5 text-green-500" />
});
router.refresh();
@@ -120,22 +218,19 @@ export function BasicContractSignDialog({ contracts, onSuccess }: BasicContractS
onSuccess();
}
} else {
- toast.error("μ„œλͺ… 처리 쀑 였λ₯˜κ°€ λ°œμƒν–ˆμŠ΅λ‹ˆλ‹€.", {
+ toast.error(t("basicContracts.messages.signError"), {
description: result.error,
icon: <AlertCircle className="h-5 w-5 text-red-500" />
});
}
} catch (error) {
console.error("μ„œλͺ… μ™„λ£Œ 쀑 였λ₯˜:", error);
- toast.error("μ„œλͺ… 처리 쀑 였λ₯˜κ°€ λ°œμƒν–ˆμŠ΅λ‹ˆλ‹€.");
+ toast.error(t("basicContracts.messages.signError"));
} finally {
setIsSubmitting(false);
}
};
- // μ„œλͺ… λŒ€κΈ°μ€‘(PENDING) κ³„μ•½μ„œκ°€ μžˆλŠ”μ§€ 확인
- const hasPendingContracts = contracts.length > 0;
-
return (
<>
{/* μ„œλͺ… λ²„νŠΌ */}
@@ -143,62 +238,67 @@ export function BasicContractSignDialog({ contracts, onSuccess }: BasicContractS
variant="outline"
size="sm"
onClick={() => setOpen(true)}
- disabled={!hasPendingContracts}
- className="gap-2 transition-all hover:bg-blue-50 hover:text-blue-600 hover:border-blue-200"
+ disabled={isButtonDisabled}
+ className="gap-2 transition-all hover:bg-blue-50 hover:text-blue-600 hover:border-blue-200 disabled:opacity-50 disabled:cursor-not-allowed"
>
- <Upload className="size-4 text-blue-500" aria-hidden="true" />
+ <Upload
+ className={`size-4 ${isButtonDisabled ? 'text-gray-400' : 'text-blue-500'}`}
+ aria-hidden="true"
+ />
<span className="hidden sm:inline flex items-center">
- μ„œλͺ…ν•˜κΈ°
- {contracts.length > 0 && (
+ {t("basicContracts.toolbar.sign")}
+ {contracts.length > 0 && !isButtonDisabled && (
<Badge variant="secondary" className="ml-2 bg-blue-100 text-blue-700 hover:bg-blue-200">
{contracts.length}
</Badge>
)}
+ {isButtonDisabled && (
+ <span className="ml-2 text-xs text-gray-400">
+ ({getDisabledReason()})
+ </span>
+ )}
</span>
</Button>
- {/* μ„œλͺ… λ‹€μ΄μ–Όλ‘œκ·Έ - κ³ μ • 높이 μœ μ§€ */}
+ {/* μ„œλͺ… λ‹€μ΄μ–Όλ‘œκ·Έ - λ ˆμ΄μ•„μ›ƒ κ°œμ„  */}
<Dialog open={open} onOpenChange={handleOpenChange}>
- <DialogContent className="max-w-5xl h-[650px] w-[90vw] p-0 overflow-hidden rounded-lg shadow-lg border border-gray-200">
- <DialogHeader className="p-6 bg-gradient-to-r from-blue-50 to-purple-50 border-b">
+ <DialogContent className="max-w-7xl w-[95vw] h-[90vh] p-0 flex flex-col overflow-hidden" style={{width:'95vw', maxWidth:'95vw'}}>
+ {/* κ³ μ • 헀더 */}
+ <DialogHeader className="px-6 py-4 bg-gradient-to-r from-blue-50 to-purple-50 border-b flex-shrink-0">
<DialogTitle className="text-xl font-bold flex items-center text-gray-800">
<FileSignature className="mr-2 h-5 w-5 text-blue-500" />
- κΈ°λ³Έκ³„μ•½μ„œ 및 κ΄€λ ¨λ¬Έμ„œ μ„œλͺ…
+ {t("basicContracts.dialog.title")}
+ {/* μΆ”κ°€ 파일 λ‘œλ”© ν‘œμ‹œ */}
+ {isLoadingAttachments && (
+ <Loader2 className="ml-2 h-4 w-4 animate-spin text-blue-500" />
+ )}
</DialogTitle>
</DialogHeader>
- <div className="grid grid-cols-2 h-[calc(100%-4rem)] overflow-hidden">
- {/* μ™Όμͺ½ μ˜μ—­ - κ³„μ•½μ„œ λͺ©λ‘ */}
- <div className="col-span-1 border-r border-gray-200 bg-gray-50">
- <div className="p-4 border-b">
- <div className="relative mb-10">
- <div className="absolute inset-y-0 left-3.5 flex items-center pointer-events-none">
- <Search className="h-4 w-8 text-gray-400" />
+ {/* 메인 컨텐츠 μ˜μ—­ - Flexbox μ‚¬μš© */}
+ <div className="flex flex-1 min-h-0 overflow-hidden">
+ {/* μ™Όμͺ½ μ˜μ—­ - κ³„μ•½μ„œ λͺ©λ‘ (κ³ μ • λ„ˆλΉ„) */}
+ <div className="w-80 border-r border-gray-200 bg-gray-50 flex flex-col flex-shrink-0">
+ <div className="p-3 border-b flex-shrink-0">
+ <div className="relative">
+ <div className="absolute inset-y-0 left-2 flex items-center pointer-events-none">
+ <Search className="h-4 w-4 text-gray-400" />
</div>
<Input
- placeholder="λ¬Έμ„œλͺ… λ˜λŠ” μš”μ²­μž 검색"
- className="bg-white"
- style={{paddingLeft:25}}
+ placeholder={t("basicContracts.dialog.searchPlaceholder")}
+ className="bg-white pl-8 text-sm"
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
/>
</div>
- <Tabs defaultValue="all" className="w-full">
- <TabsList className="w-full">
- <TabsTrigger value="all" className="flex-1">전체 ({contracts.length})</TabsTrigger>
- <TabsTrigger value="contracts" className="flex-1">κ³„μ•½μ„œ</TabsTrigger>
- <TabsTrigger value="docs" className="flex-1">κ΄€λ ¨λ¬Έμ„œ</TabsTrigger>
- </TabsList>
- </Tabs>
</div>
- <ScrollArea className="h-[calc(100%-6rem)]">
- <div className="p-3">
+ <ScrollArea className="flex-1">
+ <div className="p-2">
{filteredContracts.length === 0 ? (
- <div className="flex flex-col items-center justify-center h-40 text-center">
- <FileText className="h-12 w-12 text-gray-300 mb-2" />
- <p className="text-gray-500 font-medium">μ„œλͺ… μš”μ²­λœ λ¬Έμ„œκ°€ μ—†μŠ΅λ‹ˆλ‹€.</p>
- <p className="text-gray-400 text-sm mt-1">λ‚˜μ€‘μ— λ‹€μ‹œ ν™•μΈν•΄μ£Όμ„Έμš”.</p>
+ <div className="flex flex-col items-center justify-center h-32 text-center">
+ <FileText className="h-8 w-8 text-gray-300 mb-2" />
+ <p className="text-gray-500 text-sm font-medium">{t("basicContracts.dialog.noDocuments")}</p>
</div>
) : (
<div className="space-y-2">
@@ -207,30 +307,38 @@ export function BasicContractSignDialog({ contracts, onSuccess }: BasicContractS
key={contract.id}
variant="outline"
className={cn(
- "w-full justify-start text-left h-auto p-3 bg-white hover:bg-blue-50 transition-colors",
+ "w-full justify-start text-left h-auto p-2 bg-white hover:bg-blue-50 transition-colors",
"border border-gray-200 hover:border-blue-200 rounded-md",
selectedContract?.id === contract.id && "border-blue-500 bg-blue-50 shadow-sm"
)}
onClick={() => handleSelectContract(contract)}
>
- <div className="flex flex-col w-full">
+ <div className="flex flex-col w-full space-y-1">
+ {/* 첫 번째 쀄: 제λͺ© + μƒνƒœ */}
<div className="flex items-center justify-between w-full">
- <span className="font-semibold truncate text-gray-800 flex items-center">
- <FileText className="h-4 w-4 mr-2 text-blue-500" />
- {contract.templateName || 'λ¬Έμ„œ'}
+ <span className="font-medium text-xs truncate text-gray-800 flex items-center min-w-0">
+ <FileText className="h-3 w-3 mr-1 text-blue-500 flex-shrink-0" />
+ <span className="truncate">{contract.templateName || t("basicContracts.dialog.document")}</span>
+ {/* λΉ„λ°€μœ μ§€ κ³„μ•½μ„œμΈ 경우 ν‘œμ‹œ */}
+ {contract.templateName === "λΉ„λ°€μœ μ§€ κ³„μ•½μ„œ" && (
+ <Badge variant="outline" className="ml-1 bg-green-50 text-green-700 border-green-200 text-xs">
+ NDA
+ </Badge>
+ )}
</span>
- <Badge variant="outline" className="bg-yellow-50 text-yellow-700 border-yellow-200">
- λŒ€κΈ°μ€‘
+ <Badge variant="outline" className="bg-yellow-50 text-yellow-700 border-yellow-200 text-xs ml-2 flex-shrink-0">
+ {t("basicContracts.statusValues.PENDING")}
</Badge>
</div>
- <Separator className="my-2 bg-gray-100" />
- <div className="grid grid-cols-2 gap-1 mt-1 text-xs text-gray-500">
- <div className="flex items-center">
- <User className="h-3 w-3 mr-1" />
- <span className="truncate">{contract.requestedByName || 'μ•Œ 수 μ—†μŒ'}</span>
+
+ {/* 두 번째 쀄: μ‚¬μš©μž + λ‚ μ§œ */}
+ <div className="flex items-center justify-between text-xs text-gray-500">
+ <div className="flex items-center min-w-0">
+ <User className="h-3 w-3 mr-1 flex-shrink-0" />
+ <span className="truncate">{contract.requestedByName || t("basicContracts.dialog.unknown")}</span>
</div>
- <div className="flex items-center justify-end">
- <Calendar className="h-3 w-3 mr-1" />
+ <div className="flex items-center ml-2 flex-shrink-0">
+ <Calendar className="h-3 w-3 mr-1 flex-shrink-0" />
<span>{formatDate(contract.createdAt)}</span>
</div>
</div>
@@ -243,19 +351,32 @@ export function BasicContractSignDialog({ contracts, onSuccess }: BasicContractS
</ScrollArea>
</div>
- {/* 였λ₯Έμͺ½ μ˜μ—­ - λ¬Έμ„œ λ·°μ–΄ */}
- <div className="col-span-1 bg-white flex flex-col h-full">
+ {/* 였λ₯Έμͺ½ μ˜μ—­ - λ¬Έμ„œ λ·°μ–΄ (ν™•μž₯ κ°€λŠ₯) */}
+ <div className="flex-1 bg-white flex flex-col min-w-0">
{selectedContract ? (
<>
- <div className="p-3 border-b bg-gray-50">
+ {/* λ·°μ–΄ 헀더 */}
+ <div className="p-4 border-b bg-gray-50 flex-shrink-0">
<h3 className="font-semibold text-gray-800 flex items-center">
<FileText className="h-4 w-4 mr-2 text-blue-500" />
- {selectedContract.templateName || 'λ¬Έμ„œ'}
+ {selectedContract.templateName || t("basicContracts.dialog.document")}
+ {/* 쀀법 ν…œν”Œλ¦Ώ ν‘œμ‹œ */}
+ {selectedContract.templateName?.includes('쀀법') && (
+ <Badge variant="outline" className="ml-2 bg-amber-50 text-amber-700 border-amber-200">
+ 쀀법 μ„œλ₯˜
+ </Badge>
+ )}
+ {/* λΉ„λ°€μœ μ§€ κ³„μ•½μ„œμΈ 경우 μΆ”κ°€ 파일 수 ν‘œμ‹œ */}
+ {selectedContract.templateName === "λΉ„λ°€μœ μ§€ κ³„μ•½μ„œ" && additionalFiles.length > 0 && (
+ <Badge variant="outline" className="ml-2 bg-blue-50 text-blue-700 border-blue-200">
+ μ²¨λΆ€νŒŒμΌ {additionalFiles.length}개
+ </Badge>
+ )}
</h3>
- <div className="flex justify-between items-center mt-1 text-xs text-gray-500">
+ <div className="flex justify-between items-center mt-2 text-sm text-gray-500">
<span className="flex items-center">
<User className="h-3 w-3 mr-1" />
- μš”μ²­μž: {selectedContract.requestedByName || 'μ•Œ 수 μ—†μŒ'}
+ {t("basicContracts.dialog.requester")}: {selectedContract.requestedByName || t("basicContracts.dialog.unknown")}
</span>
<span className="flex items-center">
<Clock className="h-3 w-3 mr-1" />
@@ -263,19 +384,43 @@ export function BasicContractSignDialog({ contracts, onSuccess }: BasicContractS
</span>
</div>
</div>
- <div className="flex-grow overflow-hidden border-b">
+
+ {/* λ·°μ–΄ μ˜μ—­ - 남은 곡간 λͺ¨λ‘ μ‚¬μš© */}
+ <div className="flex-1 min-h-0 overflow-hidden">
<BasicContractSignViewer
+ key={selectedContract.id} // key μΆ”κ°€λ‘œ μ»΄ν¬λ„ŒνŠΈ μž¬μƒμ„± κ°•μ œ
contractId={selectedContract.id}
filePath={selectedContract.signedFilePath || undefined}
+ templateName={selectedContract.templateName || ""}
+ additionalFiles={additionalFiles} // μΆ”κ°€ 파일 전달
instance={instance}
setInstance={setInstance}
+ t={t}
/>
</div>
- <div className="p-3 flex justify-between items-center bg-gray-50">
- <p className="text-sm text-gray-600">
- <AlertCircle className="h-4 w-4 text-yellow-500 inline mr-1" />
- μ„œλͺ… ν›„μ—λŠ” λ³€κ²½ν•  수 μ—†μŠ΅λ‹ˆλ‹€.
- </p>
+
+ {/* κ³ μ • ν‘Έν„° */}
+ <div className="p-4 flex justify-between items-center bg-gray-50 border-t flex-shrink-0">
+ <div className="flex items-center space-x-4">
+ <p className="text-sm text-gray-600 flex items-center">
+ <AlertCircle className="h-4 w-4 text-yellow-500 mr-1" />
+ {t("basicContracts.dialog.signWarning")}
+ </p>
+ {/* 쀀법 ν…œν”Œλ¦ΏμΈ 경우 μΆ”κ°€ μ•ˆλ‚΄ */}
+ {selectedContract.templateName?.includes('쀀법') && (
+ <p className="text-xs text-amber-600 flex items-center">
+ <AlertCircle className="h-3 w-3 text-amber-500 mr-1" />
+ λͺ¨λ“  쀀법 ν•­λͺ©μ„ μ²΄ν¬ν•΄μ£Όμ„Έμš”
+ </p>
+ )}
+ {/* λΉ„λ°€μœ μ§€ κ³„μ•½μ„œμΈ 경우 μΆ”κ°€ μ•ˆλ‚΄ */}
+ {selectedContract.templateName === "λΉ„λ°€μœ μ§€ κ³„μ•½μ„œ" && additionalFiles.length > 0 && (
+ <p className="text-xs text-blue-600 flex items-center">
+ <FileText className="h-3 w-3 text-blue-500 mr-1" />
+ 첨뢀 μ„œλ₯˜λ„ ν™•μΈν•΄μ£Όμ„Έμš”
+ </p>
+ )}
+ </div>
<Button
className="gap-2 bg-blue-600 hover:bg-blue-700 transition-colors"
onClick={completeSign}
@@ -287,12 +432,12 @@ export function BasicContractSignDialog({ contracts, onSuccess }: BasicContractS
<circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4"></circle>
<path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
</svg>
- 처리 쀑...
+ {t("basicContracts.dialog.processing")}
</>
) : (
<>
<FileSignature className="h-4 w-4" />
- μ„œλͺ… μ™„λ£Œ
+ {t("basicContracts.dialog.completeSign")}
</>
)}
</Button>
@@ -303,9 +448,9 @@ export function BasicContractSignDialog({ contracts, onSuccess }: BasicContractS
<div className="bg-blue-50 p-6 rounded-full mb-4">
<FileSignature className="h-12 w-12 text-blue-500" />
</div>
- <h3 className="text-xl font-medium text-gray-800 mb-2">λ¬Έμ„œλ₯Ό μ„ νƒν•΄μ£Όμ„Έμš”</h3>
+ <h3 className="text-xl font-medium text-gray-800 mb-2">{t("basicContracts.dialog.selectDocument")}</h3>
<p className="text-gray-500 max-w-md">
- μ™Όμͺ½ λͺ©λ‘μ—μ„œ μ„œλͺ…ν•  λ¬Έμ„œλ₯Ό μ„ νƒν•˜λ©΄ 여기에 λ¬Έμ„œ λ‚΄μš©μ΄ ν‘œμ‹œλ©λ‹ˆλ‹€.
+ {t("basicContracts.dialog.selectDocumentDescription")}
</p>
</div>
)}
diff --git a/lib/basic-contract/vendor-table/basic-contract-table.tsx b/lib/basic-contract/vendor-table/basic-contract-table.tsx
index 34e15ae3..f2575024 100644
--- a/lib/basic-contract/vendor-table/basic-contract-table.tsx
+++ b/lib/basic-contract/vendor-table/basic-contract-table.tsx
@@ -1,6 +1,8 @@
"use client";
import * as React from "react";
+import { useParams } from "next/navigation";
+import { useTranslation } from "react-i18next";
import { DataTable } from "@/components/data-table/data-table";
import { Button } from "@/components/ui/button";
import { Plus, Loader2 } from "lucide-react";
@@ -17,7 +19,6 @@ import { getBasicContracts, getBasicContractsByVendorId } from "../service";
import { BasicContractView } from "@/db/schema";
import { BasicContractTableToolbarActions } from "./basicContract-table-toolbar-actions";
-
interface BasicTemplateTableProps {
promises: Promise<
[
@@ -26,44 +27,85 @@ interface BasicTemplateTableProps {
>
}
-
export function BasicContractsVendorTable({ promises }: BasicTemplateTableProps) {
-
-
+ const params = useParams();
+ const lng = (params?.lng as string) || "ko";
+ const { t, ready } = useTranslation(lng, "procurement");
+
const [rowAction, setRowAction] =
React.useState<DataTableRowAction<BasicContractView> | null>(null)
-
-
+
const [{ data, pageCount }] =
React.use(promises)
- // console.log(data)
-
- // 컬럼 μ„€μ • - μ™ΈλΆ€ νŒŒμΌμ—μ„œ κ°€μ Έμ˜΄
+ console.log(data,"data")
+
+ // μ•ˆμ „ν•œ λ²ˆμ—­ ν•¨μˆ˜ (fallback 포함)
+ const safeT = React.useCallback((key: string, fallback: string) => {
+ if (!ready) return fallback;
+ const translated = t(key);
+ return translated === key ? fallback : translated;
+ }, [t, ready]);
+
+ // λ””λ²„κΉ…μš© 둜그 (κ°œλ°œν™˜κ²½μ—μ„œλ§Œ)
+ React.useEffect(() => {
+ if (process.env.NODE_ENV === 'development') {
+ console.log('Translation ready:', ready);
+ console.log('Current language:', lng);
+ console.log('Template name translation:', t("basicContracts.templateName"));
+ console.log('Status PENDING translation:', t("basicContracts.statusValues.PENDING"));
+ }
+ }, [ready, lng, t]);
+
+ // 컬럼 μ„€μ • - λ²ˆμ—­μ΄ μ€€λΉ„λœ ν›„μ—λ§Œ 생성
const columns = React.useMemo(
- () => getColumns({ setRowAction }),
- [setRowAction]
+ () => {
+ if (!ready) return []; // λ²ˆμ—­μ΄ μ€€λΉ„λ˜μ§€ μ•ŠμœΌλ©΄ 빈 λ°°μ—΄ λ°˜ν™˜
+ return getColumns({ setRowAction, locale: lng, t });
+ },
+ [setRowAction, lng, t, ready]
)
- // config 기반으둜 ν•„ν„° ν•„λ“œ μ„€μ •
- const advancedFilterFields: DataTableAdvancedFilterField<BasicContractView>[] = [
- { id: "templateName", label: "ν…œν”Œλ¦Ώλͺ…", type: "text" },
- {
- id: "status", label: "μƒνƒœ", type: "select", options: [
- { label: "μ„œλͺ…λŒ€κΈ°", value: "PENDING" },
- { label: "μ„œλͺ…μ™„λ£Œ", value: "COMPLETED" },
- ]
- },
- { id: "userName", label: "μš”μ²­μž", type: "text" },
- { id: "createdAt", label: "생성일", type: "date" },
- { id: "updatedAt", label: "μˆ˜μ •μΌ", type: "date" },
- ];
+ // config 기반으둜 ν•„ν„° ν•„λ“œ μ„€μ • - μ•ˆμ „ν•œ λ²ˆμ—­ ν•¨μˆ˜ μ‚¬μš©
+ const advancedFilterFields: DataTableAdvancedFilterField<BasicContractView>[] = React.useMemo(() => {
+ return [
+ {
+ id: "templateName",
+ label: safeT("basicContracts.templateName", lng === 'ko' ? "ν…œν”Œλ¦Ώλͺ…" : "Template Name"),
+ type: "text"
+ },
+ {
+ id: "status",
+ label: safeT("basicContracts.status", lng === 'ko' ? "μƒνƒœ" : "Status"),
+ type: "select",
+ options: [
+ {
+ label: safeT("basicContracts.statusValues.PENDING", lng === 'ko' ? "μ„œλͺ…λŒ€κΈ°" : "Pending"),
+ value: "PENDING"
+ },
+ {
+ label: safeT("basicContracts.statusValues.COMPLETED", lng === 'ko' ? "μ„œλͺ…μ™„λ£Œ" : "Completed"),
+ value: "COMPLETED"
+ },
+ ]
+ },
+ {
+ id: "createdAt",
+ label: safeT("basicContracts.createdAt", lng === 'ko' ? "생성일" : "Created Date"),
+ type: "date"
+ },
+ {
+ id: "updatedAt",
+ label: safeT("basicContracts.updatedAt", lng === 'ko' ? "μˆ˜μ •μΌ" : "Updated Date"),
+ type: "date"
+ },
+ ];
+ }, [safeT, lng]);
const { table } = useDataTable({
data,
columns,
pageCount,
- // filterFields,
enablePinning: true,
enableAdvancedFilter: true,
initialState: {
@@ -77,18 +119,14 @@ export function BasicContractsVendorTable({ promises }: BasicTemplateTableProps)
return (
<>
-
<DataTable table={table}>
<DataTableAdvancedToolbar
table={table}
filterFields={advancedFilterFields}
>
<BasicContractTableToolbarActions table={table} />
-
</DataTableAdvancedToolbar>
</DataTable>
-
</>
-
);
-} \ No newline at end of file
+} \ No newline at end of file
diff --git a/lib/basic-contract/vendor-table/basicContract-table-toolbar-actions.tsx b/lib/basic-contract/vendor-table/basicContract-table-toolbar-actions.tsx
index 2e5e4471..1fc6fe6b 100644
--- a/lib/basic-contract/vendor-table/basicContract-table-toolbar-actions.tsx
+++ b/lib/basic-contract/vendor-table/basicContract-table-toolbar-actions.tsx
@@ -1,9 +1,10 @@
"use client"
import * as React from "react"
-import { type Task } from "@/db/schema/tasks"
import { type Table } from "@tanstack/react-table"
-import { Download, Upload } from "lucide-react"
+import { Download } from "lucide-react"
+import { useParams } from "next/navigation"
+import { useTranslation } from "@/i18n/client"
import { exportTableToExcel } from "@/lib/export"
import { Button } from "@/components/ui/button"
@@ -15,9 +16,19 @@ interface TemplateTableToolbarActionsProps {
}
export function BasicContractTableToolbarActions({ table }: TemplateTableToolbarActionsProps) {
- // 파일 input을 숨기고, λ²„νŠΌ 클릭 μ‹œ μ°Έμ‘°ν•΄ ν΄λ¦­ν•˜λŠ” 방식
+ const params = useParams()
+ const lng = (params?.lng as string) || "ko"
+ const { t, ready } = useTranslation(lng, "procurement")
- const inPendingContracts = React.useMemo(() => {
+ // μ•ˆμ „ν•œ λ²ˆμ—­ ν•¨μˆ˜
+ const safeT = React.useCallback((key: string, fallback: string) => {
+ if (!ready) return fallback;
+ const translated = t(key);
+ return translated === key ? fallback : translated;
+ }, [t, ready]);
+
+ // PENDING μƒνƒœμΈ μ„ νƒλœ κ³„μ•½μ„œλ“€
+ const pendingContracts = React.useMemo(() => {
return table
.getFilteredSelectedRowModel()
.rows
@@ -25,31 +36,35 @@ export function BasicContractTableToolbarActions({ table }: TemplateTableToolbar
.filter(contract => contract.status === "PENDING");
}, [table.getFilteredSelectedRowModel().rows]);
+ // μ„ νƒλœ 행이 μžˆλŠ”μ§€ 확인
+ const hasSelectedRows = table.getFilteredSelectedRowModel().rows.length > 0;
return (
<div className="flex items-center gap-2">
+ {/* μ„œλͺ… λ²„νŠΌ - 항상 ν‘œμ‹œν•˜λ˜ λ‚΄λΆ€μ—μ„œ 쑰건 체크 */}
+ <BasicContractSignDialog
+ contracts={pendingContracts}
+ onSuccess={() => table.toggleAllRowsSelected(false)}
+ hasSelectedRows={hasSelectedRows}
+ t={safeT}
+ />
- {table.getFilteredSelectedRowModel().rows.length > 0 ? (
- <BasicContractSignDialog
- contracts={inPendingContracts}
- onSuccess={() => table.toggleAllRowsSelected(false)}
- />
- ) : null}
-
- {/** 4) Export λ²„νŠΌ */}
+ {/* Export λ²„νŠΌ */}
<Button
variant="outline"
size="sm"
onClick={() =>
exportTableToExcel(table, {
- filename: "basci-contract-requested-list",
+ filename: "basic-contract-requested-list",
excludeColumns: ["select", "actions"],
})
}
className="gap-2"
>
<Download className="size-4" aria-hidden="true" />
- <span className="hidden sm:inline">Export</span>
+ <span className="hidden sm:inline">
+ {safeT("basicContracts.toolbar.export", lng === 'ko' ? "내보내기" : "Export")}
+ </span>
</Button>
</div>
)
diff --git a/lib/basic-contract/viewer/AutoSignatureFieldDetector.tsx b/lib/basic-contract/viewer/AutoSignatureFieldDetector.tsx
new file mode 100644
index 00000000..7de8062c
--- /dev/null
+++ b/lib/basic-contract/viewer/AutoSignatureFieldDetector.tsx
@@ -0,0 +1,493 @@
+// PDF ν…μŠ€νŠΈ νŒ¨ν„΄ 기반 μžλ™ μ„œλͺ… ν•„λ“œ 생성 μ‹œμŠ€ν…œ
+
+interface SignaturePattern {
+ regex: RegExp;
+ name: string;
+ priority: number;
+ offsetX?: number; // ν…μŠ€νŠΈλ‘œλΆ€ν„° XμΆ• μ˜€ν”„μ…‹
+ offsetY?: number; // ν…μŠ€νŠΈλ‘œλΆ€ν„° YμΆ• μ˜€ν”„μ…‹
+ width?: number; // μ„œλͺ… ν•„λ“œ λ„ˆλΉ„
+ height?: number; // μ„œλͺ… ν•„λ“œ 높이
+ }
+
+ interface DetectedSignatureLocation {
+ pageIndex: number;
+ text: string;
+ rect: {
+ x1: number;
+ y1: number;
+ x2: number;
+ y2: number;
+ };
+ pattern: SignaturePattern;
+ confidence: number;
+ }
+
+ class AutoSignatureFieldDetector {
+ private instance: WebViewerInstance;
+ private signaturePatterns: SignaturePattern[];
+
+ constructor(instance: WebViewerInstance) {
+ this.instance = instance;
+ this.signaturePatterns = this.initializePatterns();
+ }
+
+ private initializePatterns(): SignaturePattern[] {
+ return [
+ // ν•œκ΅­μ–΄ νŒ¨ν„΄λ“€ (μš°μ„ μˆœμœ„ λ†’μŒ)
+ {
+ regex: /μ„œλͺ…\s*[:：]\s*[_\-\s]{3,}/gi,
+ name: "ν•œκ΅­μ–΄_μ„œλͺ…_콜둠",
+ priority: 10,
+ offsetX: 80, // "μ„œλͺ…:" ν…μŠ€νŠΈ 였λ₯Έμͺ½μœΌλ‘œ 80px
+ offsetY: -5, // μ•½κ°„ μœ„λ‘œ
+ width: 150,
+ height: 40
+ },
+ {
+ regex: /μ„œλͺ…λž€\s*[_\-\s]{0,}/gi,
+ name: "ν•œκ΅­μ–΄_μ„œλͺ…λž€",
+ priority: 9,
+ offsetX: 60,
+ offsetY: -5,
+ width: 150,
+ height: 40
+ },
+ {
+ regex: /μ„œλͺ…\s*[_\-\s]{5,}/gi,
+ name: "ν•œκ΅­μ–΄_μ„œλͺ…_라인",
+ priority: 8,
+ offsetX: 50,
+ offsetY: -5,
+ width: 150,
+ height: 40
+ },
+ {
+ regex: /(κ³„μ•½μž|κ°‘|을)\s*μ„œλͺ…\s*[:：]?\s*[_\-\s]{0,}/gi,
+ name: "ν•œκ΅­μ–΄_κ³„μ•½μž_μ„œλͺ…",
+ priority: 9,
+ offsetX: 100,
+ offsetY: -5,
+ width: 150,
+ height: 40
+ },
+
+ // μ˜μ–΄ νŒ¨ν„΄λ“€
+ {
+ regex: /signature\s*[:：]\s*[_\-\s]{3,}/gi,
+ name: "μ˜μ–΄_signature_콜둠",
+ priority: 8,
+ offsetX: 120,
+ offsetY: -5,
+ width: 150,
+ height: 40
+ },
+ {
+ regex: /sign\s+here\s*[:：]?\s*[_\-\s]{0,}/gi,
+ name: "μ˜μ–΄_sign_here",
+ priority: 9,
+ offsetX: 100,
+ offsetY: -5,
+ width: 150,
+ height: 40
+ },
+ {
+ regex: /sign\s*[:：]\s*[_\-\s]{3,}/gi,
+ name: "μ˜μ–΄_sign_콜둠",
+ priority: 7,
+ offsetX: 60,
+ offsetY: -5,
+ width: 150,
+ height: 40
+ },
+
+ // λ‚ μ§œμ™€ ν•¨κ»˜ λ‚˜μ˜€λŠ” νŒ¨ν„΄λ“€
+ {
+ regex: /λ‚ μ§œ\s*[:：]\s*[_\-\s]{3,}.*?μ„œλͺ…\s*[:：]\s*[_\-\s]{3,}/gi,
+ name: "λ‚ μ§œ_μ„œλͺ…_μ‘°ν•©",
+ priority: 10,
+ offsetX: 0,
+ offsetY: -5,
+ width: 150,
+ height: 40
+ },
+ {
+ regex: /date\s*[:：]\s*[_\-\s]{3,}.*?signature\s*[:：]\s*[_\-\s]{3,}/gi,
+ name: "date_signature_μ‘°ν•©",
+ priority: 10,
+ offsetX: 0,
+ offsetY: -5,
+ width: 150,
+ height: 40
+ },
+
+ // 일반적인 양식 νŒ¨ν„΄λ“€
+ {
+ regex: /이름\s*[:：]\s*[_\-\s]{5,}.*?μ„œλͺ…\s*[:：]\s*[_\-\s]{5,}/gi,
+ name: "이름_μ„œλͺ…_μ‘°ν•©",
+ priority: 8,
+ offsetX: 0,
+ offsetY: -5,
+ width: 150,
+ height: 40
+ },
+ {
+ regex: /name\s*[:：]\s*[_\-\s]{5,}.*?signature\s*[:：]\s*[_\-\s]{5,}/gi,
+ name: "name_signature_μ‘°ν•©",
+ priority: 8,
+ offsetX: 0,
+ offsetY: -5,
+ width: 150,
+ height: 40
+ }
+ ];
+ }
+
+ // πŸ“„ 메인 ν•¨μˆ˜: λ¬Έμ„œμ—μ„œ μ„œλͺ… νŒ¨ν„΄ 감지 및 ν•„λ“œ 생성
+ async detectAndCreateSignatureFields(): Promise<string[]> {
+ console.log("πŸ” μžλ™ μ„œλͺ… ν•„λ“œ 감지 μ‹œμž‘...");
+
+ try {
+ const { Core } = this.instance;
+ const { documentViewer } = Core;
+
+ await Core.PDFNet.initialize();
+ const doc = await documentViewer.getDocument().getPDFDoc();
+
+ // 1. κΈ°μ‘΄ μ„œλͺ… ν•„λ“œ 확인
+ const existingFields = await this.getExistingSignatureFields(doc);
+ console.log(`πŸ“Š κΈ°μ‘΄ μ„œλͺ… ν•„λ“œ: ${existingFields.length}개`);
+
+ if (existingFields.length > 0) {
+ console.log("βœ… κΈ°μ‘΄ μ„œλͺ… ν•„λ“œκ°€ μžˆμœΌλ―€λ‘œ μžλ™ 생성 μŠ€ν‚΅");
+ return existingFields.map(f => f.name);
+ }
+
+ // 2. ν…μŠ€νŠΈ νŒ¨ν„΄ 기반 μ„œλͺ… μœ„μΉ˜ 감지
+ const detectedLocations = await this.detectSignatureLocations(doc);
+ console.log(`🎯 κ°μ§€λœ μ„œλͺ… μœ„μΉ˜: ${detectedLocations.length}개`);
+
+ // 3. κ°μ§€λœ μœ„μΉ˜μ— μ„œλͺ… ν•„λ“œ 생성
+ const createdFields: string[] = [];
+ for (const location of detectedLocations) {
+ try {
+ const fieldName = await this.createSignatureFieldAtLocation(doc, location);
+ createdFields.push(fieldName);
+ console.log(`βœ… μ„œλͺ… ν•„λ“œ 생성: ${fieldName}`);
+ } catch (error) {
+ console.error(`πŸ“› μ„œλͺ… ν•„λ“œ 생성 μ‹€νŒ¨:`, error);
+ }
+ }
+
+ // 4. λ¬Έμ„œ μ—…λ°μ΄νŠΈ
+ if (createdFields.length > 0) {
+ await documentViewer.refreshAll();
+ await documentViewer.updateView();
+ console.log(`πŸŽ‰ 총 ${createdFields.length}개 μ„œλͺ… ν•„λ“œ μžλ™ 생성 μ™„λ£Œ`);
+ } else {
+ console.warn("⚠️ μ„œλͺ… νŒ¨ν„΄μ„ 찾지 λͺ»ν–ˆμŠ΅λ‹ˆλ‹€. κΈ°λ³Έ μ„œλͺ… ν•„λ“œ 생성...");
+ const defaultField = await this.createDefaultSignatureField(doc);
+ createdFields.push(defaultField);
+ }
+
+ return createdFields;
+
+ } catch (error) {
+ console.error("πŸ“› μžλ™ μ„œλͺ… ν•„λ“œ 생성 μ‹€νŒ¨:", error);
+ return [];
+ }
+ }
+
+ // κΈ°μ‘΄ μ„œλͺ… ν•„λ“œ 확인
+ private async getExistingSignatureFields(doc: any): Promise<any[]> {
+ const { Core } = this.instance;
+ const fields = [];
+
+ try {
+ const pageCount = await doc.getPageCount();
+
+ for (let i = 1; i <= pageCount; i++) {
+ const page = await doc.getPage(i);
+ const numAnnots = await page.getNumAnnots();
+
+ for (let j = 0; j < numAnnots; j++) {
+ const annot = await page.getAnnot(j);
+ const annotType = await annot.getType();
+
+ if (annotType === Core.PDFNet.Annot.Type.e_Widget) {
+ const widget = await Core.PDFNet.WidgetAnnot.cast(annot);
+ const field = await widget.getField();
+ const fieldType = await field.getType();
+
+ if (fieldType === Core.PDFNet.Field.Type.e_signature) {
+ const fieldName = await field.getName();
+ fields.push({ name: fieldName, widget, page: i });
+ }
+ }
+ }
+ }
+ } catch (error) {
+ console.warn("κΈ°μ‘΄ ν•„λ“œ 확인 쀑 μ—λŸ¬:", error);
+ }
+
+ return fields;
+ }
+
+ // ν…μŠ€νŠΈ νŒ¨ν„΄ 기반 μ„œλͺ… μœ„μΉ˜ 감지
+ private async detectSignatureLocations(doc: any): Promise<DetectedSignatureLocation[]> {
+ const { Core } = this.instance;
+ const detectedLocations: DetectedSignatureLocation[] = [];
+
+ try {
+ const pageCount = await doc.getPageCount();
+
+ for (let pageNum = 1; pageNum <= pageCount; pageNum++) {
+ const page = await doc.getPage(pageNum);
+
+ // ν…μŠ€νŠΈ μΆ”μΆœ
+ const textExtractor = await Core.PDFNet.TextExtractor.create();
+ await textExtractor.begin(page);
+
+ // ν…μŠ€νŠΈμ™€ μœ„μΉ˜ 정보 μΆ”μΆœ
+ const wordList = [];
+ let line = await textExtractor.getFirstLine();
+
+ while (line) {
+ let word = await line.getFirstWord();
+ while (word) {
+ const wordText = await word.getString();
+ const wordBox = await word.getBBox();
+
+ wordList.push({
+ text: wordText,
+ x1: await wordBox.getX1(),
+ y1: await wordBox.getY1(),
+ x2: await wordBox.getX2(),
+ y2: await wordBox.getY2()
+ });
+
+ word = await word.getNext();
+ }
+ line = await line.getNext();
+ }
+
+ // 전체 νŽ˜μ΄μ§€ ν…μŠ€νŠΈ μ‘°ν•©
+ const fullText = wordList.map(w => w.text).join(' ');
+
+ // νŒ¨ν„΄ 맀칭
+ for (const pattern of this.signaturePatterns) {
+ const matches = Array.from(fullText.matchAll(pattern.regex));
+
+ for (const match of matches) {
+ // 맀치된 ν…μŠ€νŠΈμ˜ μœ„μΉ˜ μ°ΎκΈ°
+ const matchText = match[0];
+ const matchStart = match.index || 0;
+
+ // λŒ€λž΅μ μΈ μœ„μΉ˜ 계산 (κ°œμ„  κ°€λŠ₯)
+ const location = this.calculateTextLocation(wordList, matchStart, matchText.length);
+
+ if (location) {
+ detectedLocations.push({
+ pageIndex: pageNum - 1,
+ text: matchText,
+ rect: {
+ x1: location.x1 + (pattern.offsetX || 0),
+ y1: location.y1 + (pattern.offsetY || 0),
+ x2: location.x1 + (pattern.offsetX || 0) + (pattern.width || 150),
+ y2: location.y1 + (pattern.offsetY || 0) + (pattern.height || 40)
+ },
+ pattern: pattern,
+ confidence: pattern.priority
+ });
+
+ console.log(`🎯 νŒ¨ν„΄ 맀치: "${matchText}" (${pattern.name}) νŽ˜μ΄μ§€ ${pageNum}`);
+ }
+ }
+ }
+ }
+
+ // 신뒰도 순으둜 μ •λ ¬ (쀑볡 제거 포함)
+ return this.deduplicateAndSort(detectedLocations);
+
+ } catch (error) {
+ console.error("ν…μŠ€νŠΈ νŒ¨ν„΄ 감지 μ‹€νŒ¨:", error);
+ return [];
+ }
+ }
+
+ // ν…μŠ€νŠΈ μœ„μΉ˜ 계산 (κ°œμ„ λœ 버전)
+ private calculateTextLocation(wordList: any[], startIndex: number, length: number): any {
+ if (wordList.length === 0) return null;
+
+ // κ°„λ‹¨ν•œ κ΅¬ν˜„: 첫 번째 λ‹¨μ–΄μ˜ μœ„μΉ˜ μ‚¬μš©
+ // μ‹€μ œλ‘œλŠ” 더 μ •κ΅ν•œ ν…μŠ€νŠΈ 맀칭 ν•„μš”
+ const totalChars = wordList.map(w => w.text).join(' ').length;
+ const ratio = startIndex / totalChars;
+ const targetWordIndex = Math.floor(ratio * wordList.length);
+
+ const targetWord = wordList[Math.min(targetWordIndex, wordList.length - 1)];
+ return targetWord;
+ }
+
+ // 쀑볡 제거 및 μ •λ ¬
+ private deduplicateAndSort(locations: DetectedSignatureLocation[]): DetectedSignatureLocation[] {
+ // 같은 νŽ˜μ΄μ§€μ˜ λ„ˆλ¬΄ κ°€κΉŒμš΄ μœ„μΉ˜λ“€ 제거
+ const filtered = locations.filter((loc, index) => {
+ return !locations.slice(0, index).some(prevLoc =>
+ prevLoc.pageIndex === loc.pageIndex &&
+ Math.abs(prevLoc.rect.x1 - loc.rect.x1) < 100 &&
+ Math.abs(prevLoc.rect.y1 - loc.rect.y1) < 50
+ );
+ });
+
+ // 신뒰도(μš°μ„ μˆœμœ„) 순으둜 μ •λ ¬
+ return filtered.sort((a, b) => b.confidence - a.confidence);
+ }
+
+ // κ°μ§€λœ μœ„μΉ˜μ— μ„œλͺ… ν•„λ“œ 생성
+ private async createSignatureFieldAtLocation(doc: any, location: DetectedSignatureLocation): Promise<string> {
+ const { Core } = this.instance;
+
+ const fieldName = `auto_signature_${location.pageIndex + 1}_${Date.now()}`;
+ const page = await doc.getPage(location.pageIndex + 1);
+
+ // 디지털 μ„œλͺ… ν•„λ“œ 생성
+ const sigField = await doc.createDigitalSignatureField(fieldName);
+
+ // μ„œλͺ… μœ„μ ― 생성
+ const rect = await Core.PDFNet.Rect.init(
+ location.rect.x1,
+ location.rect.y1,
+ location.rect.x2,
+ location.rect.y2
+ );
+
+ const widget = await Core.PDFNet.SignatureWidget.createWithDigitalSignatureField(
+ doc, rect, sigField
+ );
+
+ // μœ„μ ― μŠ€νƒ€μΌ μ„€μ •
+ await widget.setBackgroundColor(
+ await Core.PDFNet.ColorPt.init(0.95, 0.95, 1.0), // μ—°ν•œ νŒŒλž€μƒ‰
+ 3 // RGB
+ );
+
+ await widget.setBorderColor(
+ await Core.PDFNet.ColorPt.init(0.2, 0.4, 0.8), // νŒŒλž€μƒ‰ ν…Œλ‘λ¦¬
+ 3 // RGB
+ );
+
+ // νŽ˜μ΄μ§€μ— μœ„μ ― μΆ”κ°€
+ await page.annotPushBack(widget);
+
+ console.log(`βœ… μžλ™ μ„œλͺ… ν•„λ“œ 생성: ${fieldName} (νŒ¨ν„΄: ${location.pattern.name})`);
+ return fieldName;
+ }
+
+ // κΈ°λ³Έ μ„œλͺ… ν•„λ“œ 생성 (νŒ¨ν„΄μ„ 찾지 λͺ»ν•œ 경우)
+ private async createDefaultSignatureField(doc: any): Promise<string> {
+ const { Core } = this.instance;
+
+ console.log("⚠️ μ„œλͺ… νŒ¨ν„΄ 미발견, κΈ°λ³Έ μœ„μΉ˜μ— μ„œλͺ… ν•„λ“œ 생성");
+
+ const pageCount = await doc.getPageCount();
+ const lastPage = await doc.getPage(pageCount);
+ const pageInfo = await lastPage.getPageInfo();
+ const pageWidth = await pageInfo.getWidth();
+ const pageHeight = await pageInfo.getHeight();
+
+ const fieldName = `default_signature_${Date.now()}`;
+ const sigField = await doc.createDigitalSignatureField(fieldName);
+
+ // λ§ˆμ§€λ§‰ νŽ˜μ΄μ§€ ν•˜λ‹¨ 쀑앙에 배치
+ const rect = await Core.PDFNet.Rect.init(
+ pageWidth * 0.3, // νŽ˜μ΄μ§€ λ„ˆλΉ„ 30% 지점
+ pageHeight * 0.1, // νŽ˜μ΄μ§€ ν•˜λ‹¨ 10% 지점
+ pageWidth * 0.7, // νŽ˜μ΄μ§€ λ„ˆλΉ„ 70% 지점
+ pageHeight * 0.2 // νŽ˜μ΄μ§€ ν•˜λ‹¨ 20% 지점
+ );
+
+ const widget = await Core.PDFNet.SignatureWidget.createWithDigitalSignatureField(
+ doc, rect, sigField
+ );
+
+ await widget.setBackgroundColor(
+ await Core.PDFNet.ColorPt.init(1.0, 0.95, 0.95), // μ—°ν•œ 핑크색 (주의 ν‘œμ‹œ)
+ 3
+ );
+
+ await widget.setBorderColor(
+ await Core.PDFNet.ColorPt.init(0.8, 0.2, 0.2), // 빨간색 ν…Œλ‘λ¦¬
+ 3
+ );
+
+ await lastPage.annotPushBack(widget);
+
+ return fieldName;
+ }
+ }
+
+ // βœ… BasicContractSignViewer에 톡합할 수 μžˆλŠ” ν•¨μˆ˜
+ export async function addAutoSignatureFieldsToDocument(instance: WebViewerInstance): Promise<string[]> {
+ if (!instance) {
+ console.warn("⚠️ WebViewer μΈμŠ€ν„΄μŠ€κ°€ μ—†μŠ΅λ‹ˆλ‹€.");
+ return [];
+ }
+
+ try {
+ const detector = new AutoSignatureFieldDetector(instance);
+ const createdFields = await detector.detectAndCreateSignatureFields();
+
+ if (createdFields.length > 0) {
+ console.log(`πŸŽ‰ μžλ™ μ„œλͺ… ν•„λ“œ 생성 μ™„λ£Œ: ${createdFields.join(', ')}`);
+ }
+
+ return createdFields;
+
+ } catch (error) {
+ console.error("πŸ“› μžλ™ μ„œλͺ… ν•„λ“œ μΆ”κ°€ μ‹€νŒ¨:", error);
+ return [];
+ }
+ }
+
+ // βœ… λ¬Έμ„œ λ‘œλ“œ ν›„ μžλ™ ν˜ΈμΆœλ˜λŠ” Hook
+ export function useAutoSignatureFields(instance: WebViewerInstance | null) {
+ const [signatureFields, setSignatureFields] = React.useState<string[]>([]);
+ const [isProcessing, setIsProcessing] = React.useState(false);
+
+ React.useEffect(() => {
+ if (!instance) return;
+
+ const { documentViewer } = instance.Core;
+
+ const handleDocumentLoaded = async () => {
+ try {
+ setIsProcessing(true);
+ console.log("πŸ“„ λ¬Έμ„œ λ‘œλ“œ μ™„λ£Œ, μžλ™ μ„œλͺ… ν•„λ“œ 생성 μ‹œμž‘...");
+
+ // λ¬Έμ„œ λ‘œλ“œ ν›„ μž μ‹œ λŒ€κΈ° (μ•ˆμ •μ„±μ„ μœ„ν•΄)
+ await new Promise(resolve => setTimeout(resolve, 1000));
+
+ const fields = await addAutoSignatureFieldsToDocument(instance);
+ setSignatureFields(fields);
+
+ } catch (error) {
+ console.error("πŸ“› μžλ™ μ„œλͺ… ν•„λ“œ 처리 μ‹€νŒ¨:", error);
+ } finally {
+ setIsProcessing(false);
+ }
+ };
+
+ documentViewer.addEventListener('documentLoaded', handleDocumentLoaded);
+
+ return () => {
+ documentViewer.removeEventListener('documentLoaded', handleDocumentLoaded);
+ };
+ }, [instance]);
+
+ return {
+ signatureFields,
+ isProcessing,
+ hasSignatureFields: signatureFields.length > 0
+ };
+ } \ No newline at end of file
diff --git a/lib/basic-contract/viewer/basic-contract-sign-viewer.tsx b/lib/basic-contract/viewer/basic-contract-sign-viewer.tsx
index 8995c560..49efb551 100644
--- a/lib/basic-contract/viewer/basic-contract-sign-viewer.tsx
+++ b/lib/basic-contract/viewer/basic-contract-sign-viewer.tsx
@@ -1,233 +1,1566 @@
"use client";
import React, {
- useState,
- useEffect,
- useRef,
- SetStateAction,
- Dispatch,
+useState,
+useEffect,
+useRef,
+SetStateAction,
+Dispatch,
} from "react";
import { WebViewerInstance } from "@pdftron/webviewer";
-import { Loader2 } from "lucide-react";
+import { Loader2, FileText, ClipboardList, AlertTriangle, FileSignature, Target, CheckCircle2 } from "lucide-react";
import { toast } from "sonner";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
+import { Badge } from "@/components/ui/badge";
+import { Button } from "@/components/ui/button";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import {
- Dialog,
- DialogContent,
- DialogHeader,
- DialogTitle,
- DialogDescription,
- DialogFooter,
+Dialog,
+DialogContent,
+DialogHeader,
+DialogTitle,
+DialogDescription,
+DialogFooter,
} from "@/components/ui/dialog";
-import { Button } from "@/components/ui/button";
+import { Label } from "@/components/ui/label";
+import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
+import { Checkbox } from "@/components/ui/checkbox";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
+import { Input } from "@/components/ui/input";
+import { Textarea } from "@/components/ui/textarea";
+import { Upload } from "lucide-react";
+
+
+
+interface FileInfo {
+path: string;
+name: string;
+type: 'main' | 'attachment' | 'survey';
+}
interface BasicContractSignViewerProps {
- contractId?: number;
- filePath?: string;
- isOpen?: boolean;
- onClose?: () => void;
- onSign?: (documentData: ArrayBuffer) => Promise<void>;
- instance: WebViewerInstance | null;
- setInstance: Dispatch<SetStateAction<WebViewerInstance | null>>;
+contractId?: number;
+filePath?: string;
+additionalFiles?: FileInfo[];
+templateName?: string;
+isOpen?: boolean;
+onClose?: () => void;
+onSign?: (documentData: ArrayBuffer, surveyData?: any) => Promise<void>;
+instance: WebViewerInstance | null;
+setInstance: Dispatch<SetStateAction<WebViewerInstance | null>>;
+t?: (key: string) => string;
}
-export function BasicContractSignViewer({
- contractId,
- filePath,
- isOpen = false,
- onClose,
- onSign,
- instance,
- setInstance,
-}: BasicContractSignViewerProps) {
- const [fileLoading, setFileLoading] = useState<boolean>(true);
- const viewer = useRef<HTMLDivElement>(null);
- const initialized = useRef(false);
- const isCancelled = useRef(false);
- const [showDialog, setShowDialog] = useState(isOpen);
+// βœ… μžλ™ μ„œλͺ… ν•„λ“œ 생성을 μœ„ν•œ νƒ€μž… μ •μ˜
+interface SignaturePattern {
+ regex: RegExp;
+ name: string;
+ priority: number;
+ offsetX?: number;
+ offsetY?: number;
+ width?: number;
+ height?: number;
+}
- // λ‹€μ΄μ–Όλ‘œκ·Έ μƒνƒœ 동기화
- useEffect(() => {
- setShowDialog(isOpen);
- }, [isOpen]);
+interface DetectedSignatureLocation {
+ pageIndex: number;
+ text: string;
+ rect: {
+ x1: number;
+ y1: number;
+ x2: number;
+ y2: number;
+ };
+ pattern: SignaturePattern;
+ confidence: number;
+}
- // WebViewer μ΄ˆκΈ°ν™”
- useEffect(() => {
- if (!initialized.current && viewer.current) {
- initialized.current = true;
- isCancelled.current = false;
-
- requestAnimationFrame(() => {
- if (viewer.current) {
- import("@pdftron/webviewer").then(({ default: WebViewer }) => {
- if (isCancelled.current) {
- console.log("πŸ“› WebViewer μ΄ˆκΈ°ν™” μ·¨μ†Œλ¨");
- return;
- }
+// βœ… κ°œμ„ λœ μžλ™ μ„œλͺ… ν•„λ“œ 감지 클래슀
- // viewerElement이 ν™•μ‹€νžˆ μ‘΄μž¬ν•¨μ„ 확인
- const viewerElement = viewer.current;
- if (!viewerElement) return;
-
- WebViewer(
- {
- path: "/pdftronWeb",
- licenseKey: process.env.NEXT_PUBLIC_PDFTRON_WEBVIEW_KEY,
- fullAPI: true,
- },
- viewerElement
- ).then((instance: WebViewerInstance) => {
- setInstance(instance);
- setFileLoading(false);
-
- const { disableElements, setToolbarGroup } = instance.UI;
-
- disableElements([
- "toolbarGroup-Annotate",
- "toolbarGroup-Shapes",
- "toolbarGroup-Insert",
- "toolbarGroup-Edit",
- // "toolbarGroup-FillAndSign",
- "toolbarGroup-Forms",
- ]);
- setToolbarGroup("toolbarGroup-View");
- });
- });
+// βœ… μ΄ˆκ°„λ‹¨ μ•ˆμ „ν•œ μ„œλͺ… ν•„λ“œ 감지 클래슀 (μƒˆλ‘œκ³ μΉ¨ 제거)
+class AutoSignatureFieldDetector {
+ private instance: WebViewerInstance;
+ private signaturePatterns: SignaturePattern[];
+
+ constructor(instance: WebViewerInstance) {
+ this.instance = instance;
+ this.signaturePatterns = this.initializePatterns();
+ }
+
+ private initializePatterns(): SignaturePattern[] {
+ return [
+ // ν•œκ΅­μ–΄ νŒ¨ν„΄λ“€
+ {
+ regex: /μ„œλͺ…\s*[:：]\s*[_\-\s]{3,}/gi,
+ name: "ν•œκ΅­μ–΄_μ„œλͺ…_콜둠",
+ priority: 10,
+ offsetX: 80,
+ offsetY: -5,
+ width: 150,
+ height: 40
+ },
+ {
+ regex: /μ„œλͺ…λž€\s*[_\-\s]{0,}/gi,
+ name: "ν•œκ΅­μ–΄_μ„œλͺ…λž€",
+ priority: 9,
+ offsetX: 60,
+ offsetY: -5,
+ width: 150,
+ height: 40
+ },
+ // μ˜μ–΄ νŒ¨ν„΄λ“€
+ {
+ regex: /signature\s*[:：]\s*[_\-\s]{3,}/gi,
+ name: "μ˜μ–΄_signature_콜둠",
+ priority: 8,
+ offsetX: 120,
+ offsetY: -5,
+ width: 150,
+ height: 40
+ },
+ {
+ regex: /sign\s+here\s*[:：]?\s*[_\-\s]{0,}/gi,
+ name: "μ˜μ–΄_sign_here",
+ priority: 9,
+ offsetX: 100,
+ offsetY: -5,
+ width: 150,
+ height: 40
+ }
+ ];
+ }
+
+ async detectAndCreateSignatureFields(): Promise<string[]> {
+ console.log("πŸ” μ•ˆμ „ν•œ μ„œλͺ… ν•„λ“œ 감지 μ‹œμž‘...");
+
+ try {
+ // βœ… 1단계: κΈ°λ³Έ μœ νš¨μ„± κ²€μ‚¬λ§Œ
+ if (!this.instance?.Core?.documentViewer) {
+ throw new Error("WebViewer μΈμŠ€ν„΄μŠ€κ°€ μœ νš¨ν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€.");
+ }
+
+ const { Core } = this.instance;
+ const { documentViewer } = Core;
+
+ // βœ… 2단계: λ¬Έμ„œ 쑴재 ν™•μΈλ§Œ (getPDFDoc 호좜 μ•ˆν•¨)
+ const document = documentViewer.getDocument();
+ if (!document) {
+ throw new Error("PDF λ¬Έμ„œκ°€ λ‘œλ“œλ˜μ§€ μ•Šμ•˜μŠ΅λ‹ˆλ‹€.");
+ }
+
+ console.log("πŸ“„ λ¬Έμ„œ 확인 μ™„λ£Œ, κΈ°μ‘΄ ν•„λ“œ 검사...");
+
+ // βœ… 3단계: κΈ°μ‘΄ μ„œλͺ… ν•„λ“œ 확인 (μ•ˆμ „ν•œ 방법)
+ const existingFields = await this.checkExistingFieldsSafely();
+ if (existingFields.length > 0) {
+ console.log(`βœ… κΈ°μ‘΄ μ„œλͺ… ν•„λ“œ 발견: ${existingFields.length}개`);
+ return existingFields;
+ }
+
+ // βœ… 4단계: λ‹¨μˆœ κΈ°λ³Έ μ„œλͺ… ν•„λ“œ 생성 (ν…μŠ€νŠΈ 뢄석 μŠ€ν‚΅)
+ console.log("πŸ“ κΈ°λ³Έ μ„œλͺ… ν•„λ“œ 생성...");
+ const defaultField = await this.createSimpleSignatureField();
+
+ // βœ… 5단계: μƒˆλ‘œκ³ μΉ¨ 없이 μ™„λ£Œ
+ console.log("βœ… μ„œλͺ… ν•„λ“œ 생성 μ™„λ£Œ (μƒˆλ‘œκ³ μΉ¨ μŠ€ν‚΅)");
+ return [defaultField];
+
+ } catch (error) {
+ console.error("πŸ“› μ•ˆμ „ν•œ μ„œλͺ… ν•„λ“œ 생성 μ‹€νŒ¨:", error);
+
+ // μ—λŸ¬ νƒ€μž…λ³„ λ©”μ‹œμ§€
+ let errorMessage = "μ„œλͺ… ν•„λ“œ 생성에 μ‹€νŒ¨ν–ˆμŠ΅λ‹ˆλ‹€.";
+ if (error instanceof Error) {
+ if (error.message.includes("μΈμŠ€ν„΄μŠ€")) {
+ errorMessage = "λ·°μ–΄κ°€ μ€€λΉ„λ˜μ§€ μ•Šμ•˜μŠ΅λ‹ˆλ‹€.";
+ } else if (error.message.includes("λ¬Έμ„œ")) {
+ errorMessage = "λ¬Έμ„œλ₯Ό λΆˆλŸ¬μ˜€λŠ” μ€‘μž…λ‹ˆλ‹€.";
}
+ }
+
+ throw new Error(errorMessage);
+ }
+ }
+
+ // βœ… μ•ˆμ „ν•œ κΈ°μ‘΄ ν•„λ“œ 확인 (PDFDoc μ ‘κ·Ό μ•ˆν•¨)
+ private async checkExistingFieldsSafely(): Promise<string[]> {
+ try {
+ const { annotationManager } = this.instance.Core;
+ const annotations = annotationManager.getAnnotationsList();
+
+ const signatureFields: string[] = [];
+
+ for (const annotation of annotations) {
+ try {
+ if (annotation.getCustomData && annotation.getCustomData('fieldName')) {
+ const fieldName = annotation.getCustomData('fieldName');
+ if (fieldName.includes('signature') || fieldName.includes('μ„œλͺ…')) {
+ signatureFields.push(fieldName);
+ }
+ }
+ } catch (annotError) {
+ // κ°œλ³„ μ–΄λ…Έν…Œμ΄μ…˜ μ—λŸ¬ λ¬΄μ‹œ
+ continue;
+ }
+ }
+
+ return signatureFields;
+ } catch (error) {
+ console.warn("κΈ°μ‘΄ ν•„λ“œ 확인 μ‹€νŒ¨ (λ¬΄μ‹œ):", error);
+ return [];
+ }
+ }
+
+ // βœ… μ΄ˆκ°„λ‹¨ μ„œλͺ… ν•„λ“œ 생성 (λ³΅μž‘ν•œ ν…μŠ€νŠΈ 뢄석 없이)
+ private async createSimpleSignatureField(): Promise<string> {
+ try {
+ const { Core, UI } = this.instance;
+ const { documentViewer, annotationManager, Annotations } = Core;
+
+ // νŽ˜μ΄μ§€ 정보 μ•ˆμ „ν•˜κ²Œ κ°€μ Έμ˜€κΈ°
+ const pageCount = documentViewer.getPageCount();
+ const lastPageIndex = Math.max(0, pageCount - 1);
+
+ // νŽ˜μ΄μ§€ 크기 μ•ˆμ „ν•˜κ²Œ κ°€μ Έμ˜€κΈ°
+ const pageWidth = documentViewer.getPageWidth(pageCount) || 612;
+ const pageHeight = documentViewer.getPageHeight(pageCount) || 792;
+
+ console.log(`πŸ“ νŽ˜μ΄μ§€ 정보: ${pageCount}νŽ˜μ΄μ§€, 크기 ${pageWidth}x${pageHeight}`);
+
+ // βœ… κ°„λ‹¨ν•œ μ„œλͺ… μ–΄λ…Έν…Œμ΄μ…˜ 생성 (PDFDoc μ ‘κ·Ό 없이)
+ const fieldName = `simple_signature_${Date.now()}`;
+
+ // μ„œλͺ… μœ„μ ― μ–΄λ…Έν…Œμ΄μ…˜ 생성
+ const signatureWidget = new Annotations.SignatureWidgetAnnotation({
+ appearance: Annotations.SignatureWidgetAnnotation.DefaultAppearance.MATERIAL_OUTLINE,
+ Width: 150,
+ Height: 50
});
+
+ // μœ„μΉ˜ μ„€μ • (λ§ˆμ§€λ§‰ νŽ˜μ΄μ§€ ν•˜λ‹¨)
+ signatureWidget.setPageNumber(pageCount);
+ signatureWidget.setX(pageWidth * 0.3);
+ signatureWidget.setY(pageHeight * 0.15);
+ signatureWidget.setWidth(150);
+ signatureWidget.setHeight(50);
+
+ // ν•„λ“œλͺ… μ„€μ •
+ signatureWidget.setFieldName(fieldName);
+ signatureWidget.setCustomData('fieldName', fieldName);
+
+ // μŠ€νƒ€μΌ μ„€μ •
+ signatureWidget.StrokeColor = new Annotations.Color(0, 100, 200); // νŒŒλž€μƒ‰
+ signatureWidget.StrokeThickness = 2;
+
+ // μ–΄λ…Έν…Œμ΄μ…˜ μΆ”κ°€
+ annotationManager.addAnnotation(signatureWidget);
+ annotationManager.redrawAnnotation(signatureWidget);
+
+ console.log(`βœ… 간단 μ„œλͺ… ν•„λ“œ 생성: ${fieldName}`);
+ return fieldName;
+
+ } catch (error) {
+ console.error("πŸ“› 간단 μ„œλͺ… ν•„λ“œ 생성 μ‹€νŒ¨:", error);
+
+ // βœ… μ΅œν›„μ˜ μˆ˜λ‹¨: ν…μŠ€νŠΈ μ–΄λ…Έν…Œμ΄μ…˜μœΌλ‘œ μ•ˆλ‚΄
+ return await this.createTextGuidance();
+ }
+ }
+
+ // βœ… μ΅œν›„μ˜ μˆ˜λ‹¨: ν…μŠ€νŠΈ μ•ˆλ‚΄ 생성
+ private async createTextGuidance(): Promise<string> {
+ try {
+ const { Core } = this.instance;
+ const { documentViewer, annotationManager, Annotations } = Core;
+
+ const pageCount = documentViewer.getPageCount();
+ const pageWidth = documentViewer.getPageWidth(pageCount) || 612;
+ const pageHeight = documentViewer.getPageHeight(pageCount) || 792;
+
+ // ν…μŠ€νŠΈ μ–΄λ…Έν…Œμ΄μ…˜μœΌλ‘œ μ„œλͺ… μ•ˆλ‚΄
+ const textAnnot = new Annotations.FreeTextAnnotation();
+ textAnnot.setPageNumber(pageCount);
+ textAnnot.setX(pageWidth * 0.25);
+ textAnnot.setY(pageHeight * 0.1);
+ textAnnot.setWidth(pageWidth * 0.5);
+ textAnnot.setHeight(60);
+ textAnnot.setContents("πŸ‘† μ—¬κΈ°λ₯Ό ν΄λ¦­ν•˜μ—¬ μ„œλͺ…ν•΄μ£Όμ„Έμš”");
+ textAnnot.FontSize = '14pt';
+ textAnnot.TextColor = new Annotations.Color(255, 0, 0); // 빨간색
+ textAnnot.StrokeColor = new Annotations.Color(255, 200, 200);
+ textAnnot.FillColor = new Annotations.Color(255, 240, 240);
+
+ const fieldName = `text_guidance_${Date.now()}`;
+ textAnnot.setCustomData('fieldName', fieldName);
+
+ annotationManager.addAnnotation(textAnnot);
+ annotationManager.redrawAnnotation(textAnnot);
+
+ console.log(`βœ… ν…μŠ€νŠΈ μ•ˆλ‚΄ 생성: ${fieldName}`);
+ return fieldName;
+
+ } catch (error) {
+ console.error("πŸ“› ν…μŠ€νŠΈ μ•ˆλ‚΄ 생성도 μ‹€νŒ¨:", error);
+ return "manual_signature_required";
}
+ }
+}
+
+function useAutoSignatureFields(instance: WebViewerInstance | null) {
+ const [signatureFields, setSignatureFields] = useState<string[]>([]);
+ const [isProcessing, setIsProcessing] = useState(false);
+ const [error, setError] = useState<string | null>(null);
+
+ // 쀑볡 μ‹€ν–‰ 방지
+ const processingRef = useRef(false);
+ const timeoutRef = useRef<NodeJS.Timeout | null>(null);
+
+ useEffect(() => {
+ if (!instance) return;
+
+ const { documentViewer } = instance.Core;
+
+ const handleDocumentLoaded = () => {
+ // βœ… 쀑볡 μ‹€ν–‰ 방지
+ if (processingRef.current) {
+ console.log("πŸ“› 이미 처리 μ€‘μ΄λ―€λ‘œ μŠ€ν‚΅");
+ return;
+ }
+
+ // βœ… κΈ°μ‘΄ 타이머 정리
+ if (timeoutRef.current) {
+ clearTimeout(timeoutRef.current);
+ timeoutRef.current = null;
+ }
+
+ // βœ… 짧은 지연 ν›„ μ‹€ν–‰ (3초)
+ timeoutRef.current = setTimeout(async () => {
+ if (processingRef.current) return;
+
+ processingRef.current = true;
+ setIsProcessing(true);
+ setError(null);
+
+ try {
+ console.log("πŸ“„ λ¬Έμ„œ λ‘œλ“œ μ™„λ£Œ, μ•ˆμ „ν•œ μ„œλͺ… ν•„λ“œ 처리 μ‹œμž‘...");
+
+ // βœ… μ΅œμ’… μœ νš¨μ„± 검사
+ if (!instance?.Core?.documentViewer?.getDocument()) {
+ throw new Error("λ¬Έμ„œκ°€ μ€€λΉ„λ˜μ§€ μ•Šμ•˜μŠ΅λ‹ˆλ‹€.");
+ }
+
+ const detector = new AutoSignatureFieldDetector(instance);
+ const fields = await detector.detectAndCreateSignatureFields();
+
+ setSignatureFields(fields);
+
+ // βœ… 결과에 λ”°λ₯Έ ν† μŠ€νŠΈ λ©”μ‹œμ§€
+ if (fields.length > 0) {
+ const hasSimpleField = fields.some(field => field.startsWith('simple_signature_'));
+ const hasTextGuidance = fields.some(field => field.startsWith('text_guidance_'));
+ const hasManualRequired = fields.includes('manual_signature_required');
+
+ if (hasSimpleField) {
+ toast.success("πŸ“ μ„œλͺ… ν•„λ“œκ°€ μƒμ„±λ˜μ—ˆμŠ΅λ‹ˆλ‹€.", {
+ description: "λ§ˆμ§€λ§‰ νŽ˜μ΄μ§€ ν•˜λ‹¨μ˜ νŒŒλž€μƒ‰ μ˜μ—­μ—μ„œ μ„œλͺ…ν•΄μ£Όμ„Έμš”.",
+ icon: <FileSignature className="h-4 w-4 text-blue-500" />,
+ duration: 5000
+ });
+ } else if (hasTextGuidance) {
+ toast.success("πŸ“ μ„œλͺ… μ•ˆλ‚΄κ°€ ν‘œμ‹œλ˜μ—ˆμŠ΅λ‹ˆλ‹€.", {
+ description: "빨간색 ν…μŠ€νŠΈ μ˜μ—­μ„ ν΄λ¦­ν•˜μ—¬ μ„œλͺ…ν•΄μ£Όμ„Έμš”.",
+ icon: <Target className="h-4 w-4 text-red-500" />,
+ duration: 6000
+ });
+ } else if (hasManualRequired) {
+ toast.info("μˆ˜λ™ μ„œλͺ…이 ν•„μš”ν•©λ‹ˆλ‹€.", {
+ description: "λ¬Έμ„œμ—μ„œ μ„œλͺ…ν•  μœ„μΉ˜λ₯Ό 직접 ν΄λ¦­ν•΄μ£Όμ„Έμš”.",
+ icon: <AlertTriangle className="h-4 w-4 text-amber-500" />,
+ duration: 5000
+ });
+ } else {
+ toast.success(`πŸ“‹ ${fields.length}개의 μ„œλͺ… ν•„λ“œλ₯Ό ν™•μΈν–ˆμŠ΅λ‹ˆλ‹€.`, {
+ description: "κΈ°μ‘΄ μ„œλͺ… ν•„λ“œκ°€ λ°œκ²¬λ˜μ—ˆμŠ΅λ‹ˆλ‹€.",
+ icon: <CheckCircle2 className="h-4 w-4 text-green-500" />,
+ duration: 4000
+ });
+ }
+ } else {
+ toast.info("μ„œλͺ… ν•„λ“œ μ€€λΉ„ 쀑", {
+ description: "λ¬Έμ„œμ—μ„œ μ„œλͺ…ν•  μœ„μΉ˜λ₯Ό ν΄λ¦­ν•΄μ£Όμ„Έμš”.",
+ icon: <FileSignature className="h-4 w-4 text-blue-500" />,
+ duration: 4000
+ });
+ }
+
+ } catch (error) {
+ console.error("πŸ“› μ•ˆμ „ν•œ μ„œλͺ… ν•„λ“œ 처리 μ‹€νŒ¨:", error);
+
+ const errorMessage = error instanceof Error ? error.message : "μ„œλͺ… ν•„λ“œ μ²˜λ¦¬μ— μ‹€νŒ¨ν–ˆμŠ΅λ‹ˆλ‹€.";
+ setError(errorMessage);
+
+ // βœ… λΆ€λ“œλŸ¬μš΄ μ—λŸ¬ 처리
+ if (errorMessage.includes("μ€€λΉ„")) {
+ toast.info("λ¬Έμ„œ λ‘œλ”© 쀑", {
+ description: "μž μ‹œ ν›„ λ‹€μ‹œ μ‹œλ„ν•˜κ±°λ‚˜ μˆ˜λ™μœΌλ‘œ μ„œλͺ…ν•΄μ£Όμ„Έμš”.",
+ icon: <Loader2 className="h-4 w-4 text-blue-500" />
+ });
+ } else {
+ toast.info("μˆ˜λ™ μ„œλͺ… λͺ¨λ“œ", {
+ description: "λ¬Έμ„œμ—μ„œ μ„œλͺ…ν•  μœ„μΉ˜λ₯Ό 직접 ν΄λ¦­ν•΄μ£Όμ„Έμš”.",
+ icon: <FileSignature className="h-4 w-4 text-blue-500" />
+ });
+ }
+ } finally {
+ setIsProcessing(false);
+ processingRef.current = false;
+ }
+ }, 3000); // 3초 지연
+ };
+
+ // βœ… 이벀트 λ¦¬μŠ€λ„ˆ 등둝
+ documentViewer.removeEventListener('documentLoaded', handleDocumentLoaded);
+ documentViewer.addEventListener('documentLoaded', handleDocumentLoaded);
return () => {
- if (instance) {
- instance.UI.dispose();
+ documentViewer.removeEventListener('documentLoaded', handleDocumentLoaded);
+
+ if (timeoutRef.current) {
+ clearTimeout(timeoutRef.current);
+ timeoutRef.current = null;
}
- isCancelled.current = true;
- setTimeout(() => cleanupHtmlStyle(), 500);
+
+ processingRef.current = false;
};
- }, []);
+ }, [instance]);
- // λ¬Έμ„œ λ‘œλ“œ
+ // βœ… μ»΄ν¬λ„ŒνŠΈ μ–Έλ§ˆμš΄νŠΈ μ‹œ 정리
useEffect(() => {
- if (!instance || !filePath) return;
- console.log("πŸ“„ 파일 λ‘œλ“œ μ‹œλ„:", { filePath });
-
+ return () => {
+ if (timeoutRef.current) {
+ clearTimeout(timeoutRef.current);
+ }
+ processingRef.current = false;
+ };
+ }, []);
+
+ return {
+ signatureFields,
+ isProcessing,
+ hasSignatureFields: signatureFields.length > 0,
+ error
+ };
+}
+
+export function BasicContractSignViewer({
+contractId,
+filePath,
+additionalFiles = [],
+templateName = "",
+isOpen = false,
+onClose,
+onSign,
+instance,
+setInstance,
+t = (key: string) => key,
+}: BasicContractSignViewerProps) {
+
+ console.log("πŸ” BasicContractSignViewer props:", {
+ contractId,
+ filePath,
+ additionalFiles,
+ templateName,
+ isNDATemplate: templateName.includes('λΉ„λ°€μœ μ§€') || templateName.includes('NDA')
+ });
+
+const [fileLoading, setFileLoading] = useState<boolean>(true);
+const [activeTab, setActiveTab] = useState<string>("main");
+const [surveyData, setSurveyData] = useState<any>({});
+const [surveyAnswers, setSurveyAnswers] = useState<Record<number, any>>({});
+const [surveyTemplate, setSurveyTemplate] = useState<any>(null);
+const [surveyLoading, setSurveyLoading] = useState<boolean>(false);
+const [uploadedFiles, setUploadedFiles] = useState<Record<number, File[]>>({});
+const [isInitialLoaded, setIsInitialLoaded] = useState<boolean>(false);
+
+const viewer = useRef<HTMLDivElement>(null);
+const initialized = useRef(false);
+const isCancelled = useRef(false);
+const currentDocumentPath = useRef<string>("");
+const [showDialog, setShowDialog] = useState(isOpen);
+const webViewerInstance = useRef<WebViewerInstance | null>(null);
+
+// βœ… μžλ™ μ„œλͺ… ν•„λ“œ 생성 ν›… μ‚¬μš©
+const { signatureFields, isProcessing: isAutoSignProcessing, hasSignatureFields, error: autoSignError } = useAutoSignatureFields(webViewerInstance.current || instance);
+
+// ν…œν”Œλ¦Ώ νƒ€μž… νŒλ‹¨
+const isComplianceTemplate = templateName.includes('쀀법');
+const isNDATemplate = templateName.includes('λΉ„λ°€μœ μ§€') || templateName.includes('NDA');
+
+// 파일 λͺ©λ‘ 생성
+const allFiles: FileInfo[] = React.useMemo(() => {
+ const files: FileInfo[] = [];
+
+ if (filePath) {
+ files.push({
+ path: filePath,
+ name: templateName || "κΈ°λ³Έ κ³„μ•½μ„œ",
+ type: "main",
+ });
+ }
+
+ const normalizedAttachments: FileInfo[] = (additionalFiles || [])
+ .map((f: any, idx: number) => ({
+ path: f.path ?? f.filePath ?? "",
+ name: `μ²¨λΆ€νŒŒμΌ ${idx + 1}`,
+ type: "attachment" as const,
+ }))
+ .filter(f => !!f.path);
+
+ files.push(...normalizedAttachments);
+
+ if (isComplianceTemplate) {
+ files.push({
+ path: "",
+ name: "쀀법 섀문쑰사",
+ type: "survey",
+ });
+ }
+
+ console.log("πŸ“‚ μƒμ„±λœ allFiles:", files, { isNDATemplate, isComplianceTemplate });
+ return files;
+}, [filePath, additionalFiles, templateName, isComplianceTemplate, isNDATemplate]);
+
+// WebViewer 정리 ν•¨μˆ˜
+const cleanupWebViewer = () => {
+ console.log("🧹 WebViewer 정리 μ‹œμž‘");
+
+ if (webViewerInstance.current) {
+ try {
+ const { documentViewer } = webViewerInstance.current.Core;
+ if (documentViewer && documentViewer.getDocument()) {
+ documentViewer.closeDocument();
+ }
+
+ if (webViewerInstance.current.UI && typeof webViewerInstance.current.UI.dispose === 'function') {
+ webViewerInstance.current.UI.dispose();
+ }
+ } catch (error) {
+ console.warn("WebViewer 정리 쀑 μ—λŸ¬ (λ¬΄μ‹œλ¨):", error);
+ }
- // filePathλ₯Ό /api/files/ μ—”λ“œν¬μΈνŠΈλ₯Ό 톡해 μ ‘κ·Όν•˜λ„λ‘ λ³€ν™˜
- // ν•œκΈ€ 파일λͺ…μ˜ 경우 URL 인코딩 처리
+ webViewerInstance.current = null;
+ }
+
+ if (instance && setInstance) {
+ setInstance(null);
+ }
+
+ setTimeout(() => cleanupHtmlStyle(), 100);
+};
+
+// λ‹€μ΄μ–Όλ‘œκ·Έ 및 파일 μƒνƒœ λ³€κ²½ μ‹œ 리셋
+useEffect(() => {
+ setShowDialog(isOpen);
+
+ if (isOpen && isComplianceTemplate && !surveyTemplate) {
+ loadSurveyTemplate();
+ }
+
+ if (isOpen) {
+ setIsInitialLoaded(false);
+ currentDocumentPath.current = "";
+ console.log("πŸ”„ μƒˆλ‘œμš΄ κ³„μ•½μ„œ μ—΄λ¦Ό, μƒνƒœ 리셋");
+ }
+}, [isOpen, isComplianceTemplate]);
+
+// filePath λ³€κ²½ μ‹œ μƒνƒœ 리셋 및 μ¦‰μ‹œ λ¬Έμ„œ λ‘œλ“œ
+useEffect(() => {
+ if (!filePath) return;
+
+ console.log("πŸ”„ filePath λ³€κ²½μœΌλ‘œ μƒνƒœ 리셋 및 λ¬Έμ„œ λ‘œλ“œ:", filePath);
+
+ setIsInitialLoaded(false);
+ currentDocumentPath.current = "";
+ setActiveTab("main");
+
+ const currentInstance = webViewerInstance.current || instance;
+
+ if (currentInstance) {
const normalizedPath = filePath.startsWith('/') ? filePath.substring(1) : filePath;
const encodedPath = normalizedPath.split('/').map(part => encodeURIComponent(part)).join('/');
const apiFilePath = `/api/files/${encodedPath}`;
- console.log("πŸ“„ 파일 λ‘œλ“œ μ‹œλ„:", { originalPath: filePath, encodedPath: apiFilePath });
- loadDocument(instance, apiFilePath);
- }, [instance, filePath]);
+ console.log("πŸ“„ filePath λ³€κ²½μœΌλ‘œ μ¦‰μ‹œ λ¬Έμ„œ λ‘œλ“œ:", apiFilePath);
+
+ loadDocument(currentInstance, apiFilePath, true).then(() => {
+ setIsInitialLoaded(true);
+ console.log("βœ… filePath λ³€κ²½ λ¬Έμ„œ λ‘œλ“œ μ™„λ£Œ");
+ }).catch((error) => {
+ console.error("πŸ“› filePath λ³€κ²½ λ¬Έμ„œ λ‘œλ“œ μ‹€νŒ¨:", error);
+ });
+ }
+}, [filePath, instance]);
- // κ°„μ†Œν™”λœ λ¬Έμ„œ λ‘œλ“œ ν•¨μˆ˜
- const loadDocument = async (instance: WebViewerInstance, documentPath: string) => {
- setFileLoading(true);
- try {
- const { documentViewer } = instance.Core;
+const loadSurveyTemplate = async () => {
+ setSurveyLoading(true);
+
+ const mockTemplate = {
+ id: 1,
+ name: 'κΈ°λ³Έ 쀀법 섀문쑰사',
+ description: 'λͺ¨λ“  계약업체 λŒ€μƒ κΈ°λ³Έ 쀀법 섀문쑰사',
+ questions: [
+ {
+ id: 4,
+ questionNumber: '4',
+ questionText: 'κ·€μ‚¬μ˜ 법λ₯ μ  μ‘°μ§ν˜•νƒœλŠ”?',
+ questionType: 'DROPDOWN',
+ isRequired: true,
+ hasDetailText: false,
+ hasFileUpload: false,
+ options: [
+ { id: 1, optionValue: 'COMPANY_CORP', optionText: 'μ£Όμ‹νšŒμ‚¬/μœ ν•œνšŒμ‚¬' },
+ { id: 2, optionValue: 'INDIVIDUAL', optionText: 'κ°œμΈνšŒμ‚¬' },
+ { id: 3, optionValue: 'PARTNERSHIP', optionText: 'μ‘°ν•©' },
+ { id: 4, optionValue: 'JOINT_VENTURE', optionText: '쑰인트벀처' },
+ { id: 5, optionValue: 'OTHER', optionText: '기타', allowsOtherInput: true },
+ ]
+ },
+ {
+ id: 6,
+ questionNumber: '6',
+ questionText: 'λΆ€νŒ¨λ°©μ§€μ™€ κ΄€λ ¨ν•œ κ·€μ‚¬μ˜ 쀀법정책이 μžˆμŠ΅λ‹ˆκΉŒ? μžˆλ‹€λ©΄ μ²¨λΆ€νŒŒμΌλ‘œ μ œκ³΅ν•˜μ—¬ μ£Όμ‹œκΈ° λ°”λžλ‹ˆλ‹€.',
+ questionType: 'RADIO',
+ isRequired: true,
+ hasDetailText: false,
+ hasFileUpload: true,
+ options: [
+ { id: 6, optionValue: 'YES', optionText: 'λ„€' },
+ { id: 7, optionValue: 'NO', optionText: 'μ•„λ‹ˆμ˜€' },
+ ]
+ },
+ {
+ id: 11,
+ questionNumber: '11',
+ questionText: 'κ·€μ‚¬μ˜ 사주, μž„μ› μ€‘μ—μ„œ μ „(졜근 3λ…„λ‚΄)Β·ν˜„μ§ 곡직자인 μ‚¬λžŒμ΄ μžˆμŠ΅λ‹ˆκΉŒ? λ§Œμ•½ μžˆλ‹€λ©΄ μƒμ„Έν•˜κ²Œ κΈ°μˆ ν•΄ μ£Όμ‹­μ‹œμ˜€.',
+ questionType: 'RADIO',
+ isRequired: true,
+ hasDetailText: true,
+ hasFileUpload: false,
+ options: [
+ { id: 11, optionValue: 'YES', optionText: 'λ„€' },
+ { id: 12, optionValue: 'NO', optionText: 'μ•„λ‹ˆμ˜€' },
+ ]
+ },
+ ]
+ };
+
+ setSurveyTemplate(mockTemplate);
+ setSurveyLoading(false);
+};
+
+// WebViewer μ΄ˆκΈ°ν™” κ°œμ„ 
+useEffect(() => {
+ if (!initialized.current && viewer.current) {
+ initialized.current = true;
+ isCancelled.current = false;
+
+ const initializeWebViewer = () => {
+ if (!viewer.current || isCancelled.current) {
+ console.log("πŸ“› WebViewer μ΄ˆκΈ°ν™” μ·¨μ†Œλ¨ (DOM μ—†μŒ)");
+ return;
+ }
+
+ const viewerElement = viewer.current;
- await documentViewer.loadDocument(documentPath, { extension: 'pdf' });
+ if (!viewerElement.isConnected) {
+ console.log("πŸ“› WebViewer DOM이 μ—°κ²°λ˜μ§€ μ•ŠμŒ, μž¬μ‹œλ„...");
+ setTimeout(initializeWebViewer, 100);
+ return;
+ }
+
+ cleanupWebViewer();
+
+ console.log("πŸ“„ WebViewer μ΄ˆκΈ°ν™” μ‹œμž‘...");
- } catch (err) {
- console.error("λ¬Έμ„œ λ‘œλ”© 쀑 였λ₯˜ λ°œμƒ:", err);
- toast.error("λ¬Έμ„œλ₯Ό λΆˆλŸ¬μ˜€λŠ”λ° μ‹€νŒ¨ν–ˆμŠ΅λ‹ˆλ‹€.");
- } finally {
- setFileLoading(false);
- }
+ import("@pdftron/webviewer").then(({ default: WebViewer }) => {
+ if (isCancelled.current || !viewer.current) {
+ console.log("πŸ“› WebViewer μ΄ˆκΈ°ν™” μ·¨μ†Œλ¨ (import ν›„)");
+ return;
+ }
+
+ WebViewer(
+ {
+ path: "/pdftronWeb",
+ licenseKey: process.env.NEXT_PUBLIC_PDFTRON_WEBVIEW_KEY,
+ fullAPI: true
+ },
+ viewerElement
+ ).then((newInstance) => {
+ if (isCancelled.current) {
+ console.log("πŸ“› WebViewer μΈμŠ€ν„΄μŠ€ 생성 ν›„ μ·¨μ†Œλ¨");
+ return;
+ }
+
+ console.log("πŸ“„ WebViewer μ΄ˆκΈ°ν™” μ™„λ£Œ");
+
+ webViewerInstance.current = newInstance;
+ setInstance(newInstance);
+ setFileLoading(false);
+
+ const { documentViewer } = newInstance.Core;
+ const FitMode = newInstance.UI.FitMode;
+
+ // λ¬Έμ„œ λ‘œλ“œ μ™„λ£Œ μ‹œ 처리
+ const handleDocumentLoaded = () => {
+ setFileLoading(false);
+ newInstance.UI.setFitMode(FitMode.FitWidth);
+
+ requestAnimationFrame(() => {
+ try {
+ documentViewer.refreshAll();
+ documentViewer.updateView();
+ window.dispatchEvent(new Event("resize"));
+ setTimeout(() => window.dispatchEvent(new Event("resize")), 100);
+ } catch (e) {
+ console.warn("layout refresh skipped", e);
+ }
+ });
+ };
+
+ documentViewer.addEventListener('documentLoaded', handleDocumentLoaded);
+
+ documentViewer.addEventListener('layoutChanged', () => {
+ if (newInstance.UI.getFitMode && newInstance.UI.getFitMode() !== FitMode.Zoom) {
+ newInstance.UI.setFitMode(FitMode.Zoom);
+ }
+ });
+
+ newInstance.UI.setMinZoomLevel('25%');
+ newInstance.UI.setMaxZoomLevel('400%');
+
+ documentViewer.addEventListener('documentLoadingError', (error) => {
+ console.error("πŸ“› WebViewer λ¬Έμ„œ λ‘œλ”© μ—λŸ¬:", error);
+
+ let showToast = true;
+ let errorMessage = "λ¬Έμ„œλ₯Ό λΆˆλŸ¬μ˜€λŠ”λ° μ‹€νŒ¨ν–ˆμŠ΅λ‹ˆλ‹€.";
+
+ if (error && typeof error === 'object') {
+ const errorStr = JSON.stringify(error).toLowerCase();
+
+ if (errorStr.includes('linearized') || errorStr.includes('getreference')) {
+ console.warn("⚠️ PDF ꡬ쑰 κ²½κ³  (λ¬Έμ„œ λ‘œλ“œλŠ” 진행됨)");
+ showToast = false;
+ } else if (errorStr.includes('network')) {
+ errorMessage = "λ„€νŠΈμ›Œν¬ 연결을 ν™•μΈν•΄μ£Όμ„Έμš”.";
+ } else if (errorStr.includes('permission')) {
+ errorMessage = "λ¬Έμ„œμ— μ ‘κ·Όν•  κΆŒν•œμ΄ μ—†μŠ΅λ‹ˆλ‹€.";
+ }
+ }
+
+ if (showToast) {
+ setFileLoading(false);
+ toast.error(errorMessage);
+ }
+ });
+
+ }).catch((error) => {
+ console.error("πŸ“› WebViewer μ΄ˆκΈ°ν™” μ‹€νŒ¨:", error);
+ setFileLoading(false);
+ toast.error("λ·°μ–΄ μ΄ˆκΈ°ν™”μ— μ‹€νŒ¨ν–ˆμŠ΅λ‹ˆλ‹€.");
+ });
+ }).catch((error) => {
+ console.error("πŸ“› WebViewer λͺ¨λ“ˆ λ‘œλ“œ μ‹€νŒ¨:", error);
+ setFileLoading(false);
+ toast.error("λ·°μ–΄ λͺ¨λ“ˆμ„ λΆˆλŸ¬μ˜€λŠ”λ° μ‹€νŒ¨ν–ˆμŠ΅λ‹ˆλ‹€.");
+ });
+ };
+
+ requestAnimationFrame(() => {
+ setTimeout(initializeWebViewer, 50);
+ });
+ }
+
+ return () => {
+ isCancelled.current = true;
+ cleanupWebViewer();
};
+}, [setInstance]);
- // μ„œλͺ… μ €μž₯ ν•Έλ“€λŸ¬
- const handleSave = async () => {
- if (!instance) return;
+// ν™•μž₯자 μΆ”μΆœ μœ ν‹Έ
+const getExtFromPath = (p: string) => {
+ const m = p.toLowerCase().match(/\.([a-z0-9]+)(?:\?.*)?$/);
+ return m ? m[1] : undefined;
+};
+
+// λ¬Έμ„œ λ‘œλ“œ ν•¨μˆ˜ κ°œμ„ 
+const loadDocument = async (
+ instance: WebViewerInstance,
+ documentPath: string,
+ forceReload = false
+) => {
+ if (!forceReload && currentDocumentPath.current === documentPath) {
+ console.log("πŸ“„ λ™μΌν•œ λ¬Έμ„œμ΄λ―€λ‘œ μŠ€ν‚΅:", documentPath);
+ return;
+ }
+
+ setFileLoading(true);
+ try {
+ console.log("πŸ“„ λ¬Έμ„œ λ‘œλ“œ μ‹œμž‘(UI):", documentPath, forceReload ? "(κ°•μ œ λ¦¬λ‘œλ“œ)" : "");
+
+ if (!instance || !instance.UI || !instance.Core) {
+ throw new Error("WebViewer μΈμŠ€ν„΄μŠ€κ°€ μœ νš¨ν•˜μ§€ μ•ŠμŠ΅λ‹ˆλ‹€.");
+ }
+
+ const ext = getExtFromPath(documentPath);
+ await instance.UI.loadDocument(documentPath, {
+ ...(ext ? { extension: ext } : {}),
+ filename: documentPath.split("/").pop(),
+ });
+
+ currentDocumentPath.current = documentPath;
+ console.log("πŸ“„ λ¬Έμ„œ λ‘œλ“œ μ™„λ£Œ(UI):", documentPath);
+
+ const { documentViewer } = instance.Core;
+ requestAnimationFrame(() => {
+ try {
+ documentViewer.refreshAll();
+ documentViewer.updateView();
+ window.dispatchEvent(new Event("resize"));
+ setTimeout(() => window.dispatchEvent(new Event("resize")), 100);
+ } catch (e) {
+ console.warn("λ ˆμ΄μ•„μ›ƒ μƒˆλ‘œκ³ μΉ¨ μŠ€ν‚΅:", e);
+ }
+ });
+ } catch (error) {
+ console.error("πŸ“› λ¬Έμ„œ λ‘œλ”© μ‹€νŒ¨(UI):", error);
+ currentDocumentPath.current = "";
- try {
- const { documentViewer } = instance.Core;
- const doc = documentViewer.getDocument();
-
- // μ„œλͺ…λœ λ¬Έμ„œ 데이터 κ°€μ Έμ˜€κΈ°
- const documentData = await doc.getFileData({
- includeAnnotations: true,
- });
-
- // μ™ΈλΆ€μ—μ„œ 제곡된 onSign ν•Έλ“€λŸ¬κ°€ 있으면 호좜
- if (onSign) {
- await onSign(documentData);
- } else {
- // κΈ°λ³Έ λ™μž‘ - μ„œλͺ… 성곡 λ©”μ‹œμ§€ ν‘œμ‹œ
- toast.success("κ³„μ•½μ„œκ°€ μ„±κ³΅μ μœΌλ‘œ μ„œλͺ…λ˜μ—ˆμŠ΅λ‹ˆλ‹€.");
+ let msg = "λ¬Έμ„œλ₯Ό λΆˆλŸ¬μ˜€λŠ”λ° μ‹€νŒ¨ν–ˆμŠ΅λ‹ˆλ‹€.";
+ if (error instanceof Error) {
+ const s = error.message.toLowerCase();
+ if (s.includes("network") || s.includes("fetch")) {
+ msg = "λ„€νŠΈμ›Œν¬ 연결을 ν™•μΈν•΄μ£Όμ„Έμš”.";
+ } else if (s.includes("permission") || s.includes("access")) {
+ msg = "λ¬Έμ„œμ— μ ‘κ·Όν•  κΆŒν•œμ΄ μ—†μŠ΅λ‹ˆλ‹€.";
+ } else if (s.includes("corrupt") || s.includes("invalid")) {
+ msg = "파일이 μ†μƒλ˜μ—ˆκ±°λ‚˜ ν˜•μ‹μ΄ μ˜¬λ°”λ₯΄μ§€ μ•ŠμŠ΅λ‹ˆλ‹€.";
+ } else if (s.includes("linearized") || s.includes("getreference")) {
+ msg = "";
}
-
- handleClose();
- } catch (err) {
- console.error("μ„œλͺ… μ €μž₯ 쀑 였λ₯˜ λ°œμƒ:", err);
- toast.error("μ„œλͺ…을 μ €μž₯ν•˜λŠ”λ° μ‹€νŒ¨ν–ˆμŠ΅λ‹ˆλ‹€.");
}
- };
+ if (msg) toast.error(msg);
+ } finally {
+ setFileLoading(false);
+ }
+};
- // λ‹€μ΄μ–Όλ‘œκ·Έ λ‹«κΈ° ν•Έλ“€λŸ¬
- const handleClose = () => {
- if (onClose) {
- onClose();
- } else {
- setShowDialog(false);
+// 폼 데이터 μˆ˜μ§‘ ν•¨μˆ˜
+const collectFormData = async (instance: WebViewerInstance) => {
+ try {
+ const { documentViewer, annotationManager } = instance.Core;
+ const fieldManager = annotationManager.getFieldManager();
+ const fields = fieldManager.getFields();
+
+ const formData: any = {};
+ fields.forEach((field: any) => {
+ formData[field.name] = field.value;
+ });
+
+ console.log('πŸ“ 폼 데이터 μˆ˜μ§‘:', formData);
+ return formData;
+ } catch (error) {
+ console.error('πŸ“› 폼 데이터 μˆ˜μ§‘ μ‹€νŒ¨:', error);
+ return {};
+ }
+};
+
+// νƒ­ λ³€κ²½ ν•Έλ“€λŸ¬
+const handleTabChange = async (newTab: string) => {
+ setActiveTab(newTab);
+ if (newTab === "survey") return;
+
+ const currentInstance = webViewerInstance.current || instance;
+ if (!currentInstance || fileLoading) return;
+
+ let targetFile: FileInfo | undefined;
+ if (newTab === "main") {
+ targetFile = allFiles.find(f => f.type === "main");
+ } else if (newTab.startsWith("file-")) {
+ const fileIndex = parseInt(newTab.replace("file-", ""), 10);
+ targetFile = allFiles.filter(f => f.type !== 'survey')[fileIndex];
+ }
+
+ if (!targetFile?.path) {
+ console.warn("πŸ“› λŒ€μƒ νŒŒμΌμ„ 찾을 수 μ—†μŒ:", newTab, allFiles);
+ return;
+ }
+
+ const normalizedPath = targetFile.path.startsWith("/")
+ ? targetFile.path.substring(1)
+ : targetFile.path;
+ const encodedPath = normalizedPath.split("/").map(encodeURIComponent).join("/");
+ const apiFilePath = `/api/files/${encodedPath}`;
+
+ console.log("πŸ“„ νƒ­ λ³€κ²½μœΌλ‘œ λ¬Έμ„œ λ‘œλ“œ:", { newTab, targetFile, apiFilePath });
+
+ try {
+ currentDocumentPath.current = "";
+ await loadDocument(currentInstance, apiFilePath, true);
+ setIsInitialLoaded(true);
+
+ const { documentViewer } = currentInstance.Core;
+ requestAnimationFrame(() => {
+ try {
+ documentViewer.refreshAll();
+ documentViewer.updateView();
+ window.dispatchEvent(new Event("resize"));
+ } catch (e) {
+ console.warn("νƒ­ λ³€κ²½ ν›„ λ ˆμ΄μ•„μ›ƒ μƒˆλ‘œκ³ μΉ¨ μŠ€ν‚΅:", e);
+ }
+ });
+ } catch (e) {
+ console.error("πŸ“› νƒ­ λ³€κ²½ μ‹€νŒ¨:", e);
+ }
+};
+
+// 초기 메인 λ¬Έμ„œ λ‘œλ“œ κ°œμ„ 
+useEffect(() => {
+ console.log("πŸ” 초기 λ‘œλ“œ 체크:", {
+ hasInstance: !!(webViewerInstance.current || instance),
+ hasFilePath: !!filePath,
+ activeTab,
+ isInitialLoaded,
+ allFilesLength: allFiles.length,
+ isNDATemplate
+ });
+
+ const currentInstance = webViewerInstance.current || instance;
+
+ if (!currentInstance || !filePath || isInitialLoaded) {
+ return;
+ }
+
+ const isMainTab = activeTab === 'main';
+ const shouldLoadInitial = allFiles.length === 1 || isMainTab;
+
+ if (!shouldLoadInitial || currentDocumentPath.current !== "") {
+ return;
+ }
+
+ const normalizedPath = filePath.startsWith('/') ? filePath.substring(1) : filePath;
+ const encodedPath = normalizedPath.split('/').map(part => encodeURIComponent(part)).join('/');
+ const apiFilePath = `/api/files/${encodedPath}`;
+
+ console.log("πŸ“„ 초기 마운트 λ¬Έμ„œ λ‘œλ“œ:", { apiFilePath, isNDATemplate, activeTab });
+
+ currentDocumentPath.current = "";
+
+ loadDocument(currentInstance, apiFilePath, true).then(() => {
+ setIsInitialLoaded(true);
+ console.log("βœ… 초기 마운트 λ‘œλ“œ μ™„λ£Œ");
+ }).catch((error) => {
+ console.error("πŸ“› 초기 마운트 λ‘œλ“œ μ‹€νŒ¨:", error);
+ });
+}, [webViewerInstance.current, instance, filePath, activeTab, isInitialLoaded, allFiles.length, isNDATemplate]);
+
+// 섀문쑰사 λ‹΅λ³€ μ—…λ°μ΄νŠΈ ν•¨μˆ˜
+const updateSurveyAnswer = (questionId: number, field: string, value: any) => {
+ setSurveyAnswers(prev => ({
+ ...prev,
+ [questionId]: {
+ ...prev[questionId],
+ questionId,
+ [field]: value
}
- };
+ }));
+};
+
+// 파일 μ—…λ‘œλ“œ ν•Έλ“€λŸ¬
+const handleSurveyFileUpload = (questionId: number, files: FileList | null) => {
+ if (!files) return;
+
+ const fileArray = Array.from(files);
+ setUploadedFiles(prev => ({
+ ...prev,
+ [questionId]: fileArray
+ }));
+
+ updateSurveyAnswer(questionId, 'files', fileArray);
+};
+
+// 질문 μ™„λ£Œ μ—¬λΆ€ 체크
+const isSurveyQuestionComplete = (question: any): boolean => {
+ const answer = surveyAnswers[question.id];
- // 인라인 λ·°μ–΄ λ Œλ”λ§ (λ‹€μ΄μ–Όλ‘œκ·Έ λͺ¨λ“œκ°€ 아닐 λ•Œ)
- if (!isOpen && !onClose) {
+ if (!question.isRequired) return true;
+ if (!answer?.answerValue) return false;
+
+ if (question.hasDetailText && answer.answerValue === 'YES' && !answer.detailText) {
+ return false;
+ }
+
+ if (question.hasFileUpload && answer.answerValue === 'YES' && (!answer.files || answer.files.length === 0)) {
+ return false;
+ }
+
+ return true;
+};
+
+// 전체 섀문쑰사 μ™„λ£Œ μ—¬λΆ€ 체크
+const isSurveyComplete = (): boolean => {
+ if (!surveyTemplate?.questions) return false;
+ return surveyTemplate.questions.every((question: any) => isSurveyQuestionComplete(question));
+};
+
+// 섀문쑰사 데이터 처리
+const handleSurveyComplete = async () => {
+ if (!isSurveyComplete()) {
+ toast.error('λͺ¨λ“  ν•„μˆ˜ ν•­λͺ©μ„ μ™„λ£Œν•΄μ£Όμ„Έμš”.', {
+ description: 'λ―Έμ™„μ„±λœ 질문이 μžˆμŠ΅λ‹ˆλ‹€.',
+ icon: <AlertTriangle className="h-5 w-5 text-red-500" />
+ });
+ return;
+ }
+
+ try {
+ console.log('섀문쑰사 λ‹΅λ³€:', surveyAnswers);
+
+ setSurveyData({
+ completed: true,
+ answers: Object.values(surveyAnswers),
+ timestamp: new Date().toISOString()
+ });
+
+ toast.success("섀문쑰사가 μ™„λ£Œλ˜μ—ˆμŠ΅λ‹ˆλ‹€!", {
+ icon: <CheckCircle2 className="h-5 w-5 text-green-500" />
+ });
+ } catch (error) {
+ console.error('섀문쑰사 μ €μž₯ μ‹€νŒ¨:', error);
+ toast.error('섀문쑰사 μ €μž₯에 μ‹€νŒ¨ν–ˆμŠ΅λ‹ˆλ‹€.');
+ }
+};
+
+// μ„œλͺ… μ €μž₯ ν•Έλ“€λŸ¬
+const handleSave = async () => {
+ const currentInstance = webViewerInstance.current || instance;
+ if (!currentInstance) return;
+
+ try {
+ const { documentViewer, annotationManager } = currentInstance.Core;
+ const doc = documentViewer.getDocument();
+
+ if (!doc) {
+ toast.error("λ¬Έμ„œκ°€ λ‘œλ“œλ˜μ§€ μ•Šμ•˜μŠ΅λ‹ˆλ‹€.");
+ return;
+ }
+
+ const formData = await collectFormData(currentInstance);
+
+ const xfdfString = await annotationManager.exportAnnotations();
+ const documentData = await doc.getFileData({
+ xfdfString,
+ downloadType: "pdf",
+ });
+
+ if (isComplianceTemplate && !surveyData.completed) {
+ toast.error("쀀법 섀문쑰사λ₯Ό λ¨Όμ € μ™„λ£Œν•΄μ£Όμ„Έμš”.");
+ setActiveTab('survey');
+ return;
+ }
+
+ if (onSign) {
+ await onSign(documentData, { formData, surveyData, signatureFields });
+ } else {
+ toast.success("κ³„μ•½μ„œκ°€ μ„±κ³΅μ μœΌλ‘œ μ„œλͺ…λ˜μ—ˆμŠ΅λ‹ˆλ‹€.");
+ }
+
+ handleClose();
+ } catch (error) {
+ console.error("πŸ“› μ„œλͺ… μ €μž₯ μ‹€νŒ¨:", error);
+ toast.error("μ„œλͺ…을 μ €μž₯ν•˜λŠ”λ° μ‹€νŒ¨ν–ˆμŠ΅λ‹ˆλ‹€.");
+ }
+};
+
+// λ‹€μ΄μ–Όλ‘œκ·Έ λ‹«κΈ° ν•Έλ“€λŸ¬
+const handleClose = () => {
+ if (onClose) {
+ onClose();
+ } else {
+ setShowDialog(false);
+ }
+};
+
+// 동적 섀문쑰사 μ»΄ν¬λ„ŒνŠΈ
+const SurveyComponent = () => {
+ if (surveyLoading) {
return (
- <div className="border rounded-md overflow-hidden" style={{ height: '600px' }}>
- <div ref={viewer} className="h-[100%]">
- {fileLoading && (
- <div className="flex flex-col items-center justify-center py-12">
- <Loader2 className="h-8 w-8 text-blue-500 animate-spin mb-4" />
- <p className="text-sm text-muted-foreground">λ¬Έμ„œ λ‘œλ”© 쀑...</p>
+ <div className="h-full w-full">
+ <Card className="h-full">
+ <CardContent className="flex flex-col items-center justify-center h-full py-12">
+ <Loader2 className="h-8 w-8 text-blue-500 animate-spin mb-4" />
+ <p className="text-sm text-muted-foreground">섀문쑰사λ₯Ό λΆˆλŸ¬μ˜€λŠ” 쀑...</p>
+ </CardContent>
+ </Card>
+ </div>
+ );
+ }
+
+ if (!surveyTemplate) {
+ return (
+ <div className="h-full w-full">
+ <Card className="h-full">
+ <CardContent className="flex flex-col items-center justify-center h-full py-12">
+ <AlertTriangle className="h-8 w-8 text-red-500 mb-4" />
+ <p className="text-sm text-muted-foreground">섀문쑰사 ν…œν”Œλ¦Ώμ„ 뢈러올 수 μ—†μŠ΅λ‹ˆλ‹€.</p>
+ <Button
+ variant="outline"
+ onClick={loadSurveyTemplate}
+ className="mt-2"
+ >
+ λ‹€μ‹œ μ‹œλ„
+ </Button>
+ </CardContent>
+ </Card>
+ </div>
+ );
+ }
+
+ const completedCount = surveyTemplate.questions.filter((q: any) => isSurveyQuestionComplete(q)).length;
+ const progressPercentage = surveyTemplate.questions.length > 0 ? (completedCount / surveyTemplate.questions.length) * 100 : 0;
+
+const renderSurveyQuestion = (question: any) => {
+ const answer = surveyAnswers[question.id];
+ const isComplete = isSurveyQuestionComplete(question);
+
+ return (
+ <div key={question.id} className="mb-6 p-4 border rounded-lg bg-gray-50">
+ <div className="flex items-start justify-between mb-3">
+ <div className="flex-1">
+ <Label className="text-sm font-medium text-gray-900 flex items-center">
+ <span className="mr-2 px-2 py-1 bg-blue-100 text-blue-700 rounded text-xs">
+ {question.questionNumber}
+ </span>
+ {question.questionText}
+ {question.isRequired && <span className="text-red-500 ml-1">*</span>}
+ </Label>
+ </div>
+ {isComplete && (
+ <CheckCircle2 className="h-5 w-5 text-green-500 ml-2" />
+ )}
+ </div>
+
+ {question.questionType === 'RADIO' && (
+ <RadioGroup
+ value={answer?.answerValue || ''}
+ onValueChange={(value) => updateSurveyAnswer(question.id, 'answerValue', value)}
+ className="space-y-2"
+ >
+ {question.options?.map((option: any) => (
+ <div key={option.id} className="flex items-center space-x-2">
+ <RadioGroupItem value={option.optionValue} id={`${question.id}-${option.id}`} />
+ <Label htmlFor={`${question.id}-${option.id}`} className="text-sm">
+ {option.optionText}
+ </Label>
</div>
+ ))}
+ </RadioGroup>
+ )}
+
+ {question.questionType === 'DROPDOWN' && (
+ <div className="space-y-2">
+ <Select
+ value={answer?.answerValue || ''}
+ onValueChange={(value) => updateSurveyAnswer(question.id, 'answerValue', value)}
+ >
+ <SelectTrigger>
+ <SelectValue placeholder="μ„ νƒν•΄μ£Όμ„Έμš”" />
+ </SelectTrigger>
+ <SelectContent>
+ {question.options?.map((option: any) => (
+ <SelectItem key={option.id} value={option.optionValue}>
+ {option.optionText}
+ </SelectItem>
+ ))}
+ </SelectContent>
+ </Select>
+
+ {answer?.answerValue === 'OTHER' && (
+ <Input
+ placeholder="기타 λ‚΄μš©μ„ μž…λ ₯ν•΄μ£Όμ„Έμš”"
+ value={answer?.otherText || ''}
+ onChange={(e) => updateSurveyAnswer(question.id, 'otherText', e.target.value)}
+ className="mt-2"
+ />
)}
</div>
- </div>
- );
+ )}
+
+ {question.questionType === 'TEXTAREA' && (
+ <Textarea
+ placeholder="μƒμ„Έν•œ λ‚΄μš©μ„ μž…λ ₯ν•΄μ£Όμ„Έμš”"
+ value={answer?.detailText || ''}
+ onChange={(e) => updateSurveyAnswer(question.id, 'detailText', e.target.value)}
+ rows={4}
+ />
+ )}
+
+ {question.hasDetailText && answer?.answerValue === 'YES' && (
+ <div className="mt-3">
+ <Label className="text-sm text-gray-700 mb-2 block">상세 λ‚΄μš©μ„ κΈ°μˆ ν•΄μ£Όμ„Έμš”:</Label>
+ <Textarea
+ placeholder="μƒμ„Έν•œ λ‚΄μš©μ„ μž…λ ₯ν•΄μ£Όμ„Έμš”"
+ value={answer?.detailText || ''}
+ onChange={(e) => updateSurveyAnswer(question.id, 'detailText', e.target.value)}
+ rows={3}
+ className="w-full"
+ />
+ </div>
+ )}
+
+ {question.hasFileUpload && answer?.answerValue === 'YES' && (
+ <div className="mt-3">
+ <Label className="text-sm text-gray-700 mb-2 block">μ²¨λΆ€νŒŒμΌ:</Label>
+ <div className="border-2 border-dashed border-gray-300 rounded-lg p-4">
+ <input
+ type="file"
+ multiple
+ onChange={(e) => handleSurveyFileUpload(question.id, e.target.files)}
+ className="hidden"
+ id={`file-${question.id}`}
+ />
+ <label htmlFor={`file-${question.id}`} className="cursor-pointer">
+ <div className="flex flex-col items-center">
+ <Upload className="h-8 w-8 text-gray-400 mb-2" />
+ <span className="text-sm text-gray-500">νŒŒμΌμ„ μ„ νƒν•˜κ±°λ‚˜ 여기에 λ“œλž˜κ·Έν•˜μ„Έμš”</span>
+ </div>
+ </label>
+
+ {uploadedFiles[question.id] && uploadedFiles[question.id].length > 0 && (
+ <div className="mt-3 space-y-1">
+ {uploadedFiles[question.id].map((file, index) => (
+ <div key={index} className="flex items-center space-x-2 text-sm">
+ <FileText className="h-4 w-4 text-blue-500" />
+ <span>{file.name}</span>
+ <span className="text-gray-500">({(file.size / 1024).toFixed(1)} KB)</span>
+ </div>
+ ))}
+ </div>
+ )}
+ </div>
+ </div>
+ )}
+ </div>
+ );
+};
+
+ return (
+ <div className="h-full w-full flex flex-col">
+ <Card className="h-full flex flex-col">
+ <CardHeader className="flex-shrink-0">
+ <CardTitle className="flex items-center justify-between">
+ <div className="flex items-center">
+ <ClipboardList className="h-5 w-5 mr-2 text-amber-500" />
+ {surveyTemplate.name}
+ </div>
+ <div className="text-sm text-gray-500">
+ {completedCount}/{surveyTemplate.questions.length} μ™„λ£Œ
+ </div>
+ </CardTitle>
+ <CardDescription>
+ {surveyTemplate.description}
+ </CardDescription>
+
+ <div className="w-full bg-gray-200 rounded-full h-2">
+ <div
+ className="bg-blue-600 h-2 rounded-full transition-all duration-300"
+ style={{ width: `${progressPercentage}%` }}
+ />
+ </div>
+ </CardHeader>
+
+ <CardContent className="flex-1 min-h-0 overflow-y-auto">
+ <div className="space-y-6">
+ <div className="p-4 border rounded-lg bg-yellow-50">
+ <div className="flex items-start">
+ <AlertTriangle className="h-5 w-5 text-yellow-600 mt-0.5 mr-2" />
+ <div>
+ <p className="font-medium text-yellow-800">μ€‘μš” μ•ˆλ‚΄</p>
+ <p className="text-sm text-yellow-700 mt-1">
+ λ³Έ μ„€λ¬Έμ‘°μ‚¬λŠ” 쀀법 의무 확인을 μœ„ν•œ ν•„μˆ˜ μ ˆμ°¨μž…λ‹ˆλ‹€. λͺ¨λ“  ν•­λͺ©μ„ μ •ν™•νžˆ μž‘μ„±ν•΄μ£Όμ„Έμš”.
+ </p>
+ </div>
+ </div>
+ </div>
+
+ <div className="space-y-4">
+ {surveyTemplate.questions.map((question: any) => renderSurveyQuestion(question))}
+ </div>
+
+ <div className="flex justify-end pt-6 border-t">
+ <Button
+ onClick={handleSurveyComplete}
+ disabled={!isSurveyComplete()}
+ className="bg-blue-600 hover:bg-blue-700"
+ >
+ <CheckCircle2 className="h-4 w-4 mr-2" />
+ 섀문쑰사 μ™„λ£Œ
+ </Button>
+ </div>
+ </div>
+ </CardContent>
+ </Card>
+ </div>
+ );
+};
+
+// 디버깅을 μœ„ν•œ useEffect
+useEffect(() => {
+ if (isNDATemplate) {
+ console.log("πŸ” NDA ν…œν”Œλ¦Ώ 디버깅:", {
+ filePath,
+ additionalFiles,
+ allFiles,
+ activeTab,
+ isInitialLoaded,
+ currentDocumentPath: currentDocumentPath.current,
+ hasWebViewerInstance: !!webViewerInstance.current,
+ hasParentInstance: !!instance,
+ signatureFields,
+ hasSignatureFields,
+ isAutoSignProcessing,
+ autoSignError
+ });
}
+}, [isNDATemplate, filePath, additionalFiles, allFiles, activeTab, isInitialLoaded, signatureFields, hasSignatureFields, isAutoSignProcessing, autoSignError]);
+
+// βœ… μ„œλͺ… ν•„λ“œ μƒνƒœ ν‘œμ‹œ μ»΄ν¬λ„ŒνŠΈ
+const SignatureFieldsStatus = () => {
+ if (!hasSignatureFields && !isAutoSignProcessing && !autoSignError) return null;
- // λ‹€μ΄μ–Όλ‘œκ·Έ λ·°μ–΄ λ Œλ”λ§
return (
- <Dialog open={showDialog} onOpenChange={handleClose}>
- <DialogContent className="w-[70vw]" style={{ maxWidth: "none" }}>
- <DialogHeader>
- <DialogTitle>κΈ°λ³Έκ³„μ•½μ„œ μ„œλͺ…</DialogTitle>
- <DialogDescription>
- κ³„μ•½μ„œλ₯Ό ν™•μΈν•˜κ³  μ„œλͺ…을 μ§„ν–‰ν•΄μ£Όμ„Έμš”.
- </DialogDescription>
- </DialogHeader>
- <div className="h-[calc(70vh-60px)]">
- <div ref={viewer} className="h-[100%]">
+ <div className="mb-2">
+ {isAutoSignProcessing ? (
+ <Badge variant="secondary" className="text-xs">
+ <Loader2 className="h-3 w-3 mr-1 animate-spin" />
+ μ„œλͺ… ν•„λ“œ 생성 쀑...
+ </Badge>
+ ) : autoSignError ? (
+ <Badge variant="destructive" className="text-xs bg-red-50 text-red-700 border-red-200">
+ <AlertTriangle className="h-3 w-3 mr-1" />
+ μžλ™ 생성 μ‹€νŒ¨
+ </Badge>
+ ) : hasSignatureFields ? (
+ <Badge variant="outline" className="text-xs bg-blue-50 text-blue-700 border-blue-200">
+ <Target className="h-3 w-3 mr-1" />
+ {signatureFields.length}개 μ„œλͺ… ν•„λ“œ μžλ™ 생성됨
+ </Badge>
+ ) : null}
+ </div>
+ );
+};
+
+// 인라인 λ·°μ–΄ λ Œλ”λ§
+if (!isOpen && !onClose) {
+ return (
+ <div className="h-full w-full flex flex-col overflow-hidden">
+ {allFiles.length > 1 ? (
+ <Tabs value={activeTab} onValueChange={handleTabChange} className="h-full flex flex-col">
+ <div className="border-b bg-gray-50 px-3 py-2 flex-shrink-0">
+ <SignatureFieldsStatus />
+ <TabsList className="grid w-full h-8" style={{ gridTemplateColumns: `repeat(${allFiles.length}, 1fr)` }}>
+ {allFiles.map((file, index) => {
+ let tabId: string;
+ if (index === 0) {
+ tabId = 'main';
+ } else if (file.type === 'survey') {
+ tabId = 'survey';
+ } else {
+ const fileOnlyIndex = allFiles.slice(0, index).filter(f => f.type !== 'survey').length;
+ tabId = `file-${fileOnlyIndex}`;
+ }
+
+ return (
+ <TabsTrigger key={tabId} value={tabId} className="text-xs">
+ <div className="flex items-center space-x-1">
+ {file.type === 'survey' ? (
+ <ClipboardList className="h-3 w-3" />
+ ) : (
+ <FileText className="h-3 w-3" />
+ )}
+ <span className="truncate">{file.name}</span>
+ {file.type === 'survey' && surveyData.completed && (
+ <Badge variant="secondary" className="ml-1 h-4 px-1 text-xs">μ™„λ£Œ</Badge>
+ )}
+ </div>
+ </TabsTrigger>
+ );
+})}
+ </TabsList>
+ </div>
+
+ <div className="flex-1 min-h-0 overflow-hidden relative">
+ <div
+ className={`absolute inset-0 p-3 ${activeTab === 'survey' ? 'block' : 'hidden'}`}
+ >
+ <SurveyComponent />
+ </div>
+
+ <div
+ className={`absolute inset-0 ${activeTab !== 'survey' ? 'block' : 'hidden'}`}
+ >
+ <div
+ ref={viewer}
+ className="w-full h-full"
+ style={{ position: 'relative', minHeight: '400px' }}
+ >
+ {fileLoading && (
+ <div className="absolute inset-0 flex flex-col items-center justify-center bg-white z-10">
+ <Loader2 className="h-8 w-8 text-blue-500 animate-spin mb-4" />
+ <p className="text-sm text-muted-foreground">λ¬Έμ„œ λ‘œλ”© 쀑...</p>
+ </div>
+ )}
+ </div>
+ </div>
+ </div>
+ </Tabs>
+ ) : (
+ <div className="h-full w-full relative">
+ <div className="absolute top-2 left-2 z-10">
+ <SignatureFieldsStatus />
+ </div>
+ <div
+ ref={viewer}
+ className="absolute inset-0"
+ style={{ position: 'relative', minHeight: '400px' }}
+ >
{fileLoading && (
- <div className="flex flex-col items-center justify-center py-12">
+ <div className="absolute inset-0 flex flex-col items-center justify-center bg-white z-10">
<Loader2 className="h-8 w-8 text-blue-500 animate-spin mb-4" />
<p className="text-sm text-muted-foreground">λ¬Έμ„œ λ‘œλ”© 쀑...</p>
</div>
)}
</div>
</div>
- <DialogFooter>
- <Button variant="outline" onClick={handleClose} disabled={fileLoading}>
- μ·¨μ†Œ
- </Button>
- <Button onClick={handleSave} disabled={fileLoading}>
- μ„œλͺ… μ™„λ£Œ
- </Button>
- </DialogFooter>
- </DialogContent>
- </Dialog>
+ )}
+ </div>
);
}
+// λ‹€μ΄μ–Όλ‘œκ·Έ λ·°μ–΄ λ Œλ”λ§
+return (
+ <Dialog open={showDialog} onOpenChange={handleClose}>
+ <DialogContent className="w-[90vw] max-w-6xl h-[90vh] flex flex-col p-0">
+ <DialogHeader className="px-6 py-4 border-b flex-shrink-0">
+ <DialogTitle className="flex items-center justify-between">
+ <span>κΈ°λ³Έκ³„μ•½μ„œ μ„œλͺ…</span>
+ <SignatureFieldsStatus />
+ </DialogTitle>
+ <DialogDescription>
+ κ³„μ•½μ„œλ₯Ό ν™•μΈν•˜κ³  μ„œλͺ…을 μ§„ν–‰ν•΄μ£Όμ„Έμš”.
+ {isComplianceTemplate && (
+ <span className="block mt-1 text-amber-600">πŸ“‹ 쀀법 섀문쑰사λ₯Ό λ¨Όμ € μ™„λ£Œν•΄μ£Όμ„Έμš”.</span>
+ )}
+ {isNDATemplate && additionalFiles.length > 0 && (
+ <span className="block mt-1 text-blue-600">πŸ“Ž μ²¨λΆ€μ„œλ₯˜ {additionalFiles.length}개λ₯Ό 각 νƒ­μ—μ„œ ν™•μΈν•΄μ£Όμ„Έμš”.</span>
+ )}
+ {hasSignatureFields && (
+ <span className="block mt-1 text-green-600">
+ 🎯 μ„œλͺ… μœ„μΉ˜κ°€ μžλ™μœΌλ‘œ κ°μ§€λ˜μ—ˆμŠ΅λ‹ˆλ‹€.
+ {signatureFields.some(f => f.includes('_text')) && (
+ <span className="block text-sm text-amber-600">
+ πŸ’‘ 빨간색 ν…μŠ€νŠΈλ‘œ ν‘œμ‹œλœ μ˜μ—­μ„ μ°Ύμ•„ μ„œλͺ…ν•΄μ£Όμ„Έμš”.
+ </span>
+ )}
+ {signatureFields.some(f => f.startsWith('default_signature_')) && !signatureFields.some(f => f.includes('_text')) && (
+ <span className="block text-sm text-amber-600">
+ πŸ’‘ λ§ˆμ§€λ§‰ νŽ˜μ΄μ§€ ν•˜λ‹¨μ˜ 핑크색 μ˜μ—­μ—μ„œ μ„œλͺ…ν•΄μ£Όμ„Έμš”.
+ </span>
+ )}
+ </span>
+ )}
+ {autoSignError && (
+ <span className="block mt-1 text-red-600">⚠️ μžλ™ μ„œλͺ… ν•„λ“œ 생성 μ‹€νŒ¨ - μˆ˜λ™μœΌλ‘œ μ„œλͺ… μœ„μΉ˜λ₯Ό ν΄λ¦­ν•΄μ£Όμ„Έμš”.</span>
+ )}
+ </DialogDescription>
+ </DialogHeader>
+
+ <div className="flex-1 min-h-0 overflow-hidden">
+ {allFiles.length > 1 ? (
+ <Tabs value={activeTab} onValueChange={handleTabChange} className="h-full flex flex-col">
+ <div className="border-b bg-gray-50 px-3 py-2 flex-shrink-0">
+ <TabsList className="grid w-full h-8" style={{ gridTemplateColumns: `repeat(${allFiles.length}, 1fr)` }}>
+ {allFiles.map((file, index) => {
+ const tabId = index === 0 ? 'main' : file.type === 'survey' ? 'survey' : `file-${index}`;
+ return (
+ <TabsTrigger key={tabId} value={tabId} className="text-xs">
+ <div className="flex items-center space-x-1">
+ {file.type === 'survey' ? <ClipboardList className="h-3 w-3" /> : <FileText className="h-3 w-3" />}
+ <span className="truncate">{file.name}</span>
+ {file.type === 'survey' && surveyData.completed && (
+ <Badge variant="secondary" className="ml-1 h-4 px-1 text-xs">μ™„λ£Œ</Badge>
+ )}
+ </div>
+ </TabsTrigger>
+ );
+ })}
+ </TabsList>
+ </div>
+
+ <div className="flex-1 min-h-0 overflow-hidden relative">
+ <div className={`absolute inset-0 p-3 ${activeTab === 'survey' ? 'block' : 'hidden'}`}>
+ <SurveyComponent />
+ </div>
+
+ <div className={`absolute inset-0 ${activeTab !== 'survey' ? 'block' : 'hidden'}`}>
+ <div
+ ref={viewer}
+ className="w-full h-full"
+ style={{ position: 'relative', minHeight: '400px' }}
+ >
+ {fileLoading && (
+ <div className="absolute inset-0 flex flex-col items-center justify-center bg-white z-10">
+ <Loader2 className="h-8 w-8 text-blue-500 animate-spin mb-4" />
+ <p className="text-sm text-muted-foreground">λ¬Έμ„œ λ‘œλ”© 쀑...</p>
+ </div>
+ )}
+ </div>
+ </div>
+ </div>
+ </Tabs>
+ ) : (
+ <div className="h-full relative">
+ <div
+ ref={viewer}
+ className="absolute inset-0"
+ style={{ position: 'relative', minHeight: '400px' }}
+ >
+ {fileLoading && (
+ <div className="absolute inset-0 flex flex-col items-center justify-center bg-white z-10">
+ <Loader2 className="h-8 w-8 text-blue-500 animate-spin mb-4" />
+ <p className="text-sm text-muted-foreground">λ¬Έμ„œ λ‘œλ”© 쀑...</p>
+ </div>
+ )}
+ </div>
+ </div>
+ )}
+ </div>
+
+ <DialogFooter className="px-6 py-4 border-t bg-white flex-shrink-0">
+ <Button variant="outline" onClick={handleClose} disabled={fileLoading}>μ·¨μ†Œ</Button>
+ <Button onClick={handleSave} disabled={fileLoading || isAutoSignProcessing}>
+ <FileSignature className="h-4 w-4 mr-2" />
+ μ„œλͺ… μ™„λ£Œ
+ </Button>
+ </DialogFooter>
+ </DialogContent>
+ </Dialog>
+);
+}
+
// WebViewer 정리 ν•¨μˆ˜
const cleanupHtmlStyle = () => {
- // iframe μŠ€νƒ€μΌ 정리 (WebViewerκ°€ μΆ”κ°€ν•œ μŠ€νƒ€μΌ)
- const elements = document.querySelectorAll('.Document_container');
- elements.forEach((elem) => {
- elem.remove();
- });
+const elements = document.querySelectorAll('.Document_container');
+elements.forEach((elem) => {
+ elem.remove();
+});
}; \ No newline at end of file
generated by cgit v1.2.3 (git 2.39.1) at 2025-12-07 04:23:56 +0000