adminnistrateur
/
ilink-world
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

ajout du boutton retarit de cart vers autre wallet

This commit is contained in:
Novic-Djef 2023-07-17 20:58:14 +01:00
parent 9d3609a4a2
commit b8ac11a571
16 changed files with 1410 additions and 99 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
android/app/src/main/assets/index.android.bundle
View File

File diff suppressed because one or more lines are too long

2
app/App.js
View File

@ -64,6 +64,7 @@ import RetraitWalletVersCashUser from './screens/wallet/user/RetraitWalletVersCa
import RetraitCarteVersCashUser from './screens/wallet/user/RetraitCarteVersCashUser';
import RetraitCarteVersWalletUser from './screens/wallet/user/RetraitCarteVersWalletUser';
import RetraitEnCashAgent from './screens/wallet/agent/RetraitEnCashAgent';
import RetraitCarteVersAutreWalletUser from './screens/wallet/user/RetraitCarteVersAutreWalletUser';
import RetraitCarteVersCashAgent from './screens/wallet/agent/RetraitCarteVersCashAgent';
import EnvoieCashVersWalletAgent from './screens/wallet/agent/EnvoieCashVersWalletAgent';
import EnvoieCashVersAutreWalletAgent from './screens/wallet/agent/EnvoieCashVersAutreWalletAgent';
@ -401,6 +402,7 @@ const AppAgentStack = createDrawerNavigator(
paiementFacture: PaiementFacture,
retraitEnCashAgent: RetraitEnCashAgent,
retraitCarteVersCashAgent: RetraitCarteVersCashAgent,
retraitCarteVersAutreWalletUser: RetraitCarteVersAutreWalletUser,
envoieCashVersWalletAgent: EnvoieCashVersWalletAgent,
envoieCashVersAutreWalletAgent: EnvoieCashVersAutreWalletAgent,
envoieCashVersCarteAgent: EnvoieCashVersCarteAgent,

4
app/route.json
View File

@ -50,6 +50,8 @@
"retraitCarteVersWalletUser": "retraitCarteVersWalletUser",
"retraitEnCashAgent": "retraitEnCashAgent",
"retraitCarteVersCashAgent": "retraitCarteVersCashAgent",
"retraitCarteVersAutreWalletUser": "retraitCarteVersAutreWalletUser",
"modal": "modal",
"envoieCashVersWalletAgent": "envoieCashVersWalletAgent",
"envoieCashVersAutreWalletAgent": "envoieCashVersAutreWalletAgent",
"envoieCashVersCarteAgent": "envoieCashVersCarteAgent",
@ -74,5 +76,5 @@
"modifierFeuilleSoinScreen": "modifierFeuilleSoinScreen",
"modifierExecutionPrescriptionScreen": "modifierExecutionPrescriptionScreen",
"historiqueNanoSanteAgentScreen": "historiqueNanoSanteAgentScreen",
"historiqueNanoSanteSuperHyperScreen": "historiqueNanoSanteSuperHyperScreen",
"historiqueNanoSanteSuperHyperScreen": "historiqueNanoSanteSuperHyperScreen"
}

2
app/screens/optionMenu/OptionsMenu.js
View File

@ -446,6 +446,8 @@ export default class OptionsMenu extends Component {
item === 'retraitCarteVersWalletUser' ||
item === 'retraitEnCashAgent' ||
item === 'retraitCarteVersCashAgent' ||
item === 'retraitCarteVersAutreWalletUser' ||
item === 'modal' ||
item === 'envoieCashVersWalletAgent' ||
item === 'envoieCashVersAutreWalletAgent' ||
item === 'retraitCarteVersCashUser' ||

18
app/screens/wallet/WalletOptionSelect.js
View File

@ -349,7 +349,7 @@ class WalletOptionSelect extends Component {
<View style={[styles.content]}>
<View style={[styles.contentTitle], {paddingTop: options.title.length > 20 ? 0 : 5}}>
<View style={[styles.contentTitle, {paddingTop: options.title.length > 20 ? 0 : 5}]}>
<Text style={[Typography.headline, Typography.semibold]}>
{I18n.t(options.title)}
</Text>
@ -403,7 +403,7 @@ class WalletOptionSelect extends Component {
<View style={[styles.content]}>
<View style={[styles.contentTitle], {paddingTop: options.title.length > 20 ? 0 : 5}}>
<View style={[styles.contentTitle, {paddingTop: options.title.length > 20 ? 0 : 5}]}>
<Text style={[Typography.headline, Typography.semibold]}>
{I18n.t(options.title)}
</Text>
@ -447,7 +447,7 @@ class WalletOptionSelect extends Component {
/>
</View>
<View>
<Text style={[Typography.title3, Color.primaryColor], {marginBottom: 3}}>
<Text style={[Typography.title3, Color.primaryColor, {marginBottom: 3}]}>
{I18n.t('CREDIT_ACCOUNT')}
</Text>
{this.state.user !== null ?
@ -472,7 +472,7 @@ class WalletOptionSelect extends Component {
/>
</View>
<View>
<Text style={[Typography.title3, Color.primaryColor], {marginBottom: 3}}>
<Text style={[Typography.title3, Color.primaryColor, {marginBottom: 3}]}>
{I18n.t('SAVINGS_ACCOUNT')}
</Text>
{this.state.user !== null ?
@ -699,7 +699,7 @@ class WalletOptionSelect extends Component {
transactionHistoryIlinkLabel().map((item, index) => (
<View style={{alignItems: 'center'}} key={index}>
<Icon name={item.icon} size={24} color={Color.primaryColor}/>
<Text style={[Typography.overline, Color.grayColor], {marginTop: 4}}>
<Text style={[Typography.overline, Color.grayColor, {marginTop: 4}]}>
{I18n.t(item.label)}
</Text>
</View>
@ -735,7 +735,7 @@ class WalletOptionSelect extends Component {
Object.keys(omit(item, ['id', 'retrait_cash', 'montant_retire', 'type_historique', 'type_caution', 'id_demande', 'montant_rembourse', 'partiellement_rembourse', 'duree_mois', 'etat', 'interet', 'taxe', 'date_validation', 'date_remboursement_prevu', 'date_remboursement', 'id_user', 'id_wallet_agent', 'id_network', 'user', 'user_phone', 'agent', 'codeParrain'])).map((element, i) => (
<View style={{alignItems: 'center'}} key={i}>
<Text style={[Typography.overline, Color.grayColor], {marginTop: 4}}>
<Text style={[Typography.overline, Color.grayColor, {marginTop: 4}]}>
{
isEqual(element, 'montant') ?
` ${item[element].length > 8 ? cutString(thousands(item[element], ' '), 6) : thousands(item[element], ' ')} ${this.state.wallet.currency_code}`
@ -750,7 +750,7 @@ class WalletOptionSelect extends Component {
Object.keys(omit(item, ['id', 'type', 'montant_retire', 'id_epargne', 'type_historique', 'date_demande', 'date_fin', 'date_remboursement_prevu', 'date_validation', 'date_cassation', 'date_remboursement', 'id_demande', 'duree_mois', 'taxe', '', 'date_fin', 'date_cassation', 'etat', 'id_user', 'id_network', 'user', 'partiellement_rembourse', 'user_phone', 'type_caution', 'interet', 'date_remboursement_prevu', 'date_remboursement', 'id_wallet_agent', 'retrait_cash', 'codeParrain', 'agent', 'montant_rembourse', ''])).map((element, i) => (
<View style={{alignItems: 'center'}} key={i}>
<Text style={[Typography.overline, Color.grayColor], {marginTop: 4}}>
<Text style={[Typography.overline, Color.grayColor, {marginTop: 4}]}>
{
isEqual(element, 'montant') ?
` ${item[element].length > 8 ? cutString(thousands(item[element], ' '), 6) : thousands(item[element], ' ')} ${this.state.wallet.currency_code}`
@ -777,7 +777,7 @@ class WalletOptionSelect extends Component {
'network_agent_id', 'network_id', 'period_end_at','period_start_at','updated_at'])).map((element, i) => (
<View style={{alignItems: 'center'}} key={i}>
<Text style={[Typography.overline, Color.grayColor], {marginTop: 4}}>
<Text style={[Typography.overline, Color.grayColor, {marginTop: 4}]}>
{item[element]}
</Text>
</View>
@ -870,7 +870,7 @@ class WalletOptionSelect extends Component {
nanoSanteHistoryLabel().map((item, index) => (
<View style={{alignItems: 'center'}} key={index}>
<Icon name={item.icon} size={24} color={Color.primaryColor}/>
<Text style={[Typography.overline, Color.grayColor], {marginTop: 4}}>
<Text style={[Typography.overline, Color.grayColor, {marginTop: 4}]}>
{I18n.t(item.label)}
</Text>
</View>

2
app/screens/wallet/WalletSelect.js
View File

@ -128,7 +128,7 @@ class WalletSelect extends Component {
</View>
<View>
<Text style={Typography.body1}>{item.network}</Text>
<Text style={[Typography.footnote, Color.grayColor]} style={{marginTop: 5}}>
<Text style={[Typography.footnote, Color.grayColor, {marginTop: 5}]}>
{I18n.t('COUNTRY')}: {item.country}
</Text>
</View>

79
app/screens/wallet/agent/CountryList.js Normal file
View File

@ -0,0 +1,79 @@
import React, { Component } from 'react';
import { View } from 'react-native';
import { Dropdown } from 'react-native-material-dropdown-v2';
import axios from 'axios';
export default class CountryList extends Component {
constructor(props) {
super(props);
this.state = {
dropdownOptions: [],
hasLoadActivePayCountryNetworkList: false,
selectedValue: null,
paysDestinationSelect: null,
};
}
componentDidMount() {
this.fetchData();
}
fetchData = async () => {
try {
const response = await axios.get('https://api.countrystatecity.in/v1/countries', {
headers: {
'X-CSCAPI-KEY': 'API_KEY'
}
});
// Mettre à jour les options de la liste déroulante dans l'état
this.setState({ dropdownOptions: response.data });
} catch (error) {
console.error('Erreur lors de la récupération des options de la liste déroulante:', error);
}
};
render() {
const { dropdownOptions } = this.state;
return (
<View>
<Dropdown
label={I18n.t('SELECT_COUNTRY')}
//data={this.state.paysDestination}
data={dropdownOptions}
useNativeDriver={true}
//value={this.state.paysDestinationSelect === null ? '' : this.state.paysDestinationSelect}
value={selectedValue}
//onChangeText={this.handleValueChange}
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_user: this.state.wallet.id,
// id_country: countrySelect[0].id
// });
// });
// this.props.getCommissionUserWalletToWalletReset();
}
}
valueExtractor={(value) => {
return value.name
}}
labelExtractor={(value) => {
return value.name
}}
/>
</View>
);
}
}

1
app/screens/wallet/agent/EnvoiCashVersCashAgent.js
View File

@ -669,6 +669,7 @@ class EnvoiCashVersCashAgent extends Component {
<Animatable.View ref={(comp) => {
this.paysDestinationAnim = comp
}}
style={{
width: responsiveWidth(90),

47
app/screens/wallet/agent/EnvoieCashVersAutreWalletAgent.js
View File

@ -481,22 +481,22 @@ class EnvoieCashVersAutreWalletAgent extends Component {
}
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')}
/>
)
}
// 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.modalVisible || this.props.loadingEnvoieWalletToCashGetCommission || this.props.loadingEnvoieWalletToCash || this.props.loadingCountryByDialCode || this.props.loadingActiveCountryList || this.props.loadingCountryByDialCode)}
{this.state.hasLoadActiveCountryList && this.renderGetActionCountryList()}
{this.state.hasLoadActivePayCountryNetworkList && this.renderGetPayCountryNetworkResponse()}
{this.state.isDataSubmit && this.renderEnvoieWalletToWalletResponse()}
@ -669,6 +669,7 @@ class EnvoieCashVersAutreWalletAgent extends Component {
<Animatable.View ref={(comp) => {
this.paysDestinationAnim = comp
console.log("pays destinantaire ! !:", this.state.paysDestination )
}}
style={{
width: responsiveWidth(90),
@ -686,20 +687,20 @@ class EnvoieCashVersAutreWalletAgent extends Component {
useNativeDriver={true}
value={this.state.paysDestinationSelect === null ? '' : this.state.paysDestinationSelect}
onChangeText={(value, index, data) => {
this.props.getPayCountryNetworkReset();
//this.props.getPayCountryNetworkReset();
let countrySelect = data.filter(element => element.name === value);
this.setState({
paysDestinationSelect: value,
hasLoadActivePayCountryNetworkList: true,
isDataSubmit: false
}, () => {
this.props.getOtherPayCountryNetworkAction({
id_wallet_agent: this.state.wallet.id,
id_country: countrySelect[0].id
});
});
this.props.getCommissionUserWalletToCashReset();
// let countrySelect = data.filter(element => element.name === value);
// this.setState({
// paysDestinationSelect: value,
// hasLoadActivePayCountryNetworkList: true,
// isDataSubmit: false
// }, () => {
// this.props.getOtherPayCountryNetworkAction({
// id_wallet_agent: this.state.wallet.id,
// id_country: countrySelect[0].id
// });
// });
// this.props.getCommissionUserWalletToCashReset();
}}
valueExtractor={(value) => {
return value.name

391
app/screens/wallet/agent/RetraitCarteVersCashAgent.js
View File

@ -2,10 +2,11 @@ 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 { Alert, ScrollView, StyleSheet, Text, View, FlatList } from 'react-native';
import * as Animatable from 'react-native-animatable';
import Dialog from "react-native-dialog";
import I18n from 'react-native-i18n';
import {Dropdown} from 'react-native-material-dropdown-v2';
import { responsiveHeight, responsiveWidth } from 'react-native-responsive-dimensions';
import { ProgressDialog } from 'react-native-simple-dialogs';
import FontAwesomeIcon from 'react-native-vector-icons/FontAwesome';
@ -19,12 +20,17 @@ import { store } from "../../../redux/store";
import { IlinkEmitter } from '../../../utils/events';
import { LiteCreditCardInput } from "react-native-credit-card-input";
import { readUser } from '../../../webservice/AuthApi';
import {
getActiveCountryAction,
getActiveCountryReset,
getOtherPayCountryNetworkAction,
getPayCountryNetworkReset,
} from '../../../webservice/CountryApi';
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 RetraitCarteVersCashAgent extends Component {
static navigatorStyle = {
@ -55,6 +61,10 @@ class RetraitCarteVersCashAgent extends Component {
constructor(props) {
super(props);
this.state = {
countryCustomer: [],
paysDestination: [],
paysDestinationSelect: null,
hasLoadActivePayCountryNetworkList: false,
montant: null,
password: null,
montant: '',
@ -68,20 +78,24 @@ class RetraitCarteVersCashAgent extends Component {
user: null,
displayFirstStep: true,
displaySecondStep: false,
displayTercerStep: false,
triggerSubmitClick: false,
isSubmitClick: false,
isDataSubmit: false,
isModalConfirmVisible: false,
hasLoadActiveCountryList: false,
triggerNextClick: false,
modalVisible: false,
wallet: store.getState().walletDetailReducer.result.response
};
this.props.getActiveCountryReset();
this.props.envoieUserWalletToCardReset();
this.props.getCommissionUserWalletToCardReset();
}
componentDidMount() {
readUser().then((user) => {
if (user) {
if (user !== undefined) {
@ -108,6 +122,58 @@ class RetraitCarteVersCashAgent extends Component {
}
}
renderGetActionCountryList = () => {
const {resultActiveCountryList, errorActiveCountryList} = this.props;
if (resultActiveCountryList !== null) {
// if (typeof resultActiveCountryList !== "undefined" ) {
this.setState({
hasLoadActiveCountryList: false,
countryCustomer: resultActiveCountryList.response,
paysDestinationSelect: resultActiveCountryList.response[0].name,
});
if (this.state.hasLoadActivePayCountryNetworkList)
this.props.getOtherPayCountryNetworkAction({
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}
)
}
}
}
isCreditCardValid = () => {
const { creditCardInput } = this.state;
const errorMessage = [];
@ -115,7 +181,7 @@ class RetraitCarteVersCashAgent extends Component {
if (typeof creditCardInput.status !== 'undefined') {
if (creditCardInput.status.cvc === 'incomplete')
errorMessage.push(I18n.t('CVC_CARD_ERROR'));
errorMessage.push(I18n.t('CVC_CARD_ERROR') || secureTextEntry=='true');
if (creditCardInput.status.expiry === 'incomplete')
errorMessage.push(I18n.t('EXPIRY_CARD_ERROR'));
if (creditCardInput.status.number === 'incomplete')
@ -264,7 +330,16 @@ class RetraitCarteVersCashAgent extends Component {
expiration_date: this.state.creditCardInput.values.expiry,
id_wallet_agent: this.state.wallet.id,
montant: this.state.montant,
password: this.state.password
password: this.state.password,
customer_email: this.state.emailCustomer,
customer_name: this.state.nameCustomer,
customer_surname: this.state.surnameCustomer,
customer_address: this.state.adressCustomer,
customer_city: this.state.cityCustomer,
customer_country: (this.state.countryCustomer.filter(element => element.name === this.state.paysDestinationSelect))[0].code_country,
customer_state: this.state.stateCustomer,
customer_zip_code: this.state.codeZipCustomer,
});
this.props.getCommissionUserWalletToCardReset();
}} />
@ -299,39 +374,85 @@ class RetraitCarteVersCashAgent extends Component {
isValid: true
};
}
onSubmitNextStep = () => {
const {surnameCustomer, emailCustomer, adressCustomer, cityCustomer,} = this.state;
if (this.ckeckIfFieldIsOK(surnameCustomer))
this.surnameCustomerAnim.shake(800);
// else if (this.ckeckIfFieldIsOK( nameCustomer))
// this. nameCustomerAnim.shake(800);
else if (this.ckeckIfFieldIsOK(emailCustomer))
this.emailCustomerAnim.shake(800);
else if (this.ckeckIfFieldIsOK(adressCustomer))
this.adressCustomerAnim.shake(800);
else if (this.ckeckIfFieldIsOK(cityCustomer))
this.cityCustomerAnim.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);
});
}
}
onSubmitSendWalletToCard = () => {
const { creditCardInput, montant, password } = this.state;
if (!creditCardInput.valid)
this.codeCVVAnim.shake(800);
else if (this.ckeckIfFieldIsOK(montant) || !this.isMontantValid().isValid) {
const { countryCustomer, stateCustomer, codeZipCustomer, creditCardInput, montant, password } = this.state;
// if (this.ckeckIfFieldIsOK(countryCustomer))
// this.countryCustomerAnim.shake(800);
// else
if (this.ckeckIfFieldIsOK(stateCustomer))
this.stateCustomerAnim.shake(800);
// else if (this.ckeckIfFieldIsOK(codeZipCustomer))
// this.codeZipCustomerAnim.shake(800);
else if (!creditCardInput.valid)
this.codeCVVAnim.shake(800);
else if (this.ckeckIfFieldIsOK(montant) || !this.isMontantValid().isValid) {
this.montantAnim.shake(800);
}
else if (this.ckeckIfFieldIsOK(password))
else if (this.ckeckIfFieldIsOK(password))
this.passwordAnim.shake(800);
else {
this.props.getCommissionUserWalletToCardAction({
type: 13,
id_wallet_agent: this.state.wallet.id,
montant: this.state.montant,
});
else {
this.props.getCommissionUserWalletToCardAction({
type: 13,
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
isDataSubmit: false
// triggerSubmitClick: true,
// hasLoadActiveCountryList: true,
// hasLoadActivePayCountryNetworkList: true,
// numCarte: parseInt((creditCardInput.values.number).replace(/ /g, ' ')),
// cvv: creditCardInput.values.cvc,
// expiration_date: creditCardInput.values.expiry,
// final_country: (this.state.paysDestination.filter(element => element.name === this.state.paysDestinationSelect))[0].id,
});
}
renderLoader = () => {
return (
<ProgressDialog
visible={this.props.loadingEnvoieWalletToCard || this.props.loadingEnvoieWalletToCardGetCommission}
visible={this.state.modalVisible || this.props.loadingEnvoieWalletToCard || this.props.loadingEnvoieWalletToCardGetCommission}
title={I18n.t('LOADING')}
message={I18n.t('LOADING_INFO')}
/>
@ -342,7 +463,8 @@ class RetraitCarteVersCashAgent extends Component {
const { resultEnvoieWalletToCardGetCommission } = this.props;
return (
<>
{(this.props.loadingEnvoieWalletToCard || this.props.loadingEnvoieWalletToCardGetCommission) && this.renderLoader()}
{(this.props.loadingEnvoieWalletToCard || this.props.loadingEnvoieWalletToCardGetCommission) || this.props.loadingActiveCountryList || this.props.loadingCountryByDialCode && this.renderLoader()}
{this.state.hasLoadActiveCountryList && this.renderGetActionCountryList()}
{this.state.isDataSubmit && this.renderEnvoieWalletToWalletResponse()}
{this.state.triggerSubmitClick && this.renderDialogGetCommissionResponse()}
{
@ -357,6 +479,179 @@ class RetraitCarteVersCashAgent extends Component {
<Text style={styles.subbigtitle}>{I18n.t('WITHDRAWAL_CARD_TO_CASH_DESCRIPTION_AGENT')}</Text>
<Animatable.View ref={(comp) => {
this.surnameCustomerAnim = comp
}}>
<Fumi iconClass={FontAwesomeIcon} iconName={'users'}
label={`${I18n.t('SURNAME')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.surnameCustomer}
onChangeText={(surnameCustomer) => {
this.setState({surnameCustomer})
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => {
this.nameCustomerAnim= comp
}}>
<Fumi iconClass={FontAwesomeIcon} iconName={'user-circle-o'}
label={`${I18n.t('PRENOM_CLIENT')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.nameCustomer}
onChangeText={(nameCustomer) => {
this.setState({nameCustomer})
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => {
this.emailCustomerAnim = comp
}}>
<Fumi iconClass={FontAwesomeIcon} iconName='envelope'
label={I18n.t('EMAIL')}
iconColor={'#f95a25'}
keyboardType='email-address'
iconSize={20}
value={this.state.emailCustomer}
onChangeText={(emailCustomer) => {
this.setState({emailCustomer})
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => {
this.adressCustomerAnim = comp
}}>
<Fumi iconClass={FontAwesomeIcon} iconName={'map-marker'}
label={`${I18n.t('ADDRESS')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.adressCustomer}
onChangeText={(adressCustomer) => {
this.setState({adressCustomer})
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => {
this.cityCustomerAnim = comp
}}>
<Fumi iconClass={FontAwesomeIcon} iconName={'pie-chart'}
label={`${I18n.t('CITY')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.cityCustomer}
onChangeText={(cityCustomer) => {
this.setState({cityCustomer})
}}
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.paysDestinationAnim = comp
}}
style={{
width: responsiveWidth(90),
height: 60,
marginTop: 20,
alignSelf: 'center',
borderRadius: 10,
paddingLeft: 20,
paddingRight: 20,
backgroundColor: 'white'
}}>
<Dropdown
label={I18n.t('CARD_COUNTRY')}
data={this.state.countryCustomer}
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,
// isDataSubmit: false
// }, () => {
// 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.stateCustomerAnim = comp
}}>
<Fumi iconClass={FontAwesomeIcon} iconName={'university'}
label={`${I18n.t('ETAT_STATE')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.stateCustomer}
onChangeText={(stateCustomer) => {
this.setState({stateCustomer})
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => {
this.codeZipCustomerAnim = comp
}}>
<Fumi iconClass={FontAwesomeIcon} iconName={'file-zip-o'}
label={`${I18n.t('ZIP_CODE')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.codeZipCustomer}
onChangeText={(codeZipCustomer) => {
this.setState({codeZipCustomer})
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => { this.codeCVVAnim = comp }}>
<View style={{
overflow: 'hidden',
@ -390,26 +685,9 @@ class RetraitCarteVersCashAgent extends Component {
))
}
</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>
<Button style={styles.btnvalide}
{/* <Button style={styles.btnvalide}
textStyle={styles.textbtnvalide}
isLoading={this.state.isLoging}
onPress={() => {
@ -420,15 +698,16 @@ class RetraitCarteVersCashAgent extends Component {
this.setState({
displayFirstStep: !this.state.displayFirstStep,
displaySecondStep: !this.state.displaySecondStep,
});
displayTercerStep: !this.state.displayTercerStep,
}, () => {
this.props.getActiveCountryAction();
console.log("ENVOIE WALLET PROPS", this.props);
});
}
}}>
{I18n.t('NEXT')}</Button>
</>
}
{this.state.displaySecondStep &&
<>
{I18n.t('NEXT')}</Button> */}
<Animatable.View ref={(comp) => { this.montantAnim = comp }}>
<Fumi iconClass={FontAwesomeIcon} iconName={'money'}
label={I18n.t('AMOUNT')}
@ -478,7 +757,9 @@ class RetraitCarteVersCashAgent extends Component {
</Fumi>
</Animatable.View>
<Button style={styles.btnvalide}
<Button
style={styles.btnvalide}
isLoading={this.state.isLoging}
textStyle={styles.textbtnvalide}
onPress={() => { this.onSubmitSendWalletToCard() }}>
{I18n.t('SUBMIT_LABEL')}</Button>
@ -493,6 +774,10 @@ class RetraitCarteVersCashAgent extends Component {
const maptStateToProps = state => ({
loadingActiveCountryList: state.activeCountryListReducer.loading,
resultActiveCountryList: state.activeCountryListReducer.result,
errorActiveCountryList: state.activeCountryListReducer.error,
loadingEnvoieWalletToCard: state.envoieUserWalletToCardReducer.loading,
resultEnvoieWalletToCard: state.envoieUserWalletToCardReducer.result,
errorEnvoieWalletToCard: state.envoieUserWalletToCardReducer.error,
@ -507,6 +792,12 @@ const mapDispatchToProps = dispatch => bindActionCreators({
envoieUserWalletToCardAction,
envoieUserWalletToCardReset,
getOtherPayCountryNetworkAction,
getPayCountryNetworkReset,
getActiveCountryAction,
getActiveCountryReset,
getCommissionUserWalletToCardAction,
getCommissionUserWalletToCardReset

15
app/screens/wallet/agent/pays.js Normal file
View File

@ -0,0 +1,15 @@
export const paysAfriqueCentrale = [
{ label: 'Cameroun', value: 'Cameroun', iso2: 'CM' },
{ label: 'Canada', value: 'Canada', iso2: 'CA' },
{ label: 'Cote ivoir', value: 'Cote ivoir', iso2: 'CI' },
{ label: 'gabon', value: 'gabon', iso2: 'GB' },
{ label: 'Benin', value: 'Benin', iso2: 'BI' },
{ label: 'Senegal', value: 'Senegal', iso2: 'SG' },
{ label: 'République centrafricaine', value: 'République centrafricaine', iso2: "RC" },
{ label: 'République démocratique du Congo', value: 'République démocratique du Congo', iso2: "RDC" },
{ label: 'France', value: 'France', iso2: 'FR' },
{ label: 'Allemagne', value: 'Allemagne', iso2: 'AL' },
{ label: 'Belgique', value: 'Belgique', iso2: 'BG' },
];

2
app/screens/wallet/user/EnvoieWalletToWalletUser.js
View File

@ -101,7 +101,7 @@ class EnvoieWalletToWalletUser extends Component {
}
componentDidMount() {
readUser().then((user) => {
if (user) {
if (user !== undefined) {

859
app/screens/wallet/user/RetraitCarteVersAutreWalletUser.js Normal file
View File

@ -0,0 +1,859 @@
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, FlatList } from 'react-native';
import * as Animatable from 'react-native-animatable';
import Dialog from "react-native-dialog";
import I18n from 'react-native-i18n';
import {Dropdown} from 'react-native-material-dropdown-v2';
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 {
getActiveCountryAction,
getActiveCountryReset,
getOtherPayCountryNetworkAction,
getPayCountryNetworkReset,
} from '../../../webservice/CountryApi';
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 RetraitCarteVersAutreWalletUser extends Component {
static navigatorStyle = {
navBarBackgroundColor: Color.primaryColor,
statusBarColor: Color.primaryDarkColor,
navBarTextColor: '#FFFFFF',
navBarButtonColor: '#FFFFFF'
};
static navigationOptions = () => {
return {
drawerLabel: () => null,
headerTitle: I18n.t('WITHDRAWAL_CARD_TO_ORDER_CASH_AGENT'),
headerTintColor: 'white',
headerStyle: {
backgroundColor: Color.primaryColor,
marginTop: 0,
color: 'white'
},
headerTitleStyle: {
color: "white"
},
title: I18n.t('WITHDRAWAL_CARD_TO_ORDER_CASH_AGENT')
}
};
constructor(props) {
super(props);
this.state = {
countryCustomer: [],
paysDestination: [],
paysDestinationSelect: null,
hasLoadActivePayCountryNetworkList: false,
montant: null,
password: null,
montant: '',
numeroSerie: '',
numCarte: 0,
cvv: 0,
expiration_date: '',
creditCardInput: {},
displayCardError: false,
loading: false,
user: null,
displayFirstStep: true,
displaySecondStep: false,
displayTercerStep: false,
triggerSubmitClick: false,
isSubmitClick: false,
isDataSubmit: false,
isModalConfirmVisible: false,
hasLoadActiveCountryList: false,
triggerNextClick: false,
modalVisible: false,
wallet: store.getState().walletDetailReducer.result.response
};
this.props.getActiveCountryReset();
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
});
}
}
}
renderGetActionCountryList = () => {
const {resultActiveCountryList, errorActiveCountryList} = this.props;
if (resultActiveCountryList !== null) {
// if (typeof resultActiveCountryList !== "undefined" ) {
this.setState({
hasLoadActiveCountryList: false,
countryCustomer: resultActiveCountryList.response,
paysDestinationSelect: resultActiveCountryList.response[0].name,
});
if (this.state.hasLoadActivePayCountryNetworkList)
this.props.getOtherPayCountryNetworkAction({
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}
)
}
}
}
isCreditCardValid = () => {
const { creditCardInput } = this.state;
const errorMessage = [];
if (typeof creditCardInput.status !== 'undefined') {
if (creditCardInput.status.cvc === 'incomplete')
errorMessage.push(I18n.t('CVC_CARD_ERROR') || secureTextEntry=='true');
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_CARD_ORDER_WALLET') })
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: 13,
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,
customer_email: this.state.emailCustomer,
customer_name: this.state.nameCustomer,
customer_surname: this.state.surnameCustomer,
customer_address: this.state.adressCustomer,
customer_city: this.state.cityCustomer,
customer_country: (this.state.countryCustomer.filter(element => element.name === this.state.paysDestinationSelect))[0].code_country,
customer_state: this.state.stateCustomer,
customer_zip_code: this.state.codeZipCustomer,
});
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
};
}
onSubmitNextStep = () => {
const {surnameCustomer, emailCustomer, adressCustomer, cityCustomer,} = this.state;
if (this.ckeckIfFieldIsOK(surnameCustomer))
this.surnameCustomerAnim.shake(800);
// else if (this.ckeckIfFieldIsOK( nameCustomer))
// this. nameCustomerAnim.shake(800);
else if (this.ckeckIfFieldIsOK(emailCustomer))
this.emailCustomerAnim.shake(800);
else if (this.ckeckIfFieldIsOK(adressCustomer))
this.adressCustomerAnim.shake(800);
else if (this.ckeckIfFieldIsOK(cityCustomer))
this.cityCustomerAnim.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);
});
}
}
onSubmitSendWalletToCard = () => {
const { countryCustomer, stateCustomer, codeZipCustomer, creditCardInput, montant, password } = this.state;
// if (this.ckeckIfFieldIsOK(countryCustomer))
// this.countryCustomerAnim.shake(800);
// else
if (this.ckeckIfFieldIsOK(stateCustomer))
this.stateCustomerAnim.shake(800);
// else if (this.ckeckIfFieldIsOK(codeZipCustomer))
// this.codeZipCustomerAnim.shake(800);
else 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: 13,
id_wallet_agent: this.state.wallet.id,
montant: this.state.montant,
});
}
this.setState({
triggerSubmitClick: true,
isDataSubmit: false
// triggerSubmitClick: true,
// hasLoadActiveCountryList: true,
// hasLoadActivePayCountryNetworkList: true,
// numCarte: parseInt((creditCardInput.values.number).replace(/ /g, ' ')),
// cvv: creditCardInput.values.cvc,
// expiration_date: creditCardInput.values.expiry,
// final_country: (this.state.paysDestination.filter(element => element.name === this.state.paysDestinationSelect))[0].id,
});
}
renderLoader = () => {
return (
<ProgressDialog
visible={this.state.modalVisible || 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.props.loadingActiveCountryList || this.props.loadingCountryByDialCode && this.renderLoader()}
{this.state.hasLoadActiveCountryList && this.renderGetActionCountryList()}
{this.state.isDataSubmit && this.renderEnvoieWalletToWalletResponse()}
{this.state.triggerSubmitClick && this.renderDialogGetCommissionResponse()}
{
(resultEnvoieWalletToCardGetCommission !== null) &&
(typeof resultEnvoieWalletToCardGetCommission.response !== 'undefined') &&
this.modalConfirmTransaction(resultEnvoieWalletToCardGetCommission)
}
<ScrollView style={styles.container}>
{this.state.displayFirstStep &&
<>
<Text style={styles.subbigtitle}>{I18n.t('WITHDRAWAL_CARD_TO_ORDER_CASH_AGENT')}</Text>
<Animatable.View ref={(comp) => {
this.surnameCustomerAnim = comp
}}>
<Fumi iconClass={FontAwesomeIcon} iconName={'users'}
label={`${I18n.t('SURNAME')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.surnameCustomer}
onChangeText={(surnameCustomer) => {
this.setState({surnameCustomer})
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => {
this.nameCustomerAnim= comp
}}>
<Fumi iconClass={FontAwesomeIcon} iconName={'user-circle-o'}
label={`${I18n.t('PRENOM_CLIENT')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.nameCustomer}
onChangeText={(nameCustomer) => {
this.setState({nameCustomer})
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => {
this.emailCustomerAnim = comp
}}>
<Fumi iconClass={FontAwesomeIcon} iconName='envelope'
label={I18n.t('EMAIL')}
iconColor={'#f95a25'}
keyboardType='email-address'
iconSize={20}
value={this.state.emailCustomer}
onChangeText={(emailCustomer) => {
this.setState({emailCustomer})
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => {
this.adressCustomerAnim = comp
}}>
<Fumi iconClass={FontAwesomeIcon} iconName={'map-marker'}
label={`${I18n.t('ADDRESS')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.adressCustomer}
onChangeText={(adressCustomer) => {
this.setState({adressCustomer})
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => {
this.cityCustomerAnim = comp
}}>
<Fumi iconClass={FontAwesomeIcon} iconName={'pie-chart'}
label={`${I18n.t('CITY')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.cityCustomer}
onChangeText={(cityCustomer) => {
this.setState({cityCustomer})
}}
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.paysDestinationAnim = comp
}}
style={{
width: responsiveWidth(90),
height: 60,
marginTop: 20,
alignSelf: 'center',
borderRadius: 10,
paddingLeft: 20,
paddingRight: 20,
backgroundColor: 'white'
}}>
<Dropdown
label={I18n.t('CARD_COUNTRY')}
data={this.state.countryCustomer}
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,
// isDataSubmit: false
// }, () => {
// 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.stateCustomerAnim = comp
}}>
<Fumi iconClass={FontAwesomeIcon} iconName={'university'}
label={`${I18n.t('ETAT_STATE')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.stateCustomer}
onChangeText={(stateCustomer) => {
this.setState({stateCustomer})
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<Animatable.View ref={(comp) => {
this.codeZipCustomerAnim = comp
}}>
<Fumi iconClass={FontAwesomeIcon} iconName={'file-zip-o'}
label={`${I18n.t('ZIP_CODE')}`}
iconColor={'#f95a25'}
iconSize={20}
value={this.state.codeZipCustomer}
onChangeText={(codeZipCustomer) => {
this.setState({codeZipCustomer})
}}
style={styles.input}
>
</Fumi>
</Animatable.View>
<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>
</Animatable.View>
{/* <Button style={styles.btnvalide}
textStyle={styles.textbtnvalide}
isLoading={this.state.isLoging}
onPress={() => {
if (!this.state.creditCardInput.valid)
this.codeCVVAnim.shake(800);
else {
this.setState({
displayFirstStep: !this.state.displayFirstStep,
displaySecondStep: !this.state.displaySecondStep,
displayTercerStep: !this.state.displayTercerStep,
}, () => {
this.props.getActiveCountryAction();
console.log("ENVOIE WALLET PROPS", this.props);
});
}
}}>
{I18n.t('NEXT')}</Button> */}
<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}
isLoading={this.state.isLoging}
textStyle={styles.textbtnvalide}
onPress={() => { this.onSubmitSendWalletToCard() }}>
{I18n.t('SUBMIT_LABEL')}</Button>
</>
}
</ScrollView>
</>
)
}
}
const maptStateToProps = state => ({
loadingActiveCountryList: state.activeCountryListReducer.loading,
resultActiveCountryList: state.activeCountryListReducer.result,
errorActiveCountryList: state.activeCountryListReducer.error,
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,
getOtherPayCountryNetworkAction,
getPayCountryNetworkReset,
getActiveCountryAction,
getActiveCountryReset,
getCommissionUserWalletToCardAction,
getCommissionUserWalletToCardReset
}, dispatch);
export default connect(maptStateToProps, mapDispatchToProps)(RetraitCarteVersAutreWalletUser);
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,
}
});

33
app/screens/wallet/user/modal.js Normal file
View File

@ -0,0 +1,33 @@
import React from "react"
import { View, Text, Alert, StyleSheet } from "react-native"
export default function Modal() {
return(
<View>
<Text>modal</Text>
{/* {
Alert.alert(
I18n.t("CONNEXION_CHOICE"),
I18n.t("CONNEXION_CHOICE_DESCRIPTION"),
[
{
}, {
text: I18n.t('NO'), onPress: () => {
this.connectClicked(false)
}
},
],
)
} */}
</View>
)
}
const styles = StyleSheet.create({
})

15
app/utils/UtilsFunction.js
View File

@ -409,7 +409,19 @@ export const optionRetraitUserScreen = {
screen: '',
icon: 'credit-card',
title: 'WITHDRAWAL_BANK_TO_WALLET',
}
},
// {
// screen: route.retraitCarteVersAutreWalletUser,
// icon: 'wallet',
// title: 'WITHDRAWAL_CARD_ORDER_WALLET',
// },
{
screen: route.modal,
icon: 'wallet',
title: 'WITHDRAWAL_CARD_ORDER_WALLET',
},
]
}
@ -440,6 +452,7 @@ export const optionDepotUserScreen = {
title: 'DEPOSIT_TO_BANK',
subScreenOption: optionWalletToBank
},
]
};

17
app/utils/i18n/fr.json
View File

@ -44,6 +44,7 @@
"DEPOSIT_SUCCESS": "Dépôt effectué avec succès",
"SUCCESS": "Succès",
"ETAT": "Etat",
"ETAT_STATE": "Etat ou Province",
"MY_ACCOUNT": "Mon compte",
"WALLET": "Wallet",
"DEPOSIT": "Dépôt",
@ -101,14 +102,16 @@
"TRANSFER_IN_ACCOUNT": "Transfert dans le compte",
"WITHDRAWAL_IN_CASH": "Retrait en cash",
"WITHDRAWAL_IN_CASH_DESCRIPTION": "Retrait d'argent en cash",
"WITHDRAWAL_WALLET_TO_CASH": "Wallet vers cash",
"": "carte vers autre wallet",
"WITHDRAWAL_WALLET_TO_CASH_DESCRIPTION": "Retirer de l'argent de votre Wallet vers cash",
"WITHDRAWAL_CARD_TO_WALLET": "Carte vers wallet",
"WITHDRAWAL_CARD_ORDER_WALLET": "Carte vers autre wallet",
"WITHDRAWAL_BANK_TO_WALLET": "Banque vers wallet",
"WITHDRAWAL_BANK_TO_CASH": "Banque vers cash",
"WITHDRAWAL_CARD_TO_WALLET_DESCRIPTION": "Retrait d'argent de votre carte vers wallet",
"WITHDRAWAL_CARD_TO_CASH": "Carte vers cash",
"WITHDRAWAL_CARD_TO_CASH_AGENT": "Retrait carte vers cash",
"WITHDRAWAL_CARD_TO_ORDER_CASH_AGENT": "Retrait carte vers autre vallet",
"WITHDRAWAL_CARD_TO_CASH_DESCRIPTION": "Retrait de l'argent de votre carte vers cash",
"WITHDRAWAL_CARD_TO_CASH_DESCRIPTION_AGENT": "Retrait de l'argent de carte vers cash",
"DEPOSIT_CASH_TO_WALLET": "Cash vers wallet iLinkWorld",
@ -763,5 +766,15 @@
"PAYMENTS": "Paiements",
"SEE_MORE": "Voir plus",
"MIANG_SLOGAN": "Transfert d'argent national",
"ENREGISTREMENT_UBA": "Enregistrement UBA"
"ENREGISTREMENT_UBA": "Enregistrement UBA",
"PROBLEM_OCCUR": "probleme d'Itineraire ",
"PROBLEM_OCCUR_DIRECTION": "dsl mais nous ne pouvons pas tracer l'Itineraire un probleme est survenue",
"ZIP_CODE": "Code ZIP",
"CUSTOMER_STATE": "Lieu d'habitation",
"CUSTOMER_COUNTRY": "Pays client",
"SELECT_COUNTRY": "Sélectionnez un pays",
"CITY": "Ville",
"SURNAME": "Noms de famille",
"CARD_COUNTRY": "Pays de la carte"
}