mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-20 21:41:57 +00:00
refactor(FE-326,327): enhance SalesReportTable to handle empty sales data and conditionally render summary row
This commit is contained in:
@@ -102,6 +102,18 @@ const SalesReportTable = ({
|
||||
}, [initialValues, activeTabId]);
|
||||
|
||||
const totals = useMemo(() => {
|
||||
if (salesBroilerData.length === 0) {
|
||||
return {
|
||||
totalQuantity: 0,
|
||||
totalWeight: 0,
|
||||
avgWeight: 0,
|
||||
avgPricePartner: 0,
|
||||
totalPartner: 0,
|
||||
avgPriceAct: 0,
|
||||
totalAct: 0,
|
||||
};
|
||||
}
|
||||
|
||||
const totalQuantity = salesBroilerData.reduce(
|
||||
(sum, item) => sum + (item.quantity || 0),
|
||||
0
|
||||
@@ -113,7 +125,7 @@ const SalesReportTable = ({
|
||||
const avgWeight = totalQuantity > 0 ? totalWeight / totalQuantity : 0;
|
||||
|
||||
const validPriceItems = salesBroilerData.filter(
|
||||
(item) => item.price != null
|
||||
(item) => item.price != null && item.price > 0
|
||||
);
|
||||
const avgPricePartner =
|
||||
validPriceItems.length > 0
|
||||
@@ -374,54 +386,56 @@ const SalesReportTable = ({
|
||||
/>
|
||||
|
||||
{/* Summary Row */}
|
||||
<table className='w-full table-auto text-sm mt-0'>
|
||||
<tbody>
|
||||
<tr className='bg-gray-100 font-semibold'>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap border border-gray-300 border-t-0'>
|
||||
Total Penjualan
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap border border-gray-300 border-t-0'>
|
||||
-
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap border border-gray-300 border-t-0'>
|
||||
-
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap border border-gray-300 border-t-0'>
|
||||
-
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap border border-gray-300 border-t-0'>
|
||||
-
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right border border-gray-300 border-t-0'>
|
||||
{formatNumber(totals.totalQuantity)}
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right border border-gray-300 border-t-0'>
|
||||
{formatNumber(totals.totalWeight)}
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right border border-gray-300 border-t-0'>
|
||||
{formatNumber(totals.avgWeight)}
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right border border-gray-300 border-t-0'>
|
||||
{formatCurrency(totals.avgPricePartner)}
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right border border-gray-300 border-t-0'>
|
||||
{formatCurrency(totals.totalPartner)}
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right border border-gray-300 border-t-0'>
|
||||
{formatCurrency(totals.avgPriceAct)}
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right border border-gray-300 border-t-0'>
|
||||
{formatCurrency(totals.totalAct)}
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap border border-gray-300 border-t-0'>
|
||||
-
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap border border-gray-300 border-t-0'>
|
||||
-
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
{salesBroilerData.length > 0 && (
|
||||
<table className='w-full table-auto text-sm mt-0'>
|
||||
<tbody>
|
||||
<tr className='bg-gray-100 font-semibold'>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap border border-gray-300 border-t-0'>
|
||||
Total Penjualan
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap border border-gray-300 border-t-0'>
|
||||
-
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap border border-gray-300 border-t-0'>
|
||||
-
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap border border-gray-300 border-t-0'>
|
||||
-
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap border border-gray-300 border-t-0'>
|
||||
-
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right border border-gray-300 border-t-0'>
|
||||
{formatNumber(totals.totalQuantity)}
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right border border-gray-300 border-t-0'>
|
||||
{formatNumber(totals.totalWeight)}
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right border border-gray-300 border-t-0'>
|
||||
{formatNumber(totals.avgWeight)}
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right border border-gray-300 border-t-0'>
|
||||
{formatCurrency(totals.avgPricePartner)}
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right border border-gray-300 border-t-0'>
|
||||
{formatCurrency(totals.totalPartner)}
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right border border-gray-300 border-t-0'>
|
||||
{formatCurrency(totals.avgPriceAct)}
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap text-right border border-gray-300 border-t-0'>
|
||||
{formatCurrency(totals.totalAct)}
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap border border-gray-300 border-t-0'>
|
||||
-
|
||||
</td>
|
||||
<td className='px-4 py-3 text-xs text-gray-900 whitespace-nowrap border border-gray-300 border-t-0'>
|
||||
-
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
)}
|
||||
</Card>
|
||||
</div>
|
||||
),
|
||||
|
||||
Reference in New Issue
Block a user