From 6e7c746d09b6212c8a4590619ec23b84b7744735 Mon Sep 17 00:00:00 2001 From: elforjani13 <39470382+elforjani13@users.noreply.github.com> Date: Wed, 2 Feb 2022 15:53:09 +0200 Subject: [PATCH] feat(warehouseTransfer): add create & delete transfer & details. --- src/config/sidebarMenu.js | 4 +- .../WarehouseTransferDeleteAlert.js | 79 ++++++++++++ src/containers/AlertsContainer/registered.js | 2 + .../WarehouseFormProvider.js | 1 - .../WarehouseTransferDetailDrawerProvider.js | 15 ++- .../WarehouseTransferDetailHeader.js | 27 ++--- .../WarehouseTransferDetailTable.js | 7 +- .../WarehouseTransferEditorField.js | 9 +- .../WarehouseTransferFloatingActions.js | 112 ++++++++++++++++++ .../WarehouseTransferForm.js | 60 +++++++++- .../WarehouseTransferFormEntriesTable.js | 42 +++++-- .../WarehouseTransferFormHeaderFields.js | 5 +- .../WarehouseTransferFormProvider.js | 27 ++++- .../WarehouseTransferForm/utils.js | 75 +++++++++++- .../WarehouseTransfersActionsBar.js | 2 +- .../WarehouseTransfersDataTable.js | 18 ++- .../WarehousesTransfersAlerts.js | 15 +++ src/containers/WarehouseTransfers/utils.js | 68 +++++++++-- src/hooks/query/warehouses.js | 2 +- src/lang/en/index.json | 7 +- src/routes/dashboard.js | 8 +- 21 files changed, 513 insertions(+), 72 deletions(-) create mode 100644 src/containers/Alerts/Warehouses/WarehouseTransferDeleteAlert.js create mode 100644 src/containers/WarehouseTransfers/WarehousesTransfersAlerts.js diff --git a/src/config/sidebarMenu.js b/src/config/sidebarMenu.js index 14812dfea..84fece5ab 100644 --- a/src/config/sidebarMenu.js +++ b/src/config/sidebarMenu.js @@ -80,7 +80,7 @@ export default [ }, { text: , - href: '/warehouse-transfers', + href: '/warehouses-transfers', }, { text: , @@ -119,7 +119,7 @@ export default [ }, { text: , - href: '/warehouse-transfers/new', + href: '/warehouses-transfers/new', }, { text: , diff --git a/src/containers/Alerts/Warehouses/WarehouseTransferDeleteAlert.js b/src/containers/Alerts/Warehouses/WarehouseTransferDeleteAlert.js new file mode 100644 index 000000000..936ccc97c --- /dev/null +++ b/src/containers/Alerts/Warehouses/WarehouseTransferDeleteAlert.js @@ -0,0 +1,79 @@ +import React from 'react'; +import intl from 'react-intl-universal'; +import { FormattedMessage as T, FormattedHTMLMessage } from 'components'; +import { Intent, Alert } from '@blueprintjs/core'; +import { AppToaster } from 'components'; +import { useDeleteWarehouseTransfer } from 'hooks/query'; + +import withAlertStoreConnect from 'containers/Alert/withAlertStoreConnect'; +import withAlertActions from 'containers/Alert/withAlertActions'; + +import { compose } from 'utils'; + +/** + * Warehouse transfer delete alert + * @returns + */ +function WarehouseTransferDeleteAlert({ + name, + + // #withAlertStoreConnect + isOpen, + payload: { warehouseTransferId }, + + // #withAlertActions + closeAlert, +}) { + const { mutateAsync: deleteWarehouseTransferMutate, isLoading } = + useDeleteWarehouseTransfer(); + + // handle cancel delete warehouse alert. + const handleCancelDeleteAlert = () => { + closeAlert(name); + }; + + // handleConfirm delete warehouse transfer. + const handleConfirmWarehouseTransferDelete = () => { + deleteWarehouseTransferMutate(warehouseTransferId) + .then(() => { + AppToaster.show({ + message: intl.get('warehouse_transfer.alert.delete_message'), + intent: Intent.SUCCESS, + }); + }) + .catch( + ({ + response: { + data: { errors }, + }, + }) => {}, + ) + .finally(() => { + closeAlert(name); + }); + }; + + return ( + } + confirmButtonText={} + icon="trash" + intent={Intent.DANGER} + isOpen={isOpen} + onCancel={handleCancelDeleteAlert} + onConfirm={handleConfirmWarehouseTransferDelete} + loading={isLoading} + > +

+ +

+ + ); +} + +export default compose( + withAlertStoreConnect(), + withAlertActions, +)(WarehouseTransferDeleteAlert); diff --git a/src/containers/AlertsContainer/registered.js b/src/containers/AlertsContainer/registered.js index c023ebf0c..dfd8f839d 100644 --- a/src/containers/AlertsContainer/registered.js +++ b/src/containers/AlertsContainer/registered.js @@ -21,6 +21,7 @@ import CreditNotesAlerts from '../Sales/CreditNotes/CreditNotesAlerts'; import VendorCreditNotesAlerts from '../Purchases/CreditNotes/VendorCreditNotesAlerts'; import TransactionsLockingAlerts from '../TransactionsLocking/TransactionsLockingAlerts'; import WarehousesAlerts from '../Preferences/Warehouses/WarehousesAlerts'; +import WarehousesTransfersAlerts from '../WarehouseTransfers/WarehousesTransfersAlerts' export default [ ...AccountsAlerts, @@ -46,4 +47,5 @@ export default [ ...VendorCreditNotesAlerts, ...TransactionsLockingAlerts, ...WarehousesAlerts, + ...WarehousesTransfersAlerts ]; diff --git a/src/containers/Dialogs/WarehouseFormDialog/WarehouseFormProvider.js b/src/containers/Dialogs/WarehouseFormDialog/WarehouseFormProvider.js index 4257d1c8f..e2fae2805 100644 --- a/src/containers/Dialogs/WarehouseFormDialog/WarehouseFormProvider.js +++ b/src/containers/Dialogs/WarehouseFormDialog/WarehouseFormProvider.js @@ -5,7 +5,6 @@ import { useEditWarehouse, useWarehouse, } from 'hooks/query'; -import { useLocation } from 'react-router-dom'; const WarehouseFormContext = React.createContext(); diff --git a/src/containers/Drawers/WarehouseTransferDetailDrawer/WarehouseTransferDetailDrawerProvider.js b/src/containers/Drawers/WarehouseTransferDetailDrawer/WarehouseTransferDetailDrawerProvider.js index 0d1d6525d..371131568 100644 --- a/src/containers/Drawers/WarehouseTransferDetailDrawer/WarehouseTransferDetailDrawerProvider.js +++ b/src/containers/Drawers/WarehouseTransferDetailDrawer/WarehouseTransferDetailDrawerProvider.js @@ -1,6 +1,6 @@ import React from 'react'; import intl from 'react-intl-universal'; -// import {} from 'hooks/query'; +import { useWarehouseTransfer } from 'hooks/query'; import { DrawerHeaderContent, DrawerLoading } from 'components'; const WarehouseTransferDetailDrawerContext = React.createContext(); @@ -9,17 +9,22 @@ const WarehouseTransferDetailDrawerContext = React.createContext(); * Warehouse transfer detail drawer provider. */ function WarehouseTransferDetailDrawerProvider({ - warehouseTransferId, + warehouseTransferId = 5, ...props }) { + // Handle fetch invoice detail. + const { data: warehouseTransfer, isLoading: isWarehouseTransferLoading } = + useWarehouseTransfer(warehouseTransferId, { + enabled: !!warehouseTransferId, + }); + const provider = { + warehouseTransfer, warehouseTransferId, }; return ( - + - - - - '$10' - - - - {/* */} + - ); } - -const AmountItem = styled(DetailItem)` - width: 50%; -`; diff --git a/src/containers/Drawers/WarehouseTransferDetailDrawer/WarehouseTransferDetailTable.js b/src/containers/Drawers/WarehouseTransferDetailDrawer/WarehouseTransferDetailTable.js index e85b7014f..47c7d445f 100644 --- a/src/containers/Drawers/WarehouseTransferDetailDrawer/WarehouseTransferDetailTable.js +++ b/src/containers/Drawers/WarehouseTransferDetailDrawer/WarehouseTransferDetailTable.js @@ -3,6 +3,7 @@ import React from 'react'; import { CommercialDocEntriesTable } from 'components'; import { TableStyle } from '../../../common'; import { useWarehouseTransferReadOnlyEntriesColumns } from './utils'; +import { useWarehouseDetailDrawerContext } from './WarehouseTransferDetailDrawerProvider'; /** * Warehouse transfer detail table. @@ -12,10 +13,14 @@ export default function WarehouseTransferDetailTable() { // Warehouse transfer entries table columns. const columns = useWarehouseTransferReadOnlyEntriesColumns(); + const { + warehouseTransfer: { entries }, + } = useWarehouseDetailDrawerContext(); + return ( ); diff --git a/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferEditorField.js b/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferEditorField.js index 7c80c21ac..8c39e2dcf 100644 --- a/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferEditorField.js +++ b/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferEditorField.js @@ -3,7 +3,10 @@ import { FastField } from 'formik'; import classNames from 'classnames'; import { CLASSES } from 'common/classes'; import { useWarehouseTransferFormContext } from './WarehouseTransferFormProvider'; -import { entriesFieldShouldUpdate } from './utils'; +import { + entriesFieldShouldUpdate, + defaultWarehouseTransferEntry, +} from './utils'; import WarehouseTransferFormEntriesTable from './WarehouseTransferFormEntriesTable'; /** @@ -11,12 +14,13 @@ import WarehouseTransferFormEntriesTable from './WarehouseTransferFormEntriesTab */ export default function WarehouseTransferEditorField() { const { items } = useWarehouseTransferFormContext(); + return (
{({ form: { values, setFieldValue }, @@ -29,6 +33,7 @@ export default function WarehouseTransferEditorField() { setFieldValue('entries', entries); }} items={items} + defaultEntry={defaultWarehouseTransferEntry} errors={error} /> )} diff --git a/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFloatingActions.js b/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFloatingActions.js index e69de29bb..9362a1ce5 100644 --- a/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFloatingActions.js +++ b/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFloatingActions.js @@ -0,0 +1,112 @@ +import React from 'react'; +import { useHistory } from 'react-router-dom'; +import { + Intent, + Button, + ButtonGroup, + Popover, + PopoverInteractionKind, + Position, + Menu, + MenuItem, +} from '@blueprintjs/core'; +import { FormattedMessage as T } from 'components'; +import classNames from 'classnames'; +import { useFormikContext } from 'formik'; +import { CLASSES } from 'common/classes'; + +import { Icon } from 'components'; +import { useWarehouseTransferFormContext } from './WarehouseTransferFormProvider'; + +/** + * Warehouse transfer floating actions bar. + */ +export default function WarehouseTransferFloatingActions() { + // History context. + const history = useHistory(); + + // Formik form context. + const { isSubmitting, submitForm, resetForm, values, errors } = + useFormikContext(); + + // Warehouse tansfer form context. + const { isNewMode, setSubmitPayload } = useWarehouseTransferFormContext(); + + // Handle submit button click. + const handleSubmitBtnClick = (event) => { + setSubmitPayload({ redirect: true }); + submitForm(); + }; + + // Handle clear button click. + const handleClearBtnClick = (event) => { + resetForm(); + }; + + // Handle submit & new button click. + const handleSubmitAndNewClick = (event) => { + setSubmitPayload({ redirect: false, resetForm: true }); + submitForm(); + }; + + // Handle cancel button click. + const handleCancelBtnClick = (event) => { + history.goBack(); + }; + + return ( +
+ {/* ----------- Save and New ----------- */} + +
+ ); +} diff --git a/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferForm.js b/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferForm.js index 3487ca548..1d172e6c4 100644 --- a/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferForm.js +++ b/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferForm.js @@ -1,6 +1,7 @@ import React from 'react'; import intl from 'react-intl-universal'; import { Formik, Form } from 'formik'; +import { isEmpty } from 'lodash'; import { Intent } from '@blueprintjs/core'; import { useHistory } from 'react-router-dom'; import { CLASSES } from 'common/classes'; @@ -14,11 +15,18 @@ import { import WarehouseTransferFormHeader from './WarehouseTransferFormHeader'; import WarehouseTransferEditorField from './WarehouseTransferEditorField'; import WarehouseTransferFormFooter from './WarehouseTransferFormFooter'; +import WarehouseTransferFloatingActions from './WarehouseTransferFloatingActions'; import WarehouseTransferFormDialog from './WarehouseTransferFormDialog'; import withDashboardActions from 'containers/Dashboard/withDashboardActions'; +import { AppToaster } from 'components'; +import { useWarehouseTransferFormContext } from './WarehouseTransferFormProvider'; import { compose, orderingLinesIndexes, transactionNumber } from 'utils'; -import { defaultWareTransferEntry, defaultWarehouseTransfer } from './utils'; +import { + defaultWarehouseTransfer, + transformValueToRequest, + transformToEditForm, +} from './utils'; function WarehouseTransferForm({ // #withSettings @@ -28,6 +36,14 @@ function WarehouseTransferForm({ }) { const history = useHistory(); + const { + isNewMode, + warehouseTransfer, + createWarehouseTransferMutate, + editWarehouseTransferMutate, + submitPayload, + } = useWarehouseTransferFormContext(); + // WarehouseTransfer number. const warehouseTransferNumber = transactionNumber( warehouseTransferNumberPrefix, @@ -37,18 +53,43 @@ function WarehouseTransferForm({ // Form initial values. const initialValues = React.useMemo( () => ({ - ...defaultWarehouseTransfer, + ...(!isEmpty(null) + ? { ...transformToEditForm(null) } + : { + ...defaultWarehouseTransfer, + entries: orderingLinesIndexes(defaultWarehouseTransfer.entries), + }), }), [], ); // Handles form submit. const handleSubmit = (values, { setSubmitting, setErrors, resetForm }) => { + setSubmitting(true); // Transformes the values of the form to request. - const form = {}; + const form = { + ...transformValueToRequest(values), + }; // Handle the request success. - const onSuccess = () => {}; + const onSuccess = () => { + AppToaster.show({ + message: intl.get( + isNewMode + ? 'warehouse_transfer.success_message' + : 'warehouse_transfer.edit_success_message', + ), + intent: Intent.SUCCESS, + }); + setSubmitting(false); + + if (submitPayload.redirect) { + history.push('/warehouses-transfers'); + } + if (submitPayload.resetForm) { + resetForm(); + } + }; // Handle the request error. const onError = ({ @@ -58,6 +99,14 @@ function WarehouseTransferForm({ }) => { setSubmitting(false); }; + + if (isNewMode) { + createWarehouseTransferMutate(form).then(onSuccess).catch(onError); + } else { + editWarehouseTransferMutate([warehouseTransfer.id, form]) + .then(onSuccess) + .catch(onError); + } }; return ( @@ -70,7 +119,7 @@ function WarehouseTransferForm({ > +
diff --git a/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFormEntriesTable.js b/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFormEntriesTable.js index 1d1ca8141..8ba567803 100644 --- a/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFormEntriesTable.js +++ b/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFormEntriesTable.js @@ -2,8 +2,15 @@ import React from 'react'; import { useWarehouseTransferTableColumns } from '../utils'; import { DataTableEditable } from 'components'; -import { compose, saveInvoke, updateTableCell } from 'utils'; - +import { + saveInvoke, + compose, + updateTableCell, + updateMinEntriesLines, + updateAutoAddNewLine, + updateRemoveLineByIndex, + orderingLinesIndexes, +} from 'utils'; /** * Warehouse transfer form entries table. */ @@ -11,6 +18,7 @@ export default function WarehouseTransferFormEntriesTable({ // #ownProps items, entries, + defaultEntry, onUpdateData, errors, }) { @@ -20,12 +28,30 @@ export default function WarehouseTransferFormEntriesTable({ // Handle update data. const handleUpdateData = React.useCallback( (rowIndex, columnId, value) => { - const newRows = compose(updateTableCell(rowIndex, columnId, value))( - entries, - ); - onUpdateData(newRows); + const newRows = compose( + // Update auto-adding new line. + updateAutoAddNewLine(defaultEntry, ['item_id']), + // Update the row value of the given row index and column id. + updateTableCell(rowIndex, columnId, value), + )(entries); + + saveInvoke(onUpdateData, newRows); }, - [onUpdateData, entries], + [entries, defaultEntry, onUpdateData], + ); + // Handles click remove datatable row. + const handleRemoveRow = React.useCallback( + (rowIndex) => { + const newRows = compose( + // Ensure minimum lines count. + updateMinEntriesLines(4, defaultEntry), + // Remove the line by the given index. + updateRemoveLineByIndex(rowIndex), + )(entries); + + saveInvoke(onUpdateData, newRows); + }, + [entries, defaultEntry, onUpdateData], ); return ( @@ -36,6 +62,8 @@ export default function WarehouseTransferFormEntriesTable({ items, errors: errors || [], updateData: handleUpdateData, + removeRow: handleRemoveRow, + autoFocus: ['item_id', 0], }} /> ); diff --git a/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFormHeaderFields.js b/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFormHeaderFields.js index 6b7fc9f1b..ee572e8fc 100644 --- a/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFormHeaderFields.js +++ b/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFormHeaderFields.js @@ -2,7 +2,6 @@ import React from 'react'; import { FormGroup, InputGroup, - TextArea, Position, ControlGroup, } from '@blueprintjs/core'; @@ -149,7 +148,7 @@ function WarehouseTransferFormHeaderFields({ onAccountSelected={(account) => { form.setFieldValue('from_warehouse_id', account.id); }} - defaultSelectText={'Select Warehouse Transfer'} + defaultSelectText={} selectedAccountId={value} popoverFill={true} allowCreate={true} @@ -176,7 +175,7 @@ function WarehouseTransferFormHeaderFields({ onAccountSelected={(account) => { form.setFieldValue('to_warehouse_id', account.id); }} - defaultSelectText={'Select Warehouse Transfer'} + defaultSelectText={} selectedAccountId={value} popoverFill={true} allowCreate={true} diff --git a/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFormProvider.js b/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFormProvider.js index 2531e9e73..ad9525558 100644 --- a/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFormProvider.js +++ b/src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFormProvider.js @@ -1,6 +1,11 @@ import React from 'react'; import DashboardInsider from 'components/Dashboard/DashboardInsider'; -import { useItems, useWarehouses } from 'hooks/query'; +import { + useItems, + useWarehouses, + useCreateWarehouseTransfer, + useEditWarehouseTransfer, +} from 'hooks/query'; import { ITEMS_FILTER_ROLES_QUERY } from './utils.js'; const WarehouseFormContext = React.createContext(); @@ -26,12 +31,32 @@ function WarehouseTransferFormProvider({ warehouseTransferId, ...props }) { isLoading: isWarehouesLoading, } = useWarehouses(); + // Create and edit warehouse mutations. + const { mutateAsync: createWarehouseTransferMutate } = + useCreateWarehouseTransfer(); + const { mutateAsync: editWarehouseTransferMutate } = + useEditWarehouseTransfer(); + + // Detarmines whether the form in new mode. + const isNewMode = !warehouseTransferId; + + // Form submit payload. + const [submitPayload, setSubmitPayload] = React.useState(); + // Provider payload. const provider = { items, warehouses, + warehouseTransfer: [], + isItemsFetching, isWarehouesFetching, + + isNewMode, + submitPayload, + setSubmitPayload, + createWarehouseTransferMutate, + editWarehouseTransferMutate, }; return ( ({ + ...transformToForm(warehouse, defaultWarehouseTransferEntry), + })), + ...repeatValue( + defaultWarehouseTransferEntry, + Math.max(MIN_LINES_NUMBER - warehouse.entries.length, 0), + ), + ]; + const entries = compose( + ensureEntriesHaveEmptyLine(defaultWarehouseTransferEntry), + updateItemsEntriesTotal, + )(initialEntries); + + return { + ...transformToForm(warehouse, defaultWarehouseTransfer), + entries, + }; +} + /** * Syncs transfer no. settings with form. */ @@ -40,3 +80,28 @@ export const useObserveTransferNoSettings = (prefix, nextNumber) => { setFieldValue('transaction_number', transferNo); }, [setFieldValue, prefix, nextNumber]); }; + +/** + * Detarmines warehouse entries field when should update. + */ +export const entriesFieldShouldUpdate = (newProps, oldProps) => { + return ( + newProps.items !== oldProps.items || + defaultFastFieldShouldUpdate(newProps, oldProps) + ); +}; + +/** + * Transformes the form values to request body values. + */ +export function transformValueToRequest(values) { + const entries = values.entries.filter( + (item) => item.item_id && item.quantity, + ); + return { + ...values, + entries: entries.map((entry) => ({ + ...omit(entry, ['destination_warehouse', 'source_warehouse']), + })), + }; +} diff --git a/src/containers/WarehouseTransfers/WarehouseTransfersLanding/WarehouseTransfersActionsBar.js b/src/containers/WarehouseTransfers/WarehouseTransfersLanding/WarehouseTransfersActionsBar.js index f3ec0832e..048a7151f 100644 --- a/src/containers/WarehouseTransfers/WarehouseTransfersLanding/WarehouseTransfersActionsBar.js +++ b/src/containers/WarehouseTransfers/WarehouseTransfersLanding/WarehouseTransfersActionsBar.js @@ -33,7 +33,7 @@ function WarehouseTransfersActionsBar({ // Handle new warehouse transfer button click. const handleClickNewWarehouseTransfer = () => { - history.push('/warehouse-transfers/new'); + history.push('/warehouses-transfers/new'); }; // Handle click a refresh warehouse transfers diff --git a/src/containers/WarehouseTransfers/WarehouseTransfersLanding/WarehouseTransfersDataTable.js b/src/containers/WarehouseTransfers/WarehouseTransfersLanding/WarehouseTransfersDataTable.js index 5a571df84..f707d70a3 100644 --- a/src/containers/WarehouseTransfers/WarehouseTransfersLanding/WarehouseTransfersDataTable.js +++ b/src/containers/WarehouseTransfers/WarehouseTransfersLanding/WarehouseTransfersDataTable.js @@ -43,18 +43,26 @@ function WarehouseTransfersDataTable({ const columns = useWarehouseTransfersTableColumns(); // Handle view detail. - const handleViewDetailWarehouseTransfer = () => { - openDrawer('warehouse-transfer-detail-drawer', {}); + const handleViewDetailWarehouseTransfer = ({ id }) => { + openDrawer('warehouse-transfer-detail-drawer', { warehouseTransferId: id }); }; // Handle edit warehouse transfer. - const handleEditWarehouseTransfer = () => {}; + const handleEditWarehouseTransfer = ({ id }) => { + history.push(`/warehouses-transfers/${id}/edit`); + }; // Handle delete warehouse transfer. - const handleDeleteWarehouseTransfer = () => {}; + const handleDeleteWarehouseTransfer = ({ id }) => { + openAlert('warehouse-transfer-delete', { warehouseTransferId: id }); + }; // Handle cell click. - const handleCellClick = (cell, event) => {}; + const handleCellClick = (cell, event) => { + openDrawer('warehouse-transfer-detail-drawer', { + warehouseTransferId: cell.row.original.id, + }); + }; // Local storage memorizing columns widths. const [initialColumnsWidths, , handleColumnResizing] = diff --git a/src/containers/WarehouseTransfers/WarehousesTransfersAlerts.js b/src/containers/WarehouseTransfers/WarehousesTransfersAlerts.js new file mode 100644 index 000000000..c11fabb4d --- /dev/null +++ b/src/containers/WarehouseTransfers/WarehousesTransfersAlerts.js @@ -0,0 +1,15 @@ +import React from 'react'; + +const WarehouseTransferDeleteAlert = React.lazy(() => + import('../Alerts/Warehouses/WarehouseTransferDeleteAlert'), +); + +/** + * Warehouses alerts. + */ +export default [ + { + name: 'warehouse-transfer-delete', + component: WarehouseTransferDeleteAlert, + }, +]; diff --git a/src/containers/WarehouseTransfers/utils.js b/src/containers/WarehouseTransfers/utils.js index e3d67946c..1c8713416 100644 --- a/src/containers/WarehouseTransfers/utils.js +++ b/src/containers/WarehouseTransfers/utils.js @@ -1,6 +1,14 @@ import React from 'react'; -import { CLASSES } from 'common/classes'; -import { MoneyFieldCell, FormatDateCell, AppToaster, T } from 'components'; +import intl from 'react-intl-universal'; +import { Tooltip, Button, Intent, Position } from '@blueprintjs/core'; + +import { + MoneyFieldCell, + FormatDateCell, + Icon, + AppToaster, + T, +} from 'components'; import { InputGroupCell, ItemsListCell } from 'components/DataTableCells'; // Index table cell. @@ -8,6 +16,33 @@ export function IndexTableCell({ row: { index } }) { return {index + 1}; } +/** + * Actions cell renderer component. + */ +export function ActionsCellRenderer({ + row: { index }, + column: { id }, + cell: { value }, + data, + payload: { removeRow }, +}) { + const onRemoveRole = () => { + removeRow(index); + }; + + return ( + } position={Position.LEFT}> +