import React, {Component} from 'react';
import {
  View,
  Image,
  Text,
  SafeAreaView,
  ScrollView,
} from 'react-native';
import {Tabs, WingBlank, WhiteSpace} from '@ant-design/react-native';
import public_css from '../../source/css/public_css';
import {RetrieveData} from '../../data/storage';
import {RequestNetwork} from '../../data/encryption';

export default class home_amount_statistics extends Component {
  constructor(props) {
    super(props);
    this.props.navigation.dangerouslyGetParent().setOptions({
      tabBarVisible: false,
    });
    this.state = {
      tab: 0,
      clickNum: 0,
      statisticsData: {},
      nowDate: '',
    };
  }

  render() {
    const tabs = [{title: '本月'}, {title: '本季'}];
    return (
      <SafeAreaView style={public_css.body}>
        <View style={{height: 200, backgroundColor: '#2A67FE'}}>
          <View
            style={{flex: 2, justifyContent: 'center', alignItems: 'center'}}>
            <Text style={{color: '#ffffff', fontWeight: 'bold', fontSize: 18}}>
              {this.state.nowDate}
            </Text>
            {/*<Text style={{color: '#ffffff', fontWeight: 'bold', fontSize: 14}}>*/}
            {/*  本月开票总数*/}
            {/*</Text>*/}
            {/*<Text style={{color: '#ffffff', fontWeight: 'bold', fontSize: 30}}>*/}
            {/*  235*/}
            {/*</Text>*/}
          </View>
          <View style={{flex: 1, flexDirection: 'row'}}>
            <View
              style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
              <View style={{alignItems: 'center'}}>
                <Text
                  style={{color: '#ffffff', fontWeight: 'bold', fontSize: 16}}>
                  开票总额（元）
                </Text>
                <Text
                  style={{color: '#ffffff', fontWeight: 'bold', fontSize: 20}}>
                  {this.state.statisticsData.monthTotal}
                </Text>
              </View>
            </View>
            <View
              style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
              <View style={{alignItems: 'center'}}>
                <Text
                  style={{color: '#ffffff', fontWeight: 'bold', fontSize: 16}}>
                  税额（元）
                </Text>
                <Text
                  style={{color: '#ffffff', fontWeight: 'bold', fontSize: 20}}>
                  {this.state.statisticsData.monthTotalTaxes}
                </Text>
              </View>
            </View>
          </View>
        </View>
        <Tabs tabs={tabs} onChange={(i, l) => this.onChanges(i, l)} page={0}>
          <ScrollView>
            <View style={{backgroundColor: '#FCFCFE'}}>
              <View
                style={{
                  flexDirection: 'row',
                  margin: 10,
                  height: 20,
                  alignItems: 'center',
                }}>
                <View
                  style={{borderWidth: 1.5, height: 15, borderColor: '#2A67FE'}}
                />
                <View style={{marginLeft: 10}}>
                  <Text
                    style={{
                      fontWeight: 'bold',
                      color: '#464646',
                      fontSize: 15,
                    }}>
                    未税金额
                  </Text>
                </View>
              </View>
              <WhiteSpace />
              <WingBlank>
                <View
                  style={{
                    flexDirection: 'row',
                    alignItems: 'center',
                    justifyContent: 'space-between',
                    height: 50,
                    backgroundColor: '#ffffff',
                  }}>
                  <View style={{flexDirection: 'row'}}>
                    <Image
                      style={{marginLeft: 10, width: 20, height: 20}}
                      source={require('../../source/img/homeImg/leiji.png')}
                    />
                    <Text style={{marginLeft: 5}}>
                      累计成功开票未税金额（元）
                    </Text>
                  </View>
                  <View>
                    <Text style={{marginRight: 10}}>{this.state.statisticsData.monthTotal}</Text>
                  </View>
                </View>
              </WingBlank>
              <WhiteSpace />
              <WhiteSpace />
              <WingBlank>
                <View
                  style={{
                    flexDirection: 'row',
                    alignItems: 'center',
                    justifyContent: 'space-between',
                    height: 50,
                    backgroundColor: '#ffffff',
                  }}>
                  <View style={{flexDirection: 'row'}}>
                    <Image
                      style={{marginLeft: 10, width: 20, height: 20}}
                      source={require('../../source/img/homeImg/zhuan.png')}
                    />
                    <Text style={{marginLeft: 5}}>专票开票未税金额（元）</Text>
                  </View>
                  <View>
                    <Text style={{marginRight: 10}}>{this.state.statisticsData.monthZhuanpiaoTotal}</Text>
                  </View>
                </View>
              </WingBlank>
              <WhiteSpace />
              <WhiteSpace />
              <WingBlank>
                <View
                  style={{
                    flexDirection: 'row',
                    alignItems: 'center',
                    justifyContent: 'space-between',
                    height: 50,
                    backgroundColor: '#ffffff',
                  }}>
                  <View style={{flexDirection: 'row'}}>
                    <Image
                      style={{marginLeft: 10, width: 20, height: 20}}
                      source={require('../../source/img/homeImg/leijicheng.png')}
                    />
                    <Text style={{marginLeft: 5}}>普票开票未税金额（元）</Text>
                  </View>
                  <View>
                    <Text style={{marginRight: 10}}>{this.state.statisticsData.monthPupiaoTotal}</Text>
                  </View>
                </View>
              </WingBlank>
              <WhiteSpace />
              <View
                style={{
                  flexDirection: 'row',
                  margin: 10,
                  height: 20,
                  alignItems: 'center',
                }}>
                <View
                  style={{borderWidth: 1.5, height: 15, borderColor: '#2A67FE'}}
                />
                <View style={{marginLeft: 10}}>
                  <Text
                    style={{
                      fontWeight: 'bold',
                      color: '#464646',
                      fontSize: 15,
                    }}>
                    累计税额
                  </Text>
                </View>
              </View>
              <WhiteSpace />
              <WingBlank>
                <View
                  style={{
                    flexDirection: 'row',
                    alignItems: 'center',
                    justifyContent: 'space-between',
                    height: 50,
                    backgroundColor: '#ffffff',
                  }}>
                  <View style={{flexDirection: 'row'}}>
                    <Image
                      style={{marginLeft: 10, width: 20, height: 20}}
                      source={require('../../source/img/homeImg/leiji.png')}
                    />
                    <Text style={{marginLeft: 5}}>累计开票税额（元）</Text>
                  </View>
                  <View>
                    <Text style={{marginRight: 10}}>{this.state.statisticsData.monthTotalTaxes}</Text>
                  </View>
                </View>
              </WingBlank>
              <WhiteSpace />
              <WhiteSpace />
              <WingBlank>
                <View
                  style={{
                    flexDirection: 'row',
                    alignItems: 'center',
                    justifyContent: 'space-between',
                    height: 50,
                    backgroundColor: '#ffffff',
                  }}>
                  <View style={{flexDirection: 'row'}}>
                    <Image
                      style={{marginLeft: 10, width: 20, height: 20}}
                      source={require('../../source/img/homeImg/zhuan.png')}
                    />
                    <Text style={{marginLeft: 5}}>专票开票税额（元）</Text>
                  </View>
                  <View>
                    <Text style={{marginRight: 10}}>{this.state.statisticsData.monthZhuanpiaoTotalTaxes}</Text>
                  </View>
                </View>
              </WingBlank>
              <WhiteSpace />
              <WhiteSpace />
              <WingBlank>
                <View
                  style={{
                    flexDirection: 'row',
                    alignItems: 'center',
                    justifyContent: 'space-between',
                    height: 50,
                    backgroundColor: '#ffffff',
                  }}>
                  <View style={{flexDirection: 'row'}}>
                    <Image
                      style={{marginLeft: 10, width: 20, height: 20}}
                      source={require('../../source/img/homeImg/leijicheng.png')}
                    />
                    <Text style={{marginLeft: 5}}>普票开票税额（元）</Text>
                  </View>
                  <View>
                    <Text style={{marginRight: 10}}>{this.state.statisticsData.monthPupiaoTotalTaxes}</Text>
                  </View>
                </View>
              </WingBlank>
              <WhiteSpace />
            </View>
          </ScrollView>
          <ScrollView>
            <View style={{backgroundColor: '#FCFCFE'}}>
              <View
                style={{
                  flexDirection: 'row',
                  margin: 10,
                  height: 20,
                  alignItems: 'center',
                }}>
                <View
                  style={{borderWidth: 1.5, height: 15, borderColor: '#2A67FE'}}
                />
                <View style={{marginLeft: 10}}>
                  <Text
                    style={{
                      fontWeight: 'bold',
                      color: '#464646',
                      fontSize: 15,
                    }}>
                    未税金额
                  </Text>
                </View>
              </View>
              <WhiteSpace />
              <WingBlank>
                <View
                  style={{
                    flexDirection: 'row',
                    alignItems: 'center',
                    justifyContent: 'space-between',
                    height: 50,
                    backgroundColor: '#ffffff',
                  }}>
                  <View style={{flexDirection: 'row'}}>
                    <Image
                      style={{marginLeft: 10, width: 20, height: 20}}
                      source={require('../../source/img/homeImg/leiji.png')}
                    />
                    <Text style={{marginLeft: 5}}>
                      累计成功开票未税金额（元）
                    </Text>
                  </View>
                  <View>
                    <Text style={{marginRight: 10}}>{this.state.statisticsData.quarterTotal}</Text>
                  </View>
                </View>
              </WingBlank>
              <WhiteSpace />
              <WhiteSpace />
              <WingBlank>
                <View
                  style={{
                    flexDirection: 'row',
                    alignItems: 'center',
                    justifyContent: 'space-between',
                    height: 50,
                    backgroundColor: '#ffffff',
                  }}>
                  <View style={{flexDirection: 'row'}}>
                    <Image
                      style={{marginLeft: 10, width: 20, height: 20}}
                      source={require('../../source/img/homeImg/zhuan.png')}
                    />
                    <Text style={{marginLeft: 5}}>专票开票未税金额（元）</Text>
                  </View>
                  <View>
                    <Text style={{marginRight: 10}}>{this.state.statisticsData.quarterZhuanpiaoTotal}</Text>
                  </View>
                </View>
              </WingBlank>
              <WhiteSpace />
              <WhiteSpace />
              <WingBlank>
                <View
                  style={{
                    flexDirection: 'row',
                    alignItems: 'center',
                    justifyContent: 'space-between',
                    height: 50,
                    backgroundColor: '#ffffff',
                  }}>
                  <View style={{flexDirection: 'row'}}>
                    <Image
                      style={{marginLeft: 10, width: 20, height: 20}}
                      source={require('../../source/img/homeImg/leijicheng.png')}
                    />
                    <Text style={{marginLeft: 5}}>普票开票未税金额（元）</Text>
                  </View>
                  <View>
                    <Text style={{marginRight: 10}}>{this.state.statisticsData.quarterPupiaoTotal}</Text>
                  </View>
                </View>
              </WingBlank>
              <WhiteSpace />
              <View
                style={{
                  flexDirection: 'row',
                  margin: 10,
                  height: 20,
                  alignItems: 'center',
                }}>
                <View
                  style={{borderWidth: 1.5, height: 15, borderColor: '#2A67FE'}}
                />
                <View style={{marginLeft: 10}}>
                  <Text
                    style={{
                      fontWeight: 'bold',
                      color: '#464646',
                      fontSize: 15,
                    }}>
                    累计税额
                  </Text>
                </View>
              </View>
              <WhiteSpace />
              <WingBlank>
                <View
                  style={{
                    flexDirection: 'row',
                    alignItems: 'center',
                    justifyContent: 'space-between',
                    height: 50,
                    backgroundColor: '#ffffff',
                  }}>
                  <View style={{flexDirection: 'row'}}>
                    <Image
                      style={{marginLeft: 10, width: 20, height: 20}}
                      source={require('../../source/img/homeImg/leiji.png')}
                    />
                    <Text style={{marginLeft: 5}}>累计开票税额（元）</Text>
                  </View>
                  <View>
                    <Text style={{marginRight: 10}}>{this.state.statisticsData.quarterTotalTaxes}</Text>
                  </View>
                </View>
              </WingBlank>
              <WhiteSpace />
              <WhiteSpace />
              <WingBlank>
                <View
                  style={{
                    flexDirection: 'row',
                    alignItems: 'center',
                    justifyContent: 'space-between',
                    height: 50,
                    backgroundColor: '#ffffff',
                  }}>
                  <View style={{flexDirection: 'row'}}>
                    <Image
                      style={{marginLeft: 10, width: 20, height: 20}}
                      source={require('../../source/img/homeImg/zhuan.png')}
                    />
                    <Text style={{marginLeft: 5}}>专票开票税额（元）</Text>
                  </View>
                  <View>
                    <Text style={{marginRight: 10}}>{this.state.statisticsData.quarterZhuanpiaoTotalTaxes}</Text>
                  </View>
                </View>
              </WingBlank>
              <WhiteSpace />
              <WhiteSpace />
              <WingBlank>
                <View
                  style={{
                    flexDirection: 'row',
                    alignItems: 'center',
                    justifyContent: 'space-between',
                    height: 50,
                    backgroundColor: '#ffffff',
                  }}>
                  <View style={{flexDirection: 'row'}}>
                    <Image
                      style={{marginLeft: 10, width: 20, height: 20}}
                      source={require('../../source/img/homeImg/leijicheng.png')}
                    />
                    <Text style={{marginLeft: 5}}>普票开票税额（元）</Text>
                  </View>
                  <View>
                    <Text style={{marginRight: 10}}>{this.state.statisticsData.quarterPupiaoTotalTaxes}</Text>
                  </View>
                </View>
              </WingBlank>
              <WhiteSpace />
            </View>
          </ScrollView>
        </Tabs>
      </SafeAreaView>
    );
  }

  componentDidMount() {
    this.getNowDate();
    this.getInvoiceStatistics();
  }

  //获取统计数据
  getInvoiceStatistics = async () => {
    const company = JSON.parse(await RetrieveData('company'));
    const token = await RetrieveData('token');
    if (token && company) {
      const url = '/sys/stat/toInvoice';
      let response = await RequestNetwork(
        url,
        token,
        {
          entTaxId: company.entTaxId,
        },
        false,
        2,
      );
      if (response) {
        console.log(response);
        if (response.code === 0) {
          this.setState({
            statisticsData: response.data,
          });
        } else {
          // await this.abnormalMessage(response);
        }
      }
    }
  };

  // 获取当前年月
  getNowDate = () => {
    let now = new Date(); //当前日期
    let nowMonth = now.getMonth(); //当前月
    let nowYear = now.getFullYear(); //当前年
    let monthStartDate = new Date(nowYear, nowMonth, 1);
    let yy = monthStartDate.getFullYear();
    let mm =
      monthStartDate.getMonth() + 1 < 10
        ? '0' + (monthStartDate.getMonth() + 1)
        : monthStartDate.getMonth() + 1;
    this.setState({
      nowDate: yy + '年' + mm + '月',
    });
  };

  //tab变化事件
  onChanges = (i, l) => {
    this.getInvoiceStatistics();
  };
}