WIP / fix_accounts

This commit is contained in:
elforjani3
2020-07-01 13:24:18 +02:00
parent 111aa83908
commit aaa362f2f8
9 changed files with 266 additions and 208 deletions

View File

@@ -1,7 +1,7 @@
import React, { useEffect, useState, useMemo, useCallback } from 'react';
import { Route, Switch } from 'react-router-dom';
import { Alert, Intent } from '@blueprintjs/core';
import { useQuery } from 'react-query';
import { useQuery, queryCache } from 'react-query';
import {
FormattedMessage as T,
FormattedHTMLMessage,
@@ -136,16 +136,22 @@ function AccountsChart({
}, []);
// Handle confirm account activation.
const handleConfirmAccountActive = useCallback(() => {
requestInactiveAccount(inactiveAccount.id).then(() => {
setInactiveAccount(false);
AppToaster.show({
message: formatMessage({
id: 'the_account_has_been_successfully_inactivated',
}),
intent: Intent.SUCCESS,
requestInactiveAccount(inactiveAccount.id)
.then(() => {
setInactiveAccount(false);
AppToaster.show({
message: formatMessage({
id: 'the_account_has_been_successfully_inactivated',
}),
intent: Intent.SUCCESS,
});
queryCache.refetchQueries('accounts-table', { force: true });
})
.catch((error) => {
setInactiveAccount(false);
});
});
}, [inactiveAccount, requestInactiveAccount, formatMessage]);
// Handle activate account click.
@@ -160,16 +166,21 @@ function AccountsChart({
// Handle activate account confirm.
const handleConfirmAccountActivate = useCallback(() => {
requestActivateAccount(activateAccount.id).then(() => {
setActivateAccount(false);
AppToaster.show({
message: formatMessage({
id: 'the_account_has_been_successfully_activated',
}),
intent: Intent.SUCCESS,
requestActivateAccount(activateAccount.id)
.then(() => {
setActivateAccount(false);
AppToaster.show({
message: formatMessage({
id: 'the_account_has_been_successfully_activated',
}),
intent: Intent.SUCCESS,
});
queryCache.refetchQueries('accounts-table', { force: true });
})
.catch((error) => {
setActivateAccount(false);
});
});
});
}, [activateAccount, requestActivateAccount, formatMessage]);
const handleRestoreAccount = (account) => {};
@@ -341,7 +352,6 @@ function AccountsChart({
onEditAccount={handleEditAccount}
onFetchData={handleFetchData}
onSelectedRowsChange={handleSelectedRowsChange}
/>
</Route>
</Switch>

View File

@@ -69,7 +69,12 @@ function AccountsDataTable({
const handleNewParentAccount = useCallback(
(account) => {
openDialog('account-form', { action: 'new_child', id: account.id });
openDialog('account-form', {
action: 'new_child',
parentAccountId: account.id,
accountTypeId: account.account_type_id,
subaccount: true,
});
},
[openDialog],
);

View File

@@ -10,7 +10,7 @@ import {
deleteBulkAccounts,
bulkActivateAccounts,
bulkInactiveAccounts,
editAccount
editAccount,
} from 'store/accounts/accounts.actions';
const mapActionsToProps = (dispatch) => ({
@@ -22,9 +22,9 @@ const mapActionsToProps = (dispatch) => ({
requestActivateAccount: (id) => dispatch(activateAccount({ id })),
requestFetchAccount: (id) => dispatch(fetchAccount({ id })),
requestDeleteBulkAccounts: (ids) => dispatch(deleteBulkAccounts({ ids })),
requestBulkActivateAccounts:(ids)=>dispatch(bulkActivateAccounts({ids})),
requestBulkInactiveAccounts:(ids)=>dispatch(bulkInactiveAccounts({ids})),
requestEditAccount:({id,form}) => dispatch(editAccount({id,form}))
requestBulkActivateAccounts: (ids) => dispatch(bulkActivateAccounts({ ids })),
requestBulkInactiveAccounts: (ids) => dispatch(bulkInactiveAccounts({ ids })),
requestEditAccount: (id, form) => dispatch(editAccount(id, form)),
});
export default connect(null, mapActionsToProps);
export default connect(null, mapActionsToProps);

View File

@@ -9,7 +9,6 @@ import withAccounts from 'containers/Accounts/withAccounts';
export const mapStateToProps = (state, props) => {
const dialogPayload = getDialogPayload(state, 'account-form');
return {
name: 'account-form',
payload: { action: 'new', id: null, ...dialogPayload },

View File

@@ -1,4 +1,4 @@
import React, { useCallback, useEffect, useMemo } from 'react';
import React, { useCallback, useEffect, useMemo, useState } from 'react';
import {
Button,
Classes,
@@ -13,7 +13,7 @@ import {
import * as Yup from 'yup';
import { useFormik } from 'formik';
import { FormattedMessage as T, useIntl } from 'react-intl';
import { If } from 'components';
import { omit, pick } from 'lodash';
import { useQuery, queryCache } from 'react-query';
@@ -59,14 +59,16 @@ function AccountFormDialog({
.nullable()
.required()
.label(formatMessage({ id: 'account_type_id' })),
description: Yup.string().trim(),
description: Yup.string().nullable().trim(),
// parent_account_id: Yup.string().nullable(),
});
const initialValues = useMemo(
() => ({
account_type_id: null,
name: '',
description: '',
code: '',
type: '',
}),
[],
);
@@ -92,7 +94,11 @@ function AccountFormDialog({
} = useFormik({
enableReinitialize: true,
initialValues: {
...(payload.action === 'edit' && account ? account : initialValues),
// ...initialValues,
// ...(payload.action === 'edit' && account ? account : initialValues),
...(payload.action === 'edit' &&
pick(account, Object.keys(initialValues))),
},
validationSchema: accountFormValidationSchema,
onSubmit: (values, { setSubmitting, setErrors }) => {
@@ -102,22 +108,12 @@ function AccountFormDialog({
: values.name;
if (payload.action === 'edit') {
requestEditAccount({
payload: payload.id,
// form: { ...omit(values, [...exclude, 'account_type_id']) },
form: {
...pick(values, [
...exclude,
'account_type_id',
'name',
'description',
]),
},
})
requestEditAccount(payload.id, values)
.then((response) => {
closeDialog(name);
queryCache.refetchQueries('accounts-table', { force: true });
closeDialog(name);
AppToaster.show({
message: formatMessage(
{ id: 'service_has_been_successful_edited' },
@@ -135,7 +131,10 @@ function AccountFormDialog({
setSubmitting(false);
});
} else {
requestSubmitAccount({ form: { ...omit(values, exclude) } })
requestSubmitAccount({
payload: payload.parent_account_id,
form: { ...omit(values, exclude) },
})
.then((response) => {
closeDialog(name);
queryCache.refetchQueries('accounts-table', { force: true });
@@ -161,6 +160,9 @@ function AccountFormDialog({
},
});
const handlechange = useCallback((newChecked) => {
setChecked(newChecked);
}, []);
// Filtered accounts based on the given account type.
const filteredAccounts = useMemo(
() =>
@@ -190,7 +192,12 @@ function AccountFormDialog({
// Account item of select accounts field.
const accountItem = (item, { handleClick, modifiers, query }) => {
return (
<MenuItem text={item.name} label={item.code} key={item.id} onClick={handleClick} />
<MenuItem
text={item.name}
label={item.code}
key={item.id}
onClick={handleClick}
/>
);
};
@@ -211,6 +218,8 @@ function AccountFormDialog({
[],
);
console.log(values, 'Values');
// Handles dialog close.
const handleClose = useCallback(() => {
closeDialog(name);
@@ -234,7 +243,15 @@ function AccountFormDialog({
// Fetch the given account id on edit mode.
const fetchAccount = useQuery(
payload.action === 'edit' && ['account', payload.id],
(payload.action === 'edit' && ['account', payload.id]) ||
(payload.action === 'new_child' && ['account', payload.parentAccountId]),
// payload.action === 'new_child' ||
// (payload.action === 'edit' && [
// 'account',
// payload.id,
// payload.parentAccountId,
// ]),
(key, id) => requestFetchAccount(id),
{ manual: true },
);
@@ -249,6 +266,13 @@ function AccountFormDialog({
fetchAccountsList.refetch();
fetchAccountsTypes.refetch();
fetchAccount.refetch();
if (payload.action === 'new_child') {
// sub account checkbox should be equal true.
setFieldValue('subaccount', payload.subaccount);
setFieldValue('parent_account_id', payload.parentAccountId);
setFieldValue('account_type_id', payload.accountTypeId);
}
}, [fetchAccount, fetchAccountsList, fetchAccountsTypes]);
const onChangeAccountType = useCallback(
@@ -376,10 +400,11 @@ function AccountFormDialog({
inline={true}
label={subAccountLabel}
{...getFieldProps('subaccount')}
checked={values.subaccount}
/>
</FormGroup>
{values.subaccount && (
<If condition={values.subaccount}>
{/* {values.subaccount && ( */}
<FormGroup
label={<T id={'parent_account'} />}
className={classNames(
@@ -402,8 +427,8 @@ function AccountFormDialog({
labelProp={'name'}
/>
</FormGroup>
)}
{/* )} */}
</If>
<FormGroup
label={<T id={'description'} />}
className={'form-group--description'}

View File

@@ -67,8 +67,10 @@ function ExchangeRateDialog({
[],
);
const fetchExchangeRatesDialog = useQuery('exchange-rates-dialog', () =>
requestFetchExchangeRates(),
const fetchExchangeRatesDialog = useQuery(
'exchange-rates-dialog',
() => requestFetchExchangeRates(),
{ manual: true },
);
const {

View File

@@ -78,8 +78,8 @@ function ViewForm({
const validationSchema = Yup.object().shape({
resource_name: Yup.string().required(),
name: Yup.string().required(),
logic_expression: Yup.string().required(),
name: Yup.string().required().label(intl.formatMessage({id:'name_'})),
logic_expression: Yup.string().required().label(intl.formatMessage({id:'logic_expression'})),
roles: Yup.array().of(
Yup.object().shape({
comparator: Yup.string().required(),

View File

@@ -447,6 +447,7 @@ export default {
as_date: 'As Date',
aging_before_days: 'Aging before days',
aging_periods: 'Aging periods',
name_:'name',
as: 'As',
receivable_aging_summary: 'Receivable Aging Summary',
customers: 'Customers',
@@ -457,7 +458,7 @@ export default {
customer_type: 'Customer Type',
business: 'business',
individual: 'Individual',
display_name:'Display Name',
display_name: 'Display Name',
the_customer_has_been_successfully_created:
'The customer has been successfully created.',
select_contact: 'Select contact',
@@ -470,7 +471,8 @@ export default {
all_reports: 'All Reports',
next: 'Next',
previous: 'Previous',
showing_current_page_to_total: 'Showing {currentPage} to {totalPages} of {total} entries',
showing_current_page_to_total:
'Showing {currentPage} to {totalPages} of {total} entries',
new_child_account: 'New Child Account',
display_name: 'Display Name',
contact_name: 'Contact Name',
@@ -489,14 +491,14 @@ export default {
shipping_address: 'Shipping Address',
customers_list: 'Customers List',
edit_customer_details: 'Edit Customer Details',
receivable_balance:'Receivable balance',
receivable_balance: 'Receivable balance',
the_customer_has_been_successfully_created:
'The customer has been successfully created.',
the_customer_has_been_successfully_deleted:
'The customer has been successfully deleted.',
the_customers_has_been_successfully_deleted:
'The customers have been successfully deleted.',
the_item_customer_has_been_successfully_edited:
the_item_customer_has_been_successfully_edited:
'The item customer has been successfully edited.',
once_delete_this_customer_you_will_able_to_restore_it: `Once you delete this customer, you won\'t be able to restore it later. Are you sure you want to delete this cusomter?`,
once_delete_these_customers_you_will_not_able_restore_them:
@@ -510,4 +512,5 @@ export default {
create_a_new_view: 'Create a new view',
in: 'In',
not_equals: 'Not Equals',
logic_expression: 'logic expression ',
};

View File

@@ -6,44 +6,48 @@ export const fetchAccountTypes = () => {
return (dispatch, getState) =>
new Promise((resolve, reject) => {
ApiService.get('account_types')
.then(response => {
.then((response) => {
dispatch({
type: t.ACCOUNT_TYPES_LIST_SET,
account_types: response.data.account_types
account_types: response.data.account_types,
});
resolve(response);
})
.catch(error => { reject(error); });
.catch((error) => {
reject(error);
});
});
};
export const fetchAccountsList = ({ query } = {}) => {
return dispatch => new Promise((resolve, reject) => {
dispatch({
type: t.SET_DASHBOARD_REQUEST_LOADING,
return (dispatch) =>
new Promise((resolve, reject) => {
dispatch({
type: t.SET_DASHBOARD_REQUEST_LOADING,
});
ApiService.get('accounts', { params: query })
.then((response) => {
dispatch({
type: t.ACCOUNTS_PAGE_SET,
accounts: response.data.accounts,
customViewId: response.data.customViewId,
});
dispatch({
type: t.ACCOUNTS_ITEMS_SET,
accounts: response.data.accounts,
});
dispatch({
type: t.SET_DASHBOARD_REQUEST_COMPLETED,
});
resolve(response);
})
.catch((error) => {
dispatch({
type: t.SET_DASHBOARD_REQUEST_COMPLETED,
});
reject(error);
});
});
ApiService.get('accounts', { params: query }).then(response => {
dispatch({
type: t.ACCOUNTS_PAGE_SET,
accounts: response.data.accounts,
customViewId: response.data.customViewId
});
dispatch({
type: t.ACCOUNTS_ITEMS_SET,
accounts: response.data.accounts
});
dispatch({
type: t.SET_DASHBOARD_REQUEST_COMPLETED,
});
resolve(response);
})
.catch((error) => {
dispatch({
type: t.SET_DASHBOARD_REQUEST_COMPLETED,
});
reject(error);
});
});
};
export const fetchAccountsTable = ({ query } = {}) => {
@@ -54,7 +58,8 @@ export const fetchAccountsTable = ({ query } = {}) => {
if (pageQuery.filter_roles) {
pageQuery = {
...omit(pageQuery, ['filter_roles']),
stringified_filter_roles: JSON.stringify(pageQuery.filter_roles) || '',
stringified_filter_roles:
JSON.stringify(pageQuery.filter_roles) || '',
};
}
dispatch({
@@ -69,11 +74,11 @@ export const fetchAccountsTable = ({ query } = {}) => {
dispatch({
type: t.ACCOUNTS_PAGE_SET,
accounts: response.data.accounts,
customViewId: response.data.customViewId
customViewId: response.data.customViewId,
});
dispatch({
type: t.ACCOUNTS_ITEMS_SET,
accounts: response.data.accounts
accounts: response.data.accounts,
});
dispatch({
type: t.ACCOUNTS_TABLE_LOADING,
@@ -94,29 +99,29 @@ export const fetchAccountsTable = ({ query } = {}) => {
};
export const fetchAccountsDataTable = ({ query }) => {
return dispatch =>
return (dispatch) =>
new Promise((resolve, reject) => {
ApiService.get('accounts')
.then(response => {
.then((response) => {
dispatch({
type: t.ACCOUNTS_DATA_TABLE,
data: response.data
data: response.data,
});
})
.catch(error => {
.catch((error) => {
reject(error);
});
});
};
export const submitAccount = ({ form }) => {
return dispatch =>
return (dispatch) =>
new Promise((resolve, reject) => {
dispatch({
type: t.SET_DASHBOARD_REQUEST_LOADING,
});
ApiService.post('accounts', form)
.then(response => {
.then((response) => {
dispatch({
type: t.ACCOUNT_ERRORS_CLEAR,
});
@@ -125,140 +130,149 @@ export const submitAccount = ({ form }) => {
});
resolve(response);
})
.catch(error => {
.catch((error) => {
const { response } = error;
const { data } = response;
const { errors } = data;
// const { errors } = data;
dispatch({
type: t.ACCOUNT_ERRORS_CLEAR,
});
if (errors) {
if (error) {
dispatch({
type: t.ACCOUNT_ERRORS_SET,
payload: { errors },
payload: { error },
});
}
dispatch({
type: t.SET_DASHBOARD_REQUEST_COMPLETED,
});
reject(errors);
reject(data?.errors);
});
});
};
export const editAccount = ({ id, form }) => {
return dispatch => new Promise((resolve, reject) => {
dispatch({
type: t.SET_DASHBOARD_REQUEST_LOADING,
});
ApiService.post(`accounts/${id}`, form)
.then(response => {
dispatch({ type: t.CLEAR_ACCOUNT_FORM_ERRORS });
dispatch({
type: t.SET_DASHBOARD_REQUEST_COMPLETED,
});
resolve(response);
})
.catch(error => {
const { response } = error;
const { data } = response;
const { errors } = data;
dispatch({ type: t.CLEAR_ACCOUNT_FORM_ERRORS });
if (errors) {
dispatch({ type: t.ACCOUNT_FORM_ERRORS, errors });
}
dispatch({
type: t.SET_DASHBOARD_REQUEST_COMPLETED,
});
reject(errors);
});
});
};
export const activateAccount = ({ id }) => {
return dispatch => ApiService.post(`accounts/${id}/active`);
};
export const inactiveAccount = ({ id }) => {
return dispatch => ApiService.post(`accounts/${id}/inactive`);
};
export const bulkActivateAccounts =({ids})=>{
return dispatch => new Promise((resolve, reject) => {
ApiService.post(`accounts/bulk/activate`, null, { params: { ids }}).then((response) => {
dispatch({
type: t.BULK_ACTIVATE_ACCOUNTS,
payload: { ids }
});
resolve(response);
}).catch((error) => {
reject(error);
});
});
}
export const bulkInactiveAccounts =({ids})=>{
return dispatch => new Promise((resolve, reject) => {
ApiService.post(`accounts/bulk/inactivate`, null, { params: { ids }}).then((response) => {
dispatch({
type: t.BULK_INACTIVATE_ACCOUNTS,
payload: { ids }
});
resolve(response);
}).catch((error) => {
reject(error);
});
});
}
export const deleteAccount = ({ id }) => {
return dispatch => new Promise((resolve, reject) => {
ApiService.delete(`accounts/${id}`).then((response) => {
dispatch({ type: t.ACCOUNT_DELETE, id });
resolve(response);
}).catch((error) => {
reject(error.response.data.errors || []);
});
});
};
export const deleteBulkAccounts = ({ ids }) => {
return dispatch => new Promise((resolve, reject) => {
ApiService.delete(`accounts`, { params: { ids }}).then((response) => {
dispatch({
type: t.ACCOUNTS_BULK_DELETE,
payload: { ids }
});
resolve(response);
}).catch((error) => {
const { response } = error;
const { data } = response;
const { errors } = data;
reject(errors);
});
});
};
export const fetchAccount = ({ id }) => {
return dispatch =>
export const editAccount = (id, form) => {
return (dispatch) =>
new Promise((resolve, reject) => {
ApiService.get(`accounts/${id}`)
.then(response => {
dispatch({
type: t.SET_DASHBOARD_REQUEST_LOADING,
});
ApiService.post(`accounts/${id}`, form)
.then((response) => {
dispatch({ type: t.CLEAR_ACCOUNT_FORM_ERRORS });
dispatch({
type: t.ACCOUNT_SET,
account: response.data.account
type: t.SET_DASHBOARD_REQUEST_COMPLETED,
});
resolve(response);
})
.catch(error => {
.catch((error) => {
const { response } = error;
const { data } = response;
// const { errors } = data;
dispatch({ type: t.CLEAR_ACCOUNT_FORM_ERRORS });
if (error) {
dispatch({ type: t.ACCOUNT_FORM_ERRORS, error });
}
dispatch({
type: t.SET_DASHBOARD_REQUEST_COMPLETED,
});
reject(data?.errors);
});
});
};
export const activateAccount = ({ id }) => {
return (dispatch) => ApiService.post(`accounts/${id}/active`);
};
export const inactiveAccount = ({ id }) => {
return (dispatch) => ApiService.post(`accounts/${id}/inactive`);
};
export const bulkActivateAccounts = ({ ids }) => {
return (dispatch) =>
new Promise((resolve, reject) => {
ApiService.post(`accounts/bulk/activate`, null, { params: { ids } })
.then((response) => {
dispatch({
type: t.BULK_ACTIVATE_ACCOUNTS,
payload: { ids },
});
resolve(response);
})
.catch((error) => {
reject(error);
});
});
};
export const bulkInactiveAccounts = ({ ids }) => {
return (dispatch) =>
new Promise((resolve, reject) => {
ApiService.post(`accounts/bulk/inactivate`, null, { params: { ids } })
.then((response) => {
dispatch({
type: t.BULK_INACTIVATE_ACCOUNTS,
payload: { ids },
});
resolve(response);
})
.catch((error) => {
reject(error);
});
});
};
export const deleteAccount = ({ id }) => {
return (dispatch) =>
new Promise((resolve, reject) => {
ApiService.delete(`accounts/${id}`)
.then((response) => {
dispatch({ type: t.ACCOUNT_DELETE, id });
resolve(response);
})
.catch((error) => {
reject(error.response.data.errors || []);
});
});
};
export const deleteBulkAccounts = ({ ids }) => {
return (dispatch) =>
new Promise((resolve, reject) => {
ApiService.delete(`accounts`, { params: { ids } })
.then((response) => {
dispatch({
type: t.ACCOUNTS_BULK_DELETE,
payload: { ids },
});
resolve(response);
})
.catch((error) => {
const { response } = error;
const { data } = response;
// const { errors } = data;
reject(data?.errors);
});
});
};
export const fetchAccount = ({ id }) => {
return (dispatch) =>
new Promise((resolve, reject) => {
ApiService.get(`accounts/${id}`)
.then((response) => {
dispatch({
type: t.ACCOUNT_SET,
account: response.data.account,
});
resolve(response);
})
.catch((error) => {
reject(error);
});
});