mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-20 13:32:00 +00:00
feat(FE): Add headings and improve layout for financial tables
This commit is contained in:
@@ -14,6 +14,7 @@ const ClosingKandangList = ({
|
||||
<div className='flex flex-col @sm:flex-row gap-4'>
|
||||
<div className='w-full'>
|
||||
<div className='overflow-x-auto'>
|
||||
<h1 className='font-bold mb-3'>Kandang</h1>
|
||||
<div className='flex flex-wrap gap-2'>
|
||||
{projectData?.kandangs?.map((kandang) => (
|
||||
<Button
|
||||
|
||||
@@ -1,9 +1,11 @@
|
||||
import Alert from '@/components/Alert';
|
||||
import Card from '@/components/Card';
|
||||
import Table, { TABLE_DEFAULT_STYLING } from '@/components/Table';
|
||||
import { isResponseSuccess } from '@/lib/api-helper';
|
||||
import { formatCurrency, formatTitleCase } from '@/lib/helper';
|
||||
import { ClosingApi } from '@/services/api/closing';
|
||||
import { HppItem, ProfitLossItem } from '@/types/api/closing';
|
||||
import { Icon } from '@iconify/react';
|
||||
import { useSearchParams } from 'next/navigation';
|
||||
import { useMemo } from 'react';
|
||||
import useSWR from 'swr';
|
||||
@@ -93,38 +95,79 @@ const FinanceClosingTable = ({
|
||||
/>
|
||||
) : (
|
||||
<>
|
||||
<section className='grid grid-cols-1 md:grid-cols-2 gap-3'>
|
||||
<Card
|
||||
variant='bordered'
|
||||
className={{
|
||||
wrapper: 'w-full rounded-lg border-none',
|
||||
wrapper: 'w-full rounded-xl border border-base-content/10',
|
||||
body: 'p-0',
|
||||
title: 'px-2 py-1.5 font-normal text-sm bg-primary text-white',
|
||||
collapsible: 'rounded-lg',
|
||||
wrapperContent:
|
||||
'h-full flex flex-col items-between justify-between',
|
||||
}}
|
||||
variant='bordered'
|
||||
>
|
||||
<div className='p-4 grid grid-cols-2 gap-6'>
|
||||
<div className='flex flex-col gap-1'>
|
||||
<div>Laba Rugi Brutto</div>
|
||||
<div className='text-lg font-bold'>
|
||||
<div className='flex flex-row items-center gap-4 px-4 py-4'>
|
||||
<Alert
|
||||
variant='soft'
|
||||
color='success'
|
||||
className='rounded-lg p-3 bg-success/12 flex items-center justify-center'
|
||||
>
|
||||
<Icon
|
||||
icon='heroicons:chart-bar-square'
|
||||
width={24}
|
||||
height={24}
|
||||
/>
|
||||
</Alert>
|
||||
<div className='space-y-1'>
|
||||
<h3 className='text-base-content/50 font-semibold text-sm'>
|
||||
Laba Rugi Brutto
|
||||
</h3>
|
||||
<p className='text-xl font-semibold'>
|
||||
{isResponseSuccess(finance)
|
||||
? formatCurrency(
|
||||
finance.data.profit_loss.summary.gross_profit.amount
|
||||
)
|
||||
: '-'}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex flex-col gap-1'>
|
||||
<div>Laba Rugi Netto</div>
|
||||
<div className='text-lg font-bold'>
|
||||
</Card>
|
||||
|
||||
<Card
|
||||
className={{
|
||||
wrapper: 'w-full rounded-xl border border-base-content/10',
|
||||
body: 'p-0',
|
||||
wrapperContent:
|
||||
'h-full flex flex-col items-between justify-between',
|
||||
}}
|
||||
variant='bordered'
|
||||
>
|
||||
<div className='flex flex-row items-center gap-4 px-4 py-4'>
|
||||
<Alert
|
||||
variant='soft'
|
||||
color='info'
|
||||
className='rounded-lg p-3 bg-info/12 flex items-center justify-center'
|
||||
>
|
||||
<Icon
|
||||
icon='heroicons:currency-dollar'
|
||||
width={24}
|
||||
height={24}
|
||||
/>
|
||||
</Alert>
|
||||
<div className='space-y-1'>
|
||||
<h3 className='text-base-content/50 font-semibold text-sm'>
|
||||
Laba Rugi Netto
|
||||
</h3>
|
||||
<p className='text-xl font-semibold'>
|
||||
{isResponseSuccess(finance)
|
||||
? formatCurrency(
|
||||
finance.data.profit_loss.summary.net_profit.amount
|
||||
)
|
||||
: '-'}
|
||||
</div>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
</section>
|
||||
<Card
|
||||
title='HPP Purchases'
|
||||
variant='bordered'
|
||||
|
||||
Reference in New Issue
Block a user