import React, { Component } from 'react'
import PropTypes from 'prop-types'
import styled from 'styled-components'

const Div = styled.div`
    width: 100%;
    height:100%;
    
`
const Img = styled.img`
    margin: 0 auto;
    display:block;
    width: 104px;
    height:102px; 
`
const P = styled.p`
    text-align: center;
    color: #999;
    margin-top:1rem;
    
`
const Empty = (props) => {
    let { title,theme,img } = props
    if(img){
        return <Div>
            {img}
            <P>
                { title }
            </P>
        </Div>
    }else{
        return <Div>
            {
                theme == 'dark'  ?
                    <Img src={require("./empty-dark.png")} alt="empty-dark" />
                    :
                    <Img src={require("./empty.png")} alt="empty" />
            }
            <P>
                { title }
            </P>
        </Div>
    }
}
Empty.propTypes = {
    /**图片下面的文字 */
    title: PropTypes.string.isRequired,
}
Empty.defaultProps = {
    title: `没有内容？快点去添加呀`,
}


export default Empty