mirror of
https://github.com/bigcapitalhq/bigcapital.git
synced 2026-02-18 13:50:31 +00:00
Merge branch 'feature/comparisons' of https://github.com/bigcapitalhq/client into feature/comparisons
This commit is contained in:
@@ -1,4 +1,5 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
|
||||||
import { FastField, Field } from 'formik';
|
import { FastField, Field } from 'formik';
|
||||||
import { FormGroup, Checkbox } from '@blueprintjs/core';
|
import { FormGroup, Checkbox } from '@blueprintjs/core';
|
||||||
import styled from 'styled-components';
|
import styled from 'styled-components';
|
||||||
@@ -6,6 +7,10 @@ import styled from 'styled-components';
|
|||||||
import { FormattedMessage as T } from 'components';
|
import { FormattedMessage as T } from 'components';
|
||||||
|
|
||||||
import { Row, Col, FieldHint } from '../../../components';
|
import { Row, Col, FieldHint } from '../../../components';
|
||||||
|
import {
|
||||||
|
handlePreviousYearCheckBoxChange,
|
||||||
|
handlePreviousPeriodCheckBoxChange,
|
||||||
|
} from './utils';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Balance sheet header - Comparison panal.
|
* Balance sheet header - Comparison panal.
|
||||||
@@ -14,42 +19,55 @@ export default function BalanceSheetHeaderComparisonPanal() {
|
|||||||
return (
|
return (
|
||||||
<BalanceSheetComparisonWrap>
|
<BalanceSheetComparisonWrap>
|
||||||
{/**----------- Previous Year -----------*/}
|
{/**----------- Previous Year -----------*/}
|
||||||
<FastField name={'previous_year'} type={'checkbox'}>
|
<Field name={'previous_year'} type={'checkbox'}>
|
||||||
{({ field }) => (
|
{({ form, field }) => (
|
||||||
<FormGroup labelInfo={<FieldHint />}>
|
<FormGroup labelInfo={<FieldHint />}>
|
||||||
<Checkbox
|
<Checkbox
|
||||||
inline={true}
|
inline={true}
|
||||||
small={true}
|
|
||||||
label={<T id={'balance_sheet.previous_year'} />}
|
label={<T id={'balance_sheet.previous_year'} />}
|
||||||
{...field}
|
{...field}
|
||||||
|
onChange={handlePreviousYearCheckBoxChange(form)}
|
||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
)}
|
)}
|
||||||
</FastField>
|
</Field>
|
||||||
<Row>
|
<Row>
|
||||||
<Col xs={3}>
|
<Col xs={3}>
|
||||||
<FastField name={'previous_year_amount_change'} type={'checkbox'}>
|
<Field name={'previous_year_amount_change'} type={'checkbox'}>
|
||||||
{({ field }) => (
|
{({ form: { setFieldValue }, field }) => (
|
||||||
<FormGroup labelInfo={<FieldHint />}>
|
<FormGroup labelInfo={<FieldHint />}>
|
||||||
<Checkbox
|
<Checkbox
|
||||||
inline={true}
|
inline={true}
|
||||||
small={true}
|
small={true}
|
||||||
label={<T id={'balance_sheet.total_change'} />}
|
label={<T id={'balance_sheet.total_change'} />}
|
||||||
{...field}
|
{...field}
|
||||||
|
onChange={({ currentTarget }) => {
|
||||||
|
setFieldValue('previous_year', currentTarget.checked);
|
||||||
|
setFieldValue(
|
||||||
|
'previous_year_amount_change',
|
||||||
|
currentTarget.checked,
|
||||||
|
);
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
)}
|
)}
|
||||||
</FastField>
|
</Field>
|
||||||
</Col>
|
</Col>
|
||||||
<Col xs={3}>
|
<Col xs={3}>
|
||||||
<FastField name={'previous_year_percentage_change'} type={'checkbox'}>
|
<FastField name={'previous_year_percentage_change'} type={'checkbox'}>
|
||||||
{({ field }) => (
|
{({ form: { setFieldValue }, field }) => (
|
||||||
<FormGroup labelInfo={<FieldHint />}>
|
<FormGroup labelInfo={<FieldHint />}>
|
||||||
<Checkbox
|
<Checkbox
|
||||||
inline={true}
|
inline={true}
|
||||||
small={true}
|
|
||||||
label={<T id={'balance_sheet.change'} />}
|
label={<T id={'balance_sheet.change'} />}
|
||||||
{...field}
|
{...field}
|
||||||
|
onChange={({ currentTarget }) => {
|
||||||
|
setFieldValue('previous_year', currentTarget.checked);
|
||||||
|
setFieldValue(
|
||||||
|
'previous_year_percentage_change',
|
||||||
|
currentTarget.checked,
|
||||||
|
);
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
)}
|
)}
|
||||||
@@ -58,13 +76,14 @@ export default function BalanceSheetHeaderComparisonPanal() {
|
|||||||
</Row>
|
</Row>
|
||||||
{/*------------ Previous Period -----------*/}
|
{/*------------ Previous Period -----------*/}
|
||||||
<FastField name={'previous_period'} type={'checkbox'}>
|
<FastField name={'previous_period'} type={'checkbox'}>
|
||||||
{({ field }) => (
|
{({ form, field }) => (
|
||||||
<FormGroup labelInfo={<FieldHint />}>
|
<FormGroup labelInfo={<FieldHint />}>
|
||||||
<Checkbox
|
<Checkbox
|
||||||
inline={true}
|
inline={true}
|
||||||
small={true}
|
small={true}
|
||||||
label={<T id={'balance_sheet.previous_period'} />}
|
label={<T id={'balance_sheet.previous_period'} />}
|
||||||
{...field}
|
{...field}
|
||||||
|
onChange={handlePreviousPeriodCheckBoxChange(form)}
|
||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
)}
|
)}
|
||||||
@@ -72,13 +91,20 @@ export default function BalanceSheetHeaderComparisonPanal() {
|
|||||||
<Row>
|
<Row>
|
||||||
<Col xs={3}>
|
<Col xs={3}>
|
||||||
<FastField name={'previous_period_amount_change'} type={'checkbox'}>
|
<FastField name={'previous_period_amount_change'} type={'checkbox'}>
|
||||||
{({ field }) => (
|
{({ form: { setFieldValue }, field }) => (
|
||||||
<FormGroup labelInfo={<FieldHint />}>
|
<FormGroup labelInfo={<FieldHint />}>
|
||||||
<Checkbox
|
<Checkbox
|
||||||
inline={true}
|
inline={true}
|
||||||
small={true}
|
small={true}
|
||||||
label={<T id={'balance_sheet.total_change'} />}
|
label={<T id={'balance_sheet.total_change'} />}
|
||||||
{...field}
|
{...field}
|
||||||
|
onChange={({ currentTarget }) => {
|
||||||
|
setFieldValue('previous_period', currentTarget.checked);
|
||||||
|
setFieldValue(
|
||||||
|
'previous_period_amount_change',
|
||||||
|
currentTarget.checked,
|
||||||
|
);
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
)}
|
)}
|
||||||
@@ -89,22 +115,28 @@ export default function BalanceSheetHeaderComparisonPanal() {
|
|||||||
name={'previous_period_percentage_change'}
|
name={'previous_period_percentage_change'}
|
||||||
type={'checkbox'}
|
type={'checkbox'}
|
||||||
>
|
>
|
||||||
{({ field }) => (
|
{({ form: { setFieldValue }, field }) => (
|
||||||
<FormGroup labelInfo={<FieldHint />}>
|
<FormGroup labelInfo={<FieldHint />}>
|
||||||
<Checkbox
|
<Checkbox
|
||||||
inline={true}
|
inline={true}
|
||||||
small={true}
|
|
||||||
label={<T id={'balance_sheet.change'} />}
|
label={<T id={'balance_sheet.change'} />}
|
||||||
{...field}
|
{...field}
|
||||||
|
onChange={({ currentTarget }) => {
|
||||||
|
setFieldValue('previous_period', currentTarget.checked);
|
||||||
|
setFieldValue(
|
||||||
|
'previous_period_percentage_change',
|
||||||
|
currentTarget.checked,
|
||||||
|
);
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
)}
|
)}
|
||||||
</FastField>
|
</FastField>
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
</Row>
|
||||||
|
|
||||||
{/**----------- % of Column -----------*/}
|
{/**----------- % of Column -----------*/}
|
||||||
<FastField name={'previous_period_percentage_change'} type={'checkbox'}>
|
<FastField name={'percentage_of_column'} type={'checkbox'}>
|
||||||
{({ field }) => (
|
{({ field }) => (
|
||||||
<FormGroup labelInfo={<FieldHint />}>
|
<FormGroup labelInfo={<FieldHint />}>
|
||||||
<Checkbox
|
<Checkbox
|
||||||
@@ -118,7 +150,7 @@ export default function BalanceSheetHeaderComparisonPanal() {
|
|||||||
</FastField>
|
</FastField>
|
||||||
|
|
||||||
{/**----------- % of Row -----------*/}
|
{/**----------- % of Row -----------*/}
|
||||||
<FastField name={'previous_period_percentage_change'} type={'checkbox'}>
|
<FastField name={'percentage_of_row'} type={'checkbox'}>
|
||||||
{({ field }) => (
|
{({ field }) => (
|
||||||
<FormGroup labelInfo={<FieldHint />}>
|
<FormGroup labelInfo={<FieldHint />}>
|
||||||
<Checkbox
|
<Checkbox
|
||||||
@@ -138,12 +170,11 @@ const BalanceSheetComparisonWrap = styled.div`
|
|||||||
.row {
|
.row {
|
||||||
margin-left: 0.15rem;
|
margin-left: 0.15rem;
|
||||||
.col {
|
.col {
|
||||||
min-width: 150px;
|
min-width: 150px !important;
|
||||||
max-width: 190px;
|
max-width: 190px !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.bp3-form-group {
|
.bp3-form-group {
|
||||||
margin-bottom: 3px;
|
margin-bottom: 3px;
|
||||||
/* margin-bottom: 0; */
|
|
||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|||||||
@@ -362,3 +362,17 @@ const dynamicColumnMapper = R.curry((data, column) => {
|
|||||||
export const dynamicColumns = (columns, data) => {
|
export const dynamicColumns = (columns, data) => {
|
||||||
return R.map(dynamicColumnMapper(data), columns);
|
return R.map(dynamicColumnMapper(data), columns);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const handlePreviousYearCheckBoxChange = R.curry((form, event) => {
|
||||||
|
const isChecked = event.currentTarget.checked;
|
||||||
|
form.setFieldValue('previous_year', isChecked);
|
||||||
|
form.setFieldValue('previous_year_amount_change', isChecked);
|
||||||
|
form.setFieldValue('previous_year_percentage_change', isChecked);
|
||||||
|
});
|
||||||
|
|
||||||
|
export const handlePreviousPeriodCheckBoxChange = R.curry((form, event) => {
|
||||||
|
const isChecked = event.currentTarget.checked;
|
||||||
|
form.setFieldValue('previous_period', isChecked);
|
||||||
|
form.setFieldValue('previous_period_amount_change', isChecked);
|
||||||
|
form.setFieldValue('previous_period_amount_change', isChecked);
|
||||||
|
});
|
||||||
|
|||||||
@@ -6,6 +6,10 @@ import styled from 'styled-components';
|
|||||||
import { FormattedMessage as T } from 'components';
|
import { FormattedMessage as T } from 'components';
|
||||||
|
|
||||||
import { Row, Col, FieldHint } from '../../../components';
|
import { Row, Col, FieldHint } from '../../../components';
|
||||||
|
import {
|
||||||
|
handlePreviousYearCheckBoxChange,
|
||||||
|
handlePreviousPeriodCheckBoxChange,
|
||||||
|
} from './utils';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* ProfitLoss sheet header -comparison panel.
|
* ProfitLoss sheet header -comparison panel.
|
||||||
@@ -15,13 +19,14 @@ export default function ProfitLossSheetHeaderComparisonPanel() {
|
|||||||
<ProfitLossSheetComparisonWrap>
|
<ProfitLossSheetComparisonWrap>
|
||||||
{/**----------- Previous Year -----------*/}
|
{/**----------- Previous Year -----------*/}
|
||||||
<FastField name={'previous_year'} type={'checkbox'}>
|
<FastField name={'previous_year'} type={'checkbox'}>
|
||||||
{({ field }) => (
|
{({ form, field }) => (
|
||||||
<FormGroup labelInfo={<FieldHint />}>
|
<FormGroup labelInfo={<FieldHint />}>
|
||||||
<Checkbox
|
<Checkbox
|
||||||
inline={true}
|
inline={true}
|
||||||
small={true}
|
small={true}
|
||||||
label={<T id={'profit_loss_sheet.previous_year'} />}
|
label={<T id={'profit_loss_sheet.previous_year'} />}
|
||||||
{...field}
|
{...field}
|
||||||
|
onChange={handlePreviousYearCheckBoxChange(form)}
|
||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
)}
|
)}
|
||||||
@@ -29,13 +34,20 @@ export default function ProfitLossSheetHeaderComparisonPanel() {
|
|||||||
<Row>
|
<Row>
|
||||||
<Col xs={3}>
|
<Col xs={3}>
|
||||||
<FastField name={'previous_year_amount_change'} type={'checkbox'}>
|
<FastField name={'previous_year_amount_change'} type={'checkbox'}>
|
||||||
{({ field }) => (
|
{({ form: { setFieldValue }, field }) => (
|
||||||
<FormGroup labelInfo={<FieldHint />}>
|
<FormGroup labelInfo={<FieldHint />}>
|
||||||
<Checkbox
|
<Checkbox
|
||||||
inline={true}
|
inline={true}
|
||||||
small={true}
|
small={true}
|
||||||
label={<T id={'profit_loss_sheet.total_change'} />}
|
label={<T id={'profit_loss_sheet.total_change'} />}
|
||||||
{...field}
|
{...field}
|
||||||
|
onChange={({ currentTarget }) => {
|
||||||
|
setFieldValue('previous_year', currentTarget.checked);
|
||||||
|
setFieldValue(
|
||||||
|
'previous_year_amount_change',
|
||||||
|
currentTarget.checked,
|
||||||
|
);
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
)}
|
)}
|
||||||
@@ -43,13 +55,20 @@ export default function ProfitLossSheetHeaderComparisonPanel() {
|
|||||||
</Col>
|
</Col>
|
||||||
<Col xs={3}>
|
<Col xs={3}>
|
||||||
<FastField name={'previous_year_percentage_change'} type={'checkbox'}>
|
<FastField name={'previous_year_percentage_change'} type={'checkbox'}>
|
||||||
{({ field }) => (
|
{({ form: { setFieldValue }, field }) => (
|
||||||
<FormGroup labelInfo={<FieldHint />}>
|
<FormGroup labelInfo={<FieldHint />}>
|
||||||
<Checkbox
|
<Checkbox
|
||||||
inline={true}
|
inline={true}
|
||||||
small={true}
|
small={true}
|
||||||
label={<T id={'profit_loss_sheet.perentage_change'} />}
|
label={<T id={'profit_loss_sheet.perentage_change'} />}
|
||||||
{...field}
|
{...field}
|
||||||
|
onChange={({ currentTarget }) => {
|
||||||
|
setFieldValue('previous_year', currentTarget.checked);
|
||||||
|
setFieldValue(
|
||||||
|
'previous_year_percentage_change',
|
||||||
|
currentTarget.checked,
|
||||||
|
);
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
)}
|
)}
|
||||||
@@ -58,13 +77,14 @@ export default function ProfitLossSheetHeaderComparisonPanel() {
|
|||||||
</Row>
|
</Row>
|
||||||
{/**----------- Previous Period (PP) -----------*/}
|
{/**----------- Previous Period (PP) -----------*/}
|
||||||
<FastField name={'previous_period'} type={'checkbox'}>
|
<FastField name={'previous_period'} type={'checkbox'}>
|
||||||
{({ field }) => (
|
{({ form, field }) => (
|
||||||
<FormGroup labelInfo={<FieldHint />}>
|
<FormGroup labelInfo={<FieldHint />}>
|
||||||
<Checkbox
|
<Checkbox
|
||||||
inline={true}
|
inline={true}
|
||||||
small={true}
|
small={true}
|
||||||
label={<T id={'profit_loss_sheet.previous_period'} />}
|
label={<T id={'profit_loss_sheet.previous_period'} />}
|
||||||
{...field}
|
{...field}
|
||||||
|
onChange={handlePreviousPeriodCheckBoxChange(form)}
|
||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
)}
|
)}
|
||||||
@@ -72,27 +92,44 @@ export default function ProfitLossSheetHeaderComparisonPanel() {
|
|||||||
<Row>
|
<Row>
|
||||||
<Col xs={3}>
|
<Col xs={3}>
|
||||||
<FastField name={'previous_period_amount_change'} type={'checkbox'}>
|
<FastField name={'previous_period_amount_change'} type={'checkbox'}>
|
||||||
{({ field }) => (
|
{({ form: { setFieldValue }, field }) => (
|
||||||
<FormGroup labelInfo={<FieldHint />}>
|
<FormGroup labelInfo={<FieldHint />}>
|
||||||
<Checkbox
|
<Checkbox
|
||||||
inline={true}
|
inline={true}
|
||||||
small={true}
|
small={true}
|
||||||
label={<T id={'profit_loss_sheet.total_change'} />}
|
label={<T id={'profit_loss_sheet.total_change'} />}
|
||||||
{...field}
|
{...field}
|
||||||
|
onChange={({ currentTarget }) => {
|
||||||
|
setFieldValue('previous_period', currentTarget.checked);
|
||||||
|
setFieldValue(
|
||||||
|
'previous_period_amount_change',
|
||||||
|
currentTarget.checked,
|
||||||
|
);
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
)}
|
)}
|
||||||
</FastField>
|
</FastField>
|
||||||
</Col>
|
</Col>
|
||||||
<Col xs={3}>
|
<Col xs={3}>
|
||||||
<FastField name={'previous_period_percentage_change'} type={'checkbox'}>
|
<FastField
|
||||||
{({ field }) => (
|
name={'previous_period_percentage_change'}
|
||||||
|
type={'checkbox'}
|
||||||
|
>
|
||||||
|
{({ form: { setFieldValue }, field }) => (
|
||||||
<FormGroup labelInfo={<FieldHint />}>
|
<FormGroup labelInfo={<FieldHint />}>
|
||||||
<Checkbox
|
<Checkbox
|
||||||
inline={true}
|
inline={true}
|
||||||
small={true}
|
small={true}
|
||||||
label={<T id={'profit_loss_sheet.perentage_change'} />}
|
label={<T id={'profit_loss_sheet.perentage_change'} />}
|
||||||
{...field}
|
{...field}
|
||||||
|
onChange={({ currentTarget }) => {
|
||||||
|
setFieldValue('previous_period', currentTarget.checked);
|
||||||
|
setFieldValue(
|
||||||
|
'previous_period_percentage_change',
|
||||||
|
currentTarget.checked,
|
||||||
|
);
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
)}
|
)}
|
||||||
@@ -159,12 +196,11 @@ const ProfitLossSheetComparisonWrap = styled.div`
|
|||||||
.row {
|
.row {
|
||||||
margin-left: 0.15rem;
|
margin-left: 0.15rem;
|
||||||
.col {
|
.col {
|
||||||
min-width: 150px;
|
min-width: 150px !important;
|
||||||
max-width: 190px;
|
max-width: 190px !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.bp3-form-group {
|
.bp3-form-group {
|
||||||
margin-bottom: 3px;
|
margin-bottom: 3px;
|
||||||
/* margin-bottom: 0; */
|
|
||||||
}
|
}
|
||||||
`;
|
`;
|
||||||
|
|||||||
@@ -379,3 +379,17 @@ const dynamicColumnMapper = R.curry((data, column) => {
|
|||||||
export const dynamicColumns = (columns, data) => {
|
export const dynamicColumns = (columns, data) => {
|
||||||
return R.map(dynamicColumnMapper(data), columns);
|
return R.map(dynamicColumnMapper(data), columns);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export const handlePreviousYearCheckBoxChange = R.curry((form, event) => {
|
||||||
|
const isChecked = event.currentTarget.checked;
|
||||||
|
form.setFieldValue('previous_year', isChecked);
|
||||||
|
form.setFieldValue('previous_year_amount_change', isChecked);
|
||||||
|
form.setFieldValue('previous_year_percentage_change', isChecked);
|
||||||
|
});
|
||||||
|
|
||||||
|
export const handlePreviousPeriodCheckBoxChange = R.curry((form, event) => {
|
||||||
|
const isChecked = event.currentTarget.checked;
|
||||||
|
form.setFieldValue('previous_period', isChecked);
|
||||||
|
form.setFieldValue('previous_period_amount_change', isChecked);
|
||||||
|
form.setFieldValue('previous_period_amount_change', isChecked);
|
||||||
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user