获取材料反应表行中几列的列总和/总计，例如收入部分的总收入和扣除部分的总扣除

Question

我正在准备员工工资表，其中有如下列。

[实际表，即材料反应表] )

const columns = useMemo(
        () => [
          {
            accessorKey: 'id',
            header: 'Id',
            enableEditing: false,
            size: 80,
          },
          {
            accessorKey: 'firstName',
            header: 'First Name',
            enableEditing: false,
          },
          {
            accessorKey: 'lastName',
            header: 'Last Name',
            enableEditing: false,
          },
          {
            accessorKey: 'wageRate',
            header: 'Wage Rate',
            enableEditing: false,
          },
          {
            accessorKey: 'noOfDayswork',
            header: 'No Of Days Work',
            enableEditing: false,
          },
          {
            accessorKey: 'overtimeHrs',
            header: 'Overtime Hours',
            enableEditing: false,
          },
          {
            accessorKey: 'basicWage',
            header: 'Basic Wage',
            enableEditing: false,
          },
          {
            accessorKey: 'specialBasic',
            header: 'Special Basic',
            enableEditing: false,
          },
          {
            accessorKey: 'wageDA',
            header: 'DA',
            enableEditing: false,
          },
          {
            accessorKey: 'totalWage',
            header: 'Total Wage',
            enableEditing: false,
          },
          {
            accessorKey: 'paymentovertime',
            header: 'Payment Overtime',
            enableEditing: false,
          },
          {
            accessorKey: 'HRA',
            header: 'HRA',
            enableEditing: false,
          },
          {
            accessorKey: 'otherSpecialAllows',
            header: 'Other Special Allows',
            enableEditing: false,
          },
          {
            accessorKey: 'grandTotal',
            header: 'Grand Total',
            aggregationFn: 'sum',
            AggregatedCell: ({ cell }) => <div>Total Score: {cell.getValue()}</div>,
            enableEditing: false,
          },
          {
            accessorKey: 'deductPf',
            header: 'PF',
            enableEditing: false,
          },
          {
            accessorKey: 'deductESIC',
            header: 'ESIC',
            enableEditing: false,
          },
          {
            accessorKey: 'deductSociety',
            header: 'Society',
            enableEditing: false,
          },
          {
            accessorKey: 'deductPT',
            header: 'Proffessional Tax',
            enableEditing: false,
          },
          {
            accessorKey: 'deductInsurance',
            header: 'Insurance',
            enableEditing: false,
          },
          {
            accessorKey: 'deductOthers',
            header: 'Others',
            enableEditing: false,
          },
          {
            accessorKey: 'deductRecoveries',
            header: 'Recoveries',
            enableEditing: false,
          },
          {
            accessorKey: 'totalDeduction',
            header: 'Total Deduction',
            enableEditing: false,
          },
          {
            accessorKey: 'netPayment',
            header: 'Net Payment',
            enableEditing: false,
          },
          {
            accessorKey: 'pfEmployer',
            header: 'PF by Employer',
            enableEditing: false,
          },
        ],
        [],
    );


    function useGetWages() {
      return useQuery({
       queryKey: ['wage'],
       queryFn: async () => {
        //send api request here
        await new Promise((resolve) => setTimeout(resolve, 1000)); 
        return Promise.resolve(fakeData);
      },
      refetchOnWindowFocus: false,
    });
   }

有人可以帮我解决这个问题吗？我无法准备总计、NetSalary、总计等表格。所有公式都添加到图像表中。

提前致谢。

我在我的反应组件中尝试使用

material-react-table

。

Answer 1

 I have used the custom calculations in the `material-react-table`,
 below is the solution, it is worked like champ....

`accessorFn: (row) => row.noOfDayswork * (row.basicWage + row.wageDA),  
 Cell: ({ renderedCellValue, row }) => {           
        return (<span>
          {renderedCellValue}
          </span>)
 }