import { Component } from 'react'
import { View, Text } from '@tarojs/components'
import { getEarningsDetail } from '../../../service'
import './index.less'

export default class Index extends Component {
  state = {
    earningsDetail: {},//收益详情
  }
  componentDidShow () {
    this.getEarningsDetail();
  }
  // 获取收益详情
  getEarningsDetail = async () => {
    const res = await getEarningsDetail();
    this.setState({ earningsDetail: res });
  }

  render () {
    const { earningsDetail } = this.state;
    const today_data = earningsDetail.today_data || {}; 
    const this_month_data = earningsDetail.this_month_data || {};
    const last_month_data = earningsDetail.last_month_data || {}; 
    const historical_month_data = earningsDetail.historical_month_data || {}; 
    return (
      <View className='index'>
        <View className='earnings-list'>
          <View className='earnings-list-item'>
            <View className='item-line title-one'>
              <Text className='title'>今天预估总收益</Text>
              <Text className='money'>￥{Number(today_data.assess_amount_text_all)/100 || '0.00'}</Text>
            </View>
            <View className='dotted-line'></View>
            <View className='item-line title-two'>
              <Text className='title'>预估推广收益</Text>
              <Text className='money'>￥{Number(today_data.assess_amount_text_promotion)/100 || '0.00'}</Text>
            </View>
            <View className='item-line title-two'>
              <Text className='title'>预估自购收益</Text>
              <Text className='money'>￥{Number(today_data.assess_amount_text_buy)/100 || '0.00'}</Text>
            </View>
          </View>
          <View className='earnings-list-item'>
            <View className='item-line title-one'>
              <Text className='title'>本月预估总收益</Text>
              <Text className='money'>￥{Number(this_month_data.assess_amount_text_all)/100 || '0.00'}</Text>
            </View>
            <View className='dotted-line'></View>
            <View className='item-line title-two'>
              <Text className='title'>预估推广收益</Text>
              <Text className='money'>￥{Number(this_month_data.assess_amount_text_promotion)/100 || '0.00'}</Text>
            </View>
            <View className='item-line title-two'>
              <Text className='title'>预估自购收益</Text>
              <Text className='money'>￥{Number(this_month_data.assess_amount_text_buy)/100 || '0.00'}</Text>
            </View>
          </View>
          <View className='earnings-list-item'>
            <View className='item-line title-one'>
              <Text className='title'>上月预估总收益</Text>
              <Text className='money'>￥{Number(last_month_data.assess_amount_text_all)/100 || '0.00'}</Text>
            </View>
            <View className='dotted-line'></View>
            <View className='item-line title-two'>
              <Text className='title'>预估推广收益</Text>
              <Text className='money'>￥{Number(last_month_data.assess_amount_text_promotion)/100 || '0.00'}</Text>
            </View>
            <View className='item-line title-two'>
              <Text className='title'>预估自购收益</Text>
              <Text className='money'>￥{Number(last_month_data.assess_amount_text_buy)/100 || '0.00'}</Text>
            </View>
          </View>
          <View className='earnings-list-item'>
            <View className='item-line title-one'>
              <Text className='title'>历史预估总收益</Text>
              <Text className='money'>￥{Number(historical_month_data.assess_amount_text_all)/100 || '0.00'}</Text>
            </View>
            <View className='dotted-line'></View>
            <View className='item-line title-two'>
              <Text className='title'>预估推广收益</Text>
              <Text className='money'>￥{Number(historical_month_data.assess_amount_text_promotion)/100 || '0.00'}</Text>
            </View>
            <View className='item-line title-two'>
              <Text className='title'>预估自购收益</Text>
              <Text className='money'>￥{Number(historical_month_data.assess_amount_text_buy)/100 || '0.00'}</Text>
            </View>
          </View>
        </View>
      </View>
    )
  }
}