Check serial number wallet depot

This commit is contained in:
Brice Zele 2020-06-05 11:32:37 +01:00
parent e06d354f33
commit e0d0fdfcf9
8 changed files with 284 additions and 90 deletions

File diff suppressed because one or more lines are too long

View File

@ -44,6 +44,11 @@
"DEPOSIT": "Deposit",
"CONFIRM_DEPOSIT": "Confirm deposit",
"CONFIRM_WITHDRAWAL": "Confirm withdrawal",
"CHANGE_SOURCE_CARD": "Change source",
"CHOOSE_SOURCE": "Choose source",
"CREDIT_CARD": "Credit card",
"NUMERO_DE_SERIE": "Serial number",
"NUMERO_DE_SERIE_DESCRIPTION": "Please enter the serial number",
"CARD_NUMBER_LABEL": "Card number",
"CARD_EXPIRY_LABEL": "Expiry.",
"CARD_CVC_LABEL": "CVC/CCV",
@ -54,6 +59,8 @@
"EXPIRY_CARD_ERROR": "Date incorrect",
"CARD_NUMBER_ERROR": "Card number incorrect",
"AMOUNT_LABEL": "Amount",
"AMOUNT_LABEL_DESCRIPTION": "Please enter the amount",
"DESTINATAIRE": "Recipient",
"WITHDRAWAL": "Withdrawal",
"WITHDRAWAL_IN_CASH": "Withdrawal in cash",
"WITHDRAWAL_WALLET_TO_CASH": "Withdrawal wallet to cash",

View File

@ -35,6 +35,8 @@
"CREDIT_ASK_FROM_MEMBERS": "Demandes de crédit de vos membres",
"ASK_MEMBERS": "Demandes d'adhésion",
"AMOUNT_LABEL": "Montant",
"AMOUNT_LABEL_DESCRIPTION": "Veuillez saisir le montant",
"DESTINATAIRE": "Destinataire",
"ERROR_LABEL": "Erreur",
"DEPOSIT_SUCCESS": "Dépôt effectué avec succès",
"SUCCESS": "Succès",
@ -46,8 +48,14 @@
"ENTER_VALID_AMOUNT": "Entrer un montant valide",
"ENTER_AMOUNT_SUPERIOR_ZEROR": "Entrer un montant supérieur à zero",
"AMOUNT_SUPERIOR_TO_PRINCIPAL_ACCOUNT": "Montant supérieur à celui du compte principal de l'agent",
"ENTER_VALID_SERIAL_NUMBER": "Veuillez renseigner un numéro de série correct",
"MAKE_DEPOSIT": "Effectuer un dépôt",
"MAKE_WITHDRAWAL": "Effectuer un retrait",
"CHOOSE_SOURCE": "Choisir la source",
"CHANGE_SOURCE_CARD": "Changer la source",
"CREDIT_CARD": "Carte de crédit",
"NUMERO_DE_SERIE": "Numéro de série",
"NUMERO_DE_SERIE_DESCRIPTION": "Veuillez saisir le numéro de série",
"CARD_NUMBER_LABEL": "Numéro de la carte",
"CARD_EXPIRY_LABEL": "Date. exp.",
"CARD_CVC_LABEL": "CVC/CCV",
@ -100,7 +108,7 @@
"CREDIT_MANAGE": "Gestion de credit",
"GROUP_MANAGE": "Gestion du groupe",
"NOTIFICATIONS": "Notification",
"NO_NOTIFICATION": "Vous n'avez aucune notification",
"NO_NOTIFICATION": "Vous n'avez aucune Fnotification",
"CONFIGURATIONS": "Configuration",
"LOGOUT": "Déconnexion",
"HINT_HOME_SEARCH": " Chercher un lieu, quartier ou ville ",

View File

@ -11,12 +11,14 @@ import OutlineTextInput from '../../components/OutlineTextInput';
import { Color } from '../../config/Color';
import Tag from '../../components/Tag';
import { IlinkEmitter } from "../../utils/events";
import { CreditCardInput } from "react-native-credit-card-input";
import { CreditCardInput, LiteCreditCardInput } from "react-native-credit-card-input";
import { Typography, FontWeight } from '../../config/typography';
import { depositAction, depositActionReset } from '../../webservice/DepositApi';
import { getWalletCommissionAmount, walletCommissionAmountReset, resetWalletListDetailReducer } from '../../webservice/WalletApi';
import Dialog from "react-native-dialog";
import { ProgressDialog } from 'react-native-simple-dialogs'
import { ProgressDialog } from 'react-native-simple-dialogs';
import { Dropdown } from 'react-native-material-dropdown';
import isEqual from 'lodash/isEqual';
//import Dialog, { DialogContent, DialogTitle, DialogFooter, DialogButton } from 'react-native-popup-dialog';
let moment = require('moment-timezone');
import 'moment/locale/fr'
@ -30,6 +32,7 @@ import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import style from '../../components/TextInput/styles';
import { responsiveHeight, responsiveWidth, } from 'react-native-responsive-dimensions';
import { identityPieces, inputCardSource } from '../../utils/UtilsFunction';
const CONTAINER_WIDTH = Dimensions.get("window").width;
@ -55,6 +58,7 @@ class WalletDepot extends Component {
this.state = {
type: "credit",
montant: '',
numeroSerie: '',
numCarte: 0,
cvv: 0,
expiration_date: '',
@ -64,8 +68,10 @@ class WalletDepot extends Component {
isModalConfirmVisible: false,
isDataSubmit: false,
isSubmitClick: false,
displayCardError: false
displayCardError: false,
inputCardSource: inputCardSource(),
isDisplaySerialTextInput: true,
facade: "back"
};
this.props.walletCommissionAmountReset();
this.props.depositActionReset();
@ -109,7 +115,7 @@ class WalletDepot extends Component {
isMontantValid = () => {
const { montant } = this.state;
if ((parseInt(montant) == 0 || montant < 0))
if ((parseInt(isEqual(montant, 0)) || montant < 0))
return {
errorMessage: I18n.t('ENTER_AMOUNT_SUPERIOR_ZEROR'),
isValid: false
@ -135,6 +141,35 @@ class WalletDepot extends Component {
};
}
isNumeroSerieValid = () => {
const { numeroSerie } = this.state;
if ((parseInt(isEqual(numeroSerie, 0)) || numeroSerie < 0))
return {
errorMessage: I18n.t('ENTER_VALID_SERIAL_NUMBER'),
isValid: false
};
else if (!this.isNormalInteger(numeroSerie)) {
return {
errorMessage: I18n.t('ENTER_VALID_SERIAL_NUMBER'),
isValid: false
};
}
else if (numeroSerie.length > 11) {
return {
errorMessage: I18n.t('ENTER_VALID_SERIAL_NUMBER'),
isValid: false
};
}
else
return {
errorMessage: '',
isValid: true
};
}
isCreditCardValid = () => {
const { creditCardInput } = this.state;
const errorMessage = [];
@ -218,14 +253,26 @@ class WalletDepot extends Component {
isDataSubmit: true
});
this.props.walletCommissionAmountReset();
this.props.depositAction({
numCarte: this.state.creditCardInput.values.number.replace(/\s/g, ''),
cvv: this.state.creditCardInput.values.cvc,
expiration_date: this.state.creditCardInput.values.expiry,
type: "credit",
montant: this.state.montant,
id_wallet: this.state.id
});
if (isEqual(this.state.facade, 'front')) {
this.props.depositAction({
numCarte: this.state.creditCardInput.values.number.replace(/\s/g, ''),
cvv: this.state.creditCardInput.values.cvc,
expiration_date: this.state.creditCardInput.values.expiry,
type: "credit",
montant: this.state.montant,
id_wallet: this.state.id,
facade: this.state.facade
});
}
else {
this.props.depositAction({
numCarte: this.state.numeroSerie,
type: "credit",
montant: this.state.montant,
id_wallet: this.state.id,
facade: this.state.facade
});
}
}} />
</Dialog.Container>
@ -237,28 +284,39 @@ class WalletDepot extends Component {
onSubmitDeposit = () => {
const { creditCardInput } = this.state;
if (this.isMontantValid().isValid && creditCardInput.valid && this.state.montant.length > 0) {
if (isEqual(this.state.facade, 'back')) {
if (this.isMontantValid().isValid && this.isNumeroSerieValid().isValid && this.state.montant.length > 0) {
console.log("Is Montant Valid", this.isMontantValid.isValid);
console.log("creditCardInput Valid", creditCardInput.valid);
this.setState({
numCarte: this.state.numeroSerie
});
this.props.getWalletCommissionAmount({
type: "credit",
montant: this.state.montant,
id_wallet: this.state.id
});
}
} else {
if (this.isMontantValid().isValid && creditCardInput.valid && this.state.montant.length > 0) {
this.setState({
numCarte: parseInt((creditCardInput.values.number).replace(/ /g, ' ')),
cvv: creditCardInput.values.cvc,
expiration_date: creditCardInput.values.expiry,
});
this.props.getWalletCommissionAmount({
type: "credit",
montant: this.state.montant,
id_wallet: this.state.id
});
}
else if (!creditCardInput.valid) {
this.setState({
displayCardError: true
})
this.setState({
numCarte: parseInt((creditCardInput.values.number).replace(/ /g, ' ')),
cvv: creditCardInput.values.cvc,
expiration_date: creditCardInput.values.expiry,
});
this.props.getWalletCommissionAmount({
type: "credit",
montant: this.state.montant,
id_wallet: this.state.id
});
}
else if (!creditCardInput.valid) {
this.setState({
displayCardError: true
})
}
}
this.setState({ isSubmitClick: true });
}
@ -355,33 +413,79 @@ class WalletDepot extends Component {
{this.state.isSubmitClick && this.renderDialogGetCommissionResponse()}
<ScrollView style={{ padding: 20 }}>
<View style={{ marginTop: 20, marginRight: 20, marginLeft: 20, marginBottom: 10 }}>
<View style={{ marginTop: 10 }}>
<CreditCardInput
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>
))
}
<Text style={{ fontWeight: 'bold' }}>{I18n.t('CHANGE_SOURCE_CARD')}</Text>
<Dropdown
containerStyle={{ marginTop: -20 }}
value='serial-number'
data={this.state.inputCardSource}
onChangeText={(value, index, data) => {
this.setState({
isDisplaySerialTextInput: isEqual(value, 'serial-number'),
facade: isEqual(value, 'serial-number') ? 'back' : 'front'
})
}}
valueExtractor={(value) => value.value}
labelExtractor={(value) => value.name}
/>
</View>
<View style={{ margin: 20 }}>
{!this.state.isDisplaySerialTextInput &&
<View style={{ marginTop: 10 }}>
<CreditCardInput
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>
}
{this.state.isDisplaySerialTextInput &&
<View style={{ marginTop: 10, marginRight: 20, marginLeft: 20 }}>
<OutlineTextInput
borderBottomColor={!this.isNumeroSerieValid.isValid ? 'black' : 'red'}
value={this.state.numeroSerie}
keyboardType="numeric"
label={I18n.t('NUMERO_DE_SERIE')}
style={{ marginTop: 10 }}
placeholder={I18n.t('NUMERO_DE_SERIE_DESCRIPTION')}
onChangeText={(numeroSerie) => {
this.setState({ numeroSerie });
this.isNumeroSerieValid();
}}
/>
{
(!this.isNumeroSerieValid().isValid) &&
<Text style={{ color: 'red', marginTop: 2 }}>{this.isNumeroSerieValid().errorMessage}</Text>
}
{
(this.state.isSubmitClick && this.state.numeroSerie.length === 0) &&
<Text style={{ color: 'red', marginTop: 2 }}>{I18n.t('ENTER_VALID_SERIAL_NUMBER')}</Text>
}
<Text></Text>
</View>
}
<View style={{ marginTop: 10, marginRight: 20, marginLeft: 20, marginBottom: 10 }}>
<OutlineTextInput
borderBottomColor={!this.isMontantValid.isValid ? 'black' : 'red'}
value={this.state.montant}
keyboardType="numeric"
label={I18n.t('AMOUNT_LABEL')}
style={{ marginTop: 10 }}
placeholder={I18n.t('AMOUNT_LABEL')}
placeholder={I18n.t('AMOUNT_LABEL_DESCRIPTION')}
onChangeText={(montant) => {
this.setState({ montant });
this.isMontantValid();

View File

@ -18,6 +18,7 @@ import { getWalletTransactionHistory, getWalletTransactionHistoryReset } from '.
import { transferCommissionAction } from '../../webservice/WalletTransferCommission';
import { resetCommissionReducer } from '../../webservice/WalletTransferCommission';
import isEqual from 'lodash/isEqual';
import omit from 'lodash/omit';
import { baseUrl } from '../../webservice/IlinkConstants';
let moment = require('moment-timezone');
import 'moment/locale/fr'
@ -30,7 +31,7 @@ import 'moment/locale/en-nz'
import 'moment/locale/en-gb'
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import { thousandsSeparators, isEmptyObject, transactionHistoryUser, optionDepotUserScreen, optionDepotScreen, optionRetraitScreen, optionRetraitUserScreen, transactionHistoryLabel, isIlinkWorldWallet } from '../../utils/UtilsFunction';
import { thousandsSeparators, isEmptyObject, transactionHistoryUser, optionDepotUserScreen, optionDepotScreen, optionRetraitScreen, optionRetraitUserScreen, transactionHistoryLabel, isIlinkWorldWallet, cutString } from '../../utils/UtilsFunction';
import DeviceInfo from 'react-native-device-info';
let route = require('./../../route.json');
@ -821,13 +822,16 @@ class WalletDetail extends Component {
return (
<View style={[styles.contentService, { borderBottomColor: Color.primaryColor }]}>
{
Object.keys(item).map((element, i) => (
Object.keys(omit(item, ['id'])).map((element, i) => (
<View style={{ alignItems: 'center' }} key={i}>
<Text style={[Typography.overline, Color.grayColor], { marginTop: 4 }}>
{isEqual(element, 'date')
? this.getCreationDateToHumanFormat(item[element])
:
item[element]
isEqual(element, 'destinataire')
? cutString(item[element], 6)
:
item[element]
}
</Text>
</View>
@ -856,33 +860,57 @@ class WalletDetail extends Component {
}
renderHistoryTransactionList = () => {
return (
<>
<View style={[styles.checkDefault, { borderBottomColor: Color.borderColor }]}>
<Text
style={[Typography.title3, Typography.semibold]}>
{I18n.t('TRANSACTION_HISTORY')}
</Text>
</View>
<View style={[styles.contentService, { borderBottomColor: Color.primaryColor }]}>
{
transactionHistoryLabel().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 }}>
{item.label}
</Text>
const { resultTransaction, errorTransaction } = this.props;
if (errorTransaction !== null) {
if (typeof errorTransaction.data !== 'undefined') {
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
<Text style={Typography.body1}>{errorTransaction.data.error}</Text>
</View>
)
}
else {
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
<Text style={Typography.body1}>{errorTransaction}</Text>
</View>
)
}
}
if (resultTransaction !== null) {
if (resultTransaction.response !== null) {
return (
Array.isArray(resultTransaction.response) && (resultTransaction.response.length) > 0 ?
(
<>
<View style={[styles.contentService, { borderBottomColor: Color.primaryColor }]}>
{
transactionHistoryLabel().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 }}>
{item.label}
</Text>
</View>
))
}
</View>
{
resultTransaction.response.map((item, index) => (
this.renderHistoryTransactionItem(item, index)
))
}
</>
) :
(
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'flex-start' }}>
<Text style={Typography.body1}>{I18n.t('NO_WALLET_HISTORY')}</Text>
</View>
))
}
</View>
{
transactionHistoryUser().map((item, index) => (
this.renderHistoryTransactionItem(item, index)
))
}
</>
)
)
)
}
}
}
@ -909,7 +937,17 @@ class WalletDetail extends Component {
</>
}
</View>
) : this.renderHistoryTransactionList()
) :
<>
<View style={[styles.checkDefault, { borderBottomColor: Color.borderColor }]}>
<Text
style={[Typography.title3, Typography.semibold]}>
{I18n.t('TRANSACTION_HISTORY')}
</Text>
</View>
{this.renderHistoryTransactionList()}
</>
}
</>
)

View File

@ -9,6 +9,17 @@ export const thousandsSeparators = (num) => {
return num_parts.join(".");
}
export const cutString = (word, max) => {
return `${word.slice(0, max)}...`;
}
export const isNormalInteger = (str) => {
if (/[ `!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?~]/.test(str))
return false;
else
return true;
}
export const identityPieces = () => {
return [
{
@ -23,6 +34,17 @@ export const identityPieces = () => {
]
}
export const inputCardSource = () => [
{
name: I18n.t('NUMERO_DE_SERIE'),
value: 'serial-number'
},
{
name: I18n.t('CREDIT_CARD'),
value: 'credit-card'
},
]
export const transactionHistoryLabel = () => {
return [
{
@ -35,11 +57,11 @@ export const transactionHistoryLabel = () => {
},
{
icon: 'cash',
label: 'Montant'
label: I18n.t('AMOUNT_LABEL')
},
{
icon: 'account-arrow-right',
label: 'Destinataire'
label: I18n.t('DESTINATAIRE')
},
{
icon: 'calendar-clock',

View File

@ -44,6 +44,11 @@
"DEPOSIT": "Deposit",
"CONFIRM_DEPOSIT": "Confirm deposit",
"CONFIRM_WITHDRAWAL": "Confirm withdrawal",
"CHANGE_SOURCE_CARD": "Change source",
"CHOOSE_SOURCE": "Choose source",
"CREDIT_CARD": "Credit card",
"NUMERO_DE_SERIE": "Serial number",
"NUMERO_DE_SERIE_DESCRIPTION": "Please enter the serial number",
"CARD_NUMBER_LABEL": "Card number",
"CARD_EXPIRY_LABEL": "Expiry.",
"CARD_CVC_LABEL": "CVC/CCV",
@ -54,6 +59,8 @@
"EXPIRY_CARD_ERROR": "Date incorrect",
"CARD_NUMBER_ERROR": "Card number incorrect",
"AMOUNT_LABEL": "Amount",
"AMOUNT_LABEL_DESCRIPTION": "Please enter the amount",
"DESTINATAIRE": "Recipient",
"WITHDRAWAL": "Withdrawal",
"WITHDRAWAL_IN_CASH": "Withdrawal in cash",
"WITHDRAWAL_WALLET_TO_CASH": "Withdrawal wallet to cash",

View File

@ -35,6 +35,8 @@
"CREDIT_ASK_FROM_MEMBERS": "Demandes de crédit de vos membres",
"ASK_MEMBERS": "Demandes d'adhésion",
"AMOUNT_LABEL": "Montant",
"AMOUNT_LABEL_DESCRIPTION": "Veuillez saisir le montant",
"DESTINATAIRE": "Destinataire",
"ERROR_LABEL": "Erreur",
"DEPOSIT_SUCCESS": "Dépôt effectué avec succès",
"SUCCESS": "Succès",
@ -46,8 +48,14 @@
"ENTER_VALID_AMOUNT": "Entrer un montant valide",
"ENTER_AMOUNT_SUPERIOR_ZEROR": "Entrer un montant supérieur à zero",
"AMOUNT_SUPERIOR_TO_PRINCIPAL_ACCOUNT": "Montant supérieur à celui du compte principal de l'agent",
"ENTER_VALID_SERIAL_NUMBER": "Veuillez renseigner un numéro de série correct",
"MAKE_DEPOSIT": "Effectuer un dépôt",
"MAKE_WITHDRAWAL": "Effectuer un retrait",
"CHOOSE_SOURCE": "Choisir la source",
"CHANGE_SOURCE_CARD": "Changer la source",
"CREDIT_CARD": "Carte de crédit",
"NUMERO_DE_SERIE": "Numéro de série",
"NUMERO_DE_SERIE_DESCRIPTION": "Veuillez saisir le numéro de série",
"CARD_NUMBER_LABEL": "Numéro de la carte",
"CARD_EXPIRY_LABEL": "Date. exp.",
"CARD_CVC_LABEL": "CVC/CCV",
@ -100,7 +108,7 @@
"CREDIT_MANAGE": "Gestion de credit",
"GROUP_MANAGE": "Gestion du groupe",
"NOTIFICATIONS": "Notification",
"NO_NOTIFICATION": "Vous n'avez aucune notification",
"NO_NOTIFICATION": "Vous n'avez aucune Fnotification",
"CONFIGURATIONS": "Configuration",
"LOGOUT": "Déconnexion",
"HINT_HOME_SEARCH": " Chercher un lieu, quartier ou ville ",