npm - @openmrs/esm-stock-management-app - Versions diffs - 1.0.1-pre.327 - Mend

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

Files changed (366) hide show

package/src/core/print/PrintTemplate.ts ADDED Viewed

@@ -0,0 +1,65 @@
+import { PrintCss } from "./PrintStyles";
+import { PRINT_LOGO_TEXT, PRINT_LOGO } from "../../constants";
+import { GetPrintLogo, PrintLogoData } from "../utils/imageUtils";
+export const GetPrintTemplate = (
+  body: string,
+  title: string | null | undefined,
+  printOnLoad = false,
+  closeAfterPrint = true
+) => {
+  return `<html>
+<head>
+<meta http-equiv=Content-Type content="text/html; charset=utf8">
+<title>${title ?? ""}</title>
+<style>
+${PrintCss}
+</style>
+</head>
+<body onload="${
+    printOnLoad ? "window.print()" : ""
+  }" style='word-wrap:break-word' ${
+    closeAfterPrint ? 'onafterprint="self.close()"' : ""
+  }>
+    ${body}
+</body>
+</html>`;
+};
+export const GetLogoSection = async () => {
+  let printLogoData: PrintLogoData | null = null;
+  if (PRINT_LOGO) {
+    try {
+      printLogoData = await GetPrintLogo();
+    } catch (e) {
+      console.info(e);
+    }
+  }
+  return printLogoData || PRINT_LOGO_TEXT
+    ? `
+<div class="logo" >
+    ${
+      printLogoData
+        ? printLogoData.isSvg
+          ? printLogoData.image
+          : `<img alt='' src='${printLogoData.image}' />`
+        : ""
+    }
+    ${
+      PRINT_LOGO_TEXT
+        ? `<span class='logo-text text'>${PRINT_LOGO_TEXT}</span>`
+        : ""
+    }
+</div>
+    `
+    : "";
+};
+export const GetHeaderSection = async () => {
+  const logoSection = await GetLogoSection();
+  return `
+<div class="logo-row right">
+${logoSection}
+</div>
+    `;
+};

package/src/core/print/printUtils.ts ADDED Viewed

@@ -0,0 +1,19 @@
+const printDocumentInternal = (content: string) => {
+  const newWin = window.open("", "Print-Window");
+  if (newWin) {
+    newWin.document.open();
+    newWin.document.write(content);
+    newWin.document.close();
+    // setTimeout(function () {
+    //     if (newWin) {
+    //         newWin.close();
+    //     }
+    // }, 10);
+  }
+};
+export const printDocument = (content: string) => {
+  setTimeout(() => {
+    printDocumentInternal(content);
+  }, 300);
+};

package/src/core/utils/alert.ts ADDED Viewed

@@ -0,0 +1,10 @@
+import { showToast } from "@openmrs/esm-framework";
+export function errorAlert(title: string, msg: string) {
+  showToast({
+    critical: true,
+    title: title,
+    kind: "error",
+    description: msg,
+  });
+}

package/src/core/utils/datetimeUtils.ts ADDED Viewed

@@ -0,0 +1,84 @@
+import dayjs from "dayjs";
+export const formatDisplayDate = (
+  date: Date | null | undefined,
+  format?: string
+) => {
+  return date ? dayjs(date).format(format ?? "DD-MMM-YYYY") : "";
+};
+export const formatBatchExpiryDate = (
+  date: Date | null | undefined,
+  format?: string
+) => {
+  return date ? dayjs(date).format(format ?? "YYYY-MMM") : "";
+};
+export const formatDisplayDateTime = (
+  date: Date | null | undefined,
+  format?: string
+) => {
+  return date ? dayjs(date).format(format ?? "DD-MMM-YYYY HH:mm") : "";
+};
+export const DATE_PICKER_FORMAT = "DD/MM/YYYY";
+export const formatForDatePicker = (date: Date | null | undefined) => {
+  return formatDisplayDate(date, DATE_PICKER_FORMAT);
+};
+export const today = () => {
+  const date = new Date();
+  return new Date(date.getFullYear(), date.getMonth(), date.getDate());
+};
+export const DATE_PICKER_CONTROL_FORMAT = "d/m/Y";
+export const isDateAfterToday = (date: Date | null | undefined) => {
+  if (date) {
+    if (typeof date === "string" || date instanceof String) {
+      date = new Date(date);
+    }
+    return date.getTime() > today().getTime();
+  }
+  return false;
+};
+export const ParseDate = (value: string | null | undefined) => {
+  let date = null;
+  try {
+    if (!value) return date;
+    value = value.toLowerCase();
+    if (value.includes("jan")) value = value.replace("jan", "01");
+    else if (value.includes("feb")) value = value.replace("feb", "02");
+    else if (value.includes("mar")) value = value.replace("mar", "03");
+    else if (value.includes("apr")) value = value.replace("apr", "04");
+    else if (value.includes("may")) value = value.replace("may", "05");
+    else if (value.includes("jun")) value = value.replace("jun", "06");
+    else if (value.includes("jul")) value = value.replace("jul", "07");
+    else if (value.includes("aug")) value = value.replace("aug", "08");
+    else if (value.includes("sep")) value = value.replace("sep", "09");
+    else if (value.includes("oct")) value = value.replace("oct", "10");
+    else if (value.includes("nov")) value = value.replace("nov", "11");
+    else if (value.includes("dec")) value = value.replace("dec", "12");
+    value = value.replace(/-/g, "/");
+    let strMonth;
+    if (value!.substring(3, 5).indexOf("0") === 0)
+      strMonth = value!.substring(4, 5);
+    else strMonth = value!.substring(3, 5);
+    const month = parseInt(strMonth) - 1;
+    if (value) {
+      date = new Date(
+        parseInt(value!.substring(6, 10)),
+        month,
+        parseInt(value!.substring(0, 2)),
+        0,
+        0
+      );
+    }
+  } catch (e) {
+    // Err
+  }
+  return date;
+};

package/src/core/utils/debounce.ts ADDED Viewed

@@ -0,0 +1,21 @@
+export function debounce<A = unknown, R = void>(
+  fn: (args: A) => R,
+  ms: number
+): [(args: A) => Promise<R>, () => void] {
+  let timer: NodeJS.Timeout;
+  const debouncedFunc = (args: A): Promise<R> =>
+    new Promise((resolve) => {
+      if (timer) {
+        clearTimeout(timer);
+      }
+      timer = setTimeout(() => {
+        resolve(fn(args));
+      }, ms);
+    });
+  const teardown = () => clearTimeout(timer);
+  return [debouncedFunc, teardown];
+}

package/src/core/utils/imageUtils.ts ADDED Viewed

@@ -0,0 +1,82 @@
+import { URL_PRINT_LOGO } from "../../constants";
+export interface PrintLogoData {
+  image: string;
+  isSvg: boolean;
+}
+export const GetPrintLogo = (): Promise<PrintLogoData | null> => {
+  const printLogoUrl: string = URL_PRINT_LOGO();
+  return new Promise((resolve, reject) => {
+    if (!printLogoUrl) {
+      resolve(null);
+      return;
+    }
+    const hdnTxtPrintLogo = document.getElementById(
+      "hdnTxtPrintLogo"
+    ) as HTMLTextAreaElement;
+    if (hdnTxtPrintLogo && hdnTxtPrintLogo.value?.length > 0) {
+      const isSvg = hdnTxtPrintLogo.getAttribute("isSvg");
+      resolve({
+        image: (hdnTxtPrintLogo as HTMLTextAreaElement).value,
+        isSvg: isSvg === "1",
+      });
+      return;
+    }
+    if (printLogoUrl.toLowerCase().endsWith(".svg")) {
+      fetch(printLogoUrl, {
+        headers: {
+          "Disable-WWW-Authenticate": "true",
+        },
+      })
+        .then((response) => {
+          if (!response.ok) {
+            throw new Error("Print logo fetch network response was not OK");
+          }
+          return response.text();
+        })
+        .then((svg) => {
+          if (hdnTxtPrintLogo) {
+            hdnTxtPrintLogo.value = svg;
+            hdnTxtPrintLogo.setAttribute("isSvg", "1");
+          }
+          resolve({ image: svg, isSvg: true });
+        })
+        .catch((error) => {
+          console.error("Error fetching print logo: ", error);
+          reject("Error fetching print logo");
+        });
+    } else {
+      const img = new Image();
+      const onImageLoaded = () => {
+        try {
+          const canvas = document.createElement("canvas");
+          canvas.width = img.width;
+          canvas.height = img.height;
+          const ctx = canvas.getContext("2d");
+          if (ctx) {
+            ctx.drawImage(img, 0, 0);
+            const dataURL = canvas.toDataURL("image/png");
+            if (hdnTxtPrintLogo) {
+              hdnTxtPrintLogo.value = dataURL;
+              hdnTxtPrintLogo.setAttribute("isSvg", "0");
+            }
+            resolve({ image: dataURL, isSvg: false });
+          } else {
+            reject("Failed to allocate canvas context for print logo");
+          }
+        } catch (e) {
+          reject(e);
+        }
+      };
+      const onImageLoadError = (ev: ErrorEvent) => {
+        reject(ev);
+      };
+      img.addEventListener("load", onImageLoaded);
+      img.addEventListener("error", onImageLoadError);
+      img.src = printLogoUrl;
+    }
+  });
+};

package/src/core/utils/stringUtils.ts ADDED Viewed

@@ -0,0 +1,27 @@
+export function toErrorMessage(payload: any) {
+  if (!payload) return payload;
+  const errorMessage =
+    payload?.error?.data?.error?.message ??
+    payload?.data?.error?.message ??
+    payload?.message ??
+    payload?.error ??
+    payload;
+  const fieldErrors =
+    payload?.error?.fieldErrors ?? payload?.data?.error?.fieldErrors;
+  if (fieldErrors) {
+    let field: keyof typeof fieldErrors;
+    const errors: any[] = [];
+    for (field in fieldErrors) {
+      errors.push(
+        fieldErrors[field]?.reduce((p: any, c: any, i: number) => {
+          if (i === 0) return c?.message ?? "";
+          p += (p.length > 0 ? " \r\n" : "") + c?.message;
+          return p;
+        }, "")
+      );
+    }
+    return `${errorMessage} ${errors.join(" \r\n")}`;
+  }
+  return errorMessage;
+}

package/src/core/utils/utils.ts ADDED Viewed

@@ -0,0 +1,70 @@
+import { User } from "../api/types/identity/User";
+export const initialStockOperationValue = () => {
+  return {
+    atLocationName: "",
+    atLocationUuid: "",
+    cancelReason: "",
+    cancelledBy: 0,
+    cancelledByFamilyName: "",
+    cancelledByGivenName: "",
+    cancelledDate: undefined,
+    completedBy: 0,
+    completedByFamilyName: "",
+    completedByGivenName: "",
+    completedDate: undefined,
+    creator: 0,
+    creatorFamilyName: "",
+    creatorGivenName: "",
+    dateCreated: undefined,
+    destinationName: "",
+    destinationUuid: "",
+    dispatchedByFamilyName: "",
+    dispatchedByGivenName: "",
+    dispatchedDate: undefined,
+    externalReference: "",
+    locked: false,
+    operationDate: new Date(),
+    operationNumber: "",
+    operationOrder: 0,
+    operationType: "",
+    operationTypeName: "",
+    operationTypeUuid: "",
+    permission: undefined,
+    reasonName: "",
+    reasonUuid: "",
+    rejectedByFamilyName: "",
+    rejectedByGivenName: "",
+    rejectedDate: undefined,
+    rejectionReason: "",
+    remarks: "",
+    requisitionStockOperationUuid: "",
+    responsiblePerson: 0,
+    responsiblePersonFamilyName: "",
+    responsiblePersonGivenName: "",
+    responsiblePersonOther: "",
+    responsiblePersonUuid: "",
+    returnReason: "",
+    returnedByFamilyName: "",
+    returnedByGivenName: "",
+    returnedDate: undefined,
+    sourceName: "",
+    sourceUuid: "",
+    status: undefined,
+    stockOperationItems: [],
+    submitted: false,
+    submittedBy: "",
+    submittedByFamilyName: "",
+    submittedByGivenName: "",
+    submittedDate: undefined,
+    uuid: "",
+  };
+};
+export const otherUser: User = {
+  uuid: "Other",
+  display: "Other",
+  person: {
+    display: "Other",
+  },
+} as unknown as User;

package/src/createDashboardLink.tsx ADDED Viewed

@@ -0,0 +1,43 @@
+import React, { useMemo } from "react";
+import { ConfigurableLink } from "@openmrs/esm-framework";
+import { BrowserRouter, useLocation } from "react-router-dom";
+export interface DashboardLinkConfig {
+  name: string;
+  title: string;
+}
+function DashboardExtension({
+  dashboardLinkConfig,
+}: {
+  dashboardLinkConfig: DashboardLinkConfig;
+}) {
+  const { name, title } = dashboardLinkConfig;
+  const location = useLocation();
+  const spaBasePath = `${window.spaBase}/home`;
+  const navLink = useMemo(() => {
+    const pathArray = location.pathname.split("/home");
+    const lastElement = pathArray[pathArray.length - 1];
+    return decodeURIComponent(lastElement);
+  }, [location.pathname]);
+  return (
+    <ConfigurableLink
+      to={`${spaBasePath}/${name}`}
+      className={`cds--side-nav__link ${
+        navLink.match(name) && "active-left-nav-link"
+      }`}
+    >
+      {title}
+    </ConfigurableLink>
+  );
+}
+export const createDashboardLink =
+  (dashboardLinkConfig: DashboardLinkConfig) => () =>
+    (
+      <BrowserRouter>
+        <DashboardExtension dashboardLinkConfig={dashboardLinkConfig} />
+      </BrowserRouter>
+    );

package/src/dashboard/stock-management-dashboard-side-nav.component.tsx ADDED Viewed

@@ -0,0 +1,50 @@
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { SideNavItem } from "../core/components/side-nav/types";
+import SideNavItemsList from "../core/components/side-nav/side-nav.component";
+const StockManagementDashboardSideNav = () => {
+  const { t } = useTranslation();
+  const [selectedTab, setSelectedTab] = useState(0);
+  const tabs: SideNavItem[] = [
+    {
+      name: t("stockManagementOverview", "Overview"),
+      link: "overview",
+    },
+    {
+      name: t("stockManagementStockItems", "Stock Items"),
+      link: "stock-items",
+    },
+    {
+      name: t("stockManagementOperations", "Stock Operations"),
+      link: "stock-operations",
+    },
+    {
+      name: t("stockManagementStockUserScopes", "Stock User Role Scopes"),
+      link: "stock-user-scopes",
+    },
+    {
+      name: t("stockManagementStockSources", "Stock Sources"),
+      link: "stock-sources",
+    },
+    {
+      name: t("stockManagementLocations", "Stock Locations"),
+      link: "stock-locations",
+    },
+    {
+      name: t("stockManagementSettings", "Stock Settings"),
+      link: `admin/maintenance/settings.list?show=Stockmanagement`,
+    },
+  ];
+  return (
+    <SideNavItemsList
+      tabs={tabs}
+      selectedIndex={selectedTab}
+      onSelectTab={setSelectedTab}
+    />
+  );
+};
+export default StockManagementDashboardSideNav;

package/src/dashboard/stock-management-dashboard.component.tsx ADDED Viewed

@@ -0,0 +1,41 @@
+import React from "react";
+import { StockManagementHeader } from "../stock-management-header/stock-management-header.component";
+import Overlay from "../core/components/overlay/overlay.component";
+import styles from "./stock-management-dashboard.scss";
+import StockManagementDashboardSideNav from "./stock-management-dashboard-side-nav.component";
+import { BrowserRouter, Route, Routes } from "react-router-dom";
+import StockHomeLandingPage from "../stock-home/stock-home-landing-page-component";
+import StockUserScopes from "../stock-user-role-scopes/stock-user-role-scopes.component";
+import StockSources from "../stock-sources/stock-sources.component";
+import StockOperationsComponent from "../stock-operations/stock-operations.component";
+import StockItems from "../stock-items/stock-items.component";
+import StockSettings from "../stock-settings/stock-settings.component";
+import StockLocations from "../stock-locations/stock-locations.component";
+export default function StockManagementDashboard() {
+  const basePath = `${window.getOpenmrsSpaBase()}stock-management`;
+  return (
+    <BrowserRouter basename={basePath}>
+      <div className={styles.container}>
+        <StockManagementDashboardSideNav />
+        <div>
+          <StockManagementHeader />
+          <Routes>
+            <Route path="overview" element={<StockHomeLandingPage />} />
+            <Route path="" element={<StockHomeLandingPage />} />
+            <Route path="stock-items" element={<StockItems />} />
+            <Route
+              path="stock-operations"
+              element={<StockOperationsComponent />}
+            />
+            <Route path="stock-user-scopes" element={<StockUserScopes />} />
+            <Route path="stock-sources" element={<StockSources />} />
+            <Route path="stock-locations" element={<StockLocations />} />
+            <Route path="stock-settings" element={<StockSettings />} />
+          </Routes>
+        </div>
+        <Overlay />
+      </div>
+    </BrowserRouter>
+  );
+}

package/src/dashboard/stock-management-dashboard.scss ADDED Viewed

@@ -0,0 +1,8 @@
+.container{
+  display:"grid";
+  grid-template-columns: 16rem auto;
+  &>div{
+    margin-left: 16rem;
+  }
+}

package/src/dashboard.meta.ts ADDED Viewed

@@ -0,0 +1,5 @@
+export const dashboardMeta = {
+  name: "stock-management",
+  slot: "stock-management-dashboard-slot",
+  title: "Stock Management",
+};

package/src/declarations.d.ts ADDED Viewed

@@ -0,0 +1,6 @@
+declare module "@carbon/react";
+declare module "*.css";
+declare module "*.scss";
+declare module "*.png";
+declare type SideNavProps = object;

package/src/index.ts ADDED Viewed

@@ -0,0 +1,64 @@
+import { defineConfigSchema, getSyncLifecycle } from "@openmrs/esm-framework";
+import { configSchema } from "./config-schema";
+import appMenu from "./stock-app-menu-item/item.component";
+import bulkImportComponent from "./stock-items/add-bulk-stock-item/stock-items-bulk-import.component";
+import deleteUserModalComponent from "./stock-user-role-scopes/delete-stock-user-scope-modal.component";
+import deleteStockModalComponent from "./stock-sources/delete-stock-modal.component";
+import stockOperationDialogComponent from "./stock-operations/stock-operations-dialog/stock-operations-dialog.component";
+import stockManagementDashboardComponent from "./dashboard/stock-management-dashboard.component";
+import stockManagementComponent from "./stock-management.component";
+import stockManagementAdminCardLinkComponent from "./stock-management-admin-card-link.component";
+const moduleName = "@openmrs/esm-stock-management-app";
+const options = {
+  featureName: "stock-management",
+  moduleName,
+};
+export const importTranslation = require.context(
+  "../translations",
+  false,
+  /.json$/,
+  "lazy"
+);
+export const stockManagementAdminCardLink = getSyncLifecycle(
+  stockManagementAdminCardLinkComponent,
+  options
+);
+export const stockManagement = getSyncLifecycle(
+  stockManagementComponent,
+  options
+);
+export const stockManagementDashboard = getSyncLifecycle(
+  stockManagementDashboardComponent,
+  options
+);
+export const stockOperationDialog = getSyncLifecycle(
+  stockOperationDialogComponent,
+  options
+);
+export const deleteStockModal = getSyncLifecycle(deleteStockModalComponent, {
+  featureName: "delete-stock-modal",
+  moduleName,
+});
+export const deleteUserScopeModal = getSyncLifecycle(deleteUserModalComponent, {
+  featureName: "delete-stock-user-scope-modal",
+  moduleName,
+});
+export const importBulkStockItemsDialog = getSyncLifecycle(
+  bulkImportComponent,
+  options
+);
+export const stockManagementAppMenuItem = getSyncLifecycle(appMenu, options);
+export function startupApp() {
+  defineConfigSchema(moduleName, configSchema);
+}

package/src/root.component.tsx ADDED Viewed

@@ -0,0 +1,12 @@
+import React from "react";
+const swrConfiguration = {
+  // Maximum number of retries when the backend returns an error
+  errorRetryCount: 3,
+};
+const Root: React.FC = () => {
+  return <></>;
+};
+export default Root;