3021 lines
140 KiB
JavaScript
3021 lines
140 KiB
JavaScript
import CheckBox from '@react-native-community/checkbox';
|
||
import Button from 'apsl-react-native-button';
|
||
import axios from "axios";
|
||
import _ from "lodash";
|
||
import isNil from 'lodash/isNil';
|
||
import DateTimePicker from "@react-native-community/datetimepicker"
|
||
import React, { Component } from 'react';
|
||
import {
|
||
Alert,
|
||
BackHandler,
|
||
FlatList,
|
||
Image,
|
||
PermissionsAndroid,
|
||
Platform,
|
||
ProgressBarAndroid,
|
||
ScrollView,
|
||
StyleSheet,
|
||
Text,
|
||
TouchableOpacity,
|
||
View
|
||
} from 'react-native';
|
||
import * as Animatable from 'react-native-animatable';
|
||
import Dialog from "react-native-dialog";
|
||
import Geolocation from 'react-native-geolocation-service';
|
||
import I18n from 'react-native-i18n';
|
||
import ImagePicker from 'react-native-image-crop-picker';
|
||
import MapView, { Marker } from 'react-native-maps';
|
||
import { MaterialDialog } from "react-native-material-dialog";
|
||
import { Dropdown } from 'react-native-material-dropdown-v2';
|
||
import OneSignal from "react-native-onesignal";
|
||
import { responsiveHeight, responsiveWidth } from 'react-native-responsive-dimensions';
|
||
import { ProgressDialog } from "react-native-simple-dialogs";
|
||
import { Fumi } from 'react-native-textinput-effects';
|
||
import { material } from 'react-native-typography';
|
||
import FontAwesomeIcon from 'react-native-vector-icons/FontAwesome';
|
||
import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
|
||
import { connect } from "react-redux";
|
||
import { bindActionCreators } from "redux";
|
||
import { Color } from "../../config/Color";
|
||
import { FontWeight, Typography } from "../../config/typography";
|
||
import { actifToSave, supervisorCode, uploadImage, usagerToSave } from "../../webservice/IlinkConstants";
|
||
import { getData, storeData } from "../../webservice/persistences/StorageService";
|
||
import { saveActifSocietyAction, saveActifSocietyReset } from "../../webservice/regisseur/WalletRegisseurApi";
|
||
import { createGeolocatedAccount } from './../../webservice/AuthApi';
|
||
import { getPositionInformation } from './../../webservice/MapService';
|
||
import FilteredList from './FilteredList ';
|
||
|
||
const GEOLOCATION_OPTIONS = {enableHighAccuracy: true, timeout: 20000, maximumAge: 1000, useSignificantChanges: true};
|
||
|
||
let theme = require('./../../utils/theme.json');
|
||
let route = require('./../../route.json');
|
||
|
||
class CreateUserStep extends Component {
|
||
|
||
static navigatorStyle = {
|
||
drawUnderNavBar: true,
|
||
navBarHidden: true,
|
||
drawUnderStatusBar: false,
|
||
statusBarHidden: true,
|
||
statusBarTextColorScheme: 'light',
|
||
};
|
||
|
||
static options(passProps) {
|
||
return {
|
||
topBar: {
|
||
visible: false,
|
||
enabled: false,
|
||
drawBehind: true,
|
||
|
||
},
|
||
statusBar: {
|
||
drawBehind: true,
|
||
enabled: false,
|
||
}
|
||
}
|
||
}
|
||
|
||
constructor(props) {
|
||
super(props);
|
||
const {navigation} = this.props;
|
||
this.type = navigation.getParam("type", 0);
|
||
this.user = navigation.getParam('user', null);
|
||
this.data = navigation.getParam('data', null);
|
||
this.result = navigation.getParam('result', null);
|
||
this.isActif = navigation.getParam('isActif', false);
|
||
this.isOffline = navigation.getParam('isOffline', false);
|
||
console.log("Is OFFLINE", this.isOffline);
|
||
this.mapRef = new Array();
|
||
console.log("DATA", this.data);
|
||
|
||
console.log("PROPS", this.props);
|
||
this.state = {
|
||
password: null,
|
||
isDataSubmit: false,
|
||
enterPhone: null,
|
||
nameanim: null,
|
||
networksinglePickerVisible: false,
|
||
surnameanim: null,
|
||
passwordanim: null,
|
||
confirmpassanim: null,
|
||
network: this.result.network,
|
||
isLoging: false,
|
||
countries: [],
|
||
snackVisible: false,
|
||
snackText: '',
|
||
disableNetwork: false,
|
||
networks: [],
|
||
modalVisible: true,
|
||
select_network: I18n.t("SELECT_NETWORK"),
|
||
user: this.user,
|
||
result: this.result,
|
||
data: this.data,
|
||
// town: this.data !== null ? this.data.town : null,
|
||
town: this.data !== null && this.data.town ? this.data.town : {
|
||
name: "",
|
||
id: "2",
|
||
indicatif: "",
|
||
districts: []
|
||
},
|
||
isActif: this.isActif,
|
||
id_network_tax: null,
|
||
tax_units_count: [],
|
||
units_per_tax_unit_count: [],
|
||
number_of_days: [],
|
||
building_value: [],
|
||
latlng: [],
|
||
id_company_type: null,
|
||
identification_number: null,
|
||
remainingCharacters: 14,
|
||
trade_registry: null,
|
||
tabTaxe: [0],
|
||
taxes_selected: [],
|
||
companies_types_selected_value: null,
|
||
responsable_name: null,
|
||
technical_approval: null,
|
||
municipality: "Douala",
|
||
neighborhood: null,
|
||
district: "Douala 3eme",
|
||
id_patente: null,
|
||
TVA: false,
|
||
IRPP: false,
|
||
licence: false,
|
||
activity_type: null,
|
||
year_tax_paid_N: false,
|
||
year_tax_paid_N_1: false,
|
||
year_tax_paid_N_2: false,
|
||
image: null,
|
||
displayImage: false,
|
||
loadingUpload: false,
|
||
required_taxes_selected: [],
|
||
required_taxes: [],
|
||
required_taxes_only_single_tax: [],
|
||
required_taxes_only_single_tax_selected: [],
|
||
isTaxesLoaded: false,
|
||
index: 0,
|
||
modalDialog: false,
|
||
player_id: null,
|
||
latitude: "",
|
||
longitude: "",
|
||
addNewTaxeOdtp: false,
|
||
displayAddTaxeFromOtherNetwork: false,
|
||
dataTaxesPublicite: {},
|
||
publicites_taxes: null,
|
||
messageRequiredImage: "",
|
||
selectedTax: null,
|
||
accountType:"",
|
||
cni_number:"",
|
||
birth_date:new Date(),
|
||
birth_place:null,
|
||
birth_country:null,
|
||
nationality_country:null,
|
||
father_lastname:null,
|
||
father_firstname:null,
|
||
mother_lastname:null,
|
||
mother_firstname:null,
|
||
signboard:null,
|
||
entreprise_creation_date: new Date(), // initialisation avec la date actuelle
|
||
showDatePicker: false,
|
||
built:[false],
|
||
|
||
};
|
||
|
||
this.dataToSendTemp = new FormData();
|
||
// console.log("PROPS", this.props);
|
||
// console.log("STATE", this.state);
|
||
this.props.saveActifSocietyReset();
|
||
OneSignal.addEventListener('ids', this.onIds);
|
||
}
|
||
// Méthode appelée lors de la sélection d'une date
|
||
onChangeDate = (event, selectedDate) => {
|
||
// Sur Android, si l'utilisateur annule, event.type sera "dismissed"
|
||
if (Platform.OS === 'android' && event.type === 'dismissed') {
|
||
this.setState({ showDatePicker: false });
|
||
return;
|
||
}
|
||
const currentDate = selectedDate || this.state.entreprise_creation_date;
|
||
this.setState({
|
||
entreprise_creation_date: currentDate,
|
||
showDatePicker: Platform.OS === 'ios' // en iOS, le picker reste affiché
|
||
});
|
||
};
|
||
onChangeDate2 = (event, selectedDate) => {
|
||
// Sur Android, si l'utilisateur annule, event.type sera "dismissed"
|
||
if (Platform.OS === 'android' && event.type === 'dismissed') {
|
||
this.setState({ showDatePicker: false });
|
||
return;
|
||
}
|
||
const currentDate = selectedDate || this.state.birth_date;
|
||
this.setState({
|
||
birth_date: currentDate,
|
||
showDatePicker: Platform.OS === 'ios' // en iOS, le picker reste affiché
|
||
});
|
||
};
|
||
|
||
// Afficher le date picker
|
||
showDatePicker = () => {
|
||
this.setState({ showDatePicker: true });
|
||
};
|
||
createFormData = (photo) => {
|
||
this.dataToSendTemp.append("image", {
|
||
name: photo.path.split('/').pop(),
|
||
type: photo.mime,
|
||
uri:
|
||
Platform.OS === "android" ? photo.path : photo.path.replace("file://", "")
|
||
});
|
||
|
||
};
|
||
|
||
onIds = async (device) => {
|
||
console.log('Device info: ', device);
|
||
this.setState({player_id: device.userId}, () => {
|
||
console.log("Player ID", this.state.player_id);
|
||
});
|
||
|
||
}
|
||
|
||
componentDidMount() {
|
||
this.mounted = true;
|
||
const {type} = this.props;
|
||
if (!this.state.isTaxesLoaded) {
|
||
let taxesTemp = new Array();
|
||
if (!_.isNil(this.result.required_taxes)) {
|
||
this.result.required_taxes.map((taxes, index) => {
|
||
if (this.state.companies_types_selected_value !== null) {
|
||
if (this.state.companies_types_selected_value.name !== "END") {
|
||
let tempTaxes = taxes;
|
||
tempTaxes.id_network_tax = taxes.id;
|
||
if (taxes.measurement_unit !== "forfait") {
|
||
tempTaxes.tax_units_count = null;
|
||
tempTaxes.units_per_tax_unit_count = null;
|
||
}
|
||
taxesTemp.push(tempTaxes);
|
||
} else {
|
||
if (taxes.id !== 70) {
|
||
let tempTaxes = taxes;
|
||
tempTaxes.id_network_tax = taxes.id;
|
||
if (taxes.measurement_unit !== "forfait") {
|
||
tempTaxes.tax_units_count = null;
|
||
tempTaxes.units_per_tax_unit_count = null;
|
||
}
|
||
taxesTemp.push(tempTaxes);
|
||
}
|
||
}
|
||
} else {
|
||
let tempTaxes = taxes;
|
||
tempTaxes.id_network_tax = taxes.id;
|
||
if (taxes.measurement_unit !== "forfait") {
|
||
tempTaxes.tax_units_count = null;
|
||
tempTaxes.units_per_tax_unit_count = null;
|
||
}
|
||
taxesTemp.push(tempTaxes);
|
||
}
|
||
});
|
||
this.setState({
|
||
required_taxes: taxesTemp,
|
||
isTaxesLoaded: true
|
||
});
|
||
}
|
||
}
|
||
|
||
if (Platform.OS === 'android') {
|
||
this.requestCameraPermission(false);
|
||
} else {
|
||
this.watchLocation(false);
|
||
}
|
||
|
||
}
|
||
|
||
componentWillUnmount() {
|
||
OneSignal.removeEventListener('ids', this.onIds);
|
||
}
|
||
|
||
updateRequiredTaxes(value) {
|
||
let taxesTemp = new Array();
|
||
|
||
this.result.required_taxes.map((taxes, index) => {
|
||
if (value.name !== "END") {
|
||
let tempTaxes = taxes;
|
||
tempTaxes.id_network_tax = taxes.id;
|
||
if (taxes.measurement_unit !== "forfait") {
|
||
tempTaxes.tax_units_count = null;
|
||
tempTaxes.units_per_tax_unit_count = null;
|
||
}
|
||
taxesTemp.push(tempTaxes);
|
||
} else {
|
||
if (taxes.id !== "70") {
|
||
// console.log("ETABLISSEMENT", value);
|
||
// console.log("TAXE", taxes);
|
||
let tempTaxes = taxes;
|
||
tempTaxes.id_network_tax = taxes.id;
|
||
if (taxes.measurement_unit !== "forfait") {
|
||
tempTaxes.tax_units_count = null;
|
||
tempTaxes.units_per_tax_unit_count = null;
|
||
}
|
||
taxesTemp.push(tempTaxes);
|
||
}
|
||
}
|
||
});
|
||
this.setState({
|
||
required_taxes: taxesTemp
|
||
});
|
||
}
|
||
|
||
componentWillUnmount() {
|
||
this.mounted = false;
|
||
}
|
||
|
||
showErrorDialog() {
|
||
this.setState({modalDialog: false})
|
||
Alert.alert("Une erreur est survenue", "Impossible de récuperer des informations du pays verifier que votre gps est activé," +
|
||
"et que vous êtes connecté à internet puis ressayer", [{
|
||
text: "Recommencer", onPress: () => {
|
||
this.watchLocation()
|
||
}
|
||
}, {
|
||
text: "Annuler", onPress: () => {
|
||
this.props.navigation.popToTop()
|
||
}
|
||
}])
|
||
}
|
||
|
||
renderLoader = () => {
|
||
return (
|
||
<ProgressDialog
|
||
visible={this.state.loadingUpload}
|
||
title={I18n.t('LOADING')}
|
||
message={I18n.t('UPLOAD_PHOTO')}
|
||
/>
|
||
)
|
||
}
|
||
|
||
async requestCameraPermission(param) {
|
||
try {
|
||
const granted = await PermissionsAndroid.request(
|
||
PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
|
||
{
|
||
'title': 'Cool Photo App Camera Permission',
|
||
'message': 'Cool Photo App needs access to your camera ' +
|
||
'so you can take awesome pictures.'
|
||
}
|
||
)
|
||
if (granted === PermissionsAndroid.RESULTS.GRANTED) {
|
||
this.watchLocation(param);
|
||
} else {
|
||
this.setState({modalDialog: false})
|
||
Alert.alert("Echec à l'autorisation",
|
||
"L'application n'est pas autorisé à acceder à votre position veuillez verifier que votre GPS est activé et configurer en mode Haute Precision",
|
||
[{
|
||
text: "Ok", onPress: () => {
|
||
this.props.navigation.popToTop()
|
||
}
|
||
}])
|
||
}
|
||
} catch (err) {
|
||
this.setState({modalDialog: false})
|
||
Alert.alert("Une erreur est Survenue",
|
||
"Une erreur est survenu lors du demarrage de l'application veuillez relancer l'application",
|
||
[{
|
||
text: "Ok", onPress: () => {
|
||
BackHandler.exitApp()
|
||
}
|
||
}])
|
||
}
|
||
}
|
||
|
||
async watchLocation(param) {
|
||
if (this.isOffline) {
|
||
Geolocation.getCurrentPosition((position) => {
|
||
console.log("Abena1===>>",this.isOffline)
|
||
this.setState({
|
||
modalVisible: false,
|
||
latitude: position.coords.latitude,
|
||
longitude: position.coords.longitude
|
||
}, () => {
|
||
//console.log("latitude", this.state.latitude);
|
||
});
|
||
if (this.result.child) {
|
||
this.setState({disableNetwork: true});
|
||
if (this.result.network) {
|
||
this.setState({
|
||
modalVisible: false, networks: [this.result.network],
|
||
});
|
||
if (this.result.child === "geolocated" || this.result.child === "super") {
|
||
this.setState({
|
||
network: this.result.network,
|
||
select_network: I18n.t("YOUR_NETWORK_SELECTED")
|
||
});
|
||
}
|
||
} else {
|
||
this.showErrorDialog();
|
||
}
|
||
}
|
||
|
||
}, (e) => {
|
||
Alert.alert(I18n.t('TITLE_PROBLE_COME'), "Impossible de recuperer les informations du code hiérarchique ou taxe", [{
|
||
text: "Reesayer",
|
||
onPress: () => this.watchLocation(param)
|
||
}])
|
||
console.warn("POSITION ERROR", e);
|
||
this.setState({modalVisible: false})
|
||
}, this.props.geolocationOptions);
|
||
} else {
|
||
Geolocation.getCurrentPosition((position) => {
|
||
this.treatPosition(position, param)
|
||
}, (e) => {
|
||
this.showErrorDialog();
|
||
}, this.props.geolocationOptions);
|
||
/* if (!this.watchID) {
|
||
Geolocation.watchPosition((position) => {
|
||
this.treatPosition(position, param)
|
||
}, (e) => {
|
||
this.showErrorDialog();
|
||
}, this.props.geolocationOptions)
|
||
}*/
|
||
}
|
||
|
||
}
|
||
|
||
treatPosition(position, param) {
|
||
const myLastPosition = this.state.myPosition;
|
||
const myPosition = position.coords;
|
||
//console.log("Param transfer to location", param);
|
||
|
||
if (param) {
|
||
let taxes_selected = this.state.taxes_selected;
|
||
taxes_selected[this.state.index].latitude = position.coords.latitude;
|
||
taxes_selected[this.state.index].longitude = position.coords.longitude;
|
||
|
||
this.setState({taxes_selected}, () => {
|
||
console.warn("Taxes selected", taxes_selected);
|
||
});
|
||
}
|
||
|
||
if (!_.isEqual(myPosition, myLastPosition)) {
|
||
getPositionInformation(myPosition).then((response) => {
|
||
console.log("Abena3===>>",response.results)
|
||
console.log("Abena3===>>",response.results.length)
|
||
if (response.results !== undefined) {
|
||
if (response.results.length > 0) {
|
||
let most = response.results[0]
|
||
let {address_components, formatted_address, place_id} = most
|
||
this.setState({
|
||
address: address_components,
|
||
textadress: formatted_address,
|
||
place: place_id,
|
||
modalVisible: false
|
||
})
|
||
}
|
||
|
||
}
|
||
}).catch((e) => {
|
||
this.showErrorDialog()
|
||
});
|
||
if (!_.isNil(position.coords)) {
|
||
this.setState({myPosition});
|
||
if (this.mapRef[this.state.index] !== undefined && this.mapRef[this.state.index] !== null) {
|
||
this.mapRef[this.state.index].animateToCoordinate({
|
||
latitude: position.coords.latitude,
|
||
longitude: position.coords.longitude
|
||
}, 1000);
|
||
this.mapRef[this.state.index].animateToRegion({
|
||
latitude: position.coords.latitude,
|
||
longitude: position.coords.longitude,
|
||
latitudeDelta: 0.03,
|
||
longitudeDelta: 0.01,
|
||
}, 1000)
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
prepareModal() {
|
||
return (<MaterialDialog
|
||
visible={this.state.modalVisible}
|
||
title={I18n.t("LOADING_INFO")}
|
||
>
|
||
<View style={{justifyContent: 'center', alignItems: 'center'}}>
|
||
<Text>{I18n.t("LOADING_DESCRIPTION_COUNTRY")}</Text>
|
||
<ProgressBarAndroid/>
|
||
</View>
|
||
</MaterialDialog>)
|
||
}
|
||
|
||
uploadImage = () => {
|
||
axios({
|
||
url: `${uploadImage}`,
|
||
method: 'POST',
|
||
data: this.dataToSendTemp,
|
||
headers: {
|
||
'X-Localization': I18n.currentLocale(),
|
||
'Content-Type': 'multipart/form-data'
|
||
},
|
||
})
|
||
.then(response => {
|
||
//console.log(response);
|
||
let taxes_selected = this.state.taxes_selected;
|
||
taxes_selected[this.state.index].image = response.data.response.filename;
|
||
this.setState({taxes_selected, loadingUpload: false});
|
||
})
|
||
.catch(error => {
|
||
console.log(error);
|
||
if (error.response)
|
||
console.log(error.response);
|
||
else if (error.request)
|
||
console.log(error.request);
|
||
else
|
||
console.log(error.message);
|
||
|
||
Alert.alert("", I18n.t('TITLE_ERROR_SURVENU'), [{
|
||
text: "Ok",
|
||
onPress: () => {
|
||
}
|
||
}]);
|
||
this.setState({loadingUpload: false});
|
||
});
|
||
};
|
||
|
||
renderCreateActifResponse = () => {
|
||
|
||
const {result, error} = this.props;
|
||
|
||
if (error !== null) {
|
||
if (typeof error.data !== 'undefined') {
|
||
Alert.alert(
|
||
I18n.t("UNABLE_TO_CREATE_ACCOUNT"),
|
||
error.data.error_msg,
|
||
[
|
||
{
|
||
text: I18n.t("OK"), onPress: () => {
|
||
this.props.saveActifSocietyReset();
|
||
}
|
||
}
|
||
],
|
||
{cancelable: false}
|
||
)
|
||
}
|
||
}
|
||
|
||
if (result !== null) {
|
||
if (result.response !== null) {
|
||
Alert.alert(
|
||
I18n.t("SUCCESS"),
|
||
result.success_msg,
|
||
[
|
||
{
|
||
text: I18n.t("OK"), onPress: () => {
|
||
this.props.saveActifSocietyReset();
|
||
this.props.navigation.popToTop();
|
||
}
|
||
}
|
||
|
||
],
|
||
{cancelable: false}
|
||
)
|
||
}
|
||
}
|
||
}
|
||
|
||
renderDialogImage = () => {
|
||
|
||
return (
|
||
<Dialog.Container contentStyle={{width: responsiveWidth(80)}} useNativeDriver={true}
|
||
visible={this.state.displayImage}>
|
||
|
||
<Dialog.Title>{I18n.t('PREVISUALISATION')}</Dialog.Title>
|
||
|
||
<View>
|
||
<View style={{width: 50}}/>
|
||
<View style={{justifyContent: 'center', alignContent: 'center', alignItems: 'center'}}>
|
||
<Image source={{uri: this.state.image.path}} style={{
|
||
width: this.state.image.width, height: this.state.image.height, aspectRatio: 1,
|
||
resizeMode: 'contain'
|
||
}}/>
|
||
</View>
|
||
<View style={{width: 50}}/>
|
||
</View>
|
||
|
||
<Dialog.Button bold={true} label={I18n.t('OK')} onPress={() => {
|
||
this.setState({
|
||
displayImage: false,
|
||
});
|
||
if (this.isOffline) {
|
||
if (this.state.addNewTaxeOdtp) {
|
||
let taxes_selected = this.state.publicites_taxes;
|
||
if (!_.isNil(taxes_selected)) {
|
||
taxes_selected.image = this.state.image;
|
||
this.setState({publicites_taxes: taxes_selected, loadingUpload: false});
|
||
}
|
||
} else {
|
||
let taxes_selected = this.state.taxes_selected;
|
||
taxes_selected[this.state.index].image = this.state.image;
|
||
this.setState({taxes_selected, loadingUpload: false});
|
||
}
|
||
} else {
|
||
this.setState({loadingUpload: true});
|
||
this.uploadImage();
|
||
}
|
||
|
||
}}/>
|
||
</Dialog.Container>
|
||
)
|
||
}
|
||
|
||
renderRequiredTaxesDropdown = (item, index) => {
|
||
return (
|
||
<>
|
||
{/* <Animatable.View key={index}>
|
||
<View
|
||
style={{
|
||
marginTop: 20,
|
||
flexDirection: "row",
|
||
paddingRight: 20,
|
||
paddingLeft: 20,
|
||
}}>
|
||
|
||
<View style={{
|
||
width: responsiveWidth(90),
|
||
borderRadius: 10,
|
||
alignSelf: "center",
|
||
backgroundColor: 'white'
|
||
}}>
|
||
<Dropdown
|
||
label={I18n.t('TAXES_SUR_LA_PROPRETE')}
|
||
disabled={true}
|
||
data={this.state.required_taxes}
|
||
useNativeDriver={true}
|
||
valueExtractor={(value) => {
|
||
return value
|
||
}}
|
||
value={item.name}
|
||
labelExtractor={(value) => {
|
||
return value.name
|
||
}}
|
||
/>
|
||
</View>
|
||
</View>
|
||
</Animatable.View> */}
|
||
{
|
||
item.measurement_unit !== "forfait" &&
|
||
<>
|
||
<Animatable.View>
|
||
<Fumi iconClass={FontAwesomeIcon}
|
||
iconName={'check-circle'}
|
||
label={item.labels[0]}
|
||
iconColor={'#f95a25'}
|
||
keyboardType="numeric"
|
||
iconSize={20}
|
||
style={styles.input}
|
||
value={item.tax_units_count === null ? 1 : item.tax_units_count}
|
||
onChangeText={(value) => {
|
||
let tax_units_count = this.state.required_taxes;
|
||
if (value === "")
|
||
tax_units_count[index].tax_units_count = null;
|
||
else
|
||
tax_units_count[index].tax_units_count = value;
|
||
this.setState({required_taxes: tax_units_count});
|
||
}}
|
||
>
|
||
</Fumi>
|
||
</Animatable.View>
|
||
|
||
{
|
||
item.labels.length === 2 &&
|
||
<Animatable.View>
|
||
<Fumi iconClass={FontAwesomeIcon}
|
||
iconName={'check'}
|
||
label={isNil(item.labels[1]) ? I18n.t('UNIT_PER_TAXE_UNIT_COUNT') : item.labels[1]}
|
||
iconColor={'#f95a25'}
|
||
keyboardType="decimal-pad"
|
||
iconSize={20}
|
||
value={item.units_per_tax_unit_count}
|
||
style={styles.input}
|
||
onChangeText={(value) => {
|
||
let units_per_tax_unit_count = this.state.required_taxes;
|
||
units_per_tax_unit_count[index].units_per_tax_unit_count = value;
|
||
this.setState({required_taxes: units_per_tax_unit_count});
|
||
}}
|
||
>
|
||
</Fumi>
|
||
</Animatable.View>
|
||
}
|
||
</>
|
||
|
||
}
|
||
</>
|
||
)
|
||
}
|
||
|
||
|
||
|
||
renderPubliciteTaxesDropdown = () => {
|
||
return (
|
||
<>
|
||
<Animatable.View>
|
||
<View
|
||
style={{
|
||
marginTop: 20,
|
||
flexDirection: "row",
|
||
paddingRight: 20,
|
||
paddingLeft: 20,
|
||
}}>
|
||
|
||
<View style={{
|
||
width: responsiveWidth(90),
|
||
borderRadius: 10,
|
||
alignSelf: "center",
|
||
backgroundColor: 'white'
|
||
}}>
|
||
<Dropdown
|
||
label={I18n.t('TAXES_SUR_LA_PUBLICITE')}
|
||
data={this.state.dataTaxesPublicite.taxes}
|
||
useNativeDriver={true}
|
||
valueExtractor={(value) => {
|
||
return value
|
||
}}
|
||
labelExtractor={(value) => {
|
||
return value.name
|
||
}}
|
||
onChangeText={(value, i, data) => {
|
||
this.setState({publicites_taxes: value}, () => {
|
||
//console.log("Taxes", this.state.publicites_taxes);
|
||
});
|
||
}}
|
||
/>
|
||
</View>
|
||
</View>
|
||
</Animatable.View>
|
||
{
|
||
!isNil(this.state.publicites_taxes) ?
|
||
this.state.publicites_taxes.measurement_unit !== "forfait" &&
|
||
<>
|
||
<Animatable.View>
|
||
<Fumi iconClass={FontAwesomeIcon}
|
||
iconName={'check-circle'}
|
||
label={this.state.publicites_taxes.labels[0]}
|
||
iconColor={'#f95a25'}
|
||
keyboardType="decimal-pad"
|
||
iconSize={20}
|
||
style={styles.input}
|
||
value={this.state.publicites_taxes.tax_units_count === null ? 1 : this.state.publicites_taxes.tax_units_count}
|
||
onChangeText={(value) => {
|
||
let tax_units_count = this.state.publicites_taxes;
|
||
if (value === "")
|
||
tax_units_count.tax_units_count = null;
|
||
else
|
||
tax_units_count.tax_units_count = value;
|
||
this.setState({publicites_taxes: tax_units_count});
|
||
}}
|
||
>
|
||
</Fumi>
|
||
</Animatable.View>
|
||
|
||
{
|
||
this.state.publicites_taxes.labels.length === 2 &&
|
||
<Animatable.View>
|
||
<Fumi iconClass={FontAwesomeIcon}
|
||
iconName={'check'}
|
||
label={isNil(this.state.publicites_taxes.labels[1]) ? I18n.t('UNIT_PER_TAXE_UNIT_COUNT') : this.state.publicites_taxes.labels[1]}
|
||
iconColor={'#f95a25'}
|
||
keyboardType="decimal-pad"
|
||
iconSize={20}
|
||
value={this.state.publicites_taxes.units_per_tax_unit_count}
|
||
style={styles.input}
|
||
onChangeText={(value) => {
|
||
let units_per_tax_unit_count = this.state.publicites_taxes;
|
||
units_per_tax_unit_count.units_per_tax_unit_count = value;
|
||
this.setState({publicites_taxes: units_per_tax_unit_count});
|
||
}}/>
|
||
</Animatable.View>
|
||
}
|
||
</> : null
|
||
}
|
||
{
|
||
!isNil(this.state.publicites_taxes) ?
|
||
this.state.publicites_taxes.has_image_capture === "1" &&
|
||
<View style={[styles.contentPicker]}>
|
||
<TouchableOpacity
|
||
style={[styles.contain]}
|
||
onPress={() => {
|
||
ImagePicker.openCamera({
|
||
width: 400,
|
||
height: 281,
|
||
cropping: true,
|
||
useFrontCamera: false
|
||
}).then(image => {
|
||
this.createFormData(image);
|
||
this.setState({image, displayImage: true});
|
||
})
|
||
}}
|
||
activeOpacity={0.9}>
|
||
<View style={[styles.contcontainerCenterentLeft]}>
|
||
<View>
|
||
<Icon name='image' color={Color.whiteColor}
|
||
style={[styles.thumb]} size={80}/>
|
||
<View style={[styles.point, {backgroundColor: Color.accentColor}]}>
|
||
<Icon name='camera-image' color={Color.whiteColor} size={20}/>
|
||
</View>
|
||
</View>
|
||
</View>
|
||
</TouchableOpacity>
|
||
<Text
|
||
style={[Typography.footnote, FontWeight.semibold, {color: Color.whiteColor}]}>{I18n.t('IMAGE_TAKE')}</Text>
|
||
</View> : null
|
||
|
||
}
|
||
</>
|
||
)
|
||
}
|
||
|
||
renderTaxesDropdown = (index) => {
|
||
const isTaxesEmpty = !this.state.result.taxes || this.state.result.taxes.length === 0;
|
||
// ─── CALCUL DE LA VALEUR MERCURIALE ───────────────────────────────
|
||
// Trouve l’objet quartier correspondant au nom sélectionné
|
||
const selectedNeighbourhood = this.state.result.neighborhoods.find(
|
||
n => n.name === this.state.neighborhood
|
||
);
|
||
// Choisit built ou unbuilt selon le dropdown, ou null si introuvable
|
||
const mercurialValue = selectedNeighbourhood
|
||
? (this.state.built[index]
|
||
? selectedNeighbourhood.mercur_built_value
|
||
: selectedNeighbourhood.mercur_unbuilt_value)
|
||
: null;
|
||
//
|
||
return (
|
||
<>
|
||
|
||
<Animatable.View ref={(comp) => {
|
||
this.taxesAnim = comp
|
||
}} key={index}>
|
||
|
||
<View
|
||
style={{
|
||
marginTop: 20,
|
||
flexDirection: "row",
|
||
paddingRight: 20,
|
||
paddingLeft: 20,
|
||
}}>
|
||
{isTaxesEmpty ? null : (
|
||
<View style={{
|
||
width: responsiveWidth(90),
|
||
borderRadius: 10,
|
||
alignSelf: "center",
|
||
backgroundColor: 'white'
|
||
}}>
|
||
<Dropdown
|
||
label={`${I18n.t('TAXES')} *`}
|
||
data={this.state.result.taxes}
|
||
useNativeDriver={true}
|
||
valueExtractor={(value) => {
|
||
return value
|
||
}}
|
||
onChangeText={(value, i, data) => {
|
||
let taxes_seleted = this.state.taxes_selected;
|
||
if (index === 0) {
|
||
taxes_seleted = new Array();
|
||
taxes_seleted[index] = value;
|
||
} else
|
||
taxes_seleted[index] = value;
|
||
this.setState({taxes_selected: taxes_seleted}, () => {
|
||
// console.log("Taxes", this.state.taxes_selected);
|
||
// console.log("Index", index);
|
||
});
|
||
}}
|
||
labelExtractor={(value) => {
|
||
return value.name
|
||
}}
|
||
/>
|
||
</View>
|
||
)}
|
||
|
||
{
|
||
this.state.network.has_many_taxes === "1" &&
|
||
<View>
|
||
<TouchableOpacity
|
||
style={[styles.contain, {
|
||
backgroundColor: Color.accentColor,
|
||
alignItems: "center",
|
||
justifyContent: "center",
|
||
position: "absolute",
|
||
width: 25,
|
||
bottom: 0,
|
||
zIndex: 10,
|
||
left: -10,
|
||
height: 25,
|
||
borderRadius: 11}]}
|
||
onPress={() => {
|
||
let tabTaxe = this.state.tabTaxe;
|
||
if (index === 0) {
|
||
let lastElement = this.state.tabTaxe[this.state.tabTaxe.length - 1];
|
||
tabTaxe.push(lastElement++);
|
||
this.setState({tabTaxe});
|
||
} else {
|
||
tabTaxe = tabTaxe.filter((element, i) => index !== i);
|
||
this.setState({tabTaxe});
|
||
}
|
||
}}
|
||
activeOpacity={0.9}>
|
||
<View>
|
||
<View>
|
||
<Icon name={index > 0 ? 'minus' : 'plus'} color={Color.whiteColor}
|
||
size={20}/>
|
||
</View>
|
||
</View>
|
||
</TouchableOpacity>
|
||
</View>
|
||
|
||
}
|
||
</View>
|
||
</Animatable.View>
|
||
{console.log("this.state.taxes_selected[index]==>",this.state.taxes_selected[index])}
|
||
{console.log("this.state.taxes_selected[index]==>",!isNil(this.state.taxes_selected[index]))}
|
||
{
|
||
!isNil(this.state.taxes_selected[index]) ?
|
||
this.state.taxes_selected[index].measurement_unit !== "forfait" &&
|
||
<>
|
||
<Animatable.View>
|
||
<Fumi iconClass={FontAwesomeIcon}
|
||
iconName={'check-circle'}
|
||
label={this.state.taxes_selected[index].labels[0]}
|
||
iconColor={'#f95a25'}
|
||
keyboardType="decimal-pad"
|
||
iconSize={20}
|
||
style={styles.input}
|
||
onChangeText={(value) => {
|
||
let tax_units_count = this.state.tax_units_count;
|
||
if (index === 0) {
|
||
tax_units_count = [];
|
||
tax_units_count[0] = value;
|
||
} else
|
||
tax_units_count[index] = value;
|
||
this.setState({tax_units_count: tax_units_count});
|
||
}}
|
||
>
|
||
</Fumi>
|
||
</Animatable.View>
|
||
|
||
{
|
||
this.state.taxes_selected[index].labels.length === 2 &&
|
||
<Animatable.View>
|
||
<Fumi iconClass={FontAwesomeIcon}
|
||
iconName={'check'}
|
||
label={isNil(this.state.taxes_selected[index].labels[1]) ? I18n.t('UNIT_PER_TAXE_UNIT_COUNT') : this.state.taxes_selected[index].labels[1]}
|
||
iconColor={'#f95a25'}
|
||
keyboardType="decimal-pad"
|
||
iconSize={20}
|
||
style={styles.input}
|
||
onChangeText={(value) => {
|
||
let units_per_tax_unit_count = this.state.units_per_tax_unit_count;
|
||
if (index === 0) {
|
||
units_per_tax_unit_count = [];
|
||
units_per_tax_unit_count[0] = value;
|
||
} else
|
||
units_per_tax_unit_count[index] = value;
|
||
this.setState({units_per_tax_unit_count: units_per_tax_unit_count});
|
||
}}
|
||
>
|
||
</Fumi>
|
||
</Animatable.View>
|
||
}
|
||
</> :
|
||
null
|
||
|
||
}
|
||
{
|
||
!isNil(this.state.taxes_selected[index]) ?
|
||
this.state.taxes_selected[index].has_image_capture === "1" &&
|
||
<View style={[styles.contentPicker]}>
|
||
<TouchableOpacity
|
||
style={[styles.contain]}
|
||
onPress={() => {
|
||
ImagePicker.openCamera({
|
||
width: 400,
|
||
height: 281,
|
||
cropping: true,
|
||
useFrontCamera: false
|
||
}).then(image => {
|
||
this.createFormData(image);
|
||
this.setState({image, displayImage: true, index});
|
||
})
|
||
}}
|
||
activeOpacity={0.9}>
|
||
<View style={[styles.contcontainerCenterentLeft]}>
|
||
<View>
|
||
<Icon name='image' color={Color.whiteColor}
|
||
style={[styles.thumb]} size={80}/>
|
||
<View style={[styles.point, {backgroundColor: Color.accentColor}]}>
|
||
<Icon name='camera-image' color={Color.whiteColor} size={20}/>
|
||
</View>
|
||
</View>
|
||
</View>
|
||
</TouchableOpacity>
|
||
<Text
|
||
style={[Typography.footnote, FontWeight.semibold, {color: Color.whiteColor}]}>{I18n.t('IMAGE_TAKE')}</Text>
|
||
</View> : null
|
||
|
||
}
|
||
{
|
||
!isNil(this.state.taxes_selected[index]) ?
|
||
this.state.taxes_selected[index].billing_period === "jour" &&
|
||
(<Animatable.View>
|
||
<Fumi iconClass={FontAwesomeIcon} iconName={'calendar'}
|
||
label={I18n.t('NUMBER_OF_DAYS')}
|
||
iconColor={'#f95a25'}
|
||
iconSize={20}
|
||
keyboardType='numeric'
|
||
onChangeText={(value) => {
|
||
let {number_of_days} = this.state.number_of_days;
|
||
if (index === 0) {
|
||
number_of_days = [];
|
||
number_of_days[0] = value;
|
||
} else
|
||
number_of_days[index] = value;
|
||
this.setState({number_of_days});
|
||
}}
|
||
style={styles.input}
|
||
>
|
||
</Fumi>
|
||
</Animatable.View>)
|
||
: null
|
||
|
||
}
|
||
{
|
||
/* Champs spécifiques à la taxe foncière (“taxe sur la propriété”) */
|
||
!isNil(this.state.taxes_selected[index]) &&
|
||
this.state.taxes_selected[index].name?.toLowerCase() === 'taxe sur la propriété' && (
|
||
<>
|
||
{/* Sélection Immeuble bâti → built */}
|
||
<Animatable.View>
|
||
<View style={{
|
||
width: responsiveWidth(90),
|
||
alignSelf: 'center',
|
||
backgroundColor: 'white',
|
||
borderRadius: 10,
|
||
marginTop: 20,
|
||
paddingLeft: 20,
|
||
paddingRight: 20
|
||
}}>
|
||
<Dropdown
|
||
label={I18n.t('BUILDING_CONSTRUCTED')}
|
||
data={[ { value: 'Non' }, { value: 'Oui' } ]}
|
||
value={ this.state.built[index] ? 'Oui' : 'Non' }
|
||
onChangeText={(value) => {
|
||
const built = [...this.state.built];
|
||
// quand Non → false, Oui → true
|
||
built[index] = (value === 'Oui');
|
||
this.setState({ built });
|
||
}}
|
||
/>
|
||
</View>
|
||
</Animatable.View>
|
||
{mercurialValue != null && (
|
||
<Text style={{
|
||
marginTop: 5,
|
||
marginLeft: responsiveWidth(6),
|
||
fontSize: 16,
|
||
color: '#fff'
|
||
}}>
|
||
{`${I18n.t('MERCURIAL_VALUE')}: ${mercurialValue}`}
|
||
</Text>
|
||
)}
|
||
{/* Saisir la valeur mercuriale → units_per_tax_unit_count */}
|
||
{/* <Animatable.View>
|
||
<Fumi
|
||
iconClass={FontAwesomeIcon}
|
||
iconName="money-bill-wave"
|
||
label={I18n.t('MERCURIAL_VALUE')}
|
||
iconColor="#f95a25"
|
||
iconSize={20}
|
||
keyboardType="decimal-pad"
|
||
style={styles.input}
|
||
onChangeText={(value) => {
|
||
const units_per_tax_unit_count = [...this.state.units_per_tax_unit_count];
|
||
units_per_tax_unit_count[index] = value;
|
||
this.setState({ units_per_tax_unit_count });
|
||
}}
|
||
/>
|
||
</Animatable.View> */}
|
||
|
||
{/* Saisir la valeur de la construction → building_value */}
|
||
{this.state.built[index] && (
|
||
<Animatable.View>
|
||
<Fumi
|
||
iconClass={FontAwesomeIcon}
|
||
iconName="building"
|
||
label={I18n.t('CONSTRUCTION_VALUE')}
|
||
iconColor="#f95a25"
|
||
iconSize={20}
|
||
keyboardType="decimal-pad"
|
||
style={styles.input}
|
||
onChangeText={(value) => {
|
||
const building_value = [...this.state.building_value];
|
||
building_value[index] = value;
|
||
this.setState({ building_value });
|
||
}}
|
||
/>
|
||
</Animatable.View>
|
||
)}
|
||
|
||
|
||
</>
|
||
)
|
||
}
|
||
</>
|
||
)
|
||
}
|
||
|
||
renderTaxesEntreprisesDropdown = (index) => {
|
||
return (
|
||
<>
|
||
<Animatable.View ref={(comp) => {
|
||
this.taxesAnim = comp
|
||
}} key={index}>
|
||
<View
|
||
style={{
|
||
marginTop: 20,
|
||
flexDirection: "row",
|
||
paddingRight: 20,
|
||
paddingLeft: 20,
|
||
}}>
|
||
|
||
<View style={{
|
||
width: responsiveWidth(90),
|
||
borderRadius: 10,
|
||
alignSelf: "center",
|
||
backgroundColor: 'white'
|
||
}}>
|
||
<Dropdown
|
||
label={I18n.t('TAXES')}
|
||
data={this.state.result.taxes}
|
||
useNativeDriver={true}
|
||
valueExtractor={(value) => {
|
||
return value
|
||
}}
|
||
onChangeText={(value, i, data) => {
|
||
//console.log("Value selected", value);
|
||
|
||
let taxes_seleted = this.state.taxes_selected;
|
||
if (index === 0) {
|
||
taxes_seleted = new Array();
|
||
taxes_seleted[index] = value;
|
||
} else
|
||
taxes_seleted[index] = value;
|
||
this.setState({taxes_selected: taxes_seleted}, () => {
|
||
// console.log("Taxes", this.state.taxes_selected);
|
||
// console.log("Index", index);
|
||
});
|
||
|
||
if (Platform.OS === 'android') {
|
||
this.requestCameraPermission(true);
|
||
} else {
|
||
this.watchLocation(true);
|
||
}
|
||
}}
|
||
labelExtractor={(value) => {
|
||
return value.name
|
||
}}
|
||
/>
|
||
</View>
|
||
|
||
<View>
|
||
<TouchableOpacity
|
||
style={[styles.contain, {
|
||
backgroundColor: Color.accentColor,
|
||
alignItems: "center",
|
||
justifyContent: "center",
|
||
position: "absolute",
|
||
width: 25,
|
||
bottom: 0,
|
||
zIndex: 10,
|
||
left: -10,
|
||
height: 25,
|
||
borderRadius: 11}]}
|
||
onPress={() => {
|
||
let tabTaxe = this.state.tabTaxe;
|
||
if (index === 0) {
|
||
let lastElement = this.state.tabTaxe[this.state.tabTaxe.length - 1];
|
||
tabTaxe.push(lastElement++);
|
||
this.setState({tabTaxe});
|
||
} else {
|
||
tabTaxe = tabTaxe.filter((element, i) => index !== i);
|
||
this.setState({tabTaxe});
|
||
}
|
||
}}
|
||
activeOpacity={0.9}>
|
||
<View>
|
||
<View>
|
||
<Icon name={index > 0 ? 'minus' : 'plus'} color={Color.whiteColor} size={20}/>
|
||
</View>
|
||
</View>
|
||
</TouchableOpacity>
|
||
</View>
|
||
</View>
|
||
</Animatable.View>
|
||
{
|
||
!isNil(this.state.taxes_selected[index]) ?
|
||
this.state.taxes_selected[index].measurement_unit !== "forfait" &&
|
||
<>
|
||
<Animatable.View>
|
||
<Fumi iconClass={FontAwesomeIcon}
|
||
iconName={'check-circle'}
|
||
label={this.state.taxes_selected[index].labels[0]}
|
||
iconColor={'#f95a25'}
|
||
keyboardType="decimal-pad"
|
||
iconSize={20}
|
||
style={styles.input}
|
||
onChangeText={(value) => {
|
||
let tax_units_count = this.state.tax_units_count;
|
||
if (index === 0) {
|
||
tax_units_count = [];
|
||
tax_units_count[0] = value;
|
||
} else
|
||
tax_units_count[index] = value;
|
||
this.setState({tax_units_count: tax_units_count});
|
||
}}
|
||
>
|
||
</Fumi>
|
||
</Animatable.View>
|
||
|
||
{
|
||
this.state.taxes_selected[index].labels.length === 2 &&
|
||
<Animatable.View>
|
||
<Fumi iconClass={FontAwesomeIcon}
|
||
iconName={'check'}
|
||
label={isNil(this.state.taxes_selected[index].labels[1]) ? I18n.t('UNIT_PER_TAXE_UNIT_COUNT') : this.state.taxes_selected[index].labels[1]}
|
||
iconColor={'#f95a25'}
|
||
keyboardType="decimal-pad"
|
||
iconSize={20}
|
||
style={styles.input}
|
||
onChangeText={(value) => {
|
||
let units_per_tax_unit_count = this.state.units_per_tax_unit_count;
|
||
if (index === 0) {
|
||
units_per_tax_unit_count = [];
|
||
units_per_tax_unit_count[0] = value;
|
||
} else
|
||
units_per_tax_unit_count[index] = value;
|
||
this.setState({units_per_tax_unit_count: units_per_tax_unit_count});
|
||
}}
|
||
>
|
||
</Fumi>
|
||
</Animatable.View>
|
||
}
|
||
</> :
|
||
null
|
||
|
||
}
|
||
|
||
|
||
{!isNil(this.state.taxes_selected[index]) ?
|
||
this.state.taxes_selected[index].has_image_capture === "1" &&
|
||
<View style={[styles.contentPicker]}>
|
||
<TouchableOpacity
|
||
style={[styles.contain]}
|
||
onPress={() => {
|
||
ImagePicker.openCamera({
|
||
width: 400,
|
||
height: 281,
|
||
cropping: true,
|
||
useFrontCamera: false
|
||
}).then(image => {
|
||
this.createFormData(image);
|
||
this.setState({image, displayImage: true, index});
|
||
})
|
||
}}
|
||
activeOpacity={0.9}>
|
||
<View style={[styles.contcontainerCenterentLeft]}>
|
||
<View>
|
||
<Icon name='image' color={Color.whiteColor}
|
||
style={[styles.thumb]} size={80}/>
|
||
<View style={[styles.point, {backgroundColor: Color.accentColor}]}>
|
||
<Icon name='camera-image' color={Color.whiteColor} size={20}/>
|
||
</View>
|
||
</View>
|
||
</View>
|
||
</TouchableOpacity>
|
||
<Text
|
||
style={[Typography.footnote, FontWeight.semibold, {color: Color.whiteColor}]}>{I18n.t('IMAGE_TAKE')}</Text>
|
||
</View> : null
|
||
}
|
||
|
||
<Text
|
||
style={{
|
||
fontSize: 16,
|
||
marginTop: 10,
|
||
marginLeft: responsiveWidth(6),
|
||
marginRight: responsiveWidth(6),
|
||
color: 'white',
|
||
fontWeight: 'bold'
|
||
}}
|
||
>{I18n.t('WAIT_LOADING_POSITION')}</Text>
|
||
|
||
{this.isOffline ?
|
||
<Animatable.View>
|
||
<View style={{flexDirection: 'row', flex: 1}}>
|
||
<Fumi iconClass={FontAwesomeIcon} iconName={'map-marker'}
|
||
value={"" + this.state.latitude}
|
||
enabled={false}
|
||
placeholder={I18n.t('LATITUDE')}
|
||
editable={false}
|
||
style={{
|
||
width: responsiveWidth(45),
|
||
height: responsiveHeight(10),
|
||
alignSelf: 'center',
|
||
marginLeft: responsiveWidth(5),
|
||
marginRight: responsiveWidth(5),
|
||
borderRadius: 5,
|
||
}}
|
||
/>
|
||
<View>
|
||
<Fumi iconClass={FontAwesomeIcon} iconName={'map-marker'}
|
||
placeholder={I18n.t('LONGITITUDE')}
|
||
iconColor={'#f95a25'}
|
||
editable={false}
|
||
enabled={false}
|
||
iconSize={20}
|
||
value={"" + this.state.longitude}
|
||
style={{
|
||
width: responsiveWidth(40),
|
||
height: responsiveHeight(10),
|
||
alignSelf: 'center',
|
||
marginRight: responsiveWidth(5),
|
||
borderRadius: 5,
|
||
}}
|
||
>
|
||
</Fumi>
|
||
</View>
|
||
</View>
|
||
</Animatable.View> :
|
||
|
||
<>
|
||
<Animatable.View
|
||
ref={(comp) => {
|
||
this.mapanim = comp
|
||
}}
|
||
>
|
||
<MapView
|
||
liteMode
|
||
ref={(ref) => {
|
||
this.mapRef[this.state.index] = ref
|
||
}}
|
||
style={styles.map}
|
||
>
|
||
{this.state.myPosition !== undefined ?
|
||
<Marker
|
||
title={I18n.t('YOUR_THERE')}
|
||
minZoomLevel={18}
|
||
coordinate={{
|
||
longitude: this.state.myPosition.longitude,
|
||
latitude: this.state.myPosition.latitude
|
||
}}
|
||
/> :
|
||
null}
|
||
</MapView>
|
||
</Animatable.View>
|
||
{/* <TouchableOpacity style={{flexDirection: 'row', alignItems: 'center'}}>
|
||
<Image
|
||
|
||
style={{
|
||
width: 24, height: 24,
|
||
marginLeft: responsiveWidth(6)
|
||
}}
|
||
source={require('../../assets/img/userplace.png')}
|
||
/>
|
||
<Text
|
||
style={{
|
||
fontSize: 16,
|
||
marginTop: 10, marginRight: responsiveWidth(6), color: 'white', fontWeight: 'bold'
|
||
}}
|
||
>{this.state.textadress !== undefined ? this.state.textadress : I18n.t('TAKE_MY_POSITION')}</Text>
|
||
</TouchableOpacity> */}
|
||
</>
|
||
}
|
||
<Animatable.View ref={(comp) => {
|
||
this.districtAnim = comp
|
||
}}>
|
||
<View
|
||
style={{
|
||
width: responsiveWidth(90),
|
||
marginTop: 20,
|
||
alignSelf: 'center',
|
||
borderRadius: 10,
|
||
paddingLeft: 20,
|
||
paddingRight: 20,
|
||
backgroundColor: 'white'
|
||
}}>
|
||
<Dropdown
|
||
label={I18n.t('ARRONDISSEMENT')}
|
||
data={this.result.districts}
|
||
useNativeDriver={true}
|
||
valueExtractor={(value) => {
|
||
return value
|
||
}}
|
||
labelExtractor={(value) => {
|
||
return value.name
|
||
}}
|
||
onChangeText={(value, index, data) => {
|
||
let taxes_selected = this.state.taxes_selected;
|
||
taxes_selected[this.state.index].district = value.name;
|
||
this.setState({taxes_selected});
|
||
}}
|
||
/>
|
||
</View>
|
||
</Animatable.View>
|
||
|
||
<Animatable.View ref={(comp) => {
|
||
this.neightborhoodAnim = comp
|
||
}}>
|
||
<Fumi iconClass={FontAwesomeIcon}
|
||
iconName={'map-marker'}
|
||
label={I18n.t('QUARTIER_COMMUNE')}
|
||
iconColor={'#f95a25'}
|
||
iconSize={20}
|
||
style={styles.input}
|
||
onChangeText={(text) => {
|
||
let taxes_selected = this.state.taxes_selected;
|
||
taxes_selected[this.state.index].neighborhood = text;
|
||
this.setState({taxes_selected});
|
||
}}/>
|
||
</Animatable.View>
|
||
</>
|
||
)
|
||
}
|
||
handleTaxSlection = (selectedTax) => {
|
||
this.setState({selectedTax})
|
||
}
|
||
|
||
renderUserGeoAccount() {
|
||
let year = new Date();
|
||
const {required_taxes_only_single_tax, selectedTax,accountType} = this.state
|
||
return (
|
||
<View style={styles.container}>
|
||
{this.state.displayImage && this.renderDialogImage()}
|
||
{this.state.loadingUpload && this.renderLoader()}
|
||
<View style={{flexDirection: 'row'}}>
|
||
<Icon.Button name={"keyboard-backspace"}
|
||
color={"white"}
|
||
size={24}
|
||
backgroundColor={theme.primary}
|
||
onPress={() => this.props.navigation.pop()}
|
||
/>
|
||
<Text style={styles.bigtitle}>{I18n.t('LAST_STEP')}</Text>
|
||
|
||
</View>
|
||
<ScrollView ref={component => this._scrollView = component} style={styles.container}>
|
||
{/* Sélection du type de compte */}
|
||
|
||
|
||
|
||
|
||
<>
|
||
<Text style={styles.title}>{I18n.t('INFORMATION_FICHE_CIRCUIT')}</Text>
|
||
{/* <View
|
||
style={{
|
||
width: responsiveWidth(90),
|
||
marginTop: 20,
|
||
alignSelf: 'center',
|
||
borderRadius: 10,
|
||
paddingLeft: 20,
|
||
paddingRight: 20,
|
||
backgroundColor: 'white'
|
||
}}>
|
||
<Dropdown
|
||
label="Type de compte"
|
||
data={[
|
||
{ label: "Personne Physique", value: "PP" },
|
||
{ label: "Personne Morale", value: "PM" }
|
||
]}
|
||
onChangeText={(value) => this.setState({ accountType: value })}
|
||
value={accountType}
|
||
/>
|
||
</View> */}
|
||
|
||
|
||
|
||
|
||
|
||
<Animatable.View ref={(comp) => {
|
||
this.societyTypeAnim = comp
|
||
}}>
|
||
<View
|
||
style={{
|
||
width: responsiveWidth(90),
|
||
marginTop: 20,
|
||
alignSelf: 'center',
|
||
borderRadius: 10,
|
||
paddingLeft: 20,
|
||
paddingRight: 20,
|
||
backgroundColor: this.state.accountType && this.state.accountType !== '' ? '#FFE0B2' : 'white'
|
||
}}>
|
||
{console.log("this.state.result.companies_types===>>",this.state.result.companies_types)}
|
||
<Dropdown
|
||
label={`${I18n.t('SOCIETY_TYPE')} *`}
|
||
data={this.state.result !== null ? this.state.result.companies_types : []}
|
||
useNativeDriver={true}
|
||
valueExtractor={(value) => {
|
||
return value
|
||
}}
|
||
labelExtractor={(value) => {
|
||
return value.description
|
||
}}
|
||
onChangeText={(value, index, data) => {
|
||
this.setState({companies_types_selected: value.id});
|
||
this.updateRequiredTaxes(value);
|
||
console.log("value12===>>",value)
|
||
if (value.name ==="PPH"){ this.setState({accountType:"PP"})}else{this.setState({accountType:"PM"})}
|
||
|
||
}}
|
||
/>
|
||
</View>
|
||
</Animatable.View>
|
||
{ accountType === "PP" && (
|
||
<>
|
||
{/* Champ NUMERO CNI (obligatoire) */}
|
||
<Fumi
|
||
iconClass={FontAwesomeIcon}
|
||
iconName={'id-card'}
|
||
label={I18n.t('ID_CARD_NUMBER')}
|
||
iconColor={'#f95a25'}
|
||
style={styles.input}
|
||
value={this.state.cni_number}
|
||
onChangeText={(text) => this.setState({ cni_number: text })}
|
||
/>
|
||
{/* Champ DATE DE NAISSANCE (obligatoire) */}
|
||
{/* <Fumi
|
||
iconClass={FontAwesomeIcon}
|
||
iconName={'calendar'}
|
||
label="Date de naissance *"
|
||
iconColor={'#f95a25'}
|
||
style={styles.input}
|
||
value={this.state.birth_date}
|
||
onChangeText={(text) => this.setState({ birth_date: text })}
|
||
/> */}
|
||
<TouchableOpacity onPress={this.showDatePicker} style={{height: 60,
|
||
marginTop: responsiveHeight(2),
|
||
marginLeft: responsiveWidth(5),
|
||
marginRight: responsiveWidth(5),
|
||
backgroundColor:"white",
|
||
padding: 10,
|
||
borderRadius: 5,}}>
|
||
<View>
|
||
<Text style={{ marginLeft: 5,marginBottom:5 }}>
|
||
{I18n.t('BIRTH_DATE')}
|
||
</Text>
|
||
<View style={{ flexDirection: 'row', alignItems: 'center' }}>
|
||
<FontAwesomeIcon name="calendar" size={20} color="#f95a25" />
|
||
<Text style={{ marginLeft: 10 }}>
|
||
{this.state.birth_date.toLocaleDateString()}
|
||
</Text>
|
||
</View>
|
||
</View>
|
||
</TouchableOpacity >
|
||
{this.state.showDatePicker &&(
|
||
<DateTimePicker
|
||
testID="dateTimePicker"
|
||
value={this.state.birth_date}
|
||
mode="date"
|
||
display="default"
|
||
onChange={this.onChangeDate2}
|
||
/>
|
||
)}
|
||
{/* Champ LIEU DE NAISSANCE (obligatoire) */}
|
||
<Fumi
|
||
iconClass={FontAwesomeIcon}
|
||
iconName={'map-marker'}
|
||
label={I18n.t('BIRTH_PLACE')}
|
||
iconColor={'#f95a25'}
|
||
style={styles.input}
|
||
value={this.state.birth_place}
|
||
onChangeText={(text) => this.setState({ birth_place: text })}
|
||
/>
|
||
{/* Champ PAYS NAISSANCE (obligatoire) */}
|
||
<Fumi
|
||
iconClass={FontAwesomeIcon}
|
||
iconName={'globe'}
|
||
label={I18n.t('BIRTH_COUNTRY')}
|
||
iconColor={'#f95a25'}
|
||
style={styles.input}
|
||
value={this.state.birth_country}
|
||
onChangeText={(text) => this.setState({ birth_country: text })}
|
||
/>
|
||
{/* Champ PAYS NATIONALITE (obligatoire) */}
|
||
<Fumi
|
||
iconClass={FontAwesomeIcon}
|
||
iconName={'flag'}
|
||
label={I18n.t('NATIONALITY_FORM')}
|
||
iconColor={'#f95a25'}
|
||
style={styles.input}
|
||
value={this.state.nationality_country}
|
||
onChangeText={(text) => this.setState({ nationality_country: text })}
|
||
/>
|
||
{/* Champs pour les informations parentales */}
|
||
<Fumi
|
||
iconClass={FontAwesomeIcon}
|
||
iconName={'user'}
|
||
label={I18n.t('MOTHER_LASTNAME')}
|
||
iconColor={'#f95a25'}
|
||
style={styles.input}
|
||
value={this.state.mother_lastname}
|
||
onChangeText={(text) => this.setState({ mother_lastname: text })}
|
||
/>
|
||
<Fumi
|
||
iconClass={FontAwesomeIcon}
|
||
iconName={'user'}
|
||
label={I18n.t('MOTHER_FIRSTNAME')}
|
||
iconColor={'#f95a25'}
|
||
style={styles.input}
|
||
value={this.state.mother_firstname}
|
||
onChangeText={(text) => this.setState({ mother_firstname: text })}
|
||
/>
|
||
<Fumi
|
||
iconClass={FontAwesomeIcon}
|
||
iconName={'user'}
|
||
label={I18n.t('FATHER_LASTNAME')}
|
||
iconColor={'#f95a25'}
|
||
style={styles.input}
|
||
value={this.state.father_lastname}
|
||
onChangeText={(text) => this.setState({ father_lastname: text })}
|
||
/>
|
||
<Fumi
|
||
iconClass={FontAwesomeIcon}
|
||
iconName={'user'}
|
||
label={I18n.t('FATHER_FIRSTNAME')}
|
||
iconColor={'#f95a25'}
|
||
style={styles.input}
|
||
value={this.state.father_firstname}
|
||
onChangeText={(text) => this.setState({ father_firstname: text })}
|
||
/>
|
||
{/* Masquer les champs TECHNICAL AGREMENT et PATENTE */}
|
||
</>
|
||
)}
|
||
|
||
{ accountType === "PM" && (
|
||
<>
|
||
{/* Champ SIGLE (commun aux deux types mais ici on le traite dans le PM) */}
|
||
<Fumi
|
||
iconClass={FontAwesomeIcon}
|
||
iconName={'id-badge'}
|
||
label={I18n.t('SIGNBOARD')}
|
||
iconColor={'#f95a25'}
|
||
style={styles.input}
|
||
value={this.state.signboard}
|
||
onChangeText={(text) => this.setState({ signboard: text })}
|
||
/>
|
||
{/* Champ DATE CREATION (obligatoire) */}
|
||
{/* <Fumi
|
||
iconClass={FontAwesomeIcon}
|
||
iconName={'calendar'}
|
||
label="Date de création *"
|
||
iconColor={'#f95a25'}
|
||
style={styles.input}
|
||
value={this.state.entreprise_creation_date}
|
||
onChangeText={(text) => this.setState({ entreprise_creation_date: text })}
|
||
/> */}
|
||
<TouchableOpacity onPress={this.showDatePicker} style={{height: 60,
|
||
marginTop: responsiveHeight(2),
|
||
marginLeft: responsiveWidth(5),
|
||
marginRight: responsiveWidth(5),
|
||
backgroundColor:"white",
|
||
padding: 10,
|
||
borderRadius: 5,}}>
|
||
<View>
|
||
<Text style={{ marginLeft: 5,marginBottom:5 }}>
|
||
{I18n.t('CREATION_DATE')}
|
||
</Text>
|
||
<View style={{ flexDirection: 'row', alignItems: 'center' }}>
|
||
<FontAwesomeIcon name="calendar" size={20} color="#f95a25" />
|
||
<Text style={{ marginLeft: 10 }}>
|
||
{this.state.entreprise_creation_date.toLocaleDateString()}
|
||
</Text>
|
||
</View>
|
||
</View>
|
||
</TouchableOpacity >
|
||
{this.state.showDatePicker &&(
|
||
<DateTimePicker
|
||
testID="dateTimePicker"
|
||
value={this.state.entreprise_creation_date}
|
||
mode="date"
|
||
display="default"
|
||
onChange={this.onChangeDate}
|
||
/>
|
||
)}
|
||
{/* Ici, on peut conserver TECHNICAL AGREMENT et PATENTE pour PM */}
|
||
<Fumi
|
||
iconClass={FontAwesomeIcon}
|
||
iconName={'file'}
|
||
label={I18n.t('TECHNICAL_APPROVAL')}
|
||
iconColor={'#f95a25'}
|
||
style={styles.input}
|
||
value={this.state.technical_approval}
|
||
onChangeText={(text) => this.setState({ technical_approval: text })}
|
||
/>
|
||
<Fumi
|
||
iconClass={FontAwesomeIcon}
|
||
iconName={'file'}
|
||
label={I18n.t('TRADE_LICENSE')}
|
||
iconColor={'#f95a25'}
|
||
style={styles.input}
|
||
value={this.state.id_patente}
|
||
onChangeText={(text) => this.setState({ id_patente: text })}
|
||
/>
|
||
</>
|
||
)}
|
||
<Animatable.View ref={(comp) => { this.neightborhoodAnim = comp }}>
|
||
{console.log("ICI===>>",this.state.result)}
|
||
{console.log("ICI===>>",this.state.result.neighborhoods)}
|
||
<FilteredList
|
||
items={this.state.result.neighborhoods}
|
||
placeholder={I18n.t('FIND_A_NEIGHBORHOOD')}
|
||
onItemSelect={(selectedItem) => {
|
||
const id = parseInt(selectedItem.id, 10);
|
||
this.setState({ neighborhood: selectedItem.name });
|
||
}}
|
||
/>
|
||
</Animatable.View>
|
||
|
||
{required_taxes_only_single_tax ? (
|
||
|
||
<Animatable.View ref={(comp) => {
|
||
this.ProprierteTypeAnim = comp
|
||
}} >
|
||
{/* <View
|
||
style={{
|
||
marginTop: 20,
|
||
flexDirection: "row",
|
||
paddingRight: 20,
|
||
paddingLeft: 20,
|
||
}}>
|
||
|
||
<View style={{
|
||
width: responsiveWidth(90),
|
||
borderRadius: 10,
|
||
alignSelf: "center",
|
||
backgroundColor: 'white'
|
||
}}>
|
||
<Dropdown
|
||
label={I18n.t('TAXES_SUR_LA_PROPRETE')}
|
||
data={this.state.required_taxes}
|
||
useNativeDriver={true}
|
||
valueExtractor={(value) => {
|
||
return value
|
||
}}
|
||
labelExtractor={(value) => {
|
||
return value.name
|
||
}}
|
||
onChangeText={this.handleTaxSlection}
|
||
/>
|
||
</View>
|
||
</View> */}
|
||
</Animatable.View>
|
||
|
||
) : (
|
||
|
||
this.state.required_taxes.map((element, index) => (
|
||
this.renderRequiredTaxesDropdown(element, index)
|
||
))
|
||
)}
|
||
|
||
{this.renderTaxesDropdown(0)}
|
||
{
|
||
this.state.tabTaxe.map((element, index) => (
|
||
index > 0 &&
|
||
this.renderTaxesDropdown(index)
|
||
))
|
||
}
|
||
|
||
{
|
||
this.state.displayAddTaxeFromOtherNetwork &&
|
||
!_.isEmpty(this.state.dataTaxesPublicite) ?
|
||
this.renderPubliciteTaxesDropdown() : null
|
||
|
||
}
|
||
|
||
|
||
|
||
|
||
|
||
<Animatable.View ref={(comp) => {
|
||
this.activityTypeAnim = comp
|
||
}}>
|
||
|
||
<FilteredList
|
||
items={this.state.result.activities}
|
||
onItemSelect={(selectedItem) => {
|
||
this.setState({activity_type: selectedItem.name});
|
||
}}
|
||
/>
|
||
|
||
</Animatable.View>
|
||
|
||
{/* <Animatable.View ref={(comp) => {
|
||
this.activityTypeAnim = comp
|
||
}}>
|
||
<View
|
||
style={{
|
||
width: responsiveWidth(90),
|
||
marginTop: 20,
|
||
alignSelf: 'center',
|
||
borderRadius: 10,
|
||
paddingLeft: 20,
|
||
paddingRight: 20,
|
||
backgroundColor: 'white'
|
||
}}>
|
||
<Dropdown
|
||
label={I18n.t('TYPE_ACTIVITE')}
|
||
data={this.state.result.activities}
|
||
useNativeDriver={true}
|
||
valueExtractor={(value) => {
|
||
return value
|
||
}}
|
||
labelExtractor={(value) => {
|
||
return value.name
|
||
}}
|
||
onChangeText={(value, index, data) => {
|
||
this.setState({activity_type: value.name});
|
||
console.log("Company", value);
|
||
}}
|
||
/>
|
||
</View>
|
||
</Animatable.View> */}
|
||
|
||
<Animatable.View>
|
||
<Fumi iconClass={FontAwesomeIcon}
|
||
iconName={'lock'}
|
||
label={`${I18n.t('IMMATRICULATION_DGI')}`}
|
||
iconColor={'#f95a25'}
|
||
iconSize={20}
|
||
style={styles.input}
|
||
maxLength={14}
|
||
keyboardType="default"
|
||
autoCapitalize="characters"
|
||
onChangeText={(text) => {
|
||
// Update the identification_number state
|
||
this.setState({
|
||
identification_number: text,
|
||
remainingCharacters: 14 - text.length // Update the remaining characters
|
||
});
|
||
}}/>
|
||
<Text style={{
|
||
color: 'white',
|
||
marginLeft: responsiveWidth(5),
|
||
marginTop: 5
|
||
}}>
|
||
{this.state.remainingCharacters} caractères restants
|
||
</Text>
|
||
</Animatable.View>
|
||
|
||
<Animatable.View>
|
||
<Fumi iconClass={FontAwesomeIcon}
|
||
iconName={'lock'}
|
||
label={I18n.t('REGISTRE_COMMERCE')}
|
||
iconColor={'#f95a25'}
|
||
iconSize={20}
|
||
style={styles.input}
|
||
onChangeText={(text) => {
|
||
this.setState({trade_registry: text})
|
||
}}/>
|
||
</Animatable.View>
|
||
|
||
<Animatable.View>
|
||
<Fumi iconClass={FontAwesomeIcon}
|
||
iconName={'file'}
|
||
label={I18n.t('TECHNICAL_AGREMENT')}
|
||
iconColor={'#f95a25'}
|
||
iconSize={20}
|
||
style={styles.input}
|
||
onChangeText={(text) => {
|
||
this.setState({technical_approval: text})
|
||
}}/>
|
||
</Animatable.View>
|
||
|
||
<Animatable.View ref={(comp) => {
|
||
this.nomResponsableAnim = comp
|
||
}}>
|
||
<Fumi iconClass={FontAwesomeIcon}
|
||
iconName={'user-o'}
|
||
label={`${I18n.t('NOM_RESPONSABLE')} *`}
|
||
iconColor={'#f95a25'}
|
||
iconSize={20}
|
||
style={styles.input}
|
||
onChangeText={(text) => {
|
||
this.setState({responsable_name: text})
|
||
}}
|
||
/>
|
||
</Animatable.View>
|
||
|
||
<Animatable.View ref={(comp) => {
|
||
this.municipalityAnim = comp
|
||
}}>
|
||
<View
|
||
style={{
|
||
width: responsiveWidth(90),
|
||
marginTop: 20,
|
||
alignSelf: 'center',
|
||
borderRadius: 10,
|
||
paddingLeft: 20,
|
||
paddingRight: 20,
|
||
backgroundColor: 'white'
|
||
}}>
|
||
<Dropdown
|
||
label={`${I18n.t("COMMUNE_SIEGE_SOCIAL")} *`}
|
||
data={this.state.result.municipalities}
|
||
useNativeDriver={true}
|
||
disabled={true}
|
||
value={this.state.municipality}
|
||
valueExtractor={(value) => {
|
||
return value
|
||
}}
|
||
labelExtractor={(value) => {
|
||
return value.name
|
||
}}
|
||
onChangeText={(value, index, data) => {
|
||
this.setState({municipality: value.name});
|
||
}}
|
||
/>
|
||
</View>
|
||
</Animatable.View>
|
||
|
||
<Text style={styles.title}>{I18n.t('OTHERS_INFORMATIONS')}</Text>
|
||
|
||
<Animatable.View ref={(comp) => {
|
||
this.districtAnim = comp
|
||
}}>
|
||
<View
|
||
style={{
|
||
width: responsiveWidth(90),
|
||
marginTop: 20,
|
||
alignSelf: 'center',
|
||
borderRadius: 10,
|
||
paddingLeft: 20,
|
||
paddingRight: 20,
|
||
backgroundColor: 'white'
|
||
}}>
|
||
<Dropdown
|
||
label={`${I18n.t('ARRONDISSEMENT')} *`}
|
||
data={this.result.districts}
|
||
useNativeDriver={true}
|
||
disabled={true}
|
||
value={this.state.district}
|
||
valueExtractor={(value) => {
|
||
return value
|
||
}}
|
||
labelExtractor={(value) => {
|
||
return value.name
|
||
}}
|
||
onChangeText={(value, index, data) => {
|
||
this.setState({district: value.name});
|
||
}}
|
||
/>
|
||
</View>
|
||
</Animatable.View>
|
||
|
||
{/* <Animatable.View ref={(comp) => {
|
||
this.neightborhoodAnim = comp
|
||
}}>
|
||
<Fumi iconClass={FontAwesomeIcon}
|
||
iconName={'map-marker'}
|
||
label={`${I18n.t('QUARTIER_COMMUNE')} *`}
|
||
iconColor={'#f95a25'}
|
||
iconSize={20}
|
||
style={styles.input}
|
||
onChangeText={(text) => {
|
||
this.setState({neighborhood: text})
|
||
}}/>
|
||
</Animatable.View> */}
|
||
|
||
|
||
{/* <Animatable.View>
|
||
<Fumi iconClass={FontAwesomeIcon}
|
||
iconName={'file'}
|
||
label={I18n.t('PATENTE')}
|
||
iconColor={'#f95a25'}
|
||
iconSize={20}
|
||
style={styles.input}
|
||
onChangeText={(text) => {
|
||
this.setState({id_patente: text})
|
||
}}/>
|
||
</Animatable.View> */}
|
||
|
||
|
||
<View style={{
|
||
flexDirection: "row",
|
||
paddingLeft: 5,
|
||
paddingRight: 5,
|
||
alignSelf: 'center',
|
||
marginTop: 10,
|
||
width: responsiveWidth(90)
|
||
}}>
|
||
|
||
<View
|
||
style={styles.checkboxContainer}>
|
||
<CheckBox
|
||
value={this.state.TVA}
|
||
onValueChange={value => this.setState({TVA: value})}
|
||
style={styles.checkbox}/>
|
||
<Text style={styles.label}>{I18n.t('TVA')}</Text>
|
||
</View>
|
||
|
||
<View
|
||
style={styles.checkboxContainer}>
|
||
<CheckBox
|
||
onValueChange={value => this.setState({IRPP: value})}
|
||
value={this.state.IRPP}
|
||
style={styles.checkbox}/>
|
||
<Text style={styles.label}>{I18n.t('IRPP')}</Text>
|
||
</View>
|
||
<View
|
||
style={styles.checkboxContainer}>
|
||
<CheckBox
|
||
onValueChange={value => this.setState({licence: value})}
|
||
value={this.state.licence}
|
||
style={styles.checkbox}/>
|
||
<Text style={styles.label}>Licence</Text>
|
||
{console.log("licence===>>",this.state.licence)}
|
||
{console.log("licence===>>",typeof this.state.licence)}
|
||
</View>
|
||
{/* <View
|
||
style={styles.checkboxContainer}>
|
||
<CheckBox
|
||
onValueChange={value => this.setState({year_tax_paid_N: value})}
|
||
value={this.state.year_tax_paid_N}
|
||
style={styles.checkbox}/>
|
||
<Text
|
||
style={styles.label}>{I18n.t('ANNEE_TAXE')} {Number(year.getFullYear() - 1)}</Text>
|
||
</View> */}
|
||
|
||
</View>
|
||
|
||
|
||
{/* <View style={{
|
||
flexDirection: "row",
|
||
paddingLeft: 5,
|
||
paddingRight: 5,
|
||
alignSelf: 'center',
|
||
marginTop: 5,
|
||
width: responsiveWidth(90)
|
||
}}>
|
||
<View
|
||
style={styles.checkboxContainer}>
|
||
<CheckBox
|
||
onValueChange={value => this.setState({year_tax_paid_N_1: value})}
|
||
value={this.state.year_tax_paid_N_1}
|
||
style={styles.checkbox}/>
|
||
<Text
|
||
style={styles.label}>{I18n.t('ANNEE_TAXE')} {Number(year.getFullYear() - 2)}</Text>
|
||
</View>
|
||
</View> */}
|
||
|
||
{/* <View style={{
|
||
flexDirection: "row",
|
||
paddingLeft: 5,
|
||
paddingRight: 5,
|
||
alignSelf: 'center',
|
||
marginTop: 5,
|
||
width: responsiveWidth(90)
|
||
}}>
|
||
<View
|
||
style={styles.checkboxContainer}>
|
||
<CheckBox
|
||
onValueChange={value => this.setState({year_tax_paid_N_2: value})}
|
||
value={this.state.year_tax_paid_N_2}
|
||
style={styles.checkbox}/>
|
||
<Text
|
||
style={styles.label}>{I18n.t('ANNEE_TAXE')} {Number(year.getFullYear() - 3)}</Text>
|
||
</View>
|
||
</View> */}
|
||
</>
|
||
|
||
<Button style={styles.btnvalide} textStyle={styles.textbtnvalide}
|
||
isLoading={this.state.isLoading || this.props.loading}
|
||
onPress={() => {
|
||
this.checkUserGeolocated()
|
||
}}>{this.state.isActif ? I18n.t('CREATE_ACTIF') : I18n.t('CREATE_ACCOUNT')}</Button>
|
||
|
||
</ScrollView>
|
||
<MaterialDialog
|
||
title={'Selecionner un reseau'}
|
||
items={LONG_LIST.map((row, index) => ({value: row, label: row}))}
|
||
visible={this.state.networksinglePickerVisible}
|
||
selectedItem={this.state.singlePickerSelectedItem}
|
||
onCancel={() => this.setState({networksinglePickerVisible: false})}
|
||
onOk={result => {
|
||
this.setState({networksinglePickerVisible: false});
|
||
this.setState({singlePickerSelectedItem: result.selectedItem});
|
||
}}
|
||
>
|
||
<FlatList style={{height: responsiveHeight(40)}}
|
||
data={this.state.networks}
|
||
renderItem={({item}) => this.renderRow(item)}/>
|
||
</MaterialDialog>
|
||
</View>
|
||
)
|
||
|
||
}
|
||
|
||
renderActifAccount() {
|
||
return (
|
||
<View style={styles.container}>
|
||
{this.prepareModal()}
|
||
{this.state.displayImage && this.renderDialogImage()}
|
||
{this.state.loadingUpload && this.renderLoader()}
|
||
{this.state.isDataSubmit && this.renderCreateActifResponse()}
|
||
<View style={{flexDirection: 'row'}}>
|
||
<Icon.Button name={"keyboard-backspace"}
|
||
color={"white"}
|
||
size={24}
|
||
backgroundColor={theme.primary}
|
||
onPress={() => this.props.navigation.pop()}
|
||
/>
|
||
<Text style={styles.bigtitle}>{I18n.t('LAST_STEP')}</Text>
|
||
|
||
</View>
|
||
<ScrollView style={styles.container}>
|
||
|
||
<>
|
||
|
||
<Text style={styles.title}>{I18n.t('INFORMATION_FICHE_CIRCUIT')}</Text>
|
||
|
||
<Animatable.View ref={(comp) => this.nomSocieteAnim = comp}>
|
||
<View
|
||
style={{
|
||
width: responsiveWidth(90),
|
||
marginTop: 20,
|
||
alignSelf: 'center',
|
||
borderRadius: 10,
|
||
paddingLeft: 20,
|
||
paddingRight: 20,
|
||
backgroundColor: 'white'
|
||
}}>
|
||
<Dropdown
|
||
label={I18n.t('NOM_SOCIETE')}
|
||
data={this.state.result !== null ? this.state.result.companies : []}
|
||
useNativeDriver={true}
|
||
valueExtractor={(value) => {
|
||
return value
|
||
}}
|
||
labelExtractor={(value) => {
|
||
return value.name
|
||
}}
|
||
onChangeText={(value, index, data) => {
|
||
this.setState({companies_types_selected: value.id});
|
||
//this.updateRequiredTaxes(value);
|
||
//console.log("Company", value);
|
||
}}
|
||
/>
|
||
</View>
|
||
</Animatable.View>
|
||
|
||
{this.renderTaxesEntreprisesDropdown(0)}
|
||
{
|
||
this.state.tabTaxe.map((element, index) => (
|
||
index > 0 &&
|
||
this.renderTaxesEntreprisesDropdown(index)
|
||
))
|
||
}
|
||
|
||
</>
|
||
|
||
<Button style={styles.btnvalide} textStyle={styles.textbtnvalide}
|
||
isLoading={this.props.isLoading}
|
||
onPress={() => {
|
||
this.setState({isDataSubmit: true});
|
||
this.checkUserGeolocated()
|
||
}}>{this.state.isActif ? I18n.t('CREATE_ACTIF') : I18n.t('CREATE_ACCOUNT')}</Button>
|
||
|
||
</ScrollView>
|
||
<MaterialDialog
|
||
title={'Selecionner un reseau'}
|
||
items={LONG_LIST.map((row, index) => ({value: row, label: row}))}
|
||
visible={this.state.networksinglePickerVisible}
|
||
selectedItem={this.state.singlePickerSelectedItem}
|
||
onCancel={() => this.setState({networksinglePickerVisible: false})}
|
||
onOk={result => {
|
||
this.setState({networksinglePickerVisible: false});
|
||
this.setState({singlePickerSelectedItem: result.selectedItem});
|
||
}}
|
||
>
|
||
<FlatList style={{height: responsiveHeight(40)}}
|
||
data={this.state.networks}
|
||
renderItem={({item}) => this.renderRow(item)}/>
|
||
</MaterialDialog>
|
||
</View>
|
||
|
||
)
|
||
}
|
||
|
||
onRowPress(rowID) {
|
||
this.setState({network: rowID})
|
||
}
|
||
|
||
renderRow = (row) => (
|
||
<TouchableOpacity key={row} onPress={() => this.onRowPress(row)}>
|
||
<View style={styles.rowContainer}>
|
||
<View style={styles.iconContainer}>
|
||
<Icon
|
||
name={this.state.network && row.name === this.state.network.name ? 'radio-button-checked' : 'radio-button-unchecked'}
|
||
color={this.state.network && row.name === this.state.network.name ? theme.accent : this.props.colorAccent}
|
||
size={24}
|
||
/>
|
||
</View>
|
||
<Text style={material.subheading}>{row.name}</Text>
|
||
</View>
|
||
</TouchableOpacity>
|
||
);
|
||
|
||
checkIfAllImagesIsOk(data) {
|
||
let message = "";
|
||
let isOk = true
|
||
data['taxes'].map((taxe) => {
|
||
// console.log("Taxes map", taxe);
|
||
if (taxe.has_image_capture === "1") {
|
||
if (_.isNil(taxe.image)) {
|
||
isOk = false;
|
||
message += `${I18n.t("TAXE_REQUIRED_IMAGE")} ${taxe.name}`
|
||
}
|
||
}
|
||
});
|
||
if (data.hasOwnProperty("secondary_taxes")) {
|
||
data['secondary_taxes'].map((taxe) => {
|
||
console.log("Secondary Taxes map", taxe);
|
||
if (_.isNil(taxe.image)) {
|
||
isOk = false;
|
||
message += `${I18n.t("TAXE_REQUIRED_IMAGE")} ${taxe.name}`
|
||
}
|
||
});
|
||
}
|
||
console.log("Message erreur image", message);
|
||
this.setState({messageRequiredImage: message});
|
||
|
||
return isOk;
|
||
}
|
||
|
||
checkIfAllImagesIsOkForActif(data) {
|
||
let message = "";
|
||
let isOk = true
|
||
data.map((taxe) => {
|
||
console.log("Taxes map", taxe);
|
||
if (taxe.has_image_capture === "1") {
|
||
if (_.isNil(taxe.image)) {
|
||
isOk = false;
|
||
message += `${I18n.t("TAXE_REQUIRED_IMAGE")} ${taxe.name}`
|
||
}
|
||
}
|
||
|
||
});
|
||
this.setState({messageRequiredImage: message});
|
||
|
||
return isOk;
|
||
}
|
||
|
||
submitUsagerOffline(data) {
|
||
getData(usagerToSave).then(resultGet => {
|
||
let usagerArray = new Array();
|
||
console.log("DATA FROM ASYNC STORAGE", resultGet);
|
||
|
||
if (_.isNil(resultGet)) {
|
||
usagerArray.push({
|
||
data,
|
||
isSaved: false
|
||
});
|
||
} else {
|
||
usagerArray = JSON.parse(resultGet);
|
||
if (usagerArray.length <= 10) {
|
||
usagerArray.push({
|
||
data,
|
||
isSaved: false
|
||
});
|
||
}
|
||
}
|
||
|
||
if (usagerArray.length === 10) {
|
||
Alert.alert("", I18n.t("LIMITE_USAGER_LOCAL_ATTEINTE"), [{
|
||
text: "Ok",
|
||
onPress: () => {
|
||
this.props.navigation.popToTop()
|
||
}
|
||
}]);
|
||
} else {
|
||
storeData(usagerToSave, JSON.stringify(usagerArray)).then(() => {
|
||
Alert.alert("", I18n.t("USAGER_SAVED_SUCCESSFULLY"), [{
|
||
text: "Ok",
|
||
onPress: () => {
|
||
this.setState({isLoading: false});
|
||
this.props.navigation.popToTop()
|
||
}
|
||
}])
|
||
});
|
||
}
|
||
});
|
||
}
|
||
|
||
// getTownValue(key, defaultValue = "") {
|
||
// return this.state.town && this.state.town[key] ? this.state.town[key] : defaultValue;
|
||
// }
|
||
checkUserGeolocated() {
|
||
let {myPosition, textaddress, place, indicatif, user, network, phone, phoneTransaction} = this.state;
|
||
this.setState({isLoading: true});
|
||
console.log("isActif===>>", this.state.isActif);
|
||
if (this.state.isActif) {
|
||
let taxes_to_send = [];
|
||
console.log("Taxes to send", this.state.taxes_selected);
|
||
for (let i = 0; i < this.state.tabTaxe.length; i++) {
|
||
if (this.state.taxes_selected[i] !== undefined) {
|
||
if (this.state.taxes_selected[i].has_image_capture === "1") {
|
||
taxes_to_send.push({
|
||
has_image_capture: "1",
|
||
latitude: this.isOffline ? this.state.latitude : this.state.taxes_selected[i].latitude,
|
||
longitude: this.isOffline ? this.state.longitude : this.state.taxes_selected[i].longitude,
|
||
image: this.state.taxes_selected[i].image,
|
||
name: this.state.taxes_selected[i].name,
|
||
id_network_tax: this.state.taxes_selected[i].id,
|
||
tax_units_count: isNil(this.state.tax_units_count[i]) ? null : this.state.tax_units_count[i],
|
||
units_per_tax_unit_count: isNil(this.state.units_per_tax_unit_count[i]) ? null : this.state.units_per_tax_unit_count[i],
|
||
number_of_days: isNil(this.state.number_of_days[i]) ? null : this.state.number_of_days[i],
|
||
neighborhood: this.state.taxes_selected[i].neighborhood,
|
||
district: this.state.taxes_selected[i].district
|
||
});
|
||
} else {
|
||
taxes_to_send.push({
|
||
has_image_capture: "0",
|
||
latitude: this.isOffline ? this.state.latitude : this.state.taxes_selected[i].latitude,
|
||
longitude: this.isOffline ? this.state.longitude : this.state.taxes_selected[i].longitude,
|
||
id_network_tax: this.state.taxes_selected[i].id,
|
||
name: this.state.taxes_selected[i].name,
|
||
tax_units_count: isNil(this.state.tax_units_count[i]) ? null : this.state.tax_units_count[i],
|
||
units_per_tax_unit_count: isNil(this.state.units_per_tax_unit_count[i]) ? null : this.state.units_per_tax_unit_count[i],
|
||
number_of_days: isNil(this.state.number_of_days[i]) ? null : this.state.number_of_days[i],
|
||
neighborhood: this.state.taxes_selected[i].neighborhood,
|
||
district: this.state.taxes_selected[i].district
|
||
});
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
if (this.isOffline) {
|
||
if (this.checkOrShake(this.state.taxes_selected[0], this.taxesAnim)) {
|
||
if ((this.checkOrAlert(this.checkIfArrayValueIsNull(this.state.taxes_selected, 'district'), `${I18n.t("THE_FIELD")} ${I18n.t("DISTRICT")} ${I18n.t("IS_REQUIRED")}`, false))) {
|
||
if (this.checkOrShake(this.state.companies_types_selected, this.nomSocieteAnim, false)) {
|
||
if ((this.checkOrAlert(this.checkIfArrayValueIsNull(this.state.taxes_selected, 'neighborhood'), `${I18n.t("THE_FIELD")} ${I18n.t("NEIGHTBORHOOD")} ${I18n.t("IS_REQUIRED")}`, false))) {
|
||
getData(actifToSave).then(resultGet => {
|
||
let actifArray = new Array();
|
||
console.log("DATA FROM ASYNC STORAGE", resultGet);
|
||
if (_.isNil(resultGet)) {
|
||
actifArray.push({
|
||
data: {
|
||
id_network_super: this.state.result.id_network_super,
|
||
id_company: this.state.companies_types_selected,
|
||
district: this.state.district,
|
||
neighborhood: this.state.neighborhood,
|
||
taxes: taxes_to_send
|
||
},
|
||
isSaved: false
|
||
});
|
||
} else {
|
||
actifArray = JSON.parse(resultGet);
|
||
if (actifArray.length <= 10) {
|
||
actifArray.push({
|
||
data: {
|
||
id_network_super: this.state.result.id_network_super,
|
||
id_company: this.state.companies_types_selected,
|
||
district: this.state.district,
|
||
neighborhood: this.state.neighborhood,
|
||
taxes: taxes_to_send
|
||
},
|
||
isSaved: false
|
||
});
|
||
}
|
||
}
|
||
|
||
if (actifArray.length === 10) {
|
||
Alert.alert("", I18n.t("LIMITE_ACTIF_LOCAL_ATTEINTE"), [{
|
||
text: "Ok",
|
||
onPress: () => {
|
||
this.props.navigation.popToTop();
|
||
}
|
||
}]);
|
||
} else {
|
||
|
||
if (this.checkIfAllImagesIsOkForActif(this.state.taxes_selected)) {
|
||
storeData(actifToSave, JSON.stringify(actifArray)).then(() => {
|
||
Alert.alert("", I18n.t("ACTIF_SAVED_SUCCESSFULLY"), [{
|
||
text: "Ok",
|
||
onPress: () => {
|
||
this.props.navigation.popToTop()
|
||
}
|
||
}])
|
||
});
|
||
} else {
|
||
Alert.alert(I18n.t("ERROR_LABEL"), this.state.messageRequiredImage, [{
|
||
text: "Ok",
|
||
onPress: () => {
|
||
this.setState({isLoading: false});
|
||
}
|
||
}]);
|
||
}
|
||
|
||
}
|
||
});
|
||
} else this.setState({isLoading: false})
|
||
} else this.setState({isLoading: false});
|
||
} else this.setState({isLoading: false});
|
||
} else this.setState({isLoading: false});
|
||
|
||
} else {
|
||
this.props.saveActifSocietyAction({
|
||
id_network_super: this.state.result.id_network_super,
|
||
id_company: this.state.companies_types_selected,
|
||
district: this.state.district,
|
||
neighborhood: this.state.neighborhood,
|
||
taxes: taxes_to_send
|
||
});
|
||
}
|
||
} else {
|
||
|
||
if (user !== undefined) {
|
||
|
||
const addIndicatif = (phone) => {
|
||
const indicatif = "+237";
|
||
return phone.startsWith(indicatif) ? phone : indicatif + phone;
|
||
};
|
||
|
||
var data = {};
|
||
data.tag = "member";
|
||
data.type = "create_geolocated_user";
|
||
data['phone'] = addIndicatif(this.state.data.phone.replace("undefined", ""));
|
||
data['phone_transaction'] = addIndicatif(this.state.data.phone_transaction.replace("undefined", ""));
|
||
data['network'] = this.state.data.network;
|
||
data['id_network_tax'] = this.state.data.network.id;
|
||
data['town'] = this.isOffline ? null : this.state.town;
|
||
if (this.state.town && typeof this.state.town === 'object') {
|
||
data['town'] = {
|
||
name: this.state.municipality || "",
|
||
id: this.state.town.id || "",
|
||
indicatif: "+237" || "",
|
||
districts: Array.isArray(this.state.result.districts) ? this.state.result.districts : []
|
||
};
|
||
} else {
|
||
data['town'] = null;
|
||
}
|
||
// Utilisation :
|
||
// data['town'] = {
|
||
// name: this.getTownValue('name'),
|
||
// id: this.getTownValue('id'),
|
||
// indicatif: this.getTownValue('indicatif'),
|
||
// districts: this.getTownValue('districts', [])
|
||
// };
|
||
|
||
let taxes_to_send = [];
|
||
for (let i = 0; i < this.state.tabTaxe.length; i++) {
|
||
if (this.state.taxes_selected[i] !== undefined) {
|
||
if (this.state.taxes_selected[i].has_image_capture === "1") {
|
||
taxes_to_send.push({
|
||
has_image_capture: "1",
|
||
image: this.state.taxes_selected[i].image,
|
||
name: this.state.taxes_selected[i].name,
|
||
id_network_tax: this.state.taxes_selected[i].id,
|
||
number_of_days: isNil(this.state.number_of_days[i]) ? null : this.state.number_of_days[i],
|
||
tax_units_count: isNil(this.state.tax_units_count[i]) ? null : this.state.tax_units_count[i],
|
||
units_per_tax_unit_count: isNil(this.state.units_per_tax_unit_count[i]) ? null : this.state.units_per_tax_unit_count[i],
|
||
building_value: isNil(this.state.building_value[i]) ? null : this.state.building_value[i],
|
||
built: isNil(this.state.built[i]) ? null : this.state.built[i],
|
||
});
|
||
} else {
|
||
taxes_to_send.push({
|
||
has_image_capture: "0",
|
||
id_network_tax: this.state.taxes_selected[i].id,
|
||
name: this.state.taxes_selected[i].name,
|
||
number_of_days: isNil(this.state.number_of_days[i]) ? null : this.state.number_of_days[i],
|
||
tax_units_count: isNil(this.state.tax_units_count[i]) ? null : this.state.tax_units_count[i],
|
||
units_per_tax_unit_count: isNil(this.state.units_per_tax_unit_count[i]) ? null : this.state.units_per_tax_unit_count[i],
|
||
building_value: isNil(this.state.building_value[i]) ? null : this.state.building_value[i],
|
||
built: isNil(this.state.built[i]) ? null : this.state.built[i],
|
||
});
|
||
}
|
||
}
|
||
}
|
||
|
||
if (this.state.publicites_taxes !== null) {
|
||
let publicites_taxes = new Array();
|
||
publicites_taxes.push({
|
||
...this.state.publicites_taxes,
|
||
id_network_tax: this.state.publicites_taxes.id
|
||
});
|
||
data['secondary_taxes'] = publicites_taxes;
|
||
}
|
||
|
||
data['taxes'] = taxes_to_send;
|
||
data['required_taxes'] = this.state.required_taxes.filter((element, i) => element.id_network_tax === this.state.selectedTax?.id)
|
||
//data['required_taxes'] = this.state.required_taxes;
|
||
data['id_company_type'] = this.state.companies_types_selected;
|
||
data['identification_number'] = this.state.identification_number;
|
||
data['trade_registry'] = this.state.trade_registry;
|
||
data['responsable_name'] = this.state.responsable_name;
|
||
data['technical_approval'] = this.state.technical_approval;
|
||
data['municipality'] = this.state.municipality;
|
||
data['municipality'] = this.state.municipality;
|
||
data['neighborhood'] = this.state.neighborhood;
|
||
data['district'] = this.state.district;
|
||
data['id_patente'] = this.state.id_patente;
|
||
data['TVA'] = this.state.TVA;
|
||
data['IRPP'] = this.state.IRPP;
|
||
data['licence'] = this.state.licence;
|
||
data['activity_type'] = this.state.activity_type;
|
||
data['year_tax_paid_N_1'] = this.state.year_tax_paid_N;
|
||
data['year_tax_paid_N_2'] = this.state.year_tax_paid_N_1;
|
||
data['year_tax_paid_N_3'] = this.state.year_tax_paid_N_2;
|
||
data['latitude'] = this.state.data.latitude;
|
||
data['longitude'] = this.state.data.longitude;
|
||
data['player_id'] = this.state.player_id;
|
||
data['accountType'] = this.state.accountType;
|
||
|
||
data['cni_number'] = this.state.cni_number;
|
||
data['birth_date'] = this.state.birth_date;
|
||
data['birth_place'] = this.state.birth_place;
|
||
data['birth_country'] = this.state.birth_country;
|
||
data['nationality_country'] = this.state.nationality_country;
|
||
data['father_lastname'] = this.state.father_lastname;
|
||
data['father_firstname'] = this.state.father_firstname;
|
||
data['mother_lastname'] = this.state.mother_lastname;
|
||
data['mother_firstname'] = this.state.mother_firstname;
|
||
|
||
data['signboard'] = this.state.signboard;
|
||
data['entreprise_creation_date'] = this.state.entreprise_creation_date;
|
||
for (let i in user) {
|
||
data[i] = user[i];
|
||
}
|
||
data['category'] = user.category;
|
||
|
||
data['active'] = '0';
|
||
// Ajout de la logique conditionnelle pour vider les champs en fonction du type de compte.
|
||
if (this.state.accountType === "PP") {
|
||
// Pour une personne physique, on s'assure que les champs spécifiques à une personne morale soient à null.
|
||
data['signboard'] = null;
|
||
data['entreprise_creation_date'] = null;
|
||
data['technical_approval'] = null;
|
||
data['id_patente'] = null;
|
||
} else if (this.state.accountType === "PM") {
|
||
// Pour une personne morale, on met à null les champs spécifiques à une personne physique.
|
||
data['cni_number'] = null;
|
||
data['birth_date'] = null;
|
||
data['birth_place'] = null;
|
||
data['birth_country'] = null;
|
||
data['nationality_country'] = null;
|
||
data['father_lastname'] = null;
|
||
data['father_firstname'] = null;
|
||
data['mother_lastname'] = null;
|
||
data['mother_firstname'] = null;
|
||
}
|
||
console.log("DATA TO SEND CONVERT", data);
|
||
|
||
let idsNetworksGroup1 = ["15", "16", "21", "17"];
|
||
let idsNetworksGroup3 = ["14"];
|
||
const isPP = this.state.accountType === "PP";
|
||
const isPM = this.state.accountType === "PM";
|
||
|
||
if (this.isOffline) {
|
||
console.log("STATE", this.state);
|
||
|
||
if (
|
||
((this.state.data.network.id !== "15") &&
|
||
this.checkOrAlert(
|
||
this.state.taxes_selected[0],
|
||
`${I18n.t("THE_FIELD")} ${I18n.t("TAXE")} ${I18n.t("IS_REQUIRED")}`,
|
||
true
|
||
)) ||
|
||
((this.state.data.network.id === "15") &&
|
||
!this.checkOrAlert(
|
||
this.state.taxes_selected[0],
|
||
`${I18n.t("TAXE")} ${I18n.t("IS_REQUIRED")}`,
|
||
true
|
||
))
|
||
) {
|
||
if (this.checkOrAlert(
|
||
this.state.companies_types_selected,
|
||
`${I18n.t("THE_FIELD")} ${I18n.t("SOCIETY_TYPE")} ${I18n.t("IS_REQUIRED")}`,
|
||
true
|
||
)) {
|
||
if (
|
||
(this.state.data.network.id !== "14") &&
|
||
this.checkOrAlert(
|
||
this.state.activity_type,
|
||
`${I18n.t("THE_FIELD")} ${I18n.t("TYPE_ACTIVITE")} ${I18n.t("IS_REQUIRED")}`,
|
||
false
|
||
)) {
|
||
if (
|
||
(this.state.data.network.id !== "14") &&
|
||
this.checkOrAlert(
|
||
this.state.municipality,
|
||
`${I18n.t("THE_FIELD")} ${I18n.t("MUNICIPALITY")} ${I18n.t("IS_REQUIRED")}`,
|
||
false
|
||
)) {
|
||
if (this.checkOrAlert(
|
||
this.state.responsable_name,
|
||
`${I18n.t("THE_FIELD")} ${I18n.t("NOM_RESPONSABLE")} ${I18n.t("IS_REQUIRED")}`,
|
||
false
|
||
)) {
|
||
if (this.checkOrAlert(
|
||
this.state.district,
|
||
`${I18n.t("THE_FIELD")} ${I18n.t("DISTRICT")} ${I18n.t("IS_REQUIRED")}`,
|
||
false
|
||
)) {
|
||
if (this.checkOrAlert(
|
||
this.state.neighborhood,
|
||
`${I18n.t("THE_FIELD")} ${I18n.t("NEIGHTBORHOOD")} ${I18n.t("IS_REQUIRED")}`,
|
||
false
|
||
)) {
|
||
|
||
/* ---------- NOUVEAUX CHAMPS OBLIGATOIRES ---------- */
|
||
const isPP = this.state.accountType === "PP";
|
||
const isPM = this.state.accountType === "PM";
|
||
console.log("isPP isPM", this.state.accountType, isPP, isPM);
|
||
|
||
if (
|
||
(isPP && // Personne Physique
|
||
this.checkOrAlert(
|
||
this.state.birth_date,
|
||
`${I18n.t("THE_FIELD")} ${I18n.t("BIRTH_DATE")} ${I18n.t("IS_REQUIRED")}`,
|
||
false
|
||
) &&
|
||
this.checkOrAlert(
|
||
this.state.birth_place,
|
||
`${I18n.t("THE_FIELD")} ${I18n.t("BIRTH_PLACE")} ${I18n.t("IS_REQUIRED")}`,
|
||
false
|
||
) &&
|
||
this.checkOrAlert(
|
||
this.state.birth_country,
|
||
`${I18n.t("THE_FIELD")} ${I18n.t("BIRTH_COUNTRY")} ${I18n.t("IS_REQUIRED")}`,
|
||
false
|
||
) &&
|
||
this.checkOrAlert(
|
||
this.state.nationality_country,
|
||
`${I18n.t("THE_FIELD")} ${I18n.t("NATIONALITY_FORM")} ${I18n.t("IS_REQUIRED")}`,
|
||
false
|
||
) &&
|
||
this.checkOrAlert(
|
||
this.state.mother_lastname,
|
||
`${I18n.t("THE_FIELD")} ${I18n.t("MOTHER_LASTNAME")} ${I18n.t("IS_REQUIRED")}`,
|
||
false
|
||
) &&
|
||
this.checkOrAlert(
|
||
this.state.father_lastname,
|
||
`${I18n.t("THE_FIELD")} ${I18n.t("FATHER_LASTNAME")} ${I18n.t("IS_REQUIRED")}`,
|
||
false
|
||
)
|
||
) ||
|
||
(isPM && // Personne Morale
|
||
this.checkOrAlert(
|
||
this.state.signboard,
|
||
`${I18n.t("THE_FIELD")} ${I18n.t("SIGNBOARD")} ${I18n.t("IS_REQUIRED")}`,
|
||
false
|
||
)
|
||
)
|
||
) {
|
||
/* ---------- VALIDATIONS OK, ON CONTINUE ---------- */
|
||
|
||
if (this.checkIfAllImagesIsOk(data)) {
|
||
if (!this.state.addNewTaxeOdtp) {
|
||
if (this.state.data.network.id === "18") {
|
||
Alert.alert(
|
||
"",
|
||
I18n.t("DO_YOU_WANT_TO_ADD_ANOTHER_TAXES"),
|
||
[
|
||
{
|
||
text: I18n.t("YES"),
|
||
onPress: () => {
|
||
getData(supervisorCode).then(codeSupervisor => {
|
||
if (_.isNil(codeSupervisor)) {
|
||
Alert.alert(
|
||
I18n.t("ERROR_LABEL"),
|
||
I18n.t("DATA_NOT_SYNCHRONISED_WITH_SERVER"),
|
||
[
|
||
{
|
||
text: I18n.t("NO"),
|
||
onPress: () => BackHandler.exitApp()
|
||
},
|
||
{
|
||
text: I18n.t("YES"),
|
||
onPress: () => this.setState({displayLoader: true})
|
||
}
|
||
],
|
||
{cancelable: false}
|
||
);
|
||
} else {
|
||
const codeSupervisorsData = JSON.parse(codeSupervisor);
|
||
let dataTaxesPublicite = {};
|
||
Object.entries(codeSupervisorsData).forEach(entry => {
|
||
if (entry[1].network.id === "19") {
|
||
dataTaxesPublicite = entry[1];
|
||
}
|
||
});
|
||
this.setState({dataTaxesPublicite});
|
||
}
|
||
});
|
||
|
||
this.setState({
|
||
addNewTaxeOdtp: true,
|
||
displayAddTaxeFromOtherNetwork: true,
|
||
isLoading: false
|
||
});
|
||
this._scrollView.scrollTo(0);
|
||
}
|
||
},
|
||
{
|
||
text: I18n.t("NO"),
|
||
onPress: () => this.submitUsagerOffline(data)
|
||
}
|
||
]
|
||
);
|
||
} else {
|
||
this.submitUsagerOffline(data);
|
||
}
|
||
} else {
|
||
if (this.checkOrAlert(
|
||
this.state.publicites_taxes,
|
||
`${I18n.t("THE_FIELD")} ${I18n.t("TAXES_SUR_LA_PUBLICITE")} ${I18n.t("IS_REQUIRED")}`,
|
||
true
|
||
)) {
|
||
this.submitUsagerOffline(data);
|
||
} else {
|
||
this.setState({isLoading: false});
|
||
}
|
||
}
|
||
} else {
|
||
Alert.alert(
|
||
I18n.t("ERROR_LABEL"),
|
||
I18n.t("TAXES_REQUIRED_IMAGE"),
|
||
[{
|
||
text: "Ok",
|
||
onPress: () => this.setState({isLoading: false})
|
||
}]
|
||
);
|
||
}
|
||
|
||
} else {
|
||
this.setState({isLoading: false}); // PP / PM manquant
|
||
}
|
||
|
||
} else this.setState({isLoading: false}); // neighborhood
|
||
} else this.setState({isLoading: false}); // district
|
||
} else this.setState({isLoading: false}); // responsable_name
|
||
} else this.setState({isLoading: false}); // municipality
|
||
} else this.setState({isLoading: false}); // activity_type
|
||
} else this.setState({isLoading: false}); // companies_types_selected
|
||
} else this.setState({isLoading: false}); // taxes_selected[0]
|
||
|
||
} else {
|
||
console.log("here===>>",JSON.stringify(data, null, 2));
|
||
createGeolocatedAccount(data).then((result) => {
|
||
console.log("here2===>>",result);
|
||
if (result.success !== undefined && result.success === 1) {
|
||
const message = result.category === 'super' ? I18n.t("HYPERVISOR_MUST_VALIDATE_SUPERVISOR")
|
||
: I18n.t("ACCOUNT_SUCCESSFULL_CREATED")
|
||
Alert.alert("", message, [{
|
||
text: "Ok",
|
||
onPress: () => {
|
||
this.props.navigation.popToTop()
|
||
}
|
||
}]);
|
||
setTimeout(() => {
|
||
this.setState({isLoading: false})
|
||
|
||
}, 1000)
|
||
this.props.navigator.push({
|
||
screen: route.login
|
||
})
|
||
this.setState({isLoading: false})
|
||
} else {
|
||
|
||
if (result.error !== undefined) {
|
||
switch (result.error) {
|
||
case -3:
|
||
Alert.alert("", I18n.t('UNABLE_TO_CREATE_ACCOUNT'), [{
|
||
text: "Ok",
|
||
onPress: () => {
|
||
}
|
||
}])
|
||
break;
|
||
default:
|
||
if (result.error_msg)
|
||
Alert.alert("", result.error_msg, [{
|
||
text: "Ok",
|
||
onPress: () => {
|
||
}
|
||
}])
|
||
else if (result.sql_error)
|
||
Alert.alert(I18n.t('UNABLE_TO_CREATE_ACCOUNT'), result.sql_error, [{
|
||
text: "Ok",
|
||
onPress: () => {
|
||
}
|
||
}])
|
||
}
|
||
this.setState({isLoading: false})
|
||
}
|
||
}
|
||
}).catch((error) => {
|
||
this.setState({isLoading: false})
|
||
});
|
||
}
|
||
} else {
|
||
this.setState({isLoading: false})
|
||
|
||
}
|
||
}
|
||
}
|
||
|
||
checkOrShake(champ, view, scroll = false) {
|
||
let res = !_.isNil(champ);
|
||
console.log("CheckOrShake field condition", res, "Animatable view", view, "scrollTo", scroll);
|
||
if (!res) {
|
||
|
||
if (view !== undefined)
|
||
view.shake(800);
|
||
}
|
||
|
||
if (scroll)
|
||
this._scrollView.scrollTo(0);
|
||
return res;
|
||
}
|
||
|
||
checkOrAlert(champ, message, scroll = false) {
|
||
let res = !_.isNil(champ);
|
||
if (!res) {
|
||
Alert.alert(I18n.t("ERROR_LABEL"), message, [{
|
||
text: "Ok",
|
||
onPress: () => {
|
||
this.setState({isLoading: false});
|
||
}
|
||
}]);
|
||
}
|
||
|
||
if (scroll)
|
||
this._scrollView.scrollTo(0);
|
||
return res;
|
||
}
|
||
|
||
checkIfArrayValueIsNull(tab, key) {
|
||
let size = 0;
|
||
tab.map((value) => {
|
||
if (!_.isNil(value[key]))
|
||
size++;
|
||
});
|
||
if (size === tab.length)
|
||
return " ";
|
||
else
|
||
return null;
|
||
}
|
||
|
||
prepareModal() {
|
||
return (<MaterialDialog
|
||
visible={this.state.modalVisible}
|
||
title={I18n.t("LOADING_INFO")}
|
||
>
|
||
<View style={{justifyContent: 'center', alignItems: 'center'}}>
|
||
<Text>{I18n.t("LOADING_DESCRIPTION_COUNTRY")}</Text>
|
||
<ProgressBarAndroid/>
|
||
</View>
|
||
</MaterialDialog>)
|
||
}
|
||
|
||
render() {
|
||
return (
|
||
<>
|
||
{this.state.isActif ?
|
||
this.renderActifAccount()
|
||
: this.renderUserGeoAccount()}
|
||
</>
|
||
)
|
||
|
||
}
|
||
|
||
}
|
||
|
||
const
|
||
maptStateToProps = state => ({
|
||
loading: state.saveActifSocietyReducer.loading,
|
||
result: state.saveActifSocietyReducer.result,
|
||
error: state.saveActifSocietyReducer.error,
|
||
});
|
||
|
||
const
|
||
mapDispatchToProps = dispatch => bindActionCreators({
|
||
saveActifSocietyAction,
|
||
saveActifSocietyReset,
|
||
|
||
}, dispatch);
|
||
|
||
export default connect(maptStateToProps, mapDispatchToProps)
|
||
|
||
(
|
||
CreateUserStep
|
||
)
|
||
;
|
||
|
||
const
|
||
LONG_LIST = [
|
||
'List element 1',
|
||
'List element 2',
|
||
|
||
'List element 5',
|
||
'List element 6',
|
||
'List element 7',
|
||
'List element 8',
|
||
,
|
||
];
|
||
|
||
const
|
||
styles = StyleSheet.create({
|
||
rowContainer: {
|
||
height: 52,
|
||
flex: 1,
|
||
flexDirection: 'row',
|
||
justifyContent: 'flex-start',
|
||
alignItems: 'center',
|
||
},
|
||
iconContainer: {
|
||
marginRight: 16,
|
||
},
|
||
container: {
|
||
flex: 1,
|
||
backgroundColor: theme.primary,
|
||
},
|
||
checkboxContainer: {
|
||
flexDirection: "row",
|
||
marginBottom: 20,
|
||
},
|
||
checkbox: {
|
||
alignSelf: "center",
|
||
color: "white"
|
||
},
|
||
label: {
|
||
margin: 8,
|
||
color: "white"
|
||
},
|
||
textbtnvalide: {
|
||
color: 'white',
|
||
fontWeight: 'bold'
|
||
},
|
||
bigtitle: {
|
||
color: 'white',
|
||
fontSize: 20,
|
||
flex: 1,
|
||
fontWeight: 'bold',
|
||
textAlign: 'center',
|
||
margin: 20,
|
||
},
|
||
subbigtitle: {
|
||
color: 'white',
|
||
fontSize: 17,
|
||
textAlign: 'center',
|
||
margin: 5,
|
||
},
|
||
title: {
|
||
fontSize: 22,
|
||
fontWeight: 'bold',
|
||
margin: 10,
|
||
color: 'white'
|
||
},
|
||
map: {
|
||
height: 200,
|
||
marginRight: responsiveWidth(5),
|
||
marginLeft: responsiveWidth(5),
|
||
marginVertical: 10,
|
||
},
|
||
btnvalide: {
|
||
marginTop: 20,
|
||
marginLeft: 20,
|
||
marginRight: 20,
|
||
borderColor: 'transparent',
|
||
backgroundColor: theme.accentLight,
|
||
height: 52
|
||
},
|
||
input: {
|
||
height: 60,
|
||
marginTop: responsiveHeight(2),
|
||
marginLeft: responsiveWidth(5),
|
||
marginRight: responsiveWidth(5),
|
||
borderRadius: 5,
|
||
},
|
||
contentPicker: {
|
||
padding: 10,
|
||
borderRadius: 8,
|
||
flex: 1,
|
||
alignItems: "center"
|
||
},
|
||
contain: {flexDirection: "row"},
|
||
thumb: {
|
||
borderRadius: 30,
|
||
marginRight: 10
|
||
},
|
||
point: {
|
||
width: 25,
|
||
height: 25,
|
||
borderRadius: 11,
|
||
alignItems: "center",
|
||
justifyContent: "center",
|
||
position: "absolute",
|
||
right: 9,
|
||
bottom: 0
|
||
},
|
||
})
|