import Taro, { Component } from '@tarojs/taro';
import './index.scss'
import dayjs from 'dayjs'
import { getThumbnail } from '@utils/tools'

export default class Item extends Component {
  static defaultProps = {
    data: {},
    style: {}
  }
  handleClick(data) {

    this.props.onClick(data)
  }
  render() {
    const { data, style } = this.props
    return (
      <View className="item" style={style} onClick={this.handleClick.bind(this, data)}>
        {(data.type == 'help' || data.type == 'group') &&
          <View className={data.type == 'help' ? 'type' : 'type2'}>{data.type == 'help' ? '助力' : '拼团'}</View>
        }

        <Image className="pic" mode="aspectFill" src={getThumbnail(data.mainImg || data.imgUrl)}></Image>

        <View className="box">

          <View className="left">
            <View className="title">{data.title}</View>
            {data.startDate &&
              <View className={data.jionStatus == '已签到' ? "status signed " : data.jionStatus == '成功已核销' ? "status primary" : data.jionStatus == '失败' ? "status fail" : "status"}>{data.jionStatus || ''}</View>
            }
          </View>
          {data.startDate &&
            <View className="time">参与时间：{`${dayjs(data.startDate).format('YYYY年MM月DD日 HH:mm:ss')}`}</View>
          }
          {!data.startDate &&
            <View className="time">{data.type != 'dynamic' ? '参与时间：' : ''}</View>
          }
        </View>

      </View >
    );
  }
}