mirror of
https://github.com/bigcapitalhq/bigcapital.git
synced 2026-02-20 14:50:32 +00:00
fix: Estimate views.
This commit is contained in:
@@ -3,8 +3,6 @@ import Icon from 'components/Icon';
|
|||||||
import {
|
import {
|
||||||
Button,
|
Button,
|
||||||
Classes,
|
Classes,
|
||||||
Menu,
|
|
||||||
MenuItem,
|
|
||||||
Popover,
|
Popover,
|
||||||
NavbarDivider,
|
NavbarDivider,
|
||||||
NavbarGroup,
|
NavbarGroup,
|
||||||
@@ -38,7 +36,7 @@ function EstimateActionsBar({
|
|||||||
|
|
||||||
// #withEstimateActions
|
// #withEstimateActions
|
||||||
addEstimatesTableQueries,
|
addEstimatesTableQueries,
|
||||||
|
changeEstimateView,
|
||||||
// #own Porps
|
// #own Porps
|
||||||
onFilterChanged,
|
onFilterChanged,
|
||||||
selectedRows = [],
|
selectedRows = [],
|
||||||
@@ -52,48 +50,25 @@ function EstimateActionsBar({
|
|||||||
history.push('/estimates/new');
|
history.push('/estimates/new');
|
||||||
}, [history]);
|
}, [history]);
|
||||||
|
|
||||||
// const filterDropdown = FilterDropdown({
|
|
||||||
// fields: resourceFields,
|
|
||||||
// initialCondition: {
|
|
||||||
// fieldKey: 'estimate_number',
|
|
||||||
// compatator: 'contains',
|
|
||||||
// value: '',
|
|
||||||
// },
|
|
||||||
// onFilterChange: (filterConditions) => {
|
|
||||||
// setFilterCount(filterConditions.length || 0);
|
|
||||||
// addEstimatesTableQueries({
|
|
||||||
// filter_roles: filterConditions || '',
|
|
||||||
// });
|
|
||||||
// onFilterChanged && onFilterChanged(filterConditions);
|
|
||||||
// },
|
|
||||||
// });
|
|
||||||
|
|
||||||
const hasSelectedRows = useMemo(() => selectedRows.length > 0, [
|
const hasSelectedRows = useMemo(() => selectedRows.length > 0, [
|
||||||
selectedRows,
|
selectedRows,
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const viewsMenuItems = estimateViews.map((view) => {
|
const handleTabChange = (viewId) => {
|
||||||
return (
|
changeEstimateView(viewId.id || -1);
|
||||||
<MenuItem href={`${path}/${view.id}/custom_view`} text={view.name} />
|
addEstimatesTableQueries({
|
||||||
);
|
custom_view_id: viewId.id || null,
|
||||||
});
|
});
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<DashboardActionsBar>
|
<DashboardActionsBar>
|
||||||
<NavbarGroup>
|
<NavbarGroup>
|
||||||
<Popover
|
<DashboardActionViewsList
|
||||||
content={<Menu>{viewsMenuItems}</Menu>}
|
resourceName={'estimates'}
|
||||||
minimal={true}
|
views={estimateViews}
|
||||||
interactionKind={PopoverInteractionKind.HOVER}
|
onChange={handleTabChange}
|
||||||
position={Position.BOTTOM_LEFT}
|
/>
|
||||||
>
|
|
||||||
<Button
|
|
||||||
className={classNames(Classes.MINIMAL, 'button--table-views')}
|
|
||||||
icon={<Icon icon="table-16" iconSize={16} />}
|
|
||||||
text={<T id={'table_views'} />}
|
|
||||||
rightIcon={'caret-down'}
|
|
||||||
/>
|
|
||||||
</Popover>
|
|
||||||
|
|
||||||
<NavbarDivider />
|
<NavbarDivider />
|
||||||
<Button
|
<Button
|
||||||
@@ -151,7 +126,7 @@ function EstimateActionsBar({
|
|||||||
}
|
}
|
||||||
|
|
||||||
const mapStateToProps = (state, props) => ({
|
const mapStateToProps = (state, props) => ({
|
||||||
resourceName: 'sales_estimates',
|
resourceName: 'sale_estimate',
|
||||||
});
|
});
|
||||||
const withEstimateActionsBar = connect(mapStateToProps);
|
const withEstimateActionsBar = connect(mapStateToProps);
|
||||||
|
|
||||||
|
|||||||
@@ -49,18 +49,19 @@ function EstimateList({
|
|||||||
|
|
||||||
const [selectedRows, setSelectedRows] = useState([]);
|
const [selectedRows, setSelectedRows] = useState([]);
|
||||||
|
|
||||||
// const fetchResourceViews = useQuery(
|
const fetchResourceViews = useQuery(
|
||||||
// ['resource-views', 'sales_estimates'],
|
['resource-views', 'sale_estimate'],
|
||||||
// (key, resourceName) => requestFetchResourceViews(resourceName),
|
(key, resourceName) => requestFetchResourceViews(resourceName),
|
||||||
// );
|
);
|
||||||
|
|
||||||
// const fetchResourceFields = useQuery(
|
const fetchResourceFields = useQuery(
|
||||||
// ['resource-fields', 'sales_estimates'],
|
['resource-fields', 'sale_estimate'],
|
||||||
// (key, resourceName) => requestFetchResourceFields(resourceName),
|
(key, resourceName) => requestFetchResourceFields(resourceName),
|
||||||
// );
|
);
|
||||||
|
|
||||||
const fetchEstimate = useQuery(['estimates-table', estimatesTableQuery], () =>
|
const fetchEstimate = useQuery(
|
||||||
requestFetchEstimatesTable(),
|
['estimates-table', estimatesTableQuery],
|
||||||
|
(key, _query) => requestFetchEstimatesTable({ ..._query }),
|
||||||
);
|
);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
@@ -117,7 +118,7 @@ function EstimateList({
|
|||||||
queryCache.invalidateQueries('estimates-table');
|
queryCache.invalidateQueries('estimates-table');
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
// setDeliverEstimate(false);
|
setDeliverEstimate(false);
|
||||||
});
|
});
|
||||||
}, [deliverEstimate, requestDeliverdEstimate, formatMessage]);
|
}, [deliverEstimate, requestDeliverdEstimate, formatMessage]);
|
||||||
|
|
||||||
@@ -145,7 +146,7 @@ function EstimateList({
|
|||||||
queryCache.invalidateQueries('estimates-table');
|
queryCache.invalidateQueries('estimates-table');
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
// setApproveEstimate(false);
|
setApproveEstimate(false);
|
||||||
});
|
});
|
||||||
}, [approveEstimate, requestApproveEstimate, formatMessage]);
|
}, [approveEstimate, requestApproveEstimate, formatMessage]);
|
||||||
|
|
||||||
@@ -176,7 +177,7 @@ function EstimateList({
|
|||||||
}, [rejectEstimate, requestRejectEstimate, formatMessage]);
|
}, [rejectEstimate, requestRejectEstimate, formatMessage]);
|
||||||
|
|
||||||
// Handle filter change to re-fetch data-table.
|
// Handle filter change to re-fetch data-table.
|
||||||
const handleFilterChanged = useCallback(() => {}, [fetchEstimate]);
|
const handleFilterChanged = useCallback(() => {}, []);
|
||||||
|
|
||||||
// Calculates the selected rows
|
// Calculates the selected rows
|
||||||
const selectedRowsCount = useMemo(() => Object.values(selectedRows).length, [
|
const selectedRowsCount = useMemo(() => Object.values(selectedRows).length, [
|
||||||
@@ -198,8 +199,8 @@ function EstimateList({
|
|||||||
);
|
);
|
||||||
return (
|
return (
|
||||||
<DashboardInsider
|
<DashboardInsider
|
||||||
// loading={fetchResourceViews.isFetching || fetchResourceFields.isFetching}
|
loading={fetchResourceViews.isFetching || fetchResourceFields.isFetching}
|
||||||
name={'sales_estimates'}
|
name={'sale_estimate'}
|
||||||
>
|
>
|
||||||
<EstimateActionsBar
|
<EstimateActionsBar
|
||||||
// onBulkDelete={}
|
// onBulkDelete={}
|
||||||
|
|||||||
@@ -6,7 +6,6 @@ import { connect } from 'react-redux';
|
|||||||
import { pick, debounce } from 'lodash';
|
import { pick, debounce } from 'lodash';
|
||||||
|
|
||||||
import { DashboardViewsTabs } from 'components';
|
import { DashboardViewsTabs } from 'components';
|
||||||
import { useUpdateEffect } from 'hooks';
|
|
||||||
|
|
||||||
import withEstimates from './withEstimates';
|
import withEstimates from './withEstimates';
|
||||||
import withEstimateActions from './withEstimateActions';
|
import withEstimateActions from './withEstimateActions';
|
||||||
@@ -15,6 +14,9 @@ import withViewDetails from 'containers/Views/withViewDetails';
|
|||||||
|
|
||||||
import { compose } from 'utils';
|
import { compose } from 'utils';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Estimates views tabs.
|
||||||
|
*/
|
||||||
function EstimateViewTabs({
|
function EstimateViewTabs({
|
||||||
// #withExpenses
|
// #withExpenses
|
||||||
estimateViews,
|
estimateViews,
|
||||||
@@ -37,39 +39,22 @@ function EstimateViewTabs({
|
|||||||
const { custom_view_id: customViewId = null } = useParams();
|
const { custom_view_id: customViewId = null } = useParams();
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
changeEstimateView(customViewId || -1);
|
|
||||||
setTopbarEditView(customViewId);
|
setTopbarEditView(customViewId);
|
||||||
changePageSubtitle(customViewId && viewItem ? viewItem.name : '');
|
changePageSubtitle(customViewId && viewItem ? viewItem.name : '');
|
||||||
|
|
||||||
addEstimatesTableQueries({
|
|
||||||
custom_view_id: customViewId,
|
|
||||||
});
|
|
||||||
return () => {
|
|
||||||
setTopbarEditView(null);
|
|
||||||
changePageSubtitle('');
|
|
||||||
changeEstimateView(null);
|
|
||||||
};
|
|
||||||
}, [customViewId, addEstimatesTableQueries, changeEstimateView]);
|
|
||||||
|
|
||||||
useUpdateEffect(() => {
|
|
||||||
onViewChanged && onViewChanged(customViewId);
|
|
||||||
}, [customViewId]);
|
}, [customViewId]);
|
||||||
|
|
||||||
const debounceChangeHistory = useRef(
|
|
||||||
debounce((toUrl) => {
|
|
||||||
history.push(toUrl);
|
|
||||||
}, 250),
|
|
||||||
);
|
|
||||||
|
|
||||||
const handleTabsChange = (viewId) => {
|
|
||||||
const toPath = viewId ? `${viewId}/custom_view` : '';
|
|
||||||
debounceChangeHistory.current(`/estimates/${toPath}`);
|
|
||||||
setTopbarEditView(viewId);
|
|
||||||
};
|
|
||||||
const tabs = estimateViews.map((view) => ({
|
const tabs = estimateViews.map((view) => ({
|
||||||
...pick(view, ['name', 'id']),
|
...pick(view, ['name', 'id']),
|
||||||
}));
|
}));
|
||||||
|
|
||||||
|
const handleTabsChange = (viewId) => {
|
||||||
|
changeEstimateView(viewId || -1);
|
||||||
|
addEstimatesTableQueries({
|
||||||
|
custom_view_id: viewId || null,
|
||||||
|
});
|
||||||
|
setTopbarEditView(viewId);
|
||||||
|
};
|
||||||
|
|
||||||
// Handle click a new view tab.
|
// Handle click a new view tab.
|
||||||
const handleClickNewView = () => {
|
const handleClickNewView = () => {
|
||||||
setTopbarEditView(null);
|
setTopbarEditView(null);
|
||||||
@@ -81,9 +66,8 @@ function EstimateViewTabs({
|
|||||||
<NavbarGroup align={Alignment.LEFT}>
|
<NavbarGroup align={Alignment.LEFT}>
|
||||||
<DashboardViewsTabs
|
<DashboardViewsTabs
|
||||||
initialViewId={customViewId}
|
initialViewId={customViewId}
|
||||||
baseUrl={'/estimates'}
|
resourceName={'estimates'}
|
||||||
tabs={tabs}
|
tabs={tabs}
|
||||||
onNewViewTabClick={handleClickNewView}
|
|
||||||
onChange={handleTabsChange}
|
onChange={handleTabsChange}
|
||||||
/>
|
/>
|
||||||
</NavbarGroup>
|
</NavbarGroup>
|
||||||
|
|||||||
@@ -20,7 +20,7 @@ export default (mapState) => {
|
|||||||
estimatesCurrentPage: getEstimatesItems(state, props, query),
|
estimatesCurrentPage: getEstimatesItems(state, props, query),
|
||||||
estimatesCurrentViewId: getEstimatesCurrentViewId(state, props),
|
estimatesCurrentViewId: getEstimatesCurrentViewId(state, props),
|
||||||
|
|
||||||
estimateViews: getResourceViews(state, props, 'sales_estimates'),
|
estimateViews: getResourceViews(state, props, 'sale_estimate'),
|
||||||
estimateItems: state.salesEstimates.items,
|
estimateItems: state.salesEstimates.items,
|
||||||
|
|
||||||
estimatesTableQuery: query,
|
estimatesTableQuery: query,
|
||||||
|
|||||||
@@ -92,7 +92,8 @@ export const fetchEstimatesTable = ({ query = {} }) => {
|
|||||||
payload: {
|
payload: {
|
||||||
sales_estimates: response.data.sales_estimates,
|
sales_estimates: response.data.sales_estimates,
|
||||||
pagination: response.data.pagination,
|
pagination: response.data.pagination,
|
||||||
customViewId: response.data.customViewId || -1,
|
customViewId:
|
||||||
|
response.data?.filter_meta?.view?.custom_view_id || -1,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
dispatch({
|
dispatch({
|
||||||
@@ -105,7 +106,8 @@ export const fetchEstimatesTable = ({ query = {} }) => {
|
|||||||
type: t.ESTIMATES_PAGINATION_SET,
|
type: t.ESTIMATES_PAGINATION_SET,
|
||||||
payload: {
|
payload: {
|
||||||
pagination: response.data.pagination,
|
pagination: response.data.pagination,
|
||||||
customViewId: response.data.customViewId || -1,
|
customViewId:
|
||||||
|
response.data?.filter_meta?.view?.custom_view_id || -1,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
dispatch({
|
dispatch({
|
||||||
|
|||||||
Reference in New Issue
Block a user