260322:1648 Correct Coresspondence / Doing RFA / Correct CI
This commit is contained in:
admin
@@ -1,18 +1,18 @@
|
||||
"use client";
|
||||
'use client';
|
||||
|
||||
import { CorrespondenceList } from "@/components/correspondences/list";
|
||||
import { Pagination } from "@/components/common/pagination";
|
||||
import { useCorrespondences } from "@/hooks/use-correspondence";
|
||||
import { useSearchParams } from "next/navigation";
|
||||
import { Loader2 } from "lucide-react";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import Link from "next/link";
|
||||
import { CorrespondenceList } from '@/components/correspondences/list';
|
||||
import { Pagination } from '@/components/common/pagination';
|
||||
import { useCorrespondences } from '@/hooks/use-correspondence';
|
||||
import { useSearchParams } from 'next/navigation';
|
||||
import { Loader2 } from 'lucide-react';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import Link from 'next/link';
|
||||
|
||||
export function CorrespondencesContent() {
|
||||
const searchParams = useSearchParams();
|
||||
const page = parseInt(searchParams.get("page") || "1");
|
||||
const status = searchParams.get("status") || undefined;
|
||||
const search = searchParams.get("search") || undefined;
|
||||
const page = Number(searchParams.get('page') || '1');
|
||||
const _status = searchParams.get('status') || undefined;
|
||||
const search = searchParams.get('search') || undefined;
|
||||
|
||||
const revisionStatus = (searchParams.get('revisionStatus') as 'CURRENT' | 'ALL' | 'OLD') || 'CURRENT';
|
||||
|
||||
@@ -31,28 +31,23 @@ export function CorrespondencesContent() {
|
||||
}
|
||||
|
||||
if (isError) {
|
||||
return (
|
||||
<div className="text-red-500 text-center py-8">
|
||||
Failed to load correspondences.
|
||||
</div>
|
||||
);
|
||||
return <div className="text-red-500 text-center py-8">Failed to load correspondences.</div>;
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="mb-4 flex gap-2">
|
||||
<div className="flex gap-1 bg-muted p-1 rounded-md">
|
||||
{['ALL', 'CURRENT', 'OLD'].map((status) => (
|
||||
<Link key={status} href={`?${new URLSearchParams({...Object.fromEntries(searchParams.entries()), revisionStatus: status, page: '1'}).toString()}`}>
|
||||
<Button
|
||||
variant={revisionStatus === status ? 'default' : 'ghost'}
|
||||
size="sm"
|
||||
className="text-xs px-3"
|
||||
>
|
||||
{status === 'CURRENT' ? 'Latest' : status === 'OLD' ? 'Previous' : 'All'}
|
||||
</Button>
|
||||
</Link>
|
||||
))}
|
||||
<div className="flex gap-1 bg-muted p-1 rounded-md">
|
||||
{['ALL', 'CURRENT', 'OLD'].map((status) => (
|
||||
<Link
|
||||
key={status}
|
||||
href={`?${new URLSearchParams({ ...Object.fromEntries(searchParams.entries()), revisionStatus: status, page: '1' }).toString()}`}
|
||||
>
|
||||
<Button variant={revisionStatus === status ? 'default' : 'ghost'} size="sm" className="text-xs px-3">
|
||||
{status === 'CURRENT' ? 'Latest' : status === 'OLD' ? 'Previous' : 'All'}
|
||||
</Button>
|
||||
</Link>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
<CorrespondenceList data={data?.data || []} />
|
||||
|
||||
@@ -1,16 +1,16 @@
|
||||
"use client";
|
||||
'use client';
|
||||
|
||||
import { Correspondence } from "@/types/correspondence";
|
||||
import { StatusBadge } from "@/components/common/status-badge";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
||||
import { format } from "date-fns";
|
||||
import { ArrowLeft, Download, FileText, Loader2, Send, CheckCircle, XCircle, Edit } from "lucide-react";
|
||||
import Link from "next/link";
|
||||
import { useSubmitCorrespondence, useProcessWorkflow } from "@/hooks/use-correspondence";
|
||||
import { useState } from "react";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import { Textarea } from "@/components/ui/textarea";
|
||||
import { Correspondence } from '@/types/correspondence';
|
||||
import { StatusBadge } from '@/components/common/status-badge';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
|
||||
import { format } from 'date-fns';
|
||||
import { ArrowLeft, Download, FileText, Loader2, Send, CheckCircle, XCircle, Edit } from 'lucide-react';
|
||||
import Link from 'next/link';
|
||||
import { useSubmitCorrespondence, useProcessWorkflow } from '@/hooks/use-correspondence';
|
||||
import { useState } from 'react';
|
||||
import { Label } from '@/components/ui/label';
|
||||
import { Textarea } from '@/components/ui/textarea';
|
||||
|
||||
interface CorrespondenceDetailProps {
|
||||
data: Correspondence;
|
||||
@@ -19,26 +19,26 @@ interface CorrespondenceDetailProps {
|
||||
export function CorrespondenceDetail({ data }: CorrespondenceDetailProps) {
|
||||
const submitMutation = useSubmitCorrespondence();
|
||||
const processMutation = useProcessWorkflow();
|
||||
const [actionState, setActionState] = useState<"approve" | "reject" | null>(null);
|
||||
const [comments, setComments] = useState("");
|
||||
const [actionState, setActionState] = useState<'approve' | 'reject' | null>(null);
|
||||
const [comments, setComments] = useState('');
|
||||
|
||||
if (!data) return <div>No data found</div>;
|
||||
|
||||
// Derive Current Revision Data
|
||||
const currentRevision = data.revisions?.find(r => r.isCurrent) || data.revisions?.[0];
|
||||
const subject = currentRevision?.subject || "-";
|
||||
const description = currentRevision?.description || "-";
|
||||
const status = currentRevision?.status?.statusCode || "UNKNOWN"; // e.g. DRAFT
|
||||
const currentRevision = data.revisions?.find((r) => r.isCurrent) || data.revisions?.[0];
|
||||
const subject = currentRevision?.subject || '-';
|
||||
const description = currentRevision?.description || '-';
|
||||
const status = currentRevision?.status?.statusCode || 'UNKNOWN'; // e.g. DRAFT
|
||||
const attachments = currentRevision?.attachments || [];
|
||||
|
||||
// Note: Importance might be in details
|
||||
const importance = currentRevision?.details?.importance || "NORMAL";
|
||||
const importance = currentRevision?.details?.importance || 'NORMAL';
|
||||
|
||||
const handleSubmit = () => {
|
||||
if (confirm("Are you sure you want to submit this correspondence?")) {
|
||||
if (confirm('Are you sure you want to submit this correspondence?')) {
|
||||
submitMutation.mutate({
|
||||
uuid: data.uuid,
|
||||
data: {}
|
||||
data: {},
|
||||
});
|
||||
}
|
||||
};
|
||||
@@ -46,19 +46,22 @@ export function CorrespondenceDetail({ data }: CorrespondenceDetailProps) {
|
||||
const handleProcess = () => {
|
||||
if (!actionState) return;
|
||||
|
||||
const action = actionState === "approve" ? "APPROVE" : "REJECT";
|
||||
processMutation.mutate({
|
||||
uuid: data.uuid,
|
||||
data: {
|
||||
action,
|
||||
comments
|
||||
const action = actionState === 'approve' ? 'APPROVE' : 'REJECT';
|
||||
processMutation.mutate(
|
||||
{
|
||||
uuid: data.uuid,
|
||||
data: {
|
||||
action,
|
||||
comments,
|
||||
},
|
||||
},
|
||||
{
|
||||
onSuccess: () => {
|
||||
setActionState(null);
|
||||
setComments('');
|
||||
},
|
||||
}
|
||||
}, {
|
||||
onSuccess: () => {
|
||||
setActionState(null);
|
||||
setComments("");
|
||||
}
|
||||
});
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
@@ -74,40 +77,38 @@ export function CorrespondenceDetail({ data }: CorrespondenceDetailProps) {
|
||||
<div>
|
||||
<h1 className="text-2xl font-bold">{data.correspondenceNumber}</h1>
|
||||
<p className="text-muted-foreground">
|
||||
Created on {data.createdAt ? format(new Date(data.createdAt), "dd MMM yyyy HH:mm") : '-'}
|
||||
Created on {data.createdAt ? format(new Date(data.createdAt), 'dd MMM yyyy HH:mm') : '-'}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
{/* EDIT BUTTON LOGIC: Show if DRAFT */}
|
||||
{status === "DRAFT" && (
|
||||
<Link href={`/correspondences/${data.uuid}/edit`}>
|
||||
<Button variant="outline">
|
||||
<Edit className="mr-2 h-4 w-4" />
|
||||
Edit
|
||||
</Button>
|
||||
</Link>
|
||||
{/* EDIT BUTTON LOGIC: Show if DRAFT */}
|
||||
{status === 'DRAFT' && (
|
||||
<Link href={`/correspondences/${data.uuid}/edit`}>
|
||||
<Button variant="outline">
|
||||
<Edit className="mr-2 h-4 w-4" />
|
||||
Edit
|
||||
</Button>
|
||||
</Link>
|
||||
)}
|
||||
|
||||
{status === "DRAFT" && (
|
||||
{status === 'DRAFT' && (
|
||||
<Button onClick={handleSubmit} disabled={submitMutation.isPending}>
|
||||
{submitMutation.isPending ? <Loader2 className="mr-2 h-4 w-4 animate-spin" /> : <Send className="mr-2 h-4 w-4" />}
|
||||
{submitMutation.isPending ? (
|
||||
<Loader2 className="mr-2 h-4 w-4 animate-spin" />
|
||||
) : (
|
||||
<Send className="mr-2 h-4 w-4" />
|
||||
)}
|
||||
Submit for Review
|
||||
</Button>
|
||||
)}
|
||||
{status === "IN_REVIEW" && (
|
||||
{status === 'IN_REVIEW' && (
|
||||
<>
|
||||
<Button
|
||||
variant="destructive"
|
||||
onClick={() => setActionState("reject")}
|
||||
>
|
||||
<Button variant="destructive" onClick={() => setActionState('reject')}>
|
||||
<XCircle className="mr-2 h-4 w-4" />
|
||||
Reject
|
||||
</Button>
|
||||
<Button
|
||||
className="bg-green-600 hover:bg-green-700"
|
||||
onClick={() => setActionState("approve")}
|
||||
>
|
||||
<Button className="bg-green-600 hover:bg-green-700" onClick={() => setActionState('approve')}>
|
||||
<CheckCircle className="mr-2 h-4 w-4" />
|
||||
Approve
|
||||
</Button>
|
||||
@@ -120,31 +121,33 @@ export function CorrespondenceDetail({ data }: CorrespondenceDetailProps) {
|
||||
{actionState && (
|
||||
<Card className="border-primary">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-lg">
|
||||
{actionState === "approve" ? "Confirm Approval" : "Confirm Rejection"}
|
||||
</CardTitle>
|
||||
<CardTitle className="text-lg">
|
||||
{actionState === 'approve' ? 'Confirm Approval' : 'Confirm Rejection'}
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-4">
|
||||
<div className="space-y-2">
|
||||
<Label>Comments</Label>
|
||||
<Textarea
|
||||
value={comments}
|
||||
onChange={(e) => setComments(e.target.value)}
|
||||
placeholder="Enter comments..."
|
||||
/>
|
||||
</div>
|
||||
<div className="flex justify-end gap-2">
|
||||
<Button variant="ghost" onClick={() => setActionState(null)}>Cancel</Button>
|
||||
<Button
|
||||
variant={actionState === "approve" ? "default" : "destructive"}
|
||||
onClick={handleProcess}
|
||||
disabled={processMutation.isPending}
|
||||
className={actionState === "approve" ? "bg-green-600 hover:bg-green-700" : ""}
|
||||
>
|
||||
{processMutation.isPending && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
|
||||
Confirm {actionState === "approve" ? "Approve" : "Reject"}
|
||||
</Button>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label>Comments</Label>
|
||||
<Textarea
|
||||
value={comments}
|
||||
onChange={(e) => setComments(e.target.value)}
|
||||
placeholder="Enter comments..."
|
||||
/>
|
||||
</div>
|
||||
<div className="flex justify-end gap-2">
|
||||
<Button variant="ghost" onClick={() => setActionState(null)}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button
|
||||
variant={actionState === 'approve' ? 'default' : 'destructive'}
|
||||
onClick={handleProcess}
|
||||
disabled={processMutation.isPending}
|
||||
className={actionState === 'approve' ? 'bg-green-600 hover:bg-green-700' : ''}
|
||||
>
|
||||
{processMutation.isPending && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
|
||||
Confirm {actionState === 'approve' ? 'Approve' : 'Reject'}
|
||||
</Button>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
)}
|
||||
@@ -162,9 +165,7 @@ export function CorrespondenceDetail({ data }: CorrespondenceDetailProps) {
|
||||
<CardContent className="space-y-6">
|
||||
<div>
|
||||
<h3 className="font-semibold mb-2">Description</h3>
|
||||
<p className="text-gray-700 whitespace-pre-wrap">
|
||||
{description}
|
||||
</p>
|
||||
<p className="text-gray-700 whitespace-pre-wrap">{description}</p>
|
||||
</div>
|
||||
|
||||
{currentRevision?.body && (
|
||||
@@ -179,9 +180,7 @@ export function CorrespondenceDetail({ data }: CorrespondenceDetailProps) {
|
||||
{currentRevision?.remarks && (
|
||||
<div>
|
||||
<h3 className="font-semibold mb-2">Remarks</h3>
|
||||
<p className="text-gray-600 italic">
|
||||
{currentRevision.remarks}
|
||||
</p>
|
||||
<p className="text-gray-600 italic">{currentRevision.remarks}</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -226,10 +225,16 @@ export function CorrespondenceDetail({ data }: CorrespondenceDetailProps) {
|
||||
<div>
|
||||
<p className="text-sm font-medium text-muted-foreground">Importance</p>
|
||||
<div className="mt-1">
|
||||
<span className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium
|
||||
${importance === 'URGENT' ? 'bg-red-100 text-red-800' :
|
||||
importance === 'HIGH' ? 'bg-orange-100 text-orange-800' :
|
||||
'bg-blue-100 text-blue-800'}`}>
|
||||
<span
|
||||
className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium
|
||||
${
|
||||
importance === 'URGENT'
|
||||
? 'bg-red-100 text-red-800'
|
||||
: importance === 'HIGH'
|
||||
? 'bg-orange-100 text-orange-800'
|
||||
: 'bg-blue-100 text-blue-800'
|
||||
}`}
|
||||
>
|
||||
{String(importance)}
|
||||
</span>
|
||||
</div>
|
||||
@@ -243,7 +248,7 @@ export function CorrespondenceDetail({ data }: CorrespondenceDetailProps) {
|
||||
<p className="text-xs text-muted-foreground">{data.originator?.organizationCode || '-'}</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div>
|
||||
<p className="text-sm font-medium text-muted-foreground">Project</p>
|
||||
<p className="font-medium mt-1">{data.project?.projectName || '-'}</p>
|
||||
<p className="text-xs text-muted-foreground">{data.project?.projectCode || '-'}</p>
|
||||
|
||||
@@ -1,36 +1,30 @@
|
||||
"use client";
|
||||
'use client';
|
||||
|
||||
import { useForm } from "react-hook-form";
|
||||
import { zodResolver } from "@hookform/resolvers/zod";
|
||||
import { z } from "zod";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Input } from "@/components/ui/input";
|
||||
import { Textarea } from "@/components/ui/textarea";
|
||||
import { Label } from "@/components/ui/label";
|
||||
import {
|
||||
Select,
|
||||
SelectContent,
|
||||
SelectItem,
|
||||
SelectTrigger,
|
||||
SelectValue,
|
||||
} from "@/components/ui/select";
|
||||
import { FileUploadZone } from "@/components/custom/file-upload-zone";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { Loader2 } from "lucide-react";
|
||||
import { useCreateCorrespondence, useUpdateCorrespondence } from "@/hooks/use-correspondence";
|
||||
import { Organization } from "@/types/organization";
|
||||
import { useOrganizations, useProjects, useCorrespondenceTypes, useDisciplines } from "@/hooks/use-master-data";
|
||||
import { CreateCorrespondenceDto } from "@/types/dto/correspondence/create-correspondence.dto";
|
||||
import { useState, useEffect } from "react";
|
||||
import { correspondenceService } from "@/lib/services/correspondence.service";
|
||||
import { numberingApi } from "@/lib/api/numbering";
|
||||
import { useForm, Resolver } from 'react-hook-form';
|
||||
import { zodResolver } from '@hookform/resolvers/zod';
|
||||
import { z } from 'zod';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { Textarea } from '@/components/ui/textarea';
|
||||
import { Label } from '@/components/ui/label';
|
||||
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select';
|
||||
import { FileUploadZone } from '@/components/custom/file-upload-zone';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { Loader2 } from 'lucide-react';
|
||||
import { useCreateCorrespondence, useUpdateCorrespondence } from '@/hooks/use-correspondence';
|
||||
import { Organization } from '@/types/organization';
|
||||
import { useOrganizations, useProjects, useCorrespondenceTypes, useDisciplines } from '@/hooks/use-master-data';
|
||||
import { CreateCorrespondenceDto } from '@/types/dto/correspondence/create-correspondence.dto';
|
||||
import { useState, useEffect } from 'react';
|
||||
import { correspondenceService as _correspondenceService } from '@/lib/services/correspondence.service';
|
||||
import { numberingApi } from '@/lib/api/numbering';
|
||||
|
||||
// Updated Zod Schema with all required fields
|
||||
const correspondenceSchema = z.object({
|
||||
projectId: z.string().min(1, "Please select a Project"),
|
||||
documentTypeId: z.number().min(1, "Please select a Document Type"),
|
||||
projectId: z.string().min(1, 'Please select a Project'),
|
||||
documentTypeId: z.number().min(1, 'Please select a Document Type'),
|
||||
disciplineId: z.number().optional(),
|
||||
subject: z.string().min(5, "Subject must be at least 5 characters"),
|
||||
subject: z.string().min(5, 'Subject must be at least 5 characters'),
|
||||
description: z.string().optional(),
|
||||
body: z.string().optional(),
|
||||
remarks: z.string().optional(),
|
||||
@@ -38,9 +32,9 @@ const correspondenceSchema = z.object({
|
||||
documentDate: z.string().optional(),
|
||||
issuedDate: z.string().optional(),
|
||||
receivedDate: z.string().optional(),
|
||||
fromOrganizationId: z.string().min(1, "Please select From Organization"),
|
||||
toOrganizationId: z.string().min(1, "Please select To Organization"),
|
||||
importance: z.enum(["NORMAL", "HIGH", "URGENT"]),
|
||||
fromOrganizationId: z.string().min(1, 'Please select From Organization'),
|
||||
toOrganizationId: z.string().min(1, 'Please select To Organization'),
|
||||
importance: z.enum(['NORMAL', 'HIGH', 'URGENT']),
|
||||
attachments: z.array(z.instanceof(File)).optional(),
|
||||
});
|
||||
|
||||
@@ -59,11 +53,37 @@ type CorrespondenceTypeOption = {
|
||||
typeCode: string;
|
||||
};
|
||||
|
||||
type DisciplineOption = {
|
||||
interface DisciplineOption {
|
||||
id: number;
|
||||
disciplineCode: string;
|
||||
codeNameEn?: string;
|
||||
};
|
||||
}
|
||||
|
||||
interface InitialCorrespondenceData {
|
||||
projectId?: number | string;
|
||||
project?: { uuid?: string };
|
||||
correspondenceTypeId?: number;
|
||||
disciplineId?: number;
|
||||
revisions?: Array<{
|
||||
isCurrent?: boolean;
|
||||
subject?: string;
|
||||
title?: string;
|
||||
description?: string;
|
||||
body?: string;
|
||||
remarks?: string;
|
||||
dueDate?: string;
|
||||
documentDate?: string;
|
||||
issuedDate?: string;
|
||||
receivedDate?: string;
|
||||
details?: { importance: 'NORMAL' | 'HIGH' | 'URGENT' };
|
||||
}>;
|
||||
originatorId?: number;
|
||||
recipients?: Array<{
|
||||
recipientType: string;
|
||||
recipientOrganizationId: number;
|
||||
}>;
|
||||
correspondenceNumber?: string;
|
||||
}
|
||||
|
||||
const extractArrayData = <T,>(value: unknown): T[] => {
|
||||
let current: unknown = value;
|
||||
@@ -73,7 +93,7 @@ const extractArrayData = <T,>(value: unknown): T[] => {
|
||||
return current as T[];
|
||||
}
|
||||
|
||||
if (!current || typeof current !== "object" || !("data" in current)) {
|
||||
if (!current || typeof current !== 'object' || !('data' in current)) {
|
||||
return [];
|
||||
}
|
||||
|
||||
@@ -83,7 +103,7 @@ const extractArrayData = <T,>(value: unknown): T[] => {
|
||||
return Array.isArray(current) ? (current as T[]) : [];
|
||||
};
|
||||
|
||||
export function CorrespondenceForm({ initialData, uuid }: { initialData?: any, uuid?: string }) {
|
||||
export function CorrespondenceForm({ initialData, uuid }: { initialData?: InitialCorrespondenceData; uuid?: string }) {
|
||||
const router = useRouter();
|
||||
const createMutation = useCreateCorrespondence();
|
||||
const updateMutation = useUpdateCorrespondence();
|
||||
@@ -99,26 +119,26 @@ export function CorrespondenceForm({ initialData, uuid }: { initialData?: any, u
|
||||
const disciplines = extractArrayData<DisciplineOption>(disciplinesData);
|
||||
|
||||
// Extract initial values if editing
|
||||
const currentRev = initialData?.revisions?.find((r: any) => r.isCurrent) || initialData?.revisions?.[0];
|
||||
const currentRev = initialData?.revisions?.find((r) => r.isCurrent) || initialData?.revisions?.[0];
|
||||
const defaultValues: Partial<FormData> = {
|
||||
projectId: initialData?.project?.uuid || (initialData?.projectId ? String(initialData.projectId) : undefined),
|
||||
documentTypeId: initialData?.correspondenceTypeId || undefined,
|
||||
disciplineId: initialData?.disciplineId || undefined,
|
||||
subject: currentRev?.subject || currentRev?.title || "",
|
||||
description: currentRev?.description || "",
|
||||
body: currentRev?.body || "",
|
||||
remarks: currentRev?.remarks || "",
|
||||
subject: currentRev?.subject || currentRev?.title || '',
|
||||
description: currentRev?.description || '',
|
||||
body: currentRev?.body || '',
|
||||
remarks: currentRev?.remarks || '',
|
||||
dueDate: currentRev?.dueDate ? new Date(currentRev.dueDate).toISOString().split('T')[0] : undefined,
|
||||
documentDate: currentRev?.documentDate ? new Date(currentRev.documentDate).toISOString().split('T')[0] : undefined,
|
||||
issuedDate: currentRev?.issuedDate ? new Date(currentRev.issuedDate).toISOString().split('T')[0] : undefined,
|
||||
receivedDate: currentRev?.receivedDate ? new Date(currentRev.receivedDate).toISOString().split('T')[0] : undefined,
|
||||
fromOrganizationId: initialData?.originatorId ? String(initialData.originatorId) : undefined,
|
||||
// Map initial recipient (TO) - Simplified for now
|
||||
toOrganizationId: initialData?.recipients?.find((r: any) => r.recipientType === 'TO')?.recipientOrganizationId
|
||||
? String(initialData.recipients.find((r: any) => r.recipientType === 'TO').recipientOrganizationId)
|
||||
toOrganizationId: initialData?.recipients?.find((r) => r.recipientType === 'TO')?.recipientOrganizationId
|
||||
? String(initialData.recipients.find((r) => r.recipientType === 'TO')?.recipientOrganizationId)
|
||||
: undefined,
|
||||
importance: currentRev?.details?.importance || "NORMAL",
|
||||
};
|
||||
importance: currentRev?.details?.importance || 'NORMAL',
|
||||
} as Partial<FormData>;
|
||||
|
||||
const {
|
||||
register,
|
||||
@@ -127,17 +147,17 @@ export function CorrespondenceForm({ initialData, uuid }: { initialData?: any, u
|
||||
watch,
|
||||
formState: { errors },
|
||||
} = useForm<FormData>({
|
||||
// @ts-ignore: Zod version mismatch in monorepo
|
||||
resolver: zodResolver(correspondenceSchema) as any,
|
||||
// @ts-ignore: Zod version mismatch
|
||||
resolver: zodResolver(correspondenceSchema) as unknown as Resolver<FormData>,
|
||||
defaultValues: defaultValues as FormData,
|
||||
});
|
||||
|
||||
// Watch for controlled inputs
|
||||
const projectId = watch("projectId");
|
||||
const documentTypeId = watch("documentTypeId");
|
||||
const disciplineId = watch("disciplineId");
|
||||
const fromOrgId = watch("fromOrganizationId");
|
||||
const toOrgId = watch("toOrganizationId");
|
||||
const projectId = watch('projectId');
|
||||
const documentTypeId = watch('documentTypeId');
|
||||
const disciplineId = watch('disciplineId');
|
||||
const fromOrgId = watch('fromOrganizationId');
|
||||
const toOrgId = watch('toOrganizationId');
|
||||
|
||||
const onSubmit = (data: FormData) => {
|
||||
const payload: CreateCorrespondenceDto = {
|
||||
@@ -153,24 +173,25 @@ export function CorrespondenceForm({ initialData, uuid }: { initialData?: any, u
|
||||
issuedDate: data.issuedDate ? new Date(data.issuedDate).toISOString() : undefined,
|
||||
receivedDate: data.receivedDate ? new Date(data.receivedDate).toISOString() : undefined,
|
||||
originatorId: data.fromOrganizationId,
|
||||
recipients: [
|
||||
{ organizationId: data.toOrganizationId, type: 'TO' }
|
||||
],
|
||||
recipients: [{ organizationId: data.toOrganizationId, type: 'TO' }],
|
||||
details: {
|
||||
importance: data.importance
|
||||
importance: data.importance,
|
||||
},
|
||||
};
|
||||
|
||||
if (uuid && initialData) {
|
||||
// UPDATE Mode
|
||||
updateMutation.mutate({ uuid, data: payload }, {
|
||||
onSuccess: () => router.push(`/correspondences/${uuid}`)
|
||||
});
|
||||
// UPDATE Mode
|
||||
updateMutation.mutate(
|
||||
{ uuid, data: payload },
|
||||
{
|
||||
onSuccess: () => router.push(`/correspondences/${uuid}`),
|
||||
}
|
||||
);
|
||||
} else {
|
||||
// CREATE Mode
|
||||
createMutation.mutate(payload, {
|
||||
onSuccess: () => router.push("/correspondences"),
|
||||
});
|
||||
// CREATE Mode
|
||||
createMutation.mutate(payload, {
|
||||
onSuccess: () => router.push('/correspondences'),
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
@@ -181,31 +202,29 @@ export function CorrespondenceForm({ initialData, uuid }: { initialData?: any, u
|
||||
|
||||
useEffect(() => {
|
||||
if (!projectId || !documentTypeId || !fromOrgId || !toOrgId) {
|
||||
setPreview(null);
|
||||
return;
|
||||
setPreview(null);
|
||||
return;
|
||||
}
|
||||
|
||||
const fetchPreview = async () => {
|
||||
try {
|
||||
const res = await numberingApi.previewNumber({
|
||||
projectId,
|
||||
correspondenceTypeId: documentTypeId,
|
||||
disciplineId,
|
||||
originatorOrganizationId: fromOrgId,
|
||||
recipientOrganizationId: toOrgId
|
||||
});
|
||||
setPreview({ number: res.previewNumber, isDefaultTemplate: res.isDefault });
|
||||
} catch (err) {
|
||||
setPreview(null);
|
||||
}
|
||||
try {
|
||||
const res = await numberingApi.previewNumber({
|
||||
projectId,
|
||||
correspondenceTypeId: documentTypeId,
|
||||
disciplineId,
|
||||
originatorOrganizationId: fromOrgId,
|
||||
recipientOrganizationId: toOrgId,
|
||||
});
|
||||
setPreview({ number: res.previewNumber, isDefaultTemplate: res.isDefault });
|
||||
} catch (_err) {
|
||||
setPreview(null);
|
||||
}
|
||||
};
|
||||
|
||||
const timer = setTimeout(fetchPreview, 500);
|
||||
return () => clearTimeout(timer);
|
||||
}, [projectId, documentTypeId, disciplineId, fromOrgId, toOrgId]);
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<form onSubmit={handleSubmit(onSubmit)} className="max-w-3xl space-y-6">
|
||||
{/* Existing Document Number (Read Only) */}
|
||||
@@ -213,42 +232,49 @@ export function CorrespondenceForm({ initialData, uuid }: { initialData?: any, u
|
||||
<div className="space-y-2">
|
||||
<Label>Current Document Number</Label>
|
||||
<div className="flex items-center gap-2">
|
||||
<Input value={initialData.correspondenceNumber} disabled readOnly className="bg-muted font-mono font-bold text-lg w-full" />
|
||||
{preview && preview.number !== initialData.correspondenceNumber && (
|
||||
<span className="text-xs text-amber-600 font-semibold whitespace-nowrap px-2">
|
||||
Start Change Detected
|
||||
</span>
|
||||
)}
|
||||
<Input
|
||||
value={initialData.correspondenceNumber}
|
||||
disabled
|
||||
readOnly
|
||||
className="bg-muted font-mono font-bold text-lg w-full"
|
||||
/>
|
||||
{preview && preview.number !== initialData.correspondenceNumber && (
|
||||
<span className="text-xs text-amber-600 font-semibold whitespace-nowrap px-2">Start Change Detected</span>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Preview Section */}
|
||||
{preview && (
|
||||
<div className={`p-4 rounded-md border ${preview.number !== initialData?.correspondenceNumber ? 'bg-amber-50 border-amber-200' : 'bg-muted border-border'}`}>
|
||||
<p className="text-sm font-semibold mb-1 flex items-center gap-2">
|
||||
{initialData?.correspondenceNumber ? "New Document Number (Preview)" : "Document Number Preview"}
|
||||
{preview.number !== initialData?.correspondenceNumber && initialData?.correspondenceNumber && (
|
||||
<span className="text-[10px] bg-amber-100 text-amber-700 px-2 py-0.5 rounded-full border border-amber-200">
|
||||
Will Update
|
||||
</span>
|
||||
)}
|
||||
</p>
|
||||
<div className="flex items-center gap-3">
|
||||
<span className={`text-xl font-bold font-mono tracking-wide ${preview.number !== initialData?.correspondenceNumber ? 'text-amber-700' : 'text-primary'}`}>
|
||||
{preview.number}
|
||||
</span>
|
||||
{preview.isDefaultTemplate && (
|
||||
<span className="text-[10px] uppercase font-semibold px-2 py-0.5 rounded-full bg-yellow-100 text-yellow-800 border border-yellow-200">
|
||||
Default Template
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
{preview.number !== initialData?.correspondenceNumber && initialData?.correspondenceNumber && (
|
||||
<p className="text-xs text-muted-foreground mt-2">
|
||||
* The document number will be regenerated because critical fields were changed.
|
||||
</p>
|
||||
)}
|
||||
<div
|
||||
className={`p-4 rounded-md border ${preview.number !== initialData?.correspondenceNumber ? 'bg-amber-50 border-amber-200' : 'bg-muted border-border'}`}
|
||||
>
|
||||
<p className="text-sm font-semibold mb-1 flex items-center gap-2">
|
||||
{initialData?.correspondenceNumber ? 'New Document Number (Preview)' : 'Document Number Preview'}
|
||||
{preview.number !== initialData?.correspondenceNumber && initialData?.correspondenceNumber && (
|
||||
<span className="text-[10px] bg-amber-100 text-amber-700 px-2 py-0.5 rounded-full border border-amber-200">
|
||||
Will Update
|
||||
</span>
|
||||
)}
|
||||
</p>
|
||||
<div className="flex items-center gap-3">
|
||||
<span
|
||||
className={`text-xl font-bold font-mono tracking-wide ${preview.number !== initialData?.correspondenceNumber ? 'text-amber-700' : 'text-primary'}`}
|
||||
>
|
||||
{preview.number}
|
||||
</span>
|
||||
{preview.isDefaultTemplate && (
|
||||
<span className="text-[10px] uppercase font-semibold px-2 py-0.5 rounded-full bg-yellow-100 text-yellow-800 border border-yellow-200">
|
||||
Default Template
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
{preview.number !== initialData?.correspondenceNumber && initialData?.correspondenceNumber && (
|
||||
<p className="text-xs text-muted-foreground mt-2">
|
||||
* The document number will be regenerated because critical fields were changed.
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -258,12 +284,12 @@ export function CorrespondenceForm({ initialData, uuid }: { initialData?: any, u
|
||||
<div className="space-y-2">
|
||||
<Label>Project *</Label>
|
||||
<Select
|
||||
onValueChange={(v) => setValue("projectId", v)}
|
||||
onValueChange={(v) => setValue('projectId', v)}
|
||||
value={projectId || undefined}
|
||||
disabled={isLoadingProjects}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder={isLoadingProjects ? "Loading..." : "Select Project"} />
|
||||
<SelectValue placeholder={isLoadingProjects ? 'Loading...' : 'Select Project'} />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{projects.map((p) => (
|
||||
@@ -273,21 +299,19 @@ export function CorrespondenceForm({ initialData, uuid }: { initialData?: any, u
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
{errors.projectId && (
|
||||
<p className="text-sm text-destructive">{errors.projectId.message}</p>
|
||||
)}
|
||||
{errors.projectId && <p className="text-sm text-destructive">{errors.projectId.message}</p>}
|
||||
</div>
|
||||
|
||||
{/* Document Type Dropdown */}
|
||||
<div className="space-y-2">
|
||||
<Label>Document Type *</Label>
|
||||
<Select
|
||||
onValueChange={(v) => setValue("documentTypeId", parseInt(v))}
|
||||
onValueChange={(v) => setValue('documentTypeId', Number(v))}
|
||||
value={documentTypeId ? String(documentTypeId) : undefined}
|
||||
disabled={isLoadingTypes}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder={isLoadingTypes ? "Loading..." : "Select Type"} />
|
||||
<SelectValue placeholder={isLoadingTypes ? 'Loading...' : 'Select Type'} />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{correspondenceTypes.map((t) => (
|
||||
@@ -297,21 +321,19 @@ export function CorrespondenceForm({ initialData, uuid }: { initialData?: any, u
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
{errors.documentTypeId && (
|
||||
<p className="text-sm text-destructive">{errors.documentTypeId.message}</p>
|
||||
)}
|
||||
{errors.documentTypeId && <p className="text-sm text-destructive">{errors.documentTypeId.message}</p>}
|
||||
</div>
|
||||
|
||||
{/* Discipline Dropdown (Optional) */}
|
||||
<div className="space-y-2">
|
||||
<Label>Discipline</Label>
|
||||
<Select
|
||||
onValueChange={(v) => setValue("disciplineId", v ? parseInt(v) : undefined)}
|
||||
onValueChange={(v) => setValue('disciplineId', v ? Number(v) : undefined)}
|
||||
value={disciplineId ? String(disciplineId) : undefined}
|
||||
disabled={isLoadingDisciplines}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder={isLoadingDisciplines ? "Loading..." : "Select Discipline (Optional)"} />
|
||||
<SelectValue placeholder={isLoadingDisciplines ? 'Loading...' : 'Select Discipline (Optional)'} />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{disciplines.map((d) => (
|
||||
@@ -327,88 +349,76 @@ export function CorrespondenceForm({ initialData, uuid }: { initialData?: any, u
|
||||
{/* Subject */}
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="subject">Subject *</Label>
|
||||
<Input id="subject" {...register("subject")} placeholder="Enter subject" />
|
||||
{errors.subject && (
|
||||
<p className="text-sm text-destructive">{errors.subject.message}</p>
|
||||
)}
|
||||
<Input id="subject" {...register('subject')} placeholder="Enter subject" />
|
||||
{errors.subject && <p className="text-sm text-destructive">{errors.subject.message}</p>}
|
||||
</div>
|
||||
|
||||
{/* Body */}
|
||||
<div className="space-y-2">
|
||||
{/* Body */}
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="body">Body (Content)</Label>
|
||||
<Textarea
|
||||
id="body"
|
||||
{...register("body")}
|
||||
rows={6}
|
||||
placeholder="Enter letter content..."
|
||||
/>
|
||||
<Textarea id="body" {...register('body')} rows={6} placeholder="Enter letter content..." />
|
||||
</div>
|
||||
|
||||
{/* Date Fields */}
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="documentDate">Document Date</Label>
|
||||
<Input
|
||||
id="documentDate"
|
||||
type="date"
|
||||
{...register("documentDate")}
|
||||
onChange={(e) => {
|
||||
const val = e.target.value;
|
||||
setValue("documentDate", val, { shouldValidate: true, shouldDirty: true });
|
||||
if (val) {
|
||||
setValue("issuedDate", val, { shouldValidate: true, shouldDirty: true });
|
||||
setValue("receivedDate", val, { shouldValidate: true, shouldDirty: true });
|
||||
const d = new Date(val);
|
||||
d.setDate(d.getDate() + 7);
|
||||
setValue("dueDate", d.toISOString().split('T')[0], { shouldValidate: true, shouldDirty: true });
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="issuedDate">Issued Date</Label>
|
||||
<Input id="issuedDate" type="date" {...register("issuedDate")} />
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="receivedDate">Received Date</Label>
|
||||
<Input
|
||||
id="receivedDate"
|
||||
type="date"
|
||||
{...register("receivedDate")}
|
||||
onChange={(e) => {
|
||||
const val = e.target.value;
|
||||
setValue("receivedDate", val, { shouldValidate: true, shouldDirty: true });
|
||||
if (val) {
|
||||
const d = new Date(val);
|
||||
d.setDate(d.getDate() + 7);
|
||||
setValue("dueDate", d.toISOString().split('T')[0], { shouldValidate: true, shouldDirty: true });
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="dueDate">Due Date</Label>
|
||||
<Input id="dueDate" type="date" {...register("dueDate")} />
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="documentDate">Document Date</Label>
|
||||
<Input
|
||||
id="documentDate"
|
||||
type="date"
|
||||
{...register('documentDate')}
|
||||
onChange={(e) => {
|
||||
const val = e.target.value;
|
||||
setValue('documentDate', val, { shouldValidate: true, shouldDirty: true });
|
||||
if (val) {
|
||||
setValue('issuedDate', val, { shouldValidate: true, shouldDirty: true });
|
||||
setValue('receivedDate', val, { shouldValidate: true, shouldDirty: true });
|
||||
const d = new Date(val);
|
||||
d.setDate(d.getDate() + 7);
|
||||
setValue('dueDate', d.toISOString().split('T')[0], { shouldValidate: true, shouldDirty: true });
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="issuedDate">Issued Date</Label>
|
||||
<Input id="issuedDate" type="date" {...register('issuedDate')} />
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="receivedDate">Received Date</Label>
|
||||
<Input
|
||||
id="receivedDate"
|
||||
type="date"
|
||||
{...register('receivedDate')}
|
||||
onChange={(e) => {
|
||||
const val = e.target.value;
|
||||
setValue('receivedDate', val, { shouldValidate: true, shouldDirty: true });
|
||||
if (val) {
|
||||
const d = new Date(val);
|
||||
d.setDate(d.getDate() + 7);
|
||||
setValue('dueDate', d.toISOString().split('T')[0], { shouldValidate: true, shouldDirty: true });
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="dueDate">Due Date</Label>
|
||||
<Input id="dueDate" type="date" {...register('dueDate')} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Remarks */}
|
||||
<div className="grid grid-cols-1 gap-4">
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="remarks">Remarks</Label>
|
||||
<Input id="remarks" {...register("remarks")} placeholder="Optional remarks" />
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="remarks">Remarks</Label>
|
||||
<Input id="remarks" {...register('remarks')} placeholder="Optional remarks" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Description */}
|
||||
<div className="space-y-2">
|
||||
<Label htmlFor="description">Description (Internal Note)</Label>
|
||||
<Textarea
|
||||
id="description"
|
||||
{...register("description")}
|
||||
rows={2}
|
||||
placeholder="Enter description..."
|
||||
/>
|
||||
<Textarea id="description" {...register('description')} rows={2} placeholder="Enter description..." />
|
||||
</div>
|
||||
|
||||
{/* Organizations */}
|
||||
@@ -416,12 +426,12 @@ export function CorrespondenceForm({ initialData, uuid }: { initialData?: any, u
|
||||
<div className="space-y-2">
|
||||
<Label>From Organization *</Label>
|
||||
<Select
|
||||
onValueChange={(v) => setValue("fromOrganizationId", v)}
|
||||
onValueChange={(v) => setValue('fromOrganizationId', v)}
|
||||
value={fromOrgId || undefined}
|
||||
disabled={isLoadingOrgs}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder={isLoadingOrgs ? "Loading..." : "Select Organization"} />
|
||||
<SelectValue placeholder={isLoadingOrgs ? 'Loading...' : 'Select Organization'} />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{organizationOptions.map((org) => (
|
||||
@@ -431,20 +441,18 @@ export function CorrespondenceForm({ initialData, uuid }: { initialData?: any, u
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
{errors.fromOrganizationId && (
|
||||
<p className="text-sm text-destructive">{errors.fromOrganizationId.message}</p>
|
||||
)}
|
||||
{errors.fromOrganizationId && <p className="text-sm text-destructive">{errors.fromOrganizationId.message}</p>}
|
||||
</div>
|
||||
|
||||
<div className="space-y-2">
|
||||
<Label>To Organization *</Label>
|
||||
<Select
|
||||
onValueChange={(v) => setValue("toOrganizationId", v)}
|
||||
onValueChange={(v) => setValue('toOrganizationId', v)}
|
||||
value={toOrgId || undefined}
|
||||
disabled={isLoadingOrgs}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue placeholder={isLoadingOrgs ? "Loading..." : "Select Organization"} />
|
||||
<SelectValue placeholder={isLoadingOrgs ? 'Loading...' : 'Select Organization'} />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
{organizationOptions.map((org) => (
|
||||
@@ -454,9 +462,7 @@ export function CorrespondenceForm({ initialData, uuid }: { initialData?: any, u
|
||||
))}
|
||||
</SelectContent>
|
||||
</Select>
|
||||
{errors.toOrganizationId && (
|
||||
<p className="text-sm text-destructive">{errors.toOrganizationId.message}</p>
|
||||
)}
|
||||
{errors.toOrganizationId && <p className="text-sm text-destructive">{errors.toOrganizationId.message}</p>}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -465,30 +471,15 @@ export function CorrespondenceForm({ initialData, uuid }: { initialData?: any, u
|
||||
<Label>Importance</Label>
|
||||
<div className="flex gap-6 mt-2">
|
||||
<label className="flex items-center space-x-2 cursor-pointer">
|
||||
<input
|
||||
type="radio"
|
||||
value="NORMAL"
|
||||
{...register("importance")}
|
||||
className="accent-primary"
|
||||
/>
|
||||
<input type="radio" value="NORMAL" {...register('importance')} className="accent-primary" />
|
||||
<span>Normal</span>
|
||||
</label>
|
||||
<label className="flex items-center space-x-2 cursor-pointer">
|
||||
<input
|
||||
type="radio"
|
||||
value="HIGH"
|
||||
{...register("importance")}
|
||||
className="accent-primary"
|
||||
/>
|
||||
<input type="radio" value="HIGH" {...register('importance')} className="accent-primary" />
|
||||
<span>High</span>
|
||||
</label>
|
||||
<label className="flex items-center space-x-2 cursor-pointer">
|
||||
<input
|
||||
type="radio"
|
||||
value="URGENT"
|
||||
{...register("importance")}
|
||||
className="accent-primary"
|
||||
/>
|
||||
<input type="radio" value="URGENT" {...register('importance')} className="accent-primary" />
|
||||
<span>Urgent</span>
|
||||
</label>
|
||||
</div>
|
||||
@@ -499,9 +490,9 @@ export function CorrespondenceForm({ initialData, uuid }: { initialData?: any, u
|
||||
<div className="space-y-2">
|
||||
<Label>Attachments</Label>
|
||||
<FileUploadZone
|
||||
onFilesChanged={(files) => setValue("attachments", files)}
|
||||
onFilesChanged={(files) => setValue('attachments', files)}
|
||||
multiple
|
||||
accept={[".pdf", ".doc", ".docx", ".xls", ".xlsx", ".jpg", ".png"]}
|
||||
accept={['.pdf', '.doc', '.docx', '.xls', '.xlsx', '.jpg', '.png']}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
@@ -513,7 +504,7 @@ export function CorrespondenceForm({ initialData, uuid }: { initialData?: any, u
|
||||
</Button>
|
||||
<Button type="submit" disabled={isPending}>
|
||||
{isPending && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
|
||||
{uuid ? "Update Correspondence" : "Create Correspondence"}
|
||||
{uuid ? 'Update Correspondence' : 'Create Correspondence'}
|
||||
</Button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
@@ -1,13 +1,13 @@
|
||||
"use client";
|
||||
'use client';
|
||||
|
||||
import { CorrespondenceRevision } from "@/types/correspondence";
|
||||
import { DataTable } from "@/components/common/data-table";
|
||||
import { ColumnDef } from "@tanstack/react-table";
|
||||
import { StatusBadge } from "@/components/common/status-badge";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Eye, Edit, FileText } from "lucide-react";
|
||||
import Link from "next/link";
|
||||
import { format } from "date-fns";
|
||||
import { CorrespondenceRevision } from '@/types/correspondence';
|
||||
import { DataTable } from '@/components/common/data-table';
|
||||
import { ColumnDef } from '@tanstack/react-table';
|
||||
import { StatusBadge } from '@/components/common/status-badge';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Eye, Edit, FileText } from 'lucide-react';
|
||||
import Link from 'next/link';
|
||||
import { format } from 'date-fns';
|
||||
|
||||
interface CorrespondenceListProps {
|
||||
data: CorrespondenceRevision[];
|
||||
@@ -16,22 +16,20 @@ interface CorrespondenceListProps {
|
||||
export function CorrespondenceList({ data }: CorrespondenceListProps) {
|
||||
const columns: ColumnDef<CorrespondenceRevision>[] = [
|
||||
{
|
||||
accessorKey: "correspondence.correspondenceNumber",
|
||||
header: "Document No.",
|
||||
cell: ({ row }) => (
|
||||
<span className="font-medium">{row.original.correspondence?.correspondenceNumber}</span>
|
||||
),
|
||||
accessorKey: 'correspondence.correspondenceNumber',
|
||||
header: 'Document No.',
|
||||
cell: ({ row }) => <span className="font-medium">{row.original.correspondence?.correspondenceNumber}</span>,
|
||||
},
|
||||
{
|
||||
accessorKey: "revisionLabel",
|
||||
header: "Rev",
|
||||
accessorKey: 'revisionLabel',
|
||||
header: 'Rev',
|
||||
cell: ({ row }) => (
|
||||
<span className="font-medium">{row.original.revisionLabel || row.original.revisionNumber}</span>
|
||||
),
|
||||
},
|
||||
{
|
||||
accessorKey: "subject",
|
||||
header: "Subject",
|
||||
accessorKey: 'subject',
|
||||
header: 'Subject',
|
||||
cell: ({ row }) => (
|
||||
<div className="max-w-[300px] truncate" title={row.original.subject}>
|
||||
{row.original.subject}
|
||||
@@ -39,24 +37,24 @@ export function CorrespondenceList({ data }: CorrespondenceListProps) {
|
||||
),
|
||||
},
|
||||
{
|
||||
accessorKey: "correspondence.originator.organizationCode",
|
||||
header: "From",
|
||||
accessorKey: 'correspondence.originator.organizationCode',
|
||||
header: 'From',
|
||||
cell: ({ row }) => (
|
||||
<span className="font-medium">{row.original.correspondence?.originator?.organizationCode || '-'}</span>
|
||||
),
|
||||
},
|
||||
{
|
||||
accessorKey: "createdAt",
|
||||
header: "Created",
|
||||
cell: ({ row }) => format(new Date(row.getValue("createdAt")), "dd MMM yyyy"),
|
||||
accessorKey: 'createdAt',
|
||||
header: 'Created',
|
||||
cell: ({ row }) => format(new Date(row.getValue('createdAt')), 'dd MMM yyyy'),
|
||||
},
|
||||
{
|
||||
accessorKey: "status.statusName",
|
||||
header: "Status",
|
||||
cell: ({ row }) => <StatusBadge status={row.original.status?.statusCode || "UNKNOWN"} />,
|
||||
accessorKey: 'status.statusName',
|
||||
header: 'Status',
|
||||
cell: ({ row }) => <StatusBadge status={row.original.status?.statusCode || 'UNKNOWN'} />,
|
||||
},
|
||||
{
|
||||
id: "actions",
|
||||
id: 'actions',
|
||||
cell: ({ row }) => {
|
||||
const item = row.original;
|
||||
// Edit/View link goes to the DOCUMENT detail (correspondence.uuid)
|
||||
@@ -72,23 +70,28 @@ export function CorrespondenceList({ data }: CorrespondenceListProps) {
|
||||
<Eye className="h-4 w-4" />
|
||||
</Button>
|
||||
</Link>
|
||||
<Button variant="ghost" size="icon" title="View File" onClick={() => {
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
title="View File"
|
||||
onClick={() => {
|
||||
const attachments = item.attachments; // Now we are on Revision, so attachments might be here if joined
|
||||
if (attachments && attachments.length > 0 && attachments[0].url) {
|
||||
window.open(attachments[0].url, '_blank');
|
||||
window.open(attachments[0].url, '_blank');
|
||||
} else {
|
||||
// Fallback check if attachments are on details json inside revision
|
||||
// or if we simply didn't join them yet.
|
||||
// Current Backend join: leftJoinAndSelect('rev.status', 'status') doesn't join attachments explicitly but maybe relation exists?
|
||||
// Wait, checking Entity... CorrespondenceRevision does NOT have attachments relation in code snippet provided earlier.
|
||||
// It might be in 'details' JSON or implied.
|
||||
// Just Alert for now as per previous logic.
|
||||
alert("ไม่พบไฟล์แนบ (No file attached)");
|
||||
// Fallback check if attachments are on details json inside revision
|
||||
// or if we simply didn't join them yet.
|
||||
// Current Backend join: leftJoinAndSelect('rev.status', 'status') doesn't join attachments explicitly but maybe relation exists?
|
||||
// Wait, checking Entity... CorrespondenceRevision does NOT have attachments relation in code snippet provided earlier.
|
||||
// It might be in 'details' JSON or implied.
|
||||
// Just Alert for now as per previous logic.
|
||||
alert('ไม่พบไฟล์แนบ (No file attached)');
|
||||
}
|
||||
}}>
|
||||
<FileText className="h-4 w-4" />
|
||||
</Button>
|
||||
{statusCode === "DRAFT" && (
|
||||
}}
|
||||
>
|
||||
<FileText className="h-4 w-4" />
|
||||
</Button>
|
||||
{statusCode === 'DRAFT' && (
|
||||
<Link href={`/correspondences/${docUuid}/edit`}>
|
||||
<Button variant="ghost" size="icon" title="Edit">
|
||||
<Edit className="h-4 w-4" />
|
||||
|
||||
Reference in New Issue
Block a user