import Button from 'apsl-react-native-button'; import isEqual from 'lodash/isEqual'; import isNil from 'lodash/isNil'; import React, { Component } from 'react'; import { Alert, ScrollView, StyleSheet, Text, View } from 'react-native'; import * as Animatable from 'react-native-animatable'; import I18n from 'react-native-i18n'; import { responsiveHeight, responsiveWidth } from 'react-native-responsive-dimensions'; import { ProgressDialog } from 'react-native-simple-dialogs'; import { Fumi } from 'react-native-textinput-effects'; import FontAwesomeIcon from 'react-native-vector-icons/FontAwesome'; import { connect } from 'react-redux'; import { bindActionCreators } from 'redux'; import { Color } from '../../config/Color'; import { FontWeight, Typography } from '../../config/typography'; import { store } from "../../redux/store"; import { IlinkEmitter } from '../../utils/events'; import { readUser } from '../../webservice/AuthApi'; import { createGroupAction, createGroupReset } from '../../webservice/NanoCreditApi'; import { isNormalInteger } from '../../utils/UtilsFunction'; import { casserEpargneUserAction, casserEpargneUserReset } from '../../webservice/user/NanoCreditApi'; let theme = require('../../utils/theme.json'); let route = require('../../route.json'); class CasserEpargneUser extends Component { constructor(props) { super(props); this.state = { password: null, idEpargne: null, codeGroup: null, loading: false, user: null, triggerSubmitClick: false, isSubmitClick: false, isDataSubmit: false, isModalConfirmVisible: false, isGroupToModify: false, }; } static navigatorStyle = { navBarBackgroundColor: Color.primaryColor, statusBarColor: Color.primaryDarkColor, navBarTextColor: '#FFFFFF', navBarButtonColor: '#FFFFFF' }; static navigationOptions = () => { return { drawerLabel: () => null, headerTitle: I18n.t('BREAK_EPARGNE'), headerTintColor: 'white', headerStyle: { backgroundColor: Color.primaryColor, marginTop: 0, color: 'white' }, headerTitleStyle: { color: "white" }, title: I18n.t('BREAK_EPARGNE') } }; componentDidMount() { readUser().then((user) => { if (user) { if (user !== undefined) { this.setState({ user }); } } }); } ckeckIfFieldIsOK(champ) { return (isNil(champ) || isEqual(champ.length, 0)); } renderBreakEpargneRespons = () => { const { result, error } = this.props; if (error !== null) { if (typeof error.data !== 'undefined') { Alert.alert( I18n.t("ERROR_LABLE"), error.data.error, [ { text: I18n.t("OK"), onPress: () => { this.props.casserEpargneUserReset(); } } ], { cancelable: false } ) } } if (result !== null) { if (result.response !== null) { Alert.alert( I18n.t("BREAK_EPARGNE_DONE"), result.response, [ { text: I18n.t("OK"), onPress: () => { this.props.casserEpargneUserReset(); IlinkEmitter.emit("refreshWallet"); this.props.navigation.pop(); } } ], { cancelable: false } ) } } } updateLangue() { this.props.navigation.setParams({ name: I18n.t('REFUND_NANO_CREDIT') }) this.forceUpdate() } ckeckIfFieldIsOK(champ) { return (isNil(champ) || isEqual(champ.length, 0)); } onCasserEpargne = () => { const { idEpargne, password } = this.state; if (this.ckeckIfFieldIsOK(idEpargne)) this.idEpargneAnim.shake(800); else if (this.ckeckIfFieldIsOK(password)) this.passwordAnim.shake(800); else { this.props.casserEpargneUserAction({ id_user: this.state.user.id, id_epargne: this.state.idEpargne, password: this.state.password }, 0); } this.setState({ isDataSubmit: true }); } renderLoader = () => { return ( ) } render() { return ( <> {(this.props.loading || this.props.loadingGetCommission) && this.renderLoader()} {this.state.isDataSubmit && this.renderBreakEpargneRespons()} {I18n.t('DEMAND_INFO')} { idEpargneAnim = comp }}> { this.setState({ idEpargne }) }} style={styles.input} > { this.passwordAnim = comp }}> { this.setState({ password }) }} style={styles.input} > ) } } const maptStateToProps = state => ({ loading: state.casserEpargneUserReducer.loading, result: state.casserEpargneUserReducer.result, error: state.casserEpargneUserReducer.error, }); const mapDispatchToProps = dispatch => bindActionCreators({ casserEpargneUserAction, casserEpargneUserReset, }, dispatch); export default connect(maptStateToProps, mapDispatchToProps)(CasserEpargneUser); 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, } });