/*
FileName:UserMyTask.js
Version:1.0.0
Purpose:Getting the List of all the lsit of mytaks list 
Devloper:Mahesh Reddy
*/

import React, { Component } from 'react';
import { Platform, StyleSheet, Text, View, StatusBar, TextInput, Dimensions, RefreshControl, Image, Picker, TouchableOpacity, Keyboard, KeyboardAvoidingView, TouchableWithoutFeedback } from 'react-native';
import { Icon, Title, Button, Container, Content, Header, Right, Left, Body, Tab, Tabs, TabHeading, Footer, Item, Input, FooterTab } from 'native-base';
import Pending from '../UserComponents/UserPendingMyTask';
import InProgress from '../UserComponents/UserInProgressMyTask';
import Completed from '../UserComponents/UserCompletedMyTask';
import UserPendingRoadblock from '../UserComponents/UserPendingRoadblock';
import Modal from "react-native-simple-modal";
import DatePicker from 'react-native-datepicker';
import { MYTASK, PENDING, COMPLETED, BLOCKED, ADDMODULE, MODULE_TITLE, MODULEINFO } from '../CommonComponents/Header'
import log from '../LogFile/Log';
import AsyncStorage from '@react-native-community/async-storage';
import { API } from "../WebServices/RestClient";
import NetInfo from '@react-native-community/netinfo';
import Snackbar from 'react-native-snackbar';
import jwt_decode from "jwt-decode";
import ModalSelector from 'react-native-modal-selector';
import moment from "moment";
import { widthPercentageToDP as wp, heightPercentageToDP as hp } from 'react-native-responsive-screen';

// import { Dropdown } from 'react-native-material-dropdown';
import UserDatabase from '../OfflineDB/UserDatabase';
const db = new UserDatabase();
export default class MyTask extends Component {
    constructor(props) {
        super(props);

        this.state = {
            isLoading: true,
            profileInfo: [],
            data2: [],
            empstatus: '',
            city: null,
            mobile: '',
            dataSource: [],
            squadName: '',
            resource: [],
            moduleDesc: '',
            moduleId: '',
            refreshing: false

        }

        AsyncStorage.getItem("cropcode", (err, res) => {
            this.setState({ squadName: res });
            console.warn("squadname" + this.state.squadName);
            // alert(this.state.squadName)
        });
    }

    //Dialog Actions start
    moveUp = () => this.setState({ offset: -100 });

    resetPosition = () => this.setState({ offset: 0 });

    openModal = () => this.setState({ open: true });

    //close dialog
    closeModal = () => {
        this.setState({
            open: false, error1: '', startDate: '', targetDate: ''
        });
        this.setState({ modulename: '' })
    }
    //Dialog Actions close
    componentDidMount() {
        this.GetStatus();
        this.getSprints();
        this.getActive();
    }

    //For store Agile projects for offline Start
    addAgileProjects(data) {
        // console.warn("hello naveen" + JSON.stringify(data));
        db.addAgileProjects(data).then((result) => {
            console.log(result);
        }).catch((err) => {
            console.log(err);
        })
    }

    //Refresh the data
    onRefresh() {

        this.setState({
            cropcode: ''
        })


        // this.getRequestedIdeas(this.state.role, this.state.userToken, this.state.cropcode);
    }
    //For store Agile projects for offline End
    //For Getting offline Project List Start
    getAgileProjects() {
        db.getAgileProjects().then((data) => {
            // console.warn("AgileProjectsList" + JSON.stringify(data))
            this.setState({
                dataSource: data,
            });
        }).catch((err) => {
        })
    }
    //For Getting offline Project List End

    //For store Sprints or offline Start
    addOfflineSprints(sprints, projectName) {
        db.addSprints(sprints, projectName).then((result) => {
            console.log(result);
        }).catch((err) => {
            console.log(err);
        })
    }
    //For store Sprints for offline End
    //For Getting offline Sprints List Start
    getOfflineSprints() {
        AsyncStorage.getItem("cropcode", (err, res) => {
            const projectName = res;
            db.getSprints(projectName).then((data) => {
                console.warn("SprintsList" + JSON.stringify(data))
                this.setState({
                    resource: data,
                });
            }).catch((err) => {
            })
        });
    }
    //For Getting offline Sprints List End
    //For Getting offline Active Sprints List Start
    getOfflineActiveSprints(backlogsStatus) {
        AsyncStorage.getItem("cropcode", (err, res) => {
            const projectName = res;
            db.getActiveSprint(projectName).then((data) => {
                console.warn("Active Sprint" + JSON.stringify(data[0].key))
                this.setState({
                    moduleId: data[0].key,
                    moduleDesc: data[0].label
                })
                AsyncStorage.setItem('moduleId', data[0].key);
                //   this.getAssignedBacklogs(backlogsStatus,data[0].key)
            }).catch((err) => {
                AsyncStorage.setItem('moduleId', '0');
                this.setState({
                    moduleId: '0',
                    moduleDesc: '',
                    isLoading: false,
                });
            })
        });
    }
    //For Getting offline Active Sprints List End
    //get project list dropdown data
    GetStatus() {
        log("Info", "UserProfile:GetStatus() method is used to get status of employee");
        AsyncStorage.getItem("userToken", (err, res) => {
            const empId = res;
            NetInfo.fetch().then(state => {
                if (state.type == "none" || state.type == 'unknown' || state.type == 'undefined') {
                    // console.log(state.type);
                    Snackbar.show({
                        title: 'No Internet Connection',
                        backgroundColor: 'red',
                        duration: Snackbar.LENGTH_LONG,
                    });
                    this.getAgileProjects()//For Getting Project List in Offline
                } else {

                    fetch(API + 'squads.php', {
                        method: 'POST',
                        headers: {
                            Accept: 'application/json',
                            'Content-Type': 'application/json',
                        },
                        body: JSON.stringify({

                            empId: empId,
                            action: 'get_squads',


                        })
                    })
                        .then((response) => response.json())
                        .then((responseJson) => {
                            console.warn(responseJson)
                            // alert(JSON.stringify(responseJson))
                            if (responseJson.status == 'True') {
                                this.addAgileProjects(responseJson.data) //Project list store in offline
                                // this.setState({
                                //     isLoading: false,
                                //     dataSource: [...responseJson.data],
                                // }, function () {
                                //     // In this block you can do something with new state.
                                // });


                                var dataSource = [];
                                responseJson.data.map((epics) => {
                                    return (
                                        dataSource.push({
                                            'key': epics.value, 'label': epics.value
                                        })
                                    );
                                })

                                this.setState({
                                    dataSource: dataSource
                                });

                                // const data2 = [];

                                // responseJson.data.map(x => {
                                //     data2.push({ label: x.value, value: x.value })
                                // })
                                // this.setState({
                                //     data2: data2,
                                // })
                                // console.warn("Hello" + JSON.stringify(data2))

                                // this.setState({
                                //     data2: responseJson.data
                                // });
                                // console.warn(this.state.data2);
                            } else {
                                this.setState({
                                    dataSource: dataSource
                                });
                                log("Warn", "status of employee is not available");
                            }
                        })
                        .catch((error) => {
                            console.error(error);
                            log("Error", "error in  getting status of employee");
                        });
                }
            });
        });

    }

    // Update Status of Employee
    UpdateStatus(squadName) {
        // const { squadName } = this.state;
        log("Info", "UserProfile:UpdateStatus(status) method is used to update status of employee");
        console.warn("Hello" + squadName);

        AsyncStorage.getItem("userToken", (err, res) => {
            const empId = res;
            console.log(res);

            AsyncStorage.getItem("projectId", (err, res) => {
                const projectId = res;



                // console.log(cropcode);
                NetInfo.fetch().then(state => {
                    if (state.type == "none" || state.type == 'unknown' || state.type == 'undefined') {
                        console.log(state.type);
                        Snackbar.show({
                            title: 'No Internet Connection',
                            backgroundColor: 'red',
                            duration: Snackbar.LENGTH_LONG,
                        });
                        //for offline project switching start
                        this.setState({
                            squadName: squadName
                        });
                        AsyncStorage.setItem('cropcode', squadName);
                        this.getOfflineSprints()//Getting the List of offline Sprints
                        this.getOfflineActiveSprints("currentsprint") //Getting Current Sprint Backlogs in offline
                        //for offline project switching end
                    } else {

                        fetch(API + 'squad_login.php', {
                            method: 'POST',
                            headers: {
                                Accept: 'application/json',
                                'Content-Type': 'application/json',
                            },
                            body: JSON.stringify({
                                username: empId,
                                corp: squadName,
                                projectId: projectId

                            })
                        })
                            .then((response) => response.json())
                            .then((responseJson) => {
                                console.warn(JSON.stringify(responseJson))

                                if (responseJson.status == 'TRUE') {
                                    AsyncStorage.setItem('auth', responseJson.jwt) //store the token information  with exp
                                    const tokenDetails = jwt_decode(responseJson.jwt);
                                    console.log(tokenDetails.data)
                                    AsyncStorage.setItem('roleCount', tokenDetails.data.roleCount)
                                    // dispatch(setCurrentUser(tokenDetails.data)); //store the user information
                                    AsyncStorage.setItem('status', tokenDetails.data.empStatus)


                                    AsyncStorage.setItem('userToken', tokenDetails.data.empId);
                                    AsyncStorage.setItem('userName', tokenDetails.data.userName);
                                    AsyncStorage.setItem('emp_role', tokenDetails.data.role);
                                    AsyncStorage.setItem('cropcode', tokenDetails.data.corp);
                                    AsyncStorage.setItem('projectId', tokenDetails.data.projectId);
                                    this.getSprints();
                                    this.getActive();
                                    // alert("project changed")
                                    // this.props.navigation.navigate('UserProfile');
                                    // console.warn("HI" + empstatus)
                                    this.setState({

                                        squadName: squadName
                                    });
                                    //  alert("Project Changed Successfully")


                                } else {
                                    //    alert("user already exist");
                                    log("Warn", "status of employee is not able to update");
                                }

                            })
                            .catch((error) => {
                                console.warn(error);
                                log("Error", "error in updating status of employee");
                            });
                    }
                });
            });
        });

    }

    // Update Sprint 
    UpdateSprint(squadName) {
        // const { squadName } = this.state;
        log("Info", "UpdateSprint method is used to update sprint to change the data");
        console.warn("Hello" + squadName);

        AsyncStorage.getItem("userName", (err, res) => {
            const userName = res;
            console.log(res);



            // console.log(cropcode);
            NetInfo.fetch().then(state => {
                if (state.type == "none" || state.type == 'unknown' || state.type == 'undefined') {
                    console.log(state.type);
                    Snackbar.show({
                        title: 'No Internet Connection',
                        backgroundColor: 'red',
                        duration: Snackbar.LENGTH_LONG,
                    });
                } else {

                    fetch(API + 'squadLogin.php', {
                        method: 'POST',
                        headers: {
                            Accept: 'application/json',
                            'Content-Type': 'application/json',
                        },
                        body: JSON.stringify({
                            username: userName,
                            crop: squadName,

                        })
                    })
                        .then((response) => response.json())
                        .then((responseJson) => {
                            console.warn(JSON.stringify(responseJson))

                            if (responseJson.status == 'TRUE') {
                                AsyncStorage.setItem('auth', responseJson.jwt) //store the token information  with exp
                                const tokenDetails = jwt_decode(responseJson.jwt);
                                console.log(tokenDetails.data)
                                AsyncStorage.setItem('roleCount', tokenDetails.data.roleCount)
                                // dispatch(setCurrentUser(tokenDetails.data)); //store the user information
                                AsyncStorage.setItem('status', tokenDetails.data.empStatus)


                                AsyncStorage.setItem('userToken', tokenDetails.data.empId);
                                AsyncStorage.setItem('userName', tokenDetails.data.userName);
                                AsyncStorage.setItem('emp_role', tokenDetails.data.role);
                                AsyncStorage.setItem('cropcode', tokenDetails.data.corp);
                                // alert("project changed")
                                // this.props.navigation.navigate('UserProfile');
                                // console.warn("HI" + empstatus)
                                this.setState({

                                    squadName: squadName
                                });
                                //  alert("Project Changed Successfully")


                            } else {
                                //    alert("user already exist");
                                log("Warn", "status of employee is not able to update");
                            }

                        })
                        .catch((error) => {
                            console.warn(error);
                            log("Error", "error in updating status of employee");
                        });
                }
            });
        });

    }


    //Validatios
    isValid() {
        const { modulename, startDate, targetDate } = this.state;
        let valid = false;
        // alert(moment(startDate).format('YYYY.MM.DD')+"date"+targetDate);
        if (modulename === 'undefined') {
            log("Warn", "module name should not be empty");
            alert("Enter Module Title")
            // ToastAndroid.showWithGravity('"Enter sub Task', ToastAndroid.SHORT,ToastAndroid.CENTER);
            this.setState({ error1: 'Module Title ' });
        }
        else if (startDate.length === 0) {
            log("Warn", "module name should not be empty");
            alert("Select start date")
            // ToastAndroid.showWithGravity('"Enter sub Task', ToastAndroid.SHORT,ToastAndroid.CENTER);
            // this.setState({ error1: 'Module Title ' });
        }


        else if (targetDate.length === 0) {
            log("Warn", "module name should not be empty");
            alert("Select target date")
            // ToastAndroid.showWithGravity('"Enter sub Task', ToastAndroid.SHORT,ToastAndroid.CENTER);
            // this.setState({ error1: 'Module Title ' });
        }
        else if (startDate >= targetDate) {
        // else if (moment(startDate).format('MM.DD.YYYY') >= moment(targetDate).format('YYYY.MM.DD')) {
            log("Warn", "Start date should not be less than or equal to  End date");
            alert("Start date should not be less than or equal to  End date")
            // ToastAndroid.showWithGravity('"Enter sub Task', ToastAndroid.SHORT,ToastAndroid.CENTER);
            // this.setState({ error1: 'Module Title ' });
        }

        else {
            valid = true;
        }
        return valid;
    }
    //Add the new Module
    addModule() {

        const { modulename, startDate, targetDate } = this.state;
        const { idea_id } = this.state;
        console.log("idea_id" + idea_id);
        console.log("modulename" + modulename);
        console.warn("startDate" + startDate);
        console.warn("targetDate" + targetDate);

        //getting cropcode,usertoken(emp id)
        AsyncStorage.multiGet(["cropcode", "userToken"], (err, response) => {
            const cropcode = response[0][1];
            const userToken = response[1][1];
            console.log("userToken" + userToken);
            console.log("cropcode" + cropcode);
            AsyncStorage.getItem("projectId", (err, res) => {
                const projectId = res;
                NetInfo.fetch().then(state => {
                    if (state.type == "none") {
                        console.log(state.type);
                        log("Warn", "No internet connection");
                        Snackbar.show({
                            title: 'No Internet Connection',
                            backgroundColor: 'red',
                            duration: Snackbar.LENGTH_LONG,
                        });
                    }
                    else {

                        if (this.isValid()) {
                            this.setState({ itemPressedDisabled: true })
                            fetch(API + 'manage_sprints.php',
                                {
                                    method: 'POST',
                                    headers: {
                                        Accept: 'application/json',
                                        'Content-Type': 'application/json',
                                    },
                                    body: JSON.stringify({
                                        action: 'add',
                                        // idea_id: idea_id,

                                        crop: cropcode,
                                        module_Name: modulename,
                                        startDate: startDate,
                                        targetDate: targetDate,
                                        empId: userToken,
                                        projectId: projectId

                                    })
                                })
                                .then((response) => response.json())
                                .then((responseJson) => {
                                    console.warn("Sprint Added" + JSON.stringify(responseJson))
                                    // this.refs.toast.show('Sprint Added', Toast.Duration.long, Toast.Position.center);
                                    if (responseJson.status == 'True') {
                                        this.setState({ itemPressedDisabled: false })
                                        this.setState({ open: false, error1: '', startDate: '', targetDate: '', });
                                        alert("Sprint Added")
                                        // this.getModules();
                                        this.getSprints();
                                        this.getActive();
                                        this.UpdateSprint();
                                    }

                                })
                                .catch((error) => {
                                    console.error(error);
                                    log("Error", "error in project adding");
                                });
                            this.closeModal();
                        }
                    }
                });
            });
        });

    }


    //getting the Employees list for addind maintask
    getSprints() {
        log("Info", " getEmployees(cropcode) is used for getting the Employees list for addind maintask");
        const { ModuleId } = this.state;
        const { ideaid } = this.state;
        AsyncStorage.getItem("projectId", (err, res) => {
            const projectId = res;
            // alert(projectId)

            AsyncStorage.getItem("cropcode", (err, res) => {
                const cropcode = res;
                // alert(cropcode)
                NetInfo.fetch().then(state => {
                    if (state.type == "none") {
                        console.log(state.type);
                        log("Warn", "No internet connection");
                        Snackbar.show({
                            title: 'No Internet Connection',
                            backgroundColor: 'red',
                            duration: Snackbar.LENGTH_LONG,
                        });
                    } else {
                        fetch(API + 'getUpdateSprint.php',
                            {
                                method: 'POST',
                                headers: {
                                    Accept: 'application/json',
                                    'Content-Type': 'application/json',
                                },
                                body: JSON.stringify({
                                    crop: cropcode,
                                    action: "getModules",
                                    projectId: projectId,

                                })
                            })
                            .then((response) => response.json())

                            .then((responseJson) => {
                                // alert(JSON.stringify(responseJson))
                                if (responseJson.status === 'True') {
                                    console.warn("Sprints from active sprint board" + JSON.stringify(responseJson))
                                    // alert(JSON.stringify(responseJson))
                                    var sprintDetails = [];

                                    responseJson.data.map((sprints) => {
                                        const [year, month, date] = sprints.startDate.split('-');
                                        const [year1, month1, date1] = sprints.targetDate.split('-');
                                        return (
                                            sprintDetails.push({ 'key': sprints.moduleId, 'epicId': sprints.ideaId, 'label': sprints.moduleDesc })
                                        );
                                    })
                                    this.addOfflineSprints(sprintDetails, cropcode)//Store Sprint List in Offline
                                    this.setState({
                                        resource: sprintDetails
                                    });
                                }
                            })
                            .catch((error) => {
                                console.error(error);
                                log("Error", "requested projects error");
                            });
                    }
                });
            });
        });
    }
    //to get the active sprint list
    getActive() {
        log("Info", "UserCompletedMyTask:userCompletedMyTasks() method is used to get completed my tasks at user side");
        AsyncStorage.getItem("cropcode", (err, res) => {
            const cropcode = res;

            AsyncStorage.getItem("userToken", (err, res) => {
                const empId = res;

                AsyncStorage.getItem("emp_role", (err, res) => {
                    const emp_role = res;

                    AsyncStorage.getItem("projectId", (err, res) => {
                        const projectId = res;

                        //Checking the Internet Connection
                        NetInfo.addEventListener(state => {
                            if (state.type == "none" || state.type == 'unknown' || state.type == 'undefined') {
                                console.log(state.type);
                                Snackbar.show({
                                    title: 'No Internet Connection',
                                    backgroundColor: 'red',
                                    duration: Snackbar.LENGTH_LONG,
                                });
                                this.getOfflineSprints()//Getting the List of offline Sprints
                                this.getOfflineActiveSprints("currentsprint") //Getting Current Sprint Backlogs in offline
                            } else {

                                fetch(API + 'getUpdateSprint.php',
                                    {
                                        method: 'POST',
                                        headers: {
                                            Accept: 'application/json',
                                            'Content-Type': 'application/json',
                                        },
                                        body: JSON.stringify({
                                            crop: cropcode,
                                            action: "get_sprints",
                                            projectId: projectId,
                                            // userType: emp_role,
                                            // empId: empId,
                                            // moduleId:moduleId,
                                        })
                                    })
                                    .then((response) => response.json())
                                    .then((responseJson) => {
                                        console.log(responseJson);
                                        // alert(JSON.stringify(responseJson))
                                        console.warn("module id setting" + JSON.stringify(responseJson))
                                        if (responseJson.connection === 'connected ') {
                                            if (responseJson.status === 'True') {
                                                // this.getSubtaskListPending(responseJson.data) //For store pending subtaskslist from offline
                                                this.setState({
                                                    isLoading: false,
                                                    // dataSource: responseJson.data,
                                                    isFetching: false,
                                                    moduleId: responseJson.data[0].moduleId,
                                                    moduleDesc: responseJson.data[0].moduleDesc
                                                }, function () {
                                                });
                                                AsyncStorage.setItem('moduleId', responseJson.data[0].moduleId);
                                                //this.getSubtaskListPending(responseJson.data[0].moduleId)
                                                // this.arrayholder = responseJson.data;

                                            } else {

                                                log("Info", "No ToDo List");
                                                // this.arrayholder = [];
                                                this.setState({
                                                    isLoading: false,
                                                    moduleId: '0',
                                                    moduleDesc: '',
                                                    resource: []
                                                })
                                                Snackbar.show({
                                                    title: 'No ToDo List',
                                                    backgroundColor: '#3BB9FF',
                                                    duration: Snackbar.LENGTH_LONG,
                                                });
                                            }
                                        }
                                        else {
                                            this.props.navigation.navigate('Maintenance');
                                        }
                                    })
                                    .catch((error) => {
                                        console.error(error);
                                        check.Maintenance();
                                        log("Error", "Error in getting of completed my tasks at user side");
                                    });

                            }
                        });

                    });

                });
            });

        });
    }



    render() {
        return (

            <Container>
                <Header
                    androidStatusBarColor="#00A2C1"
                    style={{
                        backgroundColor: '#00A2C1',
                        height: 60,
                        width: Dimensions.get('window').width,
                        borderBottomColor: '#ffffff',
                        justifyContent: 'space-between',
                    }}>
                    <View style={{ marginTop: 20 }}>
                        <Icon name="md-menu" size={25} style={{ color: 'white', }} onPress={() =>
                            this.props.navigation.toggleDrawer()} />
                    </View>

                    <View style={{ width: 300, borderRadius: 20, height: 45, marginTop: 5, flexDirection: 'row' }}>


                        <ModalSelector
                            style={{ width: 260, backgroundColor: 'transparent', borderColor: 'transparent', marginLeft: 60 }}
                            data={this.state.dataSource}
                            initValue={this.state.squadName}
                            optionContainerStyle={{ backgroundColor: 'white' }}
                            onChange={(itemValue) => { this.UpdateStatus(itemValue.label) }} >
                            <View style={{ width: 300, borderRadius: 20, height: 45, marginTop: 5, flexDirection: 'row' }}>
                                <Text style={{ marginTop: 15, color: 'white', width: 80 }}>PROJECT : </Text>

                                <Text style={{ marginTop: 15, color: 'white', width: 120, }}>{this.state.squadName}</Text>

                                <Icon name="md-chevron-down-outline" size={25} style={{ color: 'white', marginTop: 10, }}
                                />
                            </View>

                        </ModalSelector>


                    </View>

                </Header>
                <Header
                    androidStatusBarColor="#00A2C1"
                    style={{
                        backgroundColor: '#00A2C1',
                        height: 55,
                        width: Dimensions.get('window').width,
                        borderBottomColor: '#ffffff',
                        justifyContent: 'space-between',
                    }}>
                    <View style={{ marginTop: 20 }}>

                    </View>

                    <View style={{ width: 300, borderRadius: 20, height: 45, marginTop: 5, flexDirection: 'row' }}>


                        <ModalSelector
                            style={{ width: 260, backgroundColor: 'transparent', borderColor: 'transparent', marginLeft: 60 }}
                            data={this.state.resource}
                            optionContainerStyle={{ backgroundColor: 'white' }}
                            initValue="listType with FlatList"
                            initValueTextStyle={{ color: "black" }}
                            disabled={this.state.resource.length === 0 ? true : false}
                            onChange={(itemValue) => {
                                this.setState({
                                    moduleId: itemValue.key,
                                    moduleDesc: itemValue.label,

                                }),
                                    // }),
                                    AsyncStorage.setItem('moduleId', itemValue.key);
                                // alert("hello"+this.state.moduleId);


                            }}
                        >

                            <View style={{ width: 300, borderRadius: 20, backgroundColor: '#00A2C1', height: 45, flexDirection: 'row' }}>

                                <Text style={{ marginTop: 5, color: 'white', width: 80 }}>SPRINT : {this.state.sprintDesc}</Text>

                                {this.state.resource.length === 0 ? <Text style={{ marginTop: 5, color: 'white', width: 120, }}>No Sprints</Text> : <Text style={{ marginTop: 5, color: 'white', width: 120, }}>{this.state.moduleDesc}</Text>}
                                <Icon name="md-chevron-down-outline" size={25} style={{ color: 'white', marginTop: 5, }}
                                />
                            </View>

                        </ModalSelector>


                    </View>

                </Header>
                {this.state.resource.length === 0 ? <Image style={{ width: "30%", height: "20%", alignSelf: 'center', marginTop: '50%' }} source={require('../Images/nosprint.png')} /> :
                    <Tabs tabBarUnderlineStyle={{ borderBottomWidth: 0 }}>
                        <Tab options={{ unmountOnBlur: true }} heading={<TabHeading style={{ backgroundColor: '#00A2C1' }}><Text style={{ color: '#fff' }}>To Do</Text></TabHeading>}>
                            <Pending navigation={this.props.navigation} />

                        </Tab>
                        <Tab options={{ unmountOnBlur: true }} heading={<TabHeading style={{ backgroundColor: '#00A2C1' }}><Text style={{ color: '#fff' }}>In Progress</Text></TabHeading>}>
                            <InProgress navigation={this.props.navigation} />

                        </Tab>

                        <Tab options={{ unmountOnBlur: true }} heading={<TabHeading style={{ backgroundColor: '#00A2C1' }}><Text style={{ color: '#fff' }}>{BLOCKED}</Text></TabHeading>}>
                            <UserPendingRoadblock navigation={this.props.navigation} />

                        </Tab>

                        <Tab options={{ unmountOnBlur: true }} heading={<TabHeading style={{ backgroundColor: '#00A2C1' }}><Text style={{ color: '#fff' }}>{COMPLETED}</Text></TabHeading>}>
                            <Completed navigation={this.props.navigation} />

                        </Tab>

                    </Tabs>}


                {/* <TouchableOpacity onPress={this.openModal} style={styles.bottomView}>
              <View style={styles.bottomView} >
                <Icon

                  name='lightbulb-o'
                  color='white'
                  type='MaterialCommunityIcons'
                  size={30}
                />

                <Text style={styles.textStyle}>Add Sprint</Text>


              </View>
            </TouchableOpacity> */}
            {(this.state.emp_role !== "Contributor") &&
           
                <View style={styles.bottomView} >
                    <TouchableOpacity onPress={this.openModal} >
                        {/* <Icon name='lightbulb-o'color='white' type='MaterialCommunityIcons' size={30} /> */}
                        <Text style={styles.textStyle}>{ADDMODULE}</Text>
                    </TouchableOpacity>
                </View>


        }

                <Modal
                    offset={this.state.offset}
                    closeOnTouchOutside={false}
                    open={this.state.open}
                    modalDidOpen={this.modalDidOpen}
                    modalDidClose={this.modalDidClose}
                    style={{ alignItems: "center" }} >
                    <View style={{ alignItems: "center", }}>

                        <Text>{MODULEINFO}</Text>

                        <TextInput placeholder={MODULE_TITLE}
                            style={{ height: 40, borderBottomWidth: 1, borderBottomColor: 'black', width: 300, marginTop: 10 }}
                            onChangeText={(text) => this.setState({ modulename: text })

                            }
                            value={this.state.modulename} />
                        <Text style={{ color: 'red', alignItems: 'flex-start', alignSelf: 'flex-start', justifyContent: 'flex-start', marginLeft: 25 }}>{this.state.error1}</Text>


                    </View>
                    <DatePicker
                        style={{ textAlign: 'left', marginLeft: 10, borderColor: '#b6b6b6', borderWidth: 1, width: '90%', height: 40, borderRadius: 10, marginTop: 5 }}
                        date={this.state.startDate}
                        mode="date"
                        placeholder="From Date"
                        format="MM.DD.YYYY"
                        // minDate="2020-01-01"
                        // maxDate="2080-12-31"
                        // minDate="01-01-2019"
                        // maxDate="01-06-2075"
                        confirmBtnText="Ok"
                        cancelBtnText=""
                        showIcon={false}
                        customStyles={{
                            dateInput: { borderWidth: 0, borderBottomWidth: 2 },
                            placeholderText: { fontSize: 15, color: "#9a73ef" },
                            dateText: { textAlign: 'left', fontSize: 15, }
                        }}
                        onDateChange={(text) => this.setState({ startDate: text })} />
                    <DatePicker
                        style={{ textAlign: 'left', marginLeft: 10, marginTop: 5, borderColor: '#b6b6b6', borderWidth: 1, width: '90%', height: 40, borderRadius: 10, marginTop: 5 }}
                        date={this.state.targetDate}
                        mode="date"
                        placeholder="To Date"
                        format="MM.DD.YYYY"
                        // minDate="2020-01-01"
                        // maxDate="2080-12-31"
                        // minDate="01-01-2019"
                        // maxDate="01-06-2075"
                        confirmBtnText="Ok"
                        cancelBtnText=""
                        showIcon={false}
                        customStyles={{
                            dateInput: { borderWidth: 0, borderBottomWidth: 2 },
                            placeholderText: { fontSize: 15, color: "#9a73ef" },
                            dateText: { textAlign: 'left', fontSize: 15, }
                        }}
                        onDateChange={(text) => this.setState({ targetDate: text })} />
                    <View style={{ flexDirection: 'row', alignItems: 'center', justifyContent: 'center', alignSelf: 'center', }}>
                        <TouchableOpacity style={styles.opensave} onPress={this.addModule.bind(this)} disabled={this.state.itemPressedDisabled}>
                            <Text style={{ color: 'white' }}>SAVE</Text>
                        </TouchableOpacity>
                        <TouchableOpacity style={styles.opencancel} onPress={this.closeModal} >
                            <Text style={{ color: 'white' }}>CANCEL</Text>
                        </TouchableOpacity>

                    </View>

                </Modal>

                {/* </View> */}

            </Container>

        );
    }
}
const styles = StyleSheet.create(
    {
        bottomView: {
            flex: 1,
            ...Platform.select({
                ios: {
                    flexDirection: 'row',
                    justifyContent: 'center',
                    position: 'absolute',
                    // height: FOOTER_MAX_HEIGHT,
                    bottom: 0,
                    left: 0,
                    right: 0,
                    backgroundColor: 'black',
                    alignItems: 'center'
                },
                android: {
                    flexDirection: 'row',
                    justifyContent: 'center',
                    position: 'absolute',
                    // height: FOOTER_MAX_HEIGHT,
                    bottom: 0,
                    left: 0,
                    right: 0,
                    backgroundColor: 'black',
                    alignItems: 'center'
                },
            }),
        },

        textStyle: {
            color: '#fff',
            fontSize: 18,
            // backgroundColor:'#00a2c1',
            paddingLeft: 10,
            paddingRight: 10,
            paddingBottom: 5,
            paddingTop: 5,
            borderRadius: 5,

        },

        opencancel: {
            flex: 1,
            ...Platform.select({
                ios: {
                    backgroundColor: 'red', margin: 20, height: 30, alignItems:
                        "center", justifyContent: 'center'
                },
                android: {
                    backgroundColor: 'red', margin: 20, height: 30, alignItems:
                        "center", justifyContent: 'center'
                },
            }),
        },
        opensave: {
            flex: 1,
            ...Platform.select({
                ios: {
                    backgroundColor: 'green', margin: 20, height: 30, alignItems:
                        "center", justifyContent: 'center'
                },
                android: {
                    backgroundColor: 'green', margin: 20, height: 30, alignItems:
                        "center", justifyContent: 'center'
                },
            }),
        },

    });
const pickerSelectStyles = StyleSheet.create({
    inputIOS: {
        fontSize: 2,
        paddingVertical: 12,
        paddingHorizontal: 10,
        borderWidth: 1,
        borderColor: 'blue',
        borderRadius: 4,
        color: 'black',
        paddingRight: 30, // to ensure the text is never behind the icon
    },
    inputAndroid: {
        fontSize: 1,
        paddingHorizontal: 10,
        paddingVertical: 8,
        borderWidth: 0.5,
        borderColor: 'black',
        borderRadius: 8,
        color: 'black',
        paddingRight: 30, // to ensure the text is never behind the icon
        // backgroundColor:'pink'
    },
});