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

type PageOwnProps = {
  className?: string
  account: any
  yingxiao?: any
  keyong?: any
  onDetailClick?: any
  type: 'user' | 'shop'
}


type IProps = PageOwnProps

interface Index {
  props: IProps;
}

class Index extends Component {

  static options = {
    addGlobalClass: true
  }

  handleClick = () => {
    this.props.onDetailClick()
  }
  render() {
    const { account, yingxiao, keyong, type, className } = this.props
    return (
      <View className={'sd-account ' + (className || '')}>
        <View className='sd-account-head'>
          <View className='sd-account-note'>账户总额(元)</View>
          <View className='sd-account-total'>{account}</View>
          {
            type === 'shop' ?
              <View className='sd-account-detail-shop' onClick={this.handleClick}>收支明细</View>
              :
              <View className='sd-account-detail-user' onClick={this.handleClick}>收支明细 ></View>
          }

          {
            type === 'shop' &&
            <View className='sd-account-extra'>
              <View className='sd-account-extra-item'>
                <View className='sd-account-extra-title'>营销费用(元) </View>
                <View className='sd-account-extra-money'>{yingxiao}</View>
              </View>
              <View className='sd-account-extra-item'>
                <View className='sd-account-extra-title'>可用金额(元) </View>
                <View className='sd-account-extra-money'>{keyong}</View>
              </View>
            </View>
          }

        </View>
        <View className='sd-account-tishi'>
          <View className='sd-account-tishi-title'>温馨提示 </View>
          <View className='sd-account-tishi-item'>1. 提现申请会在1-3个工作日处理。 </View>
          <View className='sd-account-tishi-item'>2. 请在提现微信账号查询到账情况，微信：我-->钱包-->零钱-->零钱明细。 </View>
          <View className='sd-account-tishi-item'>3. 提现金额不能少于1元，提现成功会收取1%的手续费。 </View>
        </View>
      </View>
    )
  }
}

export default Index as ComponentClass<PageOwnProps>