feat(warehousetTransfer ): add warehouse status.

src/containers/Alerts/WarehousesTransfer/TransferredWarehouseTransferAlert.js

@@ -0,0 +1,71 @@
+import React from 'react';
+import { FormattedMessage as T } from 'components';
+import intl from 'react-intl-universal';
+import { Intent, Alert } from '@blueprintjs/core';
+
+import { useTransferredWarehouseTransfer } from 'hooks/query';
+import { AppToaster } from 'components';
+
+import withAlertStoreConnect from 'containers/Alert/withAlertStoreConnect';
+import withAlertActions from 'containers/Alert/withAlertActions';
+
+import { compose } from 'utils';
+
+/**
+ * warehouse transfer transferred alert.
+ * @returns
+ */
+function TransferredWarehouseTransferAlert({
+  name,
+
+  // #withAlertStoreConnect
+  isOpen,
+  payload: { warehouseTransferId },
+
+  // #withAlertActions
+  closeAlert,
+}) {
+  const { mutateAsync: transferredWarehouseTransferMutate, isLoading } =
+    useTransferredWarehouseTransfer();
+
+  // handle cancel alert.
+  const handleCancelAlert = () => {
+    closeAlert(name);
+  };
+
+  // Handle confirm alert.
+  const handleConfirmTransferred = () => {
+    transferredWarehouseTransferMutate(warehouseTransferId)
+      .then(() => {
+        AppToaster.show({
+          message: intl.get('warehouse_transfer.alert.transferred_warehouse'),
+          intent: Intent.SUCCESS,
+        });
+      })
+      .catch((error) => {})
+      .finally(() => {
+        closeAlert(name);
+      });
+  };
+
+  return (
+    <Alert
+      cancelButtonText={<T id={'cancel'} />}
+      confirmButtonText={<T id={'deliver'} />}
+      intent={Intent.WARNING}
+      isOpen={isOpen}
+      onCancel={handleCancelAlert}
+      onConfirm={handleConfirmTransferred}
+      loading={isLoading}
+    >
+      <p>
+        <T id={'warehouse_transfer.alert.are_you_sure_you_want_to_deliver'} />
+      </p>
+    </Alert>
+  );
+}
+
+export default compose(
+  withAlertStoreConnect(),
+  withAlertActions,
+)(TransferredWarehouseTransferAlert);

src/containers/Alerts/WarehousesTransfer/WarehouseTransferInitiateAlert.js

@@ -0,0 +1,71 @@
+import React from 'react';
+import { FormattedMessage as T } from 'components';
+import intl from 'react-intl-universal';
+import { Intent, Alert } from '@blueprintjs/core';
+
+import { useInitiateWarehouseTransfer } from 'hooks/query';
+import { AppToaster } from 'components';
+
+import withAlertStoreConnect from 'containers/Alert/withAlertStoreConnect';
+import withAlertActions from 'containers/Alert/withAlertActions';
+
+import { compose } from 'utils';
+
+/**
+ * warehouse transfer initiate alert.
+ * @returns
+ */
+function WarehouseTransferInitiateAlert({
+  name,
+
+  // #withAlertStoreConnect
+  isOpen,
+  payload: { warehouseTransferId },
+
+  // #withAlertActions
+  closeAlert,
+}) {
+  const { mutateAsync: initialWarehouseTransferMutate, isLoading } =
+    useInitiateWarehouseTransfer();
+
+  // handle cancel alert.
+  const handleCancelAlert = () => {
+    closeAlert(name);
+  };
+
+  // Handle confirm alert.
+  const handleConfirmInitiated = () => {
+    initialWarehouseTransferMutate(warehouseTransferId)
+      .then(() => {
+        AppToaster.show({
+          message: intl.get('warehouse_transfer.alert.initiate_warehouse'),
+          intent: Intent.SUCCESS,
+        });
+      })
+      .catch((error) => {})
+      .finally(() => {
+        closeAlert(name);
+      });
+  };
+
+  return (
+    <Alert
+      cancelButtonText={<T id={'cancel'} />}
+      confirmButtonText={<T id={'warehouse_transfer.label.initiate'} />}
+      intent={Intent.WARNING}
+      isOpen={isOpen}
+      onCancel={handleCancelAlert}
+      onConfirm={handleConfirmInitiated}
+      loading={isLoading}
+    >
+      <p>
+        <T id={'warehouse_transfer.alert.are_you_sure_you_want_to_initate'} />
+      </p>
+    </Alert>
+  );
+}
+
+export default compose(
+  withAlertStoreConnect(),
+  withAlertActions,
+)(WarehouseTransferInitiateAlert);

src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferFloatingActions.js

@@ -10,7 +10,7 @@ import {
   Menu,
   MenuItem,
 } from '@blueprintjs/core';
-import { FormattedMessage as T } from 'components';
+import { If, FormattedMessage as T } from 'components';
 import classNames from 'classnames';
 import { useFormikContext } from 'formik';
 import { CLASSES } from 'common/classes';
@@ -26,15 +26,43 @@ export default function WarehouseTransferFloatingActions() {
   const history = useHistory();
 
   // Formik form context.
-  const { isSubmitting, submitForm, resetForm, values, errors } =
+  const { isSubmitting, submitForm, resetForm } = useFormikContext();
-    useFormikContext();
 
   // Warehouse tansfer form context.
-  const { isNewMode, setSubmitPayload } = useWarehouseTransferFormContext();
+  const { warehouseTransfer, setSubmitPayload } =
+    useWarehouseTransferFormContext();
 
-  // Handle submit button click.
+  // Handle submit initiate button click.
-  const handleSubmitBtnClick = (event) => {
+  const handleSubmitInitiateBtnClick = (event) => {
-    setSubmitPayload({ redirect: true });
+    setSubmitPayload({ redirect: true, initiate: true, deliver: false });
+    submitForm();
+  };
+
+  // Handle submit transferred button click.
+  const handleSubmitTransferredBtnClick = (event) => {
+    setSubmitPayload({ redirect: true, initiate: true, deliver: true });
+    submitForm();
+  };
+
+  // Handle submit as draft button click.
+  const handleSubmitDraftBtnClick = (event) => {
+    setSubmitPayload({ redirect: true, initiate: false, deliver: false });
+    submitForm();
+  };
+  // Handle submit as draft & new button click.
+  const handleSubmitDraftAndNewBtnClick = (event) => {
+    setSubmitPayload({
+      redirect: false,
+      initiate: false,
+      deliver: false,
+      resetForm: true,
+    });
+    submitForm();
+  };
+
+  // Handle submit as draft & continue editing button click.
+  const handleSubmitDraftContinueEditingBtnClick = (event) => {
+    setSubmitPayload({ redirect: false, deliver: false, initiate: false });
     submitForm();
   };
 
@@ -43,12 +71,6 @@ export default function WarehouseTransferFloatingActions() {
     resetForm();
   };
 
-  // Handle submit & new button click.
-  const handleSubmitAndNewClick = (event) => {
-    setSubmitPayload({ redirect: false, resetForm: true });
-    submitForm();
-  };
-
   // Handle cancel button click.
   const handleCancelBtnClick = (event) => {
     history.goBack();
@@ -56,27 +78,23 @@ export default function WarehouseTransferFloatingActions() {
 
   return (
     <div className={classNames(CLASSES.PAGE_FORM_FLOATING_ACTIONS)}>
-      {/* ----------- Save and New ----------- */}
+      {/* ----------- Save Intitate & transferred ----------- */}
       <ButtonGroup>
         <Button
           disabled={isSubmitting}
           loading={isSubmitting}
           intent={Intent.PRIMARY}
           type="submit"
-          onClick={handleSubmitBtnClick}
+          onClick={handleSubmitInitiateBtnClick}
           style={{ minWidth: '85px' }}
-          text={!isNewMode ? <T id={'edit'} /> : <T id={'save'} />}
+          text={<T id={'warehouse_transfer.save_initiate_transfer'} />}
         />
         <Popover
           content={
             <Menu>
               <MenuItem
-                text={<T id={'save_and_new'} />}
+                text={<T id={'warehouse_transfer.save_mark_as_transferred'} />}
-                onClick={handleSubmitAndNewClick}
+                onClick={handleSubmitTransferredBtnClick}
-              />
-              <MenuItem
-                text={<T id={'save_continue_editing'} />}
-                // onClick={handleSubmitContinueEditingBtnClick}
               />
             </Menu>
           }
@@ -92,12 +110,44 @@ export default function WarehouseTransferFloatingActions() {
         </Popover>
       </ButtonGroup>
 
+      {/* ----------- Save As Draft ----------- */}
+      <ButtonGroup>
+        <Button
+          disabled={isSubmitting}
+          className={'ml1'}
+          onClick={handleSubmitDraftBtnClick}
+          text={<T id={'save_as_draft'} />}
+        />
+        <Popover
+          content={
+            <Menu>
+              <MenuItem
+                text={<T id={'save_and_new'} />}
+                onClick={handleSubmitDraftAndNewBtnClick}
+              />
+              <MenuItem
+                text={<T id={'save_continue_editing'} />}
+                onClick={handleSubmitDraftContinueEditingBtnClick}
+              />
+            </Menu>
+          }
+          minimal={true}
+          interactionKind={PopoverInteractionKind.CLICK}
+          position={Position.BOTTOM_LEFT}
+        >
+          <Button
+            disabled={isSubmitting}
+            rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+          />
+        </Popover>
+      </ButtonGroup>
+
       {/* ----------- Clear & Reset----------- */}
       <Button
         className={'ml1'}
         disabled={isSubmitting}
         onClick={handleClearBtnClick}
-        text={!isNewMode ? <T id={'reset'} /> : <T id={'clear'} />}
+        text={warehouseTransfer ? <T id={'reset'} /> : <T id={'clear'} />}
       />
 
       {/* ----------- Cancel  ----------- */}

src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferForm.js

@@ -68,7 +68,11 @@ function WarehouseTransferForm({
   const handleSubmit = (values, { setSubmitting, setErrors, resetForm }) => {
     setSubmitting(true);
     // Transformes the values of the form to request.
-    const form = transformValueToRequest(values);
+    const form = {
+      ...transformValueToRequest(values),
+      transfer_initiated: submitPayload.initiate,
+      transfer_delivered: submitPayload.deliver,
+    };
 
     // Handle the request success.
     const onSuccess = () => {

src/containers/WarehouseTransfers/WarehouseTransferForm/WarehouseTransferForm.schema.js

@@ -14,6 +14,8 @@ const Schema = Yup.object().shape({
     .min(1)
     .max(DATATYPES_LENGTH.STRING)
     .label(intl.get('reason')),
+  transfer_initiated: Yup.boolean(),
+  transfer_delivered: Yup.boolean(),
   entries: Yup.array().of(
     Yup.object().shape({
       item_id: Yup.number().nullable(),

src/containers/WarehouseTransfers/WarehouseTransferForm/utils.js

@@ -48,6 +48,8 @@ export const defaultWarehouseTransfer = {
   from_warehouse_id: '',
   to_warehouse_id: '',
   reason: '',
+  transfer_initiated: '',
+  transfer_delivered: '',
   entries: [...repeatValue(defaultWarehouseTransferEntry, MIN_LINES_NUMBER)],
 };
 

src/containers/WarehouseTransfers/WarehouseTransfersLanding/WarehouseTransfersDataTable.js

@@ -91,6 +91,15 @@ function WarehouseTransfersDataTable({
     openAlert('warehouse-transfer-delete', { warehouseTransferId: id });
   };
 
+  // Handle initiate warehouse transfer.
+  const handleInitateWarehouseTransfer = ({ id }) => {
+    openAlert('warehouse-transfer-initate', { warehouseTransferId: id });
+  };
+  // Handle transferred warehouse transfer.
+  const handleTransferredWarehouseTransfer = ({ id }) => {
+    openAlert('transferred-warehouse-transfer', { warehouseTransferId: id });
+  };
+
   // Handle cell click.
   const handleCellClick = (cell, event) => {
     openDrawer('warehouse-transfer-detail-drawer', {
@@ -127,6 +136,8 @@ function WarehouseTransfersDataTable({
           onViewDetails: handleViewDetailWarehouseTransfer,
           onDelete: handleDeleteWarehouseTransfer,
           onEdit: handleEditWarehouseTransfer,
+          onInitate: handleInitateWarehouseTransfer,
+          onTransfer: handleTransferredWarehouseTransfer,
         }}
       />
     </DashboardContentTable>

src/containers/WarehouseTransfers/WarehouseTransfersLanding/components.js

@@ -22,7 +22,7 @@ import {
 } from 'components';
 
 export function ActionsMenu({
-  payload: { onEdit, onDelete, onViewDetails, onPrint },
+  payload: { onEdit, onDelete, onViewDetails, onInitate, onTransfer },
   row: { original },
 }) {
   return (
@@ -38,6 +38,22 @@ export function ActionsMenu({
         text={intl.get('warehouse_transfer.action.edit_warehouse_transfer')}
         onClick={safeCallback(onEdit, original)}
       />
+
+      <If condition={!original.is_transferred && !original.is_initiated}>
+        <MenuItem
+          icon={<Icon icon="check" iconSize={16} />}
+          text={intl.get('warehouse_transfer.action.initiate_transfer')}
+          onClick={safeCallback(onInitate, original)}
+        />
+      </If>
+      <If condition={original.is_initiated && !original.is_transferred}>
+        <MenuItem
+          icon={<Icon icon="send" iconSize={16} />}
+          text={intl.get('warehouse_transfer.action.mark_as_transferred')}
+          onClick={safeCallback(onTransfer, original)}
+        />
+      </If>
+
       <MenuDivider />
       <MenuItem
         text={intl.get('warehouse_transfer.action.delete_warehouse_transfer')}
@@ -49,6 +65,36 @@ export function ActionsMenu({
   );
 }
 
+/**
+ * Status accessor.
+ */
+export function StatusAccessor(warehouse) {
+  return (
+    <Choose>
+      <Choose.When
+        condition={warehouse.is_initiated && !warehouse.is_transferred}
+      >
+        <Tag minimal={true} intent={Intent.WARNING} round={true}>
+          <T id={'warehouse_transfer.label.transfer_initiated'} />
+        </Tag>
+      </Choose.When>
+      <Choose.When
+        condition={warehouse.is_initiated && warehouse.is_transferred}
+      >
+        <Tag minimal={true} intent={Intent.SUCCESS} round={true}>
+          <T id={'warehouse_transfer.label.initiated'} />
+        </Tag>
+      </Choose.When>
+
+      <Choose.Otherwise>
+        <Tag minimal={true} intent={Intent.NONE} round={true}>
+          <T id={'draft'} />
+        </Tag>
+      </Choose.Otherwise>
+    </Choose>
+  );
+}
+
 /**
  * Retrieve warehouse transfer table columns.
  */
@@ -95,19 +141,19 @@ export function useWarehouseTransfersTableColumns() {
       {
         id: 'status',
         Header: intl.get('status'),
-        // accessor: (row) => statusAccessor(row),
+        accessor: StatusAccessor,
         width: 140,
         className: 'status',
         clickable: true,
       },
-      {
+      // {
-        id: 'created_at',
+      //   id: 'created_at',
-        Header: intl.get('created_at'),
+      //   Header: intl.get('created_at'),
-        accessor: 'created_at',
+      //   accessor: 'created_at',
-        Cell: FormatDateCell,
+      //   Cell: FormatDateCell,
-        width: 120,
+      //   width: 120,
-        clickable: true,
+      //   clickable: true,
-      },
+      // },
     ],
     [],
   );

src/containers/WarehouseTransfers/WarehousesTransfersAlerts.js

@@ -1,7 +1,13 @@
 import React from 'react';
 
 const WarehouseTransferDeleteAlert = React.lazy(() =>
-  import('../Alerts/Warehouses/WarehouseTransferDeleteAlert'),
+  import('../Alerts/WarehousesTransfer/WarehouseTransferDeleteAlert'),
+);
+const WarehouseTransferInitiateAlert = React.lazy(() =>
+  import('../Alerts/WarehousesTransfer/WarehouseTransferInitiateAlert'),
+);
+const TransferredWarehouseTransferAlert = React.lazy(() =>
+  import('../Alerts/WarehousesTransfer/TransferredWarehouseTransferAlert'),
 );
 
 /**
@@ -12,4 +18,16 @@ export default [
     name: 'warehouse-transfer-delete',
     component: WarehouseTransferDeleteAlert,
   },
+  {
+    name: 'warehouse-transfer-delete',
+    component: WarehouseTransferDeleteAlert,
+  },
+  {
+    name: 'warehouse-transfer-initate',
+    component: WarehouseTransferInitiateAlert,
+  },
+  {
+    name: 'transferred-warehouse-transfer',
+    component: TransferredWarehouseTransferAlert,
+  },
 ];

src/hooks/query/warehouses.js

@@ -208,6 +208,53 @@ export function useWarehouseTransfer(id, props, requestProps) {
   );
 }
 
+/**
+ * 
+ * @param {*} props 
+ * @returns 
+ */
+export function useInitiateWarehouseTransfer(props) {
+  const queryClient = useQueryClient();
+  const apiRequest = useApiRequest();
+
+  return useMutation(
+    (id) => apiRequest.put(`warehouses/transfers/${id}/initiate`),
+    {
+      onSuccess: (res, id) => {
+        queryClient.invalidateQueries([t.WAREHOUSE_TRANSFER, id]);
+
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
+      },
+      ...props,
+    },
+  );
+}
+
+/**
+ * 
+ * @param {*} props 
+ * @returns 
+ */
+export function useTransferredWarehouseTransfer(props) {
+  const queryClient = useQueryClient();
+  const apiRequest = useApiRequest();
+
+  return useMutation(
+    (id) => apiRequest.put(`warehouses/transfers/${id}/transferred`),
+    {
+      onSuccess: (res, id) => {
+        queryClient.invalidateQueries([t.WAREHOUSE_TRANSFER, id]);
+
+        // Common invalidate queries.
+        commonInvalidateQueries(queryClient);
+      },
+      ...props,
+    },
+  );
+}
+
+
 export function useRefreshWarehouseTransfers() {
   const queryClient = useQueryClient();
 

src/lang/en/index.json

@@ -1799,6 +1799,8 @@
   "warehouse_transfer.action.edit_warehouse_transfer": "Edit Warehouse Transfer",
   "warehouse_transfer.action.delete_warehouse_transfer": "Delete Warehouse Transfer",
   "warehouse_transfer.action.new_warehouse_transfer": "New Warehouse Transfer",
+  "warehouse_transfer.action.initiate_transfer": "Initiate Transfer",
+  "warehouse_transfer.action.mark_as_transferred": "Mark as Transferred",
   "warehouse_transfer.column.transfer_no": "Transfer #",
   "warehouse_transfer.column.from_warehouse": "From Warehouse",
   "warehouse_transfer.column.to_warehouse": "To Warehouse",
@@ -1858,5 +1860,14 @@
   "branches_multi_select.placeholder": "Filter by branches…",
   "warehouses_multi_select.label": "Warehouses",
   "warehouses_multi_select.placeholder": "Filter by warehouses…",
-  "dimensions": "Dimensions"
+  "dimensions": "Dimensions",
+  "warehouse_transfer.save_initiate_transfer": "Save & Initiate Transfer",
+  "warehouse_transfer.save_mark_as_transferred": "Save & Mark as Transferred",
+  "warehouse_transfer.label.transfer_initiated": "Transfer Initiated",
+  "warehouse_transfer.label.initiated": "Initiated",
+  "warehouse_transfer.label.initiate": "Initiate",
+  "warehouse_transfer.alert.initiate_warehouse": "The given warehouse transfer has been initialized.",
+  "warehouse_transfer.alert.are_you_sure_you_want_to_initate": "Are you sure you want to initiate this warehouse transfer?",
+  "warehouse_transfer.alert.transferred_warehouse": "The given warehouse transfer has been delivered",
+  "warehouse_transfer.alert.are_you_sure_you_want_to_deliver": "Are you sure you want to deliver this warehouse transfer?"
 }