import React, {Component} from 'react';
import {
  View,
  FlatList,
  Text,
  ActivityIndicator,
  RefreshControl,
  TouchableOpacity,
  Image,
  Alert,
  SafeAreaView,
  DeviceEventEmitter,
} from 'react-native';
import {
  DatePicker,
  List,
  Provider,
  InputItem,
  SwipeAction,
  Drawer,
  WingBlank,
  Radio, SearchBar,
} from "@ant-design/react-native";

import {RetrieveData, IndividualStorageData} from '../../data/storage';
import {RequestNetwork} from '../../data/encryption';
import Spinner from 'react-native-loading-spinner-overlay';
import loading_css from '../../source/css/loading_css';
import {CleanAll} from '../../components/abnormalMessage/abnormal_message';
import {ToastShow} from '../../components/toast/toast';
import public_css from '../../source/css/public_css';
import {Footer} from '../../components/listPage/pagination';

const RadioItem = Radio.RadioItem;
export default class enterprise_list extends Component {
  constructor(props) {
    super(props);
    this.props.navigation.dangerouslyGetParent().setOptions({
      tabBarVisible: false,
    });
    this.state = {
      pageNo: 1,
      totalPage: 5,
      isShowSearch: false,
      customerName: '',
      customerEntTaxId: '',
      entName: '',
      listData: [],
      status: 0,
      showFoot: 0, // 控制foot， 0：隐藏footer  1：已加载完成,没有更多数据   2 ：显示加载中
      isLoading: false,
      entItem: '',
      companyGroup: [],
      loadingText: 'loading',
      entTaxId: '',
      companyName: '',
    };
  }

  render() {
    return (
      <SafeAreaView style={public_css.body}>
        <View style={public_css.search}>
          <SearchBar
            placeholder="搜索"
            value={this.state.companyName}
            onCancel={() => this.searchClear()}
            onChange={(value) => this.searchData(value)}
            showCancelButton={false}
            style={{borderRadius: 15}}
          />
        </View>
        <FlatList
          data={this.state.listData}
          renderItem={(item) => this.renderItem(item)}
          refreshControl={
            <RefreshControl
              title={'加载中...'}
              colors={['#B7B7B7']} //此颜色无效
              tintColor={'#B7B7B7'}
              titleColor={'#B7B7B7'} //只有ios有效
              refreshing={this.state.isLoading}
              onRefresh={() => {
                this.initData();
              }}
            />
          }
          ListFooterComponent={() => Footer(this.state.showFoot)}
          onEndReached={() => this.onEndReached()}
          onEndReachedThreshold={0.1}
        />
      </SafeAreaView>
    );
  }

  //页面加载完成后加载数据
  componentDidMount(): void {
    this.getCompanyList();
  }

  //搜索
  searchData = async (text) => {
    this.setState({
      listData: [],
      companyName: text,
      showFoot: 0,
      pageNo: 1,
    });
    await this.getCompanyList();
  };

  //数据初始化
  initData = () => {
    this.setState({
      listData: [],
      isLoading: false,
      showFoot: 0,
      status: 0,
      pageNo: 1,
      companyName: '',
    });
    this.getCompanyList();
  };

  //列表上拉加载
  onEndReached = async () => {
    if (this.state.showFoot === 2) {
      if (this.state.pageNo >= this.state.totalPage) {
        this.setState({showFoot: 0});
        return;
      } else {
        this.setState({showFoot: 1, pageNo: this.state.pageNo + 1});
        await this.getCompanyList();
      }
    }
  };

  //获取数据
  getCompanyList = async () => {
    const entInfo = JSON.parse(await RetrieveData('company'));
    this.setState({entItem: entInfo});
    const token = await RetrieveData('token');
    const account = await RetrieveData('account');
    if (token && account) {
      const url = '/auth/ent/user/findManageInfoByMobile';
      let response = await RequestNetwork(
        url,
        token,
        {
          entUserMobile: account,
          entName: this.state.companyName,
          pageNum: this.state.pageNo,
          pageSize: 10,
        },
        false,
        2,
      );
      if (response) {
        if (response.code === 0) {
          this.setState({
            totalPage: response.data.pages,
          });
          this.setList(response.data.records);
        } else {
          this.setState({
            showFoot: 0,
          });
          await this.abnormalMessage(response);
        }
      }
    }
  };

  //清空搜索栏
  searchClear = async () => {
    await this.initData();
  };

  //设置抬头列表
  setList = (data) => {
    let listData = data.map((_, i) => ({
      userId: data[i].userId,
      entTaxId: data[i].entTaxId,
      entName: data[i].entName,
      roleId: data[i].roleId,
      roleMemo: data[i].roleMemo,
    }));
    let list = this.state.listData.concat(listData);
    if (list.length > 0) {
      this.setState({
        showFoot: 2,
        isLoading: false,
        listData: list,
      });
    } else {
      this.setState({
        showFoot: 0,
        isLoading: false,
        listData: list,
      });
    }
  };

  //切换当前绑定企业
  onChange = async (value) => {
    this.setState({loadingText: '切换中....'});
    this.setLoadingStatus(true);
    const token = await RetrieveData('token');
    const account = await RetrieveData('account');
    if (token && account) {
      const url = '/auth/comm/user/setDefaultChoose';
      let response = await RequestNetwork(
        url,
        token,
        {
          mobile: account,
          defaultChoose: value.item.entTaxId,
          reqChannel: 3,
        },
        false,
        1,
      );
      if (response) {
        if (response.code === 0) {
          await IndividualStorageData(
            'company',
            JSON.stringify(response.data.chooseEntity),
          );
          await IndividualStorageData('token', response.data.token);
          this.setLoadingStatus(false);
          this.setState({
            entItem: value,
            loadingText: 'loading....',
          });
          DeviceEventEmitter.emit('updateCompany', null);
          DeviceEventEmitter.emit('updatePersonal', true);
          DeviceEventEmitter.emit('updatePage', null);
          // this.props.route.params.getCompanyInfo();
          this.props.navigation.goBack();
        } else {
          this.setLoadingStatus(false);
          ToastShow(1, response.msg);
        }
      }
    }
  };

  //显示发票抬头列表
  renderItem = (data) => (
    <SwipeAction autoClose style={{backgroundColor: 'transparent'}}>
      <RadioItem
        key={data.item.entTaxId}
        checked={data.item.entTaxId === this.state.entItem.entTaxId}
        onChange={(event) => {
          if (event.target.checked) {
            this.onChange(data);
          }
        }}>
        {data.item.entName}
      </RadioItem>
    </SwipeAction>
  );

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

  // 处理网络请求数据
  abnormalMessage = async (jason) => {
    if (jason.code === 401) {
      await Alert.alert(
        '登录失效',
        '登录状态已失效，请重新登录！',
        [
          {
            text: '确定',
            onPress: () => {
              CleanAll();
              this.props.navigation.popToTop();
            },
          },
        ],
        {cancelable: false},
      );
    }
    if (jason.code === 403) {
      Alert.alert(
        '权限',
        '暂无权限操作此模块！',
        [
          {
            text: '确定',
            onPress: () => {
              this.props.navigation.goBack();
            },
          },
        ],
        {cancelable: false},
      );
    }
    if (jason.code !== 401 && jason.code !== 403) {
      ToastShow(1, jason.msg);
    }
  };
}