This commit is contained in:
a.bouhuolia
2020-12-19 17:04:26 +02:00
4 changed files with 41 additions and 72 deletions

View File

@@ -9,6 +9,7 @@ import { If, Icon } from 'components';
export default function DashboardViewsTabs({ export default function DashboardViewsTabs({
initialViewId = 0, initialViewId = 0,
tabs, tabs,
defaultTabText = <T id={'all'} />,
allTab = true, allTab = true,
newViewTab = true, newViewTab = true,
resourceName, resourceName,
@@ -60,7 +61,7 @@ export default function DashboardViewsTabs({
onChange={handleTabsChange} onChange={handleTabsChange}
> >
{allTab && ( {allTab && (
<Tab id={0} title={<T id={'all'} />} onClick={handleViewLinkClick} /> <Tab id={0} title={defaultTabText} onClick={handleViewLinkClick} />
)} )}
{mappedTabs.map((tab) => ( {mappedTabs.map((tab) => (
<Tab id={tab.id} title={tab.name} onClick={handleTabClick} /> <Tab id={tab.id} title={tab.name} onClick={handleTabClick} />

View File

@@ -10,70 +10,41 @@ export const statusAccessor = (row) => {
return ( return (
<div className={'status-accessor'}> <div className={'status-accessor'}>
<Choose> <Choose>
<Choose.When condition={row.is_delivered}> <Choose.When condition={row.is_fully_paid && row.is_delivered}>
<Choose> <span className={'fully-paid-status'}>
<Choose.When condition={row.is_overdue && !row.is_partially_paid}> <Icon icon="checkmark-16" iconSize={17} />
<span className={'overdue_status'}>
<p>
<T id={'overdue_by'} /> {row.overdue_days} <T id={'day'} />
</p>
</span>
</Choose.When>
<Choose.When condition={!row.is_overdue && row.is_partially_paid}>
<div>
<span>
<p>
<T id={'due_in'} /> {row.remaining_days}{' '}
<T id={'day_partially_paid'} /> ${row.due_amount}{' '}
<T id={'due'} />
</p>
</span>
<ProgressBar
animate={false}
stripes={false}
intent={Intent.PRIMARY}
value={calculateStatus(row.payment_amount, row.balance)}
/>
</div>
</Choose.When>
<Choose.When condition={row.is_overdue && row.is_partially_paid}>
<div>
<span>
<p>
<T id={'overdue_by'} /> {row.overdue_days}{' '}
<T id={'day_partially_paid'} /> ${row.due_amount}{' '}
<T id={'due'} />
</p>
</span>
<ProgressBar
animate={false}
stripes={false}
intent={Intent.PRIMARY}
value={calculateStatus(row.payment_amount, row.balance)}
/>
</div>
</Choose.When>
<Choose.When condition={row.is_fully_paid}>
<span className={'fully-paid'}>
<Icon icon="checkmark-16" iconSize={20} />
</span> </span>
<span> <span>
<T id={'paid'} /> <T id={'paid'} />
</span> </span>
</Choose.When> </Choose.When>
<Choose.When condition={row.is_delivered}>
<Choose>
<Choose.When condition={row.is_overdue}>
<span className={'overdue-status'}>
<T id={'overdue_by'} values={{ overdue: row.overdue_days }} />
</span>
</Choose.When>
<Choose.Otherwise> <Choose.Otherwise>
<span className={'remaining-status'}> <span className={'remaining-status'}>
<p> <T id={'due_in'} values={{ due: row.remaining_days }} />
<T id={'due_in'} /> {row.remaining_days} <T id={'day'} />
</p>
</span> </span>
</Choose.Otherwise> </Choose.Otherwise>
</Choose> </Choose>
</Choose.When>
<If condition={row.is_partially_paid}>
<span>
<T id={'day_partially_paid'} values={{ due: row.due_amount }} />
</span>
<ProgressBar
animate={false}
stripes={false}
intent={Intent.PRIMARY}
value={calculateStatus(row.payment_amount, row.balance)}
/>
</If>
</Choose.When>
<Choose.Otherwise> <Choose.Otherwise>
<Tag minimal={true}> <Tag minimal={true}>
<T id={'draft'} /> <T id={'draft'} />

View File

@@ -869,12 +869,9 @@ export default {
save_and_deliver: 'Save & Deliver', save_and_deliver: 'Save & Deliver',
deliver_and_new: 'Deliver and new', deliver_and_new: 'Deliver and new',
deliver_continue_editing: 'Deliver (continue editing)', deliver_continue_editing: 'Deliver (continue editing)',
due_in: 'Due in', due_in: 'Due in {due} day.',
day_partially_paid: 'Day Partially paid,', day_partially_paid: 'Partially paid {due} due.',
due: 'Due.', overdue_by: 'Overdue by {overdue} day.',
overdue_by: 'Overdue by',
day: 'day.',
day_partially_paid: 'Day Partially paid',
paid: 'Paid', paid: 'Paid',
your_account_has_been_locked: your_account_has_been_locked:
'Your account has been locked due to repeated failed login attempts. Please wait a few minutes before trying again.', 'Your account has been locked due to repeated failed login attempts. Please wait a few minutes before trying again.',

View File

@@ -45,12 +45,12 @@
} }
} }
.status-accessor { .status-accessor {
span > p { span {
font-size: 13px; font-size: 13px;
font-weight: 400; font-weight: 400;
line-height: 1.5; line-height: 1.5;
} }
.fully-paid { .fully-paid-status {
display: inline-block; display: inline-block;
border-radius: 50%; border-radius: 50%;
background: #2ba01d; background: #2ba01d;
@@ -62,14 +62,14 @@
background: rgba(92, 112, 128, 0.2); background: rgba(92, 112, 128, 0.2);
border-radius: 40px; border-radius: 40px;
display: block; display: block;
height: 6px; height: 5px;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
margin-top: 5px;
width: 80%; width: 80%;
} }
&.overdue-status {
} }
&.remaining-status {
.overdue-status {
} }
.remaining-status {
} }