573 lines
24 KiB
JavaScript
573 lines
24 KiB
JavaScript
/**
|
|
* Project iLinkWorld
|
|
* File DemandeAutorisationSoinScreen
|
|
* Path screens/wallet/user
|
|
* Created by BRICE ZELE
|
|
* Date: 01/02/2022
|
|
*/
|
|
import React, {useEffect, useState} from 'react';
|
|
import {
|
|
ActivityIndicator,
|
|
Alert,
|
|
Dimensions, FlatList,
|
|
KeyboardAvoidingView,
|
|
Platform,
|
|
ProgressBarAndroid,
|
|
ScrollView,
|
|
StyleSheet,
|
|
TouchableOpacity,
|
|
View,
|
|
} from 'react-native';
|
|
import {connect, useDispatch} from 'react-redux';
|
|
import {Color} from "../../../config/Color";
|
|
import I18n from 'react-native-i18n';
|
|
import {ScreenComponent} from "../../../components/ScreenComponent";
|
|
import {
|
|
fetchAcceptRejectConsultation,
|
|
fetchAcceptRejectConsultationReset,
|
|
fetchActivePaySubscription,
|
|
fetchDeleteBeneficiaryReset,
|
|
fetchDemaneAutorisationSoin,
|
|
fetchDemaneAutorisationSoinReset,
|
|
fetchGetConsultation,
|
|
fetchGetConsultationReset,
|
|
fetchGetListInsurance,
|
|
fetchGetListInsuranceReset,
|
|
fetchGetListInsuranceWithBeneficiaries,
|
|
fetchGetNetworkActs
|
|
} from "../../../redux/insurance/insurance.actions";
|
|
import DropdownAlert from "react-native-dropdownalert";
|
|
import {createStructuredSelector} from "reselect";
|
|
import {
|
|
selectAcceptRefuseConsultation,
|
|
selectActivatePaySubscription, selectDemandeAutorisationSoin,
|
|
selectGetConsultation, selectGetNetworkAct,
|
|
selectInsuranceList,
|
|
selectSubscriptionList
|
|
} from "../../../redux/insurance/insurance.selector";
|
|
import {readUser} from "../../../webservice/AuthApi";
|
|
import Text from '../../../components/Text';
|
|
import * as Utils from "../../../utils/UtilsFunction";
|
|
import {displayToast, uppercaseFirstLetter} from "../../../utils/UtilsFunction";
|
|
import Dialog from "react-native-dialog";
|
|
import {Typography} from "../../../config/typography";
|
|
import {store} from "../../../redux/store";
|
|
import {Formik} from "formik";
|
|
import * as Animatable from "react-native-animatable";
|
|
import {responsiveWidth} from "react-native-responsive-dimensions";
|
|
import {Dropdown} from "react-native-material-dropdown";
|
|
import PasswordInput from "../../../components/PasswordInput";
|
|
import FontAwesome from "react-native-vector-icons/FontAwesome";
|
|
import Button from "../../../components/Button";
|
|
import * as Yup from "yup";
|
|
import SpinnerOverlay from "../../../components/SpinnerOverlayComponent";
|
|
import Modal from "react-native-modal";
|
|
|
|
|
|
let moment = require('moment-timezone');
|
|
|
|
const {width, height} = Dimensions.get('window');
|
|
|
|
const DemandeAutorisationSoinScreen = ({
|
|
navigation,
|
|
fetchGetNetworkActs,
|
|
fetchAcceptRejectConsultation,
|
|
fetchGetListInsuranceWithBeneficiaries,
|
|
fetchDemaneAutorisationSoin,
|
|
getConsultation,
|
|
insuranceList,
|
|
getNetworkAct,
|
|
demandeAutorisationSoin
|
|
}) => {
|
|
const dispatch = useDispatch();
|
|
const [user, setUser] = useState(null);
|
|
const [displayModalHistory, setDisplayModalHistory] = useState(false);
|
|
const [historyItemDetail, setHistoryItemDetail] = useState({});
|
|
const [wallet] = useState(store.getState().walletDetailReducer.result.response);
|
|
const [insurances, setInsurances] = useState([]);
|
|
const [beneficiaries, setBeneficiaries] = useState([]);
|
|
const [beneficiaryId, setBeneficiaryId] = useState(null);
|
|
const [insurance, setInsurance] = useState(null);
|
|
|
|
let insurancesRef = null;
|
|
let codeActeRef = null;
|
|
const [modalListAssure, setModalListAssure] = useState(false);
|
|
|
|
let dropDownAlertRef: any = null;
|
|
|
|
const RegisterSchema = Yup.object().shape({
|
|
password: Yup.string()
|
|
.required(I18n.t('THIS_FIELD_IS_REQUIRED'))
|
|
});
|
|
|
|
useEffect(() => {
|
|
dispatch(fetchGetConsultationReset());
|
|
dispatch(fetchGetListInsuranceReset());
|
|
dispatch(fetchAcceptRejectConsultationReset());
|
|
readUser().then((user) => {
|
|
setUser(user);
|
|
console.log("User", user);
|
|
fetchGetListInsuranceWithBeneficiaries(`?user_id=${user.id}`);
|
|
//fetchGetConsultation(user.id, 'ACCEPTED', '');
|
|
});
|
|
//fetchGetNetworkActs(wallet.idNetwork, '', '&authorization_type=PRIOR');
|
|
}, []);
|
|
|
|
useEffect(() => {
|
|
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 (insuranceList.result !== null) {
|
|
let insuranceListTemp = [];
|
|
let beneficiariesListTemp = [];
|
|
insuranceList.result.response.map((insuranceItem, index) => {
|
|
insuranceListTemp.push(insuranceItem.network);
|
|
});
|
|
setInsurances(insuranceListTemp);
|
|
console.log("beneficiariesListTemp",beneficiariesListTemp);
|
|
}
|
|
|
|
if (insuranceList.error) {
|
|
Alert.alert(
|
|
I18n.t("ERROR_LABLE"),
|
|
Utils.getErrorMsg(insuranceList),
|
|
[
|
|
{
|
|
text: I18n.t("OK"), onPress: () => {
|
|
dispatch(fetchGetListInsuranceReset());
|
|
}
|
|
}
|
|
],
|
|
{ cancelable: false }
|
|
);
|
|
/* dropDownAlertRef.alertWithType(
|
|
'error',
|
|
I18n.t('ERROR_LABEL'),
|
|
Utils.getErrorMsg(insuranceList),
|
|
);
|
|
dispatch(fetchGetListInsuranceReset());*/
|
|
}
|
|
}, [insuranceList]);
|
|
|
|
useEffect(() => {
|
|
if (demandeAutorisationSoin.result !== null) {
|
|
Alert.alert(
|
|
I18n.t("SUCCESS"),
|
|
demandeAutorisationSoin.result.response,
|
|
[
|
|
{
|
|
text: I18n.t("OK"), onPress: () => {
|
|
dispatch(fetchDemaneAutorisationSoinReset());
|
|
navigation.goBack();
|
|
}
|
|
}
|
|
|
|
],
|
|
{cancelable: false}
|
|
);
|
|
}
|
|
|
|
if (demandeAutorisationSoin.error) {
|
|
Alert.alert(
|
|
I18n.t("ERROR_LABLE"),
|
|
Utils.getErrorMsg(demandeAutorisationSoin),
|
|
[
|
|
{
|
|
text: I18n.t("OK"), onPress: () => {
|
|
dispatch(fetchDemaneAutorisationSoinReset());
|
|
}
|
|
}
|
|
],
|
|
{ cancelable: false }
|
|
);
|
|
/* dropDownAlertRef.alertWithType(
|
|
'error',
|
|
I18n.t('ERROR_LABEL'),
|
|
Utils.getErrorMsg(demandeAutorisationSoin),
|
|
);
|
|
dispatch(fetchDemaneAutorisationSoinReset());*/
|
|
}
|
|
}, [demandeAutorisationSoin]);
|
|
|
|
const renderLoader = () => (
|
|
<View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
|
|
{Platform.OS === 'android'
|
|
?
|
|
(
|
|
<>
|
|
<ProgressBarAndroid/>
|
|
<Text>{I18n.t('LOADING_DOTS')}</Text>
|
|
|
|
</>
|
|
) :
|
|
<>
|
|
<ActivityIndicator size="large" color={'#ccc'}/>
|
|
<Text>{I18n.t('LOADING_DOTS')}</Text>
|
|
</>
|
|
}
|
|
</View>
|
|
);
|
|
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={beneficiaries}
|
|
ListEmptyComponent={<Text body2>{I18n.t('NO_ASSURE')}</Text>}
|
|
keyExtractor={(item, index) => index}
|
|
renderItem={({item, index}) => {
|
|
return (
|
|
<View style={{
|
|
paddingVertical: 0,
|
|
alignItems: 'flex-start',
|
|
}}>
|
|
<TouchableOpacity
|
|
style={[
|
|
styles.contentActionModalBottom,
|
|
{borderBottomColor: Color.borderColor, width: "100%"},
|
|
]}
|
|
key={item.id}
|
|
onPress={() => {
|
|
if(item.id === user.id)
|
|
setBeneficiaryId(null);
|
|
else
|
|
setBeneficiaryId(item.id);
|
|
setModalListAssure(false);
|
|
}}>
|
|
<Text body2 semibold>
|
|
{`${item.firstname} ${item.lastname} ${item.id === user.id ? '('+I18n.t('MY_ACCOUNT')+')' : ''}`}
|
|
</Text>
|
|
</TouchableOpacity>
|
|
</View>
|
|
)
|
|
}}/>
|
|
|
|
<Button
|
|
full
|
|
style={{marginTop: 10, marginBottom: 20}}
|
|
onPress={() => setModalListAssure(false)}>
|
|
{I18n.t('OK')}
|
|
</Button>
|
|
|
|
</View>
|
|
</Modal>
|
|
</View>
|
|
</ScrollView>
|
|
);
|
|
|
|
return (
|
|
<ScreenComponent>
|
|
<DropdownAlert ref={ref => (dropDownAlertRef = ref)}/>
|
|
<SpinnerOverlay show={getNetworkAct.loading} />
|
|
<KeyboardAvoidingView
|
|
behavior={Platform.OS === 'android' ? 'height' : 'padding'}
|
|
style={{flex: 1}}>
|
|
|
|
<ScrollView style={{flex: 1}}>
|
|
<Formik validationSchema={RegisterSchema}
|
|
initialValues={{
|
|
password: '',
|
|
code_acte: ''
|
|
}}
|
|
onSubmit={(values) => {
|
|
if (user !== null) {
|
|
if (insurance === null) {
|
|
insurancesRef.shake(800);
|
|
} else if (values.code_acte === '')
|
|
codeActeRef.shake(200)
|
|
else {
|
|
fetchDemaneAutorisationSoin({
|
|
act_id: values.code_acte,
|
|
insurance_id: insurance.id,
|
|
beneficiary_id: beneficiaryId,
|
|
password: values.password
|
|
});
|
|
console.log(user);
|
|
console.log("insurance", insurance);
|
|
}
|
|
}
|
|
}}>
|
|
|
|
{({
|
|
values,
|
|
errors,
|
|
touched,
|
|
handleChange,
|
|
handleBlur,
|
|
setFieldValue,
|
|
setFieldTouched,
|
|
handleSubmit,
|
|
isSubmitting,
|
|
}) => (<>
|
|
{
|
|
insuranceList.loading
|
|
? renderLoader()
|
|
: insuranceList.result ?
|
|
<View style={styles.contain}>
|
|
<Animatable.View ref={(comp) => {
|
|
insurancesRef = comp
|
|
}}
|
|
style={{
|
|
width: responsiveWidth(90),
|
|
height: 60,
|
|
alignSelf: 'center',
|
|
borderRadius: 10,
|
|
paddingLeft: 20,
|
|
paddingRight: 20,
|
|
backgroundColor: 'white'
|
|
}}>
|
|
<Dropdown
|
|
label={I18n.t('SELECT_INSURANCE')}
|
|
data={insuranceList.result.response}
|
|
useNativeDriver={true}
|
|
onChangeText={(value, index, data) => {
|
|
console.log("Value", value);
|
|
setInsurance(value);
|
|
setBeneficiaries([...value.beneficiaries, {id: user.id, firstname: user.firstname, lastname: user.lastname}]);
|
|
fetchGetNetworkActs(value.network.id, '', '&authorization_type=PRIOR')
|
|
}}
|
|
valueExtractor={(value) => {
|
|
return value
|
|
}}
|
|
labelExtractor={(value) => {
|
|
return value.network.name
|
|
}}
|
|
/>
|
|
</Animatable.View>
|
|
|
|
<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 : []}
|
|
useNativeDriver={true}
|
|
onChangeText={(value, index, data) => {
|
|
setFieldTouched('code_acte');
|
|
setFieldValue('code_acte', value.id);
|
|
setModalListAssure(true);
|
|
}}
|
|
valueExtractor={(value) => {
|
|
return value
|
|
}}
|
|
labelExtractor={(value) => {
|
|
return value.name
|
|
}}
|
|
/>
|
|
</Animatable.View>
|
|
|
|
<PasswordInput
|
|
style={{marginTop: 10}}
|
|
onChangeText={handleChange('password')}
|
|
placeholder={I18n.t('PASSWORD')}
|
|
secureTextEntry
|
|
icon={<FontAwesome name="lock" size={20}/>}
|
|
value={values.password}
|
|
onBlur={handleBlur('password')}
|
|
success={touched.password && !errors.password}
|
|
touched={touched.password}
|
|
error={errors.password}
|
|
/>
|
|
|
|
<Button
|
|
style={{marginTop: 20}}
|
|
full
|
|
loading={demandeAutorisationSoin.loading}
|
|
onPress={handleSubmit}>
|
|
{I18n.t('SUBMIT_LABEL')}
|
|
</Button>
|
|
</View>
|
|
: null}
|
|
</>)}
|
|
</Formik>
|
|
{modalListAssure && renderListAssure()}
|
|
</ScrollView>
|
|
</KeyboardAvoidingView>
|
|
|
|
{/* {getConsultation.loading
|
|
? renderLoader()
|
|
: getConsultation.result !== null ?
|
|
(
|
|
<FlatList
|
|
style={{flex: 1}}
|
|
ListEmptyComponent={() => {
|
|
return (
|
|
<Text>{I18n.t('NO_CONSULTATION_DEMAND')}</Text>
|
|
)
|
|
}}
|
|
data={[]}
|
|
keyExtractor={(item, index) => item.id}
|
|
renderItem={({item, index}) => (
|
|
renderItem(item)
|
|
)}
|
|
/>
|
|
)
|
|
: null}*/}
|
|
</ScreenComponent>
|
|
)
|
|
};
|
|
|
|
const mapStateToProps = createStructuredSelector({
|
|
subscriptionList: selectSubscriptionList,
|
|
insuranceList: selectInsuranceList,
|
|
activatePaySubscription: selectActivatePaySubscription,
|
|
getConsultation: selectGetConsultation,
|
|
getNetworkAct: selectGetNetworkAct,
|
|
demandeAutorisationSoin: selectDemandeAutorisationSoin
|
|
});
|
|
|
|
export default connect(mapStateToProps, {
|
|
fetchActivePaySubscription,
|
|
fetchGetNetworkActs,
|
|
fetchAcceptRejectConsultation,
|
|
fetchGetListInsuranceWithBeneficiaries,
|
|
fetchDemaneAutorisationSoin
|
|
})(
|
|
DemandeAutorisationSoinScreen,
|
|
);
|
|
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: {
|
|
marginTop: 20,
|
|
paddingBottom: 20,
|
|
paddingLeft: 10,
|
|
paddingRight: 10,
|
|
flex: 1,
|
|
},
|
|
content: {
|
|
padding: 10,
|
|
marginBottom: 10,
|
|
borderRadius: 8
|
|
},
|
|
contentTop: {
|
|
flexDirection: "row",
|
|
paddingBottom: 10,
|
|
borderBottomWidth: 1
|
|
},
|
|
|
|
contentBottom: {
|
|
flexDirection: "row",
|
|
marginTop: 10,
|
|
justifyContent: "space-between"
|
|
},
|
|
bottomLeft: {flexDirection: "row", alignItems: "center"},
|
|
image: {width: 32, height: 32, marginRight: 10, borderRadius: 16},
|
|
blockView: {
|
|
paddingVertical: 10,
|
|
borderBottomWidth: 0.5,
|
|
},
|
|
ineSeparator: {
|
|
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',
|
|
},
|
|
});
|