Skip to content
GitLab
Commit 21a3e06f authored by Martin Bebjak's avatar Martin Bebjak Committed by Jiri Novotny
Browse files

Add missionsList

parent 03e4e4b7
Hide whitespace changes
Inline Side-by-side
ssa-frontend/secret_service_archive/src/App.css
View file @ 21a3e06f
......@@ -37,8 +37,15 @@
}
.agentList {
flex-direction: row;
display: flex;
flex-direction: column;
align-items: center;
}
.missionsList {
display: flex;
flex-direction: column;
align-items: center;
}
.searchBar {
......
ssa-frontend/secret_service_archive/src/components/Agent.tsx
View file @ 21a3e06f
import Button from '@mui/material/Button';
import { Card, ListGroup } from 'react-bootstrap';
import { Card, ListGroup,Row, Col } from 'react-bootstrap';
import serviceImage from './resources/secretservice.png';
import { Link } from 'react-router-dom';
export function Agent (props: any){
return(
// <div>
// <img src="https://gitlab.fi.muni.cz/uploads/-/system/project/avatar/23694/271616313_907488703256129_299855329059077184_n.png?width=64"></img>
// <h3 className="codeName">{ props.codeName }</h3>
// <div className="skills">
// <h4>Skills</h4>
// { props.skills.map((skill: any) => {
// return(
// <p>{ skill.description }</p>
// )
// })}
// </div>
// <div>
// <h4>Trainings</h4>
// { props.trainings.map((training: any) => {
// return(
// <p> { training.description } </p>
// )
// })}
// </div>
// <Button component={Link} to={"/agent/" + props.agentId}>Got to agent</Button>
// </div>
<Card>
<Card style={{ width: '80%', marginTop:"1rem"}}>
<Card.Header as="h5">
<img src={ serviceImage } width="40px" height="40px"/>
{ props.codeName }
</Card.Header>
<Card.Body>
<ListGroup horizontal>
<ListGroup.Item>
<strong>Skills</strong>
<ListGroup horizontal>
<ListGroup.Item>
<strong>Languages</strong>
<ListGroup variant="flush">
<Row>
<Col>
<Card.Title>Skills</Card.Title>
<Row>
<Col>
<Card.Subtitle className="mb-2 text-muted">Language</Card.Subtitle>
<ListGroup variant="flush">
{ props.skills.filter((skill: any) => skill.type === "LANGUAGE").map((skill: any) => {
return(
<ListGroup.Item>{ skill.name }</ListGroup.Item>
)
})}
</ListGroup>
</ListGroup.Item>
<ListGroup.Item>
<strong>Weapons</strong>
<ListGroup variant="flush">
</ListGroup>
</Col>
<Col>
<Card.Subtitle className="mb-2 text-muted">Weapon</Card.Subtitle>
<ListGroup variant="flush">
{ props.skills.filter((skill: any) => skill.type === "WEAPON").map((skill: any) => {
return(
<ListGroup.Item>{ skill.name }</ListGroup.Item>
)
})}
</ListGroup>
</ListGroup.Item>
</ListGroup>
</ListGroup.Item>
<ListGroup.Item>
<strong>Trainings</strong>
<ListGroup horizontal>
<ListGroup.Item>
<strong>Easy</strong>
</ListGroup>
</Col>
</Row>
</Col>
<Col>
<Card.Title>Trainings</Card.Title>
<Row>
<Col>
<Card.Subtitle className="mb-2 text-muted">Basic</Card.Subtitle>
<ListGroup variant="flush">
{ props.trainings.filter((training: any) => training.difficulty === "EASY").map((training: any) => {
return(
<ListGroup.Item>{ training.name }</ListGroup.Item>
)
})}
</ListGroup>
</ListGroup.Item>
<ListGroup.Item>
<strong>Medium</strong>
{ props.trainings.filter((training: any) => training.difficulty === "EASY").map((training: any) => {
return(
<ListGroup.Item>{ training.name }</ListGroup.Item>
)
})}
</ListGroup>
</Col>
<Col>
<Card.Subtitle className="mb-2 text-muted">Intermediate</Card.Subtitle>
<ListGroup variant="flush">
{ props.trainings.filter((training: any) => training.difficulty === "MEDIUM").map((training: any) => {
return(
<ListGroup.Item>{ training.name }</ListGroup.Item>
)
})}
{ props.trainings.filter((training: any) => training.difficulty === "MEDIUM").map((training: any) => {
return(
<ListGroup.Item>{ training.name }</ListGroup.Item>
)
})}
</ListGroup>
</ListGroup.Item>
<ListGroup.Item>
<strong>Hard</strong>
</Col>
<Col>
<Card.Subtitle className="mb-2 text-muted">Advanced</Card.Subtitle>
<ListGroup variant="flush">
{ props.trainings.filter((training: any) => training.difficulty === "HARD").map((training: any) => {
return(
<ListGroup.Item>{ training.name }</ListGroup.Item>
)
})}
{ props.trainings.filter((training: any) => training.difficulty === "HARD").map((training: any) => {
return(
<ListGroup.Item>{ training.name }</ListGroup.Item>
)
})}
</ListGroup>
</ListGroup.Item>
</ListGroup>
</ListGroup.Item>
</ListGroup>
</Col>
</Row>
</Col>
</Row>
<Button component={Link} to={"/agent/" + props.agentId}>Got to agent</Button>
</Card.Body>
</Card>
)
}
\ No newline at end of file
ssa-frontend/secret_service_archive/src/components/AgentsList.tsx
View file @ 21a3e06f
......@@ -25,8 +25,8 @@ export function AgentsList () {
)
} else {
return(
<div>
{ agents.map((agent: any) => {
<div className="agentList" >
{ agents.data.map((agent: any) => {
return(
<Agent codeName={ agent.codeName }
skills={ agent.skills }
......
ssa-frontend/secret_service_archive/src/components/FindAvailableAgents.tsx
View file @ 21a3e06f
......@@ -6,13 +6,13 @@ import { Agent } from './Agent'
export function FindAvailableAgents() {
const [result, setResult] = useState<any>([]);
const [result, setResult] = useState<any>({data: []});
const [picked, setPicked] = useState<any>({
country: null,
skill: null
})
const [countries, setCountries] = useState<any>(null)
const [skills, setSkills] = useState<any>(null)
const [countries, setCountries] = useState<any>({data: null})
const [skills, setSkills] = useState<any>({data: null})
const searchForAgent = useCallback (()=>{
if (picked.country !== null && (picked.skill === null || picked.skill === '')) {
......@@ -43,12 +43,12 @@ export function FindAvailableAgents() {
}
if (!(picked.skill !== null || picked.skill !== '') && !(picked.country !== null && picked.country !== '')) {
console.log("none");
setResult([]);
setResult({data: []});
}
},[picked]);
useEffect(() => {
axios.get(`/agents/allSkills?page=1&pageSize=0`)
axios.get(`/agents/allSkills?page=0&pageSize=0`)
.then(res => {
const skillsData = res.data;
setSkills(skillsData);
......@@ -63,7 +63,7 @@ export function FindAvailableAgents() {
if (skills === null && countries === null) {
if (skills.data === null && countries.data === null) {
return(
<h1>Loading....</h1>
)
......@@ -74,7 +74,7 @@ export function FindAvailableAgents() {
<Combobox
onChange={ value => {setPicked({country: value, skill: picked.skill})} }
hideCaret
data={ countries }
data={ countries.data }
dataKey='id'
textField='name'
placeholder="Choose a country"/>
......@@ -82,7 +82,7 @@ export function FindAvailableAgents() {
onChange={ value => {setPicked({country: picked.country, skill: value})} }
hideCaret
hideEmptyPopup
data={ skills }
data={ skills.data }
dataKey='id'
textField='description'
placeholder="Choose a skill"/>
......@@ -90,8 +90,8 @@ export function FindAvailableAgents() {
searchForAgent()
} }>Search</button>
</div>
<div>
{ result.map((agent: any) => {
<div className="agentList">
{ result.data.map((agent: any) => {
return(
<Agent codeName={ agent.codeName }
skills={ agent.skills }
......
ssa-frontend/secret_service_archive/src/components/Mission.tsx
View file @ 21a3e06f
import Button from '@mui/material/Button';
import { Card, ListGroup,Row, Col } from 'react-bootstrap';
import { Link } from 'react-router-dom';
export function Mission (props: any){
return(
<div>
<p className="codeName">{ props.codeName }</p>
<div>
<p>{ props.startDate }</p>
<p>{ props.endDate }</p>
</div>
// <div>
// <p className="codeName">{ props.codeName }</p>
// <div>
// <p>{ props.startDate }</p>
// <p>{ props.endDate }</p>
// </div>
// <Button component={Link} to={"/mission/" + props.missionId}>Got to mission</Button>
// </div>
<Card bg='Light'
key='Light'
text='dark'
className="mb-2"
style={{ width: '40%', marginTop: '1rem' }}>
<Row style={{ marginTop:'1rem'}}>
<Col md="auto">
<Card.Img src={ props.countryFlag } style={{ marginLeft: '1rem' }} alt="Card image" />
</Col>
<Col>
<Card.Title>{ props.codeName}</Card.Title>
<Card.Text>
{props.objectives}
</Card.Text>
</Col>
</Row>
<Row style={{ marginTop: '2rem'}}>
<Col>
<Card.Subtitle className="mb-2">Start Date</Card.Subtitle>
<Card.Text>
{props.startDate}
</Card.Text>
</Col>
<Col>
<Card.Subtitle className="mb-2 ">Duration</Card.Subtitle>
<Card.Text>
{props.duration} days
</Card.Text>
</Col>
<Col>
<Card.Subtitle className="mb-2 ">Agents</Card.Subtitle>
<Card.Text>
{props.agentsCount}
</Card.Text>
</Col>
</Row>
<Button component={Link} to={"/mission/" + props.missionId}>Got to mission</Button>
</div>
</Card>
)
}
\ No newline at end of file
ssa-frontend/secret_service_archive/src/components/MissionsList.tsx
View file @ 21a3e06f
import React, { useState, useEffect } from 'react';
import axios from 'axios';
import { Mission } from './Mission'
export function MissionsList () {
return(
<div>
<ul>
<li>Finish him</li>
<li>Dokonalé Éčko</li>
<li>Put it all the .... </li>
<li>Fake summer vacation</li>
<li>Bobrík z pripravovania táborov is beeter than no bobrík a dokončená java</li>
</ul>
</div>
)
const [missions, setMissions] = useState<any>(null);
const [page, setPage] = useState(0);
useEffect(() => {
axios.get(`/missions/allMissions?page=` + page + `&pageSize=20`)
.then(res => {
const agentData = res.data;
setMissions(agentData);
});
console.log(missions)
},[]);
if (missions === null) {
return(
<div>
<h1>Loading ......</h1>
</div>
)
} else {
return(
<div className="missionsList" >
{ missions.data.map((mission: any) => {
return(
<Mission codeName={ mission.codeName }
startDate={ mission.startDate }
duration={ mission.durationDays }
objectives={ mission.objectives }
countryFlag={ mission.countryDto.flag }
agentsCount={ mission.agentCount }
missionId={ mission.id }/>
);
}) }
</div>
)
}
}
\ No newline at end of file
ssa-rest/src/main/resources/data.sql
View file @ 21a3e06f
INSERT INTO
Country(
name, population, area, capital_coordinates, continent, flag, gdp)
VALUES ('Slovakia', 5459000, 49034, '48.1486° N, 17.1077° E', 0, 'xxx', 104600000000),
('Switzerland', 8637000, 41285, '46.9480° N, 7.4474° E', 0, 'xxx', 748000000000),
('China', 1402000000, 9597000, '39.9042° N, 116.4074° E', 1, 'xxx', 14720000000000),
('Mongolia', 3278000, 1564000, '47.8864° N, 106.9057° E', 1, 'xxx', 13140000000),
('Niger', 24210000, 1267000, '13.5116° N, 2.1254° E', 2, 'xxx', 13680000000),
('Chad', 16430000, 1284000, '12.1348° N, 15.0557° E', 2, 'xxx', 10090000000),
('United Sates', 329500000, 9834000, '38.9072° N, 77.0369° W', 3, 'xxx', 20940000000000),
('Canada', 38010000, 9985000, '45.4215° N, 75.6972° W', 3, 'xxx', 1670000000000),
('Colombia', 50880000, 1142000, '4.7110° N, 74.0721° W', 4, 'xxx', 271300000000),
('Argentina', 45380000, 2780000, '34.6037° S, 58.3816° W', 4, 'xxx', 383100000000);
VALUES ('Slovakia', 5459000, 49034, '48.1486° N, 17.1077° E', 0, 'https://www.worldometers.info/img/flags/small/tn_lo-flag.gif', 104600000000),
('Switzerland', 8637000, 41285, '46.9480° N, 7.4474° E', 0, 'https://www.worldometers.info/img/flags/small/tn_sz-flag.gif', 748000000000),
('China', 1402000000, 9597000, '39.9042° N, 116.4074° E', 1, 'https://www.worldometers.info/img/flags/small/tn_ch-flag.gif', 14720000000000),
('Mongolia', 3278000, 1564000, '47.8864° N, 106.9057° E', 1, 'https://www.worldometers.info/img/flags/small/tn_mg-flag.gif', 13140000000),
('Niger', 24210000, 1267000, '13.5116° N, 2.1254° E', 2, 'https://www.worldometers.info/img/flags/small/tn_ng-flag.gif', 13680000000),
('Chad', 16430000, 1284000, '12.1348° N, 15.0557° E', 2, 'https://www.worldometers.info/img/flags/small/tn_cd-flag.gif', 10090000000),
('United Sates', 329500000, 9834000, '38.9072° N, 77.0369° W', 3, 'https://www.worldometers.info/img/flags/small/tn_us-flag.gif', 20940000000000),
('Canada', 38010000, 9985000, '45.4215° N, 75.6972° W', 3, 'https://www.worldometers.info/img/flags/small/tn_ca-flag.gif', 1670000000000),
('Colombia', 50880000, 1142000, '4.7110° N, 74.0721° W', 4, 'https://www.worldometers.info/img/flags/small/tn_co-flag.gif', 271300000000),
('Argentina', 45380000, 2780000, '34.6037° S, 58.3816° W', 4, 'https://www.worldometers.info/img/flags/small/tn_ar-flag.gif', 383100000000);
INSERT INTO
Agent(
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment