import React, {Component} from 'react';
import {
  View,
  Image,
  TouchableHighlight,
  Text,
  StyleSheet,
  TextInput,
  TouchableOpacity,
  Dimensions,
  ScrollView,
  KeyboardAvoidingView,
  DeviceEventEmitter,
} from 'react-native';

import login_css from '../login/login_css';
import public_css from '../../source/css/public_css';
import loading_css from '../../source/css/loading_css';
import Spinner from 'react-native-loading-spinner-overlay';
import {GetDataPost} from '../../data/encryption';
import {ShowToast} from '../../components/rootToast/root_toast';
import {RetrieveData, StorageData} from '../../data/storage';

export default class service_provider extends Component {
  constructor(props) {
    super(props);
    this.props.navigation.dangerouslyGetParent().setOptions({
      tabBarVisible: false,
    });
    this.service = this.props.route.params.service;
    this.state = {
      name: this.service.name,
      contactPhone: this.service.contactPhone,
      contactName: this.service.contactName,
      address: this.service.address,
      ispId: this.service.ispId,
      joinDate: this.service.joinDate,
      machineCnt: 0,
      onlineEnCut: 0,
      allEntCnt: 0,
      monthInvoiceAmt: 0,
      monthInvoiceCnt: 0,
      monthNewInitCnt: 0,
      avaiableEntCnt: 0,
    };
    console.log(this);
  }

  render() {
    return (
      <KeyboardAvoidingView enabled style={{flex: 1}}>
        <ScrollView>
          <View>
            <View style={login_css.inputView}>
              <View style={[public_css.view, public_css.lineTopBottom]}>
                <Text
                  style={[
                    public_css.text,
                    {fontFamily: 'PingFang-SC-Regular', color: '#333333'},
                  ]}>
                  服务商名称:
                </Text>
                <TextInput
                  style={public_css.textInputStyle}
                  value={this.state.name}
                  clearButtonMode="while-editing"
                  secureTextEntry={false}
                  editable={false}
                />
              </View>
              <View style={[public_css.view, public_css.lineTopBottom]}>
                <Text
                  style={[
                    public_css.text,
                    {fontFamily: 'PingFang-SC-Regular', color: '#333333'},
                  ]}>
                  联系电话:
                </Text>
                <TextInput
                  style={public_css.textInputStyle}
                  value={this.state.contactPhone}
                  clearButtonMode="while-editing"
                  secureTextEntry={false}
                  editable={false}
                  onChangeText={(text) => {
                    this.setState({
                      contactPhone: text,
                    });
                  }}
                />
              </View>
              <View style={[public_css.view, public_css.lineTopBottom]}>
                <Text
                  style={[
                    public_css.text,
                    {fontFamily: 'PingFang-SC-Regular', color: '#333333'},
                  ]}>
                  地址:
                </Text>
                <TextInput
                  style={public_css.textInputStyle}
                  value={this.state.address}
                  clearButtonMode="while-editing"
                  secureTextEntry={false}
                  editable={false}
                  onChangeText={(text) => {
                    this.setState({
                      address: text,
                    });
                  }}
                />
              </View>
              <View style={[public_css.view, public_css.lineTopBottom]}>
                <Text style={public_css.text}>接入日期:</Text>
                <TextInput
                  style={public_css.textInputStyle}
                  value={this.state.joinDate}
                  clearButtonMode="while-editing"
                  secureTextEntry={false}
                  editable={false}
                  onChangeText={(text) => {
                    this.setState({
                      joinDate: text,
                    });
                  }}
                />
              </View>
            </View>
          </View>
          <View style={[login_css.inputView, {marginTop: 10}]}>
            <View style={[public_css.view, public_css.lineTopBottom]}>
              <Text style={public_css.text}>服务器数量:</Text>
              <TextInput
                style={public_css.textInputStyle}
                value={this.state.bankAccountName}
                clearButtonMode="while-editing"
                secureTextEntry={false}
                editable={false}
                onChangeText={(text) => {
                  this.setState({
                    bankAccountName: text,
                  });
                }}
              />
            </View>
            <View style={[public_css.view, public_css.lineTopBottom]}>
              <Text style={public_css.text}>在线企业数:</Text>
              <TextInput
                style={public_css.textInputStyle}
                value={this.state.onlineEnCut}
                clearButtonMode="while-editing"
                secureTextEntry={false}
                editable={false}
                onChangeText={(text) => {
                  this.setState({
                    onlineEnCut: text,
                  });
                }}
              />
            </View>
            <View
              style={[
                public_css.view,
                public_css.lineTopBottom,
                {alignItems: 'center'},
              ]}>
              <Text style={public_css.text}>所有企业数:</Text>
              <TextInput
                style={public_css.textInputStyle}
                clearButtonMode="while-editing"
                secureTextEntry={false}
                value={this.state.payees}
                editable={false}
              />
            </View>
            <View
              style={[
                public_css.view,
                public_css.lineTopBottom,
                {alignItems: 'center'},
              ]}>
              <Text style={public_css.text}>月累计开票金额:</Text>
              <TextInput
                style={public_css.textInputStyle}
                clearButtonMode="while-editing"
                secureTextEntry={false}
                value={this.state.reviewers}
                editable={false}
              />
            </View>
            <View
              style={[
                public_css.view,
                public_css.lineTopBottom,
                {alignItems: 'center'},
              ]}>
              <Text style={public_css.text}>月累计开票数量:</Text>
              <TextInput
                style={public_css.textInputStyle}
                clearButtonMode="while-editing"
                secureTextEntry={false}
                value={this.state.reviewers}
                editable={false}
              />
            </View>
            <View
              style={[
                public_css.view,
                public_css.lineTopBottom,
                {alignItems: 'center'},
              ]}>
              <Text style={public_css.text}>月新增上架企业数:</Text>
              <TextInput
                style={public_css.textInputStyle}
                clearButtonMode="while-editing"
                secureTextEntry={false}
                value={this.state.reviewers}
                editable={false}
              />
            </View>
          </View>
        </ScrollView>
      </KeyboardAvoidingView>
    );
  }

  //加载页面时显示数据
  componentDidMount(): void {
    this.getServiceInfo();
  }

  //获取服务商列表
  getServiceInfo = async () => {
    let account = await RetrieveData('account');
    let token = await RetrieveData('token');
    if (token && account) {
      account = account.substring(1, account.length - 1);
      token = token.substring(1, token.length - 1);
      const url = 'https://app.taxbk.cn:9443/auth/isp/info/findDetail';
      let response = await GetDataPost(
        url,
        token,
        {
          ispId: this.state.ispId,
        },
        false,
        2,
      );
      if (response) {
        if (response.code == 0) {
          this.setState({
            name: response.data.name,
            contactPhone: response.data.contactPhone,
            contactName: response.data.contactName,
            address: response.data.address,
            ispId: response.data.ispId,
            joinDate: response.data.joinDate,
            machineCnt: response.data.machineCnt,
            onlineEnCut: response.data.onlineEnCut,
            allEntCnt: response.data.allEntCnt,
            monthInvoiceAmt: response.data.monthInvoiceAmt,
            monthInvoiceCnt: response.data.monthInvoiceCnt,
            monthNewInitCnt: response.data.monthNewInitCnt,
            avaiableEntCnt: response.data.avaiableEntCnt,
          });
        }
      }
    }
  };
}