Skip to content
Snippets Groups Projects
Commit 5819a6d4 authored by Sarthak Shrivastava's avatar Sarthak Shrivastava
Browse files

Added Item Detailed view

parent d92022be
No related branches found
No related tags found
No related merge requests found
......@@ -20,6 +20,7 @@ import OrganizationDetails from "./components/myorg/OrganizationDetails";
import NotFound from "./components/error/NotFound";
import OrganizationRoster from "./components/myorg/roster/OrganizationRoster";
import OrganizationItems from "./components/myorg/items/OrganizationItems";
import OrganizationItemDetails from "./components/myorg/items/OrganizationItemDetails";
function App() {
// const [token, setToken] = useState();
......@@ -62,6 +63,9 @@ function App() {
<Route element={<PrivateRoutes token={token} />}>
<Route path="/organizations/:orgId/items" element={<OrganizationItems token={token}/> } />
</Route>
<Route element={<PrivateRoutes token={token} />}>
<Route path="/organizations/:orgId/items/:itemId" element={<OrganizationItemDetails token={token}/> } />
</Route>
<Route path='*' element={<NotFound />}/>
<Route path='/404' element={<NotFound />}/>
{/*<Route path="/organizations/:orgId" element={<OrganizationDetails token={token}/>}>*/}
......
/* OrganizationItemDetails.css */
.organization-item-details {
max-width: 600px;
margin: 0 auto;
padding: 20px;
border: 1px solid #ddd;
border-radius: 5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
text-align: center; /* Center the entire content */
}
.item-details {
margin-top: 20px;
}
.item-details span {
display: block;
margin-bottom: 10px;
text-align: left; /* Align text to the left within each span */
}
import React, { useState, useEffect } from 'react';
import { useParams } from 'react-router-dom';
import Axios from 'axios';
import './OrganizationItemDetails.css'
const OrganizationItemDetails = ({ token }) => {
const { orgId, itemId } = useParams();
const [itemInfo, setItemInfo] = useState(null);
useEffect(() => {
const fetchItemDetails = async () => {
try {
const response = await Axios.post('http://localhost:8080/item/user/oneitem', {
orgId: parseInt(orgId), // Convert orgId to integer
jwt: token.jwt,
itemId: parseInt(itemId), // Convert itemId to integer
});
if (response.data.result === 'success') {
setItemInfo(response.data.data);
} else {
console.error('Error fetching item information');
}
} catch (error) {
console.error('Error fetching item information:', error);
}
};
fetchItemDetails();
}, [orgId, itemId, token]);
if (!itemInfo) {
return <div>Loading...</div>;
}
return (
<div className="organization-item-details">
<h2>Item Details</h2>
<div className="item-details">
<span><strong>Name:</strong> {itemInfo[1]}</span>
<span><strong>Description:</strong> {itemInfo[2]}</span>
<span><strong>Owner Email:</strong> {itemInfo[3]}</span>
<span><strong>Quantity:</strong> {itemInfo[4]}</span>
<span><strong>Category:</strong> {itemInfo[5]}</span>
<span><strong>Status:</strong> {itemInfo[6]}</span>
<span><strong>Location:</strong> {itemInfo[9]}</span>
</div>
</div>
);
};
export default OrganizationItemDetails;
......@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react';
import Axios from 'axios';
import './OrganizationItems.css'
import {useParams} from "react-router-dom";
import {useNavigate, useParams} from "react-router-dom";
const OrganizationItems = ({ token }) => {
// const [orgId, setOrgId] = useState(null);
const [items, setItems] = useState([]);
......@@ -14,6 +14,10 @@ const OrganizationItems = ({ token }) => {
const [locationFilter, setLocationFilter] = useState('');
const [quantityFilter, setQuantityFilter] = useState('');
const [searchFilter, setSearchFilter] = useState('');
const navigate = useNavigate();
const handleItemClick = (item) => {
navigate(`/organizations/${orgId}/items/${item}`);
};
useEffect(() => {
const fetchData = async () => {
......@@ -33,9 +37,11 @@ const OrganizationItems = ({ token }) => {
setLocations(['', ...uniqueLocations]);
} else {
console.error('Error fetching organization items');
navigate('/404');
}
} catch (error) {
console.error('Error fetching organization items:', error);
navigate('/404');
}
};
......@@ -108,8 +114,8 @@ const OrganizationItems = ({ token }) => {
<div className="items-list">
{filteredItems.length > 0 ? (
filteredItems.map((item, index) => (
<div key={index} className="item-item">
<div className="item-details">
<div key={index} className="item-item" onClick={() => handleItemClick(item)}>
<div className="item-details" >
<span><strong>Name:</strong> {item[1]}</span>
<span><strong>Description:</strong> {item[2]}</span>
<span><strong>Owner Email:</strong> {item[3]}</span>
......
......@@ -27,5 +27,16 @@ public class CustomItemRepository {
return resultList;
}
@Transactional
public Object getItem(Integer orgId, Integer itemId)
{
String nativeQuery = "SELECT I.*, L.location FROM ITEM I JOIN LOCATION L ON I.location_id = L.location_id WHERE I.organization_id = :orgId AND I.item_id = :itemId";
Query query = entityManager.createNativeQuery(nativeQuery)
.setParameter("orgId", orgId)
.setParameter("itemId", itemId);
return query.getSingleResult();
}
}
......@@ -86,6 +86,44 @@ public class ItemController {
return response;
}
@PostMapping(path="/user/oneitem")
public @ResponseBody Map<String, Object> getItemToken(@RequestBody Map<String, Object> json)
{
Map<String, Object> response = new HashMap<>();
System.out.println(json.entrySet());
if (!json.containsKey("orgId") || !json.containsKey("jwt") || !json.containsKey("itemId"))
{
response.put("result", "failure - bad request");
return response;
}
Map<String, Object> map = getUserOrg(json);
if (map.get("result").equals("success"))
{
Integer orgId = 0;
Integer itemId;
if (json.get("orgId") instanceof Integer)
{
orgId = (Integer) json.get("orgId");
}
else
{
orgId = Integer.parseInt((String)(json.get("orgId"))); }
if (json.get("itemId") instanceof Integer)
itemId = (Integer) json.get("itemId");
else
itemId = Integer.parseInt((String)(json.get("itemId")));
response.put("data", customItemRepository.getItem(orgId, itemId));
response.put("result", "success");
response.put("type", map.get("type"));
}
else
{
response.put("result", "failure - not authorized");
}
return response;
}
/*
Private helper function to validate that the user is supposed to see this data
*/
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment