mirror of
https://github.com/bigcapitalhq/bigcapital.git
synced 2026-02-19 14:20:31 +00:00
feat: money in & out Hotkeys.
This commit is contained in:
@@ -3,11 +3,16 @@ import { useHotkeys } from 'react-hotkeys-hook';
|
|||||||
import { useHistory } from 'react-router-dom';
|
import { useHistory } from 'react-router-dom';
|
||||||
import { getDashboardRoutes } from 'routes/dashboard';
|
import { getDashboardRoutes } from 'routes/dashboard';
|
||||||
import withDashboardActions from 'containers/Dashboard/withDashboardActions';
|
import withDashboardActions from 'containers/Dashboard/withDashboardActions';
|
||||||
|
import withDialogActions from 'containers/Dialog/withDialogActions';
|
||||||
|
|
||||||
import { compose } from 'utils';
|
import { compose } from 'utils';
|
||||||
|
|
||||||
function GlobalHotkeys({
|
function GlobalHotkeys({
|
||||||
// #withDashboardActions
|
// #withDashboardActions
|
||||||
toggleSidebarExpend,
|
toggleSidebarExpend,
|
||||||
|
|
||||||
|
// #withDialogActions
|
||||||
|
openDialog,
|
||||||
}) {
|
}) {
|
||||||
const history = useHistory();
|
const history = useHistory();
|
||||||
const routes = getDashboardRoutes();
|
const routes = getDashboardRoutes();
|
||||||
@@ -17,7 +22,7 @@ function GlobalHotkeys({
|
|||||||
.map(({ hotkey }) => hotkey)
|
.map(({ hotkey }) => hotkey)
|
||||||
.toString();
|
.toString();
|
||||||
|
|
||||||
const handleSidebarToggleBtn = () => {
|
const handleSidebarToggleBtn = () => {
|
||||||
toggleSidebarExpend();
|
toggleSidebarExpend();
|
||||||
};
|
};
|
||||||
useHotkeys(
|
useHotkeys(
|
||||||
@@ -32,7 +37,9 @@ function GlobalHotkeys({
|
|||||||
[history],
|
[history],
|
||||||
);
|
);
|
||||||
useHotkeys('ctrl+/', (event, handle) => handleSidebarToggleBtn());
|
useHotkeys('ctrl+/', (event, handle) => handleSidebarToggleBtn());
|
||||||
|
useHotkeys('shift+q', (event, handle) => openDialog('money-in', {}));
|
||||||
|
useHotkeys('shift+d', (event, handle) => openDialog('money-out', {}));
|
||||||
return <div></div>;
|
return <div></div>;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default compose(withDashboardActions)(GlobalHotkeys);
|
export default compose(withDashboardActions, withDialogActions)(GlobalHotkeys);
|
||||||
|
|||||||
@@ -1,4 +1,5 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import { useFormikContext } from 'formik';
|
||||||
import { Classes } from '@blueprintjs/core';
|
import { Classes } from '@blueprintjs/core';
|
||||||
|
|
||||||
import { If } from 'components';
|
import { If } from 'components';
|
||||||
@@ -11,15 +12,17 @@ import { useMoneyInDailogContext } from './MoneyInDialogProvider';
|
|||||||
* Money in form fields.
|
* Money in form fields.
|
||||||
*/
|
*/
|
||||||
function MoneyInFormFields() {
|
function MoneyInFormFields() {
|
||||||
|
const { values } = useFormikContext();
|
||||||
|
|
||||||
// Money in dialog context.
|
// Money in dialog context.
|
||||||
const { accountId, accountType } = useMoneyInDailogContext();
|
const { accountId } = useMoneyInDailogContext();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={Classes.DIALOG_BODY}>
|
<div className={Classes.DIALOG_BODY}>
|
||||||
<If condition={!accountId}>
|
<If condition={!accountId}>
|
||||||
<TransactionTypeFields />
|
<TransactionTypeFields />
|
||||||
</If>
|
</If>
|
||||||
<MoneyInContentFields accountType={accountType} />
|
<MoneyInContentFields accountType={values.transaction_type} />
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { FastField, ErrorMessage } from 'formik';
|
import { FastField, Field, ErrorMessage } from 'formik';
|
||||||
import { Classes, FormGroup } from '@blueprintjs/core';
|
import { Classes, FormGroup } from '@blueprintjs/core';
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
import {
|
import {
|
||||||
@@ -32,7 +32,7 @@ export default function TransactionTypeFields() {
|
|||||||
<FastField name={'cashflow_account_id'}>
|
<FastField name={'cashflow_account_id'}>
|
||||||
{({ form, field: { value }, meta: { error, touched } }) => (
|
{({ form, field: { value }, meta: { error, touched } }) => (
|
||||||
<FormGroup
|
<FormGroup
|
||||||
label={'Current account'}
|
label={<T id={'cash_flow_transaction.label_current_account'} />}
|
||||||
labelInfo={<FieldRequiredHint />}
|
labelInfo={<FieldRequiredHint />}
|
||||||
intent={inputIntent({ error, touched })}
|
intent={inputIntent({ error, touched })}
|
||||||
helperText={<ErrorMessage name="cashflow_account_id" />}
|
helperText={<ErrorMessage name="cashflow_account_id" />}
|
||||||
@@ -57,7 +57,7 @@ export default function TransactionTypeFields() {
|
|||||||
{/*------------ Transaction type -----------*/}
|
{/*------------ Transaction type -----------*/}
|
||||||
</Col>
|
</Col>
|
||||||
<Col xs={5}>
|
<Col xs={5}>
|
||||||
<FastField name={'transaction_type'}>
|
<Field name={'transaction_type'}>
|
||||||
{({
|
{({
|
||||||
form: { values, setFieldValue },
|
form: { values, setFieldValue },
|
||||||
field: { value },
|
field: { value },
|
||||||
@@ -86,7 +86,7 @@ export default function TransactionTypeFields() {
|
|||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
)}
|
)}
|
||||||
</FastField>
|
</Field>
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
</Row>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -2,6 +2,7 @@ import React from 'react';
|
|||||||
import intl from 'react-intl-universal';
|
import intl from 'react-intl-universal';
|
||||||
import { Dialog, DialogSuspense } from 'components';
|
import { Dialog, DialogSuspense } from 'components';
|
||||||
import withDialogRedux from 'components/DialogReduxConnect';
|
import withDialogRedux from 'components/DialogReduxConnect';
|
||||||
|
|
||||||
import { compose } from 'redux';
|
import { compose } from 'redux';
|
||||||
|
|
||||||
const MoneyInDialogContent = React.lazy(() => import('./MoneyInDialogContent'));
|
const MoneyInDialogContent = React.lazy(() => import('./MoneyInDialogContent'));
|
||||||
@@ -14,6 +15,7 @@ function MoneyInDialog({
|
|||||||
payload = { account_type: null, account_id: null },
|
payload = { account_type: null, account_id: null },
|
||||||
isOpen,
|
isOpen,
|
||||||
}) {
|
}) {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Dialog
|
<Dialog
|
||||||
name={dialogName}
|
name={dialogName}
|
||||||
|
|||||||
@@ -1,4 +1,5 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import { useFormikContext } from 'formik';
|
||||||
import { Classes } from '@blueprintjs/core';
|
import { Classes } from '@blueprintjs/core';
|
||||||
|
|
||||||
import { If } from 'components';
|
import { If } from 'components';
|
||||||
@@ -12,14 +13,15 @@ import { useMoneyOutDialogContext } from './MoneyOutDialogProvider';
|
|||||||
*/
|
*/
|
||||||
function MoneyOutFormFields() {
|
function MoneyOutFormFields() {
|
||||||
// Money in dialog context.
|
// Money in dialog context.
|
||||||
const { accountId, accountType } = useMoneyOutDialogContext();
|
const { accountId } = useMoneyOutDialogContext();
|
||||||
|
|
||||||
|
const { values } = useFormikContext();
|
||||||
return (
|
return (
|
||||||
<div className={Classes.DIALOG_BODY}>
|
<div className={Classes.DIALOG_BODY}>
|
||||||
<If condition={!accountId}>
|
<If condition={!accountId}>
|
||||||
<TransactionTypeFields />
|
<TransactionTypeFields />
|
||||||
</If>
|
</If>
|
||||||
<MoneyOutContentFields accountType={accountType} />
|
<MoneyOutContentFields accountType={values.transaction_type} />
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { FastField, ErrorMessage } from 'formik';
|
import { FastField, Field, ErrorMessage } from 'formik';
|
||||||
import { FormGroup } from '@blueprintjs/core';
|
import { FormGroup } from '@blueprintjs/core';
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
import {
|
import {
|
||||||
@@ -32,7 +32,7 @@ function TransactionTypeFields() {
|
|||||||
<FastField name={'cashflow_account_id'}>
|
<FastField name={'cashflow_account_id'}>
|
||||||
{({ form, field: { value }, meta: { error, touched } }) => (
|
{({ form, field: { value }, meta: { error, touched } }) => (
|
||||||
<FormGroup
|
<FormGroup
|
||||||
label={'Current account'}
|
label={<T id={'cash_flow_transaction.label_current_account'} />}
|
||||||
labelInfo={<FieldRequiredHint />}
|
labelInfo={<FieldRequiredHint />}
|
||||||
intent={inputIntent({ error, touched })}
|
intent={inputIntent({ error, touched })}
|
||||||
helperText={<ErrorMessage name="cashflow_account_id" />}
|
helperText={<ErrorMessage name="cashflow_account_id" />}
|
||||||
@@ -57,7 +57,7 @@ function TransactionTypeFields() {
|
|||||||
{/*------------ Transaction type -----------*/}
|
{/*------------ Transaction type -----------*/}
|
||||||
</Col>
|
</Col>
|
||||||
<Col xs={5}>
|
<Col xs={5}>
|
||||||
<FastField name={'transaction_type'}>
|
<Field name={'transaction_type'}>
|
||||||
{({
|
{({
|
||||||
form: { values, setFieldValue },
|
form: { values, setFieldValue },
|
||||||
field: { value },
|
field: { value },
|
||||||
@@ -86,7 +86,7 @@ function TransactionTypeFields() {
|
|||||||
/>
|
/>
|
||||||
</FormGroup>
|
</FormGroup>
|
||||||
)}
|
)}
|
||||||
</FastField>
|
</Field>
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
</Row>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1388,7 +1388,8 @@
|
|||||||
"cash_flow_transaction.other_expense_account":"Other expense account",
|
"cash_flow_transaction.other_expense_account":"Other expense account",
|
||||||
"save_and_publish": "Save & Publish",
|
"save_and_publish": "Save & Publish",
|
||||||
"cash_flow_transaction.label_transfer_from_account":"Transfer from account",
|
"cash_flow_transaction.label_transfer_from_account":"Transfer from account",
|
||||||
"cash_flow_transaction.label_transfer_to_account":"Transfer to account"
|
"cash_flow_transaction.label_transfer_to_account":"Transfer to account",
|
||||||
|
"cash_flow_transaction.label_current_account":"Current account"
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user