import React from 'react'

import { EyeOutlined } from '@ant-design/icons'

import { IProductInteriorItem } from 'Personal/Personal.service'
import styles from '../css/ItemComponent.module.scss'
export interface IProductInteriorCardProps {
  item: IProductInteriorItem
  title?: string // 标红的标题
}
/**产品内测组件 */
const ProductInteriorCard: React.FC<IProductInteriorCardProps> = props => {
  const { item, title } = props
  const handleToDetail = () => {
    window.open(`/internal/article/${item.ProductInteriorId}`)
  }
  if (!item) return null
  return (
    <div className={styles['item-article']} onClick={handleToDetail}>
      <div className="item-article-title">
        <div
          className="item-article-title-content"
          dangerouslySetInnerHTML={{
            __html: title || item.Title
          }}
        />
      </div>
      <div className={`item-article-annotation line-seven`}>
        <div dangerouslySetInnerHTML={{ __html: item.Body }} />
      </div>
      <div className="item-time-right item-article-flex">
        <div className="item-article-pv">
          <EyeOutlined size={14} className="pv-icon" />
          <span>{item.Pv || 0}</span>
        </div>
        <div className="item-article-publistdate">{item.PublishTime}</div>
      </div>
    </div>
  )
}

export default ProductInteriorCard
