mirror of
https://github.com/bigcapitalhq/bigcapital.git
synced 2026-02-16 04:40:32 +00:00
Merge remote-tracking branch 'origin/feature/bulk'
This commit is contained in:
@@ -44,6 +44,8 @@ function AccountsActionsBar({
|
||||
onFilterChanged,
|
||||
onBulkDelete,
|
||||
onBulkArchive,
|
||||
onBulkActivate,
|
||||
onBulkInactive
|
||||
}) {
|
||||
const history = useHistory();
|
||||
const [filterCount, setFilterCount] = useState(0);
|
||||
@@ -78,6 +80,17 @@ function AccountsActionsBar({
|
||||
onBulkDelete && onBulkDelete(selectedRows.map(r => r.id));
|
||||
}, [onBulkDelete, selectedRows]);
|
||||
|
||||
const handelBulkActivate =useCallback(()=>{
|
||||
|
||||
onBulkActivate && onBulkActivate(selectedRows.map(r=>r.id))
|
||||
},[onBulkActivate,selectedRows])
|
||||
|
||||
const handelBulkInactive =useCallback(()=>{
|
||||
|
||||
onBulkInactive && onBulkInactive(selectedRows.map(r=>r.id))
|
||||
|
||||
},[onBulkInactive,selectedRows])
|
||||
|
||||
return (
|
||||
<DashboardActionsBar>
|
||||
<NavbarGroup>
|
||||
@@ -116,11 +129,18 @@ function AccountsActionsBar({
|
||||
</Popover>
|
||||
|
||||
<If condition={hasSelectedRows}>
|
||||
|
||||
<Button
|
||||
className={Classes.MINIMAL}
|
||||
icon={<Icon icon='multi-select' iconSize={15} />}
|
||||
text={<T id={'activate'}/>}
|
||||
onClick={handelBulkActivate}
|
||||
/>
|
||||
<Button
|
||||
className={Classes.MINIMAL}
|
||||
icon={<Icon icon='archive' iconSize={15} />}
|
||||
text={<T id={'archive'}/>}
|
||||
onClick={handleBulkArchive}
|
||||
text={<T id={'inactivate'}/>}
|
||||
onClick={handelBulkInactive}
|
||||
/>
|
||||
<Button
|
||||
className={Classes.MINIMAL}
|
||||
|
||||
@@ -44,6 +44,8 @@ function AccountsChart({
|
||||
requestFetchAccountsTable,
|
||||
requestDeleteBulkAccounts,
|
||||
addAccountsTableQueries,
|
||||
requestBulkActivateAccounts,
|
||||
requestBulkInactiveAccounts,
|
||||
|
||||
// #withAccounts
|
||||
accountsTableQuery,
|
||||
@@ -55,7 +57,8 @@ function AccountsChart({
|
||||
const [activateAccount, setActivateAccount] = useState(false);
|
||||
const [bulkDelete, setBulkDelete] = useState(false);
|
||||
const [selectedRows, setSelectedRows] = useState([]);
|
||||
|
||||
const [bulkActivate,setBulkActivate] =useState(false);
|
||||
const [bulkInactiveAccounts,setBulkInactiveAccounts] =useState(false)
|
||||
const [tableLoading, setTableLoading] = useState(false);
|
||||
|
||||
// Fetch accounts resource views and fields.
|
||||
@@ -235,6 +238,65 @@ function AccountsChart({
|
||||
// Calculates the data table selected rows count.
|
||||
const selectedRowsCount = useMemo(() => Object.values(selectedRows).length, [selectedRows]);
|
||||
|
||||
|
||||
|
||||
// Handle bulk Activate accounts button click.,
|
||||
const handleBulkActivate = useCallback((bulkActivateIds) => {
|
||||
setBulkActivate(bulkActivateIds);
|
||||
}, [setBulkActivate]);
|
||||
|
||||
|
||||
// Handle cancel Bulk Activate accounts bulk delete.
|
||||
const handleCancelBulkActivate = useCallback(() => {
|
||||
setBulkActivate(false);
|
||||
}, []);
|
||||
|
||||
// Handle Bulk activate account confirm.
|
||||
const handleConfirmBulkActivate = useCallback(() => {
|
||||
requestBulkActivateAccounts(bulkActivate).then(() => {
|
||||
setBulkActivate(false);
|
||||
AppToaster.show({
|
||||
message: formatMessage({ id: 'the_accounts_has_been_successfully_activated' }),
|
||||
intent: Intent.SUCCESS,
|
||||
});
|
||||
}).catch((errors) => {
|
||||
setBulkActivate(false);
|
||||
|
||||
});
|
||||
}, [requestBulkActivateAccounts, bulkActivate]);
|
||||
|
||||
|
||||
|
||||
// Handle bulk Inactive accounts button click.,
|
||||
const handleBulkInactive = useCallback((bulkInactiveIds) => {
|
||||
setBulkInactiveAccounts(bulkInactiveIds);
|
||||
}, [setBulkInactiveAccounts]);
|
||||
|
||||
|
||||
// Handle cancel Bulk Inactive accounts bulk delete.
|
||||
const handleCancelBulkInactive = useCallback(() => {
|
||||
setBulkInactiveAccounts(false);
|
||||
}, []);
|
||||
|
||||
// Handle Bulk Inactive accounts confirm.
|
||||
const handleConfirmBulkInactive = useCallback(() => {
|
||||
requestBulkInactiveAccounts(bulkInactiveAccounts).then(() => {
|
||||
setBulkInactiveAccounts(false);
|
||||
AppToaster.show({
|
||||
message: formatMessage({ id: 'the_accounts_has_been_successfully_inactivated' }),
|
||||
intent: Intent.SUCCESS,
|
||||
});
|
||||
}).catch((errors) => {
|
||||
setBulkInactiveAccounts(false);
|
||||
|
||||
});
|
||||
}, [requestBulkInactiveAccounts, bulkInactiveAccounts]);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<DashboardInsider loading={fetchHook.isFetching} name={'accounts-chart'}>
|
||||
<DashboardActionsBar
|
||||
@@ -242,6 +304,8 @@ function AccountsChart({
|
||||
onFilterChanged={handleFilterChanged}
|
||||
onBulkDelete={handleBulkDelete}
|
||||
onBulkArchive={handleBulkArchive}
|
||||
onBulkActivate={handleBulkActivate}
|
||||
onBulkInactive={handleBulkInactive}
|
||||
/>
|
||||
|
||||
<DashboardPageContent>
|
||||
@@ -321,6 +385,29 @@ function AccountsChart({
|
||||
<T id={'once_delete_these_accounts_you_will_not_able_restore_them'} />
|
||||
</p>
|
||||
</Alert>
|
||||
|
||||
<Alert
|
||||
cancelButtonText={<T id={'cancel'} />}
|
||||
confirmButtonText={`${formatMessage({id:'activate'})} (${selectedRowsCount})`}
|
||||
intent={Intent.WARNING}
|
||||
isOpen={bulkActivate}
|
||||
onCancel={handleCancelBulkActivate}
|
||||
onConfirm={handleConfirmBulkActivate}>
|
||||
<p>
|
||||
<T id={'are_sure_to_activate_this_accounts'} />
|
||||
</p>
|
||||
</Alert>
|
||||
<Alert
|
||||
cancelButtonText={<T id={'cancel'} />}
|
||||
confirmButtonText={`${formatMessage({id:'inactivate'})} (${selectedRowsCount})`}
|
||||
intent={Intent.WARNING}
|
||||
isOpen={bulkInactiveAccounts}
|
||||
onCancel={handleCancelBulkInactive}
|
||||
onConfirm={handleConfirmBulkInactive}>
|
||||
<p>
|
||||
<T id={'are_sure_to_inactive_this_accounts'} />
|
||||
</p>
|
||||
</Alert>
|
||||
</DashboardPageContent>
|
||||
</DashboardInsider>
|
||||
);
|
||||
|
||||
@@ -8,6 +8,8 @@ import {
|
||||
submitAccount,
|
||||
fetchAccount,
|
||||
deleteBulkAccounts,
|
||||
bulkActivateAccounts,
|
||||
bulkInactiveAccounts
|
||||
} from 'store/accounts/accounts.actions';
|
||||
|
||||
const mapActionsToProps = (dispatch) => ({
|
||||
@@ -19,6 +21,8 @@ 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})),
|
||||
});
|
||||
|
||||
export default connect(null, mapActionsToProps);
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useEffect, useState, useCallback } from 'react';
|
||||
import React, { useEffect, useState, useCallback,useMemo } from 'react';
|
||||
import { useQuery } from 'react-query';
|
||||
import { useParams } from 'react-router-dom';
|
||||
import { Alert, Intent } from '@blueprintjs/core';
|
||||
@@ -15,7 +15,7 @@ import withExchangeRatesActions from 'containers/ExchangeRates/withExchangeRates
|
||||
|
||||
import { compose } from 'utils';
|
||||
|
||||
import { FormattedMessage as T, useIntl } from 'react-intl';
|
||||
import { FormattedMessage as T, useIntl, FormattedHTMLMessage } from 'react-intl';
|
||||
|
||||
function ExchangeRate({
|
||||
// #withDashboard
|
||||
@@ -28,19 +28,21 @@ function ExchangeRate({
|
||||
requestFetchExchangeRates,
|
||||
requestDeleteExchangeRate,
|
||||
addExchangeRatesTableQueries,
|
||||
requestDeleteBulkExchangeRates,
|
||||
|
||||
}) {
|
||||
const { id } = useParams();
|
||||
const [deleteExchangeRate, setDeleteExchangeRate] = useState(false);
|
||||
const [selectedRows, setSelectedRows] = useState([]);
|
||||
const { formatMessage } = useIntl();
|
||||
|
||||
const [bulkDelete, setBulkDelete] = useState(false);
|
||||
|
||||
// const fetchExchangeRates = useQuery('exchange-rates-table', () => {
|
||||
// return Promise.all([requestFetchExchangeRates()]);
|
||||
// });
|
||||
|
||||
const fetchExchangeRates = useQuery('exchange-rates-table',
|
||||
() => requestFetchExchangeRates(),
|
||||
{ refetchInterval: 3000 });
|
||||
() => requestFetchExchangeRates());
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
@@ -93,11 +95,48 @@ function ExchangeRate({
|
||||
[setSelectedRows]
|
||||
);
|
||||
|
||||
// Handle Exchange Rates bulk delete.
|
||||
const handleBulkDelete = useCallback(
|
||||
(exchangeRates) => {
|
||||
setBulkDelete(exchangeRates);
|
||||
},
|
||||
[setBulkDelete]
|
||||
);
|
||||
|
||||
//Handel cancel itemCategories bulk delete.
|
||||
const handleCancelBulkDelete =useCallback(()=>{
|
||||
setBulkDelete(false)
|
||||
},[])
|
||||
|
||||
// handle confirm Exchange Rates bulk delete.
|
||||
const handleConfirmBulkDelete = useCallback(() => {
|
||||
requestDeleteBulkExchangeRates(bulkDelete)
|
||||
.then(() => {
|
||||
setBulkDelete(false);
|
||||
AppToaster.show({
|
||||
message: formatMessage({
|
||||
id: 'the_exchange_rates_has_been_successfully_deleted',
|
||||
}),
|
||||
intent: Intent.SUCCESS,
|
||||
});
|
||||
})
|
||||
.catch((errors) => {
|
||||
setBulkDelete(false);
|
||||
});
|
||||
}, [requestDeleteBulkExchangeRates, bulkDelete]);
|
||||
|
||||
|
||||
// Calculates the data table selected rows count.
|
||||
const selectedRowsCount = useMemo(() => Object.values(selectedRows).length, [selectedRows]);
|
||||
|
||||
|
||||
return (
|
||||
<DashboardInsider>
|
||||
<ExchangeRateActionsBar
|
||||
onDeleteExchangeRate={handelDeleteExchangeRate}
|
||||
selectedRows={selectedRows}
|
||||
onBulkDelete={handleBulkDelete}
|
||||
|
||||
/>
|
||||
<DashboardPageContent>
|
||||
<ExchangeRateTable
|
||||
@@ -116,10 +155,25 @@ function ExchangeRate({
|
||||
onConfirm={handelConfirmExchangeRateDelete}
|
||||
>
|
||||
<p>
|
||||
Are you sure you want to move <b>filename</b> to Trash? You will be
|
||||
able to restore it later, but it will become private to you.
|
||||
<FormattedHTMLMessage id={'once_delete_this_exchange_rate_you_will_able_to_restore_it'}/>
|
||||
</p>
|
||||
</Alert>
|
||||
<Alert
|
||||
cancelButtonText={<T id={'cancel'} />}
|
||||
confirmButtonText={`${formatMessage({id:'delete'})} (${selectedRowsCount})`}
|
||||
icon='trash'
|
||||
intent={Intent.DANGER}
|
||||
isOpen={bulkDelete}
|
||||
onCancel={handleCancelBulkDelete}
|
||||
onConfirm={handleConfirmBulkDelete}
|
||||
>
|
||||
<p>
|
||||
<FormattedHTMLMessage
|
||||
id={'once_delete_these_exchange_rates_you_will_not_able_restore_them'}
|
||||
/>
|
||||
</p>
|
||||
</Alert>
|
||||
|
||||
</DashboardPageContent>
|
||||
</DashboardInsider>
|
||||
);
|
||||
|
||||
@@ -13,7 +13,7 @@ import Icon from 'components/Icon';
|
||||
import { connect } from 'react-redux';
|
||||
|
||||
import DashboardActionsBar from 'components/Dashboard/DashboardActionsBar';
|
||||
import DialogConnect from 'connectors/Dialog.connector';
|
||||
import withDialog from 'connectors/Dialog.connector';
|
||||
|
||||
import FilterDropdown from 'components/FilterDropdown';
|
||||
import withResourceDetail from 'containers/Resources/withResourceDetails';
|
||||
@@ -28,10 +28,12 @@ function ExchangeRateActionsBar({
|
||||
|
||||
// #withResourceDetail
|
||||
resourceFields,
|
||||
|
||||
|
||||
// #ownProps
|
||||
selectedRows = [],
|
||||
onDeleteExchangeRate,
|
||||
onFilterChanged,
|
||||
onBulkDelete
|
||||
}) {
|
||||
const [filterCount, setFilterCount] = useState(0);
|
||||
|
||||
@@ -48,17 +50,21 @@ function ExchangeRateActionsBar({
|
||||
},
|
||||
});
|
||||
|
||||
const handelDeleteExchangeRate = useCallback(
|
||||
(exchangeRate) => {
|
||||
onDeleteExchangeRate(exchangeRate);
|
||||
},
|
||||
[selectedRows, onDeleteExchangeRate]
|
||||
);
|
||||
// const handelDeleteExchangeRate = useCallback(
|
||||
// (exchangeRate) => {
|
||||
// onDeleteExchangeRate(exchangeRate);
|
||||
// },
|
||||
// [selectedRows, onDeleteExchangeRate]
|
||||
// );
|
||||
|
||||
const hasSelectedRows = useMemo(() => selectedRows.length > 0, [
|
||||
selectedRows,
|
||||
]);
|
||||
|
||||
const handelBulkDelete =useCallback(()=>{
|
||||
onBulkDelete && onBulkDelete(selectedRows.map(r=>r.id));
|
||||
},[onBulkDelete,selectedRows])
|
||||
|
||||
return (
|
||||
<DashboardActionsBar>
|
||||
<NavbarGroup>
|
||||
@@ -92,7 +98,7 @@ function ExchangeRateActionsBar({
|
||||
icon={<Icon icon='trash' iconSize={15} />}
|
||||
text={<T id={'delete'} />}
|
||||
intent={Intent.DANGER}
|
||||
onClick={handelDeleteExchangeRate}
|
||||
onClick={handelBulkDelete}
|
||||
/>
|
||||
)}
|
||||
<Button
|
||||
@@ -118,7 +124,7 @@ const withExchangeRateActionBar = connect(mapStateToProps);
|
||||
|
||||
export default compose(
|
||||
withExchangeRateActionBar,
|
||||
DialogConnect,
|
||||
withDialog,
|
||||
withResourceDetail(({ resourceFields }) => ({
|
||||
resourceFields,
|
||||
}))
|
||||
|
||||
@@ -4,6 +4,7 @@ import {
|
||||
fetchExchangeRates,
|
||||
deleteExchangeRate,
|
||||
editExchangeRate,
|
||||
deleteBulkExchangeRates
|
||||
} from 'store/ExchangeRate/exchange.actions';
|
||||
|
||||
const mapActionsToProps = (dispatch) => ({
|
||||
@@ -11,6 +12,7 @@ const mapActionsToProps = (dispatch) => ({
|
||||
requestFetchExchangeRates: () => dispatch(fetchExchangeRates()),
|
||||
requestDeleteExchangeRate: (id) => dispatch(deleteExchangeRate(id)),
|
||||
requestEditExchangeRate: (id, form) => dispatch(editExchangeRate(id, form)),
|
||||
requestDeleteBulkExchangeRates:(ids)=>dispatch(deleteBulkExchangeRates({ids})),
|
||||
addExchangeRatesTableQueries: (queries) =>
|
||||
dispatch({
|
||||
type: 'ExchangeRates_TABLE_QUERIES_ADD',
|
||||
|
||||
@@ -1,13 +1,18 @@
|
||||
import React, { useEffect, useState, useCallback } from 'react';
|
||||
import React, { useEffect, useState, useCallback,useMemo } from 'react';
|
||||
import { useParams } from 'react-router-dom';
|
||||
import { useQuery } from 'react-query';
|
||||
import { Alert, Intent } from '@blueprintjs/core';
|
||||
import { FormattedMessage as T, FormattedHTMLMessage, useIntl } from 'react-intl';
|
||||
import {
|
||||
FormattedMessage as T,
|
||||
FormattedHTMLMessage,
|
||||
useIntl,
|
||||
} from 'react-intl';
|
||||
|
||||
import AppToaster from 'components/AppToaster';
|
||||
import DashboardInsider from 'components/Dashboard/DashboardInsider';
|
||||
import ItemCategoriesDataTable from 'containers/Items/ItemCategoriesTable';
|
||||
import ItemsCategoryActionsBar from 'containers/Items/ItemsCategoryActionsBar';
|
||||
import DashboardPageContent from 'components/Dashboard/DashboardPageContent';
|
||||
|
||||
import withDialog from 'connectors/Dialog.connector';
|
||||
import withDashboardActions from 'containers/Dashboard/withDashboard';
|
||||
@@ -15,7 +20,6 @@ import withItemCategoriesActions from 'containers/Items/withItemCategoriesAction
|
||||
|
||||
import { compose } from 'utils';
|
||||
|
||||
|
||||
const ItemCategoryList = ({
|
||||
// #withDashboardActions
|
||||
changePageTitle,
|
||||
@@ -23,6 +27,7 @@ const ItemCategoryList = ({
|
||||
// #withItemCategoriesActions
|
||||
requestFetchItemCategories,
|
||||
requestDeleteItemCategory,
|
||||
requestDeleteBulkItemCategories,
|
||||
|
||||
// #withDialog
|
||||
openDialog,
|
||||
@@ -32,26 +37,31 @@ const ItemCategoryList = ({
|
||||
const [selectedRows, setSelectedRows] = useState([]);
|
||||
const [filter, setFilter] = useState({});
|
||||
const [deleteCategory, setDeleteCategory] = useState(false);
|
||||
const [bulkDelete, setBulkDelete] = useState(false);
|
||||
const [tableLoading, setTableLoading] = useState(false);
|
||||
|
||||
const {formatMessage} = useIntl();
|
||||
const { formatMessage } = useIntl();
|
||||
|
||||
useEffect(() => {
|
||||
id
|
||||
? changePageTitle(formatMessage({ id:'edit_category_details' }))
|
||||
: changePageTitle(formatMessage({ id:'category_list' }));
|
||||
? changePageTitle(formatMessage({ id: 'edit_category_details' }))
|
||||
: changePageTitle(formatMessage({ id: 'category_list' }));
|
||||
}, []);
|
||||
|
||||
const fetchCategories = useQuery(['items-categories-table', filter],
|
||||
(key, query) => requestFetchItemCategories(query));
|
||||
const fetchCategories = useQuery(
|
||||
['items-categories-table', filter],
|
||||
(key, query) => requestFetchItemCategories(query)
|
||||
);
|
||||
|
||||
const handleFilterChanged = useCallback(() => {
|
||||
|
||||
}, []);
|
||||
const handleFilterChanged = useCallback(() => {}, []);
|
||||
|
||||
// Handle selected rows change.
|
||||
const handleSelectedRowsChange = useCallback((itemCategories) => {
|
||||
setSelectedRows(itemCategories);
|
||||
}, [setSelectedRows]);
|
||||
const handleSelectedRowsChange = useCallback(
|
||||
(itemCategories) => {
|
||||
setSelectedRows(itemCategories);
|
||||
},
|
||||
[setSelectedRows]
|
||||
);
|
||||
|
||||
// Handle fetch data of accounts datatable.
|
||||
const handleFetchData = useCallback(({ pageIndex, pageSize, sortBy }) => {
|
||||
@@ -65,44 +75,92 @@ const ItemCategoryList = ({
|
||||
});
|
||||
}, []);
|
||||
|
||||
const handleDeleteCategory = (itemCategory) => { setDeleteCategory(itemCategory); };
|
||||
const handleCancelItemDelete = () => { setDeleteCategory(false) };
|
||||
const handleDeleteCategory = (itemCategory) => {
|
||||
setDeleteCategory(itemCategory);
|
||||
};
|
||||
const handleCancelItemDelete = () => {
|
||||
setDeleteCategory(false);
|
||||
};
|
||||
|
||||
// Handle alert confirm delete item category.
|
||||
const handleConfirmItemDelete = () => {
|
||||
requestDeleteItemCategory(deleteCategory.id).then(() => {
|
||||
setDeleteCategory(false);
|
||||
AppToaster.show({
|
||||
message: formatMessage({
|
||||
id: 'the_item_category_has_been_successfully_deleted'
|
||||
}),
|
||||
intent: Intent.SUCCESS,
|
||||
requestDeleteItemCategory(deleteCategory.id)
|
||||
.then(() => {
|
||||
setDeleteCategory(false);
|
||||
AppToaster.show({
|
||||
message: formatMessage({
|
||||
id: 'the_item_category_has_been_successfully_deleted',
|
||||
}),
|
||||
intent: Intent.SUCCESS,
|
||||
});
|
||||
})
|
||||
.catch(() => {
|
||||
setDeleteCategory(false);
|
||||
});
|
||||
}).catch(() => {
|
||||
setDeleteCategory(false);
|
||||
});
|
||||
};
|
||||
|
||||
const handleEditCategory = (category) => {
|
||||
openDialog('item-category-form', { action: 'edit', id: category.id });
|
||||
};
|
||||
|
||||
// Handle itemCategories bulk delete.
|
||||
const handleBulkDelete = useCallback(
|
||||
(itemsCategoriesIds) => {
|
||||
setBulkDelete(itemsCategoriesIds);
|
||||
},
|
||||
[setBulkDelete]
|
||||
);
|
||||
|
||||
// handle confirm itemCategories bulk delete.
|
||||
const handleConfirmBulkDelete = useCallback(() => {
|
||||
requestDeleteBulkItemCategories(bulkDelete)
|
||||
.then(() => {
|
||||
setBulkDelete(false);
|
||||
AppToaster.show({
|
||||
message: formatMessage({
|
||||
id: 'the_item_categories_has_been_successfully_deleted',
|
||||
}),
|
||||
intent: Intent.SUCCESS,
|
||||
});
|
||||
})
|
||||
.catch((errors) => {
|
||||
setBulkDelete(false);
|
||||
});
|
||||
}, [requestDeleteBulkItemCategories, bulkDelete]);
|
||||
|
||||
|
||||
//Handel cancel itemCategories bulk delete.
|
||||
const handleCancelBulkDelete =useCallback(()=>{
|
||||
setBulkDelete(false)
|
||||
},[])
|
||||
|
||||
|
||||
// Calculates the data table selected rows count.
|
||||
const selectedRowsCount = useMemo(() => Object.values(selectedRows).length, [selectedRows]);
|
||||
|
||||
|
||||
return (
|
||||
<DashboardInsider name={'item-category-list'}>
|
||||
|
||||
<ItemsCategoryActionsBar
|
||||
selectedRows={selectedRows}
|
||||
onFilterChanged={handleFilterChanged}
|
||||
selectedRows={selectedRows} />
|
||||
onBulkDelete={handleBulkDelete}
|
||||
/>
|
||||
|
||||
<ItemCategoriesDataTable
|
||||
onSelectedRowsChange={handleSelectedRowsChange}
|
||||
onFetchData={handleFetchData}
|
||||
onEditCategory={handleEditCategory}
|
||||
onDeleteCategory={handleDeleteCategory} />
|
||||
onFetchData={handleFetchData}
|
||||
onSelectedRowsChange={handleSelectedRowsChange}
|
||||
onDeleteCategory={handleDeleteCategory}
|
||||
loading={tableLoading}
|
||||
|
||||
/>
|
||||
|
||||
<Alert
|
||||
cancelButtonText={<T id={'cancel'} />}
|
||||
confirmButtonText={<T id={'delete'} />}
|
||||
icon="trash"
|
||||
icon='trash'
|
||||
intent={Intent.DANGER}
|
||||
isOpen={deleteCategory}
|
||||
onCancel={handleCancelItemDelete}
|
||||
@@ -110,15 +168,33 @@ const ItemCategoryList = ({
|
||||
>
|
||||
<p>
|
||||
<FormattedHTMLMessage
|
||||
id={'once_delete_this_item_category_you_will_able_to_restore_it'} />
|
||||
id={'once_delete_this_item_category_you_will_able_to_restore_it'}
|
||||
/>
|
||||
</p>
|
||||
</Alert>
|
||||
|
||||
<Alert
|
||||
cancelButtonText={<T id={'cancel'} />}
|
||||
confirmButtonText={`${formatMessage({id:'delete'})} (${selectedRowsCount})`}
|
||||
icon='trash'
|
||||
intent={Intent.DANGER}
|
||||
isOpen={bulkDelete}
|
||||
onCancel={handleCancelBulkDelete}
|
||||
onConfirm={handleConfirmBulkDelete}
|
||||
>
|
||||
<p>
|
||||
<FormattedHTMLMessage
|
||||
id={'once_delete_these_item_categories_you_will_not_able_restore_them'}
|
||||
/>
|
||||
</p>
|
||||
</Alert>
|
||||
|
||||
</DashboardInsider>
|
||||
);
|
||||
};
|
||||
|
||||
export default compose(
|
||||
withItemCategoriesActions,
|
||||
withDashboardActions,
|
||||
withDialog,
|
||||
withItemCategoriesActions,
|
||||
)(ItemCategoryList);
|
||||
|
||||
@@ -89,16 +89,26 @@ const ItemsCategoryList = ({
|
||||
onSelectedRowsChange && onSelectedRowsChange(selectedRows.map(s => s.original));
|
||||
}, [onSelectedRowsChange]);
|
||||
|
||||
const selectionColumn = useMemo(() => ({
|
||||
minWidth: 42,
|
||||
width: 42,
|
||||
maxWidth: 42,
|
||||
}), []);
|
||||
|
||||
|
||||
return (
|
||||
<LoadingIndicator spinnerSize={30}>
|
||||
<LoadingIndicator mount={false} >
|
||||
<DataTable
|
||||
noInitialFetch={true}
|
||||
columns={columns}
|
||||
data={categoriesList}
|
||||
onFetchData={handelFetchData}
|
||||
manualSortBy={true}
|
||||
selectionColumn={true}
|
||||
selectionColumn={selectionColumn}
|
||||
expandable={true}
|
||||
onSelectedRowsChange={handleSelectedRowsChange}
|
||||
treeGraph={true}
|
||||
spinnerProps={{size:30}}
|
||||
/>
|
||||
</LoadingIndicator>
|
||||
);
|
||||
|
||||
@@ -1,6 +1,4 @@
|
||||
import React, { useCallback, useMemo } from 'react';
|
||||
import DashboardActionsBar from 'components/Dashboard/DashboardActionsBar';
|
||||
import { compose } from 'utils';
|
||||
import React, { useCallback, useMemo,useState } from 'react';
|
||||
import {
|
||||
NavbarGroup,
|
||||
Button,
|
||||
@@ -13,45 +11,56 @@ import {
|
||||
import classNames from 'classnames';
|
||||
import { connect } from 'react-redux';
|
||||
import { If } from 'components';
|
||||
|
||||
import Icon from 'components/Icon';
|
||||
import DialogConnect from 'connectors/Dialog.connector';
|
||||
|
||||
import DashboardActionsBar from 'components/Dashboard/DashboardActionsBar';
|
||||
import FilterDropdown from 'components/FilterDropdown';
|
||||
|
||||
import withResourceDetail from 'containers/Resources/withResourceDetails';
|
||||
import withDialog from 'connectors/Dialog.connector';
|
||||
import withDashboard from 'containers/Dashboard/withDashboard';
|
||||
|
||||
import { compose } from 'utils';
|
||||
import { FormattedMessage as T, useIntl } from 'react-intl';
|
||||
|
||||
const ItemsCategoryActionsBar = ({
|
||||
// #withResourceDetail
|
||||
resourceName = 'item_category',
|
||||
resourceFields,
|
||||
|
||||
// #withDialog
|
||||
openDialog,
|
||||
|
||||
// #ownProps
|
||||
onDeleteCategory,
|
||||
selectedRows=[],
|
||||
onFilterChanged,
|
||||
selectedRows,
|
||||
onBulkDelete
|
||||
}) => {
|
||||
|
||||
const [filterCount, setFilterCount] = useState(0);
|
||||
|
||||
const onClickNewCategory = useCallback(() => {
|
||||
openDialog('item-category-form', {});
|
||||
}, [openDialog]);
|
||||
|
||||
const handleDeleteCategory = useCallback((category) => {
|
||||
onDeleteCategory(selectedRows);
|
||||
}, [selectedRows, onDeleteCategory]);
|
||||
|
||||
const hasSelectedRows = useMemo(() => selectedRows.length > 0, [selectedRows]);
|
||||
|
||||
// const handleDeleteCategory = useCallback((category) => {
|
||||
// onDeleteCategory(selectedRows);
|
||||
// }, [selectedRows, onDeleteCategory]);
|
||||
|
||||
|
||||
const filterDropdown = FilterDropdown({
|
||||
fields: resourceFields,
|
||||
onFilterChange: (filterConditions) => {
|
||||
setFilterCount(filterConditions.length || 0);
|
||||
onFilterChanged && onFilterChanged(filterConditions);
|
||||
},
|
||||
});
|
||||
|
||||
const handelBulkDelete =useCallback(()=>{
|
||||
onBulkDelete && onBulkDelete(selectedRows.map(r=>r.id));
|
||||
},[onBulkDelete,selectedRows])
|
||||
|
||||
return (
|
||||
<DashboardActionsBar>
|
||||
<NavbarGroup>
|
||||
@@ -69,7 +78,7 @@ const ItemsCategoryActionsBar = ({
|
||||
>
|
||||
<Button
|
||||
className={classNames(Classes.MINIMAL, 'button--filter')}
|
||||
text={<T id={'filter'}/>}
|
||||
text={ filterCount <= 0 ? <T id={'filter'}/> : `${filterCount} filters applied`}
|
||||
icon={<Icon icon='filter' />}
|
||||
/>
|
||||
</Popover>
|
||||
@@ -80,7 +89,7 @@ const ItemsCategoryActionsBar = ({
|
||||
icon={<Icon icon='trash' iconSize={15} />}
|
||||
text={<T id={'delete'}/>}
|
||||
intent={Intent.DANGER}
|
||||
onClick={handleDeleteCategory}
|
||||
onClick={handelBulkDelete}
|
||||
/>
|
||||
</If>
|
||||
|
||||
@@ -107,7 +116,7 @@ const withItemsCategoriesActionsBar = connect(mapStateToProps);
|
||||
|
||||
export default compose(
|
||||
withItemsCategoriesActionsBar,
|
||||
DialogConnect,
|
||||
withDialog,
|
||||
withDashboard,
|
||||
withResourceDetail(({ resourceFields }) => ({
|
||||
resourceFields,
|
||||
|
||||
@@ -4,6 +4,8 @@ import {
|
||||
submitItemCategory,
|
||||
deleteItemCategory,
|
||||
editItemCategory,
|
||||
deleteBulkItemCategories
|
||||
|
||||
} from 'store/itemCategories/itemsCategory.actions';
|
||||
|
||||
export const mapDispatchToProps = (dispatch) => ({
|
||||
@@ -11,6 +13,7 @@ export const mapDispatchToProps = (dispatch) => ({
|
||||
requestFetchItemCategories: (query) => dispatch(fetchItemCategories({ query })),
|
||||
requestDeleteItemCategory: (id) => dispatch(deleteItemCategory(id)),
|
||||
requestEditItemCategory: (id, form) => dispatch(editItemCategory(id, form)),
|
||||
requestDeleteBulkItemCategories:(ids)=>dispatch(deleteBulkItemCategories({ids}))
|
||||
});
|
||||
|
||||
export default connect(null, mapDispatchToProps);
|
||||
@@ -203,4 +203,15 @@ export default {
|
||||
'all': 'All',
|
||||
'once_delete_these_journalss_you_will_not_able_restore_them': 'Once you delete these journals, you won\'t be able to retrieve them later. Are you sure you want to delete them?',
|
||||
'journal_number_is_already_used': 'Journal number is already used.',
|
||||
|
||||
the_item_categories_has_been_successfully_deleted:'The item categories has been successfully deleted',
|
||||
once_delete_these_item_categories_you_will_not_able_restore_them:'Once you delete these item categories, you won\'t be able to retrieve them later. Are you sure you want to delete them?',
|
||||
once_delete_this_exchange_rate_you_will_able_to_restore_it: `Once you delete this exchange rate, you won\'t be able to restore it later. Are you sure you want to delete?`,
|
||||
once_delete_these_exchange_rates_you_will_not_able_restore_them:'Once you delete these item categories, you won\'t be able to retrieve them later. Are you sure you want to delete them?',
|
||||
the_accounts_has_been_successfully_activated:'The Accounts has been Successfully activated',
|
||||
are_sure_to_activate_this_accounts: 'Are you sure you want to activate this accounts? You will be able to inactivate it later',
|
||||
are_sure_to_inactive_this_accounts: 'Are you sure you want to inactive this accounts? You will be able to activate it later',
|
||||
the_accounts_has_been_successfully_inactivated: 'The accounts has been successfully inactivated.',
|
||||
|
||||
|
||||
};
|
||||
|
||||
@@ -132,5 +132,10 @@ export default {
|
||||
'eye-slash': {
|
||||
path: ['M634 471L36 3.51A16 16 0 0 0 13.51 6l-10 12.49A16 16 0 0 0 6 41l598 467.49a16 16 0 0 0 22.49-2.49l10-12.49A16 16 0 0 0 634 471zM296.79 146.47l134.79 105.38C429.36 191.91 380.48 144 320 144a112.26 112.26 0 0 0-23.21 2.47zm46.42 219.07L208.42 260.16C210.65 320.09 259.53 368 320 368a113 113 0 0 0 23.21-2.46zM320 112c98.65 0 189.09 55 237.93 144a285.53 285.53 0 0 1-44 60.2l37.74 29.5a333.7 333.7 0 0 0 52.9-75.11 32.35 32.35 0 0 0 0-29.19C550.29 135.59 442.93 64 320 64c-36.7 0-71.71 7-104.63 18.81l46.41 36.29c18.94-4.3 38.34-7.1 58.22-7.1zm0 288c-98.65 0-189.08-55-237.93-144a285.47 285.47 0 0 1 44.05-60.19l-37.74-29.5a333.6 333.6 0 0 0-52.89 75.1 32.35 32.35 0 0 0 0 29.19C89.72 376.41 197.08 448 320 448c36.7 0 71.71-7.05 104.63-18.81l-46.41-36.28C359.28 397.2 339.89 400 320 400z'],
|
||||
viewBox: '0 0 640 512',
|
||||
},
|
||||
'multi-select':{
|
||||
path:['M12,3.98H4c-0.55,0-1,0.45-1,1v1h8v5h1c0.55,0,1-0.45,1-1v-5C13,4.43,12.55,3.98,12,3.98z M15,0.98H7c-0.55,0-1,0.45-1,1v1h8v5h1c0.55,0,1-0.45,1-1v-5C16,1.43,15.55,0.98,15,0.98z M9,6.98H1c-0.55,0-1,0.45-1,1v5c0,0.55,0.45,1,1,1h8c0.55,0,1-0.45,1-1v-5C10,7.43,9.55,6.98,9,6.98z M8,11.98H2v-3h6V11.98z'],
|
||||
viewBox: '0 0 16 16',
|
||||
|
||||
}
|
||||
}
|
||||
@@ -63,3 +63,19 @@ export const editExchangeRate = (id, form) => {
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
|
||||
export const deleteBulkExchangeRates = ({ ids }) => {
|
||||
return dispatch => new Promise((resolve, reject) => {
|
||||
ApiService.delete(`exchange_rates/bulk`, { params: { ids }}).then((response) => {
|
||||
dispatch({
|
||||
type: t.EXCHANGE_RATES_BULK_DELETE,
|
||||
payload: { ids }
|
||||
});
|
||||
resolve(response);
|
||||
}).catch((error) => {
|
||||
reject(error);
|
||||
});
|
||||
});
|
||||
};
|
||||
@@ -20,4 +20,18 @@ export default createReducer(initialState, {
|
||||
[t.EXCHANGE_RATE_TABLE_LOADING]: (state, action) => {
|
||||
state.loading = action.loading;
|
||||
},
|
||||
|
||||
[t.EXCHANGE_RATES_BULK_DELETE]:(state,action)=>{
|
||||
|
||||
const {ids} =action.payload;
|
||||
const {exchange_rate} = {...state.exchangeRates};
|
||||
ids.forEach((id)=>{
|
||||
if(typeof exchange_rate[id] !=='undefined'){
|
||||
delete exchange_rate[id]
|
||||
}
|
||||
});
|
||||
state.exchangeRates =exchange_rate
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
|
||||
@@ -4,5 +4,6 @@ export default {
|
||||
EXCHANGE_RATE_LIST_SET: 'EXCHANGE_RATE_LIST_SET',
|
||||
CLEAR_EXCHANGE_RATE_FORM_ERRORS: 'CLEAR_EXCHANGE_RATE_FORM_ERRORS',
|
||||
ExchangeRates_TABLE_QUERIES_ADD: 'ExchangeRates_TABLE_QUERIES_ADD',
|
||||
EXCHANGE_RATE_TABLE_LOADING:'EXCHANGE_RATE_TABLE_LOADING'
|
||||
EXCHANGE_RATE_TABLE_LOADING:'EXCHANGE_RATE_TABLE_LOADING',
|
||||
EXCHANGE_RATES_BULK_DELETE: 'EXCHANGE_RATES_BULK_DELETE',
|
||||
};
|
||||
|
||||
@@ -185,6 +185,39 @@ 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) => {
|
||||
|
||||
@@ -20,5 +20,8 @@ export default {
|
||||
|
||||
ACCOUNT_ERRORS_SET: 'ACCOUNT_ERRORS_SET',
|
||||
ACCOUNT_ERRORS_CLEAR: 'ACCOUNT_ERRORS_CLEAR',
|
||||
ACCOUNTS_BULK_DELETE: 'ACCOUNTS_BULK_DELETE'
|
||||
ACCOUNTS_BULK_DELETE: 'ACCOUNTS_BULK_DELETE',
|
||||
BULK_ACTIVATE_ACCOUNTS:'BULK_ACTIVATE_ACCOUNTS',
|
||||
BULK_INACTIVATE_ACCOUNTS:'BULK_INACTIVATE_ACCOUNTS'
|
||||
|
||||
};
|
||||
@@ -79,3 +79,17 @@ export const deleteItemCategory = (id) => {
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
export const deleteBulkItemCategories = ({ ids }) => {
|
||||
return dispatch => new Promise((resolve, reject) => {
|
||||
ApiService.delete(`item_categories/bulk`, { params: { ids }}).then((response) => {
|
||||
dispatch({
|
||||
type: t.ITEM_CATEGORIES_BULK_DELETE,
|
||||
payload: { ids }
|
||||
});
|
||||
resolve(response);
|
||||
}).catch((error) => {
|
||||
reject(error);
|
||||
});
|
||||
});
|
||||
};
|
||||
@@ -35,6 +35,17 @@ export default createReducer(initialState, {
|
||||
const { loading } = action.payload;
|
||||
state.loading = !!loading;
|
||||
},
|
||||
[t.ITEM_CATEGORIES_BULK_DELETE]:(state,action)=>{
|
||||
const {ids} =action.payload;
|
||||
const {categories} = {...state.categories};
|
||||
ids.forEach((id)=>{
|
||||
|
||||
if(typeof categories[id] !=='undefined'){
|
||||
delete categories[id]
|
||||
}
|
||||
});
|
||||
state.categories =categories
|
||||
}
|
||||
});
|
||||
|
||||
export const getCategoryId = (state, id) => {
|
||||
|
||||
@@ -2,5 +2,7 @@ export default {
|
||||
ITEMS_CATEGORY_LIST_SET: 'ITEMS_CATEGORY_LIST_SET',
|
||||
ITEMS_CATEGORY_DATA_TABLE: 'ITEMS_CATEGORY_DATA_TABLE',
|
||||
CATEGORY_DELETE: 'CATEGORY_DELETE',
|
||||
ITEM_CATEGORIES_TABLE_LOADING: 'ITEM_CATEGORIES_TABLE_LOADING'
|
||||
ITEM_CATEGORIES_TABLE_LOADING: 'ITEM_CATEGORIES_TABLE_LOADING',
|
||||
ITEM_CATEGORIES_BULK_DELETE:'ITEM_CATEGORIES_BULK_DELETE'
|
||||
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user