import React from 'react';
import { Image, Platform, ScrollView, StyleSheet, Text, Button, TextInput, TouchableOpacity, View, Slider, ImageBackground, Dimensions, Alert, StatusBar, FlatList, AppState, BackHandler, AsyncStorage, ActivityIndicator, ToastAndroid, RefreshControl, TouchableWithoutFeedback, Switch } from 'react-native';
import { createDrawerNavigator, DrawerItems } from 'react-navigation-drawer';
import { SearchBar } from 'react-native-elements';
import { FontAwesome, Entypo, MaterialIcons, Ionicons, AntDesign } from '@expo/vector-icons';
import Constants from 'expo-constants';
import { withNavigationFocus, DrawerActions, DrawerNavigator } from 'react-navigation';
import settings from './Constants.js';
import Toast, { DURATION } from 'react-native-easy-toast';
import Carousel, { Pagination } from 'react-native-snap-carousel'; // import { Switch } from 'react-native-switch';

import Modal from "react-native-modal";
import { Searchbar } from 'react-native-paper';
import * as Permissions from 'expo-permissions';
import { BarCodeScanner } from 'expo-barcode-scanner';
import { Card } from 'react-native-elements';
import { HttpsClient } from './HttpsClient.js';
import { RadioButton } from 'react-native-paper';
const {
  width,
  height
} = Dimensions.get('window');
const SERVER_URL = settings.url;
import i18n from 'i18n-js';
import * as Localization from 'expo-localization';

class OldEmployees extends React.Component {
  constructor(props) {
    super(props);

    this.changeVal = () => {
      this.setState({
        bool: !this.state.bool
      });
    };

    this.setServerurl = async () => {
      const SERVER_URL = await AsyncStorage.getItem('SERVER_URL');
      this.setState({
        SERVER_URL: SERVER_URL
      });
    };

    this.getUser = async () => {
      const SERVER_URL = await AsyncStorage.getItem('SERVER_URL');
      const userToken = await AsyncStorage.getItem('userpk');
      const sessionid = await AsyncStorage.getItem('sessionid');
      const csrf = await AsyncStorage.getItem('csrf');

      if (userToken == null) {
        return;
      }

      fetch(SERVER_URL + '/api/HR/users/' + userToken + '/', {
        headers: {
          "Cookie": "csrf=" + csrf + "; sessionid=" + sessionid + ";",
          'Accept': 'application/json',
          'Content-Type': 'application/json',
          'Referer': SERVER_URL,
          'X-CSRFToken': csrf
        }
      }).then(response => response.json()).then(responseJson => {
        if (responseJson.designation != null) {
          this.getEmployeeList(responseJson.designation.division);
        }
      }).catch(error => {
        return;
      });
    };

    this.getEmployeeList = async division => {
      // division=&designation__division=2&
      var url = SERVER_URL + '/api/HR/exitManagement/?is_exited=true';
      var data = await HttpsClient.get(url);
      console.log(data.data, 'fnsdfj');

      if (data.type == 'success') {
        this.setState({
          employeeList: data.data
        });
      } else {
        return;
      }
    };

    this.renderFooter = () => {
      if (this.state.loadmore) {
        return /*#__PURE__*/React.createElement(View, {
          style: {
            alignItems: 'center',
            justifyContent: 'center',
            marginTop: 20
          }
        }, /*#__PURE__*/React.createElement(TouchableOpacity, {
          style: {
            paddingHorizontal: 15,
            paddingVertical: 8,
            backgroundColor: themeColor
          },
          onPress: () => {
            this.getEmployeeList();
          }
        }, /*#__PURE__*/React.createElement(Text, {
          style: {
            color: '#fff',
            fontSize: 16
          }
        }, "Load More")));
      } else {
        return null;
      }
    };

    this.save = async (item, index) => {
      var employeeList = this.state.employeeList;
      var sendData = {
        isDashboard: !item.profile.isDashboard,
        bodyType: 'formData'
      };
      var serverurl = SERVER_URL + '/api/HR/profileAdminMode/' + item.profile.pk + '/';
      var data = await HttpsClient.patch(serverurl, sendData);
      console.log(sendData, 'dfbsbn', data, serverurl, item);

      if (data.type == 'success') {
        employeeList[index].profile = data.data;
        this.setState({
          employeeList
        });
      } else {
        return;
      }
    };

    this.state = {
      loadmore: false,
      offset: 0,
      SERVER_URL: null,
      bool: false,
      employeeList: []
    };
    willFocus = props.navigation.addListener('didFocus', payload => {
      this.changeVal();
      this.getEmployeeList();
    });
  }

  componentDidMount() {
    this.setServerurl();
    this.getUser();
  }

  render() {
    const {
      scanned
    } = this.state;
    return /*#__PURE__*/React.createElement(View, {
      style: {
        flex: 1,
        backgroundColor: '#f3f3f3'
      }
    }, /*#__PURE__*/React.createElement(Toast, {
      style: {
        backgroundColor: 'grey'
      },
      textStyle: {
        color: '#fff'
      },
      ref: "toast",
      position: "top"
    }), /*#__PURE__*/React.createElement(View, {
      style: {
        height: Constants.statusBarHeight,
        backgroundColor: '#142e5c'
      }
    }), /*#__PURE__*/React.createElement(View, {
      style: {
        flex: 1
      }
    }, /*#__PURE__*/React.createElement(View, {
      style: {
        height: 55,
        backgroundColor: '#f3f3f3'
      }
    }, /*#__PURE__*/React.createElement(View, {
      style: {
        flexDirection: 'row',
        height: 55,
        alignItems: 'center',
        backgroundColor: '#f3f3f3'
      }
    }, /*#__PURE__*/React.createElement(TouchableOpacity, {
      onPress: () => this.props.navigation.goBack(),
      style: {
        width: width * 0.15,
        alignItems: 'center',
        justifyContent: 'center'
      }
    }, /*#__PURE__*/React.createElement(MaterialIcons, {
      name: 'keyboard-backspace',
      size: 30,
      color: '#252525'
    })), /*#__PURE__*/React.createElement(View, {
      style: {
        width: width * 0.85,
        alignItems: 'center',
        justifyContent: 'center'
      }
    }, /*#__PURE__*/React.createElement(Text, {
      style: {
        color: '#252525',
        fontSize: 20,
        fontWeight: '700',
        textAlign: 'center',
        marginLeft: -(width * 0.15)
      }
    }, "Old Employees")))), /*#__PURE__*/React.createElement(ScrollView, {
      contentContainerStyle: {
        paddingBottom: 20
      }
    }, /*#__PURE__*/React.createElement(FlatList, {
      data: this.state.employeeList,
      contentContainerStyle: {
        paddingBottom: 60
      },
      keyExtractor: (item, index) => {
        return index.toString();
      },
      extraData: this.state,
      showsVerticalScrollIndicator: false,
      nestedScrollEnabled: true,
      ListFooterComponent: this.renderFooter(),
      renderItem: ({
        item,
        index
      }) => {
        var logo = '';

        if (logo != null && logo != undefined) {
          logo = item.logo;
        }

        return /*#__PURE__*/React.createElement(TouchableWithoutFeedback, {
          onPress: () => {}
        }, /*#__PURE__*/React.createElement(View, {
          style: {
            borderRadius: 25,
            backgroundColor: '#fff',
            marginVertical: 12,
            paddingVertical: 15,
            borderWidth: 1,
            borderColor: '#e2e2e2'
          }
        }, /*#__PURE__*/React.createElement(View, {
          style: {
            flexDirection: 'row'
          }
        }, /*#__PURE__*/React.createElement(View, {
          style: {
            flex: 0.2,
            alignItems: 'center'
          }
        }, /*#__PURE__*/React.createElement(Image, {
          source: item.user.profile.displayPicture == null ? null : {
            uri: item.user.profile.displayPicture
          },
          style: {
            height: width * 0.14,
            width: width * 0.14,
            borderRadius: width * 0.07,
            backgroundColor: '#f2f2f2'
          }
        })), /*#__PURE__*/React.createElement(View, {
          style: {
            flex: 0.8,
            flexDirection: 'row'
          }
        }, /*#__PURE__*/React.createElement(View, {
          style: {
            flex: 1
          }
        }, /*#__PURE__*/React.createElement(View, {
          style: {
            flexDirection: 'row',
            paddingBottom: 10
          }
        }, /*#__PURE__*/React.createElement(View, {
          style: {
            flex: 1
          }
        }, /*#__PURE__*/React.createElement(Text, {
          style: {
            color: '#000',
            fontSize: 16,
            fontWeight: '700'
          },
          numberOfLines: 3
        }, item.user.first_name, " ", item.user.last_name)), /*#__PURE__*/React.createElement(View, {
          style: {
            flex: 1,
            paddingHorizontal: 5,
            alignItems: 'center'
          }
        }, /*#__PURE__*/React.createElement(Text, {
          style: {
            color: '#909090',
            fontSize: 14,
            fontWeight: '600',
            paddingBottom: 5
          }
        }, item.user.designation.unit != null ? item.user.designation.unit.name : '', " ", item.user.designation.unit != null ? item.user.designation.unit.city : ''))), /*#__PURE__*/React.createElement(View, {
          style: {
            flexDirection: 'row',
            paddingBottom: 10
          }
        }, /*#__PURE__*/React.createElement(View, {
          style: {
            flex: 1,
            flexDirection: 'row'
          }
        }, /*#__PURE__*/React.createElement(Entypo, {
          name: "email",
          size: 18,
          color: "252525"
        }), /*#__PURE__*/React.createElement(Text, {
          style: {
            color: '#252525',
            fontSize: 14,
            fontWeight: '600',
            paddingHorizontal: 4
          }
        }, item.user.email))), /*#__PURE__*/React.createElement(View, {
          style: {
            flexDirection: 'row'
          }
        }, /*#__PURE__*/React.createElement(View, {
          style: {
            flex: 1,
            flexDirection: 'row'
          }
        }, /*#__PURE__*/React.createElement(FontAwesome, {
          name: "mobile",
          size: 20,
          color: "#252525"
        }), /*#__PURE__*/React.createElement(Text, {
          style: {
            color: '#252525',
            fontSize: 16,
            fontWeight: '600',
            paddingHorizontal: 4
          }
        }, item.user.profile.mobile))))))));
      }
    }))));
  }

}

OldEmployees.navigationOptions = ({
  navigation
}) => {
  const {
    params = {}
  } = navigation.state;
  return {
    header: null
  };
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'flex-start'
  },
  shadow: {
    shadowColor: "#000",
    shadowOffset: {
      width: 0,
      height: 2
    },
    shadowOpacity: 0,
    shadowRadius: 3.84,
    elevation: 3
  }
});
export default OldEmployees;