@openmrs/esm-stock-management-app 1.0.1-pre.327

package/src/stock-operations/stock-operations-dialog/stock-operations-completed-dispatch-button.component.tsx

@@ -0,0 +1,36 @@
+import React, { useCallback } from "react";
+
+import { Button } from "@carbon/react";
+import { showModal } from "@openmrs/esm-framework";
+import { useTranslation } from "react-i18next";
+import { Arrival } from "@carbon/react/icons";
+import { StockOperationDTO } from "../../core/api/types/stockOperation/StockOperationDTO";
+
+interface StockOperationCompleteDispatchButtonProps {
+  operation: StockOperationDTO;
+}
+
+const StockOperationCompleteDispatchButton: React.FC<
+  StockOperationCompleteDispatchButtonProps
+> = ({ operation }) => {
+  const { t } = useTranslation();
+  const launchcompletedDispatchModal = useCallback(() => {
+    const dispose = showModal("stock-operation-dialog", {
+      title: "Complete Dispatch",
+      operation: operation,
+      requireReason: false,
+      closeModal: () => dispose(),
+    });
+  }, [operation]);
+
+  return (
+    <Button
+      onClick={launchcompletedDispatchModal}
+      renderIcon={(props) => <Arrival size={16} {...props} />}
+    >
+      {t("complete", "Complete Dispatch ")}
+    </Button>
+  );
+};
+
+export default StockOperationCompleteDispatchButton;

package/src/stock-operations/stock-operations-dialog/stock-operations-dialog.component.tsx

@@ -0,0 +1,167 @@
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { StockOperationDTO } from "../../core/api/types/stockOperation/StockOperationDTO";
+import {
+  Button,
+  Form,
+  ModalBody,
+  ModalFooter,
+  ModalHeader,
+  TextArea,
+  InlineLoading,
+} from "@carbon/react";
+import styles from "./stock-operations-dialog.scss";
+import {
+  StopOperationAction,
+  StopOperationActionType,
+} from "../../core/api/types/stockOperation/StockOperationAction";
+import { executeStockOperationAction } from "../stock-operations.resource";
+import { showNotification, showToast } from "@openmrs/esm-framework";
+import { closeOverlay } from "../../core/components/overlay/hook";
+import { extractErrorMessagesFromResponse } from "../../constants";
+
+interface StockOperationDialogProps {
+  title: string;
+  requireReason: boolean;
+  operation: StockOperationDTO;
+  closeModal: () => void;
+}
+
+const StockOperationDialog: React.FC<StockOperationDialogProps> = ({
+  title,
+  requireReason,
+  operation,
+  closeModal,
+}) => {
+  const confirmType = title.toLocaleLowerCase().trim();
+
+  const { t } = useTranslation();
+
+  const [notes, setNotes] = useState("");
+
+  const [isApproving, setIsApproving] = useState(false);
+
+  const handleClick = async (event) => {
+    event.preventDefault();
+
+    setIsApproving(true);
+
+    let actionName: StopOperationActionType | null = null;
+
+    switch (confirmType) {
+      case "submit":
+        actionName = "SUBMIT";
+        break;
+      case "dispatch":
+        actionName = "DISPATCH";
+        break;
+      case "complete":
+        actionName = "COMPLETE";
+        break;
+      case "completedispatch":
+        actionName = "COMPLETE";
+        break;
+      case "cancel":
+        actionName = "CANCEL";
+        break;
+      case "reject":
+        actionName = "REJECT";
+        break;
+      case "return":
+        actionName = "RETURN";
+        break;
+      case "approve":
+        actionName = "APPROVE";
+        break;
+      case "dispatchapproval":
+        // messagePrefix = "dispatch";
+        actionName = "DISPATCH";
+        break;
+    }
+    if (!actionName) {
+      return;
+    }
+
+    const payload: StopOperationAction = {
+      name: actionName,
+      uuid: operation?.uuid,
+      reason: notes,
+    };
+
+    // submit action
+    executeStockOperationAction(payload).then(
+      () => {
+        setIsApproving(false);
+        showToast({
+          critical: true,
+          title: t("title", `${title} Operation`),
+          kind: "success",
+          description: t(
+            "successMessage",
+            `You have successfully ${title} operation `
+          ),
+        });
+        closeModal();
+        closeOverlay();
+      },
+      (err) => {
+        setIsApproving(false);
+        const errorMessages = extractErrorMessagesFromResponse(err);
+        showNotification({
+          description: t("errorDescription", errorMessages.join(", ")),
+          title: t("errorDescriptionTitle", "Error on saving form"),
+          kind: "error",
+          critical: true,
+        });
+        closeModal();
+        closeOverlay();
+      }
+    );
+  };
+
+  return (
+    <div>
+      <Form onSubmit={handleClick}>
+        <ModalHeader
+          closeModal={closeModal}
+          title={t("title", `${title} Operation`)}
+        />
+        <ModalBody>
+          <div className={styles.modalBody}>
+            <section className={styles.section}>
+              <h5 className={styles.section}>
+                Would you really like to {title} the operation ?
+              </h5>
+            </section>
+            <br />
+            {requireReason && (
+              <section className={styles.section}>
+                <TextArea
+                  labelText={t("notes", "Please explain the reason:")}
+                  id="nextNotes"
+                  name="nextNotes"
+                  invalidText="Required"
+                  maxCount={500}
+                  enableCounter
+                  onChange={(e) => setNotes(e.target.value)}
+                />
+              </section>
+            )}
+          </div>
+        </ModalBody>
+        <ModalFooter>
+          <Button kind="secondary" onClick={closeModal}>
+            {t("cancel", "Cancel")}
+          </Button>
+          {isApproving ? (
+            <InlineLoading />
+          ) : (
+            <Button type="submit">{t("submit", "Submit")}</Button>
+          )}
+        </ModalFooter>
+      </Form>
+    </div>
+  );
+};
+
+export default StockOperationDialog;

package/src/stock-operations/stock-operations-dialog/stock-operations-dialog.scss

@@ -0,0 +1,14 @@
+@use '@carbon/styles/scss/spacing';
+@use '@carbon/styles/scss/type';
+
+section {
+  margin: spacing.$spacing-03;
+}
+
+.sectionTitle {
+  margin-bottom: spacing.$spacing-04;
+}
+
+.modalBody {
+  padding-bottom: spacing.$spacing-05;
+}

package/src/stock-operations/stock-operations-dialog/stock-operations-issue-stock-button.component.tsx

@@ -0,0 +1,58 @@
+import React from "react";
+
+import { Button } from "@carbon/react";
+import { useTranslation } from "react-i18next";
+import { DeliveryTruck } from "@carbon/react/icons";
+import { StockOperationDTO } from "../../core/api/types/stockOperation/StockOperationDTO";
+import { StockOperationType } from "../../core/api/types/stockOperation/StockOperationType";
+import { launchAddOrEditDialog } from "../stock-operation.utils";
+
+interface StockOperationIssueStockButtonProps {
+  operation: StockOperationDTO;
+  operations: StockOperationType[];
+}
+
+const StockOperationIssueStockButton: React.FC<
+  StockOperationIssueStockButtonProps
+> = ({ operation, operations }) => {
+  const { t } = useTranslation();
+  const type: StockOperationType = {
+    uuid: "",
+    name: "Stock Issue",
+    description: "",
+    operationType: "",
+    hasSource: false,
+    sourceType: "Location",
+    hasDestination: false,
+    destinationType: "Location",
+    hasRecipient: false,
+    recipientRequired: false,
+    availableWhenReserved: false,
+    allowExpiredBatchNumbers: false,
+    stockOperationTypeLocationScopes: [],
+    creator: undefined,
+    dateCreated: undefined,
+    changedBy: undefined,
+    dateChanged: undefined,
+    dateVoided: undefined,
+    voidedBy: undefined,
+    voidReason: "",
+    voided: false,
+  };
+
+  const handleButtonClick = () => {
+    launchAddOrEditDialog(operation, false, type, operations, false);
+  };
+
+  return (
+    <Button
+      onClick={handleButtonClick}
+      kind="tertiary"
+      renderIcon={(props) => <DeliveryTruck size={16} {...props} />}
+    >
+      {t("issueStock", "Issue Stock ")}
+    </Button>
+  );
+};
+
+export default StockOperationIssueStockButton;

package/src/stock-operations/stock-operations-dialog/stock-operations-print-button.component.tsx

@@ -0,0 +1,160 @@
+import React from "react";
+
+import { Button } from "@carbon/react";
+import { useConfig } from "@openmrs/esm-framework";
+import { useTranslation } from "react-i18next";
+import { Printer } from "@carbon/react/icons";
+import { StockOperationDTO } from "../../core/api/types/stockOperation/StockOperationDTO";
+import { StockOperationItemCost } from "../../core/api/types/stockOperation/StockOperationItemCost";
+import { StockItemInventory } from "../../core/api/types/stockItem/StockItemInventory";
+
+import { StockItemInventoryFilter } from "../../stock-items/stock-items.resource";
+import { ResourceRepresentation } from "../../core/api/api";
+import { BuildStockOperationData } from "../stock-print-reports/StockOperationReport";
+import { PrintGoodsReceivedNoteStockOperation } from "../stock-print-reports/GoodsReceivedNote";
+import { PrintTransferOutStockOperation } from "../stock-print-reports/StockTransferDocument";
+import { PrintRequisitionStockOperation } from "../stock-print-reports/RequisitionDocument";
+import {
+  getStockItemInventory,
+  getStockOperation,
+  getStockOperationItemsCost,
+} from "../stock-operations.resource";
+
+interface StockOperationCancelButtonProps {
+  operation: StockOperationDTO;
+}
+
+const StockOperationPrintButton: React.FC<StockOperationCancelButtonProps> = ({
+  operation,
+}) => {
+  const { t } = useTranslation();
+
+  const { config } = useConfig();
+
+  // const { printItemCost, printBalanceOnHand } = config;
+
+  // on print stock operation
+  const onPrintStockOperation = async () => {
+    try {
+      let parentOperation: StockOperationDTO | null | undefined;
+      let itemsCost: StockOperationItemCost[] | null | undefined = null;
+      let itemInventory: StockItemInventory[] | null | undefined = null;
+
+      if (operation.requisitionStockOperationUuid) {
+        // get stock operation
+        getStockOperation(operation.requisitionStockOperationUuid)
+          .then((payload: any) => {
+            if ((payload as any).error) {
+              return;
+            }
+            parentOperation = payload;
+          })
+          .catch((error: any) => {
+            if ((error as any).error) {
+              return;
+            }
+            return;
+          });
+        if (!parentOperation) {
+          return null;
+        }
+      }
+
+      if (
+        parentOperation ||
+        parentOperation?.operationType === "stockissue" ||
+        parentOperation?.operationType === "transferout"
+      ) {
+        const enableOperationPrintCosts = true;
+        if (enableOperationPrintCosts) {
+          const inventoryFilter: StockItemInventoryFilter = {};
+          if (operation?.uuid) {
+            inventoryFilter.stockOperationUuid = operation.uuid;
+          }
+          getStockOperationItemsCost(inventoryFilter)
+            .then((payload: any) => {
+              if ((payload as any).error) {
+                return;
+              }
+              itemsCost = payload?.results;
+            })
+            .catch((error: any) => {
+              if ((error as any).error) {
+                return;
+              }
+              return;
+            });
+        }
+      }
+      const enableBalance = true;
+      if (
+        enableBalance &&
+        (parentOperation || parentOperation?.operationType === "requisition")
+      ) {
+        const inventoryFilter: StockItemInventoryFilter = {};
+        if (operation?.uuid) {
+          inventoryFilter.locationUuid = operation.atLocationUuid;
+          inventoryFilter.stockOperationUuid = operation.uuid;
+        } else {
+          inventoryFilter.locationUuid = operation.atLocationUuid;
+          inventoryFilter.stockOperationUuid = operation.uuid;
+        }
+        inventoryFilter.v = ResourceRepresentation.Default;
+        inventoryFilter.groupBy = "LocationStockItem";
+        inventoryFilter.includeStockItemName = "true";
+
+        inventoryFilter.date = JSON.stringify(
+          parentOperation?.dateCreated ?? operation?.dateCreated
+        );
+
+        // get stock item inventory
+        getStockItemInventory(inventoryFilter)
+          .then((payload: any) => {
+            if ((payload as any).error) {
+              return;
+            }
+            itemInventory = payload?.results;
+          })
+          .catch((error: any) => {
+            if ((error as any).error) {
+              return;
+            }
+            return;
+          });
+      }
+
+      const data = await BuildStockOperationData(
+        operation,
+        operation.stockOperationItems,
+        parentOperation,
+        itemsCost,
+        itemInventory
+      );
+      if (data) {
+        if (operation?.operationType === "receipt") {
+          await PrintGoodsReceivedNoteStockOperation(data);
+        } else if (operation?.operationType === "transferout") {
+          await PrintTransferOutStockOperation(data);
+        } else {
+          await PrintRequisitionStockOperation(data);
+        }
+      } else {
+        console.info(data);
+      }
+    } catch (e) {
+      console.info(e);
+    }
+  };
+
+  return (
+    <Button
+      onClick={onPrintStockOperation}
+      kind="tertiary"
+      renderIcon={(props) => <Printer size={16} {...props} />}
+    >
+      {t("print", "Print ")}
+    </Button>
+  );
+};
+
+export default StockOperationPrintButton;

package/src/stock-operations/stock-operations-dialog/stock-operations-reject-button.component.tsx

@@ -0,0 +1,37 @@
+import React, { useCallback } from "react";
+
+import { Button } from "@carbon/react";
+import { showModal } from "@openmrs/esm-framework";
+import { useTranslation } from "react-i18next";
+import { Repeat } from "@carbon/react/icons";
+import { StockOperationDTO } from "../../core/api/types/stockOperation/StockOperationDTO";
+
+interface StockOperationRejectButtonProps {
+  operation: StockOperationDTO;
+}
+
+const StockOperationRejectButton: React.FC<StockOperationRejectButtonProps> = ({
+  operation,
+}) => {
+  const { t } = useTranslation();
+  const launchRejectModal = useCallback(() => {
+    const dispose = showModal("stock-operation-dialog", {
+      title: "Reject",
+      operation: operation,
+      requireReason: true,
+      closeModal: () => dispose(),
+    });
+  }, [operation]);
+
+  return (
+    <Button
+      onClick={launchRejectModal}
+      kind=""
+      renderIcon={(props) => <Repeat size={16} {...props} />}
+    >
+      {t("reject", "Reject ")}
+    </Button>
+  );
+};
+
+export default StockOperationRejectButton;

package/src/stock-operations/stock-operations-dialog/stock-operations-return-button.component.tsx

@@ -0,0 +1,37 @@
+import React, { useCallback } from "react";
+
+import { Button } from "@carbon/react";
+import { showModal } from "@openmrs/esm-framework";
+import { useTranslation } from "react-i18next";
+import { CloseOutline } from "@carbon/react/icons";
+import { StockOperationDTO } from "../../core/api/types/stockOperation/StockOperationDTO";
+
+interface StockOperationReturnButtonProps {
+  operation: StockOperationDTO;
+}
+
+const StockOperationReturnButton: React.FC<StockOperationReturnButtonProps> = ({
+  operation,
+}) => {
+  const { t } = useTranslation();
+  const launchReturnModal = useCallback(() => {
+    const dispose = showModal("stock-operation-dialog", {
+      title: "Return",
+      operation: operation,
+      requireReason: true,
+      closeModal: () => dispose(),
+    });
+  }, [operation]);
+
+  return (
+    <Button
+      onClick={launchReturnModal}
+      kind="tertiary"
+      renderIcon={(props) => <CloseOutline size={16} {...props} />}
+    >
+      {t("return", "Return ")}
+    </Button>
+  );
+};
+
+export default StockOperationReturnButton;