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 enterprise_edit extends Component {
  constructor(props) {
    super(props);
    this.props.navigation.dangerouslyGetParent().setOptions({
      tabBarVisible: false,
    });
    this.ent = this.props.route.params.enterprise;
    this.state = {
      entName: this.ent.entName,
      entTaxId: this.ent.entTaxId,
      entAddress: this.ent.entAddress,
      entContactPerson: this.ent.entContactPerson,
      entPhone: this.ent.entPhone,
      bankAccountName: this.ent.bankAccountName,
      bankAccountNumber: this.ent.bankAccountNumber,
      payees: this.ent.payees,
      reviewers: this.ent.reviewers,
      req_channel: '',
      spinner: false,
    };
  }

  render() {
    return (
      <KeyboardAvoidingView
        enabled
        style={{flex: 1, backgroundColor: '#ffffff'}}>
        <ScrollView>
          <View>
            <Spinner
              visible={this.state.spinner}
              textContent={'Loading...'}
              textStyle={loading_css.spinnerTextStyle}
            />
            <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.entName}
                  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.entTaxId}
                  clearButtonMode="while-editing"
                  secureTextEntry={false}
                  onChangeText={text => {
                    this.setState({
                      entTaxId: 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.entAddress}
                  placeholder="请输入公司地址"
                  clearButtonMode="while-editing"
                  secureTextEntry={false}
                  onChangeText={text => {
                    this.setState({
                      entAddress: text,
                    });
                  }}
                />
              </View>
              <View style={[public_css.view, public_css.lineTopBottom]}>
                <Text style={public_css.text}>企业联系人:</Text>
                <TextInput
                  style={public_css.textInputStyle}
                  value={this.state.entContactPerson}
                  placeholder="请输入企业联系人"
                  clearButtonMode="while-editing"
                  secureTextEntry={false}
                  onChangeText={text => {
                    this.setState({
                      entContactPerson: text,
                    });
                  }}
                />
              </View>
              <View style={[public_css.view, public_css.lineTopBottom]}>
                <Text style={public_css.text}>企业电话:</Text>
                <TextInput
                  style={public_css.textInputStyle}
                  value={this.state.entPhone}
                  placeholder="请输入企业电话"
                  clearButtonMode="while-editing"
                  secureTextEntry={false}
                  onChangeText={text => {
                    this.setState({
                      entPhone: text,
                    });
                  }}
                />
              </View>
              <View style={[public_css.view, public_css.lineTopBottom]}>
                <Text style={public_css.text}>企业银行户名:</Text>
                <TextInput
                  style={public_css.textInputStyle}
                  value={this.state.bankAccountName}
                  placeholder="请输入企业银行户名"
                  clearButtonMode="while-editing"
                  secureTextEntry={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.bankAccountNumber}
                  placeholder="请输入企业银行账号"
                  clearButtonMode="while-editing"
                  secureTextEntry={false}
                  onChangeText={text => {
                    this.setState({
                      bankAccountNumber: text,
                    });
                  }}
                />
              </View>
              <View
                style={[
                  public_css.view,
                  public_css.lineTopBottom,
                  {alignItems: 'center'},
                ]}>
                <Text style={public_css.text}>*收款人:</Text>
                <TextInput
                  style={public_css.textInputStyle}
                  placeholder="请输入收款人"
                  clearButtonMode="while-editing"
                  secureTextEntry={false}
                  value={this.state.payees}
                  editable={false}
                />
                <View style={{marginRight: 20}}>
                  <TouchableOpacity
                    onPress={() => {
                      this.props.navigation.navigate('enterprise_user', {
                        type: 1,
                        data: this,
                      });
                    }}>
                    <Image
                      source={require('../../source/img/productImg/addIcon.png')}
                      style={{height: 16, width: 16}}
                    />
                  </TouchableOpacity>
                </View>
              </View>
              <View
                style={[
                  public_css.view,
                  public_css.lineTopBottom,
                  {alignItems: 'center'},
                ]}>
                <Text style={public_css.text}>审核者:</Text>
                <TextInput
                  style={public_css.textInputStyle}
                  placeholder="请输入审核者"
                  clearButtonMode="while-editing"
                  secureTextEntry={false}
                  value={this.state.reviewers}
                  editable={false}
                />
                <View style={{marginRight: 20}}>
                  <TouchableOpacity
                    onPress={() => {
                      this.props.navigation.navigate('enterprise_user', {
                        type: 2,
                        data: this,
                      });
                    }}>
                    <Image
                      source={require('../../source/img/productImg/addIcon.png')}
                      style={{height: 16, width: 16}}
                    />
                  </TouchableOpacity>
                </View>
              </View>
            </View>
          </View>
        </ScrollView>
        <View style={public_css.bottomStaus}>
          <TouchableOpacity
            style={[public_css.statusBtn, public_css.statusLBtn]}
            onPress={() => {
              this.setState({
                entName: this.ent.entName,
                entTaxId: this.ent.entTaxId,
                entAddress: this.ent.entAddress,
                entContactPerson: this.ent.entContactPerson,
                entPhone: this.ent.entPhone,
                bankAccountName: this.ent.bankAccountName,
                bankAccountNumber: this.ent.bankAccountNumber,
                payees: this.ent.payees,
                reviewers: this.ent.reviewers,
              });
            }}>
            <Image
              source={require('../../source/img/productImg/clear.png')}
              style={{width: 32, height: 32}}
            />
            <Text>全部清除</Text>
          </TouchableOpacity>
          <TouchableOpacity
            style={[public_css.statusBtn, public_css.statusRBtn]}
            onPress={() => this.submitData()}>
            <Image
              source={require('../../source/img/productImg/confirm.png')}
              style={{width: 32, height: 32}}
            />
            <Text style={{color: '#fff'}}>确定添加</Text>
          </TouchableOpacity>
        </View>
      </KeyboardAvoidingView>
    );
  }

  //提交数据
  submitData = async () => {
    let number = this.state.bankAccountNumber;
    if (!number) {
      ShowToast('企业银行帐号不可以为空！');
      return;
    }
    let payees = this.state.payees;
    if (!payees) {
      ShowToast('收款人不可以为空！');
      return;
    }
    let entTaxId = this.state.entTaxId;
    if (!entTaxId) {
      ShowToast('客户税号不可以为空！');
      return;
    }
    this.setLoadingStatus(true);
    let token = await RetrieveData('token');
    let account = await RetrieveData('account');
    if (token && account) {
      token = token.substring(1, token.length - 1);
      account = account.substring(1, account.length - 1);
      const url = '/sys/entInfo/updateBriefInfo';
      let response = await GetDataPost(
        url,
        token,
        {
          entTaxId: this.state.entTaxId,
          entAddress: this.state.entAddress,
          entContactPerson: this.state.entContactPerson,
          entPhone: this.state.entPhone,
          bankAccountName: this.state.bankAccountName,
          bankAccountNumber: this.state.bankAccountNumber,
          payees: this.state.payees,
          reviewers: this.state.reviewers,
          reqChannel: 3,
          userMobile: account,
        },
        false,
        1,
      );
      if (response) {
        if (response.code == 0) {
          ShowToast('编辑成功！');
          this.setLoadingStatus(false);
          this.props.navigation.goBack();
          DeviceEventEmitter.emit('企业信息刷新', '');
        } else {
          ShowToast('编辑失败！');
          this.setLoadingStatus(false);
        }
      } else {
        ShowToast(response.msg);
        this.setLoadingStatus(false);
      }
    }
  };

  //设置loading层是否显示
  setLoadingStatus(isLoading) {
    this.setState({
      spinner: isLoading,
    });
  }

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

  setPayees = data => {
    this.setState({
      payees: data,
    });
  };

  setReviewers = data => {
    this.setState({
      reviewers: data,
    });
  };
}