181 lines
4.0 KiB
JavaScript
181 lines
4.0 KiB
JavaScript
import React from 'react';
|
|
import { Intent, Position, Button, Tooltip } from '@blueprintjs/core';
|
|
import { FormattedMessage as T } from 'components';
|
|
import { Icon, Money, Hint } from 'components';
|
|
import intl from 'react-intl-universal';
|
|
import {
|
|
AccountsListFieldCell,
|
|
MoneyFieldCell,
|
|
InputGroupCell,
|
|
ContactsListFieldCell,
|
|
} from 'components/DataTableCells';
|
|
import { safeSumBy } from 'utils';
|
|
|
|
/**
|
|
* Contact header cell.
|
|
*/
|
|
export function ContactHeaderCell() {
|
|
return (
|
|
<>
|
|
<T id={'contact'} />
|
|
<Hint
|
|
content={<T id={'contact_column_hint'} />}
|
|
position={Position.LEFT_BOTTOM}
|
|
/>
|
|
</>
|
|
);
|
|
}
|
|
|
|
/**
|
|
* Credit header cell.
|
|
*/
|
|
export function CreditHeaderCell({ payload: { currencyCode } }) {
|
|
return intl.get('credit_currency', { currency: currencyCode });
|
|
}
|
|
|
|
/**
|
|
* debit header cell.
|
|
*/
|
|
export function DebitHeaderCell({ payload: { currencyCode } }) {
|
|
return intl.get('debit_currency', { currency: currencyCode });
|
|
}
|
|
|
|
/**
|
|
* Account footer cell.
|
|
*/
|
|
function AccountFooterCell({ payload: { currencyCode } }) {
|
|
return (
|
|
<span>
|
|
{intl.get('total_currency', { currency: currencyCode })}
|
|
</span>
|
|
);
|
|
}
|
|
|
|
/**
|
|
* Total credit table footer cell.
|
|
*/
|
|
function TotalCreditFooterCell({ payload: { currencyCode }, rows }) {
|
|
const credit = safeSumBy(rows, 'original.credit');
|
|
|
|
return (
|
|
<span>
|
|
<Money amount={credit} currency={currencyCode} />
|
|
</span>
|
|
);
|
|
}
|
|
|
|
/**
|
|
* Total debit table footer cell.
|
|
*/
|
|
function TotalDebitFooterCell({ payload: { currencyCode }, rows }) {
|
|
const debit = safeSumBy(rows, 'original.debit');
|
|
|
|
return (
|
|
<span>
|
|
<Money amount={debit} currency={currencyCode} />
|
|
</span>
|
|
);
|
|
}
|
|
/**
|
|
* Actions cell renderer.
|
|
*/
|
|
export const ActionsCellRenderer = ({
|
|
row: { index },
|
|
column: { id },
|
|
cell: { value: initialValue },
|
|
data,
|
|
payload,
|
|
}) => {
|
|
const onClickRemoveRole = () => {
|
|
payload.removeRow(index);
|
|
};
|
|
return (
|
|
<Tooltip content={<T id={'remove_the_line'} />} position={Position.LEFT}>
|
|
<Button
|
|
icon={<Icon icon="times-circle" iconSize={14} />}
|
|
iconSize={14}
|
|
className="ml2"
|
|
minimal={true}
|
|
intent={Intent.DANGER}
|
|
onClick={onClickRemoveRole}
|
|
/>
|
|
</Tooltip>
|
|
);
|
|
};
|
|
|
|
/**
|
|
* Retrieve columns of make journal entries table.
|
|
*/
|
|
export const useJournalTableEntriesColumns = () => {
|
|
return React.useMemo(
|
|
() => [
|
|
{
|
|
Header: '#',
|
|
accessor: 'index',
|
|
Cell: ({ row: { index } }) => <span>{index + 1}</span>,
|
|
className: 'index',
|
|
width: 40,
|
|
disableResizing: true,
|
|
disableSortBy: true,
|
|
sticky: 'left',
|
|
},
|
|
{
|
|
Header: intl.get('account'),
|
|
id: 'account_id',
|
|
accessor: 'account_id',
|
|
Cell: AccountsListFieldCell,
|
|
Footer: AccountFooterCell,
|
|
className: 'account',
|
|
disableSortBy: true,
|
|
width: 160,
|
|
fieldProps: { allowCreate: true }
|
|
},
|
|
{
|
|
Header: CreditHeaderCell,
|
|
accessor: 'credit',
|
|
Cell: MoneyFieldCell,
|
|
Footer: TotalCreditFooterCell,
|
|
className: 'credit',
|
|
disableSortBy: true,
|
|
width: 100,
|
|
},
|
|
{
|
|
Header: DebitHeaderCell,
|
|
accessor: 'debit',
|
|
Cell: MoneyFieldCell,
|
|
Footer: TotalDebitFooterCell,
|
|
className: 'debit',
|
|
disableSortBy: true,
|
|
width: 100,
|
|
},
|
|
{
|
|
Header: ContactHeaderCell,
|
|
id: 'contact_id',
|
|
accessor: 'contact_id',
|
|
Cell: ContactsListFieldCell,
|
|
className: 'contact',
|
|
disableSortBy: true,
|
|
width: 120,
|
|
},
|
|
{
|
|
Header: intl.get('note'),
|
|
accessor: 'note',
|
|
Cell: InputGroupCell,
|
|
disableSortBy: true,
|
|
className: 'note',
|
|
width: 200,
|
|
},
|
|
{
|
|
Header: '',
|
|
accessor: 'action',
|
|
Cell: ActionsCellRenderer,
|
|
className: 'actions',
|
|
disableSortBy: true,
|
|
disableResizing: true,
|
|
width: 45,
|
|
},
|
|
],
|
|
[],
|
|
);
|
|
};
|