mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-25 07:45:47 +00:00
refactor(FE-326): Remove Tabs wrapper from SalesReportTable
This commit is contained in:
@@ -1,6 +1,5 @@
|
|||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import Tabs from '@/components/Tabs';
|
|
||||||
import React, { useState, useMemo } from 'react';
|
import React, { useState, useMemo } from 'react';
|
||||||
import { ColumnDef } from '@tanstack/react-table';
|
import { ColumnDef } from '@tanstack/react-table';
|
||||||
import Table, { CustomHeaderRow } from '@/components/Table';
|
import Table, { CustomHeaderRow } from '@/components/Table';
|
||||||
@@ -365,81 +364,68 @@ const SalesReportTable = ({
|
|||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<section className='w-full'>
|
<section className='w-full'>
|
||||||
<Tabs
|
<div className='p-4'>
|
||||||
className='bg-base-100 p-2'
|
<h2 className='text-xl font-semibold mb-4'>Penjualan</h2>
|
||||||
onTabChange={setActiveTabId}
|
<Card
|
||||||
activeTabId={activeTabId}
|
className={{
|
||||||
tabs={[
|
wrapper: 'w-full bg-base-100',
|
||||||
{
|
body: 'p-0',
|
||||||
id: 'penjualan',
|
}}
|
||||||
label: 'Penjualan',
|
>
|
||||||
content: (
|
<Table
|
||||||
<div className='p-4'>
|
data={salesBroilerData}
|
||||||
<h2 className='text-xl font-semibold mb-4'>Penjualan</h2>
|
columns={salesColumns}
|
||||||
<Card
|
renderCustomHeaders={true}
|
||||||
className={{
|
customHeaderRows={salesCustomHeaderRows}
|
||||||
wrapper: 'w-full bg-base-100',
|
renderFooter={salesBroilerData.length > 0}
|
||||||
}}
|
footerContent={
|
||||||
>
|
<tfoot>
|
||||||
<Table
|
<tr className='bg-gray-100 font-semibold border border-gray-200'>
|
||||||
data={salesBroilerData}
|
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap '>
|
||||||
columns={salesColumns}
|
Total Penjualan
|
||||||
renderCustomHeaders={true}
|
</td>
|
||||||
customHeaderRows={salesCustomHeaderRows}
|
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap '></td>
|
||||||
renderFooter={salesBroilerData.length > 0}
|
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap '></td>
|
||||||
footerContent={
|
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap '></td>
|
||||||
<tfoot>
|
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap '></td>
|
||||||
<tr className='bg-gray-100 font-semibold border border-gray-200'>
|
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right '>
|
||||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap '>
|
{formatNumber(totals.totalQuantity)}
|
||||||
Total Penjualan
|
</td>
|
||||||
</td>
|
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right '>
|
||||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap '></td>
|
{formatNumber(totals.totalWeight)}
|
||||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap '></td>
|
</td>
|
||||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap '></td>
|
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right '>
|
||||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap '></td>
|
{formatNumber(totals.avgWeight)}
|
||||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right '>
|
</td>
|
||||||
{formatNumber(totals.totalQuantity)}
|
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right '>
|
||||||
</td>
|
{formatCurrency(totals.avgPricePartner)}
|
||||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right '>
|
</td>
|
||||||
{formatNumber(totals.totalWeight)}
|
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right '>
|
||||||
</td>
|
{formatCurrency(totals.totalPartner)}
|
||||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right '>
|
</td>
|
||||||
{formatNumber(totals.avgWeight)}
|
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right '>
|
||||||
</td>
|
{formatCurrency(totals.avgPriceAct)}
|
||||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right '>
|
</td>
|
||||||
{formatCurrency(totals.avgPricePartner)}
|
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right '>
|
||||||
</td>
|
{formatCurrency(totals.totalAct)}
|
||||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right '>
|
</td>
|
||||||
{formatCurrency(totals.totalPartner)}
|
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap '></td>
|
||||||
</td>
|
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap '></td>
|
||||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right '>
|
</tr>
|
||||||
{formatCurrency(totals.avgPriceAct)}
|
</tfoot>
|
||||||
</td>
|
}
|
||||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right '>
|
className={{
|
||||||
{formatCurrency(totals.totalAct)}
|
tableWrapperClassName: 'overflow-x-auto',
|
||||||
</td>
|
tableClassName: 'w-full table-auto text-sm',
|
||||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap '></td>
|
headerRowClassName: 'hidden',
|
||||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap '></td>
|
bodyRowClassName:
|
||||||
</tr>
|
'hover:bg-gray-50 transition-colors border-b border-l border-r border-b-gray-200 border-l-gray-200 border-r-gray-200',
|
||||||
</tfoot>
|
bodyColumnClassName:
|
||||||
}
|
'px-4 py-3 text-xs text-gray-900 whitespace-nowrap',
|
||||||
className={{
|
}}
|
||||||
tableWrapperClassName: 'overflow-x-auto',
|
/>
|
||||||
tableClassName: 'w-full table-auto text-sm',
|
</Card>
|
||||||
headerRowClassName: 'hidden',
|
</div>
|
||||||
bodyRowClassName:
|
|
||||||
'hover:bg-gray-50 transition-colors border-b border-l border-r border-b-gray-200 border-l-gray-200 border-r-gray-200',
|
|
||||||
bodyColumnClassName:
|
|
||||||
'px-4 py-3 text-xs text-gray-900 whitespace-nowrap',
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</Card>
|
|
||||||
</div>
|
|
||||||
),
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
variant='lifted'
|
|
||||||
/>
|
|
||||||
</section>
|
</section>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in New Issue
Block a user