/** * Sample React Native App * https://github.com/facebook/react-native * * @format * @flow */ import React, {Component} from 'react'; import { Platform, StyleSheet, Text, View, ScrollView, Alert, FlatList, ProgressViewIOS, ProgressBarAndroid, PickerIOS, StatusBar } from 'react-native'; import ActionButton from 'react-native-action-button'; import MapView from 'react-native-maps'; import {responsiveHeight, responsiveWidth, responsiveFontSize} from 'react-native-responsive-dimensions'; import CardView from 'react-native-cardview'; import {Sae} from 'react-native-textinput-effects'; import FontAwesomeIcon from 'react-native-vector-icons/FontAwesome'; import Button from 'apsl-react-native-button'; import {primary, primaryDark, accent} from '../../utils/theme.json'; import * as Animatable from 'react-native-animatable'; import {isNumber} from 'util'; import {readUser} from './../../webservice/AuthApi' import {sendDemande} from './../../webservice/HistoryRequestApi' import {sendDemandeSpecificque} from "../../webservice/HistoryRequestApi"; import {getAgentNetworksList} from "../../webservice/NetworkApi"; import {HelperText, TextInput} from 'react-native-paper' import I18n from "react-native-i18n" import {Dropdown} from "react-native-material-dropdown-v2" const route = require('../../route.json') import {Card, CardTitle, CardContent, CardAction, CardButton, CardImage, Title} from 'react-native-material-cards' import {bindActionCreators} from "redux"; import {getWalletDetailActivated, resetWalletListDetailReducer} from "../../webservice/WalletApi"; import { getHyperSuperTransactionHistoryAction, getHyperSuperTransactionHistoryReset, getWalletTransactionHistory, getWalletTransactionHistoryReset } from "../../webservice/WalletTransactionHistoryApi"; import {resetCommissionReducer, transferCommissionAction} from "../../webservice/WalletTransferCommission"; import {depositActionReset} from "../../webservice/DepositApi"; import {connect} from "react-redux"; import {fetchRequestCredit, fetchRequestCreditReset} from "../../redux/credit-management/credit.actions"; class HistoryRequester extends Component { static navigatorStyle = { navBarHidden: true, }; static navigationOptions = { drawerLabel: () => null, headerTitle: I18n.t('ASK_CREDIT'), title: I18n.t('ASK_CREDIT') }; constructor(props) { super(props); this.state = this.initState(); this.updateState() } handleViewRef = ref => this.numberView = ref; handleMontantRef = ref => this.montantView = ref; initState() { return { phone: null, montant: undefined, isSending: false, isDisabled: true, networks: [], user: null, visibleError: false, currentNetwork: {nt: 1}, errorAnimation: "", } } onUserCancel() { this.props.navigation.goBack() } onUserSend() { var validMontant = true if (!isNumber(this.state.montant) || this.state.montant > 1000000) { validMontant = false } this.setState({visibleError: !validMontant}) if (!validMontant) { this.montantView.shake(800) setTimeout(() => { this.setState({visibleError: false}) }, 3000) } else { this.setState({isSending: true}) let title = "" let message = "" this.props.fetchRequestCredit({ issuer_id: this.state.user.agentId, amount: this.state.montant }) /* sendDemandeSpecificque(this.state.montant, this.state.user.phoneTransaction, this.state.user.code_membre).then((data) => { if (data.success !== undefined) { if (data.success === 1) { title = I18n.t('DEMAND_SEND'), message = I18n.t('DEMAND_SEND_SUCCESFUL') } else { title = "Erreur survenu lors de l'envoie ", message = "Une erreur est survenu lors de l'envoie de la demande" } } else { title = "Erreur survenu lors de l'envoie ", message = "Une erreur est survenu lors de l'envoie de la demande" } Alert.alert(title, message, [{ text: 'Ok', onPress: () => { this.setState({montant: ""}) } }]) setTimeout(() => { this.setState({isSending: false}) }, 800) }).catch((error) => { title = "Erreur survenu lors de l'envoie ", message = "Une erreur est survenu lors de l'envoie de la demande" Alert.alert(title, message, [{text: 'Ok'}]) })*/ } } render() { const {user} = this.state return ( {user ? ((user.category === "geolocated") ? this.multiNetwork() : this.simpleAgent()) : } ) } simpleAgent() { let montant = 0 if (true) { return ( { this.refInp = ref }} mode={"outlined"} inputStyle={input.style} onChangeText={(text) => { try { let neb = parseInt(text) this.setState({montant: neb, isDisabled: isNaN(neb)}) } catch (e) { } }} value={this.state.montant} /> {I18n.t('INVALID_MONTANT')} { this.onUserCancel() }} title={I18n.t('CANCEL')} color="crimson" /> { this.onUserSend() }} title={I18n.t('SEND')} color="steelblue" /> ) } else return ( Demande de credit { this.refInp = ref }} onChangeText={(text) => { if (text.length > 0) { try { montant = parseFloat(text); this.setState({isDisabled: montant > 0, montant: montant}) } catch (e) { } } }} style={input.selfitem} labelStyle={input.label} autoCapitalize={'none'} autoCorrect={false} /> ) } multiNetwork() { if (true) { return ( { return (item) ? I18n.t("FOR_NUMB") + item.phone + " (" + item.name + ")" : I18n.t("SELECT_NETWORK") }} valueExtractor={(item, index) => { return item.phone + " (" + item.name + ")" }} onChangeText={(value, index, data) => { this.setState({currentNetwork: data[index]}) }} data={this.state.networks} /> { this.refInp = ref }} mode={"outlined"} inputStyle={input.style} onChangeText={(text) => { try { let neb = parseInt(text) this.setState({montant: neb, isDisabled: isNaN(neb)}) } catch (e) { } }} value={this.state.montant} /> {I18n.t('INVALID_MONTANT')} { this.onUserCancel() }} title={I18n.t('CANCEL')} color="crimson" /> { const {currentNetwork, montant} = this.state if (currentNetwork !== undefined && currentNetwork.nt === undefined) { this.onNetworkSend(currentNetwork.phone, currentNetwork.code_membre, montant) } }} title={I18n.t('SEND')} color="steelblue" /> ) } else return ( {I18n.t('ASK_CREDIT')} this.setState({currentNetwork: itemValue}) }> {this.state.networks.map((item, index) => { return () })} { this.refInp = ref }} inputStyle={input.style} keyboardType={"numeric"} onChangeText={(text) => { try { let neb = parseInt(text) this.setState({montant: neb, isDisabled: isNaN(neb)}) } catch (e) { } }} style={input.selfitem} labelStyle={input.label} autoCapitalize={'none'} autoCorrect={false} /> ) } renderSingleNetwork(item) { const itm = item.item console.log(item) let refInp = null, refBtn = null let montant = 0 return ( {I18n.t('ASK_CREDIT')} {I18n.t("FOR_NUMB")} {itm.phone} ({itm.name}) { refInp = ref this.setState({refIn: refInp}) }} inputStyle={input.style} value={this.state.montant} keyboardType={"numeric"} onChangeText={(text) => { if (text.length > 0) { try { montant = parseFloat(text); this.setStat({montant: montant}) if (refBtn) { refBtn.setState({isDisabled: montant > 0}) refBtn.isDisabled = montant > 0 } } catch (e) { } } }} style={input.selfitem} labelStyle={input.label} autoCapitalize={'none'} autoCorrect={false} /> ) } onNetworkSend(phone, code_membre, text) { var validMontant = true let montant = parseFloat(text) if (montant === null || !isNumber(montant) || montant > 1000000) { validMontant = false } this.setState({visibleError: !validMontant}) if (!validMontant) { this.montantView.shake(800) setTimeout(() => { this.setState({visibleError: false}) }, 3000) } else { this.props.fetchRequestCredit({ issuer_id: user.agentId, amount: montant }) /*sendDemandeSpecificque(montant, phone, code_membre).then((data) => { var title = "" var message = "" if (data.success !== undefined) { if (data.success === 1) { title = I18n.t("DEMAND_SEND") message = I18n.t('DEMAND_SEND_SUCCESFUL') } else { title = "Erreur survenu lors de l'envoie " message = "Une erreur est survenu lors de l'envoie de la demande" } } else { title = "Erreur survenu lors de l'envoie " message = "Une erreur est survenu lors de l'envoie de la demande" } Alert.alert(title, message, [{ text: "Ok", onPress: () => { this.setState({montant: ""}) } }]) })*/ } } onNetworkSend(phone, code_membre, text) { var validMontant = true let montant = parseFloat(text) if (montant === null || !isNumber(montant) || montant > 1000000) { validMontant = false } this.setState({visibleError: !validMontant}) if (!validMontant) { this.montantView.shake(800) setTimeout(() => { this.setState({visibleError: false}) }, 3000) } else { this.props.fetchRequestCredit({ issuer_id: user.agentId, amount: montant }) } } UNSAFE_componentWillReceiveProps(nextProps, nextContext) { console.log('UNSAFE_componentWillReceiveProps', nextProps.requestCredit) if(nextProps.requestCredit?.result) { Alert.alert( I18n.t("SUCCESS"), nextProps.requestCredit?.result?.response, [ { text: I18n.t("OK"), onPress: () => { this.props.fetchRequestCreditReset(); } } ], { cancelable: false } ); } if(nextProps.requestCredit?.error) { Alert.alert( I18n.t("ERROR_LABLE"), nextProps.requestCredit?.error?.error, [ { text: I18n.t("OK"), onPress: () => { this.props.fetchRequestCreditReset(); } } ], { cancelable: false } ); } } async updateState() { let user = await readUser(); if (user.category === "geolocated") { let networks = await getAgentNetworksList(user.agentId); console.log(networks) if (networks.success === 1) { let net = [this.state.currentNetwork] networks.networks.forEach((item) => { net.push(item) }) this.setState({networks: net}) } } this.setState({user: user}) } } const mapStateToProps = state => ({ requestCredit: state.requestCreditReducer }); const mapDispatchToProps = dispatch => bindActionCreators({ fetchRequestCredit, fetchRequestCreditReset }, dispatch); export default connect(mapStateToProps, mapDispatchToProps)(HistoryRequester); const input = StyleSheet.create({ selfitem: { width: responsiveWidth(70), alignSelf: 'center', marginBottom: 20, }, label: { color: primary }, style: { color: 'black' } }) const styles = StyleSheet.create({ title: { backgroundColor: primary, color: 'white', paddingLeft: 20, paddingTop: 10, fontWeight: 'bold', fontSize: responsiveFontSize(3), height: responsiveHeight(10), }, subtitle: { color: 'black', paddingLeft: 20, paddingTop: 10, marginBottom: responsiveHeight(3), fontWeight: 'bold', fontSize: responsiveFontSize(2), }, container: { flex: 1, backgroundColor: '#EEE', justifyContent: 'space-between', }, container2: { flex: 1, height: responsiveHeight(20), backgroundColor: '#EEE', }, btnContainer: { flexDirection: 'row', paddingRight: 5, paddingLeft: 5, paddingTop: 5, marginBottom: -2.5, }, button_1: { flex: 1, borderColor: 'transparent', }, button_2: { flex: 1, borderColor: 'transparent', backgroundColor: primary, borderRadius: 0, }, button_1_text: { color: primary, fontWeight: 'bold', }, button_2_text: { color: 'white', fontWeight: 'bold', }, cardInput: { marginLeft: 10, marginRight: 10, marginTop: responsiveHeight(5), width: responsiveWidth(98), alignSelf: 'center', justifyContent: 'space-between', height: responsiveHeight(40) }, cardInput2: { marginLeft: 10, marginRight: 10, marginTop: responsiveHeight(1), width: responsiveWidth(98), height: responsiveHeight(50), alignSelf: 'center', justifyContent: 'space-between', } });