Skip to content
Snippets Groups Projects

Update admin system

Closed Update admin system
Update_Admin_System into sistema_admin
Closed
lfr20requested to merge
Update_Admin_System into sistema_admin
Viewing commit db7942c7
Prev Next
Show latest version
1 file
+ 49
− 45
Compare changes
  • Side-by-side
  • Inline
src/Components/ContactCard.js
+ 49
− 45
@@ -16,7 +16,7 @@ GNU Affero General Public License for more details.
@@ -16,7 +16,7 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
import React, {useState} from 'react';
import React, { useState, useEffect } from 'react';
import Card from '@material-ui/core/Card';
import Card from '@material-ui/core/Card';
import CardContent from '@material-ui/core/CardContent';
import CardContent from '@material-ui/core/CardContent';
import noAvatar from "../img/default_profile.png";
import noAvatar from "../img/default_profile.png";
@@ -26,27 +26,31 @@ import Options from './ContactCardOptions.js'
@@ -26,27 +26,31 @@ import Options from './ContactCardOptions.js'
import FollowButton from './ContactButtons/FollowButton.js'
import FollowButton from './ContactButtons/FollowButton.js'
import FollowingButton from './ContactButtons/FollowingButton.js'
import FollowingButton from './ContactButtons/FollowingButton.js'
import FollowersCountButton from './ContactButtons/FollowersCountButton.js'
import FollowersCountButton from './ContactButtons/FollowersCountButton.js'
import {Link} from 'react-router-dom';
import { Link } from 'react-router-dom';
import Skeleton from '@material-ui/lab/Skeleton';
export default function ImgMediaCard(props) {
export default function ImgMediaCard(props) {
const [followedBoolean, setFollowedBoolean] = useState(props.followed)
const [followedBoolean, setFollowedBoolean] = useState(props.followed)
const toggleFollowed = () => {setFollowedBoolean(!followedBoolean)}
const toggleFollowed = () => { setFollowedBoolean(!followedBoolean) }
return (
const [avatar, setAvatar] = useState(props.avatar ? props.avatar : noAvatar);
 
 
return (
<StyledCard>
<StyledCard>
<CardDiv>
<CardDiv>
<CardAreaDiv>
<CardAreaDiv>
{/*Top part of contat card (background image, number of followers and avatar)*/}
{/*Top part of contat card (background image, number of followers and avatar)*/}
<Header>
<Header>
<StyledCardMedia image={props.cover}>
<StyledCardMedia image={props.cover}>
<div style = {{display : "flex", backgroundColor : "inherit", float : "right"}}>
<div style={{ display: "flex", backgroundColor: "inherit", float: "right" }}>
<Link to={props.href}>
<Link to={props.href}>
<FollowersCountButton followCount={props.follow_count}/>
<FollowersCountButton followCount={props.follow_count} />
</Link>
</Link>
<AvatarDiv>
<AvatarDiv>
<img src={props.avatar ? props.avatar : noAvatar} alt='user avatar'
<img src={avatar} alt='user avatar'
style={{height : "100%", width : "100%", borderRadius : "50%"}}/>
style={{ height: "100%", width: "100%", borderRadius: "50%" }}
 
onError={() => setAvatar(noAvatar)}
 
/>
</AvatarDiv>
</AvatarDiv>
</div>
</div>
</StyledCardMedia>
</StyledCardMedia>
@@ -62,48 +66,48 @@ export default function ImgMediaCard(props) {
@@ -62,48 +66,48 @@ export default function ImgMediaCard(props) {
</Link>
</Link>
<Link to={props.href}>
<Link to={props.href}>
<span style={{fontSize : "14px", fontWeight : "normal"}}>
<span style={{ fontSize: "14px", fontWeight: "normal" }}>
<b>{props.numCollections}</b> {props.numCollections !== 1? "Coleções" : "Coleção"} | <b>{props.numLearningObjects}</b> {props.numLearningObjects !== 1? "Recursos" : "Recurso"}
<b>{props.numCollections}</b> {props.numCollections !== 1 ? "Coleções" : "Coleção"} | <b>{props.numLearningObjects}</b> {props.numLearningObjects !== 1 ? "Recursos" : "Recurso"}
</span>
</span>
</Link>
</Link>
<div style={{display : "flex", justifyContent : "center"}}>
<div style={{ display: "flex", justifyContent: "center" }}>
{
{
followedBoolean ?
followedBoolean ?
(
(
<React.Fragment>
<React.Fragment>
<FollowingButton
<FollowingButton
followedID={props.followerID ? props.followerID : props.followedID}
followedID={props.followerID ? props.followerID : props.followedID}
toggleFollowed={toggleFollowed}/>
toggleFollowed={toggleFollowed} />
<Options
<Options
followableID={props.followerID ? props.followerID : props.followedID}
followableID={props.followerID ? props.followerID : props.followedID}
followed={followedBoolean}
followed={followedBoolean}
toggleFollowed={toggleFollowed}/>
toggleFollowed={toggleFollowed} />
</React.Fragment>
</React.Fragment>
)
)
:
:
(
(
<React.Fragment>
<React.Fragment>
<FollowButton
<FollowButton
followerID={props.followedID ? props.followedID : props.followerID}
followerID={props.followedID ? props.followedID : props.followerID}
toggleFollowed={toggleFollowed}/>
toggleFollowed={toggleFollowed} />
<Options
<Options
followableID={props.followedID ? props.followedID : props.followerID}
followableID={props.followedID ? props.followedID : props.followerID}
followed={followedBoolean}
followed={followedBoolean}
toggleFollowed={toggleFollowed}/>
toggleFollowed={toggleFollowed} />
</React.Fragment>
</React.Fragment>
)
)
}
}
</div>
</div>
</UserInfo>
</UserInfo>
</CardContent>
</CardContent>
</CardAreaDiv>
</CardAreaDiv>
</CardDiv>
</CardDiv>
</StyledCard>
</StyledCard>
);
);
}
}
/*Controls top part of Card*/
/*Controls top part of Card*/
@@ -132,7 +136,7 @@ export const CardDiv = styled.div`
@@ -132,7 +136,7 @@ export const CardDiv = styled.div`
/*Override Material UI styling -----------------------------------------------*/
/*Override Material UI styling -----------------------------------------------*/
const StyledCardMedia = styled(CardMedia) `
const StyledCardMedia = styled(CardMedia)`
height : 100%;
height : 100%;
width : 100%;
width : 100%;
background-size : cover;
background-size : cover;