Commit 4ec5e540 authored by Vincent Seyller's avatar Vincent Seyller
Browse files

Avancement

parent acf084b5
let ApiURL = 'http://localhost:8080/ShareLoc/api';
let checkStatus = (res) => {
if (res.ok) {
return res;
} else {
return res.text().then((msg) => { throw new Error(msg); });
}
};
const API = {
alreadyVoted: (data) => {
return fetch(`${ApiURL}/colocation/${data.idColoc}/services/${data.idService}/alreadyVoted`, {
headers: { 'Authorization': 'Bearer' + window.localStorage.getItem(`token`) }
}).then(checkStatus).then(res => res.json());
},
fetchServices: (data) => {
return fetch(`${ApiURL}/colocation/${data.id}/services/`, {
headers: { 'Authorization': 'Bearer ' + window.localStorage.getItem('token') }
}).then(checkStatus).then(res => res.json());
},
fetchRequestedServices: (data) => {
return fetch(`${ApiURL}/colocation/${data.id}/services/requests`, {
headers: { 'Authorization': 'Bearer ' + window.localStorage.getItem('token') }
}).then(checkStatus).then(res => res.json());
},
fetchAchievedServicesDone: (data) => {
return fetch(`${ApiURL}/colocation/${data.id}/services/done/valid`, {
headers: { 'Authorization': 'Bearer ' + window.localStorage.getItem('token') }
}).then(checkStatus).then(res => res.json());
},
fetchMembers: (data) => {
return fetch(`${ApiURL}/colocation/${data.id}/members`, {
headers: { 'Authorization': 'Bearer ' + window.localStorage.getItem('token') }
}).then(checkStatus).then(res => res.json());
},
createMember: (data) => {
return fetch(`${ApiURL}/colocation/${data.id}/members/add?email=${data.email}`, {
method: 'POST',
headers: { 'Authorization': 'Bearer ' + window.localStorage.getItem('token') }
}).then(checkStatus).then(res => res.json());
},
createService: (data) => {
return fetch(`${ApiURL}/colocation/${data.id}/services/add?title=${data.title}&description=${data.description}&cost=${data.cost}`, {
method: 'POST',
headers: { 'Authorization': 'Bearer ' + window.localStorage.getItem('token') }
}).then(checkStatus).then(res => res.json());
},
getBeneficiaries: (data) => {
return fetch(`${ApiURL}/colocation/${data.id}/services/done/${data.idService}/to`, {
headers: { 'Authorization': 'Bearer ' + window.localStorage.getItem('token') }
}).then(checkStatus).then(res => res.json());
},
fetchColocation: () => {
return fetch(`${ApiURL}/colocation/yours`, {
headers: { 'Authorization': 'Bearer ' + window.localStorage.getItem('token') }
}).then(checkStatus).then(res => res.json());
},
createColocation: (data) => {
return fetch(`${ApiURL}/colocation/create?name=${data.name}`, {
method: 'POST',
headers: { 'Authorization': 'Bearer ' + window.localStorage.getItem('token') }
}).then(checkStatus);
}
};
export default API;
\ No newline at end of file
import {useQuery, useQueryCache} from 'react-query';
import {useParams, useHistory} from 'react-router-dom';
import {ListGroup, Container, Button} from 'react-bootstrap';
import {Typography} from '@material-ui/core/'
import {useEffect, useState} from 'react';
import API from './API';
let AchievedServices = () => {
const queryCache = useQueryCache();
const history = useHistory();
let id = parseInt(useParams().id);
let fetchAchievedServicesDone = async () => {
return await API.fetchAchievedServicesDone({id: id});
};
const {data, status} = useQuery('AchievedServicesDone', fetchAchievedServicesDone);
return <Container>
<br/>
<h2>Achieved services</h2>
<br/>
{status === 'loading' && (<div>Loading data...</div>)}
{status === 'error' && (<div>Error fetching data</div>)}
{status === 'success' && (
<>
<ListGroup>
{data.map((achievedService, idx) => {
return <ListGroup.Item key={idx}><AchievedService achievedService={achievedService} /></ListGroup.Item>
})}
</ListGroup>
</>
)}
<br/>
<Button variant='primary' onClick={() => history.push('/colocation/' + id)}>Back to colocation</Button>
</Container>;
}
let AchievedService = ({achievedService}) => {
let [users, setUsers] = useState(null);
let id = parseInt(useParams().id);
let getBeneficiaries = async () => {
return await API.getBeneficiaries({id: id, idService: achievedService.id});
}
return <>
<Typography variant="h6" color="primary">{achievedService.service.title}</Typography>
<Typography variant="overline" color="primary">From {achievedService.from.email}</Typography><br/>
<Typography variant="overline" color="primary">For</Typography>
<ul>
<li>
t
</li>
<li>
t
</li>
</ul>
<br/>
{/* {requestedService.validating ?
<Typography variant="overline" color="primary">To validate</Typography> :
<>{requestedService.adding ?
<Typography variant="overline">To add</Typography> :
<Typography variant="overline" color="error">To delete</Typography>
}</>}
<br/>
<Typography>{requestedService.service.description}</Typography>
<br/>
{vote != null ?
vote ?
<p>Already voted</p> :
// <><Button variant="success" onClick={() => voteForRequestedService(true)}>Add</Button> <Button variant="danger" onClick={() => voteForRequestedService(false)}>Decline</Button></>
<p>Vote here !</p> :
null */}
</>
}
export default AchievedServices;
import {useQuery, useMutation, useQueryCache} from 'react-query';
import {useState} from 'react';
import {Route, useHistory} from 'react-router-dom';
import {useHistory} from 'react-router-dom';
import {TextField} from '@material-ui/core/'
import {ListGroup, Button, Container, Card} from 'react-bootstrap';
import API from './API'
let Colocations = () => {
const queryCache = useQueryCache();
let user = JSON.parse(window.localStorage.getItem('user'));
let history = useHistory();
let ApiURL = 'http://localhost:8080/ShareLoc/api';
let createColocation = colocation => {
let URL = ApiURL + '/colocation/create?name=' + colocation.name;
return fetch(URL, {
method:'POST',
headers: {
'Authorization': 'Bearer ' + window.localStorage.getItem('token'),
}
});
return API.createColocation({name: colocation.name});
};
let fetchColocation = async () =>{
return await API.fetchColocation();
};
let AddColocationForm = () => {
......@@ -38,57 +35,44 @@ let Colocations = () => {
onChange={(e)=>{setName(e.target.value)}}/> <Button as='input' type='submit' value='Add'></Button>
</form>;
};
let fetchColocation = async () =>{
let URL = ApiURL + '/colocation'
let res = await fetch(URL, {
headers: {
'Authorization': 'Bearer ' + window.localStorage.getItem('token')
}
});
return res.json();
};
const {data, status} = useQuery('Colocations', fetchColocation);
if(user != null) {
return <Container>
<br/>
<h1>Colocations</h1>
<br/>
{status === 'loading' && (<div>Loading data...</div>)}
{status === 'error' && (<div>Error fetching data</div>)}
{status === 'success' && (
<>
<AddColocationForm />
<br/>
<ListGroup horizontal>
{data.map((colocation, idx) => {
return <ListGroup.Item key={idx}>
<Card style={{ width: '18rem' }}>
<Card.Body>
<Card.Title>{colocation.name}</Card.Title>
<Card.Text>
Owned by {colocation.administrator.email}
</Card.Text>
{ colocation.administrator.email === user.email ?
<Button variant='danger' onClick={() => history.push('/colocation/' + colocation.id)}>Manage/View</Button> :
<Button variant='primary' onClick={() => history.push('/colocation/' + colocation.id)}>View</Button> }
</Card.Body>
</Card>
</ListGroup.Item>
})}
</ListGroup>
</>
)}
</Container>;
} else {
return <>
return <Container>
<br/>
<h1>Sign in to access this page</h1>
<h1>Colocations</h1>
<br/>
</>;
}
}
{status === 'loading' && (<div>Loading data...</div>)}
{status === 'error' && (<div>Error fetching data</div>)}
{status === 'success' && (
<>
<AddColocationForm />
<br/>
<ListGroup horizontal>
{data.map((colocation, idx) => {
return <ListGroup.Item key={idx}><Colocation colocation={colocation} /></ListGroup.Item>
})}
</ListGroup>
</>
)}
</Container>;
}
let Colocation = ({colocation}) => {
let user = JSON.parse(window.localStorage.getItem('user'));
let history = useHistory();
return <Card style={{ width: '18rem' }}>
<Card.Body>
<Card.Title>{colocation.name}</Card.Title>
<Card.Text>
Owned by {colocation.administrator.email}
</Card.Text>
{ colocation.administrator.email === user.email ?
<Button variant='danger' onClick={() => history.push('/colocation/' + colocation.id)}>Manage/View</Button> :
<Button variant='primary' onClick={() => history.push('/colocation/' + colocation.id)}>View</Button> }
</Card.Body>
</Card>;
}
export default Colocations;
\ No newline at end of file
......@@ -4,46 +4,47 @@ import {ListGroup, Button, Container} from 'react-bootstrap';
import {TextField, Typography} from '@material-ui/core/'
import {useState} from 'react';
import API from './API';
let Details = () => {
const queryCache = useQueryCache();
let user = JSON.parse(window.localStorage.getItem('user'));
let id = parseInt(useParams().id);
let ApiURL = 'http://localhost:8080/ShareLoc/api';
let [error, setError] = useState('');
let [errorMember, setErrorMember] = useState('');
let history = useHistory();
let fetchMembers = async () =>{
let URL = ApiURL + '/colocation/' + id + '/members'
let res = await fetch(URL, {
headers: {
'Authorization': 'Bearer ' + window.localStorage.getItem('token')
}
});
return res.json();
let fetchMembers = async () => {
return await API.fetchMembers({id: id});
};
let fetchServices = async () =>{
return await API.fetchServices({id: id});
};
let createMember = user => {
let URL = ApiURL + '/colocation/' + id + '/members/add?email=' + user.email;
return fetch(URL, {
method:'POST',
headers: {
'Authorization': 'Bearer ' + window.localStorage.getItem('token'),
}
});
return API.createMember({id: id, email: user.email});
};
let createService = service => {
return API.createService({id: id, tilte: service.title, description: service.description, cost: service.cost});
};
let AddMemberForm = () => {
let [email, setEmail] = useState(null);
const [mutationCreate] = useMutation(createMember, {
onSuccess: (data, variables, context) => {
onError: (data) => {
setErrorMember('Error. User doesn\'t exist or is already in colocation');
if(data.status === 404) {
setError('User doesn\'t exist');
setErrorMember('User doesn\'t exist');
}
if(data.status === 409) {
setError('User already in colocation');
setErrorMember('User already in colocation');
}
},
onSuccess: (data) => {
queryCache.invalidateQueries('Members')
}
});
......@@ -53,50 +54,69 @@ let Details = () => {
};
return <form onSubmit={handleSubmit}>
<h4>Add a new member</h4>
<TextField id='email' label='New member email' size='small' variant='outlined'
onChange={(e)=>{setEmail(e.target.value)}}/> <Button as='input' type='submit' value='Add'></Button>
</form>;
};
let AddServiceForm = () => {
let [title, setTitle] = useState(null);
let [description, setDescription] = useState(null);
let [cost, setCost] = useState(null);
const [mutationCreate] = useMutation(createService, {
onSuccess: (data) => {
queryCache.invalidateQueries('Services')
}
});
const handleSubmit = event => {
event.preventDefault();
mutationCreate({ title: title, description: description, cost: cost });
};
return <form onSubmit={handleSubmit}>
<h4>Add a new service</h4>
<TextField id='title' label='New service title' size='small' variant='outlined' onChange={(e)=>{setTitle(e.target.value)}}/><br/>
<TextField id='description' label='New service description' size='small' variant='outlined' onChange={(e)=>{setDescription(e.target.value)}}/><br/>
<TextField id='cost' label='New service cost' size='small' variant='outlined' onChange={(e)=>{setCost(e.target.value)}}/><br/><br/>
<Button as='input' type='submit' value='Add' variant="success"></Button>
</form>;
};
const {data, status} = useQuery('Members', fetchMembers);
const {dataS, statusS} = useQuery('Services', fetchServices);
if(user != null) {
return <Container>
<br/>
<br/>
{status === 'loading' && (<div>Loading data...</div>)}
{status === 'error' && (<div>Error fetching data</div>)}
{status === 'success' && (
<>
<h1>{data[0].colocation.name}</h1>
<h2>Members</h2>
<br/>
{data[0].colocation.administrator.email === user.email && <AddMemberForm />}
<Typography color="error"><br/>{error}</Typography>
<br/>
<ListGroup>
{data.map((member, idx) => {
return <ListGroup.Item key={idx}>
<Typography variant="h6" color="primary">{member.user.email}</Typography>
<Typography color="primary">{member.user.firstName} {member.user.lastName}</Typography>
{member.sold < 0 ?
<Typography color="error">Sold : {member.sold}</Typography> :
<Typography color="primary">Sold : {member.sold}</Typography>
}
</ListGroup.Item>
})}
</ListGroup>
<Button variant='primary' onClick={() => history.push('/colocation/' + id + '/services')}>Services</Button>
</>
)}
</Container>;
} else {
return <>
return <Container>
<br/>
<h1>Sign in to access this page</h1>
<br/>
</>;
}
{status === 'loading' && (<div>Loading data...</div>)}
{status === 'error' && (<div>Error fetching data</div>)}
{status === 'success' && (
<>
<h1>{data[0].colocation.name}</h1>
<br/>
<h2>Members</h2>
<ListGroup>
{data.map((member, idx) => {
return <ListGroup.Item key={idx}>
<Typography variant="h6" color="primary">{member.user.email}</Typography>
<Typography color="primary">{member.user.firstName} {member.user.lastName}</Typography>
{member.sold < 0 ?
<Typography color="error">Sold : {member.sold}</Typography> :
<Typography color="primary">Sold : {member.sold}</Typography>
}
</ListGroup.Item>
})}
</ListGroup>
<br/>
{data[0].colocation.administrator.email === user.email && <AddMemberForm />}
<Typography color="error"><br/>{errorMember}</Typography>
<AddServiceForm />
<br/>
<Button variant='primary' onClick={() => history.push('/colocation/' + id + '/services')}>Services history</Button> <Button variant='primary' onClick={() => history.push('/colocation/' + id + '/requestedServices')}>Requested Services</Button>
</>
)}
</Container>;
}
export default Details;
import {useQuery, useQueryCache} from 'react-query';
import {useParams, useHistory} from 'react-router-dom';
import {ListGroup, Container, Button} from 'react-bootstrap';
import {Typography} from '@material-ui/core/'
import {useEffect, useState} from 'react';
import API from './API';
let RequestedServices = () => {
const queryCache = useQueryCache();
const history = useHistory();
let id = parseInt(useParams().id);
let fetchServices = async () => {
return await API.fetchServices({id: id});
};
const {data, status} = useQuery('RequestedServices', fetchServices);
return <Container>
<br/>
<h2>Services votes</h2>
<br/>
{status === 'loading' && (<div>Loading data...</div>)}
{status === 'error' && (<div>Error fetching data</div>)}
{status === 'success' && (
<>
<ListGroup>
{data.map((requestedService, idx) => {
return <ListGroup.Item key={idx}><RequestedService requestedService={requestedService} /></ListGroup.Item>
})}
</ListGroup>
</>
)}
<br/>
<Button variant='primary' onClick={() => history.push('/colocation/' + id)}>Back to colocation</Button>
</Container>;
}
let RequestedService = ({requestedService}) => {
let [vote, setVote] = useState(null);
let id = parseInt(useParams().id);
useEffect(() => {
API.alreadyVoted({idColoc: id, idService: requestedService.id})
.then(data => setVote(data));
}, [id, requestedService.id]);
return <>
<Typography variant="h6" color="primary">{requestedService.service.title}</Typography>
<Typography variant="overline" color="primary">Asked by {requestedService.service.askedBy.email}</Typography>
<br/>
{requestedService.validating ?
<Typography variant="overline" color="primary">To validate</Typography> :
<>{requestedService.adding ?
<Typography variant="overline">To add</Typography> :
<Typography variant="overline" color="error">To delete</Typography>
}</>}
<br/>
<Typography>{requestedService.service.description}</Typography>
<br/>
{vote != null ?
vote ?
<p>Already voted</p> :
// <><Button variant="success" onClick={() => voteForRequestedService(true)}>Add</Button> <Button variant="danger" onClick={() => voteForRequestedService(false)}>Decline</Button></>
<p>Vote here !</p> :
null
}
</>
}
export default RequestedServices;
import {useQuery, useMutation, useQueryCache} from 'react-query';
import {useParams} from 'react-router-dom';
import {ListGroup, Button, Container} from 'react-bootstrap';
import {TextField, Typography} from '@material-ui/core/'
import {useState} from 'react';
let Services = () => {
const queryCache = useQueryCache();
let user = JSON.parse(window.localStorage.getItem('user'));
let id = parseInt(useParams().id);
let ApiURL = 'http://localhost:8080/ShareLoc/api';
let [error, setError] = useState('');
let fetchColocation = async () =>{
let URL = ApiURL + '/colocation' + id;
let res = await fetch(URL, {
headers: {
'Authorization': 'Bearer ' + window.localStorage.getItem('token')
}
});
return res.json();
};
let fetchServices = async () =>{
let URL = ApiURL + '/colocation/' + id + '/services'
let res = await fetch(URL, {
headers: {
'Authorization': 'Bearer ' + window.localStorage.getItem('token')
}
});
return res.json();
};
let createService = user => {
let URL = ApiURL + '/colocation/' + id + '/services/add?email=' + user.email;
return fetch(URL, {
method:'POST',
headers: {
'Authorization': 'Bearer ' + window.localStorage.getItem('token'),
}
});
};
// let AddServiceForm = () => {
// let [email, setEmail] = useState(null);
// const [mutationCreate] = useMutation(createService, {
// onSuccess: (data, variables, context) => {
// if(data.status === 404) {
// setError('User doesn\'t exist');
// }
// if(data.status === 409) {
// setError('User already in colocation');