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

interface DataInterface {
  image: string
  name: string
  buildingSiteId?: string
}
interface ProcessConfigInterface {
  active?: any
  used: any
  process: string
}

type PageOwnProps = {
  className?: string
  data: DataInterface
  editable?: boolean
  children?: any
  onEdit?: any
  onImageClick?: any
  processConfig: ProcessConfigInterface[]
}


type IProps = PageOwnProps

interface Index {
  props: IProps;
}

class Index extends Component {

  static options = {
    addGlobalClass: true
  }

  handleImageClick = (e) => {
    this.props.onImageClick(e)
  }

  handleOnEdit = () => {
    this.props.onEdit(this.props.data.buildingSiteId)
  }

  render() {
    const { data, processConfig, editable } = this.props
    return (
      <View className={'sd-building-info ' + (this.props.className || '')}>
        {
          data.image &&
          <View className='sd-building-info-head'>
            {/* <SdFormid >
             
            </SdFormid> */}
            <Image
              onClick={this.handleImageClick.bind(this, data.image)}
              mode='aspectFill'
              className='sd-building-info-img'
              src={data.image} />

            {editable && <View className='sd-building-info-edit' onClick={this.handleOnEdit}>编辑封面</View>
              // <SdFormid >

              // </SdFormid>
            }
            {this.props.children}
          </View>
        }

        {/* 标题 */}
        <View className='sd-building-info-content'>
          <View className='sd-building-info-title'>{data.name}</View>
          {
            processConfig.map(item => {
              return <Text
                key={item.process}
                className={'sd-building-info-config ' + (item.active ? 'sd-building-info-active' : (item.used ? 'sd-building-info-used' : ''))}>
                {item.process}
              </Text>
            })
          }
        </View>

      </View>
    )
  }
}

export default Index as ComponentClass<PageOwnProps>