import Taro from '@tarojs/taro'
import { View, Image, Text } from '@tarojs/components'

import classNames from 'classnames'
import PropTypes, { InferProps } from 'prop-types'
import CtsComponent from '../../common/component'
import { CtsNoDataProps } from 'types/no-data'

/**
 * 列表无数据组件
 */
export default class CtsNoData extends CtsComponent<CtsNoDataProps> {
  // static options = {
  //   addGlobalClass: true
  // }

  public static defaultProps: CtsNoDataProps
  public static propTypes: InferProps<CtsNoDataProps>

  public constructor(props: CtsNoDataProps) { 
    super(props)
    this.state = {}
  }

  public render(): JSX.Element {
    const { className, imgSrc, title, note } = this.props
    return ( 
      <View className={classNames('cts-nodata', className)}>
        <Image className='nodata-img' src={imgSrc} mode='widthFix' />
        {
          title &&
          <View className='nodata-title'>{title}</View>
        }
        {
          note &&
          <View className='nodata-note'><Text>{note}</Text></View>
        }
        {this.props.children}
      </View>
    )
  }
}

CtsNoData.defaultProps = {
  imgSrc: '',
  title: '',
  note: ''
}

CtsNoData.propTypes = {
  imgSrc: PropTypes.string,
  title: PropTypes.string,
  note: PropTypes.string,
}