import { ComponentClass } from 'react'
import Taro, { Component } from '@tarojs/taro'
import { View, Image } from '@tarojs/components'
import './index.scss'
import { AtActivityIndicator } from 'taro-ui'
type PageOwnProps = {
  className?: string
  image?: any
  descs?: any
  title?: any
  loading?: boolean
  hideImage?: any
}


type IProps = PageOwnProps

interface Index {
  props: IProps;
}

class Index extends Component {

  static options = {
    addGlobalClass: true
  }
  render() {
    const { image, hideImage, title, descs, className, loading } = this.props
    const img = image || 'http://ft-image.oss-cn-beijing.aliyuncs.com/105.png'

    return (
      <View className={'sd-blank ' + (className || '')}>
        {
          loading ?
            <AtActivityIndicator className='at-row at-row__justify--center' content='加载中...'></AtActivityIndicator>
            :
            <View>
              {
                (!hideImage) &&
                <Image mode='aspectFit' className='sd-blank-img' src={img}></Image>
              }
              {
                title &&
                <View className='sd-blank-title'>{title}</View>
              }
              {
                descs &&
                this.props.descs.map(item => {
                  return <View key={item} className='sd-blank-desc'>{item}</View>
                })
              }
            </View>
        }
      </View>
    )
  }
}

export default Index as ComponentClass<PageOwnProps>