From 3ab6c4da2a6dce1de44bd732c17b14fbe7a0fa5c Mon Sep 17 00:00:00 2001 From: elforjani3 Date: Sun, 8 Nov 2020 17:30:11 +0200 Subject: [PATCH] Fix : Estimate-Number-Dialog --- .../EstimateNumberDialogContent.js | 6 +++ .../containers/Sales/Estimate/EstimateForm.js | 45 ++++++++++++++++--- .../Sales/Estimate/EstimateFormHeader.js | 15 ++++++- .../Sales/Estimate/withEstimateActions.js | 5 +++ .../Sales/Estimate/withEstimates.js | 5 ++- .../src/store/Estimate/estimates.reducer.js | 5 +++ client/src/store/Estimate/estimates.types.js | 4 +- 7 files changed, 73 insertions(+), 12 deletions(-) diff --git a/client/src/containers/Dialogs/EstimateNumberDialog/EstimateNumberDialogContent.js b/client/src/containers/Dialogs/EstimateNumberDialog/EstimateNumberDialogContent.js index b62bafe2c..ca2feede4 100644 --- a/client/src/containers/Dialogs/EstimateNumberDialog/EstimateNumberDialogContent.js +++ b/client/src/containers/Dialogs/EstimateNumberDialog/EstimateNumberDialogContent.js @@ -5,6 +5,7 @@ import { useQuery, queryCache } from 'react-query'; import ReferenceNumberForm from 'containers/JournalNumber/ReferenceNumberForm'; import withDialogActions from 'containers/Dialog/withDialogActions'; import withSettingsActions from 'containers/Settings/withSettingsActions'; +import withEstimateActions from 'containers/Sales/Estimate/withEstimateActions'; import withSettings from 'containers/Settings/withSettings'; import { compose, optionsMapToArray } from 'utils'; @@ -23,6 +24,9 @@ function EstimateNumberDialogContent({ // #withDialogActions closeDialog, + + // #withEstimateActions + setEstimateNumberChanged, }) { const fetchSettings = useQuery(['settings'], () => requestFetchOptions({})); @@ -37,6 +41,7 @@ function EstimateNumberDialogContent({ setTimeout(() => { queryCache.invalidateQueries('settings'); + setEstimateNumberChanged(true); }, 250); }) .catch(() => { @@ -67,4 +72,5 @@ export default compose( nextNumber: estimatesSettings?.next_number, numberPrefix: estimatesSettings?.number_prefix, })), + withEstimateActions, )(EstimateNumberDialogContent); diff --git a/client/src/containers/Sales/Estimate/EstimateForm.js b/client/src/containers/Sales/Estimate/EstimateForm.js index 78f065584..c696bf93b 100644 --- a/client/src/containers/Sales/Estimate/EstimateForm.js +++ b/client/src/containers/Sales/Estimate/EstimateForm.js @@ -20,6 +20,7 @@ import EstimateFloatingActions from './EstimateFloatingActions'; import withEstimateActions from './withEstimateActions'; import withEstimateDetail from './withEstimateDetail'; +import withEstimates from './withEstimates'; import withDashboardActions from 'containers/Dashboard/withDashboardActions'; import withMediaActions from 'containers/Media/withMediaActions'; import withSettings from 'containers/Settings/withSettings'; @@ -41,7 +42,7 @@ const EstimateForm = ({ //#WithEstimateActions requestSubmitEstimate, requestEditEstimate, - + setEstimateNumberChanged, //#withDashboard changePageTitle, changePageSubtitle, @@ -53,6 +54,9 @@ const EstimateForm = ({ //#withEstimateDetail estimate, + // #withEstimates + estimateNumberChanged, + //#own Props estimateId, onFormSubmit, @@ -81,10 +85,16 @@ const EstimateForm = ({ savedMediaIds.current = []; }; + const estimateNumber = estimateNumberPrefix + ? `${estimateNumberPrefix}-${estimateNextNumber}` + : estimateNextNumber; + useEffect(() => { if (estimate && estimate.id) { changePageTitle(formatMessage({ id: 'edit_estimate' })); + changePageSubtitle(`No. ${estimate.estimate_number}`); } else { + changePageSubtitle(`No. ${estimateNumber}`); changePageTitle(formatMessage({ id: 'new_estimate' })); } }, [changePageTitle, estimate, formatMessage]); @@ -153,9 +163,6 @@ const EstimateForm = ({ }), [], ); - const estimateNumber = estimateNumberPrefix - ? `${estimateNumberPrefix}-${estimateNextNumber}` - : estimateNextNumber; const defaultInitialValues = useMemo( () => ({ @@ -290,9 +297,20 @@ const EstimateForm = ({ } }, }); + useEffect(() => { - formik.setFieldValue('estimate_number', estimateNumber); - }, [estimateNumber]); + if (estimateNumberChanged) { + formik.setFieldValue('estimate_number', estimateNumber); + changePageSubtitle(`No. ${estimateNumber}`); + setEstimateNumberChanged(false); + } + }, [ + estimateNumber, + estimateNumberChanged, + setEstimateNumberChanged, + formik.setFieldValue, + changePageSubtitle, + ]); const handleSubmitClick = useCallback( (payload) => { @@ -336,10 +354,20 @@ const EstimateForm = ({ ); }; + const handleEstimateNumberChange = useCallback( + (estimateNumber) => { + changePageSubtitle(`No. ${estimateNumber}`); + }, + [changePageSubtitle], + ); + return (
- + ({ + estimateNumberChanged, + })), )(EstimateForm); diff --git a/client/src/containers/Sales/Estimate/EstimateFormHeader.js b/client/src/containers/Sales/Estimate/EstimateFormHeader.js index 1cbfdc8d4..eb5b6d40f 100644 --- a/client/src/containers/Sales/Estimate/EstimateFormHeader.js +++ b/client/src/containers/Sales/Estimate/EstimateFormHeader.js @@ -10,7 +10,7 @@ import { import { DateInput } from '@blueprintjs/datetime'; import { FormattedMessage as T } from 'react-intl'; import moment from 'moment'; -import { momentFormatter, compose, tansformDateValue } from 'utils'; +import { momentFormatter, compose, tansformDateValue, saveInvoke } from 'utils'; import classNames from 'classnames'; import { CLASSES } from 'common/classes'; import { @@ -33,6 +33,8 @@ function EstimateFormHeader({ customers, // #withDialogActions openDialog, + // #ownProps + onEstimateNumberChanged, }) { const handleDateChange = useCallback( (date_filed) => (date) => { @@ -67,9 +69,14 @@ function EstimateFormHeader({ openDialog('estimate-number-form', {}); }, [openDialog]); + const handleEstimateNumberChanged = (event) => { + saveInvoke(onEstimateNumberChanged, event.currentTarget.value); + }; + return (
+ {/* ----------- Customer name ----------- */} } inline={true} @@ -94,6 +101,7 @@ function EstimateFormHeader({ + {/* ----------- Estimate date ----------- */} } inline={true} @@ -119,6 +127,7 @@ function EstimateFormHeader({ + {/* ----------- Expiration date ----------- */} } inline={true} @@ -146,7 +155,7 @@ function EstimateFormHeader({ - {/*- Estimate -*/} + {/* ----------- Estimate number ----------- */} } inline={true} @@ -178,9 +187,11 @@ function EstimateFormHeader({ /> } {...getFieldProps('estimate_number')} + onBlur={handleEstimateNumberChanged} /> + {/* ----------- Reference ----------- */} } inline={true} diff --git a/client/src/containers/Sales/Estimate/withEstimateActions.js b/client/src/containers/Sales/Estimate/withEstimateActions.js index 4f9e43ce5..411437256 100644 --- a/client/src/containers/Sales/Estimate/withEstimateActions.js +++ b/client/src/containers/Sales/Estimate/withEstimateActions.js @@ -27,6 +27,11 @@ const mapDipatchToProps = (dispatch) => ({ type: t.ESTIMATES_TABLE_QUERIES_ADD, queries, }), + setEstimateNumberChanged: (isChanged) => + dispatch({ + type: t.ESTIMATE_NUMBER_CHANGED, + payload: { isChanged }, + }), }); export default connect(null, mapDipatchToProps); diff --git a/client/src/containers/Sales/Estimate/withEstimates.js b/client/src/containers/Sales/Estimate/withEstimates.js index b208206fa..a27aa83d3 100644 --- a/client/src/containers/Sales/Estimate/withEstimates.js +++ b/client/src/containers/Sales/Estimate/withEstimates.js @@ -13,14 +13,17 @@ export default (mapState) => { const mapStateToProps = (state, props) => { const query = getEstimatesTableQuery(state, props); - + const mapped = { estimatesCurrentPage: getEstimatesItems(state, props, query), estimateViews: getResourceViews(state, props, 'sales_estimates'), estimateItems: state.salesEstimates.items, estimateTableQuery: query, + estimatesPageination: getEstimatesPaginationMeta(state, props, query), estimatesLoading: state.salesEstimates.loading, + + estimateNumberChanged: state.salesEstimates.estimateNumberChanged, }; return mapState ? mapState(mapped, state, props) : mapped; }; diff --git a/client/src/store/Estimate/estimates.reducer.js b/client/src/store/Estimate/estimates.reducer.js index 55b6604f3..8171b5739 100644 --- a/client/src/store/Estimate/estimates.reducer.js +++ b/client/src/store/Estimate/estimates.reducer.js @@ -1,5 +1,6 @@ import { createReducer } from '@reduxjs/toolkit'; import { createTableQueryReducers } from 'store/queryReducers'; +import { journalNumberChangedReducer } from 'store/journalNumber.reducer'; import t from 'store/types'; @@ -12,6 +13,8 @@ const initialState = { page: 1, }, currentViewId: -1, + + estimateNumberChanged: false, }; const defaultEstimate = { @@ -98,6 +101,8 @@ const reducer = createReducer(initialState, { }, }; }, + + ...journalNumberChangedReducer(t.ESTIMATE_NUMBER_CHANGED), }); export default createTableQueryReducers('sales_estimates', reducer); diff --git a/client/src/store/Estimate/estimates.types.js b/client/src/store/Estimate/estimates.types.js index 5eb1bb7a1..357b9c955 100644 --- a/client/src/store/Estimate/estimates.types.js +++ b/client/src/store/Estimate/estimates.types.js @@ -8,6 +8,6 @@ export default { ESTIMATES_TABLE_LOADING: 'ESTIMATES_TABLE_LOADING', ESTIMATES_PAGINATION_SET: 'ESTIMATES_PAGINATION_SET', ESTIMATES_PAGE_SET: 'ESTIMATES_PAGE_SET', - ESTIMATES_ITEMS_SET:'ESTIMATES_ITEMS_SET', - + ESTIMATES_ITEMS_SET: 'ESTIMATES_ITEMS_SET', + ESTIMATE_NUMBER_CHANGED: 'ESTIMATE_NUMBER_CHANGED', };