import Taro, { Component } from '@tarojs/taro'
import { View, Text, Image } from '@tarojs/components'
import './index.scss'
import { ComponentClass } from 'react'

type PageOwnProps = {
  showBack?: boolean
  showhome?: boolean
  onBackClick?: any
  onHomeClick?: any
  title?: any
  className?: any
  unShow?: boolean
}

type PageState = {}


type IProps = PageOwnProps

interface Index {
  props: IProps;
}

class Index extends Component {

  static options = {
    addGlobalClass: true
  }
  state = {

  }

  handleBackClick = () => {
    this.props.onBackClick()
  }

  handleHomeClick = () => {
    this.props.onHomeClick()
  }


  render() {
    const { title, className, unShow, showBack, showhome } = this.props
    return (
      <View className={`sd-navigation-bar ${className || ''}`}>
        {
          !unShow && <View className='sd-navigation-bar-content'>
            <View className='sd-navigation-bar-icons'>
              {
                showBack && <Image src={'http://ft-image.oss-cn-beijing.aliyuncs.com/252.png'} onClick={this.handleBackClick} />
              }
              {
                showhome && <Image src={'http://ft-image.oss-cn-beijing.aliyuncs.com/253.png'} onClick={this.handleBackClick} />
              }
            </View>

            <Text className='sd-navigation-bar-title'>{title}</Text>
          </View>
        }

      </View>

    )
  }
}

export default Index as ComponentClass<PageOwnProps, PageState>