itm/itmpwk.ac.id
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add upload file functionality to letter requests; integrate AttachmentPreviewDialog and update column actions

Browse Source
This commit is contained in:
Yoga Pangestu 2026-09-03 14:07:37 +07:00
parent aa50487bfc
commit db56ec94ea
2 changed files with 19 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
resources/js/pages/admin/services/letter-requests/columns.tsx
View File

@ -1,6 +1,7 @@
import type { ColumnDef } from '@tanstack/react-table'; import type { ColumnDef } from '@tanstack/react-table';
import { format } from 'date-fns'; import { format } from 'date-fns';
import { Paperclip, Pencil, Trash2 } from 'lucide-react'; import { Pencil, Trash2, Upload } from 'lucide-react';
import { AttachmentPreviewDialog } from '@/components/attachment-preview-dialog';
import { RowActions } from '@/components/row-actions'; import { RowActions } from '@/components/row-actions';
import { StatusBadge } from '@/components/status-badge'; import { StatusBadge } from '@/components/status-badge';
import type { LetterRequest } from '@/types/letter-request'; import type { LetterRequest } from '@/types/letter-request';
@ -27,6 +28,7 @@ type CreateColumnsParams = {
handleEdit: (letterRequest: LetterRequest) => void; handleEdit: (letterRequest: LetterRequest) => void;
handleDeleteClick: (letterRequest: LetterRequest) => void; handleDeleteClick: (letterRequest: LetterRequest) => void;
handleStatusChange: (letterRequest: LetterRequest, status: string) => void; handleStatusChange: (letterRequest: LetterRequest, status: string) => void;
handleUploadClick: (letterRequest: LetterRequest) => void;
canUpdate: boolean; canUpdate: boolean;
canDelete: boolean; canDelete: boolean;
canProcess: boolean; canProcess: boolean;
@ -39,6 +41,7 @@ export function createLetterRequestColumns(
handleEdit, handleEdit,
handleDeleteClick, handleDeleteClick,
handleStatusChange, handleStatusChange,
handleUploadClick,
canUpdate, canUpdate,
canDelete, canDelete,
canProcess, canProcess,
@ -128,26 +131,21 @@ export function createLetterRequestColumns(
cell: ({ row }) => { cell: ({ row }) => {
const letterRequest = row.original; const letterRequest = row.original;
if (!letterRequest.result_url) { if (!letterRequest.result_url || !letterRequest.result_name) {
return <span className="text-muted-foreground">-</span>; return <span className="text-muted-foreground">-</span>;
} }
return ( return (
<a <AttachmentPreviewDialog
href={letterRequest.result_url} fileUrl={letterRequest.result_url}
target="_blank" fileName={letterRequest.result_name}
rel="noreferrer" />
className="inline-flex items-center gap-1 text-primary underline underline-offset-4 hover:text-primary/80"
>
<Paperclip className="h-3.5 w-3.5" />
{letterRequest.result_name}
</a>
); );
}, },
}, },
]; ];
if (canUpdate || canDelete) { if (canUpdate || canDelete || canProcess) {
columns.push({ columns.push({
id: 'actions', id: 'actions',
header: () => <span className="block text-center">Aksi</span>, header: () => <span className="block text-center">Aksi</span>,
@ -161,6 +159,14 @@ export function createLetterRequestColumns(
return ( return (
<RowActions <RowActions
actions={[ actions={[
{
label: 'Upload File',
icon: <Upload className="h-4 w-4" />,
show:
canProcess &&
row.original.status === 'in_process',
onClick: () => handleUploadClick(row.original),
},
{ {
label: 'Edit', label: 'Edit',
icon: <Pencil className="h-4 w-4" />, icon: <Pencil className="h-4 w-4" />,

1
resources/js/pages/admin/services/letter-requests/index.tsx
View File

@ -115,6 +115,7 @@ export default function LetterRequestIndex({
handleEdit: (letterRequest) => setEditing(letterRequest), handleEdit: (letterRequest) => setEditing(letterRequest),
handleDeleteClick: (letterRequest) => setDeleting(letterRequest), handleDeleteClick: (letterRequest) => setDeleting(letterRequest),
handleStatusChange, handleStatusChange,
handleUploadClick: (letterRequest) => setProcessing(letterRequest),
canUpdate, canUpdate,
canDelete, canDelete,
canProcess, canProcess,