Check serial number wallet depot

android/app/src/main/res/raw/utils_i18n_en.json

@@ -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",

android/app/src/main/res/raw/utils_i18n_fr.json

@@ -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 ",

screens/wallet/WalletDepot.js

@@ -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();
+                         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
+                                   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,12 +284,21 @@ class WalletDepot extends Component {
      onSubmitDeposit = () => {
           const { creditCardInput } = this.state;
 
+          if (isEqual(this.state.facade, 'back')) {
+               if (this.isMontantValid().isValid && this.isNumeroSerieValid().isValid && this.state.montant.length > 0) {
+
+                    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) {
 
-               console.log("Is Montant Valid", this.isMontantValid.isValid);
-               console.log("creditCardInput Valid", creditCardInput.valid);
-
-
                     this.setState({
                          numCarte: parseInt((creditCardInput.values.number).replace(/ /g, ' ')),
                          cvv: creditCardInput.values.cvc,
@@ -259,6 +315,8 @@ class WalletDepot extends Component {
                          displayCardError: true
                     })
                }
+          }
+
           this.setState({ isSubmitClick: true });
      }
 
@@ -355,7 +413,25 @@ class WalletDepot extends Component {
                     {this.state.isSubmitClick && this.renderDialogGetCommissionResponse()}
                     <ScrollView style={{ padding: 20 }}>
 
+                         <View style={{ marginTop: 20, marginRight: 20, marginLeft: 20, marginBottom: 10 }}>
 
+                              <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>
+
+                         {!this.state.isDisplaySerialTextInput &&
                               <View style={{ marginTop: 10 }}>
                                    <CreditCardInput
                                         validColor={this.state.creditCardInput.valid ? 'green' : ''}
@@ -373,15 +449,43 @@ class WalletDepot extends Component {
                                         ))
                                    }
                               </View>
+                         }
 
-                         <View style={{ margin: 20 }}>
+                         {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();

screens/wallet/WalletDetail.js

@@ -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,12 +822,15 @@ 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])
                                              :
+                                             isEqual(element, 'destinataire')
+                                                  ? cutString(item[element], 6)
+                                                  :
                                                   item[element]
                                         }
                                    </Text>
@@ -856,14 +860,30 @@ class WalletDetail extends Component {
      }
 
      renderHistoryTransactionList = () => {
+          const { resultTransaction, errorTransaction } = this.props;
+          if (errorTransaction !== null) {
+               if (typeof errorTransaction.data !== 'undefined') {
                     return (
-               <>
+                         <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
-                    <View style={[styles.checkDefault, { borderBottomColor: Color.borderColor }]}>
+                              <Text style={Typography.body1}>{errorTransaction.data.error}</Text>
-                         <Text
-                              style={[Typography.title3, Typography.semibold]}>
-                              {I18n.t('TRANSACTION_HISTORY')}
-                         </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) => (
@@ -877,12 +897,20 @@ class WalletDetail extends Component {
                                              }
                                         </View>
                                         {
-                         transactionHistoryUser().map((item, index) => (
+                                             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>
                               )
+                    )
+               }
+          }
      }
 
 
@@ -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()}
+                              </>
                     }
                </>
           )

utils/UtilsFunction.js

@@ -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',

utils/i18n/en.json

@@ -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",

utils/i18n/fr.json

@@ -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 ",