Merge branch 'develop' of https://github.com/informatici/openhospital-ui

into feature/OH2-287-admin-user-group-crud
gasp · Oct 22, 2024 · a9280f0 · a9280f0
2 parents 9287cab + d5daf9e
commit a9280f0
Show file tree

Hide file tree

Showing 17 changed files with 617 additions and 1,103 deletions.
diff --git a/api/oh.yaml b/api/oh.yaml
diff --git a/src/components/accessories/admin/operations/operationForm/OperationForm.tsx b/src/components/accessories/admin/operations/operationForm/OperationForm.tsx
@@ -1,4 +1,5 @@
 import { useFormik } from "formik";
+import { OperationDTOOpeForEnum } from "generated";
 import { useAppDispatch, useAppSelector } from "libraries/hooks/redux";
 import { get, has } from "lodash";
 import React, {
@@ -63,6 +64,15 @@ const OperationForm: FC<IOperationProps> = ({
     [operationsTypeState.data]
   );
 
+  const operationContextOptions = () => {
+    return Object.values(OperationDTOOpeForEnum).map((type) => {
+      return {
+        label: t(`operation.contextOptions.${type}`),
+        value: type,
+      };
+    });
+  };
+
   const errorMessage = useMemo(
     () =>
       (creationMode
@@ -150,19 +160,6 @@ const OperationForm: FC<IOperationProps> = ({
     <div className="operationForm">
       <form className="operationForm__form" onSubmit={formik.handleSubmit}>
         <div className="row start-sm center-xs">
-          <div className="operationForm__item fullWidth">
-            <AutocompleteField
-              fieldName="type"
-              fieldValue={formik.values.type}
-              label={t("operation.type")}
-              isValid={isValid("type")}
-              errorText={getErrorText("type")}
-              onBlur={onBlurCallback("type")}
-              options={operationsTypeOptions}
-              loading={operationsTypeState.status === "LOADING"}
-              disabled={isLoading}
-            />
-          </div>
           <div className="operationForm__item halfWidth">
             <TextField
               field={formik.getFieldProps("code")}
@@ -176,6 +173,22 @@ const OperationForm: FC<IOperationProps> = ({
             />
           </div>
           <div className="operationForm__item halfWidth">
+            <AutocompleteField
+              fieldName="type"
+              fieldValue={formik.values.type}
+              label={t("operation.type")}
+              isValid={isValid("type")}
+              errorText={getErrorText("type")}
+              onBlur={onBlurCallback("type")}
+              options={operationsTypeOptions}
+              loading={operationsTypeState.status === "LOADING"}
+              disabled={isLoading}
+            />
+          </div>
+        </div>
+
+        <div className="row start-sm center-xs">
+          <div className="operationForm__item thirdWidth">
             <TextField
               field={formik.getFieldProps("description")}
               theme="regular"
@@ -187,10 +200,20 @@ const OperationForm: FC<IOperationProps> = ({
               disabled={isLoading}
             />
           </div>
-        </div>
-
-        <div className="row start-sm center-xs">
-          <div className="operationForm__item">
+          <div className="operationForm__item thirdWidth">
+            <AutocompleteField
+              fieldName="opeFor"
+              fieldValue={formik.values.opeFor}
+              label={t("operation.opeFor")}
+              isValid={isValid("opeFor")}
+              errorText={getErrorText("opeFor")}
+              onBlur={onBlurCallback("opeFor")}
+              options={operationContextOptions()}
+              loading={operationsTypeState.status === "LOADING"}
+              disabled={isLoading}
+            />
+          </div>
+          <div className="operationForm__item thirdWith">
             <CheckboxField
               fieldName={"major"}
               checked={formik.values.major === "1"}

diff --git a/src/components/accessories/admin/operations/operationForm/consts.ts b/src/components/accessories/admin/operations/operationForm/consts.ts
@@ -1,13 +1,17 @@
-import { TFields } from "../../../../../libraries/formDataHandling/types";
 import { OperationFormFieldName } from ".";
-import { OperationDTO } from "../../../../../generated";
+import { OperationDTO, OperationDTOOpeForEnum } from "../../../../../generated";
+import { TFields } from "../../../../../libraries/formDataHandling/types";
 
 export const getInitialFields: (
   operation: OperationDTO | undefined
 ) => TFields<OperationFormFieldName> = (operation) => ({
   code: { type: "text", value: operation?.code ?? "" },
   description: { type: "text", value: operation?.description ?? "" },
   type: { type: "text", value: operation?.type?.code ?? "" },
+  opeFor: {
+    type: "text",
+    value: operation?.opeFor ?? OperationDTOOpeForEnum.OpdAdmission,
+  },
   major: {
     type: "number",
     value: `${operation?.major ?? 1}`,

diff --git a/src/components/accessories/admin/operations/operationForm/styles.scss b/src/components/accessories/admin/operations/operationForm/styles.scss
@@ -17,7 +17,7 @@
 
   .operationForm__item {
     margin: 7px 0px;
-    padding: 0px 15px;
+    padding: 0px 7px;
     width: 50%;
     @include susy-media($narrow) {
       padding: 0px 10px;
@@ -50,7 +50,7 @@
       }
     }
     &.thirdWidth {
-      width: 33%;
+      width: 33.33%;
       @include susy-media($smartphone) {
         width: 100%;
       }

diff --git a/src/components/accessories/admin/operations/operationForm/types.ts b/src/components/accessories/admin/operations/operationForm/types.ts
@@ -10,4 +10,9 @@ export interface IOperationProps {
   isLoading: boolean;
 }
 
-export type OperationFormFieldName = "code" | "description" | "type" | "major";
+export type OperationFormFieldName =
+  | "code"
+  | "description"
+  | "type"
+  | "major"
+  | "opeFor";
diff --git a/src/components/accessories/admin/operations/operationTable/OperationTable.tsx b/src/components/accessories/admin/operations/operationTable/OperationTable.tsx
@@ -3,7 +3,7 @@ import { useAppDispatch, useAppSelector } from "libraries/hooks/redux";
 import React, { FunctionComponent, ReactNode, useEffect, useRef } from "react";
 import { useTranslation } from "react-i18next";
 import checkIcon from "../../../../../assets/check-icon.png";
-import { OperationDTO } from "../../../../../generated";
+import { OperationDTO, OperationDTOOpeForEnum } from "../../../../../generated";
 import { scrollToElement } from "../../../../../libraries/uiUtils/scrollToElement";
 import { deleteOperationReset } from "../../../../../state/operations";
 import ConfirmationDialog from "../../../confirmationDialog/ConfirmationDialog";
@@ -35,15 +35,26 @@ export const OperationTable: FunctionComponent<IOwnProps> = ({
       })) ?? []
   );
 
-  const header = ["code", "type", "description", "class"];
+  const operationContextOptions = () => {
+    return Object.values(OperationDTOOpeForEnum).map((type) => {
+      return {
+        label: t(`operation.contextOptions.${type}`),
+        value: type,
+      };
+    });
+  };
+
+  const header = ["code", "type", "description", "class", "opeFor"];
 
   const label = {
     code: t("operation.code"),
     type: t("operation.type"),
     description: t("operation.description"),
     class: t("operation.class"),
+    opeFor: t("operation.opeFor"),
   };
-  const order = ["code", "type", "description", "class"];
+
+  const order = ["code", "type", "description", "class", "opeFor"];
   const filters: TFilterField[] = [
     { key: "description", label: t("operation.description"), type: "text" },
     {
@@ -61,6 +72,12 @@ export const OperationTable: FunctionComponent<IOwnProps> = ({
         { label: t("operation.classes.major"), value: "1" },
       ],
     },
+    {
+      key: "opeFor",
+      label: t("operation.opeFor"),
+      type: "select",
+      options: operationContextOptions(),
+    },
   ];
 
   const { data, status, error } = useAppSelector(
@@ -89,6 +106,7 @@ export const OperationTable: FunctionComponent<IOwnProps> = ({
         code: item.code ?? "",
         type: item.type?.description ?? "",
         description: item.description ?? "",
+        opeFor: t(`operation.contextOptions.${item.opeFor}`),
         class:
           item.major === 0
             ? t("operation.classes.minor")

diff --git a/src/components/accessories/admin/suppliers/Suppliers.tsx b/src/components/accessories/admin/suppliers/Suppliers.tsx
@@ -1,14 +1,17 @@
 import React from "react";
 
+import { useAppDispatch } from "libraries/hooks/redux";
 import { useTranslation } from "react-i18next";
 import { useNavigate } from "react-router";
+import { deleteSupplier } from "state/suppliers";
 import { PATHS } from "../../../../consts";
 import { SupplierDTO } from "../../../../generated";
 import Button from "../../button/Button";
 import SuppliersTable from "./suppliersTable";
 
 export const Suppliers = () => {
   const navigate = useNavigate();
+  const dispatch = useAppDispatch();
   const { t } = useTranslation();
 
   const handleEdit = (row: SupplierDTO) => {
@@ -17,9 +20,14 @@ export const Suppliers = () => {
     });
   };
 
+  const handleDelete = (row: SupplierDTO) => {
+    dispatch(deleteSupplier(row.supId));
+  };
+
   return (
     <SuppliersTable
       onEdit={handleEdit}
+      onDelete={handleDelete}
       headerActions={
         <Button
           onClick={() => {

diff --git a/src/components/accessories/admin/suppliers/suppliersTable/SuppliersTable.tsx b/src/components/accessories/admin/suppliers/suppliersTable/SuppliersTable.tsx
@@ -1,22 +1,34 @@
 import { CircularProgress } from "@mui/material";
+import ConfirmationDialog from "components/accessories/confirmationDialog/ConfirmationDialog";
 import { useAppDispatch, useAppSelector } from "libraries/hooks/redux";
-import React, { ReactNode, useEffect } from "react";
+import React, { ReactNode, useEffect, useRef } from "react";
 import { useTranslation } from "react-i18next";
 import { SupplierDTO } from "../../../../../generated";
-import { getSuppliers } from "../../../../../state/suppliers";
+import {
+  deleteSupplierReset,
+  getSuppliers,
+} from "../../../../../state/suppliers";
 import InfoBox from "../../../infoBox/InfoBox";
 import Table from "../../../table/Table";
 import { TFilterField } from "../../../table/filter/types";
 import classes from "./SuppliersTable.module.scss";
 
+import checkIcon from "../../../../../assets/check-icon.png";
+
 interface IOwnProps {
   onEdit: (row: any) => void;
+  onDelete: (row: any) => void;
   headerActions?: ReactNode;
 }
 
-export const SuppliersTable = ({ onEdit, headerActions }: IOwnProps) => {
+export const SuppliersTable = ({
+  onEdit,
+  onDelete,
+  headerActions,
+}: IOwnProps) => {
   const dispatch = useAppDispatch();
   const { t } = useTranslation();
+  const infoBoxRef = useRef<HTMLDivElement>(null);
 
   useEffect(() => {
     dispatch(getSuppliers());
@@ -44,6 +56,8 @@ export const SuppliersTable = ({ onEdit, headerActions }: IOwnProps) => {
     (state) => state.suppliers.supplierList
   );
 
+  const deleteSupplier = useAppSelector((state) => state.suppliers.delete);
+
   const formatDataToDisplay = (data: SupplierDTO[]) => {
     return data.map((item) => {
       return {
@@ -78,20 +92,48 @@ export const SuppliersTable = ({ onEdit, headerActions }: IOwnProps) => {
 
           case "SUCCESS":
             return (
-              <Table
-                rowData={formatDataToDisplay(data ?? [])}
-                tableHeader={header}
-                labelData={label}
-                columnsOrder={order}
-                rowsPerPage={10}
-                isCollapsabile={true}
-                onEdit={handleEdit}
-                filterColumns={filters}
-                showEmptyCell={false}
-                rowKey="name"
-                manualFilter={false}
-                headerActions={headerActions}
-              />
+              <>
+                <Table
+                  rowData={formatDataToDisplay(data ?? [])}
+                  tableHeader={header}
+                  labelData={label}
+                  columnsOrder={order}
+                  rowsPerPage={10}
+                  isCollapsabile={true}
+                  onEdit={handleEdit}
+                  onDelete={onDelete}
+                  filterColumns={filters}
+                  showEmptyCell={false}
+                  rowKey="name"
+                  manualFilter={false}
+                  headerActions={headerActions}
+                />
+                {deleteSupplier.isLoading && (
+                  <div ref={infoBoxRef} className="info-box-container">
+                    <InfoBox type="info" message={t("supplier.deleting")} />
+                  </div>
+                )}
+                {deleteSupplier.status === "FAIL" && (
+                  <div ref={infoBoxRef} className="info-box-container">
+                    <InfoBox
+                      type="error"
+                      message={deleteSupplier.error?.message || "unknown error"}
+                    />
+                  </div>
+                )}
+                <ConfirmationDialog
+                  isOpen={deleteSupplier.status === "SUCCESS"}
+                  title={t("supplier.deleted")}
+                  icon={checkIcon}
+                  info={t("supplier.deleteSuccess")}
+                  primaryButtonLabel="Ok"
+                  handlePrimaryButtonClick={() => {
+                    dispatch(getSuppliers());
+                    dispatch(deleteSupplierReset());
+                  }}
+                  handleSecondaryButtonClick={() => ({})}
+                />
+              </>
             );
           case "SUCCESS_EMPTY":
             return <InfoBox type="info" message={t("common.emptydata")} />;

diff --git a/src/components/accessories/autocompleteField/styles.scss b/src/components/accessories/autocompleteField/styles.scss
@@ -18,7 +18,7 @@
   }
 
   .MuiAutocomplete-inputRoot[class*="MuiOutlinedInput-root"] {
-    padding: 10px !important;
+    padding: 12px !important;
   }
 }
 

diff --git a/src/generated/apis/SuppliersApi.ts b/src/generated/apis/SuppliersApi.ts
@@ -17,6 +17,10 @@ import {
     SupplierDTO,
 } from '../models';
 
+export interface DeleteSupplierRequest {
+    id: number;
+}
+
 export interface GetSuppliersRequest {
     excludeDeleted?: boolean;
 }
@@ -38,6 +42,24 @@ export interface UpdateSupplierRequest {
  */
 export class SuppliersApi extends BaseAPI {
 
+    /**
+     */
+    deleteSupplier({ id }: DeleteSupplierRequest): Observable<void>
+    deleteSupplier({ id }: DeleteSupplierRequest, opts?: OperationOpts): Observable<void | RawAjaxResponse<void>>
+    deleteSupplier({ id }: DeleteSupplierRequest, opts?: OperationOpts): Observable<void | RawAjaxResponse<void>> {
+        throwIfNullOrUndefined(id, 'id', 'deleteSupplier');
+
+        const headers: HttpHeaders = {
+            ...(this.configuration.username != null && this.configuration.password != null ? { Authorization: `Basic ${btoa(this.configuration.username + ':' + this.configuration.password)}` } : undefined),
+        };
+
+        return this.request<void>({
+            url: '/suppliers/{id}'.replace('{id}', encodeURI(id)),
+            method: 'DELETE',
+            headers,
+        }, opts?.responseOpts);
+    };
+
     /**
      */
     getSuppliers({ excludeDeleted }: GetSuppliersRequest): Observable<Array<SupplierDTO>>
-Original file line number
+Diff line change
@@ Expand Up / @@ -18,7 +18,7 @@ @@
       }
       .MuiAutocomplete-inputRoot[class*="MuiOutlinedInput-root"] {
-        padding: 10px !important;
+        padding: 12px !important;
       }
     }
@@ Expand Down @@