From 568a5421b5b4d4e9c183faab6edb91d67b77b6db Mon Sep 17 00:00:00 2001 From: Khavin Shankar Date: Fri, 25 Aug 2023 17:30:51 +0530 Subject: [PATCH] added ui to add and update health facility id (#6136) --- .../ABDM/ConfigureHealthFacility.tsx | 153 ++++++++++++++++++ src/Components/Facility/FacilityHome.tsx | 14 ++ src/Redux/actions.tsx | 33 ++++ src/Redux/api.tsx | 28 ++++ src/Router/AppRouter.tsx | 12 +- 5 files changed, 239 insertions(+), 1 deletion(-) create mode 100644 src/Components/ABDM/ConfigureHealthFacility.tsx diff --git a/src/Components/ABDM/ConfigureHealthFacility.tsx b/src/Components/ABDM/ConfigureHealthFacility.tsx new file mode 100644 index 00000000000..bae09123633 --- /dev/null +++ b/src/Components/ABDM/ConfigureHealthFacility.tsx @@ -0,0 +1,153 @@ +import { lazy, useCallback, useEffect, useReducer, useState } from "react"; +import { useDispatch } from "react-redux"; + +import { healthFacilityActions } from "../../Redux/actions"; +import * as Notification from "../../Utils/Notifications.js"; +import { navigate } from "raviger"; +import { Cancel, Submit } from "../Common/components/ButtonV2"; +import TextFormField from "../Form/FormFields/TextFormField"; +import Page from "../Common/components/Page"; +const Loading = lazy(() => import("../Common/Loading")); + +const initForm = { + health_facility: null, + hf_id: "", +}; +const initialState = { + form: { ...initForm }, + errors: {}, +}; + +const FormReducer = (state = initialState, action: any) => { + switch (action.type) { + case "set_form": { + return { + ...state, + form: action.form, + }; + } + case "set_error": { + return { + ...state, + errors: action.errors, + }; + } + default: + return state; + } +}; + +export const ConfigureHealthFacility = (props: any) => { + const [state, dispatch] = useReducer(FormReducer, initialState); + const { facilityId } = props; + const dispatchAction: any = useDispatch(); + const [isLoading, setIsLoading] = useState(false); + + const fetchData = useCallback(async () => { + if (facilityId) { + setIsLoading(true); + const res = await dispatchAction(healthFacilityActions.read(facilityId)); + + if (res.status === 200 && res?.data) { + const formData = { + ...state.form, + hf_id: res.data.hf_id, + health_facility: res.data, + }; + dispatch({ type: "set_form", form: formData }); + } + + setIsLoading(false); + } + }, [dispatchAction, facilityId]); + + useEffect(() => { + fetchData(); + }, [dispatch, fetchData]); + + const handleSubmit = async (e: any) => { + e.preventDefault(); + setIsLoading(true); + + if (!state.form.hf_id) { + dispatch({ + type: "set_error", + errors: { hf_id: ["Health Facility Id is required"] }, + }); + setIsLoading(false); + return; + } + + let res = null; + if (state.form.health_facility) { + res = await dispatchAction( + healthFacilityActions.partialUpdate(facilityId, { + hf_id: state.form.hf_id, + }) + ); + } else { + res = await dispatchAction( + healthFacilityActions.create({ + facility: facilityId, + hf_id: state.form.hf_id, + }) + ); + } + + setIsLoading(false); + if (res && res.data) { + Notification.Success({ + msg: "Health Facility config updated successfully", + }); + navigate(`/facility/${facilityId}`); + } else { + if (res?.data) + Notification.Error({ + msg: "Something went wrong: " + (res.data.detail || ""), + }); + } + setIsLoading(false); + }; + + const handleChange = (e: any) => { + dispatch({ + type: "set_form", + form: { ...state.form, [e.name]: e.value }, + }); + }; + + if (isLoading) { + return ; + } + + return ( + +
+
handleSubmit(e)}> +
+
+ handleChange(e)} + error={state.errors?.hf_id} + /> +
+
+
+ navigate(`/facility/${facilityId}`)} /> + +
+
+
+ + ); +}; diff --git a/src/Components/Facility/FacilityHome.tsx b/src/Components/Facility/FacilityHome.tsx index ec157d61884..7e2cfc98823 100644 --- a/src/Components/Facility/FacilityHome.tsx +++ b/src/Components/Facility/FacilityHome.tsx @@ -549,6 +549,20 @@ export const FacilityHome = (props: any) => { > Configure Facility + {config.enable_abdm ? ( + + navigate(`/facility/${facilityId}/health_facility`) + } + authorizeFor={NonReadOnlyUsers} + icon={} + > + Configure Health Facility + + ) : ( + <> + )} navigate(`/facility/${facilityId}/inventory`)} diff --git a/src/Redux/actions.tsx b/src/Redux/actions.tsx index bce87644785..93af658f938 100644 --- a/src/Redux/actions.tsx +++ b/src/Redux/actions.tsx @@ -944,6 +944,39 @@ export const getAbhaCard = (patient: string, type: "pdf" | "png") => { }); }; +export const healthFacilityActions = { + list: (params: object) => { + return fireRequest("listHealthFacilities", [], params); + }, + + create: (data: object) => { + return fireRequest("createHealthFacility", [], data); + }, + + read: (id: string) => { + return fireRequest( + "getHealthFacility", + [], + {}, + { facility_id: id }, + undefined, + true + ); + }, + + update: (id: string, data: object) => { + return fireRequest("updateHealthFacility", [], data, { + facility_id: id, + }); + }, + + partialUpdate: (id: string, data: object) => { + return fireRequest("partialUpdateHealthFacility", [], data, { + facility_id: id, + }); + }, +}; + export const listAssetAvailability = (params: object) => fireRequest("listAssetAvailability", [], params); export const getAssetAvailability = (id: string) => diff --git a/src/Redux/api.tsx b/src/Redux/api.tsx index 67aa96338ae..3efff35689e 100644 --- a/src/Redux/api.tsx +++ b/src/Redux/api.tsx @@ -903,6 +903,34 @@ const routes: Routes = { path: "/api/v1/abdm/healthid/get_abha_card/", method: "POST", }, + + // ABDM Health Facility + + listHealthFacility: { + path: "/api/v1/abdm/health_facility/", + method: "GET", + }, + + createHealthFacility: { + path: "/api/v1/abdm/health_facility/", + method: "POST", + }, + + getHealthFacility: { + path: "/api/v1/abdm/health_facility/{facility_id}/", + method: "GET", + }, + + updateHealthFacility: { + path: "/api/v1/abdm/health_facility/{facility_id}/", + method: "PUT", + }, + + partialUpdateHealthFacility: { + path: "/api/v1/abdm/health_facility/{facility_id}/", + method: "PATCH", + }, + // Asset Availability endpoints listAssetAvailability: { diff --git a/src/Router/AppRouter.tsx b/src/Router/AppRouter.tsx index 24b24cfdf09..6c2ea6a4e8d 100644 --- a/src/Router/AppRouter.tsx +++ b/src/Router/AppRouter.tsx @@ -73,9 +73,10 @@ import { handleSignOut } from "../Utils/utils"; import SessionExpired from "../Components/ErrorPages/SessionExpired"; import ManagePrescriptions from "../Components/Medicine/ManagePrescriptions"; import CentralNursingStation from "../Components/Facility/CentralNursingStation"; +import { ConfigureHealthFacility } from "../Components/ABDM/ConfigureHealthFacility"; export default function AppRouter() { - const { main_logo, enable_hcx } = useConfig(); + const { main_logo, enable_hcx, enable_abdm } = useConfig(); const routes = { "/": () => , @@ -98,6 +99,15 @@ export default function AppRouter() { "/facility/:facilityId/update": ({ facilityId }: any) => ( ), + ...(enable_abdm + ? { + "/facility/:facilityId/health_facility": ({ + facilityId, + }: { + facilityId: string; + }) => , + } + : {}), "/facility/:facilityId/middleware/update": ({ facilityId }: any) => ( ),