104 lines
3.6 KiB
TypeScript
104 lines
3.6 KiB
TypeScript
'use client';
|
|
|
|
import Link from 'next/link';
|
|
import type { Column, ColumnDef } from '@tanstack/react-table';
|
|
import { DataTableColumnHeader } from '@/components/ui/table/data-table-column-header';
|
|
import { Icons } from '@/components/icons';
|
|
import type { ApprovalListItem } from '../types';
|
|
import { ApprovalStatusBadge } from './approval-status-badge';
|
|
|
|
export function getApprovalColumns(): ColumnDef<ApprovalListItem>[] {
|
|
return [
|
|
{
|
|
id: 'entityCode',
|
|
accessorFn: (row) => row.entityCode ?? row.entityId,
|
|
header: ({ column }: { column: Column<ApprovalListItem, unknown> }) => (
|
|
<DataTableColumnHeader column={column} title='Request' />
|
|
),
|
|
cell: ({ row }) => (
|
|
<div className='flex flex-col'>
|
|
<Link href={`/dashboard/crm/approvals/${row.original.id}`} className='font-medium hover:underline'>
|
|
{row.original.entityCode ?? row.original.entityId}
|
|
</Link>
|
|
<span className='text-muted-foreground text-xs'>
|
|
{row.original.workflowName}
|
|
{row.original.entityTitle ? ` - ${row.original.entityTitle}` : ''}
|
|
</span>
|
|
</div>
|
|
),
|
|
meta: {
|
|
label: 'Request',
|
|
placeholder: 'Search approvals...',
|
|
variant: 'text' as const,
|
|
icon: Icons.search
|
|
},
|
|
enableColumnFilter: true
|
|
},
|
|
{
|
|
id: 'status',
|
|
accessorKey: 'status',
|
|
header: ({ column }: { column: Column<ApprovalListItem, unknown> }) => (
|
|
<DataTableColumnHeader column={column} title='Status' />
|
|
),
|
|
cell: ({ row }) => <ApprovalStatusBadge status={row.original.status} />,
|
|
meta: {
|
|
label: 'Status',
|
|
variant: 'multiSelect' as const,
|
|
options: [
|
|
{ value: 'pending', label: 'Pending' },
|
|
{ value: 'approved', label: 'Approved' },
|
|
{ value: 'rejected', label: 'Rejected' },
|
|
{ value: 'returned', label: 'Returned' },
|
|
{ value: 'cancelled', label: 'Cancelled' }
|
|
]
|
|
},
|
|
enableColumnFilter: true
|
|
},
|
|
{
|
|
id: 'entityType',
|
|
accessorKey: 'entityType',
|
|
header: ({ column }: { column: Column<ApprovalListItem, unknown> }) => (
|
|
<DataTableColumnHeader column={column} title='Entity' />
|
|
),
|
|
cell: ({ row }) => row.original.entityType.replaceAll('_', ' '),
|
|
meta: {
|
|
label: 'Entity',
|
|
variant: 'multiSelect' as const,
|
|
options: [{ value: 'quotation', label: 'Quotation' }]
|
|
},
|
|
enableColumnFilter: true
|
|
},
|
|
{
|
|
id: 'currentStep',
|
|
accessorKey: 'currentStep',
|
|
header: ({ column }: { column: Column<ApprovalListItem, unknown> }) => (
|
|
<DataTableColumnHeader column={column} title='Current Step' />
|
|
),
|
|
cell: ({ row }) => (
|
|
<div className='flex flex-col'>
|
|
<span>Step {row.original.currentStep}</span>
|
|
<span className='text-muted-foreground text-xs'>
|
|
{row.original.currentStepRoleName ?? '-'}
|
|
</span>
|
|
</div>
|
|
)
|
|
},
|
|
{
|
|
id: 'requestedBy',
|
|
accessorFn: (row) => row.requestedByName ?? row.requestedBy,
|
|
header: ({ column }: { column: Column<ApprovalListItem, unknown> }) => (
|
|
<DataTableColumnHeader column={column} title='Requested By' />
|
|
),
|
|
cell: ({ row }) => row.original.requestedByName ?? row.original.requestedBy
|
|
},
|
|
{
|
|
id: 'requestedAt',
|
|
accessorKey: 'requestedAt',
|
|
header: ({ column }: { column: Column<ApprovalListItem, unknown> }) => (
|
|
<DataTableColumnHeader column={column} title='Requested At' />
|
|
),
|
|
cell: ({ row }) => new Date(row.original.requestedAt).toLocaleString()
|
|
}
|
|
];
|
|
}
|