/**
 * Project iLinkWorld
 * File ModifierFeuilleSoinScreen
 * Path screens/wallet/agent
 * Created by BRICE ZELE
 * Date: 11/11/2021
 */
import React, {useEffect, useRef, useState} from 'react';
import {
    ActivityIndicator,
    Alert,
    Dimensions,
    FlatList,
    KeyboardAvoidingView,
    Platform,
    ScrollView,
    StyleSheet,
    TouchableOpacity,
    View,
} from 'react-native';
import {connect, useDispatch} from 'react-redux';
import Dialog from "react-native-dialog";
import _ from 'lodash';
import {Formik, useFormik} from 'formik';
import * as Yup from 'yup';
import {Color} from "../../../config/Color";
import I18n from 'react-native-i18n';
import {ScreenComponent} from "../../../components/ScreenComponent";
import Button from "../../../components/Button";
import {responsiveWidth} from "react-native-responsive-dimensions";
import {
    fetchActivePaySubscription,
    fetchCheckInsuranceCoverageAmount,
    fetchCheckInsuranceCoverageAmountReset,
    fetchCreateConsultation,
    fetchCreateConsultationReset,
    fetchExecutionPrescription,
    fetchExecutionPrescriptionReset,
    fetchGetAmountConsultation,
    fetchGetAmountConsultationReset,
    fetchGetConsultation,
    fetchGetConsultationReset,
    fetchGetDrugAppareil,
    fetchGetExclusion,
    fetchGetExclusionReset,
    fetchGetNetworkActs,
    fetchGetNetworkActsReset,
    fetchGetProviderClass,
    fetchGetProviderClassReset,
    fetchGetSubscriptionListReset,
    fetchGetUserByIdQRCode,
    fetchGetUserByIdQRCodeReset,
    fetchGetUserByNameOrNumber,
    fetchGetUserByNameOrNumberReset,
    fetchModifyPrescription,
    fetchModifyPrescriptionReset
} from "../../../redux/insurance/insurance.actions";
import DropdownAlert from "react-native-dropdownalert";
import {readUser} from "../../../webservice/AuthApi";
import TextInput from "../../../components/TextInput";
import {
    selectActivatePaySubscription,
    selectCheckInsuranceCoverageAmount,
    selectExecutionPrescription,
    selectGetAmountConsultation,
    selectGetConsultation,
    selectGetDrugAppareil,
    selectGetExclusion,
    selectGetNetworkAct,
    selectGetProviderClass,
    selectGetUserByIdQRCode,
    selectGetUserByIdQRCodeReducer,
    selectGetUserByNameOrNumber,
    selectGetUserByNameOrNumberReducer,
    selectModifyPrescription
} from "../../../redux/insurance/insurance.selector";
import StepHeader from "../../../components/StepHeaderComponent";
import Wizard from "react-native-wizard";
import Icon from "react-native-vector-icons/FontAwesome5";
import FontAwesome5 from "react-native-vector-icons/FontAwesome5";
import FontAwesome from "react-native-vector-icons/FontAwesome";
import Text from "../../../components/Text";
import SwitchSelector from "react-native-switch-selector";
import * as Animatable from "react-native-animatable";
import {Dropdown} from "react-native-material-dropdown-v2";
import Modal from "react-native-modal";
import QRCodeScanner from "react-native-qrcode-scanner";
import {RNCamera} from "react-native-camera";
import * as Utils from "../../../utils/UtilsFunction";
import {cutString, cutStringWithoutDot, uppercaseFirstLetter} from "../../../utils/UtilsFunction";
import {store} from "../../../redux/store";
import {Typography} from "../../../config/typography";
import DateTimePicker from "@react-native-community/datetimepicker";
import {createStructuredSelector} from "reselect";
import MaterialCommunityIcons from "react-native-vector-icons/MaterialCommunityIcons";
import Fontisto from "react-native-vector-icons/Fontisto";
import WebView from "react-native-webview";

let moment = require('moment-timezone');

const {width, height} = Dimensions.get('window');
const CIRCLE_SIZE = width * 0.5;

const styles = StyleSheet.create({
    textInput: {
        height: 46,
        backgroundColor: Color.fieldColor,
        borderRadius: 5,
        marginTop: 10,
        padding: 10,
        width: '100%',
    },
    lineRow: {
        flexDirection: 'row',
        justifyContent: 'space-between',
        paddingBottom: 20,
    },
    contain: {
        alignItems: 'center',
        marginTop: 40,
        paddingBottom: 20,
        paddingLeft: 20,
        paddingRight: 20,
        flex: 1,
    },
    circle: {
        width: CIRCLE_SIZE,
        height: CIRCLE_SIZE,
        borderRadius: CIRCLE_SIZE / 2,
        position: 'absolute',
        top: '15%',
    },
    circleContainer: {
        alignItems: 'flex-end',
        right: -(CIRCLE_SIZE / 3),
        top: -(CIRCLE_SIZE / 1.5),
    },
    lineSeparator: {
        borderWidth: 1,
        width: '40%',
        height: 1,
        alignSelf: 'center',
    },
    line: {
        width: 1,
        height: 14,
        backgroundColor: Color.grayColor,
        marginLeft: 10,
    },
    contentModeView: {
        width: 30,
        height: '100%',
        alignItems: 'flex-end',
        justifyContent: 'center',
    },
    contentFilter: {
        flexDirection: 'row',
        alignItems: 'center',
        marginLeft: 10,
    },
    bottomModal: {
        justifyContent: 'flex-end',
        margin: 0,
    },
    contentFilterBottom: {
        width: "100%",
        borderTopLeftRadius: 8,
        borderTopRightRadius: 8,
        paddingHorizontal: 20
    },
    contentSwipeDown: {
        paddingTop: 10,
        alignItems: 'center',
    },
    lineSwipeDown: {
        width: 30,
        height: 2.5,
        backgroundColor: Color.dividerColor,
    },
    contentActionModalBottom: {
        flexDirection: "row",
        paddingVertical: 10,
        marginBottom: 10,
        justifyContent: "space-between",
        borderBottomWidth: 1
    },
    containModal: {
        paddingVertical: 10,
        paddingHorizontal: 20,
        flexDirection: 'row',
        justifyContent: 'space-between',
    },
    floatingButtonAdd: {
        backgroundColor: Color.accentColor,
        position: "absolute",
        width: 25,
        bottom: 0,
        zIndex: 1000,
        right: 20,
        top: 35,
        height: 25,
        borderRadius: 12.5,
        alignItems: 'center',
        justifyContent: 'center',
    },
    contentSwitch: {
        width: responsiveWidth(40),
    },
    switch: {},
    choosePhotoBtn: {
        marginTop: 10,
        marginBottom: 10,
        width: "auto",
        height: "auto",
        padding: 5,
        alignItems: 'center',
        borderColor: Color.borderColor,
        marginRight: 10,
        elevation: 2,
    },
    checkbox: {
        alignSelf: "center",
        color: "white"
    },
    itemAmountPerMonth: {
        paddingLeft: 10,
        marginTop: 10,
        flexDirection: 'row',
    },
    dot: {
        width: 12,
        height: 12,
        borderRadius: 6
    },
    blockView: {
        paddingVertical: 10,
        borderBottomWidth: 0.5,
    },
    iconNavigation: {
        width: '100%',
        flexDirection: 'row',
        marginTop: 20,
        justifyContent: 'space-between',
        alignItems: 'center',
    },
    iconNavigationButton: {
        borderWidth: 1,
        borderRadius: 25,
        width: 50,
        height: 50,
        alignItems: 'center',
        justifyContent: 'center'
    },
    beneficiarySubSection: {
        marginTop: 10,
        flexDirection: 'row',
        width: '100%',
    },
    iconRight: {
        width: 70,
        flexDirection: 'row',
        justifyContent: 'space-between',
        alignItems: 'center',
    },
});

const ModifierFeuilleSoinScreen = ({
                                       subscriptionList,
                                       fetchGetUserByIdQRCode,
                                       fetchGetUserByNameOrNumber,
                                       fetchGetProviderClass,
                                       fetchGetConsultation,
                                       fetchGetDrugAppareil,
                                       fetchModifyPrescription,
                                       fetchGetNetworkActs,
                                       fetchGetAmountConsultation,
                                       fetchCheckInsuranceCoverageAmount,
                                       checkInsuranceCoverageAmount,
                                       getConsultation,
                                       fetchGetExclusion,
                                       getExclusion,
                                       getUserByNameOrNumber,
                                       getUserByIdQRCode,
                                       getProviderClass,
                                       getDrugAppareil,
                                       getNetworkAct,
                                       createConsultation,
                                       getAmountConsultation,
                                       executionPrescription,
                                       modifyPrescription,
                                       navigation
                                   }) => {


    const [showQRCodeScanner, setShowQRCodeScanner] = useState(false);
    const [showDateAccidentPicker, setShowDateAccidentPicker] = useState(false);
    const [dateAccident, setDateAccident] = useState(null);
    const [isAccident, setIsAccident] = useState(false);

    const [wallet] = useState(store.getState().walletDetailReducer.result.response);
    console.log("Wallet", wallet);

    const [isNumeroAssureSearch, setIsNumeroAssureSearch] = useState(false);
    const [isPhoneAssureSearch, setIsPhoneAssureSearch] = useState(false);

    const [tmpSheetId, setTmpSheetId] = useState('' + Date.now());

    const [datePrestation, setDatePrestation] = useState('' + moment(new Date()).format('YYYY-MM-DD HH:mm'));
    const [showDatePrestation, setShowDatePrestation] = useState(false);
    const [dateDebutGrossesse, setDateDebutGrossesse] = useState(null);
    const [dateFinGrossesse, setDateFinGrossesse] = useState(null);
    const [isGrossesse, setIsGrossesse] = useState(false);
    const [showDateDebutGrossessePicker, setShowDateDebutGrossessePicker] = useState(false);
    const [showDateFinGrossessePicker, setShowDateFinGrossessePicker] = useState(false);
    const [careConditon, setCareCondition] = useState(null);

    const [user, setUser] = useState(null);
    const [assure, setAssure] = useState(null);
    const [beneficiary, setBeneficiary] = useState(null);
    const [medicament, setMedicament] = useState(null);
    const [elementToSetPrice, setElementToSetPrice] = useState(null);

    const wizard = useRef();
    const [isFirstStep, setIsFirstStep] = useState(true);
    const [isLastStep, setIsLastStep] = useState(false);
    const [currentStep, setCurrentStep] = useState(1);

    const [modalConsultation, setModalConsultation] = useState(false);
    const [consultation, setConsultation] = useState(null);
    const [consultationClone, setConsultationClone] = useState(null);

    const [displayModalHistory, setDisplayModalHistory] = useState(false);
    const [historyItemDetail, setHistoryItemDetail] = useState({});

    const [modalExamen, setModalExamen] = useState(false);
    const [modalListPrestation, setModalListPrestation] = useState(false);
    const [modalPrice, setModalPrice] = useState(false);
    const [modalListAssure, setModalListAssure] = useState(false);
    const [modalListMedicament, setModalListMedicament] = useState(false);
    const [modalPrestation, setModalPrestation] = useState(false);
    const [modalModifyPrestation, setModalModifyPrestation] = useState(false);
    const [modalMedicament, setModalMedicament] = useState(false);
    const [modalModifyMedicament, setModalModifyMedicament] = useState(false);
    const [modalModifyExamen, setModalModifyExamen] = useState(false);
    const [modalAddMedicament, setModalAddMedicament] = useState(false);
    const [modalVisible, setModalVisible] = useState(false);


    const [prestations, setPrestations] = useState([]);

    const [examens, setExamens] = useState([]);

    const [prescriptions, setPrescriptions] = useState([]);


    const [statutPatientOption] = useState([
        {label: I18n.t('AYANT_DROITS'), value: "M"},
        {label: I18n.t('ASSURE'), value: "F"},
    ]);
    const [statutPatient, setStatutPatient] = useState(1);
    const [accident] = useState([
        {label: I18n.t('YES'), value: "YES"},
        {label: I18n.t('NO'), value: "NO"},
    ]);
    const [grossesse] = useState([
        {label: I18n.t('YES'), value: "YES"},
        {label: I18n.t('NO'), value: "NO"},
    ]);
    const [visiteDomicile] = useState([
        {label: I18n.t('YES'), value: "YES"},
        {label: I18n.t('NO'), value: "NO"},
    ]);

    const [isVisiteDomicile, setIsVisiteDomicile] = useState(false);

    const [conditionPriseEnChange] = useState([
        {label: I18n.t('AFFECTION_COURANTE'), value: "CURRENT_AFFECTION"},
        {label: I18n.t('AFFECTION_LONGUE'), value: "LONG_TERM_AFFECTION"},
        {
            label:
                I18n.t('EXONERE'), value: "EXONERATION"
        },
    ]);

    const [onPrescription] = useState([
        {label: I18n.t('COMPRESSED'), value: "COMPRESSED"},
        {label: I18n.t('SYRUP'), value: "SYRUP"},
        {label: I18n.t('SOLUTION'), value: "SOLUTION"},
        {label: I18n.t('SUPPOSITORY'), value: "SUPPOSITORY"},
        {label: I18n.t('DEVICE'), value: "DEVICE"},
    ]);

    const dispatch = useDispatch();
    let dropDownAlertRef: any = null;
    let classificationRef = null;
    let codeActeRef = null;
    let onPrescriptionRef = null;

    console.log("Health sheet", consultation);
    console.log("executionPrescription", executionPrescription);

    useEffect(() => {
        readUser().then((user) => {
            setFieldValue('agrement_praticien', user.code_membre);
            console.log("User", user);
            setUser(user)
        });
        dispatch(fetchGetSubscriptionListReset());
        dispatch(fetchGetAmountConsultationReset());
        dispatch(fetchGetUserByNameOrNumberReset());
        dispatch(fetchGetUserByIdQRCodeReset());
        dispatch(fetchCreateConsultationReset());
        dispatch(fetchGetProviderClassReset());
        dispatch(fetchGetConsultationReset());
        dispatch(fetchGetNetworkActsReset());
        dispatch(fetchExecutionPrescriptionReset());
        dispatch(fetchModifyPrescriptionReset());
        dispatch(fetchCheckInsuranceCoverageAmountReset());
        dispatch(fetchGetExclusionReset());


        fetchGetExclusion(wallet.id_network);
        fetchGetProviderClass(wallet.id_network);
        fetchGetNetworkActs(wallet.id_network, '');

    }, []);

    useEffect(() => {
        if (user !== null) {
            console.log("user", user);
        }
    }, [user]);

    useEffect(() => {
        console.log("getUserByNameOrNumber.result", getUserByNameOrNumber);
        if (getUserByNameOrNumber.result !== null) {
            if (getUserByNameOrNumber.result.response.length > 0) {
                setModalListAssure(true);
                //wizard.current.next();
            } else {
                dropDownAlertRef.alertWithType(
                    'warn',
                    I18n.t('EMPTY_LIST'),
                    I18n.t('NO_ASSURE_MATCH_SEARCH'),
                );
                //dispatch(fetchGetUserByNameOrNumberReset());
            }

        }

        if (getUserByNameOrNumber.error) {
            Alert.alert(
                I18n.t("ERROR_LABLE"),
                Utils.getErrorMsg(getUserByNameOrNumber),
                [
                    {
                        text: I18n.t("OK"), onPress: () => {
                            dispatch(fetchGetUserByNameOrNumberReset());
                        }
                    }
                ],
                {cancelable: false}
            );
            /*            dropDownAlertRef.alertWithType(
                            'error',
                            I18n.t('ERROR_LABEL'),
                            Utils.getErrorMsg(getUserByNameOrNumber),
                        );
                        dispatch(fetchGetUserByNameOrNumberReset());*/
        }
    }, [getUserByNameOrNumber]);

    useEffect(() => {
        console.log("getUserByNameOrNumber.result", getUserByIdQRCode);
        if (getUserByIdQRCode.result !== null) {
            setIsNumeroAssureSearch(false);
            setIsPhoneAssureSearch(true);
            setFieldValue('numero_assure', getUserByIdQRCode.result.response.phone);
            fetchGetUserByNameOrNumber(wallet.id_network, `&phone=${getUserByIdQRCode.result.response.phone}`);
        }

        if (getUserByIdQRCode.error) {
            Alert.alert(
                I18n.t("ERROR_LABLE"),
                Utils.getErrorMsg(getUserByIdQRCode),
                [
                    {
                        text: I18n.t("OK"), onPress: () => {
                            dispatch(fetchGetUserByIdQRCodeReset());
                        }
                    }
                ],
                {cancelable: false}
            );
        }
    }, [getUserByIdQRCode]);

    useEffect(() => {
        if (checkInsuranceCoverageAmount.result !== null) {
            if (checkInsuranceCoverageAmount.result.response !== null) {
                if (consultation.performances.length >= 1) {
                    setModalPrestation(false);
                    Utils.displayToast(I18n.t('PRESTATION_SUCCESSFULLY_ADD'));
                }
                dispatch(fetchCheckInsuranceCoverageAmountReset());

            }

        }

        if (checkInsuranceCoverageAmount.error) {
            Alert.alert(
                I18n.t("ERROR_LABLE"),
                Utils.getErrorMsg(checkInsuranceCoverageAmount),
                [
                    {
                        text: I18n.t("OK"), onPress: () => {
                            if (consultation.performances.length >= 1) {
                                setConsultation({...consultation, performances: [...consultationClone.performances]});
                                setModalPrestation(false);
                            }
                            dispatch(fetchCheckInsuranceCoverageAmountReset());
                        }
                    }
                ],
                {cancelable: false}
            );
        }
    }, [checkInsuranceCoverageAmount]);


    useEffect(() => {
        if (getConsultation.result !== null)
            setModalConsultation(true);

        if (getConsultation.error) {
            Alert.alert(
                I18n.t("ERROR_LABLE"),
                Utils.getErrorMsg(getConsultation),
                [
                    {
                        text: I18n.t("OK"), onPress: () => {
                            dispatch(fetchGetConsultationReset());
                        }
                    }
                ],
                {cancelable: false}
            );
            /*            dropDownAlertRef.alertWithType(
                            'error',
                            I18n.t('ERROR_LABEL'),
                            Utils.getErrorMsg(getConsultation),
                        );
                        dispatch(fetchGetConsultationReset());*/
        }
    }, [getConsultation]);

    useEffect(() => {
        if (modifyPrescription.result !== null) {
            Alert.alert(
                I18n.t("SUCCESS"),
                modifyPrescription.result.response,
                [
                    {
                        text: I18n.t("OK"), onPress: () => {
                            dispatch(fetchModifyPrescriptionReset());
                            navigation.goBack();
                        }
                    }

                ],
                {cancelable: false}
            )
        }

        if (modifyPrescription.error) {
            Alert.alert(
                I18n.t("ERROR_LABLE"),
                Utils.getErrorMsg(modifyPrescription),
                [
                    {
                        text: I18n.t("OK"), onPress: () => {
                            dispatch(fetchModifyPrescriptionReset());
                        }
                    }
                ],
                {cancelable: false}
            );
            /*            dropDownAlertRef.alertWithType(
                            'error',
                            I18n.t('ERROR_LABEL'),
                            Utils.getErrorMsg(modifyPrescription),
                        );
                        dispatch(fetchModifyPrescriptionReset());*/
        }
    }, [modifyPrescription]);

    const ModifierFeuilleSoinSchema = Yup.object().shape({
        numero_assure: Yup.string()
            .required(I18n.t('THIS_FIELD_IS_REQUIRED')),
        password: wallet.password_validation === "MAX" ?  Yup.string()
            .required(I18n.t('THIS_FIELD_IS_REQUIRED')) : Yup.string(),
        practitioner_lastname: Yup.string()
            .required(I18n.t('THIS_FIELD_IS_REQUIRED')),
        practitioner_firstname: Yup.string()
            .required(I18n.t('THIS_FIELD_IS_REQUIRED')),
    });

    const PriceModal = Yup.object().shape({
        price: Yup.number().required(I18n.t('THIS_FIELD_IS_REQUIRED')),
    });

    const AddNewPrestation = Yup.object().shape({
        amount_prestation: Yup.number().required(I18n.t('THIS_FIELD_IS_REQUIRED')),
        code_acte: Yup.number().required(I18n.t('THIS_FIELD_IS_REQUIRED')),
        frais_deplacement: Yup.number(),
        date_prestation: Yup.date(),
        ticker_moderateur: Yup.number(),
    });

    const ModifyPrestation = Yup.object().shape({
        amount_prestation: Yup.number().required(I18n.t('THIS_FIELD_IS_REQUIRED')),
        date_prestation: Yup.date(),
    });

    const AddNewExamen = Yup.object().shape({
        examen_name: Yup.string().required(I18n.t('THIS_FIELD_IS_REQUIRED')),
        code_acte: Yup.number().required(I18n.t('THIS_FIELD_IS_REQUIRED')),
        examen_quantite: Yup.number().required(I18n.t('THIS_FIELD_IS_REQUIRED')),
        amount: Yup.number().required(I18n.t('THIS_FIELD_IS_REQUIRED'))
    });


    const ModifyNewExamen = Yup.object().shape({
        examen_name: Yup.string().required(I18n.t('THIS_FIELD_IS_REQUIRED')),
        examen_quantite: Yup.mixed(),
        amount: Yup.mixed(),
    });

    const AddNewMedicament = Yup.object().shape({
        drug_name: Yup.string().required(I18n.t('THIS_FIELD_IS_REQUIRED')),
        drug_quantity: Yup.number().required(I18n.t('THIS_FIELD_IS_REQUIRED')),
        drug_posologie: Yup.string().required(I18n.t('THIS_FIELD_IS_REQUIRED')),
    });

    const AddNewMedicamentToDB = Yup.object().shape({
        code: Yup.string().required(I18n.t('THIS_FIELD_IS_REQUIRED')),
        name: Yup.string().required(I18n.t('THIS_FIELD_IS_REQUIRED')),
        type: Yup.string().required(I18n.t('THIS_FIELD_IS_REQUIRED'))
    });

    const onChangeDatePrestation = (event, selectedDate) => {
        const currentDate = selectedDate || '' + moment(new Date()).format('YYYY-MM-DD');
        setShowDatePrestation(Platform.OS === 'ios');
        setDatePrestation(currentDate);
    };

    const renderDatePrestationPicker = () => {
        return (<DateTimePicker
                timeZoneOffsetInMinutes={0}
                is24Hour={true}
                value={new Date(datePrestation)}
                mode='date'
                display="spinner"
                onChange={onChangeDatePrestation}
            />
        );
    }

    const onChangeDateAccident = (event, selectedDate) => {
        const currentDate = selectedDate || new Date();
        setShowDateAccidentPicker(Platform.OS === 'ios');
        setDateAccident(moment(currentDate).format('YYYY-MM-DD'));
        setFieldValue('accident_date', moment(currentDate).format('YYYY-MM-DD'));
    };

    const renderDateAccidentPicker = () => {
        return (<DateTimePicker
                timeZoneOffsetInMinutes={0}
                is24Hour={true}
                value={new Date()}
                mode='date'
                display="spinner"
                onChange={onChangeDateAccident}
            />
        );
    }

    const onChangeDateDebutGrossesse = (event, selectedDate) => {
        const currentDate = selectedDate || new Date();
        setShowDateDebutGrossessePicker(Platform.OS === 'ios');
        setDateDebutGrossesse(moment(currentDate).format('YYYY-MM-DD'));
        setFieldValue('pregnancy_start_at', moment(currentDate).format('YYYY-MM-DD'));
    };

    const renderModalExclusion = () => (
        <View style={[styles.containModal, {backgroundColor: Color.containerBackgroundColor}]}>
            <Modal
                isVisible={modalVisible}
                onSwipeComplete={() => {
                    setModalVisible(false);
                }}
                swipeDirection={null}
                style={styles.bottomModal}>
                <View
                    style={[
                        styles.contentFilterBottom,
                        {backgroundColor: Color.containerBackgroundColor},
                    ]}>
                    <View style={styles.contentSwipeDown}>
                        <View style={styles.lineSwipeDown}/>
                    </View>

                    <Text body2 style={{marginTop: 10}}>{I18n.t('EXCLUSION')}</Text>

                    <View style={{
                        height: Dimensions.get('window').height - 200,
                        width: Dimensions.get('window').width,
                    }}>
                        <WebView
                            style={{flex: 1}}
                            originWhitelist={['*']}
                            source={{html: getExclusion.result.document}}
                        />
                    </View>

                    <Button
                        style={{marginTop: 20, marginBottom: 20}}
                        full
                        onPress={() => setModalVisible(false)}>
                        {I18n.t('OK')}
                    </Button>
                </View>
            </Modal>
        </View>
    );


    const renderDateDebutGrossessePicker = () => {
        return (<DateTimePicker
                timeZoneOffsetInMinutes={0}
                is24Hour={true}
                value={new Date()}
                mode='date'
                display="spinner"
                onChange={onChangeDateDebutGrossesse}
            />
        );
    }

    const onChangeDateFinGrossesse = (event, selectedDate) => {
        const currentDate = selectedDate || new Date();
        setShowDateFinGrossessePicker(Platform.OS === 'ios');
        setDateFinGrossesse(moment(currentDate).format('YYYY-MM-DD'));
        setFieldValue('pregnancy_end_at', moment(currentDate).format('YYYY-MM-DD'));

    };

    const renderDateFinGrossessePicker = () => {
        return (<DateTimePicker
                timeZoneOffsetInMinutes={0}
                is24Hour={true}
                value={new Date()}
                mode='date'
                display="spinner"
                onChange={onChangeDateFinGrossesse}
            />
        );
    }

    const renderDialogQRCodeScanner = () => {

        return (
            <Dialog.Container contentStyle={{width: responsiveWidth(80)}} useNativeDriver={true}
                              visible={showQRCodeScanner}>

                <Dialog.Title>{I18n.t('SCAN')}</Dialog.Title>

                <ScrollView style={[styles.blockView, {borderBottomColor: Color.borderColor, maxHeight: 300}]}>
                    <Text>
                        {I18n.t('BRING_YOUR_CAMERA_CLOSER_TO_SCAN_QR_CODE')}
                    </Text>
                    <QRCodeScanner
                        onRead={(result) => {
                            setShowQRCodeScanner(false);
                            fetchGetUserByIdQRCode(result.data);
                            console.log("result", result.data);
                        }}
                        flashMode={RNCamera.Constants.FlashMode.off}
                    />
                </ScrollView>

                <Dialog.Button bold={true} label={I18n.t('CLOSE')} onPress={() => {
                    setShowQRCodeScanner(false);
                }}/>
            </Dialog.Container>
        )
    }


    const renderAddNewPrestation = () => {
        let amount = elementToSetPrice !== null ? elementToSetPrice.drugs === null ? _.parseInt(elementToSetPrice.amount) : '' : '';
        console.log("AMOUNT", amount);
        return (
            <Formik validationSchema={ModifyPrestation}
                    initialValues={{
                        amount_prestation: '' + elementToSetPrice !== null ? elementToSetPrice.drugs === null ? elementToSetPrice.amount : '' : '',
                        frais_deplacement: elementToSetPrice !== null ? elementToSetPrice.drugs === null ? elementToSetPrice.home_visit_fees : '' : '',
                        code_acte: elementToSetPrice !== null ? elementToSetPrice.drugs === null ? elementToSetPrice.act : '' : '',
                        insurance_amount: '' + elementToSetPrice !== null ? elementToSetPrice.drugs === null ? elementToSetPrice.insurance_amount : '' : '',
                        moderator_ticket: '' + elementToSetPrice !== null ? elementToSetPrice.drugs === null ? elementToSetPrice.moderator_ticket : '' : '',

                    }}
                    onSubmit={(values) => {
                        console.log("values", values);
                        setConsultation({
                            ...consultation,
                            performances: consultation.performances.map(performance => {
                                return elementToSetPrice.id === performance.id ? {
                                    ...performance,
                                    act_id: values.code_acte.id,
                                    act: values.code_acte,
                                    amount: values.amount_prestation,
                                    home_visit_fees: values.frais_deplacement,
                                    to_delete: false,

                                } : performance;
                            })
                        });

                        fetchCheckInsuranceCoverageAmount({
                            insurance_id: assure.id,
                            beneficiary_id: beneficiary !== null ? beneficiary.id : null,
                            care_condition: consultation._care_condition,
                            act_action: "UPDATE",
                            act_type: "PERFORMANCE",
                            act_id: elementToSetPrice.id,
                            tmp_sheet_id: tmpSheetId,
                            performances: [
                                {
                                    amount: values.amount_prestation,
                                    home_visit_fees: values.frais_deplacement
                                }
                            ],
                        });
                    }}>

                {({
                      values,
                      errors,
                      touched,
                      handleChange,
                      handleBlur,
                      setFieldValue,
                      setFieldTouched,
                      handleSubmit,
                      isSubmitting,
                  }) => (
                    <ScrollView style={{flex: 1}}>
                        <View style={[styles.containModal, {backgroundColor: Color.containerBackgroundColor}]}>
                            <Modal
                                isVisible={modalPrestation}
                                onSwipeComplete={() => {
                                    setModalPrestation(false);
                                }}
                                swipeDirection={['down']}
                                style={styles.bottomModal}>
                                <View
                                    style={[
                                        styles.contentFilterBottom,
                                        {backgroundColor: Color.containerBackgroundColor},
                                    ]}>
                                    <View style={styles.contentSwipeDown}>
                                        <View style={styles.lineSwipeDown}/>
                                    </View>

                                    <Text body2 style={{marginTop: 10}}>{I18n.t('MODIFY_PRESTATION')}</Text>

                                    <TextInput
                                        style={{marginTop: 10}}
                                        placeholder={I18n.t('DATE')}
                                        value={elementToSetPrice !== null ? elementToSetPrice.drugs === null
                                                ? moment(elementToSetPrice.created_at).format('YYYY-MM-DD HH:mm')
                                                : '' + moment(datePrestation).format('YYYY-MM-DD HH:mm')
                                            : '' + moment(datePrestation).format('YYYY-MM-DD HH:mm')}
                                        editable={false}
                                    />

                                    <Animatable.View ref={(comp) => {
                                        codeActeRef = comp
                                    }}
                                                     style={{
                                                         width: responsiveWidth(90),
                                                         height: 60,
                                                         alignSelf: 'center',
                                                         borderRadius: 10,
                                                         paddingLeft: 20,
                                                         marginTop: 10,
                                                         paddingRight: 20,
                                                         backgroundColor: 'white'
                                                     }}>
                                        <Dropdown
                                            label={I18n.t('CODE_ACTE')}
                                            data={getNetworkAct.result !== null ? getNetworkAct.result?.response.filter(act => act.type === 'CONSULTATION') : []}
                                            useNativeDriver={true}
                                            value={typeof values.code_acte !== "number" && values.code_acte.name}
                                            onChangeText={(value, index, data) => {
                                                setFieldTouched('code_acte');
                                                setFieldValue('code_acte', value);
                                                if (value.amount !== null) {
                                                    setFieldValue('amount_prestation', value.amount);
                                                    fetchGetAmountConsultation({
                                                        network_id: wallet.id_network,
                                                        amount: '' + value.amount,
                                                        care_condition: consultation._care_condition
                                                    });
                                                }
                                            }}
                                            valueExtractor={(value) => {
                                                return value
                                            }}
                                            labelExtractor={(value) => {
                                                return value.name
                                            }}
                                        />
                                    </Animatable.View>

                                    <TextInput
                                        style={{marginTop: 10}}
                                        placeholder={I18n.t('AMOUNT')}
                                        value={values.amount_prestation}
                                        onChangeText={(value) => {
                                            setFieldValue('amount_prestation', value);
                                            fetchGetAmountConsultation({
                                                network_id: wallet.id_network,
                                                amount: '' + value,
                                                care_condition: consultation._care_condition
                                            });
                                        }}
                                        editable={values.code_acte !== '' ? values.code_acte.billing_type === 'FREE' : true}
                                        onBlur={handleBlur('amount_prestation')}
                                        success={touched.amount_prestation && !errors.amount_prestation}
                                        touched={touched.amount_prestation}
                                        error={errors.amount_prestation}
                                    />

                                    <TextInput
                                        style={{marginTop: 10}}
                                        placeholder={I18n.t('TICKET_MONDERATEUR')}
                                        editable={false}
                                        value={getAmountConsultation.result !== null ? getAmountConsultation.result.response.moderator_ticket :
                                            elementToSetPrice !== null ? elementToSetPrice.drugs === null
                                                ? values.moderator_ticket
                                                : '' : ''}
                                    />

                                    <TextInput
                                        style={{marginTop: 10}}
                                        placeholder={I18n.t('AMOUNT_PER_INSURANCE')}
                                        editable={false}
                                        value={getAmountConsultation.result !== null ? getAmountConsultation.result.response.insurance_amount :
                                            elementToSetPrice !== null ? elementToSetPrice.drugs === null
                                                ? values.insurance_amount
                                                : '' : ''}/>

                                    <View style={{
                                        marginTop: 10,
                                        width: "100%",
                                        flexDirection: 'row',
                                        justifyContent: "space-between"
                                    }}>
                                        <Text body2>{I18n.t('VISITE_DOMICILE')}</Text>
                                        <View style={styles.contentSwitch}>
                                            <SwitchSelector options={visiteDomicile}
                                                            initial={1}
                                                            buttonColor={Color.accentColor}
                                                            backgroundColor={Color.primaryDarkColor}
                                                            textColor='white'
                                                            bold={true}
                                                            hasPadding
                                                            height={32}
                                                            onPress={(value) => {
                                                                setIsVisiteDomicile(value === 'YES')
                                                            }}/>
                                        </View>
                                    </View>

                                    {isVisiteDomicile && (
                                        <TextInput
                                            style={{marginTop: 10}}
                                            placeholder={I18n.t('FRAIS_DEPLACEMENT')}
                                            value={values.frais_deplacement}
                                            onChangeText={handleChange('frais_deplacement')}
                                            onBlur={handleBlur('frais_deplacement')}
                                            success={touched.frais_deplacement && !errors.frais_deplacement}
                                            touched={touched.frais_deplacement}
                                            error={errors.frais_deplacement}
                                        />
                                    )

                                    }

                                    <Button
                                        loading={checkInsuranceCoverageAmount.loading}
                                        style={{marginTop: 20, marginBottom: 20}}
                                        full
                                        onPress={() => {
                                            handleSubmit();
                                            console.log("Error", errors);
                                        }}>
                                        {I18n.t('SUBMIT_LABEL')}
                                    </Button>
                                </View>
                            </Modal>
                        </View>
                    </ScrollView>
                )}
            </Formik>
        );
    }

    const renderModifyPrestation = () => (
        <Formik validationSchema={AddNewPrestation}
                initialValues={{
                    amount_prestation: '',
                    frais_deplacement: '',
                    code_acte: ''
                }}
                onSubmit={(values) => {
                    if (values.code_acte === '')
                        codeActeRef.shake(200)
                    else {
                        setPrestations([{
                            act_id: values.code_acte.id,
                            act: values.code_acte,
                            amount: values.amount_prestation,
                            home_visit_fees: values.frais_deplacement
                        }, ...prestations]);
                        setModalModifyPrestation(false);
                        Utils.displayToast(I18n.t('PRESTATION_SUCCESSFULLY_MODIFY'));
                    }

                }}>

            {({
                  values,
                  errors,
                  touched,
                  handleChange,
                  handleBlur,
                  setFieldValue,
                  setFieldTouched,
                  handleSubmit,
                  isSubmitting,
              }) => (
                <ScrollView style={{flex: 1}}>
                    <View style={[styles.containModal, {backgroundColor: Color.containerBackgroundColor}]}>
                        <Modal
                            isVisible={modalModifyPrestation}
                            onSwipeComplete={() => {
                                setModalModifyPrestation(false);
                            }}
                            swipeDirection={['down']}
                            style={styles.bottomModal}>
                            <View
                                style={[
                                    styles.contentFilterBottom,
                                    {backgroundColor: Color.containerBackgroundColor},
                                ]}>
                                <View style={styles.contentSwipeDown}>
                                    <View style={styles.lineSwipeDown}/>
                                </View>

                                <Text body2 style={{marginTop: 10}}>{I18n.t('MODIFY_PRESTATION')}</Text>

                                <TextInput
                                    style={{marginTop: 10}}
                                    placeholder={I18n.t('DATE')}
                                    value={'' + moment(datePrestation).format('YYYY-MM-DD HH:mm')}
                                    editable={false}
                                />

                                <Animatable.View ref={(comp) => {
                                    codeActeRef = comp
                                }}
                                                 style={{
                                                     width: responsiveWidth(90),
                                                     height: 60,
                                                     alignSelf: 'center',
                                                     borderRadius: 10,
                                                     paddingLeft: 20,
                                                     marginTop: 10,
                                                     paddingRight: 20,
                                                     backgroundColor: 'white'
                                                 }}>
                                    <Dropdown
                                        label={I18n.t('CODE_ACTE')}
                                        data={getNetworkAct.result !== null ? getNetworkAct.result?.response.filter(act => act.type === 'CONSULTATION') : []}
                                        useNativeDriver={true}
                                        onChangeText={(value, index, data) => {
                                            setFieldTouched('code_acte');
                                            setFieldValue('code_acte', value);

                                            if (value.billing_type !== 'FREE') {
                                                setFieldValue('amount_prestation', value.amount);
                                                fetchGetAmountConsultation({
                                                    network_id: wallet.id_network,
                                                    amount: '' + value.amount,
                                                    care_condition: consultation._care_condition
                                                });
                                            }
                                        }}
                                        valueExtractor={(value) => {
                                            return value
                                        }}
                                        labelExtractor={(value) => {
                                            return value.name
                                        }}
                                    />
                                </Animatable.View>

                                <TextInput
                                    style={{marginTop: 10}}
                                    placeholder={I18n.t('AMOUNT')}
                                    editable={values.code_acte !== '' ? values.code_acte.billing_type === 'FREE' : true}
                                    value={values.amount_prestation}
                                    onChangeText={handleChange('amount_prestation')}
                                    onBlur={handleBlur('amount_prestation')}
                                    success={touched.amount_prestation && !errors.amount_prestation}
                                    touched={touched.amount_prestation}
                                    error={errors.amount_prestation}
                                    onChangeText={(text) => {
                                        setFieldValue('amount_prestation', text);
                                        fetchGetAmountConsultation({
                                            network_id: wallet.id_network,
                                            amount: '' + text,
                                            care_condition: consultation._care_condition
                                        });
                                    }}
                                />

                                <TextInput
                                    style={{marginTop: 10}}
                                    placeholder={I18n.t('TICKET_MONDERATEUR')}
                                    editable={false}
                                    value={getAmountConsultation.result !== null ? getAmountConsultation.result.response.moderator_ticket : ''}
                                />

                                <TextInput
                                    style={{marginTop: 10}}
                                    placeholder={I18n.t('AMOUNT_PER_INSURANCE')}
                                    editable={false}
                                    value={getAmountConsultation.result !== null ? getAmountConsultation.result.response.insurance_amount : ''}/>

                                <View style={{
                                    marginTop: 10,
                                    width: "100%",
                                    flexDirection: 'row',
                                    justifyContent: "space-between"
                                }}>
                                    <Text body2>{I18n.t('VISITE_DOMICILE')}</Text>
                                    <View style={styles.contentSwitch}>
                                        <SwitchSelector options={visiteDomicile}
                                                        initial={1}
                                                        buttonColor={Color.accentColor}
                                                        backgroundColor={Color.primaryDarkColor}
                                                        textColor='white'
                                                        bold={true}
                                                        hasPadding
                                                        height={32}
                                                        onPress={(value) => {
                                                            setIsVisiteDomicile(value === 'YES')
                                                        }}/>
                                    </View>
                                </View>

                                {isVisiteDomicile && (
                                    <TextInput
                                        style={{marginTop: 10}}
                                        placeholder={I18n.t('FRAIS_DEPLACEMENT')}
                                        value={values.frais_deplacement}
                                        onChangeText={handleChange('frais_deplacement')}
                                        onBlur={handleBlur('frais_deplacement')}
                                        success={touched.frais_deplacement && !errors.frais_deplacement}
                                        touched={touched.frais_deplacement}
                                        error={errors.frais_deplacement}
                                    />
                                )

                                }

                                <Button
                                    style={{marginTop: 20, marginBottom: 20}}
                                    full
                                    onPress={handleSubmit}>
                                    {I18n.t('SUBMIT_LABEL')}
                                </Button>
                            </View>
                        </Modal>
                    </View>
                </ScrollView>
            )}
        </Formik>
    );

    const renderAddNewMedicament = () => (
        <Formik validationSchema={AddNewMedicament}
                initialValues={{
                    drug_name: '',
                    drug_posologie: '',
                    drug_quantity: ''
                }}
                onSubmit={(values) => {
                    setPrescriptions([{
                        drug_or_device_id: medicament.id,
                        dosage: values.drug_posologie,
                        quantity: values.drug_quantity
                    }, ...prescriptions]);
                    setModalMedicament(false);
                    Utils.displayToast(I18n.t('PRESCRIPTIONS_SUCCESSFULLY_ADD'));
                }}>

            {({
                  values,
                  errors,
                  touched,
                  handleChange,
                  handleBlur,
                  handleSubmit,

                  isSubmitting,
              }) => (
                <ScrollView style={{flex: 1}}>
                    <View style={[styles.containModal, {backgroundColor: Color.containerBackgroundColor}]}>
                        <Modal
                            isVisible={modalMedicament}
                            onSwipeComplete={() => {
                                setModalMedicament(false);
                            }}
                            swipeDirection={['down']}
                            style={styles.bottomModal}>
                            <View
                                style={[
                                    styles.contentFilterBottom,
                                    {backgroundColor: Color.containerBackgroundColor},
                                ]}>
                                <View style={styles.contentSwipeDown}>
                                    <View style={styles.lineSwipeDown}/>
                                </View>

                                <Text body2 style={{marginTop: 10}}>{I18n.t('AJOUTER_MEDICAMENT')}</Text>

                                <View style={{flexDirection: 'row'}}>
                                    <TextInput
                                        style={{marginTop: 10, width: "90%"}}
                                        placeholder={I18n.t('NAME')}
                                        value={medicament !== null ? medicament.name : values.drug_name}
                                        onChangeText={handleChange('drug_name')}
                                        onBlur={handleBlur('drug_name')}
                                        success={touched.drug_name && !errors.drug_name}
                                        touched={touched.drug_name}
                                        error={errors.drug_name}
                                        editable={medicament === null}
                                    />
                                    <TouchableOpacity
                                        style={[
                                            styles.iconNavigationButton,
                                            {
                                                backgroundColor:
                                                Color.primaryColor,
                                                borderColor:
                                                Color.primaryColor,
                                                marginTop: 10,
                                                width: 40,
                                                height: 40,
                                            },
                                        ]}
                                        onPress={e => {
                                            fetchGetDrugAppareil(wallet.id_network, values.drug_name);
                                        }}>
                                        {(getDrugAppareil.loading) ?
                                            <ActivityIndicator
                                                size="small"
                                                color="#fff"
                                            />
                                            : <FontAwesome
                                                name="search"
                                                size={24}
                                                color={Color.whiteColor}
                                            />}

                                    </TouchableOpacity>
                                </View>

                                <TextInput
                                    style={{marginTop: 10}}
                                    placeholder={I18n.t('POSOLOGIE')}
                                    value={values.drug_posologie}
                                    onChangeText={handleChange('drug_posologie')}
                                    onBlur={handleBlur('drug_posologie')}
                                    success={touched.drug_posologie && !errors.drug_posologie}
                                    touched={touched.drug_posologie}
                                    error={errors.drug_posologie}
                                />

                                <TextInput
                                    style={{marginTop: 10}}
                                    placeholder={I18n.t('QUANTITE')}
                                    value={values.drug_quantity}
                                    onChangeText={handleChange('drug_quantity')}
                                    onBlur={handleBlur('drug_quantity')}
                                    success={touched.drug_quantity && !errors.drug_quantity}
                                    touched={touched.drug_quantity}
                                    error={errors.drug_quantity}
                                    keyboardType='numeric'
                                />

                                <Button
                                    style={{marginTop: 20, marginBottom: 20}}
                                    full
                                    onPress={handleSubmit}>
                                    {I18n.t('SUBMIT_LABEL')}
                                </Button>
                            </View>
                        </Modal>
                    </View>
                </ScrollView>
            )}
        </Formik>
    );

    const renderModifyMedicament = () => (
        <Formik validationSchema={AddNewMedicament}
                initialValues={{
                    drug_name: elementToSetPrice !== null ? elementToSetPrice.drugs ? elementToSetPrice.drug_or_device.name : '' : '',
                    drug_posologie: elementToSetPrice !== null ? elementToSetPrice.drugs ? elementToSetPrice.dosage : '' : '',
                    drug_quantity: elementToSetPrice !== null ? elementToSetPrice.drugs ? elementToSetPrice.quantity : '' : ''
                }}
                onSubmit={(values) => {

                    setConsultation({
                        ...consultation,
                        prescriptions: consultation.prescriptions.map(exam => {
                            return elementToSetPrice.id === exam.id ? {
                                id: exam.id,
                                drug_or_device_id: elementToSetPrice.drug_or_device.id,
                                drug_or_device: elementToSetPrice.drug_or_device,
                                dosage: values.drug_posologie,
                                quantity: values.drug_quantity,
                                unit_price: exam.unit_price,
                                to_delete: false
                            } : exam;
                        })
                    });

                    setModalModifyMedicament(false);
                    Utils.displayToast(I18n.t('PRESCRIPTIONS_SUCCESSFULLY_MODIFY'));
                }}>

            {({
                  values,
                  errors,
                  touched,
                  handleChange,
                  handleBlur,
                  handleSubmit,

                  isSubmitting,
              }) => (
                <ScrollView style={{flex: 1}}>
                    <View style={[styles.containModal, {backgroundColor: Color.containerBackgroundColor}]}>
                        <Modal
                            isVisible={modalModifyMedicament}
                            onSwipeComplete={() => {
                                setModalModifyMedicament(false);
                            }}
                            swipeDirection={['down']}
                            style={styles.bottomModal}>
                            <View
                                style={[
                                    styles.contentFilterBottom,
                                    {backgroundColor: Color.containerBackgroundColor},
                                ]}>
                                <View style={styles.contentSwipeDown}>
                                    <View style={styles.lineSwipeDown}/>
                                </View>

                                <Text body2 style={{marginTop: 10}}>{I18n.t('MODIFIER_MEDICAMENT')}</Text>

                                <TextInput
                                    style={{marginTop: 10}}
                                    placeholder={I18n.t('NAME')}
                                    value={values.drug_name}
                                    onChangeText={handleChange('drug_name')}
                                    onBlur={handleBlur('drug_name')}
                                    success={touched.drug_name && !errors.drug_name}
                                    touched={touched.drug_name}
                                    error={errors.drug_name}
                                    editable={medicament === null}
                                />

                                <TextInput
                                    style={{marginTop: 10}}
                                    placeholder={I18n.t('POSOLOGIE')}
                                    value={values.drug_posologie}
                                    onChangeText={handleChange('drug_posologie')}
                                    onBlur={handleBlur('drug_posologie')}
                                    success={touched.drug_posologie && !errors.drug_posologie}
                                    touched={touched.drug_posologie}
                                    error={errors.drug_posologie}
                                />

                                <TextInput
                                    style={{marginTop: 10}}
                                    placeholder={I18n.t('QUANTITE')}
                                    value={'' + values.drug_quantity}
                                    onChangeText={handleChange('drug_quantity')}
                                    onBlur={handleBlur('drug_quantity')}
                                    success={touched.drug_quantity && !errors.drug_quantity}
                                    touched={touched.drug_quantity}
                                    error={errors.drug_quantity}
                                    keyboardType='numeric'
                                />

                                <Button
                                    style={{marginTop: 20, marginBottom: 20}}
                                    full
                                    onPress={handleSubmit}>
                                    {I18n.t('SUBMIT_LABEL')}
                                </Button>
                            </View>
                        </Modal>
                    </View>
                </ScrollView>
            )}
        </Formik>
    );

    const renderAddNewMedicamentToDB = () => (
        <Formik validationSchema={AddNewMedicamentToDB}
                initialValues={{
                    code: '',
                    name: '',
                    type: '',
                    on_prescription: false
                }}
                onSubmit={(values) => {
                    setMedicament(null);
                    fetchAddDrug({
                        network_id: wallet.id_network,
                        code: values.code,
                        name: values.name,
                        type: values.type,
                        on_prescription: values.on_prescription
                    })
                }}>

            {({
                  values,
                  errors,
                  touched,
                  handleChange,
                  handleBlur,
                  handleSubmit,
                  setFieldValue,

                  isSubmitting,
              }) => (
                <ScrollView style={{flex: 1}}>
                    <View
                        style={[styles.containModal, {backgroundColor: Color.containerBackgroundColor}]}>
                        <Modal
                            isVisible={modalAddMedicament}
                            onSwipeComplete={() => {
                                setModalAddMedicament(false);
                            }}
                            swipeDirection={['down']}
                            style={styles.bottomModal}>
                            <View
                                style={[
                                    styles.contentFilterBottom,
                                    {backgroundColor: Color.containerBackgroundColor},
                                ]}>
                                <View style={styles.contentSwipeDown}>
                                    <View style={styles.lineSwipeDown}/>
                                </View>

                                <Text body2
                                      style={{marginTop: 10}}>{I18n.t('AJOUTER_NOUVEAU_MEDICAMENT')}</Text>
                                <TextInput
                                    style={{marginTop: 10}}
                                    placeholder='Code'
                                    value={values.code}
                                    onChangeText={handleChange('code')}
                                    onBlur={handleBlur('code')}
                                    success={touched.code && !errors.code}
                                    touched={touched.code}
                                    error={errors.code}
                                />

                                <TextInput
                                    style={{marginTop: 10}}
                                    placeholder={I18n.t('NAME')}
                                    value={values.name}
                                    onChangeText={handleChange('name')}
                                    onBlur={handleBlur('name')}
                                    success={touched.name && !errors.name}
                                    touched={touched.name}
                                    error={errors.name}
                                />


                                <Animatable.View ref={(comp) => {
                                    onPrescriptionRef = comp
                                }}
                                                 style={{
                                                     width: responsiveWidth(90),
                                                     height: 60,
                                                     alignSelf: 'center',
                                                     borderRadius: 10,
                                                     paddingLeft: 20,
                                                     marginTop: 10,
                                                     paddingRight: 20,
                                                     backgroundColor: 'white'
                                                 }}>
                                    <Dropdown
                                        label='Type'
                                        data={onPrescription}
                                        useNativeDriver={true}
                                        onChangeText={(value, index, data) => {
                                            setFieldValue('type', value.value);
                                        }}
                                        valueExtractor={(value) => {
                                            return value
                                        }}
                                        labelExtractor={(value) => {
                                            return value.label
                                        }}
                                    />
                                </Animatable.View>

                                <View style={{
                                    marginTop: 10,
                                    flexDirection: 'row',
                                    justifyContent: "space-between"
                                }}>
                                    <Text body2>{I18n.t('SOUS_ORDONNANCE')}</Text>
                                    <View style={{width: responsiveWidth(60)}}>
                                        <SwitchSelector options={grossesse}
                                                        initial={1}
                                                        buttonColor={Color.accentColor}
                                                        backgroundColor={Color.primaryDarkColor}
                                                        textColor='white'
                                                        bold={true}
                                                        hasPadding
                                                        height={32}
                                                        onPress={(value) => {
                                                            setFieldValue('on_prescription', value === 'YES');
                                                            console.log("On Prescription", value);
                                                            //setGender(value);
                                                        }}/>
                                    </View>
                                </View>

                                <Button
                                    style={{marginTop: 20, marginBottom: 20}}
                                    full
                                    loading={addDrug.loading}
                                    onPress={handleSubmit}>
                                    {I18n.t('SUBMIT_LABEL')}
                                </Button>
                            </View>
                        </Modal>
                    </View>
                </ScrollView>
            )}
        </Formik>
    );

    const renderAddNewExamen = () => (
        <Formik validationSchema={AddNewExamen}
                initialValues={{
                    examen_name: '',
                    examen_quantite: '',
                    code_acte: ''
                }}
                onSubmit={(values) => {
                    console.log("Value", values);
                    setExamens([{
                        act_id: values.code_acte,
                        description: values.examen_name,
                        quantity: values.examen_quantite
                    }, ...examens]);
                    setModalExamen(false);
                    Utils.displayToast(I18n.t('EXAMENS_SUCCESSFULLY_ADD'));
                }}>

            {({
                  values,
                  errors,
                  touched,
                  handleChange,
                  setFieldValue,
                  setFieldTouched,
                  handleBlur,
                  handleSubmit,
                  isSubmitting,
              }) => (
                <ScrollView style={{flex: 1}}>
                    <View
                        style={[styles.containModal, {backgroundColor: Color.containerBackgroundColor}]}>
                        <Modal
                            isVisible={modalExamen}
                            onSwipeComplete={() => {
                                setModalExamen(false);
                            }}
                            swipeDirection={['down']}
                            style={styles.bottomModal}>
                            <View
                                style={[
                                    styles.contentFilterBottom,
                                    {backgroundColor: Color.containerBackgroundColor},
                                ]}>
                                <View style={styles.contentSwipeDown}>
                                    <View style={styles.lineSwipeDown}/>
                                </View>

                                <Text body2
                                      style={{marginTop: 10}}>{I18n.t('AJOUTER_EXAMEN')}</Text>

                                <Animatable.View ref={(comp) => {
                                    codeActeRef = comp
                                }}
                                                 style={{
                                                     width: responsiveWidth(90),
                                                     height: 60,
                                                     alignSelf: 'center',
                                                     borderRadius: 10,
                                                     paddingLeft: 20,
                                                     marginTop: 10,
                                                     paddingRight: 20,
                                                     backgroundColor: 'white'
                                                 }}>
                                    <Dropdown
                                        label={I18n.t('CODE_ACTE')}
                                        data={getNetworkAct.result !== null ? getNetworkAct.result?.response.filter(act => act.type === 'EXAM') : []}
                                        useNativeDriver={true}
                                        onChangeText={(value, index, data) => {
                                            console.log("Value", value);
                                            setFieldTouched('code_acte');
                                            setFieldValue('code_acte', value.id);
                                        }}
                                        valueExtractor={(value) => {
                                            return value
                                        }}
                                        labelExtractor={(value) => {
                                            return value.name
                                        }}
                                    />
                                </Animatable.View>

                                <TextInput
                                    style={{marginTop: 10}}
                                    placeholder={I18n.t('DESCRIPTION')}
                                    value={values.examen_name}
                                    onChangeText={handleChange('examen_name')}
                                    onBlur={handleBlur('examen_name')}
                                    success={touched.examen_name && !errors.examen_name}
                                    touched={touched.examen_name}
                                    error={errors.examen_name}
                                />

                                <TextInput
                                    style={{marginTop: 10}}
                                    placeholder={I18n.t('QUANTITE')}
                                    value={values.examen_quantite}
                                    onChangeText={handleChange('examen_quantite')}
                                    onBlur={handleBlur('examen_quantite')}
                                    success={touched.examen_quantite && !errors.examen_quantite}
                                    touched={touched.examen_quantite}
                                    error={errors.examen_quantite}
                                    keyboardType='numeric'
                                />

                                <Button
                                    style={{marginTop: 20, marginBottom: 20}}
                                    full
                                    onPress={() => {
                                        console.log("errors", errors);
                                        console.log("values", values);
                                        handleSubmit();
                                    }}>
                                    {I18n.t('SUBMIT_LABEL')}
                                </Button>
                            </View>
                        </Modal>
                    </View>
                </ScrollView>
            )}
        </Formik>
    );

    const renderModifyExamen = () => (
        <Formik validationSchema={ModifyNewExamen}
                initialValues={{
                    examen_name: elementToSetPrice !== null ? !elementToSetPrice.drugs ? elementToSetPrice.description : '' : '',
                    examen_quantite: '' + elementToSetPrice !== null ? !elementToSetPrice.drugs ? elementToSetPrice.quantity : '' : '',
                    code_acte: '' + elementToSetPrice !== null ? !elementToSetPrice.drugs ? elementToSetPrice.act : '' : '',
                    amount: elementToSetPrice !== null ? !elementToSetPrice.drugs ? elementToSetPrice.act.amount : null : null
                }}
                onSubmit={(values) => {

                    setConsultation({
                        ...consultation,
                        exams: consultation.exams.map(exam => {
                            return elementToSetPrice.id === exam.id ? {
                                ...exam,
                                id: exam.id,
                                amount: values.amount,
                                act_id: values.code_acte.id,
                                act: values.code_acte,
                                description: values.examen_name,
                                quantity: null,
                                unit_price: exam.unit_price,
                                to_delete: false
                            } : exam;
                        })
                    });

                    setModalModifyExamen(false);
                    Utils.displayToast(I18n.t('EXAMENS_SUCCESSFULLY_MODIFY'));
                }}>

            {({
                  values,
                  errors,
                  touched,
                  handleChange,
                  setFieldValue,
                  setFieldTouched,
                  handleBlur,
                  handleSubmit,
                  isSubmitting,
              }) => (
                <ScrollView style={{flex: 1}}>
                    {console.log("Errors", errors)}
                    <View
                        style={[styles.containModal, {backgroundColor: Color.containerBackgroundColor}]}>
                        <Modal
                            isVisible={modalModifyExamen}
                            onSwipeComplete={() => {
                                setModalModifyExamen(false);
                            }}
                            swipeDirection={['down']}
                            style={styles.bottomModal}>
                            <View
                                style={[
                                    styles.contentFilterBottom,
                                    {backgroundColor: Color.containerBackgroundColor},
                                ]}>
                                <View style={styles.contentSwipeDown}>
                                    <View style={styles.lineSwipeDown}/>
                                </View>

                                <Text body2
                                      style={{marginTop: 10}}>{I18n.t('MODIFIER_EXAMEN')}</Text>

                                <Animatable.View ref={(comp) => {
                                    codeActeRef = comp
                                }}
                                                 style={{
                                                     width: responsiveWidth(90),
                                                     height: 60,
                                                     alignSelf: 'center',
                                                     borderRadius: 10,
                                                     paddingLeft: 20,
                                                     marginTop: 10,
                                                     paddingRight: 20,
                                                     backgroundColor: 'white'
                                                 }}>
                                    <Dropdown
                                        label={I18n.t('CODE_ACTE')}
                                        data={getNetworkAct.result !== null ? getNetworkAct.result?.response.filter(act => (act.type === "EXAM_OR_OTHER")) : []}
                                        useNativeDriver={true}
                                        value={typeof values.code_acte !== "number" && values.code_acte.name}
                                        onChangeText={(value, index, data) => {
                                            console.log("Value", value);
                                            setFieldTouched('code_acte');
                                            setFieldValue('code_acte', value);
                                        }}
                                        valueExtractor={(value) => {
                                            return value
                                        }}
                                        labelExtractor={(value) => {
                                            return value.name
                                        }}
                                    />
                                </Animatable.View>

                                <TextInput
                                    style={{marginTop: 10}}
                                    placeholder={I18n.t('DESCRIPTION')}
                                    value={values.examen_name}
                                    onChangeText={handleChange('examen_name')}
                                    onBlur={handleBlur('examen_name')}
                                    success={touched.examen_name && !errors.examen_name}
                                    touched={touched.examen_name}
                                    error={errors.examen_name}
                                />

                                {/*                                {values.code_acte !== '' ?
                                    values.code_acte.billing_type === 'UNIT_PRICE' && (<TextInput
                                        style={{marginTop: 10}}
                                        placeholder={I18n.t('QUANTITE')}
                                        value={'' + values.examen_quantite}
                                        onChangeText={handleChange('examen_quantite')}
                                        onBlur={handleBlur('examen_quantite')}
                                        success={touched.examen_quantite && !errors.examen_quantite}
                                        touched={touched.examen_quantite}
                                        error={errors.examen_quantite}
                                        keyboardType='numeric'
                                    />) : null}*/}

                                <View>
                                    <TextInput
                                        style={{marginTop: 10}}
                                        placeholder={I18n.t('AMOUNT')}
                                        value={values.code_acte !== '' ? values.code_acte.billing_type === 'FREE' ? I18n.t('AMOUNT_FREE') : `${values.code_acte.unit_value} = ${values.code_acte.amount}` : ''}
                                        editable={false}
                                        onChangeText={handleChange('amount')}
                                        onBlur={handleBlur('amount')}
                                        success={touched.amount && !errors.amount}
                                        touched={touched.amount}
                                        error={errors.amount}
                                        keyboardType='numeric'
                                    />
                                    {/*                                    <View style={{
                                        position: 'absolute',
                                        left: responsiveWidth(82),
                                        top: 20,
                                        flexDirection: 'row'
                                    }}>
                                        <View
                                            style={{
                                                width: 1,
                                                borderLeftColor: '#f0f0f0',
                                                height: 40,
                                                left: -8,
                                                borderLeftWidth: 1,

                                            }}
                                        />
                                        <Text
                                            style={[Typography.body1, FontWeight.bold]}>{values.code_acte.unit_value}</Text>
                                    </View>*/}
                                </View>

                                <Button
                                    style={{marginTop: 20, marginBottom: 20}}
                                    full
                                    loading={modifyPrescription.loading}
                                    onPress={() => {
                                        console.log("errors", errors);
                                        console.log("values", values);
                                        handleSubmit();
                                    }}>
                                    {I18n.t('SUBMIT_LABEL')}
                                </Button>
                            </View>
                        </Modal>
                    </View>
                </ScrollView>
            )}
        </Formik>
    );

    const renderPriceModal = () => (
        <Formik validationSchema={PriceModal}
                initialValues={{
                    price: '',
                }}
                onSubmit={(values) => {
                    console.log("Value", elementToSetPrice);
                    if (elementToSetPrice.examen) {
                        setConsultation({
                            ...consultation,
                            exams: consultation.exams.map(exam => {
                                return elementToSetPrice.id === exam.id ? {
                                    ...exam,
                                    unit_price: values.price
                                } : exam;
                            })
                        });
                    } else {
                        setConsultation({
                            ...consultation,
                            prescriptions: consultation.prescriptions.map(exam => {
                                return elementToSetPrice.id === exam.id ? {
                                    ...exam,
                                    unit_price: values.price
                                } : exam;
                            })
                        });
                    }

                    setModalPrice(false);
                }}>

            {({
                  values,
                  errors,
                  touched,
                  handleChange,
                  setFieldValue,
                  setFieldTouched,
                  handleBlur,
                  handleSubmit,
                  isSubmitting,
              }) => (
                <ScrollView style={{flex: 1}}>
                    {console.log("Errors", errors)}
                    <View
                        style={[styles.containModal, {backgroundColor: Color.containerBackgroundColor}]}>
                        <Modal
                            isVisible={modalPrice}
                            onSwipeComplete={() => {
                                setModalPrice(false);
                            }}
                            swipeDirection={['down']}
                            style={styles.bottomModal}>
                            <View
                                style={[
                                    styles.contentFilterBottom,
                                    {backgroundColor: Color.containerBackgroundColor},
                                ]}>
                                <View style={styles.contentSwipeDown}>
                                    <View style={styles.lineSwipeDown}/>
                                </View>

                                <Text body2 style={{marginTop: 10}}>{I18n.t('AMOUNT_LABEL')}</Text>

                                <TextInput
                                    style={{marginTop: 10}}
                                    placeholder={I18n.t('AMOUNT_LABEL_DESCRIPTION')}
                                    value={values.price}
                                    onChangeText={handleChange('price')}
                                    onBlur={handleBlur('price')}
                                    success={touched.price && !errors.price}
                                    touched={touched.price}
                                    error={errors.price}
                                    keyboardType='numeric'
                                />

                                <Button
                                    full
                                    style={{marginTop: 10, marginBottom: 20}}
                                    onPress={handleSubmit}>
                                    {I18n.t('OK')}
                                </Button>
                            </View>
                        </Modal>
                    </View>
                </ScrollView>
            )}
        </Formik>
    );

    const renderPresatationList = () => (
        <ScrollView style={{flex: 1}}>
            <View style={[styles.containModal, {backgroundColor: Color.containerBackgroundColor}]}>
                <Modal
                    isVisible={modalListPrestation}
                    onSwipeComplete={() => {
                        setModalListPrestation(false);
                    }}
                    swipeDirection={['down']}
                    style={styles.bottomModal}>
                    <View
                        style={[
                            styles.contentFilterBottom,
                            {backgroundColor: Color.containerBackgroundColor},
                        ]}>
                        <View style={styles.contentSwipeDown}>
                            <View style={styles.lineSwipeDown}/>
                        </View>

                        <Text body2 style={{marginTop: 10}}>{I18n.t('LIST_PRESTATION')}</Text>

                        <FlatList data={consultation.performances.filter(performance => !performance.to_delete)}
                                  extraData={consultation.performances.filter(performance => !performance.to_delete)}
                                  keyExtractor={(item, index) => index}
                                  renderItem={({item, index}) => {
                                      return (

                                          <View
                                              style={[
                                                  styles.contentActionModalBottom,
                                                  {
                                                      borderBottomColor: Color.borderColor,
                                                      width: "100%"
                                                  },
                                              ]}
                                              key={item.id}>
                                              <Text body2 semibold numberOfLines={5}>
                                                  {`${cutString(item.act.name, 30)}
                                                  \n ${I18n.t('AMOUNT_LABEL')}: ${item.amount} 
                                                  \n ${I18n.t('AMOUNT_PER_INSURANCE')}: ${item.insurance_amount} 
                                                  \n ${I18n.t('TICKET_MONDERATEUR')}: ${item.moderator_ticket} ${item.home_visit_fees !== null ? '| ' + item.home_visit_fees : ''}`}
                                              </Text>
                                              <View style={styles.iconRight}>
                                                  <TouchableOpacity onPress={() => {
                                                      setElementToSetPrice({
                                                          ...item,
                                                          drugs: null
                                                      });
                                                      setModalPrestation(true);
                                                  }}>
                                                      <Icon name="edit" size={24}
                                                            color={Color.primaryColor}/>
                                                  </TouchableOpacity>
                                                  <TouchableOpacity
                                                      onPress={() => {
                                                          setConsultation({
                                                              ...consultation,
                                                              performances: consultation.performances.map(performance => {
                                                                  return item.id === performance.id ? {
                                                                      ...performance,
                                                                      to_delete: true
                                                                  } : performance
                                                              })
                                                          });
                                                      }}>
                                                      <Icon
                                                          name="minus-circle"
                                                          size={24}
                                                          color={Color.grayColor}
                                                      />
                                                  </TouchableOpacity>
                                              </View>
                                          </View>
                                      )
                                  }}/>

                        <Button
                            full
                            style={{marginTop: 10, marginBottom: 20}}
                            onPress={() => setModalListPrestation(false)}>
                            {I18n.t('OK')}
                        </Button>
                    </View>
                </Modal>
            </View>
        </ScrollView>
    );


    const renderExamList = () => (
        <ScrollView style={{flex: 1}}>
            <View style={[styles.containModal, {backgroundColor: Color.containerBackgroundColor}]}>
                <Modal
                    isVisible={modalExamen}
                    onSwipeComplete={() => {
                        setModalExamen(false);
                    }}
                    swipeDirection={['down']}
                    style={styles.bottomModal}>
                    <View
                        style={[
                            styles.contentFilterBottom,
                            {backgroundColor: Color.containerBackgroundColor},
                        ]}>
                        <View style={styles.contentSwipeDown}>
                            <View style={styles.lineSwipeDown}/>
                        </View>

                        <Text body2 style={{marginTop: 10}}>{I18n.t('EXAMEN')}</Text>

                        <FlatList
                            data={consultation.exams.filter(exam => !exam.to_delete)}
                            extraData={consultation.exams.filter(exam => !exam.to_delete)}
                            keyExtractor={(item, index) => index}
                            renderItem={({item, index}) => {
                                return (

                                    <View
                                        style={[
                                            styles.contentActionModalBottom,
                                            {
                                                borderBottomColor: Color.borderColor,
                                                width: "100%"
                                            },
                                        ]}
                                        key={item.id}>
                                        <Text body2 semibold numberOfLines={2}>
                                            {`${item.description}  ${item.unit_price ? ' - ' + item.unit_price : ''} \n ${cutStringWithoutDot(item.act.name, 50)}`}
                                        </Text>
                                        <View style={styles.iconRight}>
                                            <TouchableOpacity onPress={() => {
                                                setElementToSetPrice({
                                                    ...item,
                                                    drugs: false
                                                });
                                                setModalModifyExamen(true);
                                            }}>
                                                <Icon name="edit" size={24}
                                                      color={Color.primaryColor}/>
                                            </TouchableOpacity>
                                            <TouchableOpacity
                                                onPress={() => {
                                                    setConsultation({
                                                        ...consultation,
                                                        exams: consultation.exams.map(exam => {
                                                            return item.id === exam.id ? {
                                                                ...exam,
                                                                to_delete: true
                                                            } : exam
                                                        })
                                                    });
                                                }}>
                                                <Icon
                                                    name="minus-circle"
                                                    size={24}
                                                    color={Color.grayColor}
                                                />
                                            </TouchableOpacity>
                                        </View>
                                    </View>
                                )
                            }}/>

                        <Button
                            full
                            style={{marginTop: 10, marginBottom: 20}}
                            onPress={() => setModalExamen(false)}>
                            {I18n.t('OK')}
                        </Button>
                    </View>
                </Modal>
            </View>
        </ScrollView>
    );

    console.log("consultaiton", consultation);

    const renderListAssure = () => (
        <ScrollView style={{flex: 1}}>
            <View style={[styles.containModal, {backgroundColor: Color.containerBackgroundColor}]}>
                <Modal
                    isVisible={modalListAssure}
                    onSwipeComplete={() => {
                        setModalListAssure(false);
                    }}
                    swipeDirection={['down']}
                    style={styles.bottomModal}>
                    <View
                        style={[
                            styles.contentFilterBottom,
                            {backgroundColor: Color.containerBackgroundColor},
                        ]}>
                        <View style={styles.contentSwipeDown}>
                            <View style={styles.lineSwipeDown}/>
                        </View>

                        <Text body2 style={{marginTop: 10}}>{I18n.t('LIST_ASSURE')}</Text>

                        <FlatList data={getUserByNameOrNumber.result?.response}
                                  extraData={getUserByNameOrNumber.result?.response}
                                  ListEmptyComponent={<Text body2>{I18n.t('NO_ASSURE_MATCH_SEARCH')}</Text>}
                                  keyExtractor={(item, index) => index}
                                  renderItem={({item, index}) => {
                                      return (
                                          <View style={{
                                              paddingVertical: 15,
                                              alignItems: 'flex-start',
                                          }}>
                                              <TouchableOpacity
                                                  style={[
                                                      styles.contentActionModalBottom,
                                                      {
                                                          borderBottomColor: Color.borderColor,
                                                          width: "100%",
                                                          flexDirection: 'column',
                                                      },

                                                  ]}
                                                  key={item.id}
                                                  onPress={() => {
                                                      if (item.state === 'SUSPENDED') {
                                                          Alert.alert(I18n.t('ERROR_LABEL'), I18n.t('ASSURE_SUSPENDU'),
                                                              [{
                                                                  text: I18n.t('OK'), onPress: () => {
                                                                  }
                                                              }]);
                                                      } else if (item.state !== 'PAID') {
                                                          Alert.alert(I18n.t('ERROR_LABEL'), I18n.t('ASSURE_NON_EN_REGLE'),
                                                              [{
                                                                  text: I18n.t('OK'), onPress: () => {
                                                                  }
                                                              }]);
                                                      } else {
                                                          setAssure(item);
                                                          setBeneficiary(null);
                                                          setStatutPatient(1);
                                                          setModalListAssure(false);
                                                          setFieldValue(
                                                              'lastname_patient',
                                                              item.user.lastname,
                                                          );
                                                          setFieldValue(
                                                              'firstname_patient',
                                                              item.user.firstname,
                                                          );
                                                          //dispatch(fetchGetUserByNameOrNumberReset());
                                                          fetchGetConsultation(item.user.id, 'UNTREATED', 'CONSULTATION', `&network_agent_id=${wallet.network_agent_id}`);
                                                      }
                                                  }}>
                                                  <Text body2 semibold>
                                                      {`${item.user.firstname !== null ? item.user.firstname : ''} ${item.user.lastname !== null ? item.user.lastname : ''}`}
                                                  </Text>
                                                  <Text footnote>
                                                      {`${I18n.t('MONTANT_ASSURANCE_CONSOMME')}: ${item.insurance_consumed_amount}`}
                                                  </Text>
                                                  <Text footnote>
                                                      {`${I18n.t('MONTANT_ASSURANCE_RESTANTE')}: ${item.insurance_remaining_amount}`}
                                                  </Text>
                                              </TouchableOpacity>
                                              {item.beneficiaries.map((beneficiary) => (
                                                  <TouchableOpacity style={styles.beneficiarySubSection}
                                                                    onPress={() => {
                                                                        if (item.state === 'SUSPENDED') {
                                                                            Alert.alert(I18n.t('ERROR_LABEL'), I18n.t('ASSURE_PRINCIPAL_SUSPENDU'),
                                                                                [{
                                                                                    text: I18n.t('OK'), onPress: () => {
                                                                                    }
                                                                                }]);
                                                                        } else {
                                                                            setAssure(item);
                                                                            setBeneficiary(beneficiary);
                                                                            setStatutPatient(0);
                                                                            setModalListAssure(false);
                                                                            setFieldValue(
                                                                                'lastname_patient',
                                                                                beneficiary.lastname,
                                                                            );
                                                                            setFieldValue(
                                                                                'firstname_patient',
                                                                                beneficiary.firstname,
                                                                            );
                                                                            fetchGetConsultation(item.user.id, 'UNTREATED', 'CONSULTATION', `&beneficiary_id=${beneficiary.id}`);
                                                                        }
                                                                    }}>
                                                      <View style={{width: 10}}/>
                                                      <View style={{paddingHorizontal: 10, alignItems: 'flex-start'}}>
                                                          <Text subhead semibold textAlign="left">
                                                              {`${beneficiary.firstname !== null ? beneficiary.firstname : ''} ${beneficiary.lastname !== null ? beneficiary.lastname : ''} (${I18n.t('AYANT_DROITS')})`}
                                                          </Text>
                                                          <Text footnote>
                                                              {`${I18n.t('MONTANT_ASSURANCE_CONSOMME')}: ${beneficiary.insurance_consumed_amount}`}
                                                          </Text>
                                                          <Text footnote>
                                                              {`${I18n.t('MONTANT_ASSURANCE_RESTANTE')}: ${beneficiary.insurance_remaining_amount}`}
                                                          </Text>
                                                      </View>
                                                  </TouchableOpacity>
                                              ))}
                                          </View>

                                      )
                                  }}/>

                        <Button
                            full
                            style={{marginTop: 10, marginBottom: 20}}
                            onPress={() => setModalListAssure(false)}>
                            {I18n.t('OK')}
                        </Button>

                    </View>
                </Modal>
            </View>
        </ScrollView>
    );

    const renderListConsultation = () => (
        <ScrollView style={{flex: 1}}>
            <View style={[styles.containModal, {backgroundColor: Color.containerBackgroundColor}]}>
                <Modal
                    isVisible={modalConsultation}
                    onSwipeComplete={() => {
                        setModalConsultation(false);
                    }}
                    swipeDirection={['down']}
                    style={styles.bottomModal}>
                    <View
                        style={[
                            styles.contentFilterBottom,
                            {backgroundColor: Color.containerBackgroundColor},
                        ]}>
                        <View style={styles.contentSwipeDown}>
                            <View style={styles.lineSwipeDown}/>
                        </View>

                        <Text body2 style={{marginTop: 10}}>{I18n.t('LIST_CONSULTATION')}</Text>

                        <FlatList data={getConsultation.result?.response}
                                  ListEmptyComponent={<Text body2>{I18n.t('NO_CONSULTATION')}</Text>}
                                  extraData={getConsultation.result?.response}
                                  keyExtractor={(item, index) => index}
                                  renderItem={({item, index}) => {
                                      return (

                                          <TouchableOpacity
                                              style={[
                                                  styles.contentActionModalBottom,
                                                  {
                                                      borderBottomColor: Color.borderColor,
                                                      width: "100%"
                                                  },
                                              ]}
                                              key={item.id}
                                              onPress={() => {
                                                  setHistoryItemDetail(item);
                                                  setDisplayModalHistory(true);
                                              }}>
                                              <Text body2 semibold>
                                                  {`${item.type} #${item.health_care_sheet_id} - ${moment(item.created_at).format('YYYY-MM-DD')}`}
                                              </Text>
                                          </TouchableOpacity>
                                      )
                                  }}/>

                        <Button
                            full
                            style={{marginTop: 10, marginBottom: 20}}
                            onPress={() => setModalConsultation(false)}>
                            {I18n.t('OK')}
                        </Button>

                    </View>
                </Modal>
            </View>
        </ScrollView>
    );

    const renderModalHistoryDetail = () => (
        <Dialog.Container useNativeDriver={true} visible={displayModalHistory}>

            <Dialog.Title>{I18n.t('DETAIL')}</Dialog.Title>

            <ScrollView persistentScrollbar={true}>
                <View style={[styles.blockView, {borderBottomColor: Color.borderColor}]}>
                    <View style={{flexDirection: 'row', marginTop: 10}}>
                        <View style={{flex: 1}}>
                            <Text style={[styles.body2]}>{I18n.t('PATIENT')}</Text>
                        </View>
                        <View style={{flex: 1, alignItems: 'flex-end'}}>
                            <Text
                                style={[Typography.caption1, Color.grayColor]}>{`${historyItemDetail.patient_lastname !== null ? historyItemDetail.patient_lastname : ''} ${historyItemDetail.patient_firstname !== null ? historyItemDetail.patient_firstname : ''}`}</Text>
                        </View>
                    </View>
                    <View style={{flexDirection: 'row', marginTop: 10}}>
                        <View style={{flex: 1}}>
                            <Text style={[styles.body2]}>Situation</Text>
                        </View>
                        <View style={{flex: 1, alignItems: 'flex-end'}}>
                            <Text
                                style={[Typography.caption1, Color.grayColor]}>{historyItemDetail.patient_situation.toLowerCase()}</Text>
                        </View>
                    </View>
                    <View style={{flexDirection: 'row', marginTop: 10}}>
                        <View style={{flex: 1}}>
                            <Text style={[styles.body2]}>{I18n.t('PRATICIEN')}</Text>
                        </View>
                        <View style={{flex: 1, alignItems: 'flex-end'}}>
                            <Text
                                style={[Typography.caption1, Color.grayColor]}>{`${historyItemDetail.practitioner_lastname} ${historyItemDetail.practitioner_firstname}`}</Text>
                        </View>
                    </View>
                    <View style={{flexDirection: 'row', marginTop: 10}}>
                        <View style={{flex: 1}}>
                            <Text style={[styles.body2]}>{I18n.t('CLASSE_PRESTATAIRE')}</Text>
                        </View>
                        <View style={{flex: 1, alignItems: 'flex-end'}}>
                            <Text
                                style={[Typography.caption1, Color.grayColor]}>{uppercaseFirstLetter(historyItemDetail.practitioner_provider_class.toLowerCase())}</Text>
                        </View>
                    </View>
                    <View style={{flexDirection: 'row', marginTop: 10}}>
                        <View style={{flex: 1}}>
                            <Text style={[styles.body2]}>{I18n.t('STATE')}</Text>
                        </View>
                        <View style={{flex: 1, alignItems: 'flex-end'}}>
                            <Text
                                style={[Typography.caption1, Color.grayColor]}>{uppercaseFirstLetter(historyItemDetail.state.toLowerCase())}</Text>
                        </View>
                    </View>
                    <View style={{flexDirection: 'row', marginTop: 10}}>
                        <View style={{flex: 1}}>
                            <Text style={[styles.body2]}>Type</Text>
                        </View>
                        <View style={{flex: 1, alignItems: 'flex-end'}}>
                            <Text
                                style={[Typography.caption1, Color.grayColor]}>{uppercaseFirstLetter(historyItemDetail.type.toLowerCase())}</Text>
                        </View>
                    </View>
                    <View style={{flexDirection: 'row', marginTop: 10}}>
                        <View style={{flex: 1}}>
                            <Text style={[styles.body2]}>{I18n.t('CONDITION_PRISE_CHARGE')}</Text>
                        </View>
                        <View style={{flex: 1, alignItems: 'flex-end'}}>
                            <Text
                                style={[Typography.caption1, Color.grayColor]}>{uppercaseFirstLetter(historyItemDetail.care_condition.toLowerCase())}</Text>
                        </View>
                    </View>
                    <View style={{flexDirection: 'row', marginTop: 10}}>
                        <View style={{flex: 1}}>
                            <Text style={[styles.body2]}>{I18n.t('INSTITUTE_NAME')}</Text>
                        </View>
                        <View style={{flex: 1, alignItems: 'flex-end'}}>
                            <Text
                                style={[Typography.caption1, Color.grayColor]}>{uppercaseFirstLetter(historyItemDetail.institution_name.toLowerCase())}</Text>
                        </View>
                    </View>
                    <View style={{flexDirection: 'row', marginTop: 10}}>
                        <View style={{flex: 1}}>
                            <Text style={[styles.body2]}>Date</Text>
                        </View>
                        <View style={{flex: 1, alignItems: 'flex-end'}}>
                            <Text
                                style={[Typography.caption1, Color.grayColor]}>{moment(historyItemDetail.created_at).format('YYYY-MM-DD')}</Text>
                        </View>
                    </View>
                    <View style={{flexDirection: 'row', marginTop: 10}}>
                        <View style={{flex: 1}}>
                            <Text style={[styles.body2]}>{I18n.t('PRESTATION')}</Text>
                        </View>
                        <View style={{flex: 1, alignItems: 'flex-end'}}>
                            {historyItemDetail.performances.map(performance => (
                                <Text
                                    style={[Typography.caption1, Color.grayColor]}>{`${performance.act.name} \n ${performance.amount} \n`}</Text>
                            ))}
                        </View>
                    </View>
                    <View style={{flexDirection: 'row', marginTop: 10}}>
                        <View style={{flex: 1}}>
                            <Text style={[styles.body2]}>{I18n.t('EXAMEN')}</Text>
                        </View>
                        <View style={{flex: 1, alignItems: 'flex-end'}}>
                            {historyItemDetail.exams.map(exam => (
                                <Text
                                    style={[Typography.caption1, Color.grayColor]}>{`${exam.description} \n ${exam.act.name} \n`}</Text>
                            ))}
                        </View>
                    </View>
                    <View style={{flexDirection: 'row', marginTop: 10}}>
                        <View style={{flex: 1}}>
                            <Text style={[styles.body2]}>{I18n.t('MEDICAMENT')}</Text>
                        </View>
                        <View style={{flex: 1, alignItems: 'flex-end'}}>
                            {historyItemDetail.prescriptions.map(prescription => (
                                <Text
                                    style={[Typography.caption1, Color.grayColor]}>{`${prescription.drug_or_device.name} \n ${prescription.dosage} \n`}</Text>
                            ))}
                        </View>
                    </View>

                </View>
            </ScrollView>

            <Dialog.Button bold={true} label={I18n.t('CANCEL_LABEL')} onPress={() => {
                setDisplayModalHistory(false);
            }}/>


            <Dialog.Button bold={true} label={I18n.t('OK')} onPress={() => {
                setDisplayModalHistory(false);
                setModalListAssure(false);
                setModalConsultation(false);
                setConsultation({
                    ...historyItemDetail,
                    exams: historyItemDetail.exams.map(exam => {
                        return {...exam, to_delete: false}
                    }),
                    performances: historyItemDetail.performances.map(performance => {
                        return {...performance, to_delete: false}
                    }),
                    prescriptions: historyItemDetail.prescriptions.map(prescription => {
                        return {...prescription, to_delete: false}
                    })
                });
                setConsultationClone({
                    ...historyItemDetail,
                    exams: historyItemDetail.exams.map(exam => {
                        return {...exam, to_delete: false}
                    }),
                    performances: historyItemDetail.performances.map(performance => {
                        return {...performance, to_delete: false}
                    }),
                    prescriptions: historyItemDetail.prescriptions.map(prescription => {
                        return {...prescription, to_delete: false}
                    })
                });
                setCareCondition(historyItemDetail.care_condition);
                setFieldValue(
                    'practitioner_firstname',
                    historyItemDetail.practitioner_firstname,
                );
                setFieldValue(
                    'practitioner_lastname',
                    historyItemDetail.practitioner_lastname,
                );
                setFieldValue(
                    'pregnancy_start_at',
                    historyItemDetail.pregnancy_start_at,
                );
                setFieldValue(
                    'accident_date',
                    historyItemDetail.accident_date,
                );
                setIsAccident(historyItemDetail.accident_date !== null);
                setIsGrossesse(historyItemDetail.pregnancy_start_at !== null);
                //dispatch(fetchGetUserByNameOrNumberReset());
                wizard.current.next();
            }}/>

        </Dialog.Container>
    )


    const renderListMedicament = () => (
        <ScrollView style={{flex: 1}}>
            <View style={[styles.containModal, {backgroundColor: Color.containerBackgroundColor}]}>
                <Modal
                    isVisible={modalListMedicament}
                    onSwipeComplete={() => {
                        setModalListMedicament(false);
                    }}
                    swipeDirection={['down']}
                    style={styles.bottomModal}>
                    <View
                        style={[
                            styles.contentFilterBottom,
                            {backgroundColor: Color.containerBackgroundColor},
                        ]}>
                        <View style={styles.contentSwipeDown}>
                            <View style={styles.lineSwipeDown}/>
                        </View>

                        <Text body2 style={{marginTop: 10}}>{I18n.t('MEDICAMENTS')}</Text>

                        <FlatList data={consultation.prescriptions.filter(prescription => !prescription.to_delete)}
                                  extraData={consultation.prescriptions.filter(prescription => !prescription.to_delete)}
                                  keyExtractor={(item, index) => index}
                                  renderItem={({item, index}) => {
                                      return (

                                          <View
                                              style={[
                                                  styles.contentActionModalBottom,
                                                  {
                                                      borderBottomColor: Color.borderColor,
                                                      width: "100%"
                                                  },
                                              ]}
                                              key={item.id}>
                                              <Text body2 semibold numberOfLines={2}>
                                                  {`${item.quantity} ${item.drug_or_device.name} ${item.unit_price ? ' - ' + item.unit_price : ''} \n ${item.dosage}`}
                                              </Text>
                                              <View style={styles.iconRight}>
                                                  <TouchableOpacity onPress={() => {
                                                      setElementToSetPrice({
                                                          ...item,
                                                          drugs: true
                                                      });
                                                      setModalModifyMedicament(true);
                                                  }}>
                                                      <Icon name="edit" size={24}
                                                            color={Color.primaryColor}/>
                                                  </TouchableOpacity>
                                                  <TouchableOpacity
                                                      onPress={() => {
                                                          setConsultation({
                                                              ...consultation,
                                                              prescriptions: consultation.prescriptions.map(prescription => {
                                                                  return item.id === prescription.id ? {
                                                                      ...prescription,
                                                                      to_delete: true
                                                                  } : prescription
                                                              })
                                                          });
                                                      }}>
                                                      <Icon
                                                          name="minus-circle"
                                                          size={24}
                                                          color={Color.grayColor}
                                                      />
                                                  </TouchableOpacity>
                                              </View>
                                          </View>
                                      )
                                  }}/>

                        <Button
                            full
                            style={{marginTop: 10, marginBottom: 20}}
                            onPress={() => setModalListMedicament(false)}>
                            {I18n.t('OK')}
                        </Button>
                    </View>
                </Modal>
            </View>
        </ScrollView>
    )

    const {
        handleChange,
        handleSubmit,
        handleBlur,
        values,
        errors,
        touched,
        setFieldValue,
        setFieldTouched,
        isValid,
    } = useFormik({
        validationSchema: ModifierFeuilleSoinSchema,
        initialValues: {
            numero_assure: '',
            password: '',
            firstname_patient: '',
            lastname_patient: '',
            practitioner_firstname: '',
            practitioner_lastname: '',
            agrement_praticien: user?.code_membre,
            pregnancy_start_at: null,
            pregnancy_end_at: null,
            accident_date: null,
        },
        onSubmit: values => {
            fetchModifyPrescription(consultation.id, {
                network_agent_id: wallet.network_agent_id,
                password: values.password,
                practitioner_lastname: values.practitioner_lastname,
                practitioner_firstname: values.practitioner_firstname,
                practitioner_provider_class_id: values.practitioner_provider_class_id,
                care_condition: values.care_condition,
                accident_date: values.accident_date,
                pregnancy_start_at: values.pregnancy_start_at,
                pregnancy_end_at: values.pregnancy_end_at,
                performances: consultation.performances,
                prescriptions: consultation.prescriptions,
                exams: consultation.exams
            });
        },
    });

    const onNext = () => {
        console.log("currentStep", currentStep);
        switch (currentStep) {
            case 0:
                console.log("values", values);
                if (values.numero_assure !== '' && getUserByNameOrNumber.result === null) {
                    dispatch(fetchGetUserByNameOrNumberReset());
                    if (isNumeroAssureSearch)
                        fetchGetUserByNameOrNumber(wallet.id_network, `&insured_id=${values.numero_assure}`);
                    else if (isPhoneAssureSearch)
                        fetchGetUserByNameOrNumber(wallet.id_network, `&phone=${values.numero_assure}`);
                    else
                        fetchGetUserByNameOrNumber(wallet.id_network, `&name=${values.numero_assure}`)
                    console.log("errors", errors);
                }
                return false;
                break;

            default:
                return true;
        }
    };


    const stepList = [
        {
            title: I18n.t('ASSURE'),
            content: (
                <View>
                    <TextInput
                        style={{marginTop: 10, width: responsiveWidth(90)}}
                        placeholder={isNumeroAssureSearch ? I18n.t('NUMERO_ASSURE') : isPhoneAssureSearch ? I18n.t('PHONE_NUMBER') : I18n.t('NOM_ASSURE')}
                        value={values.numero_assure}
                        keyboardType={isPhoneAssureSearch ? 'numeric' : 'default'}
                        onChangeText={handleChange('numero_assure')}
                        onBlur={handleBlur('numero_assure')}
                        success={touched.numero_assure && !errors.numero_assure}
                        touched={touched.numero_assure}
                        error={errors.numero_assure}
                        icon={
                            <FontAwesome
                                style={{zIndex: 10}}
                                name={isNumeroAssureSearch ? 'lock' : isPhoneAssureSearch ? 'phone' : 'user'}
                                size={20}
                            />
                        }
                    />
                    <View style={{
                        flexDirection: 'row',
                        position: 'absolute',
                        top: 22,
                        right: 70,
                        justifyContent: 'space-between',
                        width: 50
                    }}>
                        <Icon
                            style={{paddingRight: 10}}
                            name='lock'
                            size={20}
                            color={Color.primaryColor}
                            onPress={() => {
                                setIsNumeroAssureSearch(true);
                                setIsPhoneAssureSearch(false);
                            }}
                        />
                        <Icon
                            style={{paddingRight: 10}}
                            name='phone'
                            size={20}
                            color={Color.primaryColor}
                            onPress={() => {
                                setIsNumeroAssureSearch(false);
                                setIsPhoneAssureSearch(true);
                            }}
                        />
                        <Icon
                            style={{paddingRight: 10}}
                            name='user'
                            size={20}
                            color={Color.primaryColor}
                            onPress={() => {
                                setIsNumeroAssureSearch(false);
                                setIsPhoneAssureSearch(false);
                            }}
                        />
                        <Icon
                            style={{paddingRight: 10}}
                            name="qrcode"
                            size={20}
                            color={Color.primaryColor}
                            onPress={() => {
                                setShowQRCodeScanner(true);
                            }}
                        />
                    </View>
                </View>
            ),
        },
        {
            title: I18n.t('PATIENT'),
            content: (
                <View>
                    <TextInput
                        style={{marginTop: 10}}
                        placeholder={I18n.t('NOM_CLIENT')}
                        value={values.lastname_patient}
                        onChangeText={handleChange('lastname_patient')}
                        onBlur={handleBlur('lastname_patient')}
                        success={touched.lastname_patient && !errors.lastname_patient}
                        touched={touched.lastname_patient}
                        editable={false}
                        error={errors.lastname_patient}
                    />

                    <TextInput
                        style={{marginTop: 10}}
                        placeholder={I18n.t('PRENOM_CLIENT')}
                        value={values.firstname_patient}
                        editable={false}
                        onChangeText={handleChange('firstname_patient')}
                        onBlur={handleBlur('firstname_patient')}
                        success={touched.firstname_patient && !errors.firstname_patient}
                        touched={touched.firstname_patient}
                        error={errors.firstname_patient}
                    />

                    <View style={{
                        marginTop: 10,
                        flexDirection: 'row',
                        justifyContent: "space-between"
                    }}>
                        <Text body2>{I18n.t('SITUATION')}</Text>
                        <View style={{width: responsiveWidth(60)}}>
                            <SwitchSelector options={statutPatientOption}
                                            disabled={true}
                                            value={statutPatient}
                                            initial={statutPatient}
                                            buttonColor={Color.accentColor}
                                            backgroundColor={Color.primaryDarkColor}
                                            textColor='white'
                                            bold={true}
                                            hasPadding
                                            height={32}
                                            onPress={(value) => {
                                                //setGender(value);
                                            }}/>
                        </View>
                    </View>
                </View>
            ),
        },
        {
            title: I18n.t('PRATICIEN'),
            content: (
                <View>
                    <TextInput
                        style={{marginTop: 10}}
                        placeholder={I18n.t('CODE_AGREMENT')}
                        value={values.agrement_praticien}
                        editable={false}
                    />

                    <TextInput
                        style={{marginTop: 10}}
                        placeholder={I18n.t('NOM_PRATICIEN')}
                        value={values.practitioner_lastname}
                        onChangeText={handleChange('practitioner_lastname')}
                        onBlur={handleBlur('practitioner_lastname')}
                        success={touched.practitioner_lastname && !errors.practitioner_lastname}
                        touched={touched.practitioner_lastname}
                        error={errors.practitioner_lastname}
                    />

                    <TextInput
                        style={{marginTop: 10}}
                        placeholder={I18n.t('PRENOM_PRATICIEN')}
                        value={values.practitioner_firstname}
                        onChangeText={handleChange('practitioner_firstname')}
                        onBlur={handleBlur('practitioner_firstname')}
                        success={touched.practitioner_firstname && !errors.practitioner_firstname}
                        touched={touched.practitioner_firstname}
                        error={errors.practitioner_firstname}
                    />

                    <Animatable.View ref={(comp) => {
                        classificationRef = comp
                    }}
                                     style={{
                                         width: responsiveWidth(90),
                                         height: 60,
                                         alignSelf: 'center',
                                         borderRadius: 10,
                                         paddingLeft: 20,
                                         marginTop: 10,
                                         paddingRight: 20,
                                         backgroundColor: 'white'
                                     }}>
                        <Dropdown
                            label={I18n.t('CLASSIFICATION')}
                            value={historyItemDetail !== null ? historyItemDetail.practitioner_provider_class : ''}
                            data={getProviderClass.result !== null ? getProviderClass.result?.response : []}
                            useNativeDriver={true}
                            onChangeText={(value, index, data) => {
                                setFieldTouched('practitioner_provider_class_id');
                                setFieldValue('practitioner_provider_class_id', value.id);
                                console.log("Value", value);
                            }}
                            valueExtractor={(value) => {
                                return value
                            }}
                            labelExtractor={(value) => {
                                return value.name
                            }}
                        />
                    </Animatable.View>

                    <Animatable.View ref={(comp) => {
                        classificationRef = comp
                    }}
                                     style={{
                                         width: responsiveWidth(90),
                                         height: 60,
                                         alignSelf: 'center',
                                         borderRadius: 10,
                                         paddingLeft: 20,
                                         marginTop: 10,
                                         paddingRight: 20,
                                         backgroundColor: 'white'
                                     }}>
                        <Dropdown
                            label={I18n.t('CONDITION_PRISE_CHARGE')}
                            value={historyItemDetail !== null ? historyItemDetail.care_condition : ''}
                            data={conditionPriseEnChange}
                            useNativeDriver={true}
                            onChangeText={(value, index, data) => {
                                console.log("Value", value);
                                setCareCondition(value);
                                setFieldTouched('care_condition');
                                setFieldValue('care_condition', value);
                            }}
                            valueExtractor={(value) => {
                                return value.value
                            }}
                            labelExtractor={(value) => {
                                return value.label
                            }}
                        />
                    </Animatable.View>


                    <View style={{
                        marginTop: 10,
                        flexDirection: 'row',
                        justifyContent: "space-between"
                    }}>
                        <Text body2>{I18n.t('ACCIDENT')}</Text>
                        <View style={{width: responsiveWidth(40)}}>
                            <SwitchSelector options={accident}
                                            initial={historyItemDetail !== null ? historyItemDetail.accident_date !== null ? 0 : 1 : 1}
                                            buttonColor={Color.accentColor}
                                            backgroundColor={Color.primaryDarkColor}
                                            textColor='white'
                                            bold={true}
                                            hasPadding
                                            height={32}
                                            onPress={(value) => {
                                                console.log(value);
                                                setIsAccident(value === 'YES');
                                            }}/>
                        </View>
                    </View>

                    {
                        isAccident && (
                            <TextInput
                                style={{marginTop: 10}}
                                placeholder={I18n.t('DATE_ACCIDENT')}
                                value={dateAccident !== null ? dateAccident : ''}
                                onChangeText={handleChange('date_accident')}
                                onBlur={handleBlur('date_accident')}
                                onFocus={() => {
                                    Keyboard.dismiss();
                                    //setDateAccident('' + moment(new Date()).format('YYYY-MM-DD'));
                                    setShowDateAccidentPicker(true);
                                }}
                                success={touched.date_accident && !errors.date_accident}
                                touched={touched.date_accident}
                                error={errors.date_accident}
                            />
                        )
                    }

                    <View style={{
                        marginTop: 10,
                        flexDirection: 'row',
                        justifyContent: "space-between"
                    }}>
                        <Text body2>{I18n.t('GROSSESSE')}</Text>
                        <View style={styles.contentSwitch}>
                            <SwitchSelector options={grossesse}
                                            initial={historyItemDetail !== null ? historyItemDetail.pregnancy_start_at !== null ? 0 : 1 : 1}
                                            buttonColor={Color.accentColor}
                                            backgroundColor={Color.primaryDarkColor}
                                            textColor='white'
                                            bold={true}
                                            hasPadding
                                            height={32}
                                            onPress={(value) => {
                                                setIsGrossesse(value === 'YES');
                                            }}/>
                        </View>
                    </View>

                    {
                        isGrossesse && (
                            <>
                                <TextInput
                                    style={{marginTop: 10}}
                                    placeholder={I18n.t('DATE_DEBUT_GROSSESSE')}
                                    value={dateDebutGrossesse !== null ? dateDebutGrossesse : ''}
                                    onChangeText={handleChange('date_debut_grossesse')}
                                    onBlur={handleBlur('date_debut_grossesse')}
                                    onFocus={() => {
                                        Keyboard.dismiss();
                                        //setDateAccident('' + moment(new Date()).format('YYYY-MM-DD'));
                                        setShowDateDebutGrossessePicker(true);
                                    }}
                                    success={touched.date_debut_grossesse && !errors.date_debut_grossesse}
                                    touched={touched.date_debut_grossesse}
                                    error={errors.date_debut_grossesse}
                                />

                                <TextInput
                                    style={{marginTop: 10}}
                                    placeholder={I18n.t('DATE_FIN_GROSSESSE')}
                                    value={dateFinGrossesse !== null ? dateFinGrossesse : ''}
                                    onChangeText={handleChange('date_fin_grossesse')}
                                    onBlur={handleBlur('date_fin_grossesse')}
                                    onFocus={() => {
                                        Keyboard.dismiss();
                                        //setDateAccident('' + moment(new Date()).format('YYYY-MM-DD'));
                                        setShowDateFinGrossessePicker(true);
                                    }}
                                    success={touched.date_fin_grossesse && !errors.date_fin_grossesse}
                                    touched={touched.date_fin_grossesse}
                                    error={errors.date_fin_grossesse}
                                />
                            </>
                        )
                    }

                    {
                        wallet.password_validation === "MAX" &&
                        <TextInput
                            style={{marginTop: 10}}
                            placeholder={I18n.t('PASSWORD')}
                            value={values.password}
                            onChangeText={handleChange('password')}
                            onBlur={handleBlur('password')}
                            success={touched.password && !errors.password}
                            touched={touched.password}
                            error={errors.password}
                            secureTextEntry
                        />
                    }

                    <View
                        style={{
                            marginTop: 25,
                        }}>
                        <View style={{
                            flexDirection: 'row',
                            alignItems: 'center',
                            justifyContent: 'space-between',
                        }}>

                            <TouchableOpacity
                                style={[
                                    styles.iconNavigationButton,
                                    {
                                        borderRadius: 5,
                                        width: 150,
                                        height: 30,
                                        flexDirection: "row",
                                        backgroundColor:
                                        Color.primaryColor,
                                        borderColor:
                                        Color.primaryColor,
                                    },
                                ]}
                                onPress={e => {
                                    setModalListPrestation(true);
                                }}>
                                <Text whiteColor>{I18n.t('CONSULTATION')}</Text>
                                <MaterialCommunityIcons
                                    name="medical-bag"
                                    size={20}
                                    color={Color.whiteColor}
                                />
                            </TouchableOpacity>

                            <TouchableOpacity
                                style={[
                                    styles.iconNavigationButton,
                                    {
                                        borderRadius: 5,
                                        width: 150,
                                        height: 30,
                                        flexDirection: "row",
                                        backgroundColor:
                                        Color.primaryColor,
                                        borderColor:
                                        Color.primaryColor,
                                    },
                                ]}
                                onPress={e => {
                                    setModalExamen(true);
                                }}>
                                <Text whiteColor>{I18n.t('ACTE_EXAMEN')}</Text>
                                <FontAwesome5
                                    name="file-medical"
                                    size={20}
                                    color={Color.whiteColor}
                                />
                            </TouchableOpacity>
                        </View>
                    </View>

                    <View style={{
                        marginTop: 25,
                        flexDirection: "row",
                        alignItems: 'center',
                        justifyContent: 'center',
                        width: "100%"
                    }}>

                        <TouchableOpacity
                            style={[
                                styles.iconNavigationButton,
                                {
                                    borderRadius: 5,
                                    width: 150,
                                    height: 30,
                                    backgroundColor: Color.primaryColor,
                                    borderColor: Color.primaryColor,
                                    flexDirection: "row",
                                },
                            ]}
                            onPress={e => {
                                setModalMedicament(true);
                                setMedicament(null);
                            }}>
                            <Text whiteColor>{I18n.t('MEDICAMENT')}</Text>
                            <Fontisto
                                name="drug-pack"
                                size={20}
                                color={Color.whiteColor}
                            />
                        </TouchableOpacity>
                    </View>

                </View>
            ),
        },
    ];

    return (
        <ScreenComponent>
            <DropdownAlert ref={ref => (dropDownAlertRef = ref)}/>
            <KeyboardAvoidingView
                behavior={Platform.OS === 'android' ? 'height' : 'padding'}
                style={{flex: 1}}>

                <ScrollView style={{flex: 1}}>
                    <View style={styles.contain}>

                        <StepHeader
                            steps={stepList}
                            currentStepIndex={currentStep + 1}
                        />

                        <View
                            style={{
                                flexDirection: 'column',
                                alignItems: 'center',
                            }}>
                            <Wizard
                                ref={wizard}
                                activeStep={0}
                                steps={stepList}
                                useNativeDriver
                                nextStepAnimation="slideLeft"
                                prevStepAnimation="slideRight"
                                isFirstStep={val =>
                                    setIsFirstStep(val)
                                }
                                isLastStep={val =>
                                    setIsLastStep(val)
                                }
                                onNext={() => {
                                    onNext();
                                }}
                                onPrev={() => {
                                    if (currentStep === 0)
                                        dispatch(fetchGetUserByNameOrNumberReset());
                                }}
                                currentStep={({
                                                  currentStep,
                                                  isLastStep,
                                                  isFirstStep,
                                              }) => {
                                    setCurrentStep(currentStep);
                                    setIsFirstStep(isFirstStep);
                                    setIsLastStep(isLastStep);
                                }}
                            />
                        </View>

                        <View style={styles.iconNavigation}>
                            {!isFirstStep ? (
                                <TouchableOpacity
                                    style={[
                                        styles.iconNavigationButton,
                                        {
                                            backgroundColor:
                                            Color.primaryColor,
                                            borderColor:
                                            Color.primaryColor,
                                        },
                                    ]}
                                    onPress={() =>
                                        wizard.current.prev()
                                    }>
                                    <Icon
                                        name="arrow-left"
                                        size={20}
                                        color={Color.whiteColor}
                                    />
                                </TouchableOpacity>
                            ) : (
                                <View/>
                            )}
                            {currentStep === 2 ? (
                                <Button
                                    loading={executionPrescription.loading}
                                    onPress={handleSubmit}>
                                    {I18n.t('SUBMIT_LABEL')}
                                </Button>
                            ) : (
                                <TouchableOpacity
                                    style={[
                                        styles.iconNavigationButton,
                                        {
                                            backgroundColor:
                                            Color.primaryColor,
                                            borderColor:
                                            Color.primaryColor,
                                        },
                                    ]}
                                    onPress={e => {
                                        if (onNext())
                                            wizard.current.next();
                                    }}>
                                    {(getUserByNameOrNumber.loading || getUserByIdQRCode.loading || getConsultation.loading) ?
                                        <ActivityIndicator
                                            size="small"
                                            color="#fff"
                                        />
                                        : <Icon
                                            name="arrow-right"
                                            size={24}
                                            color={Color.whiteColor}
                                        />}
                                </TouchableOpacity>
                            )}
                        </View>
                        {modalVisible && renderModalExclusion()}
                        {modalPrestation && renderAddNewPrestation()}
                        {modalListPrestation && renderPresatationList()}
                        {modalModifyPrestation && renderModifyPrestation()}
                        {modalMedicament && renderAddNewMedicament()}
                        {modalModifyMedicament && renderModifyMedicament()}
                        {modalModifyExamen && renderModifyExamen()}
                        {showDatePrestation && renderDatePrestationPicker()}
                        {showDateAccidentPicker && renderDateAccidentPicker()}
                        {showDateDebutGrossessePicker && renderDateDebutGrossessePicker()}
                        {showDateFinGrossessePicker && renderDateFinGrossessePicker()}
                        {modalExamen && renderExamList()}
                        {showQRCodeScanner && renderDialogQRCodeScanner()}
                        {modalListAssure && renderListAssure()}
                        {modalListMedicament && renderListMedicament()}
                        {modalConsultation && renderListConsultation()}
                        {displayModalHistory && renderModalHistoryDetail()}
                        {modalPrice && renderPriceModal()}
                    </View>
                </ScrollView>
            </KeyboardAvoidingView>
            {(getExclusion.result !== null) && (<TouchableOpacity
                style={{
                    alignItems: 'center',
                    flexDirection: 'row',
                    width: 60,
                    position: 'absolute',
                    bottom: 10,
                    right: 10,
                    height: 60,
                    padding: 3,
                    backgroundColor: Color.primaryColor,
                    borderRadius: 100,
                }}
                onPress={() => {
                    setModalVisible(true)
                }}
            >
                <Text whiteColor caption2>{I18n.t('EXCLUSION')}</Text>
            </TouchableOpacity>)}
        </ScreenComponent>
    );
};

const mapStateToProps = createStructuredSelector({
    activatePaySubscription: selectActivatePaySubscription,
    getUserByNameOrNumber: selectGetUserByNameOrNumber,
    getUserByIdQRCode: selectGetUserByIdQRCode,
    getProviderClass: selectGetProviderClass,
    getDrugAppareil: selectGetDrugAppareil,
    getAmountConsultation: selectGetAmountConsultation,
    executionPrescription: selectExecutionPrescription,
    getConsultation: selectGetConsultation,
    getNetworkAct: selectGetNetworkAct,
    modifyPrescription: selectModifyPrescription,
    checkInsuranceCoverageAmount: selectCheckInsuranceCoverageAmount,
    getExclusion: selectGetExclusion
});

export default connect(mapStateToProps, {
    fetchActivePaySubscription,
    fetchGetUserByIdQRCode,
    fetchGetUserByNameOrNumber,
    fetchGetProviderClass,
    fetchGetDrugAppareil,
    fetchGetNetworkActs,
    fetchCreateConsultation,
    fetchGetAmountConsultation,
    fetchGetConsultation,
    fetchExecutionPrescription,
    fetchModifyPrescription,
    fetchCheckInsuranceCoverageAmount,
    fetchGetExclusion
})(
    ModifierFeuilleSoinScreen,
);
