import useNewToken from "@/Hook/useNewToken"
import { Col, Row, Typography } from "antd"
import style from './index.less'

export interface ContentProps {
    url: string,
    title: string,
    cover: string,
    desc: string
}
export interface LinkNewsProps {
    content: ContentProps,
    isBlank?: boolean,   // 是否可跳转
    width?: string | number
}
/**
 * 消息链接
 * @param param0 
 */
const LinkNews: React.FC<LinkNewsProps> = ({ content, isBlank, width }) => {

    /**************************/
    const { url, title, cover, desc } = content
    const { token } = useNewToken()
    /**************************/

    return <div
        className={style.linkNews}
        style={{
            backgroundColor: token.colorBgContainer,
            borderRadius: token.borderRadius,
            border: `1px solid ${token.colorBorder}`,
            width: width
        }}
        onClick={() => {
            if (isBlank && url) {
                window.open(url, '_blank')
            }
        }}
    >
        <Typography.Paragraph strong ellipsis={{ rows: 2 }}>{title}</Typography.Paragraph>
        <Row align={'middle'} gutter={5}>
            <Col flex="auto" style={{ width: 'calc(100% - 53px)' }}><Typography.Paragraph type="secondary" ellipsis={{ rows: 2 }}>{desc}</Typography.Paragraph></Col>
            <Col flex="46px"><img src={cover} width={46} height={46} /></Col>
        </Row>
    </div>
}


export default LinkNews