3404 lines
121 KiB
JavaScript
3404 lines
121 KiB
JavaScript
import CheckBox from '@react-native-community/checkbox';
|
||
import DateTimePicker from '@react-native-community/datetimepicker';
|
||
import Button from 'apsl-react-native-button';
|
||
import axios from 'axios';
|
||
import _ from 'lodash';
|
||
import isNil from 'lodash/isNil';
|
||
import React from 'react';
|
||
import {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 4',
|
||
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,
|
||
},
|
||
});
|