From 4e5475f9b186a672a0bf417e63fd29eb0edbd934 Mon Sep 17 00:00:00 2001
From: Raul Almeida <haltsimog@gmail.com>
Date: Fri, 27 Mar 2020 11:58:38 -0300
Subject: [PATCH] Replace placeholders with actual functionality
AchievementDescriptionCard isn't just dummy text anymore; it works
with actual parameters passed by his parent TabPanel.
The tabpanel itself doesn't get information from the API yet.
---
src/Components/AchievementDescriptionCard.js | 18 ++---
.../TabPanels/TabPanelStatusEConquistas.js | 81 +++++++++++--------
2 files changed, 55 insertions(+), 44 deletions(-)
diff --git a/src/Components/AchievementDescriptionCard.js b/src/Components/AchievementDescriptionCard.js
index 58eb3a17..3af102fe 100644
--- a/src/Components/AchievementDescriptionCard.js
+++ b/src/Components/AchievementDescriptionCard.js
@@ -6,25 +6,19 @@ import { Grid } from '@material-ui/core'
import RequirementDialog from './RequirementsDialog.js';
export default function AchievementDescriptionCard(props) {
- var teste = [
- {name: "Casas", description: "Construa três casas"},
- {name: "Carros", description: "Dirija três carros"},
- {name: "Esportes", description: "Pratique três esportes"},
- {name: "Noites", description: "Sobreviva a três noites"}
- ];
return (
<Paper elevation={3}>
<Grid container direction="row" justify="space-around" alignItems="center">
<Grid item xs={3}>
- <AchievementImg src={props.src ? props.src : "https://material-ui.com/static/images/grid/complex.jpg"}/>
+ <AchievementImg src={props.src}/>
</Grid>
<Grid item xs={7}>
- <AchievementTitle>{props.title ? props.title : "Conquistador de conquistas"}</AchievementTitle>
- <AchievementDescription>{props.description ? props.description : "Conquiste conquistas"}</AchievementDescription>
+ <AchievementTitle>{props.title}</AchievementTitle>
+ <AchievementDescription>{props.description}</AchievementDescription>
<RequirementDialog
- title="Conquistador de conquistas"
- description="Conquiste conquistas"
- requirements={teste}
+ title={props.title}
+ description={props.description}
+ requirements={props.requirements}
/>
</Grid>
</Grid>
diff --git a/src/Components/TabPanels/TabPanelStatusEConquistas.js b/src/Components/TabPanels/TabPanelStatusEConquistas.js
index be46d532..b90d79c6 100644
--- a/src/Components/TabPanels/TabPanelStatusEConquistas.js
+++ b/src/Components/TabPanels/TabPanelStatusEConquistas.js
@@ -14,42 +14,59 @@ import AchievementDescriptionCard from '../AchievementDescriptionCard.js'
import { Grid } from '@material-ui/core'
export default function TabPanelStatusEConquistas (props) {
- return (
- <div>
- <ContainerDivStyled>
- <Paper elevation={3}>
- <LevelDescriptionCard/>
- </Paper>
- </ContainerDivStyled>
- <AchievementsContainer>
- <AchievementsSectionTitle>
- Conquistas
- </AchievementsSectionTitle>
- <AchievementsList>
- <Grid container direction="row" justify="space-around" alignItems="center">
- <Grid item xs={12} md={5}>
- <AchievementDescriptionCard/>
- </Grid>
- <Grid item xs={12} md={5}>
- <AchievementDescriptionCard/>
- </Grid>
- </Grid>
- </AchievementsList>
- </AchievementsContainer>
- </div>
- );
+ const [achievements, setAchievements] = useState([]);
+
+ useEffect(() => {
+ axios.get(`https://api.portalmec.c3sl.ufpr.br/v1/users/1`)
+ .then(res => {
+ const achievements = res.data;
+ console.log("Teste");
+ console.log(achievements);
+ //this.setAchievements(achievements);
+ })
+ }, [])
+
+ return (
+ <div>
+ <ContainerDivStyled>
+ <Paper elevation={3}>
+ <LevelDescriptionCard/>
+ </Paper>
+ </ContainerDivStyled>
+ <AchievementsContainer>
+ <AchievementsSectionTitle>
+ Conquistas
+ </AchievementsSectionTitle>
+ <AchievementsList>
+ <Grid container direction="row" justify="space-around" alignItems="center">
+ {achievements.map(
+ (a) => { return (
+ <Grid item xs={12} md={5}>
+ <AchievementDescriptionCard
+ title={a.title}
+ description={a.description}
+ src={a.imgsrc}
+ requirements={a.requirements} />
+ //requirements={[{name: "teste", description: "teste"}]}/>
+ </Grid>
+ )}
+ )}
+ </Grid>
+ </AchievementsList>
+ </AchievementsContainer>
+ </div>
+ );
}
const AchievementsSectionTitle = styled.h1`
- font-weight: 400;
+ font-weight: 400;
`
const AchievementsContainer = styled.div`
- max-width : 1140px;
- margin-left : auto;
- margin-right : auto;
- margin-left : 20em;
- margin-bottom: 30px;
- margin-top: 70px;
+ max-width : 1140px;
+ margin-left : auto;
+ margin-right : auto;
+ margin-bottom: 30px;
+ margin-top: 70px;
`
const AchievementsList = styled.div`
-`
\ No newline at end of file
+`
--
GitLab