import React, {Component} from 'react' import {ActivityIndicator, Alert, Platform, ProgressBarAndroid, ScrollView, StyleSheet, Text, View} from 'react-native' import Button from 'apsl-react-native-button' import {responsiveHeight, responsiveWidth} from 'react-native-responsive-dimensions' import Icon from 'react-native-vector-icons/MaterialCommunityIcons'; import {readUser} from "../../../webservice/AuthApi"; import I18n from "react-native-i18n"; import {creditDemandResetReducer, treatCreditDemand} from '../../../webservice/CreditTreatDemandApi'; import {creditCancelResetReducer, treatCancelDemand} from '../../../webservice/CreditCancelDemandeApi'; import {connect} from 'react-redux'; import {bindActionCreators} from 'redux'; import Toast from 'react-native-root-toast'; import {Color} from '../../../config/Color' import isNil from 'lodash/isNil'; import isEqual from 'lodash/isEqual'; import {getNanoCreditUniqueDemandsAction, getNanoCreditUniqueDemandsReset} from '../../../webservice/user/NanoCreditApi' import {cancelDemandGroupAction, treatDemandGroupAction, treatDemandGroupReset} from '../../../webservice/NanoCreditApi' import * as Animatable from "react-native-animatable"; import {Dropdown} from "react-native-material-dropdown-v2"; import {Fumi} from "react-native-textinput-effects"; import FontAwesomeIcon from "react-native-vector-icons/FontAwesome"; import { getOrdreRecetteDetailAction, getOrdreRecetteReset, modifyAvisImpositionReset, modifyOrdreRecetteAction, saveOrdreRecetteAction } from "../../../webservice/regisseur/WalletRegisseurApi"; import {store} from "../../../redux/store"; import axios from "axios"; import {getOneTaxNoticeUrl} from "../../../webservice/IlinkConstants"; import {displayToast} from "../../../utils/UtilsFunction"; let typesta = 0 let moment = require('moment-timezone') var colorback = 'white' let theme = require('../../../utils/theme.json'); const route = require("../../../route.json"); class OrdonnanceDetail extends Component { static navigatorStyle = { navBarBackgroundColor: theme.accentLight, statusBarColor: theme.accent, navBarTextColor: '#FFFFFF', navBarButtonColor: '#FFFFFF', }; static navigationOptions = ({navigation}) => { return { drawerLabel: () => null, title: navigation.getParam("isModify", false) ? I18n.t('ORDRE_RECETTE') + ' N°' + navigation.getParam("item", null).id_revenue_order : I18n.t('AVIS_IMPOSITION') + ' N°' + navigation.getParam("item", null).id_tax_notice, headerTintColor: 'white', headerStyle: { backgroundColor: Color.primaryColor, marginTop: -20, color: 'white' }, headerTitleStyle: { color: "white" }, } }; constructor(props) { super(props); this.state = { displayAmountModifyDialog: false, /* statut: sta, */ user: null, networks: [], loadingTreat: false, loadingCancel: false, triggerTreatmentClick: false, triggerCancelClick: false, color: colorback, montant: null, royalties_fees: null, isBtnModifyAmountEnabled: false, id: this.props.navigation.getParam("id", null), item: this.props.navigation.getParam("item", null), password: null, isModify: this.props.navigation.getParam("isModify", false), codeAgent: this.props.navigation.getParam("codeAgent", null), assign_network: false, ordreRecetteId: this.props.navigation.getParam("isModify", false) ? this.props.navigation.getParam("item", null).id_revenue_order : null, number_of_days: this.props.navigation.getParam("isModify", false) ? this.props.navigation.getParam("item", null).number_of_days !== null ? '' + this.props.navigation.getParam("item", null).number_of_days : '' : 0, penality_fees: null, tax_notice_amount: this.props.navigation.getParam("item", null).tax_notice_amount }; console.log("STATE", this.state); this.currentLocale = I18n.locale.includes("fr") ? "fr" : "en-gb"; this.props.modifyAvisImpositionReset(); moment.locale(this.currentLocale); } componentDidMount() { readUser().then((user) => { if (user) { if (user !== undefined) { this.setState({user}); } } }); } displayToast = (message) => { Toast.show(message, { duration: Toast.durations.LONG, position: Toast.positions.BOTTOM, backgroundColor: Color.primaryColor, shadow: true, animation: true, hideOnPress: true, delay: 0, onShow: () => { // calls on toast\`s appear animation start }, onShown: () => { // calls on toast\`s appear animation end. }, onHide: () => { // calls on toast\`s hide animation start. }, onHidden: () => { // calls on toast\`s hide animation end. } }); } ckeckIfFieldIsOK(champ) { return (isNil(champ) || isEqual(champ.length, 0)); } refreshScreen = (id) => { const auth = store.getState().authKeyReducer; const authKey = auth !== null ? `${auth.authKey.token_type} ${auth.authKey.access_token}` : ''; console.log(`URL: ${getOneTaxNoticeUrl}/${id}`); axios({ url: `${getOneTaxNoticeUrl}/${id}`, method: 'GET', headers: { 'Authorization': authKey, 'X-Localization': I18n.currentLocale() } }) .then(response => { console.log("RESPONSE", response); if (!this.state.isModify) { if (response.data.response.penalties.length === 0 && response.data.response.royalties_fees.length === 0) this.props.navigation.goBack(); else { this.setState({ item: response.data.response, tax_notice_amount: response.data.response.tax_notice_amount, royalties_fees: null, penality_fees: null }); } } else { this.setState({ item: response.data.response, tax_notice_amount: response.data.response.tax_notice_amount, royalties_fees: null, penality_fees: null }); } }) .catch(error => { console.log("ERROR", error); let message = ""; if (error.response) message = error.response else if (error.request) message = error.request else message = error.request; console.log("Message d'erreur", message); }); } renderModifyResponse = () => { const {errorModifyAvis, resultModifyAvis, resultCancelDemand, errorCancelDemand} = this.props; if (errorModifyAvis !== null) { if (typeof errorModifyAvis.data !== 'undefined') { Alert.alert( I18n.t("ERROR_TREATMENT_REQUEST"), errorModifyAvis.data.error, [ { text: I18n.t("OK"), onPress: () => { this.props.modifyAvisImpositionReset(); } } ], {cancelable: false} ); } } if (resultModifyAvis !== null) { console.log("resultModifyAvis", resultModifyAvis); if (resultModifyAvis.status === 200) { if (this.state.isModify) { Alert.alert( I18n.t("SUCCESS"), resultModifyAvis.response, [ { text: I18n.t("OK"), onPress: () => { this.props.navigation.pop(2); this.props.modifyAvisImpositionReset(); this.props.getOrdreRecetteDetailAction(this.state.codeAgent); this.refreshScreen(this.state.item.id); } } ], {cancelable: false} ); } else { Alert.alert( I18n.t("SUCCESS"), resultModifyAvis.response, [ { text: I18n.t("OK"), onPress: () => { this.props.navigation.pop(2); this.props.modifyAvisImpositionReset(); this.refreshScreen(this.state.item.id); this.props.getOrdreRecetteReset(); } } ], {cancelable: false} ); } } } } renderLabelState = (state) => { if (state === 0) return I18n.t('NO_TREAT') else if (state === 1) return I18n.t('TREAT') else return I18n.t('REFUSED') } renderLoader = () => { return ( {Platform.OS === 'android' ? ( <> {I18n.t('LOADING_DOTS')} ) : <> {I18n.t('LOADING_DOTS')} } ) } renderDetail = () => { const {resultGetUniqueDemand} = this.props; const {item} = this.state; let created_at = moment.tz(item.created_at, moment.tz.guess()).format(); let updated_at = moment.tz(item.updated_at, moment.tz.guess()).format(); created_at = moment(created_at); updated_at = moment(updated_at); let taxe_name = {name: ""}; if (this.state.isModify) taxe_name = {name: this.state.item.tax_name}; console.log("tax_name", taxe_name) return ( {I18n.t('AGENT_INFORMATION')} {`${item.lastname} | ${item.email}`} {`${item.email} | ${item.phone}`} {`${item.adresse}`} {I18n.t('TAXE_INFORMATION')} { !isNil(this.state.tax_notice_amount) && {`${this.state.tax_notice_amount}`} } { this.state.isModify && <> {`${this.state.item.amount} (${I18n.t('AMOUNT_ORDRE_RECETTE')})`} {`${this.state.item.penalties_amount} (${I18n.t('PENALITE_INCLUSE')})`} } {`${I18n.t('CREATION_DATE')}: ${created_at.format(" Do MMMM YYYY à HH:mm")}`} {`${I18n.t('EMISSION_DATE')}: ${issue_date.format(" Do MMMM YYYY à HH:mm")}`} {`${I18n.t('UPDATE_DATE')}: ${updated_at.format(" Do MMMM YYYY à HH:mm")}`} { this.royalties_fees_anim = comp }} style={{ width: responsiveWidth(100), height: 60, marginTop: 20, alignSelf: 'center', borderRadius: 10, paddingLeft: 20, paddingRight: 20, backgroundColor: 'white' }}> { this.setState({royalties_fees: value, penality_fees: null}, () => { console.log("royalties_fees", this.state.royalties_fees) }); }} valueExtractor={(value) => { return value }} labelExtractor={(value) => { return value.name + ' - ' + value.amount }} /> {this.state.royalties_fees !== null && {`${I18n.t('AMOUNT')}: ${this.state.royalties_fees.amount}`} {`${I18n.t('PENALITE_INCLUSE')}: ${this.state.royalties_fees.penalties_amount}`} } {/* { !this.state.isModify && { this.penalities_anim = comp }} style={{ width: responsiveWidth(100), height: 60, marginTop: 20, alignSelf: 'center', borderRadius: 10, paddingLeft: 20, paddingRight: 20, backgroundColor: 'white' }}> { fetchRecalculatePenality(value.id).then((response) => { let penalities = item.penalties; penalities = penalities.map(penality => { if (penality.id === value.id) return response.data.response; else return penality; }); this.setState({ tax_notice_amount: response.data.response.tax_notice_amount, penality_fees: response.data.response, royalties_fees: null }, () => { console.log("ITEM", this.state.item); console.log("PENALTIES", this.state.penality_fees); }); }).catch((error) => { }); }} valueExtractor={(value) => { return value }} labelExtractor={(value) => { return this.state.penality_fees !== null ? value.id === this.state.penality_fees.id ? this.state.penality_fees.name + ' - ' + this.state.penality_fees.total_amount : value.total_amount + ' - ' + value.name : value.total_amount + ' - ' + value.name; }} /> }*/} { this.state.royalties_fees !== null ? ( this.state.royalties_fees.billing_period === 'jour' && ( { this.ordreRecetteAnim = comp }}> { this.setState({number_of_days}) }} style={styles.input} > ) ) : null } { this.state.penality_fees !== null ? ( this.state.penality_fees.billing_period === 'jour' && ( { this.ordreRecetteAnim = comp }}> { this.setState({number_of_days}) }} style={styles.input} > ) ) : null } { this.state.isModify ? this.state.item.tax_billing_period === 'jour' && { this.ordreRecetteAnim = comp }}> { this.setState({number_of_days}) }} style={styles.input} > : null } { this.ordreRecetteAnim = comp }}> { this.setState({ordreRecetteId}) }} style={styles.input} > { this.passwordAnim = comp }}> { this.setState({password}) }} style={styles.input} > ); } onSubmitModificationAvisImposition = () => { const {password, item, taxes, assign_network, ordreRecetteId, number_of_days} = this.state; if (this.ckeckIfFieldIsOK(this.state.royalties_fees) && this.ckeckIfFieldIsOK(this.state.penality_fees) && !this.state.isModify) { this.royalties_fees_anim.shake(200); } else if (this.ckeckIfFieldIsOK(ordreRecetteId)) { this.ordreRecetteAnim.shake(200); } else if (this.ckeckIfFieldIsOK(ordreRecetteId)) { this.ordreRecetteAnim.shake(200); } else if (this.ckeckIfFieldIsOK(password)) { this.passwordAnim.shake(200); } else if (number_of_days <= 0 && number_of_days > 366) { displayToast(I18n.t('NUMBER_OF_DAYS_INCORRECT')); } else { let dataToSubmit = {}; if (this.state.isModify) { dataToSubmit = { id_super: parseInt(this.state.user.agentId), id_revenue_order: ordreRecetteId, password: password, id_tax_notice: parseInt(item.id), } if (this.state.item.tax_billing_period === 'jour') dataToSubmit['number_of_days'] = number_of_days; this.props.modifyOrdreRecetteAction(item.id, dataToSubmit); } else { if (this.state.penality_fees === null) { dataToSubmit = { id_super: parseInt(this.state.user.agentId), id_revenue_order: ordreRecetteId, password: password, id_tax_notice: parseInt(item.id), id_royalty_fee: this.state.royalties_fees.id, } if (this.state.royalties_fees.billing_period === 'jour') dataToSubmit['number_of_days'] = number_of_days; } else { dataToSubmit = { id_super: parseInt(this.state.user.agentId), id_revenue_order: ordreRecetteId, password: password, id_tax_notice: parseInt(item.id), id_tax_penalty: this.state.penality_fees.id } if (this.state.penality_fees.billing_period === 'jour') dataToSubmit['number_of_days'] = number_of_days; } this.props.saveOrdreRecetteAction(dataToSubmit); } } } render() { console.log("PENALITIES", this.state.penality_fees); return ( <> {this.renderModifyResponse()} { this.renderDetail() } ); } } const mapStateToProps = state => ({ loadingGetUniqueDemand: state.getUniqueDemandsGroupReducer.loading, resultGetUniqueDemand: state.getUniqueDemandsGroupReducer.result, errorGetUniqueDemand: state.getUniqueDemandsGroupReducer.error, loadingModifyAvis: state.modifyAvisImpositionReducer.loading, resultModifyAvis: state.modifyAvisImpositionReducer.result, errorModifyAvis: state.modifyAvisImpositionReducer.error, }); const mapDispatchToProps = dispatch => bindActionCreators({ getNanoCreditUniqueDemandsAction: getNanoCreditUniqueDemandsAction, getNanoCreditUniqueDemandsReset: getNanoCreditUniqueDemandsReset, treatDemandGroupAction: treatDemandGroupAction, cancelDemandGroupAction: cancelDemandGroupAction, treatDemandGroupReset: treatDemandGroupReset, treatCreditDemand: treatCreditDemand, creditDemandResetReducer: creditDemandResetReducer, treatCancelDemand: treatCancelDemand, creditCancelResetReducer: creditCancelResetReducer, saveOrdreRecetteAction, modifyAvisImpositionReset, getOrdreRecetteDetailAction, getOrdreRecetteReset, modifyOrdreRecetteAction }, dispatch); export default connect(mapStateToProps, mapDispatchToProps)(OrdonnanceDetail); const styles = StyleSheet.create({ container: { flex: 1, }, btnstyle: {}, inputAmountText: { ...Platform.select({ android: { borderBottomColor: Color.borderColor, borderBottomWidth: 0.5, } }) }, simpleuser: { marginLeft: responsiveWidth(2), fontSize: 16, color: '#3E3E3E' }, textbtnstyle: { color: "white", fontWeight: "bold", fontSize: 18 }, input: { height: 60, marginTop: responsiveHeight(2), marginLeft: responsiveWidth(5), marginRight: responsiveWidth(5), borderRadius: 5, borderWidth: 1 }, cardcontainer1: { justifyContent: 'space-evenly', flex: 2, marginRight: 3, marginLeft: 3, }, cardcontainer: { margin: 3, marginTop: 25 }, checkboxContainer: { flexDirection: "row", marginBottom: 20, }, checkbox: { alignSelf: "center", color: "white" }, })