Merge branch 'development' into Peterson_Impl_Make_Profile_Team_Code_…

…Field_Show_Existing_Codes

src/actions/bmdashboard/consumableActions.js

@@ -1,21 +1,26 @@
-import axios from "axios";
-import { SET_CONSUMABLES } from "constants/bmdashboard/consumableConstants";
-import { GET_ERRORS } from "constants/errors";
-import { ENDPOINTS } from "utils/URL";
+import axios from 'axios';
+import { GET_ERRORS } from '../../constants/errors';
+import { ENDPOINTS } from '../../utils/URL';
+import {
+  SET_CONSUMABLES,
+  POST_UPDATE_CONSUMABLE_START,
+  POST_UPDATE_CONSUMABLE_END,
+  POST_UPDATE_CONSUMABLE_ERROR,
+} from '../../constants/bmdashboard/consumableConstants';
 
 export const setConsumables = payload => {
   return {
     type: SET_CONSUMABLES,
-    payload
-  }
-}
+    payload,
+  };
+};
 
 export const setErrors = payload => {
   return {
     type: GET_ERRORS,
-    payload
-  }
-}
+    payload,
+  };
+};
 
 export const purchaseConsumable = async body => {
   return axios
@@ -25,17 +30,52 @@ export const purchaseConsumable = async body => {
       if (err.response) return err.response;
       if (err.request) return err.request;
       return err.message;
-    })
-}
+    });
+};
+
+export const consumableUpdateStart = () => {
+  return {
+    type: POST_UPDATE_CONSUMABLE_START,
+  };
+};
+
+export const consumableUpdateEnd = payload => {
+  return {
+    type: POST_UPDATE_CONSUMABLE_END,
+    payload,
+  };
+};
+
+export const consumableUpdateError = payload => {
+  return {
+    type: POST_UPDATE_CONSUMABLE_ERROR,
+    payload,
+  };
+};
 
 export const fetchAllConsumables = () => {
   return async dispatch => {
-    axios.get(ENDPOINTS.BM_CONSUMABLES)
+    axios
+      .get(ENDPOINTS.BM_CONSUMABLES)
       .then(res => {
-        dispatch(setConsumables(res.data))
+        dispatch(setConsumables(res.data));
       })
       .catch(err => {
-        dispatch(setErrors(err))
+        dispatch(setErrors(err));
+      });
+  };
+};
+
+export const postConsumableUpdate = payload => {
+  return async dispatch => {
+    dispatch(consumableUpdateStart());
+    axios
+      .post(ENDPOINTS.BM_UPDATE_CONSUMABLES, payload)
+      .then(res => {
+        dispatch(consumableUpdateEnd(res.data));
       })
-  }
-}
+      .catch(error => {
+        dispatch(consumableUpdateError(error.response.data.message));
+      });
+  };
+};

src/components/BMDashboard/ConsumableList/ConsumableListView.jsx

@@ -1,6 +1,6 @@
 import { useEffect } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
-import { fetchAllConsumables } from 'actions/bmdashboard/consumableActions';
+import { fetchAllConsumables } from '../../../actions/bmdashboard/consumableActions';
 import ItemListView from '../ItemList/ItemListView';
 import UpdateConsumableModal from '../UpdateConsumables/UpdateConsumableModal';
 

src/components/BMDashboard/UpdateConsumables/UpdateConsumable.css

@@ -1,4 +1,89 @@
 .updateModalContainer {
   overflow-y: scroll;
   height: 75vh;
-}
+}
+
+.updateConsumableContainer {
+  padding: 0% !important;
+
+}
+
+.updateConsumablePage {
+  width: 100%;
+  height: auto;
+  margin: 0px;
+  padding: 1rem 2rem;
+  font-size: 15px;
+}
+
+.updateConsumable {
+  background-color: white;
+  border-radius: 1rem;
+  padding: 1.5rem;
+  height: auto;
+}
+
+.consumableImage {
+  height: 10rem;
+  width: 10rem;
+  margin-bottom: 1rem;
+}
+
+.consumableFormField {
+  margin-bottom: .5rem;
+}
+
+.consumableFormLabel {
+  font-weight: 500;
+  font-size: 15px;
+  color: #1C8BCC;
+  display: flex;
+  justify-content: flex-start;
+}
+
+.consumableFormError {
+  font-weight: 500;
+  font-size: 12px !important;
+  color: red;
+}
+
+.consumableFormErrorClr {
+  color: red;
+}
+
+.consumableFormValue {
+  font-weight: 400;
+  font-size: 15px;
+  display: flex;
+  justify-content: flex-start;
+}
+
+.consumableButtonOutline {
+  color: #2E5061 !important;
+}
+
+.consumableButtonOutline:hover {
+  background-color: #2E5061 !important;
+  color: white !important
+}
+
+.consumableButtonBg {
+  background-color: #2E5061 !important
+}
+
+.consumableButtonBg:hover {
+  background-color: white !important;
+  color: #2E5061 !important;
+}
+
+.updateModalContainer {
+  overflow-y: scroll;
+  height: 75vh;
+}
+
+
+@media (max-width: 992px) {
+  .modal-body {
+    padding: 0 !important;
+  }   
+}