67 lines
1.8 KiB
JavaScript
67 lines
1.8 KiB
JavaScript
import React, { useState, useEffect } from "react";
|
||
import logo from "../image/radius.png";
|
||
import { FlexAJ, P } from "../css/layout";
|
||
import { Link } from "react-router-dom";
|
||
import styled from "styled-components";
|
||
|
||
const Img = styled.img`
|
||
{
|
||
width: 60px;
|
||
height: 60px;
|
||
border-radius: 50%;
|
||
margin-right: 25px;
|
||
}
|
||
`;
|
||
|
||
const Prag = styled.p`
|
||
{
|
||
color: #333;
|
||
font-size: 14px;
|
||
line-height: 18px;
|
||
margin-bottom: 10px;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
display: -webkit-box;
|
||
-webkit-line-clamp: 1;
|
||
-webkit-box-orient: vertical;
|
||
word-break: break-all;
|
||
height:18px;
|
||
}
|
||
`;
|
||
|
||
export default (props) => {
|
||
const list = props.plate;
|
||
|
||
return (
|
||
<div className="doubleItems">
|
||
{list && list.length > 0
|
||
? list.map((item, key) => {
|
||
return (
|
||
<Link
|
||
to={`/forums/theme/${item.id}`}
|
||
style={{
|
||
borderBottom:
|
||
key === list.length - 2 && list.length % 2 === 0
|
||
? "none"
|
||
: "",
|
||
}}
|
||
>
|
||
<Img src={item && item.picture ? item.picture : logo} />
|
||
<div className="flex1"style={{width:"0"}}>
|
||
<div style={{display:"flex"}}>
|
||
<P style={{maxWidth:"370px"}}>{item.title}</P>
|
||
<span className="ml15" style={{fontSize:"14px",color:"#999"}}>帖子数：{item.memos_count}</span>
|
||
</div>
|
||
<Prag>{item.description || <span className="grey-9">暂无描述~</span>}</Prag>
|
||
<FlexAJ style={{ fontSize: "12px" }}>
|
||
<span>版主：{item.user_name}</span>
|
||
</FlexAJ>
|
||
</div>
|
||
</Link>
|
||
);
|
||
})
|
||
: ""}
|
||
</div>
|
||
);
|
||
};
|