forgeplus-react/src/forge/Component/MemberCards.jsx

61 lines
1.5 KiB
JavaScript

import React from 'react';
import './Component.scss';
import { Button } from 'antd';
import styled from 'styled-components';
import FocusButton from "../UsersList/focus_button";
import { getImageUrl } from 'educoder';
import { Link } from 'react-router-dom';
const Img = styled.img`{
border-radius:50%;
width:50px;
height:50px;
margin-right:14px;
}`
const Name = styled.div`{
color:#5091FF;
font-size:16px;
height:22px;
line-height:22px;
margin-bottom:7px;
}`
const Time = styled.div`{
color:#888;
font-size:12px;
height:16px;
line-height:16px;
margin-bottom:9px;
display:flex;
align-item:center;
}`
const I = styled.i`{
font-size:13px!important;
color:#60B25E;
margin-right:2px;
height:17px;
line-height:17px;
}`
const Div = styled.div`{
margin-bottom: 18px;
padding:20px 16px;
display: flex;
align-items: center;
border:1px solid #eee;
}`
export default (({ user , img, name, time, focusStatus, is_current_user, login , successFunc }) => {
return (
<Div>
<Link to={`/users/${user && user.login}`}><Img src={getImageUrl(`/${img}`)} /></Link>
<div className="m-infos">
<Link to={`/users/${user && user.login}`}><Name>{name}</Name></Link>
<Time><I className="iconfont icon-shijian"></I>:{time}</Time>
{
is_current_user ?
<Button type="default">当前用户</Button>
:
<FocusButton is_watch={focusStatus} id={login} successFunc={successFunc}/>
}
</div>
</Div>
)
})