All spec validate

This commit is contained in:
Brice Zele 2020-07-08 20:01:56 +01:00
parent fc331462d9
commit dad78e3e0e
17 changed files with 1883 additions and 349 deletions

6
App.js
View File

@ -66,6 +66,8 @@ import RetraitEnCashAgent from './screens/wallet/agent/RetraitEnCashAgent';
import RetraitCarteVersCashAgent from './screens/wallet/agent/RetraitCarteVersCashAgent';
import EnvoieCashVersWalletAgent from './screens/wallet/agent/EnvoieCashVersWalletAgent';
import EnvoieCashVersAutreWalletAgent from './screens/wallet/agent/EnvoieCashVersAutreWalletAgent';
import EnvoieCashVersCarteAgent from './screens/wallet/agent/EnvoieCashVersCarteAgent';
import EnvoiCashVersCashAgent from './screens/wallet/agent/EnvoiCashVersCashAgent';
const instructions = Platform.select({
ios: 'Press Cmd+R to reload,\n' + 'Cmd+D or shake for dev menu',
@ -175,7 +177,9 @@ const AppAgentStack = createDrawerNavigator({
retraitEnCashAgent: RetraitEnCashAgent,
retraitCarteVersCashAgent: RetraitCarteVersCashAgent,
envoieCashVersWalletAgent: EnvoieCashVersWalletAgent,
envoieCashVersAutreWalletAgent: EnvoieCashVersAutreWalletAgent
envoieCashVersAutreWalletAgent: EnvoieCashVersAutreWalletAgent,
envoieCashVersCarteAgent: EnvoieCashVersCarteAgent,
envoiCashVersCashAgent: EnvoiCashVersCashAgent,
})
}, {

View File

@ -49,5 +49,7 @@
"retraitEnCashAgent": "retraitEnCashAgent",
"retraitCarteVersCashAgent": "retraitCarteVersCashAgent",
"envoieCashVersWalletAgent": "envoieCashVersWalletAgent",
"envoieCashVersAutreWalletAgent": "envoieCashVersAutreWalletAgent"
"envoieCashVersAutreWalletAgent": "envoieCashVersAutreWalletAgent",
"envoieCashVersCarteAgent": "envoieCashVersCarteAgent",
"envoiCashVersCashAgent": "envoiCashVersCashAgent"
}

View File

@ -256,7 +256,7 @@ export default class OptionsMenu extends Component {
|| item === 'createIdentificationUser' || item === 'operateurOptionSelect' || item === 'paiementFacture' || item === 'envoieWalletToWalletUser'
|| item === 'envoieWalletToCashUser' || item === 'linkCard' || item === 'envoieWalletToCardUser' || item === 'envoieWalletToBankUser' || item === 'retraitWalletVersCashUser'
|| item === 'retraitCarteVersWalletUser' || item === 'retraitEnCashAgent' || item === 'retraitCarteVersCashAgent' || item === 'envoieCashVersWalletAgent'
|| item === 'envoieCashVersAutreWalletAgent') {
|| item === 'envoieCashVersAutreWalletAgent' || item === 'retraitCarteVersCashUser' || item === 'envoiCashVersCashAgent' || item === 'envoieCashVersCashAgent') {
return null
} else {
const color = this.state.currentId === item.id ? theme.accent : "grey"

View File

@ -540,7 +540,7 @@ class WalletDetail extends Component {
<TouchableOpacity style={styles.contain}
onPress={() => {
if (isIlinkWorldWallet(wallet.network)) {
if (isIlinkWorldWallet(wallet.type)) {
this.props.navigation.push(route.walletOptionSelect, {
optionSelect: optionDepotScreen,
wallet,
@ -554,6 +554,7 @@ class WalletDetail extends Component {
this.props.navigation.push(route.walletDepot, {
wallet,
onGoBack: () => this.refresh(),
})
}
}}
@ -585,7 +586,7 @@ class WalletDetail extends Component {
<View style={styles.containerTouch}>
<TouchableOpacity style={styles.contain}
onPress={() => {
if (isIlinkWorldWallet(wallet.network)) {
if (isIlinkWorldWallet(wallet.type)) {
this.props.navigation.push(route.walletOptionSelect, {
optionSelect: optionRetraitScreen,
wallet,
@ -628,7 +629,7 @@ class WalletDetail extends Component {
</View>
</View>
{isIlinkWorldWallet(wallet.network) &&
{isIlinkWorldWallet(wallet.type) &&
<>
<View style={styles.transactionContainer}>

View File

@ -66,6 +66,7 @@ export default class WalletOptionSelect extends Component {
break;
case 'DEPOT':
this.props.navigation.push(options.screen, {
optionSelect: options.subScreenOption,
wallet: this.state.wallet,
onGoBack: () => this.props.navigation.state.params.onGoBack(),
});
@ -83,6 +84,13 @@ export default class WalletOptionSelect extends Component {
onGoBack: () => this.props.navigation.state.params.onGoBack(),
});
break;
case 'WALLET_TO_BANK':
this.props.navigation.push(options.screen, {
wallet: this.state.wallet,
optionSelect: options.subScreenOption,
onGoBack: () => this.props.navigation.state.params.onGoBack(),
});
break;
default:
this.props.navigation.push(options.screen)
@ -277,7 +285,7 @@ const styles = StyleSheet.create({
height: Utils.scaleWithPixel(30)
},
content: {
height: Utils.scaleWithPixel(60),
height: Utils.scaleWithPixel(65),
paddingHorizontal: 10,
justifyContent: 'space-between',
alignItems: 'flex-start',

View File

@ -0,0 +1,844 @@
import Button from 'apsl-react-native-button';
import isEqual from 'lodash/isEqual';
import isNil from 'lodash/isNil';
import React, { Component } from 'react';
import { Alert, ScrollView, StyleSheet, Text, View } from 'react-native';
import * as Animatable from 'react-native-animatable';
import I18n from 'react-native-i18n';
import Dialog from "react-native-dialog";
import { Dropdown } from 'react-native-material-dropdown';
import { responsiveHeight, responsiveWidth } from 'react-native-responsive-dimensions';
import { ProgressDialog } from 'react-native-simple-dialogs';
import { Fumi } from 'react-native-textinput-effects';
import FontAwesomeIcon from 'react-native-vector-icons/FontAwesome';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import { Color } from '../../../config/Color';
import { store } from "../../../redux/store";
import { identityPieces, isIlinkWorldWallet, isNormalInteger, typeIdIDestinataire, thousandsSeparators } from '../../../utils/UtilsFunction';
import { readUser } from '../../../webservice/AuthApi';
import { getActiveCountryAction, getActiveCountryByDialCodeAction, getActiveCountryByDialCodeReset, getActiveCountryReset, getPayCountryNetworkAction, getPayCountryNetworkReset } from '../../../webservice/CountryApi';
import { envoieUserWalletToCashAction, envoieUserWalletToCashReset, getCommissionUserWalletToCashAction, getCommissionUserWalletToCashReset } from '../../../webservice/EnvoieUserApi';
import { Typography, FontWeight } from '../../../config/typography';
import thousands from 'thousands';
import { IlinkEmitter } from '../../../utils/events';
let theme = require('../../../utils/theme.json');
let route = require('../../../route.json');
class EnvoiCashVersCashAgent extends Component {
static navigatorStyle = {
navBarBackgroundColor: Color.primaryColor,
statusBarColor: Color.primaryDarkColor,
navBarTextColor: '#FFFFFF',
navBarButtonColor: '#FFFFFF'
};
static navigationOptions = () => {
return {
drawerLabel: () => null,
headerTitle: I18n.t('DEPOSIT_CASH_TO_CASH'),
headerTintColor: 'white',
headerStyle: {
backgroundColor: Color.primaryColor,
marginTop: 0,
color: 'white'
},
headerTitleStyle: {
color: "white"
},
title: I18n.t('DEPOSIT_CASH_TO_CASH')
}
};
constructor(props) {
super(props);
this.state = {
identityPiecesEmetteur: identityPieces(),
identityPiecesNameEmetteur: (identityPieces()[0]).name,
paysDestination: [],
paysDestinationSelect: null,
walletActifs: [],
walletActifSelect: null,
nomsEmetteur: null,
prenomsEmetteur: null,
emailEmetteur: null,
numeroIdentiteEmetteur: null,
nomsDestinataire: null,
prenomsDestinataire: null,
idDestinataire: null,
numeroIdentiteDestinataire: null,
montant: null,
password: null,
loading: false,
user: null,
triggerSubmitClick: false,
triggerNextClick: false,
displayFirstStep: true,
displaySecondStep: false,
modalVisible: false,
hasLoadActiveCountryList: false,
hasLoadActivePayCountryNetworkList: false,
triggerSubmitClick: false,
isDataSubmit: false,
isModalConfirmVisible: false,
wallet: store.getState().walletDetailReducer.result.response
};
this.props.getActiveCountryReset();
this.props.getActiveCountryByDialCodeReset();
this.props.getPayCountryNetworkReset();
this.props.envoieUserWalletToCashReset();
this.props.getCommissionUserWalletToCashReset();
}
componentDidMount() {
readUser().then((user) => {
if (user) {
if (user !== undefined) {
this.setState({ user });
}
}
});
}
componentWillReceiveProps(nextProps) {
if (nextProps.resultEnvoieWalletToCashGetCommission != null) {
if (typeof nextProps.resultEnvoieWalletToCashGetCommission.response !== 'undefined') {
if (!nextProps.loadingEnvoieWalletToCashGetCommission)
this.setState({
isModalConfirmVisible: true
});
}
}
}
renderGetActionCountryList = () => {
const { resultActiveCountryList, errorActiveCountryList } = this.props;
if (resultActiveCountryList !== null) {
if (typeof resultActiveCountryList.response !== 'undefined') {
this.setState({
hasLoadActiveCountryList: false,
paysDestination: resultActiveCountryList.response,
paysDestinationSelect: resultActiveCountryList.response[0].name,
});
if (this.state.hasLoadActivePayCountryNetworkList)
this.props.getPayCountryNetworkAction({ id_wallet_agent: this.state.wallet.id, id_country: resultActiveCountryList.response[0].id });
}
}
if (errorActiveCountryList !== null) {
if (typeof errorActiveCountryList.data !== 'undefined') {
Alert.alert(
I18n.t('ERROR_LABEL'),
errorActiveCountryList.data.error,
[
{
text: I18n.t("OK"), onPress: () => {
this.props.getActiveCountryReset();
}
}
],
{ cancelable: false }
)
} else {
Alert.alert(
I18n.t('ERROR_LABEL'),
JSON.stringify(errorActiveCountryList),
[
{
text: I18n.t("OK"), onPress: () => {
this.props.getActiveCountryReset();
}
}
],
{ cancelable: false }
)
}
}
}
renderGetPayCountryNetworkResponse = () => {
const { resultPayCountryNetwork, errorPayCountryNetwork } = this.props;
if (resultPayCountryNetwork !== null) {
if (typeof resultPayCountryNetwork.response !== 'undefined') {
if (resultPayCountryNetwork.response.length > 0) {
this.setState({
hasLoadActivePayCountryNetworkList: false,
walletActifs: resultPayCountryNetwork.response,
walletActifSelect: resultPayCountryNetwork.response[0].name,
modalVisible: false
});
}
else if (resultPayCountryNetwork.response.length === 0) {
this.setState({
walletActifs: [],
walletActifSelect: '',
modalVisible: false,
hasLoadActivePayCountryNetworkList: false,
});
}
}
}
if (errorPayCountryNetwork !== null) {
if (typeof errorPayCountryNetwork.data !== 'undefined') {
Alert.alert(
I18n.t('ERROR_LABEL'),
errorPayCountryNetwork.data.error,
[
{
text: I18n.t("OK"), onPress: () => {
this.props.getPayCountryNetworkReset();
}
}
],
{ cancelable: false }
)
} else {
Alert.alert(
I18n.t('ERROR_LABEL'),
JSON.stringify(errorPayCountryNetwork),
[
{
text: I18n.t("OK"), onPress: () => {
this.props.getPayCountryNetworkReset();
}
}
],
{ cancelable: false }
)
}
}
}
renderEnvoieWalletToWalletResponse = () => {
const { resultEnvoieWalletToCash, errorEnvoieWalletToCash } = this.props;
if (errorEnvoieWalletToCash !== null) {
if (typeof errorEnvoieWalletToCash.data !== 'undefined') {
Alert.alert(
I18n.t("ERROR_TRANSFER"),
errorEnvoieWalletToCash.data.error,
[
{
text: I18n.t("OK"), onPress: () => {
this.props.envoieUserWalletToCashReset();
}
}
],
{ cancelable: false }
)
}
}
if (resultEnvoieWalletToCash !== null) {
if (resultEnvoieWalletToCash.response !== null) {
Alert.alert(
I18n.t("SUCCESS_TRANSFER"),
resultEnvoieWalletToCash.response,
[
{
text: I18n.t("OK"), onPress: () => {
this.props.envoieUserWalletToCashReset();
IlinkEmitter.emit("refreshWallet");
this.props.navigation.pop();
}
}
],
{ cancelable: false }
)
}
}
}
renderDialogGetCommissionResponse = () => {
const { errorEnvoieWalletToCashGetCommission } = this.props;
if (errorEnvoieWalletToCashGetCommission !== null) {
if (typeof errorEnvoieWalletToCashGetCommission.data !== 'undefined') {
Alert.alert(
I18n.t("ERROR_LABLE"),
errorEnvoieWalletToCashGetCommission.data.error,
[
{
text: I18n.t("OK"), onPress: () => {
this.props.getCommissionUserWalletToCashReset();
}
}
],
{ cancelable: false }
)
}
}
}
ckeckIfFieldIsOK(champ) {
return (isNil(champ) || isEqual(champ.length, 0));
}
isMontantValid = () => {
const { montant } = this.state;
if ((parseInt(isEqual(montant, 0)) || montant < 0))
return {
errorMessage: I18n.t('ENTER_AMOUNT_SUPERIOR_ZEROR'),
isValid: false
};
else if (!isNormalInteger(montant))
return {
errorMessage: I18n.t('ENTER_VALID_AMOUNT'),
isValid: false
};
else if (montant > parseInt(this.state.comptePrincipal))
return {
errorMessage: I18n.t('AMOUNT_SUPERIOR_TO_PRINCIPAL_ACCOUNT'),
isValid: false
};
else
return {
errorMessage: '',
isValid: true
};
}
modalConfirmTransaction = (data) => {
const commission = data.response.frais;
const montant_net_final = data.response.montant_net_final;
const montant_net_init = data.response.montant_net_init;
console.log("DATA SEND TO CONFIRM DIALOG", data);
return (
<Dialog.Container useNativeDriver={true} visible={this.state.isModalConfirmVisible}>
<Dialog.Title>{I18n.t('TRANSACTION_DETAIL')}</Dialog.Title>
<View>
<View style={[styles.blockView, { borderBottomColor: Color.borderColor }]}>
<View style={{ flexDirection: 'row', marginTop: 10 }}>
<View style={{ flex: 1 }}>
<Text style={[styles.body2]}>{I18n.t('AMOUNT')}</Text>
</View>
<View style={{ flex: 1, alignItems: 'flex-end' }}>
<Text style={[Typography.caption1, Color.grayColor]}>{`${thousands(this.state.montant, ' ')} ${this.state.wallet.currency_code}`}</Text>
</View>
</View>
<View style={{ flexDirection: 'row', marginTop: 10 }}>
<View style={{ flex: 1 }}>
<Text tyle={[Typography.body2]}>{I18n.t('FEES_AND_TAXES')}</Text>
</View>
<View style={{ flex: 1, alignItems: 'flex-end' }}>
<Text style={[Typography.caption1, Color.grayColor]}>{`${thousands(commission, ' ')} ${this.state.wallet.currency_code}`}</Text>
</View>
</View>
</View>
<View style={{ paddingVertical: 10 }}>
<View style={{ paddingVertical: 10 }}>
<View style={{ flexDirection: 'row', marginTop: 10 }}>
<View style={{ flex: 1 }}>
<Text tyle={[Typography.body2, FontWeight.bold]}>{I18n.t('NET_AMOUNT')}:</Text>
</View>
<View style={{ flex: 1, alignItems: 'flex-end' }}>
<Text style={[Typography.caption1, Color.grayColor]}>{`${thousands(montant_net_final, ' ')} ${this.state.wallet.currency_code}`}</Text>
</View>
</View>
</View>
</View>
</View>
<Dialog.Button bold={true} label={I18n.t('CANCEL_LABEL')} onPress={() => {
this.setState({
isModalConfirmVisible: false
});
}} />
<Dialog.Button bold={true} label={I18n.t('SUBMIT_LABEL')} onPress={() => {
this.setState({
isModalConfirmVisible: false,
isDataSubmit: true
});
this.props.envoieUserWalletToCashAction({
type: 17,
id_wallet_agent: this.state.wallet.id,
nom_emetteur: this.state.nomsEmetteur,
prenom_emetteur: this.state.prenomsDestinataire,
email_emetteur: this.state.emailEmetteur,
type_document_emetteur: this.state.identityPiecesNameEmetteur,
id_document_emetteur: this.state.numeroIdentiteEmetteur,
final_country: (this.state.paysDestination.filter(element => element.name === this.state.paysDestinationSelect))[0].id,
id_destinataire: this.state.numeroIdentiteEmetteur,
type_document_destinataire: this.state.identityPiecesNameEmetteur,
nom_destinataire: this.state.nomsDestinataire,
prenom_destinataire: this.state.prenomsDestinataire,
id_document_destinataire: this.state.numeroIdentiteDestinataire,
network_destinataire: (this.state.walletActifs.filter(element => element.name === this.state.walletActifSelect))[0].id,
montant: this.state.montant,
password: this.state.password
});
this.props.getCommissionUserWalletToCashReset();
}} />
</Dialog.Container>
);
}
onSubmitNextStep = () => {
const { nomsEmetteur, prenomsEmetteur, emailEmetteur, numeroIdentiteEmetteur } = this.state;
if (this.ckeckIfFieldIsOK(nomsEmetteur))
this.nomsEmetteurAnim.shake(800);
else if (this.ckeckIfFieldIsOK(prenomsEmetteur))
this.prenomsEmetteurAnim.shake(800);
else if (this.ckeckIfFieldIsOK(emailEmetteur))
this.emailEmetteurAnim.shake(800);
else if (this.ckeckIfFieldIsOK(numeroIdentiteEmetteur))
this.numeroIdentiteEmetteurAnim.shake(800);
else {
this.setState({
triggerNextClick: true,
modalVisible: true,
hasLoadActiveCountryList: true,
hasLoadActivePayCountryNetworkList: true,
displayFirstStep: !this.state.displayFirstStep,
displaySecondStep: !this.state.displaySecondSte
}, () => {
this.props.getActiveCountryAction();
console.log("ENVOIE WALLET PROPS", this.props);
});
}
}
onSubmitCashVersAutreWallet = () => {
const { nomsDestinataire, prenomsDestinataire, montant, password, numeroIdentiteDestinataire } = this.state;
if (this.ckeckIfFieldIsOK(nomsDestinataire))
this.nomDestinataireAnim.shake(800);
else if (this.ckeckIfFieldIsOK(prenomsDestinataire))
this.prenomsDestinataireAnim.shake(800);
else if (this.ckeckIfFieldIsOK(numeroIdentiteDestinataire))
this.identityPiecesDestinataireAnim.shake(800);
else if (this.ckeckIfFieldIsOK(montant) || !this.isMontantValid().isValid) {
console.log("IS MONTANT VALID", this.isMontantValid())
this.montantAnim.shake(800);
}
else if (this.ckeckIfFieldIsOK(password))
this.passwordAnim.shake(800);
else {
this.props.getCommissionUserWalletToCashAction({
type: 17,
id_wallet_agent: this.state.wallet.id,
final_country: (this.state.paysDestination.filter(element => element.name === this.state.paysDestinationSelect))[0].id,
montant: this.state.montant,
});
}
this.setState({
triggerSubmitClick: true
})
}
renderLoader = () => {
return (
<ProgressDialog
visible={this.state.modalVisible || this.props.loadingEnvoieWalletToCashGetCommission || this.props.loadingEnvoieWalletToCash || this.props.loadingCountryByDialCode || this.props.loadingActiveCountryList || this.props.loadingCountryByDialCode}
title={I18n.t('LOADING')}
message={I18n.t('LOADING_INFO')}
/>
)
}
render() {
console.log("STATE", this.state);
const { resultEnvoieWalletToCashGetCommission } = this.props;
return (
<>
{(this.state.modalVisible || this.props.loadingEnvoieWalletToCashGetCommission || this.props.loadingEnvoieWalletToCash || this.props.loadingCountryByDialCode || this.props.loadingActiveCountryList || this.props.loadingCountryByDialCode) && this.renderLoader()}
{this.state.hasLoadActiveCountryList && this.renderGetActionCountryList()}
{this.state.hasLoadActivePayCountryNetworkList && this.renderGetPayCountryNetworkResponse()}
{this.state.isDataSubmit && this.renderEnvoieWalletToWalletResponse()}
{this.state.triggerSubmitClick && this.renderDialogGetCommissionResponse()}
{
(resultEnvoieWalletToCashGetCommission !== null) &&
(typeof resultEnvoieWalletToCashGetCommission.response !== 'undefined') &&
this.modalConfirmTransaction(resultEnvoieWalletToCashGetCommission)
}
<ScrollView style={styles.container}>
{this.state.displayFirstStep &&
<>
<Text style={styles.subbigtitle}>{I18n.t('ENVOIE_CASH_TO_CASH')}</Text>
<Animatable.View ref={(comp) => { this.nomsEmetteurAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'user'}
label={`${I18n.t('NAME_EMETTEUR')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.nomsEmetteur}
onChangeText={(nomsEmetteur) => {
this.setState({ nomsEmetteur })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.prenomsEmetteurAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'user-circle-o'}
label={`${I18n.t('FIRSTNAME_EMETTEUR')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.prenomsEmetteur}
onChangeText={(prenomsEmetteur) => {
this.setState({ prenomsEmetteur })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.emailEmetteurAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName='envelope'
label={I18n.t('EMAIL_EMETTEUR')}
iconColor={'#f95a25'}
keyboardType='email-address'
iconSize={20}
value={this.state.emailEmetteur}
onChangeText={(emailEmetteur) => {
this.setState({ emailEmetteur })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.identityPiecesEmetteurAnim = comp }}
style={{
width: responsiveWidth(90),
height: 60,
marginTop: 20,
alignSelf: 'center',
borderRadius: 10,
paddingLeft: 20,
paddingRight: 20,
backgroundColor: 'white'
}}>
<Dropdown
label={I18n.t('PIECE_IDENTITE')}
data={this.state.identityPiecesEmetteur}
useNativeDriver={true}
value={this.state.identityPiecesNameEmetteur}
onChangeText={(value, index, data) => {
this.setState({ identityPiecesNameEmetteur: value });
}}
valueExtractor={(value) => { return value.name }}
labelExtractor={(value) => { return value.name }}
/>
</Animatable.View>
<Animatable.View ref={(comp) => { this.numeroIdentiteEmetteurAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'address-card'}
label={`${I18n.t('NUMERO_IDENTITE_EMETTEUR')}`}
iconColor={'#f95a25'}
iconSize={20}
onChangeText={(numeroIdentiteEmetteur) => {
this.setState({ numeroIdentiteEmetteur })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Button style={styles.btnvalide}
textStyle={styles.textbtnvalide}
isLoading={this.state.isLoging}
onPress={() => { this.onSubmitNextStep() }}>
{I18n.t('NEXT')}</Button>
</>
}
{this.state.displaySecondStep &&
<>
<Animatable.View ref={(comp) => { this.nomDestinataireAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'user'}
label={`${I18n.t('NAME_DESTINATAIRE')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.nomsDestinataire}
onChangeText={(nomsDestinataire) => {
this.setState({ nomsDestinataire })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.prenomsDestinataireAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'user-circle-o'}
label={`${I18n.t('FIRSTNAME_DESTINATAIRE')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.prenomsDestinataire}
onChangeText={(prenomsDestinataire) => {
this.setState({ prenomsDestinataire })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.identityPiecesDestinataireAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'user-circle-o'}
label={`${I18n.t('ID_DESTINATAIRE')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.numeroIdentiteDestinataire}
onChangeText={(numeroIdentiteDestinataire) => {
this.setState({ numeroIdentiteDestinataire })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.paysDestinationAnim = comp }}
style={{
width: responsiveWidth(90),
height: 60,
marginTop: 20,
alignSelf: 'center',
borderRadius: 10,
paddingLeft: 20,
paddingRight: 20,
backgroundColor: 'white'
}}>
<Dropdown
label={I18n.t('PAYS_DESTINATION')}
data={this.state.paysDestination}
useNativeDriver={true}
value={this.state.paysDestinationSelect === null ? '' : this.state.paysDestinationSelect}
onChangeText={(value, index, data) => {
this.props.getPayCountryNetworkReset();
let countrySelect = data.filter(element => element.name === value);
this.setState({ paysDestinationSelect: value, hasLoadActivePayCountryNetworkList: true }, () => {
this.props.getPayCountryNetworkAction({ id_wallet_agent: this.state.wallet.id, id_country: countrySelect[0].id });
});
this.props.getCommissionUserWalletToCashReset();
}}
valueExtractor={(value) => { return value.name }}
labelExtractor={(value) => { return value.name }}
/>
</Animatable.View>
<Animatable.View ref={(comp) => { this.walletActifAnim = comp }}
style={{
width: responsiveWidth(90),
height: 60,
marginTop: 20,
alignSelf: 'center',
borderRadius: 10,
paddingLeft: 20,
paddingRight: 20,
backgroundColor: 'white'
}}>
<Dropdown
label={I18n.t('ACTIVE_WALLET')}
data={this.state.walletActifs}
useNativeDriver={true}
value={isNil(this.state.walletActifSelect) ? '' : this.state.walletActifSelect}
onChangeText={(value, index, data) => {
this.setState({
walletActifSelect: value,
});
}}
valueExtractor={(value) => { return value.name }}
labelExtractor={(value) => { return value.name }}
/>
</Animatable.View>
<Animatable.View ref={(comp) => { this.montantAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'money'}
label={I18n.t('AMOUNT')}
iconColor={'#f95a25'}
keyboardType='numeric'
iconSize={20}
value={this.state.montant}
onChangeText={(montant) => {
this.setState({ montant })
}}
style={styles.input}
>
</Fumi>
<View style={{
position: 'absolute',
left: responsiveWidth(82),
top: 35,
flexDirection: 'row'
}}>
<View
style={{
width: 1,
borderLeftColor: '#f0f0f0',
height: 40,
left: -8,
top: -10,
borderLeftWidth: 1,
}}
/>
<Text style={[Typography.body1, FontWeight.bold]}>{this.state.wallet.currency_code}</Text>
</View>
</Animatable.View>
<Animatable.View ref={(comp) => { this.passwordAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'lock'}
label={I18n.t('PASSWORD')}
iconColor={'#f95a25'}
iconSize={20}
secureTextEntry={true}
value={this.state.password}
onChangeText={(password) => {
this.setState({ password })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Button style={styles.btnvalide}
textStyle={styles.textbtnvalide}
isLoading={this.state.isLoging}
onPress={() => { this.onSubmitCashVersAutreWallet() }}>
{I18n.t('SUBMIT_LABEL')}</Button>
</>
}
</ScrollView>
</>
)
}
}
const maptStateToProps = state => ({
loadingCountryByDialCode: state.countryByDialCode.loading,
resultCountryByDialCode: state.countryByDialCode.result,
errorCountryByDialCode: state.countryByDialCode.error,
loadingActiveCountryList: state.activeCountryListReducer.loading,
resultActiveCountryList: state.activeCountryListReducer.result,
errorActiveCountryList: state.activeCountryListReducer.error,
loadingPayCountryNetwork: state.payCountryNetworkReducer.loading,
resultPayCountryNetwork: state.payCountryNetworkReducer.result,
errorPayCountryNetwork: state.payCountryNetworkReducer.error,
loadingEnvoieWalletToCash: state.envoieUserWalletToCashReducer.loading,
resultEnvoieWalletToCash: state.envoieUserWalletToCashReducer.result,
errorEnvoieWalletToCash: state.envoieUserWalletToCashReducer.error,
loadingEnvoieWalletToCashGetCommission: state.envoieUserWalletToCashGetCommissionReducer.loading,
resultEnvoieWalletToCashGetCommission: state.envoieUserWalletToCashGetCommissionReducer.result,
errorEnvoieWalletToCashGetCommission: state.envoieUserWalletToCashGetCommissionReducer.error,
});
const mapDispatchToProps = dispatch => bindActionCreators({
getActiveCountryByDialCodeAction,
getActiveCountryByDialCodeReset,
getPayCountryNetworkAction,
getPayCountryNetworkReset,
getActiveCountryAction,
getActiveCountryReset,
envoieUserWalletToCashAction,
envoieUserWalletToCashReset,
getCommissionUserWalletToCashAction,
getCommissionUserWalletToCashReset
}, dispatch);
export default connect(maptStateToProps, mapDispatchToProps)(EnvoiCashVersCashAgent);
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: Color.primaryDarkColor,
},
textbtnvalide: {
color: 'white',
fontWeight: 'bold'
},
bigtitle: {
color: 'white',
fontSize: 20,
flex: 1,
fontWeight: 'bold',
textAlign: 'center',
margin: 20,
},
blockView: {
paddingVertical: 10,
borderBottomWidth: 1
},
subbigtitle: {
color: 'white',
fontSize: 17,
textAlign: 'center',
margin: 5,
},
btnvalide: {
marginTop: 20,
marginLeft: 20,
marginRight: 20,
borderColor: 'transparent',
backgroundColor: Color.accentLightColor,
height: 52
},
btnSubmit: {
marginTop: 20,
borderColor: 'transparent',
backgroundColor: Color.accentLightColor,
height: 52,
width: "30%",
marginLeft: 20,
marginRight: 20,
},
input: {
height: 60,
marginTop: responsiveHeight(2),
marginLeft: responsiveWidth(5),
marginRight: responsiveWidth(5),
borderRadius: 5,
}
});

View File

@ -17,7 +17,8 @@ import { Color } from '../../../config/Color';
import { store } from "../../../redux/store";
import { identityPieces, isIlinkWorldWallet, isNormalInteger, typeIdIDestinataire, thousandsSeparators } from '../../../utils/UtilsFunction';
import { readUser } from '../../../webservice/AuthApi';
import { getActiveCountryAction, getActiveCountryByDialCodeAction, getActiveCountryByDialCodeReset, getActiveCountryReset, getPayCountryNetworkAction, getPayCountryNetworkReset } from '../../../webservice/CountryApi';
import { getActiveCountryAction, getActiveCountryByDialCodeAction, getActiveCountryByDialCodeReset, getActiveCountryReset, getOtherPayCountryNetworkAction, getPayCountryNetworkReset } from '../../../webservice/CountryApi';
import { envoieUserWalletToCashAction, envoieUserWalletToCashReset, getCommissionUserWalletToCashAction, getCommissionUserWalletToCashReset } from '../../../webservice/EnvoieUserApi';
import { Typography, FontWeight } from '../../../config/typography';
import thousands from 'thousands';
import { IlinkEmitter } from '../../../utils/events';
@ -54,23 +55,31 @@ class EnvoieCashVersAutreWalletAgent extends Component {
constructor(props) {
super(props);
this.state = {
identityPieces: identityPieces(),
identityPiecesName: (identityPieces()[0]).name,
identityPiecesEmetteur: identityPieces(),
identityPiecesNameEmetteur: (identityPieces()[0]).name,
paysDestination: [],
paysDestinationSelect: null,
walletActifs: [],
walletActifSelect: null,
noms: null,
prenoms: null,
numeroTelephone: null,
numeroIdentite: null,
nomsEmetteur: null,
prenomsEmetteur: null,
emailEmetteur: null,
numeroIdentiteEmetteur: null,
nomsDestinataire: null,
prenomsDestinataire: null,
idDestinataire: null,
numeroIdentiteDestinataire: null,
montant: null,
password: null,
loading: false,
user: null,
modalVisible: true,
hasLoadActiveCountryList: true,
hasLoadActivePayCountryNetworkList: true,
triggerSubmitClick: false,
triggerNextClick: false,
displayFirstStep: true,
displaySecondStep: false,
modalVisible: false,
hasLoadActiveCountryList: false,
hasLoadActivePayCountryNetworkList: false,
triggerSubmitClick: false,
isDataSubmit: false,
isModalConfirmVisible: false,
@ -83,8 +92,6 @@ class EnvoieCashVersAutreWalletAgent extends Component {
this.props.envoieUserWalletToCashReset();
this.props.getCommissionUserWalletToCashReset();
this.props.getActiveCountryAction();
console.log("ENVOIE WALLET PROPS", this.props);
}
componentDidMount() {
@ -125,7 +132,7 @@ class EnvoieCashVersAutreWalletAgent extends Component {
paysDestinationSelect: resultActiveCountryList.response[0].name,
});
if (this.state.hasLoadActivePayCountryNetworkList)
this.props.getPayCountryNetworkAction({ id_wallet_user: this.state.wallet.id, id_country: resultActiveCountryList.response[0].id });
this.props.getOtherPayCountryNetworkAction({ id_wallet_agent: this.state.wallet.id, id_country: resultActiveCountryList.response[0].id });
}
}
@ -319,7 +326,6 @@ class EnvoieCashVersAutreWalletAgent extends Component {
const commission = data.response.frais;
const montant_net_final = data.response.montant_net_final;
const montant_net_init = data.response.montant_net_init;
const destinataire = data.response.destinataire;
console.log("DATA SEND TO CONFIRM DIALOG", data);
return (
@ -331,14 +337,6 @@ class EnvoieCashVersAutreWalletAgent extends Component {
<View>
<View style={[styles.blockView, { borderBottomColor: Color.borderColor }]}>
<View style={{ flexDirection: 'row', marginTop: 10 }}>
<View style={{ flex: 1 }}>
<Text style={[styles.body2]}>{I18n.t('DESTINATAIRE')}</Text>
</View>
<View style={{ flex: 1, alignItems: 'flex-end' }}>
<Text style={[Typography.caption1, Color.grayColor]}>{destinataire}</Text>
</View>
</View>
<View style={{ flexDirection: 'row', marginTop: 10 }}>
<View style={{ flex: 1 }}>
<Text style={[styles.body2]}>{I18n.t('AMOUNT')}</Text>
@ -357,28 +355,14 @@ class EnvoieCashVersAutreWalletAgent extends Component {
</View>
</View>
<View style={{ paddingVertical: 10 }}>
<View style={{ flexDirection: 'row', marginTop: 10 }}>
<View style={{ flex: 1 }}>
<Text tyle={[Typography.body2, FontWeight.bold]}>{I18n.t('NET_AMOUNT')}:</Text>
</View>
<View style={{ flex: 1, alignItems: 'flex-end' }}>
<Text style={[Typography.caption1, Color.grayColor]}></Text>
</View>
</View>
<View style={{ flexDirection: 'row', marginTop: 10 }}>
<View style={{ flex: 1 }}>
<Text tyle={[Typography.body2]}>{I18n.t('INIT_COUNTRY')}</Text>
</View>
<View style={{ flex: 1, alignItems: 'flex-end' }}>
<Text style={[Typography.caption1, Color.grayColor]}>{`${thousands(montant_net_init, ' ')} ${this.state.wallet.currency_code}`}</Text>
</View>
</View>
<View style={{ flexDirection: 'row', marginTop: 10 }}>
<View style={{ flex: 1 }}>
<Text tyle={[Typography.body2]}>{I18n.t('FINAL_COUNTRY')}</Text>
</View>
<View style={{ flex: 1, alignItems: 'flex-end' }}>
<Text style={[Typography.caption1, Color.grayColor]}>{montant_net_final}</Text>
<View style={{ paddingVertical: 10 }}>
<View style={{ flexDirection: 'row', marginTop: 10 }}>
<View style={{ flex: 1 }}>
<Text tyle={[Typography.body2, FontWeight.bold]}>{I18n.t('NET_AMOUNT')}:</Text>
</View>
<View style={{ flex: 1, alignItems: 'flex-end' }}>
<Text style={[Typography.caption1, Color.grayColor]}>{`${thousands(montant_net_final, ' ')} ${this.state.wallet.currency_code}`}</Text>
</View>
</View>
</View>
</View>
@ -395,14 +379,19 @@ class EnvoieCashVersAutreWalletAgent extends Component {
isDataSubmit: true
});
this.props.envoieUserWalletToCashAction({
type: 3,
id_wallet_user: this.state.wallet.id,
type: 15,
id_wallet_agent: this.state.wallet.id,
nom_emetteur: this.state.nomsEmetteur,
prenom_emetteur: this.state.prenomsDestinataire,
email_emetteur: this.state.emailEmetteur,
type_document_emetteur: this.state.identityPiecesNameEmetteur,
id_document_emetteur: this.state.numeroIdentiteEmetteur,
final_country: (this.state.paysDestination.filter(element => element.name === this.state.paysDestinationSelect))[0].id,
id_destinataire: this.state.numeroTelephone,
type_document_destinataire: this.state.identityPiecesName,
nom_destinataire: this.state.noms,
prenom_destinataire: this.state.prenoms,
id_document_destinataire: this.state.numeroIdentite,
id_destinataire: this.state.numeroIdentiteDestinataire,
type_document_destinataire: this.state.identityPiecesNameEmetteur,
nom_destinataire: this.state.nomsDestinataire,
prenom_destinataire: this.state.prenomsDestinataire,
id_document_destinataire: this.state.numeroIdentiteDestinataire,
network_destinataire: (this.state.walletActifs.filter(element => element.name === this.state.walletActifSelect))[0].id,
montant: this.state.montant,
password: this.state.password
@ -416,23 +405,43 @@ class EnvoieCashVersAutreWalletAgent extends Component {
}
onSubmitSendWalletToWallet = () => {
const { identityPiecesName, noms, prenoms, paysDestinationSelect, numeroIdentite, walletActifSelect, typeIdDestinataireSelect, numeroTelephone, montant, password } = this.state;
onSubmitNextStep = () => {
if (this.ckeckIfFieldIsOK(identityPiecesName))
this.identityPiecesAnim.shake(800);
else if (this.ckeckIfFieldIsOK(paysDestinationSelect))
this.paysDestinationAnim.shake(800);
else if (this.ckeckIfFieldIsOK(walletActifSelect))
this.walletActifAnim.shake(800);
else if (this.ckeckIfFieldIsOK(noms))
this.firstnameAnim.shake(800);
else if (this.ckeckIfFieldIsOK(prenoms))
this.lastnameAnim.shake(800);
else if (this.ckeckIfFieldIsOK(numeroIdentite))
this.numeroIdentiteAnim.shake(800);
else if (this.ckeckIfFieldIsOK(numeroTelephone))
this.numeroTelephoneAnim.shake(800);
const { nomsEmetteur, prenomsEmetteur, emailEmetteur, numeroIdentiteEmetteur } = this.state;
if (this.ckeckIfFieldIsOK(nomsEmetteur))
this.nomsEmetteurAnim.shake(800);
else if (this.ckeckIfFieldIsOK(prenomsEmetteur))
this.prenomsEmetteurAnim.shake(800);
else if (this.ckeckIfFieldIsOK(emailEmetteur))
this.emailEmetteurAnim.shake(800);
else if (this.ckeckIfFieldIsOK(numeroIdentiteEmetteur))
this.numeroIdentiteEmetteurAnim.shake(800);
else {
this.setState({
triggerNextClick: true,
modalVisible: true,
hasLoadActiveCountryList: true,
hasLoadActivePayCountryNetworkList: true,
displayFirstStep: !this.state.displayFirstStep,
displaySecondStep: !this.state.displaySecondSte
}, () => {
this.props.getActiveCountryAction();
console.log("ENVOIE WALLET PROPS", this.props);
});
}
}
onSubmitCashVersAutreWallet = () => {
const { nomsDestinataire, prenomsDestinataire, montant, password, numeroIdentiteDestinataire } = this.state;
if (this.ckeckIfFieldIsOK(nomsDestinataire))
this.nomDestinataireAnim.shake(800);
else if (this.ckeckIfFieldIsOK(prenomsDestinataire))
this.prenomsDestinataireAnim.shake(800);
else if (this.ckeckIfFieldIsOK(numeroIdentiteDestinataire))
this.identityPiecesDestinataireAnim.shake(800);
else if (this.ckeckIfFieldIsOK(montant) || !this.isMontantValid().isValid) {
console.log("IS MONTANT VALID", this.isMontantValid())
this.montantAnim.shake(800);
@ -442,8 +451,8 @@ class EnvoieCashVersAutreWalletAgent extends Component {
else {
this.props.getCommissionUserWalletToCashAction({
type: 3,
id_wallet_user: this.state.wallet.id,
type: 15,
id_wallet_agent: this.state.wallet.id,
final_country: (this.state.paysDestination.filter(element => element.name === this.state.paysDestinationSelect))[0].id,
montant: this.state.montant,
});
@ -482,199 +491,257 @@ class EnvoieCashVersAutreWalletAgent extends Component {
}
<ScrollView style={styles.container}>
<Text style={styles.subbigtitle}>{I18n.t('ENVOIE_WALLET_TO_CASH')}</Text>
{this.state.displayFirstStep &&
<>
<Animatable.View ref={(comp) => { this.paysDestinationAnim = comp }}
style={{
width: responsiveWidth(90),
height: 60,
marginTop: 20,
alignSelf: 'center',
borderRadius: 10,
paddingLeft: 20,
paddingRight: 20,
backgroundColor: 'white'
}}>
<Dropdown
label={I18n.t('PAYS_DESTINATION')}
data={this.state.paysDestination}
useNativeDriver={true}
value={this.state.paysDestinationSelect === null ? '' : this.state.paysDestinationSelect}
onChangeText={(value, index, data) => {
this.props.getPayCountryNetworkReset();
<Text style={styles.subbigtitle}>{I18n.t('DEPOSIT_CASH_TO_OTHER_WALLET_DESCRIPTION')}</Text>
let countrySelect = data.filter(element => element.name === value);
this.setState({ paysDestinationSelect: value, hasLoadActivePayCountryNetworkList: true }, () => {
this.props.getPayCountryNetworkAction({ id_wallet_user: this.state.wallet.id, id_country: countrySelect[0].id });
});
this.props.getCommissionUserWalletToCashReset();
}}
valueExtractor={(value) => { return value.name }}
labelExtractor={(value) => { return value.name }}
/>
</Animatable.View>
<Animatable.View ref={(comp) => { this.nomsEmetteurAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'user'}
label={`${I18n.t('NAME_EMETTEUR')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.nomsEmetteur}
onChangeText={(nomsEmetteur) => {
this.setState({ nomsEmetteur })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.walletActifAnim = comp }}
style={{
width: responsiveWidth(90),
height: 60,
marginTop: 20,
alignSelf: 'center',
borderRadius: 10,
paddingLeft: 20,
paddingRight: 20,
backgroundColor: 'white'
}}>
<Dropdown
label={I18n.t('ACTIVE_WALLET')}
data={this.state.walletActifs}
useNativeDriver={true}
value={isNil(this.state.walletActifSelect) ? '' : this.state.walletActifSelect}
onChangeText={(value, index, data) => {
this.setState({
walletActifSelect: value,
});
<Animatable.View ref={(comp) => { this.prenomsEmetteurAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'user-circle-o'}
label={`${I18n.t('FIRSTNAME_EMETTEUR')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.prenomsEmetteur}
onChangeText={(prenomsEmetteur) => {
this.setState({ prenomsEmetteur })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
}}
valueExtractor={(value) => { return value.name }}
labelExtractor={(value) => { return value.name }}
/>
</Animatable.View>
<Animatable.View ref={(comp) => { this.emailEmetteurAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName='envelope'
label={I18n.t('EMAIL_EMETTEUR')}
iconColor={'#f95a25'}
keyboardType='email-address'
iconSize={20}
value={this.state.emailEmetteur}
onChangeText={(emailEmetteur) => {
this.setState({ emailEmetteur })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.firstnameAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'user'}
label={`${I18n.t('NAME')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.noms}
onChangeText={(noms) => {
this.setState({ noms })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.lastnameAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'user-circle-o'}
label={`${I18n.t('FIRSTNAME')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.prenoms}
onChangeText={(prenoms) => {
this.setState({ prenoms })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.numeroTelephoneAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={isEqual(this.state.typeIdDestinataireSelect, I18n.t('PHONE')) ? 'phone' : 'lock'}
label={I18n.t('PHONE')}
iconColor={'#f95a25'}
keyboardType='phone-pad'
iconSize={20}
value={this.state.numeroTelephone}
onChangeText={(numeroTelephone) => {
this.setState({ numeroTelephone })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.identityPiecesAnim = comp }}
style={{
width: responsiveWidth(90),
height: 60,
marginTop: 20,
alignSelf: 'center',
borderRadius: 10,
paddingLeft: 20,
paddingRight: 20,
backgroundColor: 'white'
}}>
<Dropdown
label={I18n.t('PIECE_IDENTITE')}
data={this.state.identityPieces}
useNativeDriver={true}
value={this.state.identityPiecesName}
onChangeText={(value, index, data) => {
this.setState({ identityPiecesName: value });
}}
valueExtractor={(value) => { return value.name }}
labelExtractor={(value) => { return value.name }}
/>
</Animatable.View>
<Animatable.View ref={(comp) => { this.numeroIdentiteAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'address-card'}
label={`${I18n.t('NUMERO_IDENTITE')}`}
iconColor={'#f95a25'}
iconSize={20}
onChangeText={(numeroIdentite) => {
this.setState({ numeroIdentite })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.montantAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'money'}
label={I18n.t('AMOUNT')}
iconColor={'#f95a25'}
keyboardType='numeric'
iconSize={20}
value={this.state.montant}
onChangeText={(montant) => {
this.setState({ montant })
}}
style={styles.input}
>
</Fumi>
<View style={{
position: 'absolute',
left: responsiveWidth(82),
top: 35,
flexDirection: 'row'
}}>
<View
<Animatable.View ref={(comp) => { this.identityPiecesEmetteurAnim = comp }}
style={{
width: 1,
borderLeftColor: '#f0f0f0',
height: 40,
left: -8,
top: -10,
borderLeftWidth: 1,
width: responsiveWidth(90),
height: 60,
marginTop: 20,
alignSelf: 'center',
borderRadius: 10,
paddingLeft: 20,
paddingRight: 20,
backgroundColor: 'white'
}}>
<Dropdown
label={I18n.t('PIECE_IDENTITE')}
data={this.state.identityPiecesEmetteur}
useNativeDriver={true}
value={this.state.identityPiecesNameEmetteur}
onChangeText={(value, index, data) => {
this.setState({ identityPiecesNameEmetteur: value });
}}
valueExtractor={(value) => { return value.name }}
labelExtractor={(value) => { return value.name }}
/>
</Animatable.View>
}}
/>
<Text style={[Typography.body1, FontWeight.bold]}>{this.state.wallet.currency_code}</Text>
</View>
</Animatable.View>
<Animatable.View ref={(comp) => { this.numeroIdentiteEmetteurAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'address-card'}
label={`${I18n.t('NUMERO_IDENTITE_EMETTEUR')}`}
iconColor={'#f95a25'}
iconSize={20}
onChangeText={(numeroIdentiteEmetteur) => {
this.setState({ numeroIdentiteEmetteur })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.passwordAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'lock'}
label={I18n.t('PASSWORD')}
iconColor={'#f95a25'}
iconSize={20}
secureTextEntry={true}
value={this.state.password}
onChangeText={(password) => {
this.setState({ password })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Button style={styles.btnvalide}
textStyle={styles.textbtnvalide}
isLoading={this.state.isLoging}
onPress={() => { this.onSubmitNextStep() }}>
{I18n.t('NEXT')}</Button>
</>
}
{this.state.displaySecondStep &&
<>
<Animatable.View ref={(comp) => { this.nomDestinataireAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'user'}
label={`${I18n.t('NAME_DESTINATAIRE')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.nomsDestinataire}
onChangeText={(nomsDestinataire) => {
this.setState({ nomsDestinataire })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.prenomsDestinataireAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'user-circle-o'}
label={`${I18n.t('FIRSTNAME_DESTINATAIRE')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.prenomsDestinataire}
onChangeText={(prenomsDestinataire) => {
this.setState({ prenomsDestinataire })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.identityPiecesDestinataireAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'user-circle-o'}
label={`${I18n.t('ID_DESTINATAIRE')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.numeroIdentiteDestinataire}
onChangeText={(numeroIdentiteDestinataire) => {
this.setState({ numeroIdentiteDestinataire })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.paysDestinationAnim = comp }}
style={{
width: responsiveWidth(90),
height: 60,
marginTop: 20,
alignSelf: 'center',
borderRadius: 10,
paddingLeft: 20,
paddingRight: 20,
backgroundColor: 'white'
}}>
<Dropdown
label={I18n.t('PAYS_DESTINATION')}
data={this.state.paysDestination}
useNativeDriver={true}
value={this.state.paysDestinationSelect === null ? '' : this.state.paysDestinationSelect}
onChangeText={(value, index, data) => {
this.props.getPayCountryNetworkReset();
let countrySelect = data.filter(element => element.name === value);
this.setState({ paysDestinationSelect: value, hasLoadActivePayCountryNetworkList: true }, () => {
this.props.getOtherPayCountryNetworkAction({ id_wallet_agent: this.state.wallet.id, id_country: countrySelect[0].id });
});
this.props.getCommissionUserWalletToCashReset();
}}
valueExtractor={(value) => { return value.name }}
labelExtractor={(value) => { return value.name }}
/>
</Animatable.View>
<Animatable.View ref={(comp) => { this.walletActifAnim = comp }}
style={{
width: responsiveWidth(90),
height: 60,
marginTop: 20,
alignSelf: 'center',
borderRadius: 10,
paddingLeft: 20,
paddingRight: 20,
backgroundColor: 'white'
}}>
<Dropdown
label={I18n.t('ACTIVE_WALLET')}
data={this.state.walletActifs}
useNativeDriver={true}
value={isNil(this.state.walletActifSelect) ? '' : this.state.walletActifSelect}
onChangeText={(value, index, data) => {
this.setState({
walletActifSelect: value,
});
}}
valueExtractor={(value) => { return value.name }}
labelExtractor={(value) => { return value.name }}
/>
</Animatable.View>
<Animatable.View ref={(comp) => { this.montantAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'money'}
label={I18n.t('AMOUNT')}
iconColor={'#f95a25'}
keyboardType='numeric'
iconSize={20}
value={this.state.montant}
onChangeText={(montant) => {
this.setState({ montant })
}}
style={styles.input}
>
</Fumi>
<View style={{
position: 'absolute',
left: responsiveWidth(82),
top: 35,
flexDirection: 'row'
}}>
<View
style={{
width: 1,
borderLeftColor: '#f0f0f0',
height: 40,
left: -8,
top: -10,
borderLeftWidth: 1,
}}
/>
<Text style={[Typography.body1, FontWeight.bold]}>{this.state.wallet.currency_code}</Text>
</View>
</Animatable.View>
<Animatable.View ref={(comp) => { this.passwordAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'lock'}
label={I18n.t('PASSWORD')}
iconColor={'#f95a25'}
iconSize={20}
secureTextEntry={true}
value={this.state.password}
onChangeText={(password) => {
this.setState({ password })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Button style={styles.btnvalide}
textStyle={styles.textbtnvalide}
isLoading={this.state.isLoging}
onPress={() => { this.onSubmitCashVersAutreWallet() }}>
{I18n.t('SUBMIT_LABEL')}</Button>
</>
}
<Button style={styles.btnvalide}
textStyle={styles.textbtnvalide}
isLoading={this.state.isLoging}
onPress={() => { this.onSubmitSendWalletToWallet() }}>
{I18n.t('SUBMIT_LABEL')}</Button>
</ScrollView>
</>
)
@ -707,7 +774,7 @@ const mapDispatchToProps = dispatch => bindActionCreators({
getActiveCountryByDialCodeAction,
getActiveCountryByDialCodeReset,
getPayCountryNetworkAction,
getOtherPayCountryNetworkAction,
getPayCountryNetworkReset,
getActiveCountryAction,

View File

@ -0,0 +1,540 @@
import Button from 'apsl-react-native-button';
import isEqual from 'lodash/isEqual';
import isNil from 'lodash/isNil';
import React, { Component } from 'react';
import { Alert, ScrollView, StyleSheet, Text, View } from 'react-native';
import * as Animatable from 'react-native-animatable';
import Dialog from "react-native-dialog";
import I18n from 'react-native-i18n';
import { responsiveHeight, responsiveWidth } from 'react-native-responsive-dimensions';
import { ProgressDialog } from 'react-native-simple-dialogs';
import FontAwesomeIcon from 'react-native-vector-icons/FontAwesome';
import { Fumi } from 'react-native-textinput-effects';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import thousands from 'thousands';
import { Color } from '../../../config/Color';
import { FontWeight, Typography } from '../../../config/typography';
import { store } from "../../../redux/store";
import { IlinkEmitter } from '../../../utils/events';
import { LiteCreditCardInput } from "react-native-credit-card-input";
import { readUser } from '../../../webservice/AuthApi';
import { envoieUserWalletToCardAction, envoieUserWalletToCardReset, getCommissionUserWalletToCardAction, getCommissionUserWalletToCardReset } from '../../../webservice/EnvoieUserApi';
import { isNormalInteger } from '../../../utils/UtilsFunction';
let theme = require('../../../utils/theme.json');
let route = require('../../../route.json');
class EnvoieCashVersCarteAgent extends Component {
static navigatorStyle = {
navBarBackgroundColor: Color.primaryColor,
statusBarColor: Color.primaryDarkColor,
navBarTextColor: '#FFFFFF',
navBarButtonColor: '#FFFFFF'
};
static navigationOptions = () => {
return {
drawerLabel: () => null,
headerTitle: I18n.t('DEPOSIT_CASH_TO_VISA'),
headerTintColor: 'white',
headerStyle: {
backgroundColor: Color.primaryColor,
marginTop: 0,
color: 'white'
},
headerTitleStyle: {
color: "white"
},
title: I18n.t('DEPOSIT_CASH_TO_VISA')
}
};
constructor(props) {
super(props);
this.state = {
montant: null,
password: null,
montant: '',
numeroSerie: '',
numCarte: 0,
cvv: 0,
expiration_date: '',
creditCardInput: {},
displayCardError: false,
loading: false,
user: null,
triggerSubmitClick: false,
isSubmitClick: false,
isDataSubmit: false,
isModalConfirmVisible: false,
wallet: store.getState().walletDetailReducer.result.response
};
this.props.envoieUserWalletToCardReset();
this.props.getCommissionUserWalletToCardReset();
}
componentDidMount() {
readUser().then((user) => {
if (user) {
if (user !== undefined) {
this.setState({ user });
}
}
});
}
componentWillReceiveProps(nextProps) {
console.log('PROPS', nextProps)
if (nextProps.resultEnvoieWalletToCardGetCommission != null) {
if (typeof nextProps.resultEnvoieWalletToCardGetCommission.response !== 'undefined') {
if (!nextProps.loadingEnvoieWalletToCardGetCommission)
this.setState({
isModalConfirmVisible: true
});
}
}
}
isCreditCardValid = () => {
const { creditCardInput } = this.state;
const errorMessage = [];
if (typeof creditCardInput.status !== 'undefined') {
if (creditCardInput.status.cvc === 'incomplete')
errorMessage.push(I18n.t('CVC_CARD_ERROR'));
if (creditCardInput.status.expiry === 'incomplete')
errorMessage.push(I18n.t('EXPIRY_CARD_ERROR'));
if (creditCardInput.status.number === 'incomplete')
errorMessage.push(I18n.t('CARD_NUMBER_ERROR'));
}
else
errorMessage.push(I18n.t('THIS_FIELD_IS_REQUIRED'))
return errorMessage;
}
onCreditCardChange = (form) => {
this.setState({
creditCardInput: form,
displayCardError: false
});
}
renderEnvoieWalletToWalletResponse = () => {
const { resultEnvoieWalletToCard, errorEnvoieWalletToCard } = this.props;
if (errorEnvoieWalletToCard !== null) {
if (typeof errorEnvoieWalletToCard.data !== 'undefined') {
Alert.alert(
I18n.t("WITHDRAWAL_ERROR"),
errorEnvoieWalletToCard.data.error,
[
{
text: I18n.t("OK"), onPress: () => {
this.props.envoieUserWalletToCardReset();
}
}
],
{ cancelable: false }
)
}
}
if (resultEnvoieWalletToCard !== null) {
if (resultEnvoieWalletToCard.response !== null) {
Alert.alert(
I18n.t("WITHDRAWAL_SUCCESS"),
resultEnvoieWalletToCard.response,
[
{
text: I18n.t("OK"), onPress: () => {
this.props.envoieUserWalletToCardReset();
IlinkEmitter.emit("refreshWallet");
this.props.navigation.pop();
}
}
],
{ cancelable: false }
)
}
}
}
renderDialogGetCommissionResponse = () => {
const { errorEnvoieWalletToCardGetCommission } = this.props;
if (errorEnvoieWalletToCardGetCommission !== null) {
if (typeof errorEnvoieWalletToCardGetCommission.data !== 'undefined') {
Alert.alert(
I18n.t("ERROR_LABLE"),
errorEnvoieWalletToCardGetCommission.data.error,
[
{
text: I18n.t("OK"), onPress: () => {
this.props.getCommissionUserWalletToCardReset();
}
}
],
{ cancelable: false }
)
}
}
}
updateLangue() {
this.props.navigation.setParams({ name: I18n.t('WITHDRAWAL_WALLET_TO_CASH') })
this.forceUpdate()
}
modalConfirmTransaction = (data) => {
const frais = data.response.frais;
const montant_net = data.response.montant_net;
return (
<Dialog.Container useNativeDriver={true} visible={this.state.isModalConfirmVisible}>
<Dialog.Title>{I18n.t('TRANSACTION_DETAIL')}</Dialog.Title>
<View>
<View style={[styles.blockView, { borderBottomColor: Color.borderColor }]}>
<View style={{ flexDirection: 'row', marginTop: 10 }}>
<View style={{ flex: 1 }}>
<Text style={[styles.body2]}>{I18n.t('AMOUNT')}</Text>
</View>
<View style={{ flex: 1, alignItems: 'flex-end' }}>
<Text style={[Typography.caption1, Color.grayColor]}>{`${thousands(this.state.montant, ' ')} ${this.state.wallet.currency_code}`}</Text>
</View>
</View>
<View style={{ flexDirection: 'row', marginTop: 10 }}>
<View style={{ flex: 1 }}>
<Text tyle={[Typography.body2]}>{I18n.t('FEES_AND_TAXES')}</Text>
</View>
<View style={{ flex: 1, alignItems: 'flex-end' }}>
<Text style={[Typography.caption1, Color.grayColor]}>{`${thousands(frais, ' ')} ${this.state.wallet.currency_code}`}</Text>
</View>
</View>
</View>
<View style={{ paddingVertical: 10 }}>
<View style={{ flexDirection: 'row', marginTop: 10 }}>
<View style={{ flex: 1 }}>
<Text tyle={[Typography.body2, FontWeight.bold]}>{I18n.t('NET_AMOUNT')}:</Text>
</View>
<View style={{ flex: 1, alignItems: 'flex-end' }}>
<Text style={[Typography.caption1, Color.grayColor]}>{`${thousands(montant_net, ' ')} ${this.state.wallet.currency_code}`}</Text>
</View>
</View>
</View>
</View>
<Dialog.Button bold={true} label={I18n.t('CANCEL_LABEL')} onPress={() => {
this.setState({
isModalConfirmVisible: false
});
}} />
<Dialog.Button bold={true} label={I18n.t('SUBMIT_LABEL')} onPress={() => {
this.setState({
isModalConfirmVisible: false,
isDataSubmit: true
});
this.props.envoieUserWalletToCardAction({
type: 16,
numero_carte: this.state.creditCardInput.values.number.replace(/\s/g, ''),
cvv: this.state.creditCardInput.values.cvc,
expiration_date: this.state.creditCardInput.values.expiry,
id_wallet_agent: this.state.wallet.id,
montant: this.state.montant,
password: this.state.password
});
this.props.getCommissionUserWalletToCardReset();
}} />
</Dialog.Container>
);
}
ckeckIfFieldIsOK(champ) {
return (isNil(champ) || isEqual(champ.length, 0));
}
isMontantValid = () => {
const { montant } = this.state;
if ((parseInt(isEqual(montant, 0)) || montant < 0))
return {
errorMessage: I18n.t('ENTER_AMOUNT_SUPERIOR_ZEROR'),
isValid: false
};
else if (!isNormalInteger(montant))
return {
errorMessage: I18n.t('ENTER_VALID_AMOUNT'),
isValid: false
};
else
return {
errorMessage: '',
isValid: true
};
}
onSubmitSendWalletToCard = () => {
const { creditCardInput, montant, password } = this.state;
if (!creditCardInput.valid)
this.codeCVVAnim.shake(800);
else if (this.ckeckIfFieldIsOK(montant) || !this.isMontantValid().isValid) {
this.montantAnim.shake(800);
}
else if (this.ckeckIfFieldIsOK(password))
this.passwordAnim.shake(800);
else {
this.props.getCommissionUserWalletToCardAction({
type: 16,
id_wallet_agent: this.state.wallet.id,
montant: this.state.montant,
});
}
this.setState({
triggerSubmitClick: true,
numCarte: parseInt((creditCardInput.values.number).replace(/ /g, ' ')),
cvv: creditCardInput.values.cvc,
expiration_date: creditCardInput.values.expiry
});
}
renderLoader = () => {
return (
<ProgressDialog
visible={this.props.loadingEnvoieWalletToCard || this.props.loadingEnvoieWalletToCardGetCommission}
title={I18n.t('LOADING')}
message={I18n.t('LOADING_INFO')}
/>
)
}
render() {
const { resultEnvoieWalletToCardGetCommission } = this.props;
return (
<>
{(this.props.loadingEnvoieWalletToCard || this.props.loadingEnvoieWalletToCardGetCommission) && this.renderLoader()}
{this.state.isDataSubmit && this.renderEnvoieWalletToWalletResponse()}
{this.state.triggerSubmitClick && this.renderDialogGetCommissionResponse()}
{
(resultEnvoieWalletToCardGetCommission !== null) &&
(typeof resultEnvoieWalletToCardGetCommission.response !== 'undefined') &&
this.modalConfirmTransaction(resultEnvoieWalletToCardGetCommission)
}
<ScrollView style={styles.container}>
<Text style={styles.subbigtitle}>{I18n.t('DEPOSIT_CASH_TO_VISA_DESCRIPTION')}</Text>
<Animatable.View ref={(comp) => { this.codeCVVAnim = comp }}>
<View style={{
overflow: 'hidden',
paddingTop: 16,
backgroundColor: 'white',
marginTop: responsiveHeight(2),
marginLeft: responsiveWidth(5),
marginRight: responsiveWidth(5),
borderRadius: 5,
}}>
<LiteCreditCardInput
inputStyle={{
flex: 1,
color: 'black',
fontSize: 18,
padding: 7,
paddingLeft: 0,
}}
validColor={this.state.creditCardInput.valid ? 'green' : ''}
invalidColor={!this.state.creditCardInput.valid ? 'red' : ''}
onChange={this.onCreditCardChange}
labels={{
number: I18n.t('CARD_NUMBER_LABEL'),
expiry: I18n.t('CARD_EXPIRY_LABEL'),
cvc: I18n.t('CARD_CVC_LABEL'),
}} />
{
(this.state.displayCardError) &&
this.isCreditCardValid().map((item) => (
<Text style={{ color: 'red', marginLeft: 15 }}>{item}</Text>
))
}
</View>
{/* <Fumi iconClass={FontAwesomeIcon} iconName={'credit-card'}
label={I18n.t('CARD_CVC_LABEL')}
iconColor={'#f95a25'}
keyboardType='numeric'
iconSize={20}
value={this.state.codeCVV}
onChangeText={(codeCVV) => {
if (codeCVV.length > 3) {
this.setState({ codeCVV: this.state.codeCVV.substring(0, 3) })
}
else
this.setState({ codeCVV })
}}
style={styles.input}
>
</Fumi> */}
</Animatable.View>
<Animatable.View ref={(comp) => { this.montantAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'money'}
label={I18n.t('AMOUNT')}
iconColor={'#f95a25'}
keyboardType='numeric'
iconSize={20}
value={this.state.montant}
onChangeText={(montant) => {
this.setState({ montant })
}}
style={styles.input}
>
</Fumi>
<View style={{
position: 'absolute',
left: responsiveWidth(82),
top: 35,
flexDirection: 'row'
}}>
<View
style={{
width: 1,
borderLeftColor: '#f0f0f0',
height: 40,
left: -8,
top: -10,
borderLeftWidth: 1,
}}
/>
<Text style={[Typography.body1, FontWeight.bold]}>{this.state.wallet.currency_code}</Text>
</View>
</Animatable.View>
<Animatable.View ref={(comp) => { this.passwordAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'lock'}
label={I18n.t('PASSWORD')}
iconColor={'#f95a25'}
iconSize={20}
secureTextEntry={true}
value={this.state.password}
onChangeText={(password) => {
this.setState({ password })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Button style={styles.btnvalide}
textStyle={styles.textbtnvalide}
onPress={() => { this.onSubmitSendWalletToCard() }}>
{I18n.t('SUBMIT_LABEL')}</Button>
</ScrollView>
</>
)
}
}
const maptStateToProps = state => ({
loadingEnvoieWalletToCard: state.envoieUserWalletToCardReducer.loading,
resultEnvoieWalletToCard: state.envoieUserWalletToCardReducer.result,
errorEnvoieWalletToCard: state.envoieUserWalletToCardReducer.error,
loadingEnvoieWalletToCardGetCommission: state.envoieUserWalletToCardGetCommissionReducer.loading,
resultEnvoieWalletToCardGetCommission: state.envoieUserWalletToCardGetCommissionReducer.result,
errorEnvoieWalletToCardGetCommission: state.envoieUserWalletToCardGetCommissionReducer.error,
});
const mapDispatchToProps = dispatch => bindActionCreators({
envoieUserWalletToCardAction,
envoieUserWalletToCardReset,
getCommissionUserWalletToCardAction,
getCommissionUserWalletToCardReset
}, dispatch);
export default connect(maptStateToProps, mapDispatchToProps)(EnvoieCashVersCarteAgent);
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: Color.primaryDarkColor,
},
textbtnvalide: {
color: 'white',
fontWeight: 'bold'
},
bigtitle: {
color: 'white',
fontSize: 20,
flex: 1,
fontWeight: 'bold',
textAlign: 'center',
margin: 20,
},
blockView: {
paddingVertical: 10,
borderBottomWidth: 1
},
subbigtitle: {
color: 'white',
fontSize: 17,
textAlign: 'center',
margin: 5,
},
btnvalide: {
marginTop: 20,
marginLeft: 20,
marginRight: 20,
borderColor: 'transparent',
backgroundColor: Color.accentLightColor,
height: 52
},
btnSubmit: {
marginTop: 20,
borderColor: 'transparent',
backgroundColor: Color.accentLightColor,
height: 52,
width: "30%",
marginLeft: 20,
marginRight: 20,
},
input: {
height: 60,
marginTop: responsiveHeight(2),
marginLeft: responsiveWidth(5),
marginRight: responsiveWidth(5),
borderRadius: 5,
}
});

View File

@ -314,7 +314,7 @@ class EnvoieCashVersWalletAgent extends Component {
}
<ScrollView style={styles.container}>
<Text style={styles.subbigtitle}>{I18n.t('DEPOSIT_CASH_TO_OTHER_WALLET')}</Text>
<Text style={styles.subbigtitle}>{I18n.t('DEPOSIT_CASH_TO_WALLET_DESCRIPTION')}</Text>
<Animatable.View ref={(comp) => { this.userCodeAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'user-secret'}

View File

@ -38,7 +38,7 @@ class RetraitCarteVersCashAgent extends Component {
static navigationOptions = () => {
return {
drawerLabel: () => null,
headerTitle: I18n.t('WITHDRAWAL_CARD_TO_CASH'),
headerTitle: I18n.t('WITHDRAWAL_CARD_TO_CASH_AGENT'),
headerTintColor: 'white',
headerStyle: {
backgroundColor: Color.primaryColor,
@ -48,7 +48,7 @@ class RetraitCarteVersCashAgent extends Component {
headerTitleStyle: {
color: "white"
},
title: I18n.t('WITHDRAWAL_CARD_TO_CASH')
title: I18n.t('WITHDRAWAL_CARD_TO_CASH_AGENT')
}
};
@ -257,10 +257,10 @@ class RetraitCarteVersCashAgent extends Component {
});
this.props.envoieUserWalletToCardAction({
type: 13,
numCarte: this.state.creditCardInput.values.number.replace(/\s/g, ''),
numero_carte: this.state.creditCardInput.values.number.replace(/\s/g, ''),
cvv: this.state.creditCardInput.values.cvc,
expiration_date: this.state.creditCardInput.values.expiry,
id_wallet_user: this.state.wallet.id,
id_wallet_agent: this.state.wallet.id,
montant: this.state.montant,
password: this.state.password
});

View File

@ -124,10 +124,8 @@ class RetraitEnCashAgent extends Component {
onSubmitRetraitCash = () => {
const { codeRetrait, montant, password } = this.state;
if (this.ckeckIfFieldIsOK(montant) || !this.isMontantValid().isValid)
if (this.ckeckIfFieldIsOK(montant))
this.montantAnim.shake(800);
else if (this.ckeckIfFieldIsOK(codeRetrait))
this.codeRetraitAnim.shake(800);
else if (this.ckeckIfFieldIsOK(password))
this.passwordAnim.shake(800);
else {
@ -142,21 +140,24 @@ class RetraitEnCashAgent extends Component {
});
}
this.setState({
triggerSubmitClick: true
});
}
onSubmitNextStep = () => {
const { idTransaction } = this.state;
const { idTransaction, codeRetrait } = this.state;
this.props.checkIdTransactionReset();
if (this.ckeckIfFieldIsOK(idTransaction))
this.idTransactionAnim.shake(800);
else if (this.ckeckIfFieldIsOK(codeRetrait))
this.codeRetraitAnim.shake(800);
else {
this.props.checkIdTransactionAction({
id_transaction: idTransaction,
id_wallet_agent: this.state.wallet.id
id_wallet_agent: this.state.wallet.id,
code_retrait: this.state.codeRetrait
});
this.setState({ triggerNextClick: true });
}
@ -185,7 +186,7 @@ class RetraitEnCashAgent extends Component {
if (resultEnvoieWalletToCard !== null) {
if (resultEnvoieWalletToCard.response !== null) {
Alert.alert(
I18n.t("SUCCESS_TRANSFER"),
I18n.t("WITHDRAWAL_SUCCESS"),
resultEnvoieWalletToCard.response,
[
{
@ -217,6 +218,7 @@ class RetraitEnCashAgent extends Component {
nom_destinataire: resultIdRetraitEnCash.response.nom_destinataire,
prenom_destinataire: resultIdRetraitEnCash.response.prenom_destinataire,
type_document_destinataire: resultIdRetraitEnCash.response.type_document_destinataire,
montant: resultIdRetraitEnCash.response.montant,
displayFirstStep: !this.state.displayFirstStep,
displaySecondStep: !this.state.displaySecondStep,
});
@ -296,6 +298,20 @@ class RetraitEnCashAgent extends Component {
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.codeRetraitAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'lock'}
value={this.state.codeRetrait}
label={`${I18n.t('CODE_RETRAIT')}`}
iconColor={'#f95a25'}
iconSize={20}
onChangeText={(codeRetrait) => {
this.setState({ codeRetrait })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Button style={styles.btnvalide}
textStyle={styles.textbtnvalide}
isLoading={this.state.isLoging}
@ -348,7 +364,7 @@ class RetraitEnCashAgent extends Component {
label={I18n.t('PIECE_IDENTITE')}
data={this.state.identityPieces}
useNativeDriver={true}
disabled={false}
disabled={true}
value={this.state.type_document_destinataire}
valueExtractor={(value) => { return value.name }}
labelExtractor={(value) => { return value.name }}
@ -367,34 +383,15 @@ class RetraitEnCashAgent extends Component {
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.codeRetraitAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'lock'}
value={this.state.codeRetrait}
label={`${I18n.t('CODE_RETRAIT')}`}
iconColor={'#f95a25'}
iconSize={20}
onChangeText={(codeRetrait) => {
this.setState({ codeRetrait })
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.montantAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'money'}
label={I18n.t('AMOUNT')}
iconColor={'#f95a25'}
keyboardType='numeric'
iconSize={20}
value={this.state.montant}
onChangeText={(montant) => {
this.setState({ montant })
}}
editable={false}
value={`${this.state.montant}`}
style={styles.input}
>
</Fumi>
/>
<View style={{
position: 'absolute',
left: responsiveWidth(82),

View File

@ -17,6 +17,7 @@ import { Color } from '../../../config/Color';
import { store } from "../../../redux/store";
import { identityPieces, isIlinkWorldWallet, isNormalInteger, typeIdIDestinataire, thousandsSeparators } from '../../../utils/UtilsFunction';
import { readUser } from '../../../webservice/AuthApi';
import { envoieUserWalletToCashAction, envoieUserWalletToCashReset, getCommissionUserWalletToCashAction, getCommissionUserWalletToCashReset } from '../../../webservice/EnvoieUserApi';
import { getActiveCountryAction, getActiveCountryByDialCodeAction, getActiveCountryByDialCodeReset, getActiveCountryReset, getPayCountryNetworkAction, getPayCountryNetworkReset } from '../../../webservice/CountryApi';
import { Typography, FontWeight } from '../../../config/typography';
import thousands from 'thousands';

View File

@ -47,7 +47,7 @@ export const displayToast = (message) => {
}
export const isIlinkWorldWallet = (walletName) => {
return isEqual(slugify(walletName).toLowerCase(), 'ilink-world');
return isEqual(slugify(walletName).toLowerCase(), 'ilink');
}
@ -181,52 +181,6 @@ export const transactionHistoryUser = () => {
];
}
export const optionDepotScreen = {
type: 'DEPOT',
title: I18n.t('ENVOIE_ARGENT'),
subTitle: I18n.t('CHOOSE_OPTION'),
options: [
{
screen: route.envoieCashVersWalletAgent,
icon: 'wallet',
title: I18n.t('DEPOSIT_CASH_TO_WALLET'),
},
{
screen: route.envoieCashVersAutreWalletAgent,
icon: 'cash-refund',
title: I18n.t('DEPOSIT_CASH_TO_OTHER_WALLET'),
},
{
screen: route.walletDepot,
icon: 'credit-card',
title: I18n.t('DEPOSIT_CASH_TO_VISA'),
},
{
screen: route.walletDepot,
icon: 'bank-transfer-in',
title: I18n.t('DEPOSIT_CASH_TO_BANK'),
},
]
}
export const optionRetraitScreen = {
type: 'RETRAIT',
title: I18n.t('RETRAIT_ARGENT'),
subTitle: I18n.t('CHOOSE_OPTION'),
options: [
{
screen: route.retraitEnCashAgent,
icon: 'cash',
title: I18n.t('WITHDRAWAL_IN_CASH'),
},
{
screen: route.retraitCarteVersCashAgent,
icon: 'credit-card',
title: I18n.t('WITHDRAWAL_CARD_TO_CASH'),
},
]
}
export const optionWalletToBank = {
title: I18n.t('DEPOSIT_TO_BANK'),
subTitle: I18n.t('CHOOSE_OPERATOR'),
@ -270,6 +224,59 @@ export const optionWalletToBank = {
]
}
export const optionDepotScreen = {
type: 'DEPOT',
title: I18n.t('ENVOIE_ARGENT'),
subTitle: I18n.t('CHOOSE_OPTION'),
options: [
{
screen: route.envoieCashVersWalletAgent,
icon: 'wallet',
title: I18n.t('DEPOSIT_CASH_TO_WALLET'),
},
{
screen: route.envoieCashVersAutreWalletAgent,
icon: 'cash-refund',
title: I18n.t('DEPOSIT_CASH_TO_OTHER_WALLET'),
},
{
screen: route.envoieCashVersCarteAgent,
icon: 'credit-card',
title: I18n.t('DEPOSIT_CASH_TO_VISA'),
},
{
screen: route.envoiCashVersCashAgent,
icon: 'cash-multiple',
title: I18n.t('DEPOSIT_CASH_TO_CASH'),
},
{
screen: route.operateurOptionSelect,
icon: 'bank-transfer-in',
title: I18n.t('DEPOSIT_CASH_TO_BANK'),
subScreenOption: optionWalletToBank,
type: 'WALLET_TO_BANK',
},
]
}
export const optionRetraitScreen = {
type: 'RETRAIT',
title: I18n.t('RETRAIT_ARGENT'),
subTitle: I18n.t('CHOOSE_OPTION'),
options: [
{
screen: route.retraitEnCashAgent,
icon: 'cash',
title: I18n.t('WITHDRAWAL_IN_CASH'),
},
{
screen: route.retraitCarteVersCashAgent,
icon: 'credit-card',
title: I18n.t('WITHDRAWAL_CARD_TO_CASH_AGENT'),
},
]
}
export const optionRetraitUserScreen = {
type: 'RETRAIT_USER',
title: I18n.t('RETRAIT_ARGENT'),

View File

@ -77,10 +77,14 @@
"WITHDRAWAL_CARD_TO_WALLET": "Withdrawal card to wallet",
"WITHDRAWAL_CARD_TO_WALLET_DESCRIPTION": "Withdrawal money from your card to your wallet",
"WITHDRAWAL_CARD_TO_CASH": "Withdrawal card to cash",
"WITHDRAWAL_CARD_TO_CASH_AGENT": "Withdrawal card to cash",
"WITHDRAWAL_CARD_TO_CASH_DESCRIPTION": "Withdrawal money from card to cash",
"DEPOSIT_CASH_TO_WALLET": "Cash to wallet",
"DEPOSIT_CASH_TO_WALLET": "Cash to iLinkWorld wallet",
"DEPOSIT_CASH_TO_WALLET_DESCRIPTION": "Deposit Cash to iLinkWorld wallet",
"DEPOSIT_CASH_TO_OTHER_WALLET": "Cash to another wallet",
"DEPOSIT_CASH_TO_OTHER_WALLET_DESCRIPTION": "Send Cash to another wallet",
"DEPOSIT_CASH_TO_VISA": "Cash to visa card",
"DEPOSIT_CASH_TO_VISA_DESCRIPTION": "Deposit money Cash to visa card",
"DEPOSIT_CASH_TO_BANK": "Cash to bank",
"DEPOSIT_WALLET_TO_WALLET": "Wallet to wallet",
"ENVOIE_WALLET_TO_WALLET": "Send Wallet to wallet",
@ -90,6 +94,8 @@
"ENVOIE_WALLET_TO_CASH": "Send Wallet to cash",
"DEPOSIT_WALLET_TO_BANK": "Your Wallet to bank",
"ENVOIE_WALLET_TO_BANK": "Send Wallet to bank",
"DEPOSIT_CASH_TO_CASH": "Cash to cash",
"ENVOIE_CASH_TO_CASH": "Send money in cash to cash",
"TRANSACTION_DETAIL": "Transaction detail",
"CODE_IBAN": "IBAN Code",
"FEES_AND_TAXES": "Fees and taxes",
@ -98,7 +104,7 @@
"NET_AMOUNT": "Net amount",
"CODE_WALLET": "Wallet Code",
"CODE_RETRAIT": "Withdrawal code",
"ACTIVE_WALLET": "Active wallet",
"ACTIVE_WALLET": "Paying network",
"TYPE_IDENTIFIANT": "ID type",
"PAYS_DESTINATION": "Destination country",
"DEPOSIT_TO_CASH": "Your Wallet to cash",
@ -153,6 +159,15 @@
"GROUP_MEMBERS": "The group members",
"NAME": "Last name(s)",
"FIRSTNAME": "First name(s) ",
"NAME_EMETTEUR": "Issuer first name(s)",
"FIRSTNAME_EMETTEUR": "Issuer last name(s) ",
"EMAIL_EMETTEUR": "Issuer email ",
"ID_DESTINATAIRE": "Destination ID",
"NUMERO_IDENTITE_EMETTEUR": "Issuer ID number",
"NAME_DESTINATAIRE": "Recipient first name(s)",
"FIRSTNAME_DESTINATAIRE": "Recipient last name(s)",
"EMAIL_DESTINATAIRE": "Recipient email ",
"NUMERO_IDENTITE_DESTINATAIRE": "Recipient's identity number",
"AND": "and",
"ADMIN": "Administrator",
"SUPER_ADMIN": "Super administrator",

View File

@ -82,10 +82,14 @@
"WITHDRAWAL_CARD_TO_WALLET": "Retrait de votre carte vers wallet",
"WITHDRAWAL_CARD_TO_WALLET_DESCRIPTION": "Retrait d'argent de votre carte vers wallet",
"WITHDRAWAL_CARD_TO_CASH": "Retrait de votre carte vers cash",
"WITHDRAWAL_CARD_TO_CASH_AGENT": "Retrait carte vers cash",
"WITHDRAWAL_CARD_TO_CASH_DESCRIPTION": "Retrait de l'argent de votre carte vers cash",
"DEPOSIT_CASH_TO_WALLET": "Cash vers wallet",
"DEPOSIT_CASH_TO_WALLET": "Cash vers wallet iLinkWorld",
"DEPOSIT_CASH_TO_WALLET_DESCRIPTION": "Dépôt Cash vers wallet iLinkWorld",
"DEPOSIT_CASH_TO_OTHER_WALLET": "Cash vers autre wallet",
"DEPOSIT_CASH_TO_OTHER_WALLET_DESCRIPTION": "Envoie de Cash vers autre wallet",
"DEPOSIT_CASH_TO_VISA": "Cash vers carte visa",
"DEPOSIT_CASH_TO_VISA_DESCRIPTION": "Envoie d'argent de Cash vers carte visa",
"DEPOSIT_CASH_TO_BANK": "Cash vers banque",
"DEPOSIT_WALLET_TO_WALLET": "Votre Wallet vers wallet",
"ENVOIE_WALLET_TO_WALLET": "Envoie Wallet vers wallet",
@ -95,6 +99,8 @@
"ENVOIE_WALLET_TO_CARD": "Envoie Wallet vers carte",
"DEPOSIT_WALLET_TO_BANK": "Votre Wallet vers banque",
"ENVOIE_WALLET_TO_BANK": "Envoie Wallet vers banque",
"DEPOSIT_CASH_TO_CASH": "Cash vers cash",
"ENVOIE_CASH_TO_CASH": "Envoie d'argent en cash vers cash",
"TRANSACTION_DETAIL": "Détail de la transaction",
"FEES_AND_TAXES": "Frais et taxes",
"CODE_IBAN": "Code IBAN",
@ -105,7 +111,7 @@
"CODE_RETRAIT": "Code Retrait",
"TYPE_IDENTIFIANT": "Type d'identifiant",
"PAYS_DESTINATION": "Pays destination",
"ACTIVE_WALLET": "Wallet actif",
"ACTIVE_WALLET": "Réseau payeur",
"DEPOSIT_TO_CASH": "Votre Wallet vers cash",
"DEPOSIT_TO_CARD": "Votre Wallet vers carte",
"DEPOSIT_TO_BANK": "Votre Wallet vers banque",
@ -157,6 +163,15 @@
"GROUP_MEMBERS": "Les membres du groupe",
"NAME": "Nom(s)",
"FIRSTNAME": "Prénom(s) ",
"NAME_EMETTEUR": "Nom(s) émetteur",
"FIRSTNAME_EMETTEUR": "Prénom(s) émetteur",
"EMAIL_EMETTEUR": "Email émetteur ",
"ID_DESTINATAIRE": "Identifiant destinataire ",
"NUMERO_IDENTITE_EMETTEUR": "Numéro d'identité de l'émetteur",
"NAME_DESTINATAIRE": "Nom(s) destinataire",
"FIRSTNAME_DESTINATAIRE": "Prénom(s) destinatire",
"EMAIL_DESTINATAIRE": "Email destinataire ",
"NUMERO_IDENTITE_DESTINATAIRE": "Numéro d'identité du destinataire",
"AND": "et",
"ADMIN": "Administrateur",
"SUPER_ADMIN": "Super administrateur",
@ -188,7 +203,7 @@
"IDENTITY_NUMBER": "N° de la pièce",
"IDENTITY_PIECE_EXPIRY_DATE": "Date d'expiration",
"LAST_STEP": "Derniere étape",
"ID_TRANSACTION": "Identifiant de la transactin",
"ID_TRANSACTION": "Identifiant de la transaction",
"ACTIVE_ACCOUNT": "Activez le compte !",
"ACTIVE_USER": "Activer",
"LAST_STEP_TEXT": "Activez votre compte à l'aide du code de validation qui vous a été envoyé sur votre adresse e-mail et sur votre numero de téléphone",

View File

@ -3,7 +3,7 @@ import axios from "axios";
import I18n from 'react-native-i18n';
import { fetchActiveCountryListPending, fetchActiveCountryListSucsess, fetchActiveCountryListError, fetchActiveCountryListReset, fetchPayCountryNetworkPending, fetchPayCountryNetworkSucsess, fetchPayCountryNetworkError, fetchPayCountryNetworkReset, fetchCountryByDialCodePending, fetchCountryByDialCodeSucsess, fetchCountryByDialCodeError, fetchCountryByDialCodeReset } from "../redux/actions/CountryAction";
import { store } from "../redux/store";
import { activeCountryUrl, payCountryNetworkUrl } from "./IlinkConstants";
import { activeCountryUrl, payCountryNetworkUrl, otherPayCountryNetworkUrl } from "./IlinkConstants";
export const getActiveCountryAction = () => {
@ -74,6 +74,38 @@ export const getPayCountryNetworkAction = (data) => {
}
}
export const getOtherPayCountryNetworkAction = (data) => {
const auth = store.getState().authKeyReducer;
const authKey = auth !== null ? `${auth.authKey.token_type} ${auth.authKey.access_token}` : '';
return dispatch => {
dispatch(fetchPayCountryNetworkPending());
axios({
url: `${otherPayCountryNetworkUrl}`,
method: 'POST',
data,
headers: {
'Authorization': authKey,
'X-Localization': I18n.currentLocale()
}
})
.then(response => {
console.log(response);
dispatch(fetchPayCountryNetworkSucsess(response));
})
.catch(error => {
if (error.response)
dispatch(fetchPayCountryNetworkError(error.response));
else if (error.request)
dispatch(fetchPayCountryNetworkError(error.request))
else
dispatch(fetchPayCountryNetworkError(error.message))
});
}
}
export const getPayCountryNetworkReset = () => {
return dispatch => {
dispatch(fetchPayCountryNetworkReset());

View File

@ -43,6 +43,7 @@ export const getUserIdentifiedInformationUrl = testBaseUrl + '/walletService/ide
export const activeCountryUrl = testBaseUrl + '/walletService/countries';
export const payCountryNetworkUrl = testBaseUrl + '/walletService/paying_networks';
export const otherPayCountryNetworkUrl = testBaseUrl + '/walletService/other_paying_networks';
export const envoieUserWalletToWallet = testBaseUrl + '/walletService/transactions/ilink';
export const envoieCommissionUrl = testBaseUrl + '/walletService/transactions/ilink/commission';