From 84c2f8bbfaf66ec637c2f1a998dad549835a44e1 Mon Sep 17 00:00:00 2001 From: aashnanaushad Date: Mon, 15 Jun 2020 22:34:32 +0530 Subject: [PATCH] form data display --- src/Components/Facility/AddInventoryForm.tsx | 124 ++++++---- src/Components/Facility/InventoryList.tsx | 237 ++++++++++--------- src/Components/Facility/models.tsx | 10 + src/Redux/actions.tsx | 15 +- src/Redux/api.tsx | 3 + src/Router/AppRouter.tsx | 8 +- 6 files changed, 224 insertions(+), 173 deletions(-) diff --git a/src/Components/Facility/AddInventoryForm.tsx b/src/Components/Facility/AddInventoryForm.tsx index d588d31aba5..3cce8bd0c4e 100644 --- a/src/Components/Facility/AddInventoryForm.tsx +++ b/src/Components/Facility/AddInventoryForm.tsx @@ -4,24 +4,28 @@ import moment from 'moment'; import React, { useCallback, useReducer, useState } from "react"; import { useDispatch } from "react-redux"; import { statusType, useAbortableEffect } from "../../Common/utils"; -import { createTriageForm, getTriageDetails } from "../../Redux/actions"; +import { getItems } from "../../Redux/actions"; import * as Notification from "../../Utils/Notifications.js"; import { DateInputField, TextInputField } from "../Common/HelperInputFields"; import { Loading } from "../Common/Loading"; import PageTitle from "../Common/PageTitle"; -import { PatientStatsModel } from "./models"; +import { InventoryItemsModel } from "./models"; -const initForm: any = { - inventory_name: "", - inventory_description: "", - inventory_stock: "", - inventory_min_stock: "", +// const initForm: any = { +// inventory_id: "", +// inventory_description: "", +// inventory_stock: "", +// inventory_min_stock: "", +// }; +const initForm = { + id: "", + quantity: "", + unit: "", + isIncoming: true, }; - const initialState = { - form: { ...initForm }, - errors: { ...initForm } + form: { ...initForm } }; const triageFormReducer = (state = initialState, action: any) => { @@ -47,19 +51,52 @@ const goBack = () => { window.history.go(-1); }; -export const AddInventoryForm = () => { +export const AddInventoryForm = (props: any) => { + const [state, dispatch] = useReducer(triageFormReducer, initialState); + const { facilityId } = props; const dispatchAction: any = useDispatch(); const [isLoading, setIsLoading] = useState(false); + const [offset, setOffset] = useState(0); + const [data, setData] = useState>([]); + const [totalCount, setTotalCount] = useState(0); + const limit = 14; + const [form, setForm] = useState(initForm); + const fetchData = useCallback( + async (status: statusType) => { + setIsLoading(true); + const res = await dispatchAction(getItems({ limit, offset })); + if (!status.aborted) { + if (res && res.data) { + setData(res.data.results); + setTotalCount(res.data.count); + } + setIsLoading(false); + } + }, + [dispatchAction, offset] + ); + useAbortableEffect( + (status: statusType) => { + fetchData(status); + }, + [fetchData] + ); + console.log("dataaaa", data); const handleSubmit = async (e: any) => { e.preventDefault(); }; const handleChange = (e: any) => { - //handlechange -}; + //handlechange + // const { value, name } = e.target; + // setForm({ ...form, [name]: value }); + let form = { ...state.form }; + form[e.target.name] = e.target.value; + dispatchAction({ type: "set_form", form }); + }; if (isLoading) { @@ -75,51 +112,48 @@ export const AddInventoryForm = () => {
Inventory Name - +
- Inventory Description - + Status: +
- Available Stock + Quantity
- Minimum Stock Required - + Unit +
diff --git a/src/Components/Facility/InventoryList.tsx b/src/Components/Facility/InventoryList.tsx index d8d4ea17187..f1b71b07683 100644 --- a/src/Components/Facility/InventoryList.tsx +++ b/src/Components/Facility/InventoryList.tsx @@ -4,8 +4,9 @@ import { Button } from "@material-ui/core"; import { navigate } from "hookrouter"; -export default function InventoryList() { - +export default function InventoryList(props: any) { + const { facilityId }: any = props; + console.log("facilityyyyy", facilityId); // interface InventoryProps { // name: string; // description: string; @@ -14,147 +15,147 @@ export default function InventoryList() { // } const inventory = [ - {id: "1", name: "Smith", description: "Hey", stock: "100", minStock :"20"}, - {id: "21", name: "jai", description: "Hey", stock: "100", minStock :"20"}, - {id: "3", name: "will", description: "Hey", stock: "100", minStock :"20"}, - {id: "4", name: "sss", description: "Hey", stock: "100", minStock :"20"}, - + { id: "1", name: "Smith", description: "Hey", stock: "100", minStock: "20" }, + { id: "21", name: "jai", description: "Hey", stock: "100", minStock: "20" }, + { id: "3", name: "will", description: "Hey", stock: "100", minStock: "20" }, + { id: "4", name: "sss", description: "Hey", stock: "100", minStock: "20" }, + ] - + return (
- -
-
+ +
+
- -
-
-
- -
- - - +
+
+
+ +
+ + + +
+
+
+ +
+ + + +
-
- -
- - +
+ + + + -
+ +
-
- - - - - - - -
-
-
-
- - - - + + + + )} +
- Name +
+
+ + + + - - - - - - { inventory.map((item, key) => + + + {inventory.map((item, key) => + + + + - - + + - - - - - - - )} -
+ Name - Description + + Description - Stock + + Stock - Minimum Stock + + Minimum Stock
+
-
-
- -
+
+

+ {item.name} +

+
+
+
+

{item.description}

+

- {item.name} + {item.stock}

- - - 		-

{item.description}

- 		-

- {item.stock} -

- 		-

- {item.minStock} -

-
-
- - Showing 1 to 4 of 50 Entries + +
+

+ {item.minStock} +

+
+
+ + Showing 1 to 4 of 50 Entries -
- - +
-
-
+
) } \ No newline at end of file diff --git a/src/Components/Facility/models.tsx b/src/Components/Facility/models.tsx index f14d1a965e5..39ca8989d39 100644 --- a/src/Components/Facility/models.tsx +++ b/src/Components/Facility/models.tsx @@ -81,4 +81,14 @@ export interface DupPatientModel { date_of_birth: string; year_of_birth: number; state_id: number; +} + +export interface InventoryItemsModel { + // count?: number; + id?: number; + name?: string; + default_unit?: { + id: number; + name: string; + }; } \ No newline at end of file diff --git a/src/Redux/actions.tsx b/src/Redux/actions.tsx index cb9b0fc6872..9ec8f58521e 100644 --- a/src/Redux/actions.tsx +++ b/src/Redux/actions.tsx @@ -27,7 +27,7 @@ export const postAmbulance = (params: object) => { return fireRequest('createAmbulance', [], params); }; export const getAmbulanceList = (params: object) => { - return fireRequest('listAmbulance', [] , params); + return fireRequest('listAmbulance', [], params); }; // Facility @@ -57,14 +57,14 @@ export const createCapacity = (id: number | undefined, params: object, pathParam export const createDoctor = (id: number | undefined, params: object, pathParam: object) => { return id ? fireRequest('updateDoctor', [id], params, pathParam) : fireRequest("createDoctor", [], params, pathParam); }; -export const createTriageForm = (params: object ,pathParam:object) => { +export const createTriageForm = (params: object, pathParam: object) => { return fireRequest('createTriage', [], params, pathParam) }; export const getTriageInfo = (pathParam: object) => { - return fireRequest('getTriage', [], {},pathParam) + return fireRequest('getTriage', [], {}, pathParam) }; export const getTriageDetails = (id: number, pathParam: object) => { - return fireRequest('getTriage', [id], {},pathParam) + return fireRequest('getTriage', [id], {}, pathParam) }; export const listCapacity = (params: object, pathParam: object) => { return fireRequest('getCapacity', [], params, pathParam); @@ -147,10 +147,10 @@ export const patchSample = (id: any, params: object) => { // Daily Rounds export const createDailyReport = (params: object, pathParam: object) => { - return fireRequest('createDailyRounds', [], params, pathParam) + return fireRequest('createDailyRounds', [], params, pathParam) }; export const updateDailyReport = (params: object, pathParam: object) => { - return fireRequest('updateDailyReport', [], params, pathParam) + return fireRequest('updateDailyReport', [], params, pathParam) }; export const getDailyReport = (params: object, pathParam: object) => { return fireRequest('getDailyReports', [], params, pathParam) @@ -172,3 +172,6 @@ export const getConsultation = (id: number) => { export const updateConsultation = (id: number, params: object) => { return fireRequest("updateConsultation", [id], params); }; +export const getItems = (params: object) => { + return fireRequest("getItems", [], params); +}; \ No newline at end of file diff --git a/src/Redux/api.tsx b/src/Redux/api.tsx index a9f19e87fd7..124c7daa314 100644 --- a/src/Redux/api.tsx +++ b/src/Redux/api.tsx @@ -264,5 +264,8 @@ export default { path: '/api/v1/test_sample', method: 'PATCH', }, + getItems: { + path: '/api/v1//items/' + }, } diff --git a/src/Router/AppRouter.tsx b/src/Router/AppRouter.tsx index eb9d3568ce4..6d42c348440 100644 --- a/src/Router/AppRouter.tsx +++ b/src/Router/AppRouter.tsx @@ -31,7 +31,8 @@ import ManageUsers from "../Components/Users/ManageUsers"; import { UserAdd } from "../Components/Users/UserAdd"; import AmbulanceOnboarding from "../Components/Ambulance/AmbulanceOnboarding"; import InventoryList from "../Components/Facility/InventoryList"; -import {AddInventoryForm} from "../Components/Facility/AddInventoryForm" + +import { AddInventoryForm } from "../Components/Facility/AddInventoryForm" const img = "https://cdn.coronasafe.network/light-logo.svg"; const logoBlack = @@ -118,9 +119,8 @@ const routes = { "/facility/:facilityId/patient/:patientId/consultation/:consultationId/daily-rounds/:id": ({ facilityId, patientId, consultationId, id }: any) => ( ), - "/facility/:facilityId/inventory": ({ facilityId }: any) => (), - "/facility/:facilityId/inventory/add": ({ facilityId }: any) => (), - "/facility/inventory/add": () => (), + "/facility/:facilityId/inventory": ({ facilityId }: any) => (), + "/facility/:facilityId/inventory/add": ({ facilityId }: any) => (), };