Skip to content

Commit

Permalink
Merge pull request #71 from palladiumkenya/AddStakeholdersList
Browse files Browse the repository at this point in the history
Add stakeholders list
  • Loading branch information
MaryKilewe authored Dec 18, 2024
2 parents b732970 + bd24e77 commit b5da6f3
Show file tree
Hide file tree
Showing 23 changed files with 677 additions and 122 deletions.
4 changes: 2 additions & 2 deletions .env
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
REACT_APP_AUTHORITY = 'https://auth.kenyahmis.org/dwhidentity'
REACT_APP_AUTHORITY = 'https://ip/dwhidentity'

REACT_APP_BACKEND_URL = "http://127.0.0.1:8000"
REACT_APP_BACKEND_URL = "http://127.0.0.1:8000"
24 changes: 24 additions & 0 deletions src/App.css
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,26 @@ body {
background-color:#31C48D !important;
}

.green_text_dark{
color:#00897B !important;
}

.cyan_bg_color{
background-color:#E0F7FA !important;
}
.teal_bg_color{
background-color:#E0F2F1 !important;
}
.white_bg_color{
background-color:#FFFFFF !important;
}
.blue_text_color{
color:#0288D1 !important;
}
.red_text_dark{
color:#D32F2F !important;
}

.alert_message{
width:80%;
margin:auto;
Expand Down Expand Up @@ -190,3 +210,7 @@ td{
.nav-link:hover{
color:silver !important;
}

.font-weight-bold{
font-weight: bold;
}
18 changes: 13 additions & 5 deletions src/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,10 @@ import SubmittedApprovals from "./components/SubmittedApprovals";
import PendingApprovals from "./components/PendingApprovals";

import userManager, { signinRedirectCallback, signoutRedirect } from './services/UserService';
import ViewPartnerStakeholdersList from "./components/ViewPartnerStakeholdersList";
import EditPartnerStakeholder from "./components/EditPartnerStakeholder";
import AddPartnerStakeholder from "./components/AddPartnerStakeholder";



function App() {
Expand All @@ -38,7 +42,6 @@ function App() {
await userManager.getUser().then((res) =>{
// console.log("show org data",res)
setUser(res);
// console.log(res.profile)
localStorage.setItem("OrganizationId", res.profile.OrganizationId);

});
Expand Down Expand Up @@ -83,10 +86,15 @@ function App() {
<Route exact path="/facilities/edit/partner/:part_id" element={<EditPartners user={user} />}/>
</Route>

{/* <Route exact path="/facilities/add_facility" element={<AddFacility user={user} />}/>
<Route path="/facilities/update_facility/:fac_id" element={<UpdateFacility />} />
<Route path="/facilities/approve_changes/:fac_id" element={<ApproveFacilityChanges />} />
<Route path="/facilities/edit/partner/:part_id" element={<EditPartners />} /> */}
<Route exact path='/partner/stakeholders/:part_name' element={<ProtectedRoute/>}>
<Route exact path="/partner/stakeholders/:part_name" element={<ViewPartnerStakeholdersList user={user} />}/>
</Route>
<Route exact path='/partner/edit/stakeholder' element={<ProtectedRoute/>}>
<Route exact path="/partner/edit/stakeholder" element={<EditPartnerStakeholder user={user} />}/>
</Route>
<Route exact path='/partner/add/stakeholder/:part_name' element={<ProtectedRoute/>}>
<Route exact path="/partner/add/stakeholder/:part_name" element={<AddPartnerStakeholder user={user} />}/>
</Route>

<Route path="/facilities/view_facility/:fac_id" element={<ViewFacility />} />
<Route path="/facilities/partners" element={<ViewPartners />} />
Expand Down
10 changes: 5 additions & 5 deletions src/components/AddFacility.js
Original file line number Diff line number Diff line change
Expand Up @@ -130,9 +130,9 @@ const AddFacility = (props) => {

return (

<Form id="facility_form" onSubmit={handleSubmit} class="form-control">
<legend class="text-center mt-5"><b>Add Facility</b></legend>
<p class="mb-3 text-center">Add new Facility to your List</p>
<Form id="facility_form" onSubmit={handleSubmit} className="form-control">
<legend className="text-center mt-5"><b>Add Facility</b></legend>
<p className="mb-3 text-center">Add new Facility to your List</p>


{ Counties_list.length > 0 &&
Expand Down Expand Up @@ -174,8 +174,8 @@ const AddFacility = (props) => {
}

<fieldset disabled={facilityAlreadyExists}>
<div class="d-flex justify-content-center mb-5">
<input class="btn green_bg_color text-white" value="Submit" type="submit" style={{width:"200px"}} />
<div className="d-flex justify-content-center mb-5">
<input className="btn green_bg_color text-white" value="Submit" type="submit" style={{width:"200px"}} />
<Spinner style={{display:hiddenSpinner, width: "1.2rem", height: "1.2rem"}}></Spinner>
</div>
</fieldset>
Expand Down
136 changes: 136 additions & 0 deletions src/components/AddPartnerStakeholder.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,136 @@
import React, { Component, useEffect, useState } from "react";
import {Button, Form, FormGroup, Input, Label, Alert, Table, Spinner, Col,
Container, Row} from "reactstrap";

import {FaEdit, FaInfoCircle, FaPlusCircle} from 'react-icons/fa';
import Swal from 'sweetalert2'
import userManager, { signinRedirectCallback, signoutRedirect } from '../services/UserService';

import { API_URL, EMAIL_URL, BASE_URL } from "../constants";

import axios from "axios";
import {Link, useParams,useLocation } from "react-router-dom";
import initial_data from "./json_data/initial_data";



const EditPartnerStakeholder = (props) => {
const { part_name } = useParams();

const location = useLocation();
const searchParams = new URLSearchParams(location.search);
const stakeholder_id = searchParams.get('id');


const [Stakeholder, setStakeholdersData] = useState([]);
const [partners_list, setPartners_list] = useState([]);
const [isOrgSteward, setIsOrgSteward] = useState(false);
const [showSpinner, setShowSpinner] = useState(false);



const setInitialData = async() => {
const initial_data = {
"title":"",
"name":"",
"telno":"",
"email":"",
"partner_id":"",
"partner_name":""

}
setStakeholdersData(initial_data)
};


// async function checkIfOrgSteward(emails) {
// await userManager.getUser().then((res) =>{
// // setIsOrgSteward( emails.includes(res.profile.email.toLowerCase()))
// // default to true for all with login credentials
// setIsOrgSteward( true)
// });
//
// }

const get_partners_list = async() => {
// axios.get(API_URL+"/update_facility/981893d7-8488-4319-b976-747873551b71").then(res => this.setState({ facility: res.data }));
await axios.get(API_URL+"/get_partners_list").then(res => setPartners_list( res.data ));
};


const handleSubmit = async (event) => {

event.preventDefault();
setShowSpinner(true)

await axios.post(`${API_URL}/add_stakeholder`, Stakeholder)
.then(function (response) {
localStorage.setItem("flashMessage", "New Stakeholder successfully added");
window.location.href = `${BASE_URL}/partner/stakeholders/${Stakeholder.partner_name}?id=${Stakeholder.partner_id}`;
setShowSpinner(false)

})
.catch(function (error) {
localStorage.setItem("flashMessage", "Something went wrong. Refresh and try again");
setShowSpinner(false)

});
};


useEffect(() => {
get_partners_list()
setInitialData()
}, [])


return(
<div className="p-5">


<Form onSubmit={handleSubmit} className="form-control " style={{width:"400px", margin:"auto"}}>
<legend className="text-center mt-5"><b>Add Stakeholder</b></legend>
<p className="mb-3 text-center">Add details of a new stakeholder</p>

{/*<fieldset disabled={!isOrgSteward}>*/}
<fieldset >
<Label for="partner">Partner:</Label>
<Input id="partner" name="partner" type="select" value={Stakeholder.partner_id}
onChange={(e) => {setStakeholdersData({...Stakeholder, "partner_id":e.target.value,
"partner_name":part_name}) }}>
<option value=""></option>
{ partners_list.length > 0 &&
partners_list.map(partner => (
<option key={partner.id} value={partner.id}>{partner.name}</option>
))
}
</Input>

<Label for="title">Title:</Label>
<Input type="text" name="title" value={Stakeholder.title}
onChange={(e) => {setStakeholdersData({...Stakeholder, "title":e.target.value}) }}/>

<Label for="name">Name:</Label>
<Input type="text" name="name" value={Stakeholder.name}
onChange={(e) => {setStakeholdersData({...Stakeholder, "name":e.target.value}) }}/>

<Label for="email">Email:</Label>
<Input type="email" name="email" value={Stakeholder.email}
onChange={(e) => {setStakeholdersData({...Stakeholder, "email":e.target.value}) }}/>

<Label for="telno">TelNo:</Label>
<Input type="number" name="telno" value={Stakeholder.telno}
onChange={(e) => {setStakeholdersData({...Stakeholder, "telno":e.target.value}) }}/>
<div className="d-flex justify-content-center mb-5 mt-5">
<input className="btn green_bg_color text-white" value="Add" type="submit" style={{width:"200px"}} />
{showSpinner && <Spinner style={{width: "1.2rem", height: "1.2rem"}}></Spinner> }

</div>
</fieldset>
</Form>
</div>
);

}

export default EditPartnerStakeholder;
12 changes: 6 additions & 6 deletions src/components/ApproveFacilityChanges.js
Original file line number Diff line number Diff line change
Expand Up @@ -227,9 +227,9 @@ const ApproveFacilityChanges = (props) => {
</Alert>
}

<Form id="facility_form" class="form-control">
<legend class="text-center mt-5"><b>Approve Facility Data</b></legend>
<p class="mb-3 text-center">Approve or Reject data added to a Facility</p>
<Form id="facility_form" className="form-control">
<legend className="text-center mt-5"><b>Approve Facility Data</b></legend>
<p className="mb-3 text-center">Approve or Reject data added to a Facility</p>


<fieldset disabled={!isHISapprover}>
Expand Down Expand Up @@ -271,10 +271,10 @@ const ApproveFacilityChanges = (props) => {
</ErrorBoundary>
}

<div class=" d-flex justify-content-around mb-5">
<div className=" d-flex justify-content-around mb-5">
<div >
<button name="approve" type="button" disabled={!editExists} value="Approve changes" id="approve_changes" class="btn btn-sm btn-success px-5 mr-4" onClick={confirm_approval}>
<i class="fa-solid fa-thumbs-up"></i> Approve {showSpinner && <Spinner style={{width: "1.2rem", height: "1.2rem"}}></Spinner> }
<button name="approve" type="button" disabled={!editExists} value="Approve changes" id="approve_changes" className="btn btn-sm btn-success px-5 mr-4" onClick={confirm_approval}>
<i className="fa-solid fa-thumbs-up"></i> Approve {showSpinner && <Spinner style={{width: "1.2rem", height: "1.2rem"}}></Spinner> }
</button>
<span class="px-5"></span>
<button name="discard" type="button" disabled={!editExists} value="Discard changes" id="discard_changes" class="btn btn-sm btn-danger px-5" onClick={confirm_rejection}>
Expand Down
128 changes: 128 additions & 0 deletions src/components/EditPartnerStakeholder.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,128 @@
import React, { Component, useEffect, useState } from "react";
import {Button, Form, FormGroup, Input, Label, Alert, Table, Spinner, Col,
Container, Row} from "reactstrap";

import {FaEdit, FaInfoCircle, FaPlusCircle} from 'react-icons/fa';
import Swal from 'sweetalert2'
import userManager, { signinRedirectCallback, signoutRedirect } from '../services/UserService';

import { API_URL, EMAIL_URL, BASE_URL } from "../constants";

import axios from "axios";
import {Link, useParams,useLocation } from "react-router-dom";



const EditPartnerStakeholder = (props) => {

const location = useLocation();
const searchParams = new URLSearchParams(location.search);
const stakeholder_id = searchParams.get('id');

const [Stakeholder, setStakeholdersData] = useState([]);
const [partners_list, setPartners_list] = useState([]);
const [isOrgSteward, setIsOrgSteward] = useState(false);
const [showSpinner, setShowSpinner] = useState(false);


const getStakeholdersListData = () => {
axios.get(API_URL+`/edit_stakeholder/${stakeholder_id}`).then(res => {
setStakeholdersData(res.data);
checkIfOrgSteward(res.data.org_steward_emails);
});

};

async function checkIfOrgSteward(emails) {
await userManager.getUser().then((res) =>{
// setIsOrgSteward( emails.includes(res.profile.email.toLowerCase()))
// default to true for all with login credentials
setIsOrgSteward( true)
});

}

const get_partners_list = async() => {
// axios.get(API_URL+"/update_facility/981893d7-8488-4319-b976-747873551b71").then(res => this.setState({ facility: res.data }));
await axios.get(API_URL+"/get_partners_list").then(res => setPartners_list( res.data ));
};


const handleSubmit = async (event) => {

event.preventDefault();
setShowSpinner(true)

await axios.post(API_URL + `/edit_stakeholder/${stakeholder_id}`, Stakeholder)
.then(function (response) {
localStorage.setItem("flashMessage", "Stakeholder Data successfully edited");
window.location.href = `${BASE_URL}/partner/stakeholders/${Stakeholder.partner_name}?id=${Stakeholder.partner_id}`;
setShowSpinner(false)

})
.catch(function (error) {
localStorage.setItem("flashMessage", "Something went wrong. Refresh and try again");
setShowSpinner(false)

});
};


useEffect(() => {
getStakeholdersListData()
get_partners_list()

}, [])


return(
<div className="p-5">


<Form onSubmit={handleSubmit} className="form-control " style={{width:"400px", margin:"auto"}}>
<legend className="text-center mt-5"><b>Modify Stakeholder</b></legend>
<p className="mb-3 text-center">Update details about a stakeholder</p>

<fieldset disabled={!isOrgSteward}>
<Label for="sdp_code">SDP CODE:</Label>
<Input type="text" name="sdp_code" value={Stakeholder.sdp_code} disabled/>

<Label for="partner">Partner:</Label>
<Input id="partner" name="partner" type="select" value={Stakeholder.partner_id} required
onChange={(e) => {setStakeholdersData({...Stakeholder, "partner_id":e.target.value}) }}>
<option value=""></option>
{ partners_list.length > 0 &&
partners_list.map(partner => (
<option key={partner.id} value={partner.id}>{partner.name}</option>
))
}
</Input>

<Label for="title">Title:</Label>
<Input type="text" name="title" value={Stakeholder.title}
onChange={(e) => {setStakeholdersData({...Stakeholder, "title":e.target.value}) }}/>

<Label for="name">Name:</Label>
<Input type="text" name="name" value={Stakeholder.name}
onChange={(e) => {setStakeholdersData({...Stakeholder, "name":e.target.value}) }}/>

<Label for="email">Email:</Label>
<Input type="text" name="email" value={Stakeholder.email}
onChange={(e) => {setStakeholdersData({...Stakeholder, "email":e.target.value}) }}/>

<Label for="telno">TelNo:</Label>
<Input type="number" name="telno" value={Stakeholder.telno}
onChange={(e) => {setStakeholdersData({...Stakeholder, "telno":e.target.value}) }}/>
<div className="d-flex justify-content-center mb-5 mt-5">
<input className="btn green_bg_color text-white" value="Update" type="submit" style={{width:"200px"}} />
{showSpinner && <Spinner style={{width: "1.2rem", height: "1.2rem"}}></Spinner> }

</div>
</fieldset>
</Form>
</div>
);

}

export default EditPartnerStakeholder;
Loading

0 comments on commit b5da6f3

Please sign in to comment.