store/resources/js/pages/admin/finance/payroll/table/columns.ts

63 lines
2.2 KiB
TypeScript

import type { ColumnDef } from '@tanstack/vue-table';
import { h } from 'vue';
import { DataTableColumnHeader } from '@/components/data-table';
import { Badge } from '@/components/ui/badge';
import { PayrollStatus } from '@/constants/payroll-status';
import type { PayrollListItem } from '@/types/payroll';
import DataTableActions from './data-table-actions.vue';
function statusVariant(status: string): 'default' | 'secondary' | 'destructive' | 'outline' {
return status === PayrollStatus.PAID ? 'secondary' : 'outline';
}
export function createColumns(
onAdjust: (payroll: PayrollListItem) => void,
): ColumnDef<PayrollListItem>[] {
return [
{
accessorKey: 'employee_name',
enableSorting: false,
header: () => 'Pegawai',
},
{
accessorKey: 'base_salary_formatted',
enableSorting: true,
header: () => h(DataTableColumnHeader, { title: 'Gaji Pokok', column: 'base_salary' }),
},
{
accessorKey: 'bonus_amount_formatted',
enableSorting: true,
header: () => h(DataTableColumnHeader, { title: 'Tunjangan', column: 'bonus_amount' }),
},
{
accessorKey: 'deduction_amount_formatted',
enableSorting: true,
header: () => h(DataTableColumnHeader, { title: 'Potongan', column: 'deduction_amount' }),
},
{
accessorKey: 'total_amount_formatted',
enableSorting: true,
header: () => h(DataTableColumnHeader, { title: 'Gaji Bersih', column: 'total_amount' }),
},
{
accessorKey: 'status_label',
enableSorting: true,
header: () => h(DataTableColumnHeader, { title: 'Status', column: 'status' }),
cell: ({ row }) => h(
Badge,
{ variant: statusVariant(row.original.status) },
() => row.original.status_label,
),
},
{
id: 'actions',
enableSorting: false,
enableHiding: false,
cell: ({ row }) => h(DataTableActions, {
payroll: row.original,
onAdjust: () => onAdjust(row.original),
}),
},
];
}