import moment from 'moment';

import PropTypes from 'prop-types';

import React, { Component } from 'react';
import {
Image,
Platform,
StatusBar,
Text,
BackHandler,
StyleSheet,
TouchableOpacity,
View,
TextInput,
NativeEventEmitter,
} from 'react-native';
import Autocomplete from 'react-native-autocomplete-input';
import CheckBox from '@react-native-community/checkbox'
import { DatePickerDialog } from 'react-native-datepicker-dialog';
import { RadioButton } from '../../components/RadioButton/RadioButton';
import DropDownPicker from 'react-native-dropdown-picker';
import { Icon, Tooltip } from 'react-native-elements';
import { FloatingLabelInput } from 'react-native-floating-label-input';
import RNFS from 'react-native-fs';
import { ScrollView } from 'react-native-gesture-handler';
import { zip } from 'react-native-zip-archive';
import { compose, withProps } from 'recompose';
import { baseURL, uatURL } from '../../../baseURL';
import { selectPDF1, zipFileDisbursementUpload, uploadDocument } from
'../../../uploadImageUtils';
import { TELEPHONE_REGEX, NUMBER_REGEX, CONSUMER_NO_REGEX, PINCODE_REGEX,
NAME_REGEX, AADHAR_REGEX, customerName_REGEX, PASSPORT_REGEX, DLNO_REGEX,
EPICNO_REGEX } from '../../../validations ';
import { Button } from '../../components/Button/Button';
import { DottedProgressBar } from
'../../components/DottedProgressBar/DottedProgressBar';
import { Header } from '../../components/Header/Header';
import { WaveBackground } from '../../components/WaveBackground/WaveBackground';
import * as colors from '../../constants/colors';
import { PANAndGSTVerificationStyles } from
'../PANAndGSTVerification/PANAndGSTVerificationStyles';
import {
BLUE_PLUS_ICON,
DOWN_ARROW,
MINUS_ICON,
UP_ARROW,
VERIFIED_TICK,
} from '../../constants/imgConsts';
import { ADDITIONAL_DETAILS_CONST, STATES } from '../../constants/screenConst';
import { FONT_SIZE, APP_FONTS } from '../../constants/styleConfig'
import container from '../../container/AdditionalDetails/index';
import { AdditionalDetailsStyles } from './AdditionalDetailsStyles';
import { handleError, handleSuccess, handleWarning } from '../../../utils';
import CheckBoxComponent from
'../../components/CheckBoxComponent/CheckBoxComponent';
import MyIntentModule from './MyIntentModule';
import { FirstExternalServerApi, SecondExternalServerApi,
externalServerGetResponseXmlApi } from '../../api/AdditionalDetails';
class AdditionalDetails extends Component {
constructor(props) {
super(props);
this.eventEmitter = new NativeEventEmitter(MyIntentModule);

this.state = {
additionalOptions: [
{
registeredAddress: [
{ residentialAddressCollapsed: false },
{ addUtilityBillsCollapsed: true },
],
},
],
sourceValue: [
{
title: 'Yes',
isSelected: false,
},
{
title: 'No',
isSelected: false,
},
],

aatharAuthenticationTypeList: [
{
title: 'OTP',
isSelected: false,
},
{
title: 'OCR',
isSelected: false,
},
{
title: 'Face',
isSelected: false,
},
{
title: 'Fingerprint',
isSelected: false,
},
],
isOtpRadioButtonVisible:false,
isOcrRadioButtonVisible:false,
isFaceRadioButtonVisible:false,
isFingerRadioButtinVisible:false,
applicantIndex: this.props.navigation.state.params.index,
selectedSourceValue: '',
otpVisibile: false,
otp: '',
requestId: '',
aadharAuthentication: '',
aadharAuthenticationType: '',
aadharDateOfBirth: '',
aadharDateOfBirthText: '',
kycFiledsEditableFreeze: false,
kycDocumentMandatory: false,
dropDownRelation: [{
label: "Self",
 value: "Self"
}, {
label: "Father",
value: "Father"
}, {
label: "Mother",
value: "Mother"
}, {
label: "Brother",
value: "Brother"
},
{
label: "Sister",
value: "Sister"
},
{
label: "Spouse",
value: "Spouse"
},
{
label: "Son",
value: "Son"
},
{
label: "Daughter",
value: "Daughter"
},
{
label: "Grandfather",
value: "Grandfather"
},
{
label: "Grandmother",
value: "Grandmother"
},
{
label: "Uncle",
value: "Uncle"
},
{
label: "Other",
value: "Other"
},
],
selectedRelation: {
value: null,
label: null,
},
dealerName: '',
karzaDataFlag: null,
karzaName: '',
permanentKarzaDataFlag: null,
pangstDocType: '',
kycData: false,
utilityBillData: false,
permanantAddressData: false,
permanantResiAddressData: false,
employmentData: false,
officeData: false,
contactData: false,
addressLine1: {
value: '',
},
addressLine2: {
value: '',
},
landmark1: {
value: '',
},
landmark2: {
value: '',
},
pincode: {
value: '',
isValid: true,
},
sourceType: [
// {
// title: 'Director',
// isSelected: false,
// },
{
title: 'Partner',
isSelected: false,
},
{
title: 'Proprietor',
isSelected: false,
},
// {
// title: 'Authorized Signatory',
// isSelected: false,
// },
// {
// title: 'Other',
// isSelected: false,
// },
],
utilityBillAuthResponseStatus: false,
selectedSourceType: '',
radioOther: '',
city: '',
// state: '',
state: {
value: null,
label: null,
},
cityVerified: true,
stateVerified: true,
year: '',
selectedMonth: {
value: null,
label: null,
},
dropDownResidentType: [],
dropdownKyc: [],
dropDownResidentType1: [],
dropdownDocType: [],
dropdownOfficeDocType: [],
dropdownPerDocType: [],
dropdownServiceProvider: [
{ "id": 1, "label": "Adani Gas Limited(AG)", "value": "AG", },
{ "id": 2, "label": "Indraprastha Gas Limited(IG)", "value": "IG" },
{ "id": 3, "label": "Mahanagar Gas Limited(MG)", "value": "MG" },
],

selectedResidentType: {
value: null,
label: null,
},
selectedOfficeType: {
value: null,
label: null,
},
selectedOfficeDocType: {
value: null,
label: null,
},
selectedDocType: 'adhar',
adharID: '',
adharIdValid: true,
addharName: '',
adharNameValid: true,
gender: '',
adharDOB: '',
fileNumber: '',
fileNumberValid: true,
dateOfBirth: null,
dateOfBirthText: '',
dlNo: '',
dlNoValid: true,
lpgValid: true,
selectedUtilityBill: '',
serviceProvider: {
value: null,
label: null,
code: null
},
consumerName: '',
consumerNameValid: true,
consumerNumber: '',
consumerNumberValid: true,
cityNameUtility: '',
landlineNumber: '',
stdCode: '',
cityNamePermanent: '',
landlineNumberPermanent: '',
stdCodePermanent: '',

utilityServiceProvider: {
value: null,
label: null,
},
utilityEpicNo: '',
utilityEpicNoValid: true,
utilityFileNumber: '',
utilityFileNumberValid: true,
utilityDateOfBirth: null,
utilityDateOfBirthText: '',
utilityDlNo: '',
utilityDlNoValid: true,
utilityCity: '',
utilityCityValid: true,
utilityTelephoneNo: '',
utilityTelephoneNoValid: true,

additionalDetailOptions: {
registeredCollapsed: false,
permanentAddressCollapsed: false,
permanentResidenceAddrCollapsed: true,
employementDetailsCollapsed: true,
officeAddressCollapsed: false,
additionalContactCollapsed: true,
},

dropDownMonth: [
{ value: 0, label: '0' },
{ value: 1, label: '1' },
{ value: 2, label: '2' },
{ value: 3, label: '3' },
{ value: 4, label: '4' },
{ value: 5, label: '5' },
{ value: 6, label: '6' },
{ value: 7, label: '7' },
{ value: 8, label: '8' },
{ value: 9, label: '9' },
{ value: 10, label: '10' },
{ value: 11, label: '11' },
],
imageData: {
front: {
uri: '',
data: '',
},
back: {
uri: '',
data: '',
},
},
imageDataUtility: {
front: {
uri: '',
data: '',
},
back: {
uri: '',
data: '',
},
},
imageDataPermanent: {
front: {
uri: '',
data: '',
}
},
imageDataCurrent: {
 front: {
uri: '',
data: '',
},
back: {
uri: '',
data: '',
},
},
utilityAddressType: {
value: '',
isValid: null,
},
utilityAddressLine1: {
value: '',
},
utilityLandmark1: {
value: '',
},
utilityLandmark2: {
value: '',
},
utilityAddressLine2: {
value: '',
},
utilityPincode: {
value: '',
isValid: true,
},
utilityCity: '',
utilityState: {
value: null,
label: '',
},
utilityCityVerified: true,
utilityStateVerified: true,
residenceFlag: false,
utilitySelectedResidentType: {
value: null,
label: null,
},
leadCode:
(this.props.navigation &&
this.props.navigation.state &&
this.props.navigation.state.params &&
this.props.navigation.state.params.leadCode) ||
(this.props.newLeadDataSelector &&
this.props.newLeadDataSelector.newLead &&
this.props.newLeadDataSelector.newLead.leadCode) ||
'',
leadName:
(this.props.navigation &&
this.props.navigation.state &&
this.props.navigation.state.params &&
this.props.navigation.state.params.leadName) ||
(this.props.newLeadDataSelector &&
this.props.newLeadDataSelector.newLead &&
this.props.newLeadDataSelector.newLead.leadName) ||
'',
 applicantUniqueId:
(this.props.navigation &&
this.props.navigation.state &&
this.props.navigation.state.params &&
this.props.navigation.state.params.applicantUniqueId) ||
(this.props.newLeadDataSelector &&
this.props.newLeadDataSelector.newLead &&
this.props.newLeadDataSelector.newLead.applicantUniqueId) ||
'',
mobileNumberFromProps:
(this.props.navigation &&
this.props.navigation.state &&
this.props.navigation.state.params &&
this.props.navigation.state.params.mobileNumber) ||
'',
currentAddressVisible:
this?.props?.navigation?.state?.params?.currentAddressVisible || false,
epicNo: '',
epicNoValid: true,
isSelected: false,
isSelected1: false,
imageDataPermanent: {
front: {
uri: '',
data: '',
},
back: {
uri: '',
data: '',
}
},
permanentAddress1: {
value: '',
},
permanentAddress2: {
value: '',
},
permanentLandmark1: {
value: '',
},
permanentLandmark2: {
value: '',
},
permanentPincode: {
value: '',
isValid: true,
},
permanentCity: '',
permanentState: {
value: null,
label: null,
},
permanentCityVerified: true,
permanentStateVerified: true,
permanentYear: '',
permanentMonth: {
value: null,
label: null,
},
residenceType: {
value: null,
label: null,
},
residenceDocType: {
value: null,
label: null,
},
permanentVisible: false,
sameAsKycAddress: false,
permanentResAddr1: {
value: '',
},
permanentResAddr2: {
value: '',
},
permanentResLandmark1: {
value: '',
},
permanentResLandmark2: {
value: '',
},
permanentResPincode: {
value: '',
isValid: true,
},
permanentResCity: '',
permanentResState: {
value: null,
label: null
},
permanentResCityVerified: true,
permanentResStateVerified: true,
permanentResYear: '',
permanentResMonth: {
value: null,
label: null,
},
permanentResidenceType: {
value: null,
label: null,
},
permanentResidenceDocType: {
value: null,
label: null,
},
permanentSelectedRelation: {
value: null,
label: null,
},
permanentConsumerName: '',
permanentConsumerNameValid: true,
permanentServiceProvider: {
value: null,
label: null,
code: null
},
permanentConsumerNumber: '',
permanentConsumerNumberValid: true,
officeYear: '',
officeMonth: {
value: null,
label: null,
},
companyName: '',
otherIndustry: '',
empEmail: {
value: '',
isValid: true,
},
employmentCity: '',
employmentState: '',
professionList: [],
subCategoryList: [],
designationList: [],
companyTypeList: [],
companyList: [],
industryList: [],
query: '',
selectedCompanyName: '',
selectedProfession: {
value: null,
label: null,
},
selectedsubCategory: {
value: null,
label: null,
},
selectedDesignation: {
value: null,
label: null,
},
selectedIndustry: {
value: null,
label: null,
},
selectedCompanyType: {
value: null,
label: null,
},
isFirstJob: {
value: null,
// isValid: true,
},
empMonth: {
value: null,
label: null,
},
empYear: '',
jobMonth: {
value: null,
label: null,
},
jobYear: '',
firstJob: false,
empAddress1: {
value: '',
},
empAddress2: {
value: '',
},
empLandmark1: {
value: '',
},
empLandmark2: {
value: '',
},
empPincode: {
value: '',
isValid: true,
},
empCity: '',
empState: {
value: null, label: null
},
empCityVerified: true,
empStateVerified: true,
selectedEmpType: {
value: null,
label: null,
},

officeAddress1: {
value: '',
},
officeAddress2: {
value: '',
},
officeLandmark1: {
value: '',
},
officeLandmark2: {
value: '',
},
officePincode: {
value: '',
isValid: true,
},
empAddYear: '',
empAddMonth: {
value: null,
label: null,
},
officeCity: '',
officeState: {
value: null,
label: null,
},
officeCityVerified: true,
officeStateVerified: true,
mobileNumber: {
value: '',
isValid: true,
},
dateOfBirthDL: '',
dateOfBirthDLText: '',
lpgID: '',
 cityList: [],
kycDocList: [],
selectedOtherDoc: {
value: null,
label: null
},
utilityDocList: [
{ "id": 1, "label": "Aadhar + voter id", "value": "Aadhar + voter id" },
{ "id": 2, "label": "Aadhar + Driving Licence", "value": "Aadhar + Driving
Licence" },
{ "id": 3, "label": "Pipeline gas receipt", "value": "Pipeline gas receipt"
},
{ "id": 4, "label": "Passport", "value": "Passport" },
{ "id": 5, "label": "Postpaid bill", "value": "Postpaid bill" },
{ "id": 6, "label": "Landline bill", "value": "Landline bill" },
{ "id": 7, "label": "Aadhar + Banking", "value": "Aadhar + Banking" },
{ "id": 8, "label": "Mobile Bill", "value": "Mobile Bill" },
],
selectedUtilityDoc: {
value: null,
label: null,
},
serviceProviderList: [],
isPermanentAddressSaved: false,
isEmployDetailsSaved: false,
isOfficeAddressSaved: false,
isAdditionalContactSaved: false,
dlVerified: false,
voterVerified: false,
isUtiltiySaved: false,
kycDocDetailSaved: false,
idToEditKYCData: null,
idToEditUtilityData: null,
idToEditPermanentAddress: null,
idToEditPermResAddress: null,
idToEditEmployDetails: null,
idToEditOfficeAddress: null,
idToEditEmpDetails: null,
idToEditAdditionalContact: null,
cancelButtonTitle: 'Cancel',
ismainapplicant: this.props.navigation.state.params.ismainapplicant,
iscoapplicant: this.props.navigation.state.params.iscoapplicant || false,
isguarantor: this.props.navigation.state.params.isguarantor || false,
coapplicantUniqueId:
this.props.navigation.state.params.coapplicantUniqueId || '',
isViewOnly: false,
kycFreeze: false,
deleteflag: true,
indSelfSoleFlag: false,
gstNumber: '',
gstAddress: {},
gstAddressFlag: false,
panDOB: '',
currentAddressBoxChecked:false,
selectedCurrentAddressRadio:'',
currentAddressaadharAuthenticationType:'',
currentAddressaadharAuthentication:'',
currentAddressotpVisibile: false,
currentAddressrequestId:'',
 panDocType:"",
currentAddressRadioButtonFreeze:false,
currentAddressFreeze:false,
currentAddressFiledsEditableFreeze:false,
firstProteanServerData:{},
secondProteanServerData:{},
serverLocation:"",
serverPassword:"",
serverUrl:"",
serverUserName:"",
requestApiCheckOutTime:5000
};
this.controller;
this.controllerKYC;

backAction = () => {
if (this.props.navigation && this.props.navigation.navigate) {
this.props.navigation.navigate('PANAndGSTVerification');
return true;
}
return false;
};

handleCompanyList = (value) => {

this.setState({
query: value
}, () => {
value.length > 2 ?
this.props.getCompanyList({
dataToAPI: {
companyName: value
},
callback: (response) => {
this.setState({ companyList: response.data || [] });
},
}) : null
})

isemailAddress(text) {
let valid = false;
//const emailRegex = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-
zA-Z0-9-]+)*$/;
const emailRegex = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".
+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-
zA-Z]{2,}))$/;
if (text != '' && text != null && emailRegex.test(text)) {
valid = true;
}

this.setState({
empEmail: {
...this.state.empEmail,
 isValid: valid,
},
});
}

renderToolTip(text, customStyle) {
const { toolTipContainer, informationToolTipText } = AdditionalDetailsStyles;

return (
<View style={customStyle}>
<Tooltip
popover={<Text>{text}</Text>}
backgroundColor={colors.COLOR_LILAC}
skipAndroidStatusBar={true}
overlayColor={'transparent'}
withPointer={true}
height={105}>
<View style={toolTipContainer}>
<Text style={informationToolTipText}>{'i'}</Text>
</View>
</Tooltip>
</View>
);
}

handleCollapseExpand(key, valueToSet) {
const keyToObj = this.state.additionalDetailOptions;
keyToObj[key] = valueToSet;

this.setState({
additionalDetailOptions: keyToObj,
});
}

renderDocument() {
const {
uploadImageContainer,
uploadImageStyle,
frontAndBackLabel,
saveButtonStyle,
saveButtonTitleStyle,
uploadedImageStyle,
style50PercentRow,
closeImageStyle,
disableTextStyle,
disableStyle,
verifiedTextStyle,
verifiedTickImageStyle,
flexRowStyle,
} = AdditionalDetailsStyles;
return (
<View>
<View style={uploadImageContainer}>
{this.state.imageDataPermanent?.front?.uri == '' && (
<TouchableOpacity
style={uploadImageStyle}
onPress={async () => {
var dataToApi = {
applicantUniqueId: this.state.isguarantor ||
this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
docType: 'front'
}
if (!this.state.isViewOnly) {
let fileDetails = await uploadDocument();
const callback = (response) => {
this.setState({
imageDataPermanent: {
...this.state.imageDataPermanent,
front: {
uri: response?.filePath ?
response.filePath.startsWith('/var/www/html/') ?
response.filePath.replace('/var/www/html', uatURL.URL) : response?.filePath : '',
}
}

})
}
zipFileDisbursementUpload(fileDetails, dataToApi,
this.props.uploadDoc, callback);
}
}}

>
<Icon size={35} name="plus" type="antdesign" color={'#818282'} />
<Text style={frontAndBackLabel}>
{ADDITIONAL_DETAILS_CONST.IMAGE_FRONT}
</Text>
</TouchableOpacity>
)}
{this.state.imageDataPermanent.front.uri != '' &&
<View style={style50PercentRow}>
<Image
style={uploadedImageStyle}
source={{
uri: `${this.state.imageDataPermanent.front.uri}`,
}}

resizeMode="cover"
/>
<TouchableOpacity
style={[closeImageStyle]}
onPress={() => {
if (!this.state.isViewOnly) {
// deletePerDocuments
const dataToAPI = {
docType: 'front',
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};

this.props.deletePerDocuments({
dataToAPI,
callback: (response) => {
this.setState({
 imageDataPermanent: {
...this.state.imageDataPermanent,
front: {
uri: '',
}
}

})
}
});
}
}}>
<Icon name="closecircle" type="antdesign" color={'#5f5c60'} />
</TouchableOpacity>
</View>
}

{this?.state?.imageDataPermanent?.back?.uri == '' && (

<TouchableOpacity
style={uploadImageStyle}
onPress={async () => {
if (!this.state.isViewOnly) {
var dataToApi = {
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
docType: 'back'
}
let fileDetails = await uploadDocument();
const callback = (response) => {
this.setState({
imageDataPermanent: {
...this.state.imageDataPermanent,
back: {
uri: response?.filePathBack ?
response?.filePathBack.startsWith('/var/www/html/') ?
response?.filePathBack?.replace('/var/www/html', uatURL.URL) :
response?.filePathBack: '',
}
}

})
}
zipFileDisbursementUpload(fileDetails, dataToApi,
this.props.uploadDoc, callback);
}
}}

>
<Icon size={35} name="plus" type="antdesign" color={'#818282'} />
<Text style={frontAndBackLabel}>
{ADDITIONAL_DETAILS_CONST.IMAGE_BACK}
</Text>
</TouchableOpacity>
)}
{this.state.imageDataPermanent?.back?.uri != '' &&
<View style={style50PercentRow}>
<Image
 style={uploadedImageStyle}
source={{
uri: `${this.state.imageDataPermanent?.back?.uri}`,
}}

resizeMode="cover"
/>
<TouchableOpacity
style={[closeImageStyle]}
onPress={() => {
if (!this.state.isViewOnly) {
// deletePerDocuments
const dataToAPI = {
docType: 'back',
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};

this.props.deletePerDocuments({
dataToAPI,
callback: (response) => {
this.setState({
imageDataPermanent: {
...this.state.imageDataPermanent,
back: {
uri: '',
}
}

})
}
});
}
}}>
<Icon name="closecircle" type="antdesign" color={'#5f5c60'} />
</TouchableOpacity>
</View>
}
</View>

</View>
);
}

renderCurrentDocument() {
const {
uploadImageContainer,
uploadImageStyle,
frontAndBackLabel,
saveButtonStyle,
saveButtonTitleStyle,
uploadedImageStyle,
style50PercentRow,
closeImageStyle,
disableTextStyle,
disableStyle,
 verifiedTextStyle,
verifiedTickImageStyle,
flexRowStyle,
} = AdditionalDetailsStyles;
return (
<View>
<View style={uploadImageContainer}>
{/* {console.log("mjjjjj", this?.state?.imageDataCurrent)} */}
{this?.state?.imageDataCurrent?.front?.uri == '' && (
<TouchableOpacity
style={uploadImageStyle}
onPress={async () => {
if (!this.state.isViewOnly && !this.state.currentAddressFreeze && !
this.state.currentAddressFiledsEditableFreeze) {
var fileDetails = ''
fileDetails = await uploadDocument();
if (fileDetails != '') {
var data = {
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
filename: fileDetails?.path?.split('/').pop(),
docType: 'front'
}
const callback = (response) => {
this.setState({
imageDataCurrent: {
...this.state.imageDataCurrent,
front: {
uri: response.currentAddressFilePath ?
response.currentAddressFilePath.startsWith('/var/www/html/') ?
response.currentAddressFilePath.replace('/var/www/html', uatURL.URL) :
response.currentAddressFilePath : '',
}
}

})
}
zipFileDisbursementUpload(fileDetails, data,
this.props.uploadCurrentDoc, callback);
}
}
}}

>
<Icon size={35} name="plus" type="antdesign" color={'#818282'} />
<Text style={frontAndBackLabel}>
{ADDITIONAL_DETAILS_CONST.IMAGE_FRONT}
</Text>
</TouchableOpacity>
)}
{this?.state?.imageDataCurrent?.front?.uri != '' &&
<View style={style50PercentRow}>
<Image
style={uploadedImageStyle}
source={{
uri: `${this?.state?.imageDataCurrent?.front?.uri}`,
}}
 resizeMode="cover"
/>
<TouchableOpacity
style={[closeImageStyle]}
onPress={() => {
if (!this.state.isViewOnly && !this.state.currentAddressFreeze &&
!this.state.currentAddressFiledsEditableFreeze) {
// deletePerDocuments
const dataToAPI = {
currentAddress: true,
docType: 'front',
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};

this.props.deletePerDocuments({
dataToAPI,
callback: (response) => {
this.setState({
imageDataCurrent: {
...this.state.imageDataCurrent,
front: {
uri: '',
},

},

})
}
});
}
}}>
<Icon name="closecircle" type="antdesign" color={'#5f5c60'} />
</TouchableOpacity>
</View>
}
{this?.state?.imageDataCurrent?.back?.uri == '' && (
<TouchableOpacity
style={uploadImageStyle}
onPress={async () => {
if (!this.state.isViewOnly && !this.state.currentAddressFreeze && !
this.state.currentAddressFiledsEditableFreeze) {
let fileDetails = await uploadDocument();
var data = {
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
filename: fileDetails?.path?.split('/').pop(),
docType: 'back'
}
const callback = (response) => {
// console.log("rrrrrrr", response.data);
this.setState({
imageDataCurrent: {
...this.state.imageDataCurrent,
 back: {
uri: response.currentAddressFilePathBack ?
response.currentAddressFilePathBack.startsWith('/var/www/html/') ?
response.currentAddressFilePathBack.replace('/var/www/html', uatURL.URL) :
response.currentAddressFilePathBack : '',
}
}

})
}
zipFileDisbursementUpload(fileDetails, data,
this.props.uploadCurrentDoc, callback);
}
}}

>
<Icon size={35} name="plus" type="antdesign" color={'#818282'} />
<Text style={frontAndBackLabel}>
{ADDITIONAL_DETAILS_CONST.IMAGE_BACK}
</Text>
</TouchableOpacity>
)}
{this?.state?.imageDataCurrent?.back?.uri != '' &&
<View style={style50PercentRow}>
<Image
style={uploadedImageStyle}
source={{
uri: `${this?.state?.imageDataCurrent?.back?.uri}`,
}}
resizeMode="cover"
/>
<TouchableOpacity
style={[closeImageStyle]}
onPress={() => {
if (!this.state.isViewOnly && !this.state.currentAddressFreeze &&
!this.state.currentAddressFiledsEditableFreeze) {
// deletePerDocuments
const dataToAPI = {
currentAddress: true,
docType: 'back',
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};

this.props.deletePerDocuments({
dataToAPI,
callback: (response) => {
this.setState({
imageDataCurrent: {
...this.state.imageDataCurrent,
back: {
uri: '',
}
},

})
 }
});
}
}}>
<Icon name="closecircle" type="antdesign" color={'#5f5c60'} />
</TouchableOpacity>
</View>
}
</View>

</View>
);
}

getDataFromPincode(pincode, flow) {
// this.props.getCityState({
// pincode,
// callback: (response) => {
// if (flow === 'fromUtility') {
// this.setState({
// utilityCity: response.data.city || '',
// utilityState: response.data.state || '',
// });
// } else if (flow === 'fromPermanentAddress') {
// this.setState({
// permanentCity: response.data.city || '',
// permanentState: response.data.state || '',
// });
// } else if (flow === 'fromOfficeAddress') {
// this.setState({
// officeCity: response.data.city || '',
// officeState: response.data.state || '',
// });
// } else if (flow === 'fromEmploymentDetails') {
// this.setState({
// employmentCity: response.data.city || '',
// employmentState: response.data.state || '',
// });
// } else {
// this.setState({
// city: response.data.city || '',
// state: response.data.state || '',
// });
// }
// },
// });
}

getDocId() {
if (this?.state?.selectedDocType === 'adhar' && (this.state.adharID === '' || !
this.state.adharIdValid || this.state.aadharDateOfBirthText === '' ||
this.state.aadharDateOfBirthText === undefined || this.state.addharName === '' || !
this.state.adharNameValid)) {
return true;
}
if (
this?.state?.selectedDocType === 'passport' &&
(this.state.fileNumber === '' || this.state.dateOfBirthText === '' || !
this.state.fileNumberValid ||
(moment(this.state.dateOfBirthText, ["MM-DD-YYYY", "DD-MM-YYYY", "YYYY-MM-
DD", "DD/MM/YYYY", "YYYY/MM/DD", "MM/DD/YYYY"]) >
moment().clone().subtract(18, 'years')) === true)
) {
return true;
}
if (
this?.state?.selectedDocType === 'driving license' &&
(this.state.dlNo === '' || this.state.dateOfBirthDLText === '' || !
this.state.dlNoValid ||
(moment(this.state.dateOfBirthDLText, ["MM-DD-YYYY", "DD-MM-YYYY", "YYYY-
MM-DD", "DD/MM/YYYY", "YYYY/MM/DD", "MM/DD/YYYY"]) >
moment().clone().subtract(18, 'years')) === true
)
) {
return true;
}
if (this?.state?.selectedDocType === 'voter' && this.state.epicNo === '' || !
this.state.epicNoValid) {
return true;
}
if (
this?.state?.selectedDocType === 'other' &&
this.state.selectedOtherDoc.value === null
) {
return true;
}
return false;
}

getUtilityDocId() {
if (
this.state.selectedUtilityBill === 'electricity' &&
(this.state.serviceProvider.value === null || this.state.consumerNumber ===
'' || !this.state.consumerNumberValid)
) {
return true;
}
if (this.state.selectedUtilityBill === 'gas' && this.state.lpgID === '') {
return true;
}
if (
this.state.selectedUtilityBill === 'landline' &&
(this.state.cityNameUtility === '' ||
this.state.landlineNumber === '' ||
this.state.stdCode === '')
) {
return true;
}
if (
this.state.selectedUtilityBill === 'other' &&
 this.state.selectedUtilityDoc.value === null
) {
return true;
}
return false;
}

getNextDisable() {
if (this.state.indSelfSoleFlag == false) {
if (this.state.kycData == false ||
// this.state.utilityBillData == false ||
this.state.permanantAddressData == false ||
// this.state.employmentData == false ||
// this.state.officeData == false ||
// this.state.contactData === false ||
(this.state.permanentVisible == true && this.state.permanantResiAddressData
== false)
) {
return true;
}
} else {
if (this.state.kycData == false ||
(this.state.permanentVisible == true && this.state.permanantResiAddressData
== false) ||
// this.state.contactData === false ||
// this.state.employmentData == false ||
this.state.officeData == false) {
return true;
}
}
return false;
}

getRadio() {
if (
this.state.selectedSourceType === 'Other' &&
this.state.radioOther === ''
) {
return true;
}
return false;
}

getSaveDisable() {
if (this.state.indSelfSoleFlag == true) {
if (
this.state.addressLine1.value === '' ||
this.state.pincode.value === '' ||
!this.state.pincode.isValid ||
this.state.city === '' ||
this.state.state.value === null ||
// this?.state?.year === '' ||
this.state.stateVerified === false ||
this.state.cityVerified === false ||
// this.state.selectedMonth.value === '' ||
// this.state.selectedMonth.value === null ||
this.state.landmark1.value === '' ||
// this.state.selectedResidentType.value === '' ||
// this.state.selectedResidentType.value === null ||
 this?.state?.selectedDocType === '' ||
this.getDocId() || this.state.selectedSourceType === '' ||
this.getRadio()
) {
return true;
}
} else {
if (
this.state.addressLine1.value === '' ||
this.state.pincode.value === '' ||
!this.state.pincode.isValid ||
this.state.city === '' ||
this.state.state === '' ||
// this?.state?.year === '' ||
this.state.stateVerified === false ||
this.state.cityVerified === false ||
// this.state.selectedMonth.value === '' ||
this.state.landmark1.value === '' ||
// this.state.selectedMonth.value === null ||
// this.state.selectedResidentType.value === '' ||
// this.state.selectedResidentType.value === null ||
this?.state?.selectedDocType === '' ||
this.getDocId()
) {
return true;
}
}
return false;
}

getOfficeSave() {
if (
this.state.residenceDocType.value == 'Electricity Bill' ?

(this.state.officeAddress1.value === '' ||

this.state.officePincode.value === '' ||
this.state.officeLandmark1.value == '' ||
!this.state.officePincode.isValid ||
this.state.officeCity === '' ||
this.state.officeCityVerified === false ||
this.state.officeStateVerified === false ||
this.state.officeState.value === null ||
this.state.officeYear === '' ||
this.state.officeMonth.value === null ||
this.state.selectedOfficeType.value === '' ||
// this.state.imageDataCurrent.front.uri === '' ||
this.state.selectedOfficeType.value === null ||
this.state.selectedRelation.value !== 'Self' ? this.state.consumerName ==
'' : this.state.selectedRelation.value == null ||
this.state.selectedRelation.value == null ||
this.state.consumerNumber === '' ||
this.state.serviceProvider.value === null
)
: (
this.state.officeAddress1.value === '' ||
this.state.officePincode.value === '' ||
this.state.officeLandmark1.value == '' ||
!this.state.officePincode.isValid ||
this.state.officeCity === '' ||
 this.state.officeCityVerified === false ||
this.state.officeStateVerified === false ||
this.state.officeState.value === null ||
this.state.officeYear === '' ||
this.state.officeMonth.value === null ||
this.state.selectedOfficeType.value === '' ||
// this.state.imageDataCurrent.front.uri === '' ||
this.state.selectedOfficeType.value === null
)

) {
return true
}

return false
}

getSelectedDocID() {
if (this?.state?.selectedDocType === 'adhar') {
return parseInt(this?.state?.adharID?.toString()?.replace(/ /g, ""));
} else if (this?.state?.selectedDocType === 'passport') {
return (this.state.fileNumber);
} else if (this?.state?.selectedDocType === 'driving license') {
return (this.state.dlNo);
} else if (this?.state?.selectedDocType === 'voter') {
return (this.state.epicNo);
} else if (this?.state?.selectedDocType === 'other') {
return (this.state.selectedOtherDoc.value);
}
return '';
}

onDOBDatePicked = (date) => {

this.setState({
aadharDateOfBirth: date,
aadharDateOfBirthText: moment(date).format('YYYY-MM-DD'),
});
};

renderDynamicInputPerDocType() {
const {
inputStyle,
inputTextStyle,
separatorInputStyle,
textStyle,
textStyle1,
calendarTextStyle,
marginTop20Style,
} = AdditionalDetailsStyles;
if (this?.state?.selectedDocType?.toLowerCase() === 'adhar') {
 return (
//mj
<>

<View style={marginTop20Style}>
<FloatingLabelInput
label={ADDITIONAL_DETAILS_CONST.ADHAR_NAME}
containerStyles={inputStyle}
value={this.state.addharName}
editable={!(this.state.kycFiledsEditableFreeze ||
this.state.kycFreeze)}
onChangeText={(value) => {
this.setState({
addharName: value,
adharNameValid: NAME_REGEX.test(value)
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
{!this.state.adharNameValid && (
<Text style={{ color: 'red', marginTop: 3, }}>{this.state.addharName
== '' ? ADDITIONAL_DETAILS_CONST.REQUIRED_AADHAR_NAME :
ADDITIONAL_DETAILS_CONST.INVALID_AADHAR_NAME}</Text>)}
</View>
<TouchableOpacity
onPress={() => {
if (!(this.state.kycFiledsEditableFreeze || this.state.kycFreeze)) {
this.refs.dobDialog.open({
date: new Date(),
maxDate: new Date(), //To restirct future date
});
}
}}
style={{ marginTop: 15 }}>
<Text style={[textStyle, { fontSize: 15, marginLeft: 5 }]}>
{ADDITIONAL_DETAILS_CONST.DATE_OF_BIRTH}
</Text>
<Text style={[calendarTextStyle, { marginLeft: 3, marginBottom: 4 }]}>
{this.state.aadharDateOfBirthText}
</Text>
<View style={[separatorInputStyle, { marginTop: 5 }]} />
{(moment(this.state.aadharDateOfBirthText, ["MM-DD-YYYY", "YYYY-MM-DD",
"DD/MM/YYYY"]) >
moment().clone().subtract(18, 'years')) && (
<Text style={{ color: 'red', marginTop:
3, }}>{ADDITIONAL_DETAILS_CONST.INVALID_DOB}</Text>)}
</TouchableOpacity>
<DatePickerDialog
ref="dobDialog"
date={this.state.aadharDateOfBirth}
onDatePicked={this.onDOBDatePicked.bind(this)}
/>
 </>
);
}

if (this?.state?.selectedDocType?.toLowerCase() === 'passport') {

return (
<View>
<View style={marginTop20Style}>
<FloatingLabelInput
label={ADDITIONAL_DETAILS_CONST.FILE_NUMBER_PASSPORT}
containerStyles={inputStyle}
editable={!this.state.kycFreeze}
value={this.state.fileNumber || undefined}
maxLength={8}
onChangeText={(value) => {
this.setState({
fileNumber: value,
fileNumberValid: PASSPORT_REGEX.test(value)
}, () => {
if (this.state.fileNumber.length === 8) {
this.setState({
fileNumber: this.state.fileNumber.toUpperCase()
})
}
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
{!this.state.fileNumberValid && (
<Text style={{ color: 'red', marginTop: 3, }}>{this.state.fileNumber
== '' ? ADDITIONAL_DETAILS_CONST.REQUIRED_FILE_NUMBER :
ADDITIONAL_DETAILS_CONST.INVALID_FILE_NUMBER}</Text>)}
</View>
<TouchableOpacity
onPress={() => {
if (!this.state.kycFreeze) {
this.refs.dobDialog.open({
date: new Date(),
maxDate: new Date(), //To restirct future date
});
}
}}
style={{ marginTop: 15 }}>
<Text style={[textStyle, { fontSize: 15, marginLeft: 5 }]}>
{ADDITIONAL_DETAILS_CONST.DATE_OF_BIRTH}
</Text>
<Text style={[calendarTextStyle, { marginLeft: 3 }]}>
{this.state.dateOfBirthText}
</Text>
<View style={separatorInputStyle} />
{(moment(this.state.dateOfBirthText, ["MM-DD-YYYY", "YYYY-MM-DD",
"DD/MM/YYYY"]) >
 moment().clone().subtract(18, 'years')) && (
<Text style={{ color: 'red', marginTop:
3, }}>{ADDITIONAL_DETAILS_CONST.INVALID_DOB}</Text>)}
</TouchableOpacity>
<DatePickerDialog
ref="dobDialog"
date={this.state.dateOfBirth}
onDatePicked={this.onDOBDatePicked.bind(this)}
/>
</View>
);
}

if (this?.state?.selectedDocType?.toLowerCase() === 'driving license') {

return (
<View>
<View style={marginTop20Style}>
<FloatingLabelInput
label={ADDITIONAL_DETAILS_CONST.DL_NO}
containerStyles={inputStyle}
editable={!this.state.kycFreeze}
value={this.state.dlNo || undefined}
onChangeText={(value) => {
this.setState({
dlNo: value,
dlNoValid: EPICNO_REGEX.test(value)
}, () => {
if (this.state.dlNo.length === 16) {
this.setState({
dlNo: this.state.dlNo.toUpperCase()
})
}
});
}}
maxLength={16}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
{!this.state.dlNoValid && (
<Text style={{ color: 'red', marginTop: 3, }}>{this.state.dlNo ==
'' ? ADDITIONAL_DETAILS_CONST.REQUIRED_DL_NUMBER :
ADDITIONAL_DETAILS_CONST.INVALID_DL_NUMBER}</Text>)}
</View>

<TouchableOpacity
onPress={() => {
if (!this.state.kycFreeze) {
this.refs.dobDialog.open({
date: new Date(),
maxDate: new Date(), //To restirct future date
});
}
}}
 style={{ marginTop: 15 }}>
<Text style={[textStyle, { fontSize: 15, marginLeft: 5 }]}>
{ADDITIONAL_DETAILS_CONST.DATE_OF_BIRTH}
</Text>
<Text style={[calendarTextStyle, { marginLeft: 3 }]}>
{this.state.dateOfBirthDLText}
</Text>
<View style={separatorInputStyle} />
{(moment(this.state.dateOfBirthDLText, ["MM-DD-YYYY", "YYYY-MM-DD",
"DD/MM/YYYY"]) >
moment().clone().subtract(18, 'years')) && (
<Text style={{ color: 'red', marginTop:
3, }}>{ADDITIONAL_DETAILS_CONST.INVALID_DOB}</Text>)}
</TouchableOpacity>
<DatePickerDialog
ref="dobDialog"
date={this.state.dateOfBirthDL}
onDatePicked={this.onDOBDateDLPicked.bind(this)}
/>
</View>
);
}

if (this?.state?.selectedDocType?.toLowerCase() === 'voter') {

return (
<View style={marginTop20Style}>
<FloatingLabelInput
label={ADDITIONAL_DETAILS_CONST.EPIC_NUMBER}
containerStyles={inputStyle}
editable={!this.state.kycFreeze}
value={this.state.epicNo || undefined}
onChangeText={(value) => {
this.setState({
epicNo: value,
epicNoValid: EPICNO_REGEX.test(value)
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
{!this.state.epicNoValid && (
<Text style={{ color: 'red', marginTop: 3, }}>{this.state.epicNo ==
'' ? ADDITIONAL_DETAILS_CONST.REQUIRED_EPIC_NUMBER :
ADDITIONAL_DETAILS_CONST.INVALID_EPIC_NUMBER}</Text>)}
</View>
);
}

if (this?.state?.selectedDocType?.toLowerCase() === 'other') {

return (
<View
style={{
...(Platform.OS !== 'android' && {
 zIndex: 10,
}),
}}>

<Text style={{
color: colors.COLOR_LIGHT_NAVY_BLUE,
fontFamily: APP_FONTS.NunitoRegular,
fontSize: 16,
marginLeft: 4,
marginBottom: -5,
marginTop: 20
}}>Other*</Text>

<DropDownPicker
disabled={this.state.kycFreeze}
items={this.state.kycDocList}
containerStyle={{ flex: 1, marginTop: 5, marginBottom: 15 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
defaultValue={this.state.selectedOtherDoc.value}
placeholder={""}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {
this.setState({
selectedOtherDoc: {
label: item.label || null,
value: item.value || null
}
})
}
}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<View style={separatorInputStyle} />
</View>
);
}
}

collapseInvert(flow) {
if (flow === 'addKYC') {
this.setState({
additionalOptions: [
{
registeredAddress: [
{
residentialAddressCollapsed: !this.state.additionalOptions[0]
.registeredAddress[0].residentialAddressCollapsed,
},
{
addUtilityBillsCollapsed: this.state.additionalOptions[0]
.registeredAddress[1].addUtilityBillsCollapsed,
},
 ],
},
],
});
}
if (flow === 'addUtility') {
this.setState({
additionalOptions: [
{
registeredAddress: [
{
residentialAddressCollapsed: this.state.additionalOptions[0]
.registeredAddress[0].residentialAddressCollapsed,
},
{
addUtilityBillsCollapsed: !this.state.additionalOptions[0]
.registeredAddress[1].addUtilityBillsCollapsed,
},
],
},
],
});
}
}

getDocType(imageType) {
if (this?.state?.selectedDocType?.toLowerCase() === 'adhar') {
return `addhar ${imageType}`;
}
if (this?.state?.selectedDocType?.toLowerCase() === 'voter') {
return `voter ${imageType}`;
}
if (this?.state?.selectedDocType?.toLowerCase() === 'driving license') {
return `driving front`;
}
if (this?.state?.selectedDocType?.toLowerCase() === 'passport') {
return `passport ${imageType}`;
}
return 'other';
}

callback = (image, whichUtility) => {

if (whichUtility && whichUtility === 'fromUtility') {

this.setState(
{
imageDataUtility: {
...this.state.imageDataUtility,
front: {
uri: image.path,
data: { ...image },
},
},
},
() => {

if (this.state.imageDataUtility.front.data !== '') {

const name = `${new Date().getTime()}.zip`;
const targetPath = `${RNFS.DocumentDirectoryPath}/${name}`;
 const sourcePath = this.state.imageDataUtility.front.data.path;
zip(sourcePath, targetPath).then((path) => {
const dataToAPI = {
imageData: JSON.stringify([
{
billType: this.state.selectedUtilityBill,
leadCode: this.state.leadCode,
docType: 'front',
mobileNumber: `${this.state.mobileNumberFromProps}`,
ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
isguarantor: this.state.isguarantor,
docName: this.state.imageDataUtility.front.data.name,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
},
]),
zipPath: path,
name,
};
this.props.uploadUtilityDoc({
dataToAPI,
callback: (response) => {

},

});
});
}
},
);
} else {
this.setState(
{
imageData: {
...this.state.imageData,
front: {
uri: image.path,
data: { ...image },
},
},
},
() => {
if (
(
// this?.state?.selectedDocType?.toLowerCase() === 'driving license'
||
this?.state?.selectedDocType?.toLowerCase() === 'other') &&
this.state.imageData.front.data !== ''
) {
const name = `${new Date().getTime()}.zip`;
const targetPath = `${RNFS.DocumentDirectoryPath}/${name}`;
const sourcePath = this.state.imageData.front.data.path;

zip(sourcePath, targetPath)
.then((path) => {
const dataToAPI = {
 imageData: JSON.stringify([
{
docName:
this.state.imageData.front.data.path.split('/').pop(),
docType: this.getDocType('front'),
leadCode: this.state.leadCode,
mobileNumber: `${this.state.mobileNumberFromProps}`,
ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
isguarantor: this.state.isguarantor,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
},
]),
zipPath: path,
name,
};

this.props.uploadDocAdditionalDetails({
dataToAPI,
callback: (response) => {
this.setState({
dlVerified: false,
voterVerified: false,
});
this.getOCRdata(response);
},

});
})
.catch((error) => {
console.error(error);
});
}
if (
this?.state?.selectedDocType?.toLowerCase() !== 'driving license' &&
this.state.imageData.front.data !== '' &&
this.state.imageData.back.data !== ''
) {
const name = `${new Date().getTime()}.zip`;
const targetPath = `${RNFS.DocumentDirectoryPath}/${name}`;
const sourcePath = [
this.state.imageData.front.data.path,
this.state.imageData.back.data.path,
];

zip(sourcePath, targetPath)
.then((path) => {
const dataToAPI = {
imageData: JSON.stringify([
{
docName: this.state.imageData.front.data.name,
docType: this.getDocType('front'),
leadCode: this.state.leadCode,
mobileNumber: `${this.state.mobileNumberFromProps}`,
ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
isguarantor: this.state.isguarantor,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
},
{
docName: this.state.imageData.back.data.name,
docType: this.getDocType('back'),
leadCode: this.state.leadCode,
mobileNumber: `${this.state.mobileNumberFromProps}`,
ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
isguarantor: this.state.isguarantor,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
},
]),
zipPath: path,
name,
};

this.props.uploadDocAdditionalDetails({
dataToAPI,
callback: (response) => {
this.getOCRdata(response);
},
});
})
.catch((error) => {
console.error(error);
});
}
},
);
}
};

getOCRdata(response) {

if (
response &&
response.addresdetails &&
this?.state?.selectedDocType === 'adhar'
) {

// var date = response?.dateOfBirth || ''

// const [day, month, year] = date?.split("/")
// var formattedDate = `${day}-${month}-${year}`;

// console.log("cccccc",formattedDate);
this.setState({
addressLine1: {
...this.state.addressLine1,
value: response.addresdetails.line1,
},
 addressLine2: {
...this.state.addressLine2,
value: response.addresdetails.line2,
},
pincode: {
...this.state.pincode,
value: response.addresdetails.pin,
},
city: response.addresdetails.city || response.addresdetails.district,
// state: response.addresdetails.state,
adharID: response.addharNo == '' ? this.state.adharID :
response.addharNo.replace(/\d{4}(?=.)/g, '$& '),
adharIdValid: response.addharNo == '' ?
AADHAR_REGEX.test(this.state.adharID) :
AADHAR_REGEX.test(response.addharNo.replace(/\d{4}(?=.)/g, '$& ')),
addharName: response.addharName == '' ? this.state.addharName :
response.addharName,
// gender: response.gender === "MALE" ? "M" : "F",
aadharDateOfBirth: response.dateOfBirth,
aadharDateOfBirthText: response.dateOfBirth,

});
}

callbackforBackImage = (image, whichUtility) => {

if (whichUtility && whichUtility === 'fromUtility') {
this.setState(
{
imageDataUtility: {
...this.state.imageDataUtility,
back: {
uri: image.path,
data: { ...image },
},
},
},
() => {
if (this.state.imageDataUtility.back.data !== '') {
const name = `${new Date().getTime()}.zip`;
const targetPath = `${RNFS.DocumentDirectoryPath}/${name}`;

const sourcePath = this.state.imageDataUtility.back.data.path;

zip(sourcePath, targetPath).then((path) => {
const dataToAPI = {
imageData: JSON.stringify([
{
billType: this.state.selectedUtilityBill,
leadCode: this.state.leadCode,
docType: 'back',
mobileNumber: `${this.state.mobileNumberFromProps}`,
ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
isguarantor: this.state.isguarantor,
docName: this.state.imageDataUtility.back.data.name,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
 : this.state.applicantUniqueId,
},
]),
zipPath: path,
name,
};
this.props.uploadUtilityDoc({
dataToAPI,
callback: (response) => {

},

});
});
}
},
);
} else {
this.setState(
{
imageData: {
...this.state.imageData,
back: {
uri: image.path,
data: { ...image },
},
},
},
() => {
if (
this.state.imageData.front.data !== '' &&
this.state.imageData.back.data !== ''
) {
const name = `${new Date().getTime()}.zip`;
const targetPath = `${RNFS.DocumentDirectoryPath}/${name}`;
const sourcePath = [
this.state.imageData.front.data.path,
this.state.imageData.back.data.path,
];
zip(sourcePath, targetPath)
.then((path) => {
const dataToAPI = {
imageData: JSON.stringify([
{
docName:
this.state.imageData.front.data.path.split('/').pop(),
docType: this.getDocType('front'),
// docType: 'front',
leadCode: this.state.leadCode,
mobileNumber: `${this.state.mobileNumberFromProps}`,
ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
isguarantor: this.state.isguarantor,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
},
{
 docName:
this.state.imageData.back.data.path.split('/').pop(),
docType: this.getDocType('back'),
// docType: 'back',
leadCode: this.state.leadCode,
mobileNumber: `${this.state.mobileNumberFromProps}`,
ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
isguarantor: this.state.isguarantor,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
},
]),
zipPath: path,
name,
};

this.props.uploadDocAdditionalDetails({
dataToAPI,
callback: (response) => {
//adharcard
this.getOCRdata(response);
},

});
})
.catch((error) => {
console.error(error);
});
}
},
);
}
};

displayFrontImage(flow) {
if (
flow === 'fromUtility' &&
this.state.imageDataUtility.front.uri === ''
) {
return true;
} else if (!flow && this.state.imageData.front.uri === '') {
return true;
}
return false;
}

displayFrontUploadedImage(flow) {
if (
flow === 'fromUtility' &&
this.state.imageDataUtility.front.uri !== ''
) {
return true;
} else if (!flow && this.state.imageData.front.uri !== '') {
return true;
}
 return false;
}

displaybackUploadedImage(flow) {
if (
flow === 'fromUtility' &&
this.state.imageDataUtility.back.uri !== ''
) {
return true;
} else if (!flow && this.state.imageData.back.uri !== '') {
return true;
}
return false;
}

deleteImage(flow, imageType) {
if (flow === 'fromUtility' && imageType === 'front') {
this.setState(
{
imageDataUtility: {
...this.state.imageDataUtility,
front: {
uri: '',
data: '',
},
back: {
uri: '',
data: '',
},
},
utilityEpicNo: '',
utilityEpicNoValid: true,
utilityFileNumber: '',
utilityFileNumberValid: true,
utilityDateOfBirth: null,
utilityDateOfBirthText: '',
utilityDlNo: '',
utilityDlNoValid: true,
utilityCity: '',
utilityCityValid: true,
utilityTelephoneNo: '',
utilityTelephoneNoValid: true,
},
() => {
const dataToAPI = {
ismainapplicant: !(this.state.iscoapplicant || this.state.isguarantor),
isguarantor: this.state.isguarantor,
docType: 'front',
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};

this.props.deleteUploadedUtilityDoc({
dataToAPI,
});
},
);
 }
if (!flow && imageType === 'front') {
this.props.deleteDocuments({
data: {
deleteflag: this.state.deleteflag,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
},
callback: (response) => {
this.setState({
imageData: {
...this.state.imageData,
front: {
uri: '',
data: '',
},
},
addressLine1: {
value: '',
},
addressLine2: {
value: '',
},
pincode: {
value: '',
isValid: true,
},
city: '',
state: '',
year: '',
selectedMonth: {
value: null,
label: null,
},
selectedResidentType: {
value: null,
label: null,
},
});
if (this?.state?.selectedDocType === 'driving license') {
this.setState({
dlNo: '',
dateOfBirthDL: '',
dateOfBirthDLText: '',
dlVerified: false,
});
} else if (this?.state?.selectedDocType === 'other') {
this.setState({ selectedOtherDoc: { value: null, label: null } });
} else if (this?.state?.selectedDocType === 'passport') {
this.setState({ fileNumber: '', dateOfBirthText: '', dateOfBirth:
'' });
} else if (this?.state?.selectedDocType === 'voter') {
this.setState({ epicNo: '', voterVerified: false });
} else if (this?.state?.selectedDocType === 'adhar') {
this.setState({ adharID: '', addharName: '', aadharDateOfBirthText:
'' });
}
 },
});

}
if (flow === 'fromUtility' && imageType === 'back') {
this.setState(
{
imageDataUtility: {
...this.state.imageDataUtility,
back: {
uri: '',
data: '',
},
front: {
uri: '',
data: '',
},
},
utilityEpicNo: '',
utilityEpicNoValid: true,
utilityFileNumber: '',
utilityFileNumberValid: true,
utilityDateOfBirth: null,
utilityDateOfBirthText: '',
utilityDlNo: '',
utilityDlNoValid: true,
utilityCity: '',
utilityCityValid: true,
utilityTelephoneNo: '',
utilityTelephoneNoValid: true,
},
() => {
const dataToAPI = {
ismainapplicant: !(this.state.iscoapplicant || this.state.isguarantor),
isguarantor: this.state.isguarantor,
docType: 'back',
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};
this.props.deleteUploadedUtilityDoc({
dataToAPI,
});
},
);
}

if (!flow && imageType === 'back') {

this.controllerKYC.reset();
this.props.deleteDocuments({
data: {
deleteflag: this.state.deleteflag,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
},
 callback: (response) => {
this.setState({
imageData: {
...this.state.imageData,
back: {
uri: '',
data: '',
},
},
addressLine1: {
value: '',
},
addressLine2: {
value: '',
},
pincode: {
value: '',
isValid: true,
},
city: '',
state: '',
year: '',
selectedMonth: {
value: null,
label: null,
},
selectedResidentType: {
value: null,
label: null,
},
});
if (this?.state?.selectedDocType === 'driving license') {
this.setState({
dlNo: '',
dateOfBirthDL: '',
dateOfBirthDLText: '',
dlVerified: false,
});
} else if (this?.state?.selectedDocType === 'other') {
this.setState({ selectedOtherDoc: { value: null, label: null } });
} else if (this?.state?.selectedDocType === 'passport') {
this.setState({ fileNumber: '', dateOfBirthText: '', dateOfBirth:
'' });
} else if (this?.state?.selectedDocType === 'voter') {
this.setState({ epicNo: '', voterVerified: false });
} else if (this?.state?.selectedDocType === 'adhar') {
this.setState({ adharID: '', addharName: '', aadharDateOfBirthText:
'' });
}
},
});

}
}

FormatDateToDash(data) {
var dia = data.split('/')[0];
var mes = data.split('/')[1];
 var ano = data.split('/')[2];

return ('0' + dia).slice(-2) + '-' + ('0' + mes).slice(-2) + '-' + ano;

}

renderUploadPlaceholder(flow) {
const {
uploadImageContainer,
uploadImageStyle,
frontAndBackLabel,
saveButtonStyle,
saveButtonTitleStyle,
uploadedImageStyle,
style50PercentRow,
closeImageStyle,
disableTextStyle,
disableStyle,
verifiedTextStyle,
verifiedTickImageStyle,
flexRowStyle,
} = AdditionalDetailsStyles;
return (
<View>
<View style={uploadImageContainer}>
{this.displayFrontImage(flow) && (
<TouchableOpacity
style={uploadImageStyle}
onPress={() => {
if (!(this.state.kycDocumentMandatory || this.state.kycFreeze)) {

selectPDF1('', '', this.callback, 'onlypickimage', flow, flow ==

'fromUtility' ? this.state.selectedUtilityBill : this?.state?.selectedDocType)
}
}
}>
<Icon size={35} name="plus" type="antdesign" color={'#818282'} />
<Text style={frontAndBackLabel}>
{ADDITIONAL_DETAILS_CONST.IMAGE_FRONT}
</Text>
</TouchableOpacity>
)}
{this.displayFrontUploadedImage(flow) && (
<View style={style50PercentRow}>
<Image
style={uploadedImageStyle}
source={{
uri: `${this.state.imageData.front.uri}`,
}}
onError={() => {

this.setState({
imageData: {
...this.state.imageData,
front: {
...this.state.imageData.front,
uri:

'https://www.toddbershaddvm.com/wp-content/uploads/sites/257/2018/09/placeholder-
img.jpg',
 },
},
});

}}
resizeMode="cover"
/>
<TouchableOpacity
style={[closeImageStyle]}
onPress={() => {
if (!(this.state.kycDocumentMandatory || this.state.kycFreeze)) {
this.deleteImage(flow, 'front');
}
}}>
<Icon name="closecircle" type="antdesign" color={'#5f5c60'} />
</TouchableOpacity>
</View>
)}
{

this?.state?.selectedDocType === 'other' && flow !== 'fromUtility' ?

null :
!this.displaybackUploadedImage(flow) && (
<TouchableOpacity
style={uploadImageStyle}
onPress={() => {
if (!(this.state.kycDocumentMandatory || this.state.kycFreeze))
{
selectPDF1(
'',
'',
this.callbackforBackImage,
'onlypickimage',
flow,
this?.state?.selectedDocType
);
}
}}>
<Icon
size={35}
name="plus"
type="antdesign"
color={'#818282'}
/>
<Text style={frontAndBackLabel}>
{ADDITIONAL_DETAILS_CONST.IMAGE_BACK}
</Text>
</TouchableOpacity>
)}

{this.displaybackUploadedImage(flow) && (
<View style={style50PercentRow}>
<Image
style={uploadedImageStyle}
source={{
uri: `${this.state.imageData.back.uri}`,
}}
 onError={() => {

this.setState({
imageData: {
...this.state.imageData,
back: {
...this.state.imageData.back,
uri:

'https://www.toddbershaddvm.com/wp-content/uploads/sites/257/2018/09/placeholder-
img.jpg',
},
},
});

}}
resizeMode="cover"
/>
<TouchableOpacity
style={[closeImageStyle]}
onPress={() => {
if (!(this.state.kycDocumentMandatory || this.state.kycFreeze)) {
this.deleteImage(flow, 'back');
}
}}>
<Icon name="closecircle" type="antdesign" color={'#5f5c60'} />
</TouchableOpacity>
</View>
)}

</View>
<Text style={{
fontFamily: APP_FONTS.NunitoBold,
marginTop: 10,
fontSize: FONT_SIZE.xm,
color: colors.COLOR_GREY
}}>Document is mandatory*</Text>
{/* utility get details button */}

</View>
);
}

getVerifyDisable() {
if (
this?.state?.selectedDocType?.toLowerCase() === 'driving license' &&
(this.state.dlNo === '' ||
this.state.dateOfBirthDLText === '' ||
this.state.dlVerified)
) {
return true;
}
if (
(this?.state?.selectedDocType?.toLowerCase() === 'voter' && this.state.epicNo
=== '') || this.state.voterVerified
) {
return true;
 }
return false;
}

getSaveDisableGetDetails() {
if (
(this.state.residenceDocType.value == 'Electricity Bill') &&
(this.state.consumerNumber === '' || this.state.serviceProvider.value ===
null)
) {
return true;
}
if (this.state.consumerNumber === '') {
return true;
}

return false;
}

getPermanentSaveDisable() {
if (
(this.state.permanentResidenceDocType.value == 'Electricity Bill') &&
(this.state.permanentConsumerNumber === '' ||
this.state.permanentServiceProvider.value === null)
) {
return true;
}
if (this.state.permanentConsumerNumber === '') {
return true;
}

return false;
}

getCurrentSaveDisable() {
if (
(this.state.selectedOfficeDocType.value == 'Electricity Bill') &&
(this.state.consumerNumber === '' || this.state.serviceProvider.value ===
null)
) {
return true;
}
if (this.state.consumerNumber === '') {
return true;
}

return false;
}

clearKYCDocData() {
this.setState({
imageData: {
front: {
uri: '',
data: '',
},
back: {
uri: '',
data: '',
 },
},
addressLine1: {
value: '',
},
addressLine2: {
value: '',
},
pincode: {
value: '',
isValid: true,
},
city: '',
state: '',
year: '',
cityVerified: true,
stateVerified: true,
adharIdValid: true,
fileNumberValid: true,
epicNoValid: true,
dlNoValid: true,
selectedMonth: {
value: null,
label: null,
},
selectedResidentType: {
value: null,
label: null,
},
selectedDocType: '',
adharID: '',
fileNumber: '',
dateOfBirth: null,
dateOfBirthText: '',
dlNo: '',
epicNo: '',
dateOfBirthDL: '',
dateOfBirthDLText: '',
selectedOtherDoc: { value: null, label: null },
dlVerified: false,
voterVerified: false,
});

this.controllerKYC.reset();
}

renderPlusIconWithDoc() {
const {
plusButtonContainer,
docTextStyle,
toolTipContainer,
informationToolTipText,
} = AdditionalDetailsStyles;

return (
<View style={plusButtonContainer}>
<View>
<Icon
onPress={() => {
 if (!this.state.isViewOnly) {
if (this?.state?.selectedDocType?.toLowerCase() === 'adhar') {
this.clearKYCDocData();
this.setState({
selectedDocType: '',
});

this.props.deleteDocuments({
data: {
deleteflag: this.state.deleteflag,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
},
callback: (response) => {
this.setState({
kycData: false,
})
},
});

} else {
this.clearKYCDocData();
this.setState({
selectedDocType: 'adhar',
});
}
}
}}
disabled={
this?.state?.selectedDocType !== '' &&
this?.state?.selectedDocType?.toLowerCase() !== 'adhar'
}
reverse
name={
this?.state?.selectedDocType !== '' &&
this?.state?.selectedDocType?.toLowerCase() === 'adhar'
? 'minus'
: 'plus'
}
type="antdesign"
color={'#334e9e'}
/>
<Text style={docTextStyle}>
{ADDITIONAL_DETAILS_CONST.ADHAR_CARD}
</Text>

{this.renderToolTip(
'You will need to add your current, permanant and employment details,
if you add your passport details',
)}
</View>
</View>
);
}

handleDocType(type, doc) {
type ?
 this.props.getDocType({
dataToAPI: {
residentType: type
},
callback: (response) => {
const dataForDropdown = response.data.data.map((value) =>
({
value: value.poaType,
label: value.poaType,
docType: value.poaType,
id: value.id,
}));
// console.log("mjjjgjjjj", dataForDropdown);
doc == 'permanentResidence' ?
this.setState({ dropdownPerDocType: dataForDropdown || [] })
: doc == 'Office' ?
this.setState({ dropdownOfficeDocType: dataForDropdown || [] })
:
this.setState({ dropdownDocType: dataForDropdown || [] });

},
}) : null
}

//manoj

getPermanentResiAddSaveDisable() {

if (
this.state.permanentResidenceDocType.value == 'Electricity Bill' ?

((this.state.permanentResAddr1.value === '' ||

this.state.permanentResPincode.value === '' ||
!this.state.permanentResPincode.isValid ||
this.state.permanentResCity === '' ||
this.state.permanentResCityVerified === false ||
this.state.permanentResStateVerified === false ||
this.state.permanentResState.value === null ||
this.state.permanentResLandmark1.value == "" ||
this.state.permanentResidenceType.value == null ||
this.state.permanentResMonth.value == null ||
this.state.permanentResMonth.value == undefined ||
this?.state?.permanentResYear == '' ||
this?.state?.permanentResYear == null ||
this.state.permanentResidenceDocType.value == null ||
// this.state.permanentSelectedRelation.value !== 'Self' ?
// this.state.permanentConsumerName == '' :
// this.state.permanentSelectedRelation.value == null ||
this.state.permanentSelectedRelation.value == null ||
this.state.permanentConsumerNumber === '' ||
this.state.permanentServiceProvider.value === null) ||
this.state.isViewOnly)
:
(
// this.state.imageDataCurrent.front.uri === '' ||
this.state.permanentResAddr1.value === '' ||
this.state.permanentResPincode.value === '' ||
!this.state.permanentResPincode.isValid ||
 this.state.permanentResCity === '' ||
this.state.permanentResCityVerified === false ||
this.state.permanentResStateVerified === false ||
this.state.permanentResState.value === null ||
this.state.permanentResLandmark1.value == "" ||
this.state.permanentResidenceType.value == null ||
this?.state?.permanentResYear == '' ||
this?.state?.permanentResYear == null ||
this.state.permanentResMonth.value == null ||
this.state.permanentResMonth.value == undefined) ||
this.state.isViewOnly
) {
return true;
}

return false;
}

getPermanentAddSaveDisable() {
if (
this.state.residenceDocType.value == 'Electricity Bill' ?

((this.state.permanentAddress1.value === '' ||

this.state.permanentPincode.value === '' ||
// this.state.imageDataCurrent.front.uri === '' ||
!this.state.permanentPincode.isValid ||
this.state.permanentCity === '' ||
this.state.permanentState.value === null ||
this.state.residenceType.value == null ||
this.state.residenceDocType.value == null ||
// this.state.selectedRelation.value !== 'Self' ? this.state.consumerName
== '' : this.state.selectedRelation.value == null||
this.state.selectedRelation.value == null ||
this.state.permanentLandmark1.value == "" ||
this.state.permanentCityVerified === false ||
this.state.permanentStateVerified === false ||
this.state.permanentMonth.value === null ||
this.state.permanentMonth.value == undefined ||
this.state.permanentYear === '' ||
this.state.consumerNumber === '' ||
this.state.serviceProvider.value === null) ||
this.state.isViewOnly || this.state.currentAddressFreeze)
:
(this.state.permanentAddress1.value === '' ||
this.state.permanentPincode.value === '' ||
// this.state.imageDataCurrent.front.uri === '' ||
!this.state.permanentPincode.isValid ||
this.state.permanentCity === '' ||
this.state.permanentState.value === null ||
this.state.residenceType.value == null ||
this.state.residenceDocType.value == null ||
this.state.permanentLandmark1.value == "" ||
this.state.permanentCityVerified === false ||
this.state.permanentStateVerified === false ||
this.state.permanentMonth.value === null ||
this.state.permanentMonth.value == undefined ||
this.state.permanentYear === '') ||
this.state.isViewOnly || this.state.currentAddressFreeze
) {
 return true;
}

return false;
}

clearCurrentAdd() {
this.setState({
permanentAddress2: {
value: '',
},
permanentLandmark1: {
value: '',
},
permanentLandmark2: {
value: '',
},
permanentPincode: {
value: '',
isValid: true,
},
permanentCity: '',
permanentState: {
value: null,
label: null,
},
permanentCityVerified: true,
permanentStateVerified: true,
permanentYear: '',
permanentMonth: {
value: null,
label: null,
},
});
}

clearCurrentResiAdd() {
this.setState({
officeAddress2: {
value: '',
},
officeLandmark1: {
value: '',
},
officeLandmark2: {
value: '',
},
officePincode: {
value: '',
isValid: true,
},

officeCity: '',
officeState: {
value: null,
label: null,
},
officeCityVerified: true,
officeStateVerified: true,
 officeYear: '',
officeMonth: {
value: null,
label: null,
},
});
}

clearPermanantAdd(){
this.setState({
permanentResAddr2: {
value: '',
},
permanentResLandmark1: {
value: '',
},
permanentResLandmark2: {
value: '',
},
permanentResPincode: {
value: '',
isValid: true,
},
permanentResCity: '',
permanentResState: {
value: null,
label: null
},
permanentResCityVerified: true,
permanentResStateVerified: true,
permanentResYear: '',
permanentResMonth: {
value: null,
label: null,
},
})
}

//currentAdd get manoj

getUtilityDocDetails(type) {
if (this.state.residenceDocType.value == 'Electricity Bill') {
const dataToAPI = {
consumerId: this.state.consumerNumber,
serviceprovider: this.state.serviceProvider.code,
};
this.props.getDetailsElectricity({
dataToAPI,
callback: (response) => {
// console.log("fffffffffff",response);
type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
...this.state.permanentResAddr1,
value: response.data.address || '',
},
sameAsKycAddress: false,
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.consumer_name || '',
 })
:
this.setState({
permanentAddress1: {
...this.state.permanentAddress1,
value: response.data.address || '',
},
officeAddress1: {
...this.state.officeAddress1,
value: response.data.address || '',
},
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.consumer_name || '',
isSelected1: false,
isSelected: false,
},()=>{this.clearCurrentAdd()})
},
});
}
else if (this.state.residenceDocType.value == 'Election / Voters Identity
Card') {
const dataToAPI = {
type: 'voterId',
epic_no: this.state.consumerNumber,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};

this.props.getDetailsGas({
dataToAPI,
callback: (response) => {
type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
...this.state.permanentResAddr1,
value: response.data.ps_name || '',
},
sameAsKycAddress: false,
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name || '',
})
:
this.setState({
permanentAddress1: {
...this.state.permanentAddress1,
value: response.data.ps_name || '',
},
officeAddress1: {
...this.state.officeAddress1,
value: response.data.ps_name || '',
},
isSelected1: false,
isSelected: false,
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
 karzaName: response.data.name || '',

},()=>{this.clearCurrentAdd()})
},
});
}
else if (this.state.residenceDocType.value == 'Valid Driving License') {
const dataToAPI = {
type: 'drivingLicence',
drivingLicenceNumber: this.state.consumerNumber,
dateOfBirth: this.state.panDOB,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};
this.props.getDetailsGas({
dataToAPI,
callback: (response) => {
type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
...this.state.permanentResAddr1,
value: response.data.address[0].completeAddress || '',
},
sameAsKycAddress: false,
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name || '',
})
:
this.setState({
permanentAddress1: {
...this.state.permanentAddress1,
value: response.data.address[0].completeAddress || '',
},
officeAddress1: {
...this.state.officeAddress1,
value: response.data.address[0].completeAddress || '',
},
isSelected1: false,
isSelected: false,
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name || '',

},()=>{this.clearCurrentAdd()})
},
});
}
else if (this.state.residenceDocType.value == 'Valid Passport') {
const dataToAPI = {
type: 'passport',
fileNo: this.state.consumerNumber,
dob: this.state.panDOB,

applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
 : this.state.applicantUniqueId,
};
this.props.getDetailsGas({
dataToAPI,
callback: (response) => {
type == 'permanentResidant' ?
this.setState({
// permanentResAddr1: {
// ...this.state.permanentResAddr1,
// value: response.data.address || '',
// },
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name.nameFromPassport + ' ' +
response.data.name.surnameFromPassport || '',
})
:
this.setState({
// permanentAddress1: {
// ...this.state.permanentAddress1,
// value: response.data.address || '',
// },
// officeAddress1: {
// ...this.state.officeAddress1,
// value: response.data.address || '',
// },
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name.nameFromPassport + ' ' +
response.data.name.surnameFromPassport || '',

},()=>{this.clearCurrentAdd()})
},
});
}
else if (this.state.residenceDocType.value == 'LPG Receipt') {
const dataToAPI = {
lpgId: this.state.consumerNumber,
};

this.props.getDetailsGas({
dataToAPI,
callback: (response) => {

type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
...this.state.permanentResAddr1,
value: response.data.ConsumerAddress || '',
},
sameAsKycAddress: false,
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.ConsumerName || '',
})
:
this.setState({
permanentAddress1: {
...this.state.permanentAddress1,
 value: response.data.ConsumerAddress || '',
},
officeAddress1: {
...this.state.officeAddress1,
value: response.data.ConsumerAddress || '',
},
isSelected1: false,
isSelected: false,
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.ConsumerName || '',

},()=>{this.clearCurrentAdd()})
},
});
}
else if (this.state.residenceDocType.value == 'PNG Receipt') {
const dataToAPI = {
type: 'gas',
consumer_id: this.state.consumerNumber,
service_provider: this.state.serviceProvider.value,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};
this.props.getDetailsGas({
dataToAPI,
callback: (response) => {

type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
...this.state.permanentResAddr1,
value: response.data.Customer_Address || '',
},
sameAsKycAddress: false,
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.Customer_Name || '',
})
:
this.setState({
permanentAddress1: {
...this.state.permanentAddress1,
value: response.data.Customer_Address || '',
},
officeAddress1: {
...this.state.officeAddress1,
value: response.data.Customer_Address || '',
},
isSelected1: false,
isSelected: false,
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.Customer_Name || '',

},()=>{this.clearCurrentAdd()})
},
 });
}
else if (this.state.residenceDocType.value == 'Post Paid Mobile Bill') {
const dataToAPI = {
telphoneNo: `${this.state.stdCode}-${this.state.landlineNumber}`,
city: this.state.cityNameUtility,
};

this.props.getDetailsLandline({
dataToAPI,
callback: (response) => {
type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
...this.state.permanentResAddr1,
value: response.data.address || '',
},
sameAsKycAddress: false,
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name || '',
})
:
this.setState({
permanentAddress1: {
...this.state.permanentAddress1,
value: response.data.address || '',
},
officeAddress1: {
...this.state.officeAddress1,
value: response.data.address || '',
},
isSelected1: false,
isSelected: false,
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name || '',

},()=>{this.clearCurrentAdd()})
},
});
}
}

//permanent get manoj

getPermanentDocDetails(type) {

if (this.state.permanentResidenceDocType.value == 'Electricity Bill') {

const dataToAPI = {
consumerId: this.state.permanentConsumerNumber,
serviceprovider: this.state.permanentServiceProvider.code,
};
this.props.getDetailsElectricity({
dataToAPI,
callback: (response) => {
type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
 ...this.state.permanentResAddr1,
value: response.data.address || '',
},
sameAsKycAddress: false,
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.consumer_name || '',
},()=>{this.clearPermanantAdd()})
:
this.setState({
permanentAddress1: {
...this.state.permanentAddress1,
value: response.data.address || '',
},
officeAddress1: {
...this.state.officeAddress1,
value: response.data.address || '',
},
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.consumer_name || '',
isSelected1: false,
isSelected: false,
})
},
});
}
else if (this.state.permanentResidenceDocType.value == 'Election / Voters
Identity Card') {
const dataToAPI = {
type: 'voterId',
epic_no: this.state.permanentConsumerNumber,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};

this.props.getDetailsGas({
dataToAPI,
callback: (response) => {
type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
...this.state.permanentResAddr1,
value: response.data.ps_name || '',
},
sameAsKycAddress: false,
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name || '',
},()=>{this.clearPermanantAdd()})
:
this.setState({
permanentAddress1: {
...this.state.permanentAddress1,
value: response.data.ps_name || '',
},
officeAddress1: {
 ...this.state.officeAddress1,
value: response.data.ps_name || '',
},
isSelected1: false,
isSelected: false,
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name || '',

})
},
});
}
else if (this.state.permanentResidenceDocType.value == 'Valid Driving License')
{
const dataToAPI = {
type: 'drivingLicence',
drivingLicenceNumber: this.state.permanentConsumerNumber,
dateOfBirth: this.state.panDOB,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};
this.props.getDetailsGas({
dataToAPI,
callback: (response) => {
type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
...this.state.permanentResAddr1,
value: response.data.address[0].completeAddress || '',
},
sameAsKycAddress: false,
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name || '',
},()=>{this.clearPermanantAdd()})
:
this.setState({
permanentAddress1: {
...this.state.permanentAddress1,
value: response.data.address[0].completeAddress || '',
},
officeAddress1: {
...this.state.officeAddress1,
value: response.data.address[0].completeAddress || '',
},
isSelected1: false,
isSelected: false,
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name || '',

})
},
});
}
else if (this.state.permanentResidenceDocType.value == 'Valid Passport') {
 const dataToAPI = {
type: 'passport',
fileNo: this.state.permanentConsumerNumber,
dob: this.state.panDOB,

applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};
this.props.getDetailsGas({
dataToAPI,
callback: (response) => {
type == 'permanentResidant' ?
this.setState({
// permanentResAddr1: {
// ...this.state.permanentResAddr1,
// value: response.data.address || '',
// },
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name.nameFromPassport + ' ' +
response.data.name.surnameFromPassport || '',
},()=>{this.clearPermanantAdd()})
:
this.setState({
// permanentAddress1: {
// ...this.state.permanentAddress1,
// value: response.data.address || '',
// },
// officeAddress1: {
// ...this.state.officeAddress1,
// value: response.data.address || '',
// },
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name.nameFromPassport + ' ' +
response.data.name.surnameFromPassport || '',

})
},
});
}
else if (this.state.permanentResidenceDocType.value == 'LPG Receipt') {
const dataToAPI = {
lpgId: this.state.permanentConsumerNumber,
};

this.props.getDetailsGas({
dataToAPI,
callback: (response) => {

type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
...this.state.permanentResAddr1,
value: response.data.ConsumerAddress || '',
},
sameAsKycAddress: false,
 permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.ConsumerName || '',
},()=>{this.clearPermanantAdd()})
:
this.setState({
permanentAddress1: {
...this.state.permanentAddress1,
value: response.data.ConsumerAddress || '',
},
officeAddress1: {
...this.state.officeAddress1,
value: response.data.ConsumerAddress || '',
},
isSelected1: false,
isSelected: false,
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.ConsumerName || '',

})
},
});
}
else if (this.state.permanentResidenceDocType.value == 'PNG Receipt') {
const dataToAPI = {
type: 'gas',
consumer_id: this.state.permanentConsumerNumber,
service_provider: this.state.serviceProvider.value,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};
this.props.getDetailsGas({
dataToAPI,
callback: (response) => {

type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
...this.state.permanentResAddr1,
value: response.data.Customer_Address || '',
},
sameAsKycAddress: false,
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.Customer_Name || '',
},()=>{this.clearPermanantAdd()})
:
this.setState({
permanentAddress1: {
...this.state.permanentAddress1,
value: response.data.Customer_Address || '',
},
officeAddress1: {
...this.state.officeAddress1,
value: response.data.Customer_Address || '',
},
 isSelected1: false,
isSelected: false,
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.Customer_Name || '',

})
},
});
}
else if (this.state.permanentResidenceDocType.value == 'Post Paid Mobile Bill')
{
const dataToAPI = {
telphoneNo: `${this.state.stdCode}-${this.state.landlineNumber}`,
city: this.state.cityNameUtility,
};

this.props.getDetailsLandline({
dataToAPI,
callback: (response) => {
type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
...this.state.permanentResAddr1,
value: response.data.address || '',
},
sameAsKycAddress: false,
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name || '',
},()=>{this.clearPermanantAdd()})
:
this.setState({
permanentAddress1: {
...this.state.permanentAddress1,
value: response.data.address || '',
},
officeAddress1: {
...this.state.officeAddress1,
value: response.data.address || '',
},
isSelected1: false,
isSelected: false,
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name || '',

})
},
});
}
}

//currentResi get manoj

getCurrentDocDetails(type) {
if (this.state.selectedOfficeDocType.value == 'Electricity Bill') {
const dataToAPI = {
consumerId: this.state.consumerNumber,
serviceprovider: this.state.serviceProvider.code,
 };
this.props.getDetailsElectricity({
dataToAPI,
callback: (response) => {
// console.log("hhhhhhhhhh",response?.data, response?.data?.karzaDataFlag
? true : response?.data?.karzaDataFlag== false ? false : null);
type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
...this.state.permanentResAddr1,
value: response.data.address || '',
},
sameAsKycAddress: false,
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.consumer_name || '',
})
:
this.setState({
permanentAddress1: {
...this.state.permanentAddress1,
value: response.data.address || '',
},
officeAddress1: {
...this.state.officeAddress1,
value: response.data.address || '',
},
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.consumer_name || '',
isSelected1: false,
isSelected: false,
},()=>{this.clearCurrentResiAdd()})
},
});
}
else if (this.state.selectedOfficeDocType.value == 'Election / Voters Identity
Card') {
const dataToAPI = {
type: 'voterId',
epic_no: this.state.consumerNumber,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};

this.props.getDetailsGas({
dataToAPI,
callback: (response) => {
type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
...this.state.permanentResAddr1,
value: response.data.ps_name || '',
},
sameAsKycAddress: false,
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
 karzaName: response.data.name || '',
})
:
this.setState({
permanentAddress1: {
...this.state.permanentAddress1,
value: response.data.ps_name || '',
},
officeAddress1: {
...this.state.officeAddress1,
value: response.data.ps_name || '',
},
isSelected1: false,
isSelected: false,
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name || '',

},()=>{this.clearCurrentResiAdd()})
},
});
}
else if (this.state.selectedOfficeDocType.value == 'Valid Driving License') {
const dataToAPI = {
type: 'drivingLicence',
drivingLicenceNumber: this.state.consumerNumber,
dateOfBirth: this.state.panDOB,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};
this.props.getDetailsGas({
dataToAPI,
callback: (response) => {
type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
...this.state.permanentResAddr1,
value: response.data.address[0].completeAddress || '',
},
sameAsKycAddress: false,
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name || '',
})
:
this.setState({
permanentAddress1: {
...this.state.permanentAddress1,
value: response.data.address[0].completeAddress || '',
},
officeAddress1: {
...this.state.officeAddress1,
value: response.data.address[0].completeAddress || '',
},
isSelected1: false,
isSelected: false,
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name || '',

},()=>{this.clearCurrentResiAdd()})
},
});
}
else if (this.state.selectedOfficeDocType.value == 'Valid Passport') {
const dataToAPI = {
type: 'passport',
fileNo: this.state.consumerNumber,
dob: this.state.panDOB,

applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};
this.props.getDetailsGas({
dataToAPI,
callback: (response) => {
type == 'permanentResidant' ?
this.setState({
// permanentResAddr1: {
// ...this.state.permanentResAddr1,
// value: response.data.address || '',
// },
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name.nameFromPassport + ' ' +
response.data.name.surnameFromPassport || '',
})
:
this.setState({
// permanentAddress1: {
// ...this.state.permanentAddress1,
// value: response.data.address || '',
// },
// officeAddress1: {
// ...this.state.officeAddress1,
// value: response.data.address || '',
// },
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name.nameFromPassport + ' ' +
response.data.name.surnameFromPassport || '',

},()=>{this.clearCurrentResiAdd()})
},
});
}
else if (this.state.selectedOfficeDocType.value == 'LPG Receipt') {
const dataToAPI = {
lpgId: this.state.consumerNumber,
};

this.props.getDetailsGas({
dataToAPI,
callback: (response) => {
 type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
...this.state.permanentResAddr1,
value: response.data.ConsumerAddress || '',
},
sameAsKycAddress: false,
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.ConsumerName || '',
})
:
this.setState({
permanentAddress1: {
...this.state.permanentAddress1,
value: response.data.ConsumerAddress || '',
},
officeAddress1: {
...this.state.officeAddress1,
value: response.data.ConsumerAddress || '',
},
isSelected1: false,
isSelected: false,
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.ConsumerName || '',

},()=>{this.clearCurrentResiAdd()})
},
});
}
else if (this.state.selectedOfficeDocType.value == 'PNG Receipt') {
const dataToAPI = {
type: 'gas',
consumer_id: this.state.consumerNumber,
service_provider: this.state.serviceProvider.value,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};
this.props.getDetailsGas({
dataToAPI,
callback: (response) => {

type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
...this.state.permanentResAddr1,
value: response.data.Customer_Address || '',
},
sameAsKycAddress: false,
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.Customer_Name || '',
})
:
this.setState({
 permanentAddress1: {
...this.state.permanentAddress1,
value: response.data.Customer_Address || '',
},
officeAddress1: {
...this.state.officeAddress1,
value: response.data.Customer_Address || '',
},
isSelected1: false,
isSelected: false,
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.Customer_Name || '',

},()=>{this.clearCurrentResiAdd()})
},
});
}
else if (this.state.selectedOfficeDocType.value == 'Post Paid Mobile Bill') {
const dataToAPI = {
telphoneNo: `${this.state.stdCode}-${this.state.landlineNumber}`,
city: this.state.cityNameUtility,
};

this.props.getDetailsLandline({
dataToAPI,
callback: (response) => {
type == 'permanentResidant' ?
this.setState({
permanentResAddr1: {
...this.state.permanentResAddr1,
value: response.data.address || '',
},
sameAsKycAddress: false,
permanentKarzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name || '',
})
:
this.setState({
permanentAddress1: {
...this.state.permanentAddress1,
value: response.data.address || '',
},
officeAddress1: {
...this.state.officeAddress1,
value: response.data.address || '',
},
isSelected1: false,
isSelected: false,
karzaDataFlag: response?.data?.karzaDataFlag ? true :
response?.data?.karzaDataFlag == false ? false : null,
karzaName: response.data.name || '',

},()=>{this.clearCurrentResiAdd()})
},
});
}
}
 //permanent manoj
renderPermanentResAddr() {
const {
residentialAddressContainer,
inputTextStyle,
kycDocLabel,
textStyle,
textStyle1,
inputStyle,
separatorInputStyle,
saveButtonStyle,
saveButtonTitleStyle,
errorLabel,
marginTop20,
disableTextStyle,
disableStyle,
} = AdditionalDetailsStyles;
return (
<View style={residentialAddressContainer}>
{/* {this.state.residenceFlag == false ? */}
{this.renderDocument()}

{<View style={{ flexDirection: 'row' }}>

<CheckBox
disabled={this.state.isViewOnly}
value={this.state.sameAsKycAddress}
tintColors={{ true: colors.COLOR_LIGHT_NAVY_BLUE }}
onValueChange={() => {
this.setState({ sameAsKycAddress: !this.state.sameAsKycAddress }, ()
=> {
this.setState({
permanentResAddr1: {
value: !this.state.sameAsKycAddress ? "" :
this.state.addressLine1.value,
},
permanentResAddr2: {
value: !this.state.sameAsKycAddress ? "" :
this.state.addressLine2.value,
},
permanentResLandmark1: {
value: !this.state.sameAsKycAddress ? "" :
this.state.landmark1.value,
},
permanentResLandmark2: {
value: !this.state.sameAsKycAddress ? "" :
this.state.landmark2.value,
},
permanentResPincode: {
value: !this.state.sameAsKycAddress ? "" :
this.state.pincode.value,
isValid: !this.state.sameAsKycAddress ? true :
this.state.pincode.isValid,
},
permanentResCity: !this.state.sameAsKycAddress ? "" :
this.state.city,
permanentResState: {
value: !this.state.sameAsKycAddress ? "" :
this.state.state.value,
 label: !this.state.sameAsKycAddress ? "" :
this.state.state.value,
},
// permanentResYear: !this.state.sameAsKycAddress ? "" :
this?.state?.year,
// permanentResMonth: {
// value: !this.state.sameAsKycAddress ? null :
this.state.selectedMonth.value,
// label: !this.state.sameAsKycAddress ? null :
this.state.selectedMonth.label,
// },
// permanentResidenceType: {
// value: !this.state.sameAsKycAddress ? null :
this.state.selectedResidentType.value,
// label: !this.state.sameAsKycAddress ? null :
this.state.selectedResidentType.label,
// },

})
})
}}
style={{ alignSelf: "center" }}
/>
<Text style={{ fontSize: FONT_SIZE.m, color:
colors.COLOR_LIGHT_NAVY_BLUE, fontFamily: APP_FONTS.NunitoBold, margin: 8 }}>Same
as KYC Address?</Text>
</View>}
{/* : null} */}

<View style={{ marginBottom: 15, marginTop: 15 }}>

<Text style={{
color: colors.COLOR_LIGHT_NAVY_BLUE,
fontFamily: APP_FONTS.NunitoRegular,
fontSize: 16,
marginLeft: 4
}}>
{ADDITIONAL_DETAILS_CONST.OFFICE_TYPE}
</Text>
<DropDownPicker
disabled={this.state.isViewOnly}
controller={(instance) => (this.controller = instance)}
items={this.state.dropdownKyc}
containerStyle={{ flex: 1, marginTop: 5, marginBottom: 15 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
placeholder={''}
defaultValue={this.state.permanentResidenceType.value}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {
this.setState({
permanentResidenceType: {
value: item.value || null,
label: item.label || null,
},
permanentResidenceDocType: {
value: null,
 label: null,
},
}, () => {
this.handleDocType(this?.state?.permanentResidenceType?.value,
'permanentResidence')
});
}}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<View style={separatorInputStyle} />
</View>

<View style={{ marginBottom: 10, marginTop: 10 }}>

<Text style={{
color: colors.COLOR_LIGHT_NAVY_BLUE,
fontFamily: APP_FONTS.NunitoRegular,
fontSize: 16,
marginLeft: 4
}}>
{'Document Type*'}
</Text>
<DropDownPicker
disabled={this.state.isViewOnly}
controller={(instance) => (this.controller = instance)}
items={this.state.dropdownPerDocType}
containerStyle={{ flex: 1, marginTop: 5, marginBottom: 10 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
placeholder={''}
defaultValue={this.state.permanentResidenceDocType.value}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {
this.setState({
permanentResidenceDocType: {
value: item.value || null,
label: item.label || null,
},
permanentServiceProvider: {
value: null,
label: null,
code: null
},
permanentConsumerNumber: '',
permanentKarzaDataFlag: null,
karzaName: ''

});
}}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
 <View style={separatorInputStyle} />
</View>

{
this.state.permanentResidenceDocType.value == 'Electricity Bill' ?
<View>
<View>
<Text
style={{
marginTop: 10, marginBottom: -4, marginLeft: 5, color:
colors.COLOR_LIGHT_NAVY_BLUE, fontFamily: APP_FONTS.NunitoRegular,
fontSize: 16,
}}>
{'Electricity bill on whose name?*'}
</Text>

<DropDownPicker
disabled={this.state.isViewOnly}
items={this.state.dropDownRelation}
containerStyle={{ flex: 1, marginTop: 5, marginBottom: 15 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
defaultValue={this.state.permanentSelectedRelation.value}
placeholder={""}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) =>
this.setState({
permanentSelectedRelation: {
value: item.value || null,
label: item.label || null,
}
})
}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<View style={[separatorInputStyle, { marginBottom: 10 }]} />
</View>

{this.state.permanentSelectedRelation.value !== 'Self' && <View>

<FloatingLabelInput
editable={!this.state.isViewOnly}
label={'Enter Name*'}
containerStyles={inputStyle}
// keyboardType={'number-pad'}
value={this.state.permanentConsumerName || undefined}
onChangeText={(value) => {
this.setState({
permanentConsumerName: value,
permanentConsumerNameValid: customerName_REGEX.test(value)

});
}}
customLabelStyles={{
 colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
{!this.state.permanentConsumerNameValid && (
<Text style={{ color: 'red', marginTop:
3, }}>{this.state.permanentConsumerName == '' ?
ADDITIONAL_DETAILS_CONST.REQUIRED_CONSUMER_NAME :
ADDITIONAL_DETAILS_CONST.INVALID_CONSUMER_NAME}</Text>)}
</View>}

</View>
: null
}

{
this.state.permanentResidenceDocType.value == 'Electricity Bill' ||
this.state.permanentResidenceDocType.value == 'PNG Receipt' ?
<View>
<Text
style={{
marginTop: 30, marginBottom: -4, marginLeft: 5, color:
colors.COLOR_LIGHT_NAVY_BLUE, fontFamily: APP_FONTS.NunitoRegular,
fontSize: 16,
}}>
{ADDITIONAL_DETAILS_CONST.SERVICE_PROVIDER}
</Text>

<DropDownPicker
disabled={this.state.isViewOnly}
items={this.state.permanentResidenceDocType.value == 'Electricity
Bill' ? this.state.serviceProviderList : this.state.dropdownServiceProvider}
containerStyle={{ flex: 1, marginTop: 5, marginBottom: 15 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
defaultValue={this.state.permanentServiceProvider.value}
placeholder={""}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) =>
this.setState({
permanentServiceProvider: {
value: item.value || null,
label: item.label || null,
code: item.code || null
}
})
}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
 <View style={separatorInputStyle} />
</View>
: null
}

{
this.state.permanentResidenceDocType.value == 'Electricity Bill' ||
this.state.permanentResidenceDocType.value == 'Election / Voters Identity Card' ||
this.state.permanentResidenceDocType.value == 'Valid Driving License'
|| this.state.permanentResidenceDocType.value == 'Valid Passport' ||
this.state.permanentResidenceDocType.value == 'LPG Receipt' ||
this.state.permanentResidenceDocType.value == 'PNG Receipt'
?
<View>

<View>
<FloatingLabelInput
editable={!this.state.isViewOnly}
label={
this.state.permanentResidenceDocType.value == 'Electricity
Bill' ? ADDITIONAL_DETAILS_CONST.CONSUMER_NUMBER :
this.state.permanentResidenceDocType.value == 'Election /
Voters Identity Card' ? ADDITIONAL_DETAILS_CONST.EPIC_NUMBER :
this.state.permanentResidenceDocType.value == 'Valid
Driving License' ? ADDITIONAL_DETAILS_CONST.DL_NO :
this.state.permanentResidenceDocType.value == 'Valid
Passport' ? ADDITIONAL_DETAILS_CONST.FILE_NUMBER_PASSPORT :
this.state.permanentResidenceDocType.value == 'PNG
Receipt' ? ADDITIONAL_DETAILS_CONST.CONSUMER_NUMBER :
this.state.permanentResidenceDocType.value == 'LPG
Receipt' ? ADDITIONAL_DETAILS_CONST.LPG_ID :
this.state.permanentResidenceDocType.value == 'Post
Paid Mobile Bill' ? "Bill Number" : null
}
containerStyles={inputStyle}
// keyboardType={'number-pad'}
value={this?.state?.permanentConsumerNumber?.toString() ||
undefined}
onChangeText={(value) => {
this.setState({
permanentConsumerNumber: value,
permanentConsumerNumberValid:
this.state.permanentResidenceDocType.value == 'Electricity Bill' ?
CONSUMER_NO_REGEX.test(value) :
this.state.permanentResidenceDocType.value == 'Election /
Voters Identity Card' ? EPICNO_REGEX.test(value) :
this.state.permanentResidenceDocType.value == 'Valid
Driving License' ? EPICNO_REGEX.test(value) :
this.state.permanentResidenceDocType.value == 'Valid
Passport' ? PASSPORT_REGEX.test(value) :
this.state.permanentResidenceDocType.value == 'PNG
Receipt' ? NUMBER_REGEX.test(value) :
this.state.permanentResidenceDocType.value == 'LPG
Receipt' ? NUMBER_REGEX.test(value) :
this.state.permanentResidenceDocType.value ==
'Post Paid Mobile Bill' ? TELEPHONE_REGEX.test(value) : null

});
}}
 customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
{!this.state.permanentConsumerNumberValid && (
<Text style={{ color: 'red', marginTop:
3, }}>{this.state.permanentConsumerNumber == '' ?
ADDITIONAL_DETAILS_CONST.REQUIRED_ID_NUMBER :
ADDITIONAL_DETAILS_CONST.INVALID_ID_NUMBER}</Text>)}
</View>

</View>
: null
}
{
this.state.permanentResidenceDocType.value == 'Post Paid Mobile Bill' ?
<View>
<View
style={{
...(Platform.OS !== 'android' && {
zIndex: 10,
}),
}}>
<DropDownPicker
// searchable
disabled={this.state.isViewOnly}
items={this.state.cityList}
containerStyle={{ flex: 1, marginTop: 5, marginBottom: 15 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
placeholder={this.state.cityNamePermanent !== ''
? this.state.cityNamePermanent
: ADDITIONAL_DETAILS_CONST.CITY}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {
this.setState({ cityNamePermanent: item.label })
}
}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<View style={separatorInputStyle} />
</View>

<View style={{ flexDirection: 'row', justifyContent: 'space-

between' }}>
<View style={{ width: '49%', marginTop: 20 }}>
 <FloatingLabelInput
editable={!this.state.isViewOnly}
label={ADDITIONAL_DETAILS_CONST.LABEL_LANDLINE_NUMBER}
containerStyles={inputStyle}
value={this.state.landlineNumberPermanent || undefined}
onChangeText={(value) => {
this.setState({
landlineNumberPermanent: value,
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
</View>
<View style={{ width: '49%', marginTop: 20 }}>
<FloatingLabelInput
editable={!this.state.isViewOnly}
label={ADDITIONAL_DETAILS_CONST.STD_CODE}
containerStyles={inputStyle}
value={this.state.stdCodePermanent || undefined}
onChangeText={(value) => {
this.setState({
stdCodePermanent: value,
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
</View>

</View>
</View>
: null
}

{
this.state.permanentResidenceDocType.value == 'Electricity Bill' ||
this.state.permanentResidenceDocType.value == 'Election / Voters Identity Card' ||
this.state.permanentResidenceDocType.value == 'Valid Driving License'
|| this.state.permanentResidenceDocType.value == 'Valid Passport' ||
this.state.permanentResidenceDocType.value == 'LPG Receipt' ||
this.state.permanentResidenceDocType.value == 'PNG Receipt'
?
<View>

<Button
isDisabled={this.getPermanentSaveDisable()}
 title={ADDITIONAL_DETAILS_CONST.BUTTON_GET_DETAILS}
onPress={() => {
if (!this.state.isViewOnly) {
this.getPermanentDocDetails("permanentResidant");
} else {
handleWarning("User access denied")
}
}}
customContainerStyle={
this.getPermanentSaveDisable()
? [disableStyle, {}]
: [saveButtonStyle, {}]
}
cutomTitleStyle={
this.getPermanentSaveDisable()
? disableTextStyle
: saveButtonTitleStyle
}
/>
</View>
: null
}

<FloatingLabelInput
editable={!this.state.isViewOnly}
multiline
label={ADDITIONAL_DETAILS_CONST.ADDRESS_LINE_1}
containerStyles={inputStyle}
value={this.state.permanentResAddr1.value || undefined}
onChangeText={(value) => {
this.setState({
permanentResAddr1: {
value: value,
},
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />

<View style={marginTop20}>
<FloatingLabelInput
editable={!this.state.isViewOnly}
label={ADDITIONAL_DETAILS_CONST.ADDRESS_LINE_2}
containerStyles={inputStyle}
value={this.state.permanentResAddr2.value || undefined}
onChangeText={(value) => {
this.setState({
permanentResAddr2: {
value: value,
},
});
 }}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
</View>
<View style={separatorInputStyle} />

<FloatingLabelInput
editable={!this.state.isViewOnly}
label={"Landmark 1*"}
containerStyles={inputStyle}
value={this.state.permanentResLandmark1.value || undefined}
onChangeText={(value) => {
this.setState({
permanentResLandmark1: {
value: value,
},
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />

<View style={marginTop20}>
<FloatingLabelInput
editable={!this.state.isViewOnly}
label={"Landmark 2"}
containerStyles={inputStyle}
value={this.state.permanentResLandmark2.value || undefined}
onChangeText={(value) => {
this.setState({
permanentResLandmark2: {
value: value,
},
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
</View>
<View style={separatorInputStyle} />
<View style={marginTop20}>
<FloatingLabelInput
editable={!this.state.isViewOnly}
maxLength={6}
label={ADDITIONAL_DETAILS_CONST.PINCODE}
containerStyles={inputStyle}
keyboardType={'number-pad'}
value={this.state.permanentResPincode.value || undefined}
onChangeText={(value) => {
const valid = PINCODE_REGEX.test(value);

this.setState(
{
permanentResPincode: {
value: value,
isValid: value !== '' ? valid : true,
},
permanentResCity: '',
permanentResState: { value: null, label: null },
},
() => {
if (
this.state.permanentResPincode.value.length === 6 &&
this.state.permanentResPincode.isValid
) {
this.getDataFromPincode(value, 'fromPermanentAddress');
}
},
);
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
</View>
<View style={separatorInputStyle} />
{!this.state.permanentResPincode.isValid && (
<Text style={errorLabel}>
{ADDITIONAL_DETAILS_CONST.PINCODE_VALIDATION}
</Text>
)}

<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>

<View style={{ width: '45%', marginTop: 15 }}>
<FloatingLabelInput
label={ADDITIONAL_DETAILS_CONST.CITY}
containerStyles={inputStyle}
editable={!this.state.isViewOnly}
// keyboardType={'numeric'}
value={this.state.permanentResCity || undefined}
onChangeText={(value) => {
this.setState({
permanentResCity: value,
permanentResCityVerified: NAME_REGEX.test(value)
});
 }}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
{!this.state.permanentResCityVerified && (
<Text style={{ color: 'red', marginTop:
3, }}>{ADDITIONAL_DETAILS_CONST.INVALID_CITY_NAME}</Text>)}
</View>

<View style={{ width: '45%', marginTop: 15 }}>

<DropDownPicker
disabled={this.state.kycFreeze}
controller={(instance) => (this.controllerKYC = instance)}
items={STATES}
containerStyle={{ marginTop: 15, marginBottom: 10 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
defaultValue={(
this.state.permanentResState.value || undefined)}
placeholder={''}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {
this.setState({
permanentResState: {
value: item.value || null,
label: item.label || null,
},
// utilityStateVerified: NAME_REGEX.test(item)
});

}}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<Text style={[textStyle, { position: 'absolute', top: 0, marginLeft: 5,
color: colors.COLOR_LIGHT_NAVY_BLUE, }]}>
{ADDITIONAL_DETAILS_CONST.STATE}
</Text>
<View style={separatorInputStyle} />
</View>
</View>

<>
<Text style={[kycDocLabel, { marginTop: 20, fontFamily:
APP_FONTS.NunitoBold }]}>
 {ADDITIONAL_DETAILS_CONST.RESIDING_ADDRESS}
</Text>
<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
<View style={{ width: '45%', marginTop: 15 }}>
<FloatingLabelInput
label={ADDITIONAL_DETAILS_CONST.YEAR}
containerStyles={inputStyle}
editable={!this.state.isViewOnly}
maxLength={2}
value={this?.state?.permanentResYear?.toString()}
keyboardType='number-pad'
onChangeText={(value) => {
// this?.state?.year.length < 2 ?
this.setState({ permanentResYear: value, })
// :null
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
</View>
<View style={{ width: '45%', marginTop: 15 }}>
<DropDownPicker
disabled={this.state.isViewOnly}
controller={(instance) => (this.controllerKYC = instance)}
items={this?.state?.dropDownMonth}
containerStyle={{ marginTop: 15, marginBottom: 10 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
defaultValue={this?.state?.permanentResMonth?.value}
placeholder={""}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {
this.setState({
permanentResMonth: {
value: item.value,
label: item.label || null,
}
});
}}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<Text style={[textStyle, { position: 'absolute', top: 0, marginLeft:
5, color: colors.COLOR_LIGHT_NAVY_BLUE, }]}>
{ADDITIONAL_DETAILS_CONST.MONTH}
</Text>
<View style={separatorInputStyle} />
</View>
 </View>
</>

{/* office save */}

<Button
isDisabled={
this.getPermanentResiAddSaveDisable()
}
title={ADDITIONAL_DETAILS_CONST.BUTTON_TITLE_SAVE}
onPress={() => {
const dataToAPI = {
docType: this.state.permanentResidenceDocType.value,
serviceProvider: this.state.permanentServiceProvider.value,
identityProofNo: this.state.permanentConsumerNumber,
electricityBillOnName: this.state.permanentSelectedRelation.value,
karzaDataFlag: this?.state?.permanentKarzaDataFlag,
electricityPersonName: this.state.permanentConsumerName,
karzaName: this.state.karzaName,
permanentAddress1: this.state.permanentResAddr1.value,
permanentAddress2: this.state.permanentResAddr2.value,
permanentPinCode: this.state.permanentResPincode.value,
permanentCity: this.state.permanentResCity,
permanentState: this.state.permanentResState.value,
permanentResidenceType: this.state.permanentResidenceType.value,
permanentAddressLandmark1: this.state.permanentResLandmark1.value,
permanentAddressLandmark2: this.state.permanentResLandmark2.value,
sameAsKycAddress: this.state.sameAsKycAddress,
id: this.state.idToEditPermResAddress,
permanentYear: this.state.permanentResYear,
permanentMonth: this.state.permanentResMonth.value,
leadCode: this.state.leadCode,
filePath: this.state.imageDataPermanent.front.uri,
ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
isguarantor: this.state.isguarantor,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};

{
// this.state.imageDataPermanent.front.uri != '' ?
this.props.savePermanentDetails({
dataToAPI,
callback: (response) => {
if (response && !response.error) {
this.setState({
permanantResiAddressData: true,
additionalDetailOptions: {
employementDetailsCollapsed: false,
officeAddressCollapsed: true,
registeredCollapsed: true,
permanentAddressCollapsed: true,
additionalContactCollapsed: true,
},
});

}
 },
})
// :
// handleError("Please Upload Document")
}

}}
customContainerStyle={
this.getPermanentResiAddSaveDisable() ? disableStyle : saveButtonStyle
}
cutomTitleStyle={
this.getPermanentResiAddSaveDisable() ? disableTextStyle :
saveButtonTitleStyle
}
/>
</View>
);
}

permanentResidenceAddr() {
const {
collapsedViewStyle,
collapsedContainer,
plusImageStyle,
registeredAddressLabel,
expandedContainer,
seperatorStyle,
expandedViewStyle,
} = AdditionalDetailsStyles;

if (this.state.additionalDetailOptions.permanentResidenceAddrCollapsed) {
return (
<View style={collapsedContainer}>

<TouchableOpacity
style={collapsedViewStyle}
onPress={() => {
this.handleCollapseExpand('permanentResidenceAddrCollapsed', false);
}}>
<Text style={registeredAddressLabel}>
{"Permanent Address*"}
</Text>
<Image source={BLUE_PLUS_ICON} style={plusImageStyle} />
</TouchableOpacity>
</View>
);
} else {
return (
<View style={expandedContainer}>
<View style={seperatorStyle} />
<View style={expandedViewStyle}>
<TouchableOpacity
style={{ flexDirection: 'row', width: '100%', justifyContent: 'space-
between' }}
onPress={() => {
this.handleCollapseExpand('permanentResidenceAddrCollapsed', true);
}}>
<Text style={registeredAddressLabel}>
{'Permanent Address*'}
 </Text>

<Image
source={MINUS_ICON}
style={plusImageStyle}
resizeMode="contain"
/>
</TouchableOpacity>
</View>
{this.renderPermanentResAddr()}
<View style={seperatorStyle} />
</View>
);
}
}

//currentResi manoj
renderOfficeAddress() {
const {
residentialAddressContainer,
kycDocLabel,
residentialAddressLabel,
inputTextStyle,
inputStyle,
separatorInputStyle,
textStyle,
saveButtonStyle,
saveButtonTitleStyle,
errorLabel,
marginTop20,
disableStyle,
disableTextStyle,
loanTextMain,
} = AdditionalDetailsStyles;
return (
<View style={residentialAddressContainer}>

{
this.state.currentAddressVisible == false &&

<View style={{ flexDirection: 'row' }}>

<CheckBox
disabled={this.state.isViewOnly || this.state.currentAddressFreeze ||
this.state.currentAddressFiledsEditableFreeze}
value={this.state.isSelected1}
tintColors={{ true: colors.COLOR_LIGHT_NAVY_BLUE }}
onValueChange={() => {
// if (this.state.indSelfSoleFlag) {
this.setState({ isSelected1: !this.state.isSelected1 }, () => {
this.setState({
officeAddress1: {
value: !this.state.isSelected1 ? "" :
this.state.addressLine1.value,
},
officeAddress2: {
value: !this.state.isSelected1 ? "" :
this.state.addressLine2.value,
 },
officeLandmark1: {
value: !this.state.isSelected1 ? "" :
this.state.landmark1.value,
},
officeLandmark2: {
value: !this.state.isSelected1 ? "" :
this.state.landmark2.value,
},
officePincode: {
value: !this.state.isSelected1 ? "" :
this.state.pincode.value,
isValid: !this.state.isSelected1 ? true :
this.state.pincode.isValid,
},
officeCity: !this.state.isSelected1 ? "" : this.state.city,
officeState: {
value: !this.state.isSelected1 ? "" : this.state.state.value,
isValid: !this.state.isSelected1 ? true :
this.state.state.isValid,
},
// !this.state.isSelected1 ? "" : this.state.state,
officeYear: !this.state.isSelected1 ? "" : this?.state?.year ||
'',
officeMonth: {
value: !this.state.isSelected1 ? null :
this.state.selectedMonth.value || null,
label: !this.state.isSelected1 ? null :
this.state.selectedMonth.label || null,
},
// selectedOfficeType: {
// value: !this.state.isSelected1 ? null :
this.state.selectedResidentType.value,
// label: !this.state.isSelected1 ? null :
this.state.selectedResidentType.label,
// }
})
})
// }
}}
style={{ alignSelf: "center" }}
/>
<Text style={{ fontSize: FONT_SIZE.m, color:
colors.COLOR_LIGHT_NAVY_BLUE, fontFamily: APP_FONTS.NunitoBold, margin: 5 }}>Same
as Registered Address?</Text>
</View>
}

<View style={{ marginBottom: 10, marginTop: 15 }}>

<Text style={{
color: colors.COLOR_LIGHT_NAVY_BLUE,
fontFamily: APP_FONTS.NunitoRegular,
fontSize: 16,
marginLeft: 4
}}>
{this.state.indSelfSoleFlag ? ADDITIONAL_DETAILS_CONST.OFFICE_TYPE :
ADDITIONAL_DETAILS_CONST.RESIDENT_TYPE}
</Text>
<DropDownPicker
 disabled={this.state.isViewOnly || this.state.currentAddressFreeze}
items={this.state.dropdownKyc}
defaultValue={this.state.selectedOfficeType.value}
placeholder={''}
controller={(instance) => (this.controllerKYC = instance)}
containerStyle={{ flex: 1, marginTop: 5, marginBottom: 15 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}

dropDownStyle={{ backgroundColor: '#ffffff' }}

onChangeItem={(item) => {
this.setState({
residenceFlag: item.value == 'PG' || item.value == "Corporate
Provided" ? false : true,
isSelected: false,
selectedOfficeType: {
value: item.value || null,
label: item.label || null,
},
selectedOfficeDocType: {
value: null,
label: null,
},
}, () => {
this.handleDocType(this?.state?.selectedOfficeType?.value,
"Office")
});

}}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<View style={separatorInputStyle} />
</View>

<View style={{ marginBottom: 10, marginTop: 10 }}>

<Text style={{
color: colors.COLOR_LIGHT_NAVY_BLUE,
fontFamily: APP_FONTS.NunitoRegular,
fontSize: 16,
marginLeft: 4
}}>
{'Document Type*'}
</Text>
<DropDownPicker
disabled={this.state.isViewOnly || this.state.currentAddressFreeze}
controller={(instance) => (this.controller = instance)}
items={this.state.dropdownOfficeDocType}
containerStyle={{ flex: 1, marginTop: 5, marginBottom: 10 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
 placeholder={''}
defaultValue={this.state.selectedOfficeDocType.value}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {
this.setState({
selectedOfficeDocType: {
value: item.value || null,
label: item.label || null,
},
serviceProvider: {
value: null,
label: null,
code: null
},
consumerNumber: '',
karzaDataFlag: null,
karzaName: ''

});
}}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<View style={separatorInputStyle} />
</View>
{/* {this?.state?.residenceDocType?.value == "Aadhar Card" && <View
style={{ marginVertical: 10, }}>
<Text style={[loanTextMain]}>Do you want to procees with aadhaar
authentication?*</Text>
<Text style={[loanTextMain, { marginVertical: 15 }]}>{'Yes - Aadhaar
OTP \nNo - Aadhaar OCR'}</Text>
<View style={radioContainer2}>{this.renderCurrentAddressRadio()}</View>
</View>} */}
{this.state.selectedOfficeDocType.value == "Aadhar Card" ? <View
style={{ marginVertical: 10, }}>
<Text style={[loanTextMain]}>Please select authentication type you want
to proceed with?*</Text>
{/* <Text style={[loanTextMain, { marginVertical: 15 }]}>{'Yes - Aadhaar
OTP \nNo - Aadhaar OCR'}</Text> */}
<View
style={{marginTop:15,marginLeft:4}}>{this.renderCurrentAddressRadio()}</View>
</View> : null}

{this?.state?.selectedOfficeDocType?.value == "Aadhar Card" &&

this.state.selectedCurrentAddressRadio == 'OCR' && this.renderCurrentDocument()}
{this?.state?.selectedOfficeDocType?.value != "Aadhar Card" &&
this?.state?.selectedOfficeDocType?.value != "" && this.renderCurrentDocument()}

{
this.state.selectedOfficeDocType.value == 'Electricity Bill' ?
<View>
<View>
<Text
style={{
marginTop: 10, marginBottom: -4, marginLeft: 5, color:
colors.COLOR_LIGHT_NAVY_BLUE, fontFamily: APP_FONTS.NunitoRegular,
fontSize: 16,
 }}>
{'Electricity bill on whose name?*'}
</Text>

<DropDownPicker
disabled={this.state.isViewOnly ||
this.state.currentAddressFreeze || this.state.currentAddressFiledsEditableFreeze}
items={this.state.dropDownRelation}
containerStyle={{ flex: 1, marginTop: 5, marginBottom: 15 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
defaultValue={this.state.selectedRelation.value}
placeholder={
""
}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) =>
this.setState({
selectedRelation: {
value: item.value || null,
label: item.label || null,
}
})
}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<View style={[separatorInputStyle, { marginBottom: 10 }]} />
</View>

{this.state.selectedRelation.value !== 'Self' && <View>

<FloatingLabelInput
editable={!this.state.isViewOnly && !
this.state.currentAddressFreeze && !this.state.currentAddressFiledsEditableFreeze}
label={'Enter Name*'}
containerStyles={inputStyle}
// keyboardType={'number-pad'}
value={this.state.consumerName || undefined}
onChangeText={(value) => {
this.setState({
consumerName: value,
consumerNameValid: customerName_REGEX.test(value)

});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
 {!this.state.consumerNameValid && (
<Text style={{ color: 'red', marginTop:
3, }}>{this.state.consumerName == '' ?
ADDITIONAL_DETAILS_CONST.REQUIRED_CONSUMER_NAME :
ADDITIONAL_DETAILS_CONST.INVALID_CONSUMER_NAME}</Text>)}
</View>}

</View>
: null
}

{
this.state.selectedOfficeDocType.value == 'Electricity Bill' ||
this.state.selectedOfficeDocType.value == 'PNG Receipt' ?
<View>
<Text
style={{
marginTop: 30, marginBottom: -4, marginLeft: 5, color:
colors.COLOR_LIGHT_NAVY_BLUE, fontFamily: APP_FONTS.NunitoRegular,
fontSize: 16,
}}>
{ADDITIONAL_DETAILS_CONST.SERVICE_PROVIDER}
</Text>

<DropDownPicker
disabled={this.state.isViewOnly || this.state.currentAddressFreeze
|| this.state.currentAddressFiledsEditableFreeze}
items={this.state.selectedOfficeDocType.value == 'Electricity Bill'
? this.state.serviceProviderList : this.state.dropdownServiceProvider}
containerStyle={{ flex: 1, marginTop: 5, marginBottom: 15 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
defaultValue={this.state.serviceProvider.value}
placeholder={
""
}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) =>
this.setState({
serviceProvider: {
value: item.value || null,
label: item.label || null,
code: item.code || null
}
})
}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<View style={separatorInputStyle} />
</View>
: null
}
 {
this.state.selectedOfficeDocType.value == 'Electricity Bill' ||
this.state.selectedOfficeDocType.value == 'Election / Voters Identity Card' ||
this.state.selectedOfficeDocType.value == 'Valid Driving License' ||
this.state.selectedOfficeDocType.value == 'Valid Passport' ||
this.state.selectedOfficeDocType.value == 'LPG Receipt' ||
this.state.selectedOfficeDocType.value == 'PNG Receipt'
?
<View>
<View>
<FloatingLabelInput
editable={!this.state.isViewOnly && !
this.state.currentAddressFreeze && !this.state.currentAddressFiledsEditableFreeze}
label={
this.state.selectedOfficeDocType.value == 'Electricity Bill' ?
ADDITIONAL_DETAILS_CONST.CONSUMER_NUMBER :
this.state.selectedOfficeDocType.value == 'Election / Voters
Identity Card' ? ADDITIONAL_DETAILS_CONST.EPIC_NUMBER :
this.state.selectedOfficeDocType.value == 'Valid Driving
License' ? ADDITIONAL_DETAILS_CONST.DL_NO :
this.state.selectedOfficeDocType.value == 'Valid
Passport' ? ADDITIONAL_DETAILS_CONST.FILE_NUMBER_PASSPORT :
this.state.selectedOfficeDocType.value == 'PNG Receipt'
? ADDITIONAL_DETAILS_CONST.CONSUMER_NUMBER :
this.state.selectedOfficeDocType.value == 'LPG
Receipt' ? ADDITIONAL_DETAILS_CONST.LPG_ID :
this.state.selectedOfficeDocType.value == 'Post
Paid Mobile Bill' ? "Bill Number" : null
}
containerStyles={inputStyle}
// keyboardType={'number-pad'}
value={this.state.consumerNumber || undefined}
onChangeText={(value) => {
this.setState({
consumerNumber: value,
consumerNumberValid: this.state.selectedOfficeDocType.value
== 'Electricity Bill' ? CONSUMER_NO_REGEX.test(value) :
this.state.selectedOfficeDocType.value == 'Election /
Voters Identity Card' ? EPICNO_REGEX.test(value) :
this.state.selectedOfficeDocType.value == 'Valid Driving
License' ? EPICNO_REGEX.test(value) :
this.state.selectedOfficeDocType.value == 'Valid
Passport' ? PASSPORT_REGEX.test(value) :
this.state.selectedOfficeDocType.value == 'PNG
Receipt' ? NUMBER_REGEX.test(value) :
this.state.selectedOfficeDocType.value == 'LPG
Receipt' ? NUMBER_REGEX.test(value) :
this.state.selectedOfficeDocType.value == 'Post
Paid Mobile Bill' ? TELEPHONE_REGEX.test(value) : null

});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
 />
<View style={separatorInputStyle} />
{!this.state.consumerNumberValid && (
<Text style={{ color: 'red', marginTop:
3, }}>{this.state.consumerNumber == '' ?
ADDITIONAL_DETAILS_CONST.REQUIRED_ID_NUMBER :
ADDITIONAL_DETAILS_CONST.INVALID_ID_NUMBER}</Text>)}
</View>

</View>
: null
}
{
this.state.selectedOfficeDocType.value == 'Post Paid Mobile Bill' ?
<View>
<View
style={{
...(Platform.OS !== 'android' && {
zIndex: 10,
}),
}}>
<DropDownPicker
// searchable
disabled={this.state.isViewOnly ||
this.state.currentAddressFreeze || this.state.currentAddressFiledsEditableFreeze}
items={this.state.cityList}
containerStyle={{ flex: 1, marginTop: 5, marginBottom: 15 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
placeholder={this.state.cityNameUtility !== ''
? this.state.cityNameUtility
: ADDITIONAL_DETAILS_CONST.CITY}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {
this.setState({ cityNameUtility: item.label })
}
}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<View style={separatorInputStyle} />
</View>

<View style={{ flexDirection: 'row', justifyContent: 'space-

between' }}>
<View style={{ width: '49%', marginTop: 20 }}>
<FloatingLabelInput
editable={!this.state.isViewOnly && !
this.state.currentAddressFreeze && !this.state.currentAddressFiledsEditableFreeze}
label={ADDITIONAL_DETAILS_CONST.LABEL_LANDLINE_NUMBER}
containerStyles={inputStyle}
value={this.state.landlineNumber || undefined}
 onChangeText={(value) => {
this.setState({
landlineNumber: value,
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
</View>
<View style={{ width: '49%', marginTop: 20 }}>
<FloatingLabelInput
editable={!this.state.isViewOnly && !
this.state.currentAddressFreeze && !this.state.currentAddressFiledsEditableFreeze}
label={ADDITIONAL_DETAILS_CONST.STD_CODE}
containerStyles={inputStyle}
value={this.state.stdCode || undefined}
onChangeText={(value) => {
this.setState({
stdCode: value,
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
</View>

</View>
</View>
: null
}

{
this.state.selectedOfficeDocType.value == 'Electricity Bill' ||
this.state.selectedOfficeDocType.value == 'Election / Voters Identity Card' ||
this.state.selectedOfficeDocType.value == 'Valid Driving License' ||
this.state.selectedOfficeDocType.value == 'Valid Passport' ||
this.state.selectedOfficeDocType.value == 'LPG Receipt' ||
this.state.selectedOfficeDocType.value == 'PNG Receipt'
?
<View>

<Button
isDisabled={this.getSaveDisableGetDetails()}
title={ADDITIONAL_DETAILS_CONST.BUTTON_VERIFY}
onPress={() => {
if (!this.state.isViewOnly) {
this.getCurrentDocDetails();
 } else {
handleWarning("User access denied")
}
}}
customContainerStyle={
this.getSaveDisableGetDetails()
? [disableStyle, {}]
: [saveButtonStyle, {}]
}
cutomTitleStyle={
this.getSaveDisableGetDetails()
? disableTextStyle
: saveButtonTitleStyle
}
/>
</View>
: null
}

<FloatingLabelInput
editable={!this.state.isViewOnly && !this.state.currentAddressFreeze && !
this.state.currentAddressFiledsEditableFreeze}
multiline
label={ADDITIONAL_DETAILS_CONST.ADDRESS_LINE_1}
containerStyles={inputStyle}
value={this.state.officeAddress1.value || undefined}
onChangeText={(value) => {
this.setState({
officeAddress1: {
value: value,
},
});

}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />

<View style={marginTop20}>
<FloatingLabelInput
editable={!this.state.isViewOnly && !this.state.currentAddressFreeze &&
!this.state.currentAddressFiledsEditableFreeze}
label={ADDITIONAL_DETAILS_CONST.ADDRESS_LINE_2}
containerStyles={inputStyle}
value={this.state.officeAddress2.value || undefined}
onChangeText={(value) => {
this.setState({
officeAddress2: {
value: value,
},
});

}}
 customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
</View>
<View style={separatorInputStyle} />

<FloatingLabelInput
editable={!this.state.isViewOnly && !this.state.currentAddressFreeze && !
this.state.currentAddressFiledsEditableFreeze}
label={"Landmark 1*"}
containerStyles={inputStyle}
value={this.state.officeLandmark1.value || undefined}
onChangeText={(value) => {
this.setState({
officeLandmark1: {
value: value,
},
});

}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />

<View style={marginTop20}>
<FloatingLabelInput
editable={!this.state.isViewOnly && !this.state.currentAddressFreeze
&&!this.state.currentAddressFiledsEditableFreeze}
label={"Landmark 2"}
containerStyles={inputStyle}
value={this.state.officeLandmark2.value || undefined}
onChangeText={(value) => {
this.setState({
officeLandmark2: {
value: value,
},
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
</View>
<View style={separatorInputStyle} />
 <View style={marginTop20}>
<FloatingLabelInput
maxLength={6}
editable={!this.state.isViewOnly && !this.state.currentAddressFreeze &&
!this.state.currentAddressFiledsEditableFreeze}
label={ADDITIONAL_DETAILS_CONST.PINCODE}
containerStyles={inputStyle}
keyboardType={'numeric'}
value={this.state.officePincode.value || undefined}
onChangeText={(value) => {
const valid = PINCODE_REGEX.test(value);

this.setState(
{
officePincode: {
value: value,
isValid: value !== '' ? valid : true,
},
officeCity: '',
officeState: {
value: null,
label: null
},
},
() => {
if (
this.state.officePincode.value.length === 6 &&
this.state.officePincode.isValid
) {
this.getDataFromPincode(value, 'fromOfficeAddress');
}
},
);

}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
</View>
<View style={separatorInputStyle} />
{!this.state.officePincode.isValid && (
<Text style={errorLabel}>
{ADDITIONAL_DETAILS_CONST.PINCODE_VALIDATION}
</Text>
)}

<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>

<View style={{ width: '45%', marginTop: 15 }}>
<FloatingLabelInput
label={ADDITIONAL_DETAILS_CONST.CITY}
editable={!this.state.isViewOnly && !this.state.currentAddressFreeze
&& !this.state.currentAddressFiledsEditableFreeze}
containerStyles={inputStyle}
 value={this.state.officeCity || undefined}
onChangeText={(value) => {
this.setState({
officeCity: value,
officeCityVerified: NAME_REGEX.test(value)
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
{!this.state.officeCityVerified && (
<Text style={{ color: 'red', marginTop:
3, }}>{ADDITIONAL_DETAILS_CONST.INVALID_CITY_NAME}</Text>)}
</View>

<View style={{ width: '45%', marginTop: 15 }}>

<DropDownPicker
disabled={this.state.isViewOnly || this.state.currentAddressFreeze ||
this.state.currentAddressFiledsEditableFreeze}
controller={(instance) => (this.controllerKYC = instance)}
items={STATES}
containerStyle={{ marginTop: 15, marginBottom: 10 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
defaultValue={(
this.state.officeState.value || undefined)}
placeholder={''}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {

this.setState({
officeState: {
value: item.value || null,
label: item.label || null,
},
// utilityStateVerified: NAME_REGEX.test(item)
});

}}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<Text style={[textStyle, { position: 'absolute', top: 0, marginLeft: 5,
color: colors.COLOR_LIGHT_NAVY_BLUE, }]}>
{ADDITIONAL_DETAILS_CONST.STATE}
</Text>
<View style={separatorInputStyle} />
</View>
 </View>
{this.state.indSelfSoleFlag &&
<View>

<>
<Text style={[kycDocLabel, { marginTop: 20, fontFamily:
APP_FONTS.NunitoBold }]}>
{this.state.indSelfSoleFlag ?
ADDITIONAL_DETAILS_CONST.BUSINESS_ADDRESS :
ADDITIONAL_DETAILS_CONST.RESIDING_ADDRESS}

</Text>
<View style={{ flexDirection: 'row', justifyContent: 'space-
between' }}>
<View style={{ width: '45%', marginTop: 15 }}>
<FloatingLabelInput
label={ADDITIONAL_DETAILS_CONST.YEAR}
containerStyles={inputStyle}
editable={!this.state.isViewOnly && !
this.state.currentAddressFreeze}
maxLength={2}
value={this?.state?.officeYear?.toString()}
keyboardType='number-pad'
onChangeText={(value) => {
// this?.state?.year.length < 2 ?
this.setState({ officeYear: value, })

// :null
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
</View>
<View style={{ width: '45%', marginTop: 15 }}>
<DropDownPicker
disabled={this.state.isViewOnly ||
this.state.currentAddressFreeze}
controller={(instance) => (this.controllerKYC = instance)}
items={this.state.dropDownMonth}
containerStyle={{ marginTop: 15, marginBottom: 10 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
defaultValue={this.state.officeMonth.value}
placeholder={""}
// defaultValue={this.state.permanentMonth.value}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {

this.setState({
officeMonth: {
 value: item.value,
label: item.label || null,
}
});

}}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<Text style={[textStyle, { position: 'absolute', top: 0,
marginLeft: 5, color: colors.COLOR_LIGHT_NAVY_BLUE, }]}>
{ADDITIONAL_DETAILS_CONST.MONTH}
</Text>
<View style={separatorInputStyle} />
</View>
</View>
</>
</View>
}
<Button
isDisabled={
// this.state.isOfficeAddressSaved ||
this.getOfficeSave() || this.state.isViewOnly ||
this.state.currentAddressFreeze
}
title={ADDITIONAL_DETAILS_CONST.BUTTON_TITLE_SAVE}
onPress={() => {
const dataToAPI1 = {
docType: this.state.selectedOfficeDocType.value,
serviceProvider: this.state.serviceProvider.value,
identityProofNo: this.state.consumerNumber,
electricityBillOnName: this.state.selectedRelation.value,
karzaDataFlag: this?.state?.karzaDataFlag,
electricityPersonName: this.state.consumerName,
karzaName: this.state.karzaName,
officeData: true,
address1: this.state.officeAddress1.value,
address2: this.state.officeAddress2.value,
landmark1: this.state.officeLandmark1.value,
landmark2: this.state.officeLandmark2.value,
pinCode: this.state.officePincode.value,
city: this.state.officeCity,
state: this.state.officeState.value,
type:
// this.state.indSelfSoleFlag ?
'Current office',
// : 'Office',
ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
isguarantor: this.state.isguarantor,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
id: this.state.idToEditOfficeAddress,
};
if (this.state.indSelfSoleFlag === true) {
 dataToAPI1['officeMonth'] = this.state.officeMonth.value,
dataToAPI1['officeType'] = this.state.selectedOfficeType.value,
dataToAPI1['officeYear'] = this.state.officeYear,
dataToAPI1['sameRegisteredAddressFlag'] = this.state.isSelected1,
dataToAPI1['gstAddressFlag'] = true

{
// this.state.imageDataCurrent.front.uri != '' ?
this.props.saveOfficeAddress({
dataToAPI1,
callback: (response) => {
if (this.state.currentAddressVisible) {
const dataToAPI = {
address: this.state.officeAddress1.value + ', ' +
this.state.officeAddress2.value + ', ' + this.state.officeLandmark1.value + ', ' +
this.state.officeLandmark2.value + ', ' + this.state.officeCity + ', ' +
this.state.officeState.value + ', ' + this.state.officePincode.value,
dealerName: this.state.dealerName,
applicantUniqueId: this.state.isguarantor ||
this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
}
this.props.getgeoFencingData({
dataToAPI,
callback: (response) => {
response.data.data.geoLocationOutOfService == false ?
handleWarning(response.data.data.response) :
//
this.props.navigation.navigate('PANAndGSTVerification', {
// leadName: this.state.leadName,
// "applicantUniqueId": this.state.iscoapplicant ||
this.state.isguarantor ? this.state.coapplicantUniqueId :
this.state.applicantUniqueId,
// leadCode: this.state.leadCode,
// mobileNumber: this.state.mobileNumberFromProps,
// coapplicantUniqueId: this.state.coapplicantUniqueId,
// ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
// iscoapplicant: this.state.iscoapplicant,
// isguarantor: this.state.isguarantor,
// isViewOnly: this.state.isViewOnly || false,
// });
this.props.navigation.navigate('LoanSummary', {
leadName: this.state.leadName,
"applicantUniqueId": this.state.iscoapplicant ||
this.state.isguarantor ? this.state.coapplicantUniqueId :
this.state.applicantUniqueId,
leadCode: this.state.leadCode,
mobileNumber: this.state.mobileNumberFromProps,
coapplicantUniqueId: this.state.coapplicantUniqueId,
ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
iscoapplicant: this.state.iscoapplicant,
isguarantor: this.state.isguarantor,
isViewOnly: this.state.isViewOnly || false,
});
 }
})
}
else {
const dataForgetQDE = {
applicant_uniqueid:
this.props.navigation.state.params.iscoapplicant ||
this.props.navigation.state.params.isguarantor
? this.props.navigation.state.params.coapplicantUniqueId
: this.props.navigation.state.params.applicantUniqueId,
ismainapplicant:
this.props.navigation.state.params.ismainapplicant,
isguarantor: this.props.navigation.state.params.isguarantor,
};
this.props.getQDEData({
dataForgetQDE,
callback: (response) => {

this.setState({
indSelfSoleFlag: response?.indSelfSoleFlag || false,
permanentVisible: response?.actualPermanentAddDetailsFlag
|| false,
}, () => {
// this.props.createUpdateCUSTOMER({
// data: {
// applicant_uniqueid: this.state.isguarantor ||
this.state.iscoapplicant ? this.state.coapplicantUniqueId :
this.state.applicantUniqueId,
// ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
// isguarantor: this.state.isguarantor,
// type: 'breBeforeSubmitToCredit'

// },
// callback: (response) => {
// // this.apiCall()
// }
// })
})
}
})
if (response && !response.error) {
this.setState({
isOfficeAddressSaved: true,
officeData: true,
additionalDetailOptions: {
employementDetailsCollapsed: true,
officeAddressCollapsed: true,
registeredCollapsed: true,
permanentAddressCollapsed: true,
additionalContactCollapsed: false,
},
});
}
}
},
})
// :
 // handleError('Please upload the document')
}

}}
customContainerStyle={
// this.state.isOfficeAddressSaved ||
this.getOfficeSave() || this.state.isViewOnly
? disableStyle
: saveButtonStyle
}
cutomTitleStyle={
// this.state.isOfficeAddressSaved ||
this.getOfficeSave() || this.state.isViewOnly
? disableTextStyle
: saveButtonTitleStyle
}
/>
</View>
);
}

officeAddress() {
const {
collapsedViewStyle,
collapsedContainer,
plusImageStyle,
registeredAddressLabel,
expandedContainer,
seperatorStyle,
expandedViewStyle,
} = AdditionalDetailsStyles;

if (this.state.additionalDetailOptions.officeAddressCollapsed) {
return (
<View style={collapsedContainer}>
<TouchableOpacity
style={collapsedViewStyle}
onPress={() => {
this.handleCollapseExpand('officeAddressCollapsed', false);
}}>
<Text style={registeredAddressLabel}>
{
// this.state.iscoapplicant || this.state.isguarantor ?
ADDITIONAL_DETAILS_CONST.OFFICE_ADDRESS_COAPPLICANT :
`${this.state.indSelfSoleFlag ?
ADDITIONAL_DETAILS_CONST.CURRENT_OFFICE_ADDRESS :
ADDITIONAL_DETAILS_CONST.OFFICE_ADDRESS}`}
</Text>
<Image source={BLUE_PLUS_ICON} style={plusImageStyle} />
</TouchableOpacity>
</View>
);
} else {
return (
<View style={expandedContainer}>
<View style={seperatorStyle} />
<View style={expandedViewStyle}>
<TouchableOpacity
style={{ flexDirection: 'row', width: '100%', justifyContent: 'space-
between' }}
onPress={() => {
this.handleCollapseExpand('officeAddressCollapsed', true);
}}>
<Text style={registeredAddressLabel}>
{
// this.state.iscoapplicant || this.state.isguarantor ?
ADDITIONAL_DETAILS_CONST.OFFICE_ADDRESS_COAPPLICANT :
`${this.state.indSelfSoleFlag ?
ADDITIONAL_DETAILS_CONST.CURRENT_OFFICE_ADDRESS :
ADDITIONAL_DETAILS_CONST.OFFICE_ADDRESS}`}
</Text>

<Image
source={MINUS_ICON}
style={plusImageStyle}
resizeMode="contain"
/>
</TouchableOpacity>
</View>

{this.renderOfficeAddress()}
<View style={seperatorStyle} />
</View>
);
}
}

fetchDataWithTimeout = (data) => {

// Fetch the first API
const token = this.props?.userData?.token;
const dispatch=this.props?.dispatch;

const firstAPICall =
FirstExternalServerApi(token,dispatch,this.state?.firstProteanServerData?.apiUrlReq
uest,this.state?.firstProteanServerData?.username,this.state?.firstProteanServerDat
a?.password,data);

// Set a timer for 5 seconds

const timeoutPromise = new Promise((resolve, reject) => {
setTimeout(() => {
reject(new Error('Timeout occurred'));
}, this.state.requestApiCheckOutTime);
});

// Race between the first API call and the timeout

Promise.race([firstAPICall, timeoutPromise])
.then(response => {
// Handle the response from the first API
console.log('Response from first API:', response);
try{
this.setState({
serverLocation:this.state?.firstProteanServerData?.serverLocation,
serverPassword:this.state?.firstProteanServerData?.password,
serverUrl:this.state?.firstProteanServerData?.apiUrlResponse,
serverUserName:this.state?.firstProteanServerData?.username
})
if(response?.encodedSignxml){
console.log("starting intent");
 MyIntentModule.launchIntent("1.0", response?.encodedSignxml,
"14.111.11.200");
// this.launchIntent(response?.data?.encodedSignxml)
}
} catch (error){
console.log(error,"error in catch loop 2");
}
})
.catch(error => {
// If timeout occurs, fetch from the second API
console.log(error.message);
let apiData={
applicantUniqueid:data?.applicantUniqueid,
aadharAuthenticationType:data?.aadharAuthenticationType,
aadharNumber:data?.aadharNumber,
section:"initialCurrentAddress",
serverLocation: this.state.secondProteanServerData?.serverLocation
}
console.log('Fetching data from second API...');

SecondExternalServerApi(this.token,dispatch,this.state?.secondProteanServerData?.ap
iUrlRequest,this.state?.secondProteanServerData?.username,this.state?.secondProtean
ServerData?.password,apiData)
.then(response => {
// Handle the response from the second API
console.log('Response from second API:', response);
try{
this.setState({
serverLocation:this.state?.secondProteanServerData?.serverLocation,
serverPassword:this.state?.secondProteanServerData?.password,
serverUrl:this.state?.secondProteanServerData?.apiUrlResponse,
serverUserName:this.state?.secondProteanServerData?.username
});
if(response?.encodedSignxml){
console.log("starting intent");
MyIntentModule.launchIntent("1.0", response?.encodedSignxml,
"14.111.11.200");
// this.launchIntent(response?.data?.encodedSignxml)
}
} catch (error){
console.log(error,"error in catch loop 2");
}
})
.catch(error => {
// Handle error from the second API
console.error('Error fetching data from second API:', error);
});
});
};

selectCurrentAddressRadioButtons(value, index) {
this.setState({
selectedCurrentAddressRadio: value.title,
currentAddressaadharAuthenticationType: value.title == 'OTP' ? 'AadharOtp' :
value.title == 'OCR' ? 'AadharOcr' : value.title == 'Face' ? 'AadharFace' :
value.title == 'Fingerprint' ? 'AadharFingerprint' : 'AadharOtp',
currentAddressaadharAuthentication: value.title == 'OCR' ? false : true,
currentAddressotpVisibile: value.title == 'OTP' ? false : false,
}, () => {
 const data ={
applicantUniqueid:this.state.applicantUniqueId,
aadharAuthenticationType:value.title == 'OTP' ? 'AadharOtp' : value.title
== 'OCR' ? 'AadharOcr' : value.title == 'Face' ? 'AadharFace' : value.title ==
'Fingerprint' ? 'AadharFingerprint' : 'AadharOtp',
aadharNumber:this?.state?.adharID?.toString()?.replace(/ /g, ""),
section:"initialCurrentAddress",
serverLocation: this.state.firstProteanServerData?.serverLocation
}

{
value.title != "OCR" ?
this.fetchDataWithTimeout(data)
// this.props.getProtenExmlRequest({
// data,
// callback: (response) => {
// try{
// if(response?.data?.encodedSignxml){
// console.log("starting intent");
// MyIntentModule.launchIntent("1.0", response?.data?.encodedSignxml,
"14.111.11.200");
// // this.launchIntent(response?.data?.encodedSignxml)
// }
// } catch (error){
// console.log(error,"error in catch loop 2");
// }
// },
// })
: null
}
});
}

// renderCurrentAddressRadio() {
// return this.state.sourceValue.map((value, index) => (
// <View key={index}>
// <RadioButton
// title={value.title}
// isSelected={
// this.state.selectedCurrentAddressRadio.toLowerCase() ===
// value.title.toLowerCase()
// ? true
// : false
// }
// onPress={() => {

// if (!this.state.isViewOnly && this.state.adharIdValid) {

// return this.selectCurrentAddressRadioButtons(value, index);
// }
// }}
// />
// </View>
// ));
// }

renderCurrentAddressRadioDetails(value, index) {
return <View key={index} style={{marginVertical:5}}>
<RadioButton
 title={value.title}
isSelected={
this.state.selectedCurrentAddressRadio.toLowerCase() ===
value.title.toLowerCase()
? true
: false
}
onPress={() => {

if (!this.state.isViewOnly && !
this.state.currentAddressRadioButtonFreeze) {
return this.selectCurrentAddressRadioButtons(value, index);
}
}}
/>
</View>

renderCurrentAddressRadio() {
return this.state.aatharAuthenticationTypeList.map((value, index) => (
(value.title == "OTP" && this.state.isOtpRadioButtonVisible) ?
this.renderCurrentAddressRadioDetails(value,index) : (value.title == "OCR" &&
this.state.isOcrRadioButtonVisible) ?
this.renderCurrentAddressRadioDetails(value,index) : (value.title == "Face" &&
this.state.isFaceRadioButtonVisible) ?
this.renderCurrentAddressRadioDetails(value,index) : (value.title == "Fingerprint"
&& this.state.isFingerRadioButtinVisible) ?
this.renderCurrentAddressRadioDetails(value,index) : null
));
}

//currentAdd manoj
renderPermanentAddress() {
// console.log("mjjjjjj",this.state.permanentState);
const {
residentialAddressContainer,
inputTextStyle,
kycDocLabel,
textStyle,
textStyle1,
inputStyle,
separatorInputStyle,
saveButtonStyle,
saveButtonTitleStyle,
errorLabel,
marginTop20,
disableTextStyle,
disableStyle,
textStyleOTP,
input,
loanTextMain,
radioContainer2
} = AdditionalDetailsStyles;

const {currentAddressBoxChecked} = this.state;

return (
<View style={residentialAddressContainer}>
 {this.state.currentAddressVisible == false && <View style={{ flexDirection:
'row' }}>
<CheckBox
disabled={this.state.isViewOnly}
value={this.state.isSelected}
tintColors={{ true: colors.COLOR_LIGHT_NAVY_BLUE }}
onValueChange={() => {
this.setState({ isSelected: !this.state.isSelected }, () => {
this.setState({
permanentAddress1: {
value: !this.state.isSelected ? "" :
this.state.addressLine1.value,
},
permanentAddress2: {
value: !this.state.isSelected ? "" :
this.state.addressLine2.value,
},
permanentLandmark1: {
value: !this.state.isSelected ? "" :
this.state.landmark1.value,
},
permanentLandmark2: {
value: !this.state.isSelected ? "" :
this.state.landmark2.value,
},
permanentPincode: {
value: !this.state.isSelected ? "" : this.state.pincode.value,
isValid: !this.state.isSelected ? true :
this.state.pincode.isValid,
},
permanentCity: !this.state.isSelected ? "" : this.state.city,
permanentState: !this.state.isSelected ? "" : this.state.state,
permanentYear: !this.state.isSelected ? "" : this?.state?.year ||
'',
permanentMonth: {
value: !this.state.isSelected ? null :
this.state.selectedMonth.value || null,
label: !this.state.isSelected ? null :
this.state.selectedMonth.label || null,
},

})
})
}}
style={{ alignSelf: "center" }}
/>
<Text style={{ fontSize: FONT_SIZE.m, color:
colors.COLOR_LIGHT_NAVY_BLUE, fontFamily: APP_FONTS.NunitoBold, margin: 8 }}>Same
as KYC Address?</Text>
</View>}

<View style={{ marginBottom: 10, marginTop: 10, }}>

<Text style={{
color: colors.COLOR_LIGHT_NAVY_BLUE,
fontFamily: APP_FONTS.NunitoRegular,
fontSize: 16,
 marginLeft: 4
}}>
{ADDITIONAL_DETAILS_CONST.OFFICE_TYPE}
</Text>
<DropDownPicker
disabled={this.state.isViewOnly || this.state.currentAddressFreeze}
controller={(instance) => (this.controller = instance)}
items={this.state.dropdownKyc}
containerStyle={{ flex: 1, marginTop: 5, marginBottom: 15 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
placeholder={''}
defaultValue={this.state.residenceType.value}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {
this.setState({
residenceType: {
value: item.value || null,
label: item.label || null,
},
residenceDocType: {
value: null,
label: null,
},
}, () => {
this.handleDocType(this?.state?.residenceType?.value)
});
}}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<View style={separatorInputStyle} />
</View>
{/* {console.log('kkkkkk', this?.state?.residenceDocType,
this.state.dropdownDocType)} */}
<View style={{ marginBottom: 10, marginTop: 10 }}>
<Text style={{
color: colors.COLOR_LIGHT_NAVY_BLUE,
fontFamily: APP_FONTS.NunitoRegular,
fontSize: 16,
marginLeft: 4
}}>
{'Document Type*'}
</Text>
<DropDownPicker
disabled={this.state.isViewOnly || this.state.currentAddressFreeze}
controller={(instance) => (this.controller = instance)}
items={this.state.dropdownDocType}
containerStyle={{ flex: 1, marginTop: 5, marginBottom: 10 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
 placeholder={''}
defaultValue={this?.state?.residenceDocType?.value || null}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {
this.setState({
residenceDocType: {
value: item.value || null,
label: item.label || null,
},
serviceProvider: {
value: null,
label: null,
code: null
},
consumerNumber: '',
karzaDataFlag: null,
karzaName: ''
});
}}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<View style={separatorInputStyle} />
</View>
{this?.state?.residenceDocType?.value == "Aadhar Card" && <View
style={{ marginVertical: 10, }}>
<Text style={[loanTextMain]}>Please select authentication type you want
to proceed with?*</Text>
<View style={{marginTop:15,marginLeft:4}}>{this.renderRadio()}</View>
</View>}

{this?.state?.residenceDocType?.value == "Aadhar Card" &&

this.state.selectedSourceValue == 'OCR' && this.renderCurrentDocument()}
{this?.state?.residenceDocType?.value != "Aadhar Card" &&
this?.state?.residenceDocType?.value != "" && this.renderCurrentDocument()}

{
this.state.residenceDocType.value == 'Electricity Bill' ?
<View>
<View>
<Text
style={{
marginTop: 10, marginBottom: -4, marginLeft: 5, color:
colors.COLOR_LIGHT_NAVY_BLUE, fontFamily: APP_FONTS.NunitoRegular,
fontSize: 16,
}}>
{'Electricity bill on whose name?*'}
</Text>

<DropDownPicker
disabled={this.state.isViewOnly ||
this.state.currentAddressFreeze || this.state.currentAddressFiledsEditableFreeze}
items={this.state.dropDownRelation}
containerStyle={{ flex: 1, marginTop: 5, marginBottom: 15 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
 justifyContent: 'flex-start',
marginLeft: 4,
}}
defaultValue={this.state.selectedRelation.value}
placeholder={
""
}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) =>
this.setState({
selectedRelation: {
value: item.value || null,
label: item.label || null,
}
})
}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<View style={[separatorInputStyle, { marginBottom: 10 }]} />
</View>

{this.state.selectedRelation.value !== 'Self' && <View>

<FloatingLabelInput
editable={!this.state.isViewOnly && !
this.state.currentAddressFreeze && !this.state.currentAddressFiledsEditableFreeze}
label={'Enter Name*'}
containerStyles={inputStyle}
// keyboardType={'number-pad'}
value={this.state.consumerName || undefined}
onChangeText={(value) => {
this.setState({
consumerName: value,
consumerNameValid: customerName_REGEX.test(value)

});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
{!this.state.consumerNameValid && (
<Text style={{ color: 'red', marginTop:
3, }}>{this.state.consumerName == '' ?
ADDITIONAL_DETAILS_CONST.REQUIRED_CONSUMER_NAME :
ADDITIONAL_DETAILS_CONST.INVALID_CONSUMER_NAME}</Text>)}
</View>}

</View>
: null
}
 {
this.state.residenceDocType.value == 'Electricity Bill' ||
this.state.residenceDocType.value == 'PNG Receipt' ?
<View>
<Text
style={{
marginTop: 30, marginBottom: -4, marginLeft: 5, color:
colors.COLOR_LIGHT_NAVY_BLUE, fontFamily: APP_FONTS.NunitoRegular,
fontSize: 16,
}}>
{ADDITIONAL_DETAILS_CONST.SERVICE_PROVIDER}
</Text>

<DropDownPicker
disabled={this.state.isViewOnly || this.state.currentAddressFreeze
|| this.state.currentAddressFiledsEditableFreeze}
items={this.state.residenceDocType.value == 'Electricity Bill' ?
this.state.serviceProviderList : this.state.dropdownServiceProvider}
containerStyle={{ flex: 1, marginTop: 5, marginBottom: 15 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
defaultValue={this.state.serviceProvider.value}
placeholder={
""
}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) =>
this.setState({
serviceProvider: {
value: item.value || null,
label: item.label || null,
code: item.code || null
}
})
}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<View style={separatorInputStyle} />
</View>
: null
}

{
this.state.residenceDocType.value == 'Electricity Bill' ||
this.state.residenceDocType.value == 'Election / Voters Identity Card' ||
this.state.residenceDocType.value == 'Valid Driving License' ||
this.state.residenceDocType.value == 'Valid Passport' ||
this.state.residenceDocType.value == 'LPG Receipt' ||
this.state.residenceDocType.value == 'PNG Receipt'
?
<View>
<View>
<FloatingLabelInput
 editable={!this.state.isViewOnly && !
this.state.currentAddressFreeze && !this.state.currentAddressFiledsEditableFreeze}
label={
this.state.residenceDocType.value == 'Electricity Bill' ?
ADDITIONAL_DETAILS_CONST.CONSUMER_NUMBER :
this.state.residenceDocType.value == 'Election / Voters
Identity Card' ? ADDITIONAL_DETAILS_CONST.EPIC_NUMBER :
this.state.residenceDocType.value == 'Valid Driving
License' ? ADDITIONAL_DETAILS_CONST.DL_NO :
this.state.residenceDocType.value == 'Valid Passport' ?
ADDITIONAL_DETAILS_CONST.FILE_NUMBER_PASSPORT :
this.state.residenceDocType.value == 'PNG Receipt' ?
ADDITIONAL_DETAILS_CONST.CONSUMER_NUMBER :
this.state.residenceDocType.value == 'LPG Receipt' ?
ADDITIONAL_DETAILS_CONST.LPG_ID :
this.state.residenceDocType.value == 'Post Paid
Mobile Bill' ? "Bill Number" : null
}
containerStyles={inputStyle}
// keyboardType={'number-pad'}
value={this.state.consumerNumber || undefined}
onChangeText={(value) => {
this.setState({
consumerNumber: value,
consumerNumberValid: this.state.residenceDocType.value ==
'Electricity Bill' ? CONSUMER_NO_REGEX.test(value) :
this.state.residenceDocType.value == 'Election / Voters
Identity Card' ? EPICNO_REGEX.test(value) :
this.state.residenceDocType.value == 'Valid Driving
License' ? EPICNO_REGEX.test(value) :
this.state.residenceDocType.value == 'Valid Passport' ?
PASSPORT_REGEX.test(value) :
this.state.residenceDocType.value == 'PNG Receipt' ?
NUMBER_REGEX.test(value) :
this.state.residenceDocType.value == 'LPG
Receipt' ? NUMBER_REGEX.test(value) :
this.state.residenceDocType.value == 'Post Paid
Mobile Bill' ? TELEPHONE_REGEX.test(value) : null

});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
{!this.state.consumerNumberValid && (
<Text style={{ color: 'red', marginTop:
3, }}>{this.state.consumerNumber == '' ?
ADDITIONAL_DETAILS_CONST.REQUIRED_ID_NUMBER :
ADDITIONAL_DETAILS_CONST.INVALID_ID_NUMBER}</Text>)}
</View>

</View>
 : null
}
{
this.state.residenceDocType.value == 'Post Paid Mobile Bill' ?
<View>
<View
style={{
...(Platform.OS !== 'android' && {
zIndex: 10,
}),
}}>
<DropDownPicker
// searchable
disabled={this.state.isViewOnly ||
this.state.currentAddressFreeze || this.state.currentAddressFiledsEditableFreeze}
items={this.state.cityList}
containerStyle={{ flex: 1, marginTop: 5, marginBottom: 15 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
placeholder={this.state.cityNameUtility !== ''
? this.state.cityNameUtility
: ADDITIONAL_DETAILS_CONST.CITY}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {
this.setState({ cityNameUtility: item.label })
}
}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<View style={separatorInputStyle} />
</View>

<View style={{ flexDirection: 'row', justifyContent: 'space-

between' }}>
<View style={{ width: '49%', marginTop: 20 }}>
<FloatingLabelInput
editable={!this.state.isViewOnly && !
this.state.currentAddressFreeze && !this.state.currentAddressFiledsEditableFreeze}
label={ADDITIONAL_DETAILS_CONST.LABEL_LANDLINE_NUMBER}
containerStyles={inputStyle}
value={this.state.landlineNumber || undefined}
onChangeText={(value) => {
this.setState({
landlineNumber: value,
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
 inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
</View>
<View style={{ width: '49%', marginTop: 20 }}>
<FloatingLabelInput
editable={!this.state.isViewOnly && !
this.state.currentAddressFreeze && !this.state.currentAddressFiledsEditableFreeze}
label={ADDITIONAL_DETAILS_CONST.STD_CODE}
containerStyles={inputStyle}
value={this.state.stdCode || undefined}
onChangeText={(value) => {
this.setState({
stdCode: value,
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
</View>

</View>
</View>
: null
}

{
this.state.residenceDocType.value == 'Electricity Bill' ||
this.state.residenceDocType.value == 'Election / Voters Identity Card' ||
this.state.residenceDocType.value == 'Valid Driving License' ||
this.state.residenceDocType.value == 'Valid Passport' ||
this.state.residenceDocType.value == 'LPG Receipt' ||
this.state.residenceDocType.value == 'PNG Receipt'
?
<View>

<Button
isDisabled={this.getCurrentSaveDisable()}
title={ADDITIONAL_DETAILS_CONST.BUTTON_GET_DETAILS}
onPress={() => {
if (!this.state.isViewOnly) {
this.getUtilityDocDetails();
} else {
handleWarning("User access denied")
}
}}
customContainerStyle={
this.getCurrentSaveDisable()
? [disableStyle, {}]
: [saveButtonStyle, {}]
}
cutomTitleStyle={
this.getCurrentSaveDisable()
 ? disableTextStyle
: saveButtonTitleStyle
}
/>
</View>
: null
}

<FloatingLabelInput
editable={!this.state.isViewOnly && !this.state.currentAddressFreeze && !
this.state.currentAddressFiledsEditableFreeze}
multiline
label={ADDITIONAL_DETAILS_CONST.ADDRESS_LINE_1}
containerStyles={inputStyle}
value={this.state.permanentAddress1.value || undefined}
onChangeText={(value) => {
this.setState({
permanentAddress1: {
value: value,
},
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />

<View style={marginTop20}>
<FloatingLabelInput
editable={!this.state.isViewOnly && !this.state.currentAddressFreeze &&
!this.state.currentAddressFiledsEditableFreeze}
label={ADDITIONAL_DETAILS_CONST.ADDRESS_LINE_2}
containerStyles={inputStyle}
value={this.state.permanentAddress2.value || undefined}
onChangeText={(value) => {
this.setState({
permanentAddress2: {
value: value,
},
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
</View>
<View style={separatorInputStyle} />

<FloatingLabelInput
 editable={!this.state.isViewOnly && !this.state.currentAddressFreeze && !
this.state.currentAddressFiledsEditableFreeze}
label={"Landmark 1*"}
containerStyles={inputStyle}
value={this.state.permanentLandmark1.value || undefined}
onChangeText={(value) => {
this.setState({
permanentLandmark1: {
value: value,
},
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />

<View style={marginTop20}>
<FloatingLabelInput
editable={!this.state.isViewOnly && !this.state.currentAddressFreeze &&
!this.state.currentAddressFiledsEditableFreeze}
label={"Landmark 2"}
containerStyles={inputStyle}
value={this.state.permanentLandmark2.value || undefined}
onChangeText={(value) => {
this.setState({
permanentLandmark2: {
value: value,
},
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
</View>
<View style={separatorInputStyle} />

<View style={marginTop20}>
<FloatingLabelInput
editable={!this.state.isViewOnly && !this.state.currentAddressFreeze &&
!this.state.currentAddressFiledsEditableFreeze}
maxLength={6}
label={ADDITIONAL_DETAILS_CONST.PINCODE}
containerStyles={inputStyle}
keyboardType={'number-pad'}
value={this.state.permanentPincode.value || undefined}
onChangeText={(value) => {
const valid = PINCODE_REGEX.test(value);
 this.setState(
{
permanentPincode: {
value: value,
isValid: value !== '' ? valid : true,
},
permanentCity: '',
permanentState: {
value: null, label: null
},
},
() => {
if (
this.state.permanentPincode.value.length === 6 &&
this.state.permanentPincode.isValid
) {
this.getDataFromPincode(value, 'fromPermanentAddress');
}
},
);
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
</View>
<View style={separatorInputStyle} />
{!this.state.permanentPincode.isValid && (
<Text style={errorLabel}>
{ADDITIONAL_DETAILS_CONST.PINCODE_VALIDATION}
</Text>
)}

<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>

<View style={{ width: '45%', marginTop: 15 }}>
<FloatingLabelInput
label={ADDITIONAL_DETAILS_CONST.CITY}
containerStyles={inputStyle}
editable={!this.state.isViewOnly && !this.state.currentAddressFreeze
&& !this.state.currentAddressFiledsEditableFreeze}
// keyboardType={'numeric'}
value={this.state.permanentCity || undefined}
onChangeText={(value) => {
this.setState({
permanentCity: value,
permanentCityVerified: NAME_REGEX.test(value)
});
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
 inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
{!this.state.permanentCityVerified && (
<Text style={{ color: 'red', marginTop:
3, }}>{ADDITIONAL_DETAILS_CONST.INVALID_CITY_NAME}</Text>)}
</View>

<View style={{ width: '45%', marginTop: 15 }}>

<DropDownPicker
disabled={this.state.isViewOnly || this.state.currentAddressFreeze ||
this.state.currentAddressFiledsEditableFreeze}
controller={(instance) => (this.controllerKYC = instance)}
items={STATES}
containerStyle={{ marginTop: 15, marginBottom: 10 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
defaultValue={(
this.state.permanentState.value || undefined)}
placeholder={''}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {
this.setState({
permanentState: {
value: item.value || null,
label: item.label || null,
},
// utilityStateVerified: NAME_REGEX.test(item)
});

}}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<Text style={[textStyle, { position: 'absolute', top: 0, marginLeft: 5,
color: colors.COLOR_LIGHT_NAVY_BLUE, }]}>
{ADDITIONAL_DETAILS_CONST.STATE}
</Text>
<View style={separatorInputStyle} />
</View>
</View>

<>
<Text style={[kycDocLabel, { marginTop: 20, fontFamily:
APP_FONTS.NunitoBold }]}>
{ADDITIONAL_DETAILS_CONST.RESIDING_ADDRESS}
</Text>
<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>
<View style={{ width: '45%', marginTop: 15 }}>
<FloatingLabelInput
label={ADDITIONAL_DETAILS_CONST.YEAR}
containerStyles={inputStyle}
editable={!this.state.isViewOnly && !
this.state.currentAddressFreeze}
maxLength={2}
value={this?.state?.permanentYear?.toString() || ''}
keyboardType='number-pad'
onChangeText={(value) => {
// this?.state?.year.length < 2 ?
this.setState({ permanentYear: value, })
// :null
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
</View>
<View style={{ width: '45%', marginTop: 15 }}>
<DropDownPicker
disabled={this.state.isViewOnly || this.state.currentAddressFreeze}
controller={(instance) => (this.controllerKYC = instance)}
items={this.state.dropDownMonth}
containerStyle={{ marginTop: 15, marginBottom: 10 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
defaultValue={this.state.permanentMonth.value}
placeholder={""}
// defaultValue={this.state.permanentMonth.value}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {
this.setState({
permanentMonth: {
value: item.value,
label: item.label || null,
}
});
}}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<Text style={[textStyle, { position: 'absolute', top: 0, marginLeft:
5, color: colors.COLOR_LIGHT_NAVY_BLUE, }]}>
{ADDITIONAL_DETAILS_CONST.MONTH}
</Text>
<View style={separatorInputStyle} />
</View>
</View>
</>
{/* <CheckBoxComponent setState={currentAddressBoxChecked =>
this.setState({ currentAddressBoxChecked:currentAddressBoxChecked })}
initialState={currentAddressBoxChecked} isViewOnly={this.state.isViewOnly} /> */}
{/* office save */}
 <Button
isDisabled={this.getPermanentAddSaveDisable()}
title={ADDITIONAL_DETAILS_CONST.BUTTON_TITLE_SAVE}
onPress={() => {
const dataToAPI1 = {
docType: this.state.residenceDocType.value,
serviceProvider: this.state.serviceProvider.value,
identityProofNo: this.state.consumerNumber,
electricityBillOnName: this.state.selectedRelation.value,
karzaDataFlag: this?.state?.karzaDataFlag,
electricityPersonName: this.state.consumerName,
karzaName: this.state.karzaName,
address1: this.state.permanentAddress1.value,
address2: this.state.permanentAddress2.value,
landmark1: this.state.permanentLandmark1.value,
landmark2: this.state.permanentLandmark2.value,
pinCode: this.state.permanentPincode.value,
city: this.state.permanentCity,
state: this.state.permanentState.value,
residenceType: this.state.residenceType.value,
type: 'Permanent',
sameKycFlag: this.state.isSelected,
id: this.state.idToEditPermanentAddress,
permaYear: this.state.permanentYear,
permaMonth: this.state.permanentMonth.value,
leadCode: this.state.leadCode,
ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
isguarantor: this.state.isguarantor,
applicantUniqueId:
this.state.isguarantor || this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
};

{
// this.state.imageDataCurrent.front.uri != '' ?
this.props.saveOfficeAddress({
dataToAPI1,
callback: (response) => {
if (this.state.currentAddressVisible) {
// console.log("mjjjjjjj", this.state.permanentAddress1.value
+', '+this.state.permanentAddress2.value +', '+this.state.permanentLandmark1.value
+', '+this.state.permanentLandmark2.value +', '+this.state.permanentCity+',
'+this.state.permanentState.value+', '+this.state.permanentPincode.value);
const dataToAPI = {
address: this.state.permanentAddress1.value + ', ' +
this.state.permanentAddress2.value + ', ' + this.state.permanentLandmark1.value +
', ' + this.state.permanentLandmark2.value + ', ' + this.state.permanentCity + ', '
+ this.state.permanentState.value + ', ' + this.state.permanentPincode.value,
dealerName: this.state.dealerName,
applicantUniqueId: this.state.isguarantor ||
this.state.iscoapplicant
? this.state.coapplicantUniqueId
: this.state.applicantUniqueId,
}
this.props.getgeoFencingData({
dataToAPI,
callback: (response) => {
 response.data.data.geoLocationOutOfService == false ?
handleWarning(response.data.data.response) :
this.props.navigation.navigate('LoanSummary', {
leadName: this.state.leadName,
"applicantUniqueId": this.state.iscoapplicant ||
this.state.isguarantor ? this.state.coapplicantUniqueId :
this.state.applicantUniqueId,
leadCode: this.state.leadCode,
mobileNumber: this.state.mobileNumberFromProps,
coapplicantUniqueId: this.state.coapplicantUniqueId,
ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
iscoapplicant: this.state.iscoapplicant,
isguarantor: this.state.isguarantor,
isViewOnly: this.state.isViewOnly || false,
});
// this.props.cKycDetails({
// dataToAPI1,
// callback: (response) => {
// console.log("cKycDetails response", response);
// if(this.state.panDocType == "pan"){
//
this.props.navigation.navigate('PANAndGSTVerification', {
// leadName: this.state.leadName,
// "applicantUniqueId": this.state.iscoapplicant ||
this.state.isguarantor ? this.state.coapplicantUniqueId :
this.state.applicantUniqueId,
// leadCode: this.state.leadCode,
// mobileNumber: this.state.mobileNumberFromProps,
// coapplicantUniqueId: this.state.coapplicantUniqueId,
// ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
// iscoapplicant: this.state.iscoapplicant,
// isguarantor: this.state.isguarantor,
// isViewOnly: this.state.isViewOnly || false,
// });
// } else if(this.state.panDocType == "form60"){
//
this.props.navigation.navigate('DemographicDetails', {
// leadName: this.state.leadName,
// "applicantUniqueId": this.state.iscoapplicant
|| this.state.isguarantor ? this.state.coapplicantUniqueId :
this.state.applicantUniqueId,
// leadCode: this.state.leadCode,
// mobileNumber:
this.state.mobileNumberFromProps,
// coapplicantUniqueId:
this.state.coapplicantUniqueId,
// ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
// iscoapplicant: this.state.iscoapplicant,
// isguarantor: this.state.isguarantor,
// isViewOnly: this.state.isViewOnly || false,
// });
// } else {
// this.props.navigation.navigate('LoanSummary', {
// leadName: this.state.leadName,
// applicantUniqueId: this.state.iscoapplicant ||
this.state.isguarantor ? this.state.coapplicantUniqueId :
this.state.applicantUniqueId,
// leadCode: this.state.leadCode,
// mobileNumber: this.state.mobileNumberFromProps,
// coapplicantUniqueId:
this.state.coapplicantUniqueId,
// ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
// iscoapplicant: this.state.iscoapplicant,
// isguarantor: this.state.isguarantor,
// isViewOnly: this.state.isViewOnly || false,
// });
// }
// }
// });

}
})
}
else {
const dataForgetQDE = {
applicant_uniqueid:
this.props.navigation.state.params.iscoapplicant ||
this.props.navigation.state.params.isguarantor
? this.props.navigation.state.params.coapplicantUniqueId
: this.props.navigation.state.params.applicantUniqueId,
ismainapplicant:
this.props.navigation.state.params.ismainapplicant,
isguarantor: this.props.navigation.state.params.isguarantor,
};

this.props.getQDEData({
dataForgetQDE,
callback: (response) => {
this.setState({
indSelfSoleFlag: response?.indSelfSoleFlag || false,
permanentVisible: response?.actualPermanentAddDetailsFlag
|| false,
}, () => {
// this.props.createUpdateCUSTOMER({
// data: {
// applicant_uniqueid: this.state.isguarantor ||
this.state.iscoapplicant ? this.state.coapplicantUniqueId :
this.state.applicantUniqueId,
// ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
// isguarantor: this.state.isguarantor,
// type: 'breBeforeSubmitToCredit'

// },
// callback: (response) => {
this.apiCall()
// }
// })
})

}
 })

if (response && !response.error) {

this.setState({
permanantAddressData: true,
additionalDetailOptions: {
employementDetailsCollapsed: false,
officeAddressCollapsed: true,
registeredCollapsed: true,
permanentAddressCollapsed: true,
additionalContactCollapsed: true,
},
});

}
}
},
})
// :
// handleError('Please upload the document')

}
}}
customContainerStyle={
this.getPermanentAddSaveDisable() ? disableStyle : saveButtonStyle
}
cutomTitleStyle={
this.getPermanentAddSaveDisable() ? disableTextStyle :
saveButtonTitleStyle
}
/>
</View>
);
}

permanentAddress() {
const {
collapsedViewStyle,
collapsedContainer,
plusImageStyle,
registeredAddressLabel,
expandedContainer,
seperatorStyle,
expandedViewStyle,
} = AdditionalDetailsStyles;

if (this.state.additionalDetailOptions.permanentAddressCollapsed) {
return (
<View style={collapsedContainer}>

<TouchableOpacity
style={collapsedViewStyle}
onPress={() => {
this.handleCollapseExpand('permanentAddressCollapsed', false);
}}>
<Text style={registeredAddressLabel}>
{this.state.residenceFlag == false ?
ADDITIONAL_DETAILS_CONST.PERMANENT_ADDRESS2 :
ADDITIONAL_DETAILS_CONST.PERMANENT_ADDRESS}
 </Text>
<Image source={BLUE_PLUS_ICON} style={plusImageStyle} />
</TouchableOpacity>
</View>
);
} else {
return (
<View style={expandedContainer}>
<View style={seperatorStyle} />
<View style={expandedViewStyle}>
<TouchableOpacity
style={{ flexDirection: 'row', width: '100%', justifyContent: 'space-
between' }}
onPress={() => {
this.handleCollapseExpand('permanentAddressCollapsed', true);

}}>
<Text style={registeredAddressLabel}>
{this.state.residenceFlag == false ?
ADDITIONAL_DETAILS_CONST.PERMANENT_ADDRESS2 :
ADDITIONAL_DETAILS_CONST.PERMANENT_ADDRESS}
</Text>

<Image
source={MINUS_ICON}
style={plusImageStyle}
resizeMode="contain"
/>
</TouchableOpacity>
</View>
{this.renderPermanentAddress()}
<View style={seperatorStyle} />
</View>
);
}
}

renderResidentialAddress(flow) {
const {
residentialAddressContainer,
residentialAddressLabel,
inputTextStyle,
inputStyle,
separatorInputStyle,
kycDocLabel,
textStyle,
textStyle1,
saveButtonStyle,
saveButtonTitleStyle,
errorLabel,
marginTop20,
disableStyle,
disableTextStyle,
} = AdditionalDetailsStyles;

return (
<View style={residentialAddressContainer}>
<View style={marginTop20}>
<FloatingLabelInput
editable={!this.state.kycFreeze}
label={ADDITIONAL_DETAILS_CONST.ADDRESS_LINE_1}
containerStyles={inputStyle}
value={
(this.state.addressLine1.value) || undefined
}
onChangeText={(value) => {

this.setState({
addressLine1: {
value: value,
},
});

}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
</View>
<View style={separatorInputStyle} />

<View style={marginTop20}>
<FloatingLabelInput
editable={!this.state.kycFreeze}
label={ADDITIONAL_DETAILS_CONST.ADDRESS_LINE_2}
containerStyles={inputStyle}
value={
(this.state.addressLine2.value) || undefined
}
onChangeText={(value) => {

this.setState({
addressLine2: {
value: value,
},
});

}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
</View>
<View style={separatorInputStyle} />

<View style={marginTop20}>
<FloatingLabelInput
editable={!this.state.kycFreeze}
 label={"Landmark 1*"}
containerStyles={inputStyle}
value={
(this.state.landmark1.value) || undefined
}
onChangeText={(value) => {

this.setState({
landmark1: {
value: value,
},
});

}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
</View>
<View style={separatorInputStyle} />

<View style={marginTop20}>
<FloatingLabelInput
editable={!this.state.kycFreeze}
label={"Landmark 2"}
containerStyles={inputStyle}
value={
(this.state.landmark2.value) || undefined
}
onChangeText={(value) => {

this.setState({
landmark2: {
value: value,
},
});

}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
</View>
<View style={separatorInputStyle} />

<View style={marginTop20}>
<FloatingLabelInput
editable={!this.state.kycFreeze}
maxLength={6}
label={ADDITIONAL_DETAILS_CONST.PINCODE}
containerStyles={inputStyle}
 keyboardType={'numeric'}
value={
(this.state.pincode.value) || undefined
}
onChangeText={(value) => {

const valid = PINCODE_REGEX.test(value);

this.setState(
{
pincode: {
value: value,
isValid: value !== '' ? valid : true,
},
city: '',
state: { value: null, label: null },
},
() => {
if (
this.state.pincode.value.length === 6 &&
this.state.pincode.isValid
) {
this.getDataFromPincode(value);
}
},
);

}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
</View>
<View style={separatorInputStyle} />
{(!this.state.pincode.isValid) && (
<Text style={errorLabel}>
{ADDITIONAL_DETAILS_CONST.PINCODE_VALIDATION}
</Text>
)}

<View style={{ flexDirection: 'row', justifyContent: 'space-between' }}>

<View style={{ width: '45%', marginTop: 15 }}>
<FloatingLabelInput
label={ADDITIONAL_DETAILS_CONST.CITY}
editable={!this.state.kycFreeze}
containerStyles={inputStyle}
value={
(this.state.city) || undefined
}
onChangeText={(value) => {

this.setState({
city: value,
cityVerified: NAME_REGEX.test(value)
});
 }}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
{flow !== 'fromUtility' && !this.state.cityVerified && (
<Text style={{ color: 'red', marginTop:
3, }}>{ADDITIONAL_DETAILS_CONST.INVALID_CITY_NAME}</Text>)}
</View>

<View style={{ width: '45%', marginTop: 15 }}>

<DropDownPicker
disabled={this.state.kycFreeze}
controller={(instance) => (this.controllerKYC = instance)}
items={STATES}
containerStyle={{ marginTop: 15, marginBottom: 10 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
defaultValue={(this.state.state.value) || undefined}
placeholder={''}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {
this.setState({
state: {
value: item.value || null,
label: item.label || null,
},
});

}}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<Text style={[textStyle, { position: 'absolute', top: 0, marginLeft: 5,
color: colors.COLOR_LIGHT_NAVY_BLUE, }]}>
{ADDITIONAL_DETAILS_CONST.STATE}
</Text>
<View style={separatorInputStyle} />
</View>
</View>

{/* {!flow && (

<View style={{ marginBottom: 15, marginTop: 20 }}>
<Text style={{
color: colors.COLOR_LIGHT_NAVY_BLUE,
fontFamily: APP_FONTS.NunitoRegular,
fontSize: 16,
marginLeft: 4
 }}>
{this.state.indSelfSoleFlag ? ADDITIONAL_DETAILS_CONST.OFFICE_TYPE :
"Current Residence Type*"}
</Text>
<DropDownPicker
disabled={this.state.kycFreeze}
items={this.state.indSelfSoleFlag ?
this.state.dropDownResidentType1 : this.state.dropdownKyc}
defaultValue={this.state.selectedResidentType.value}
placeholder={''}
controller={(instance) => (this.controllerKYC = instance)}
containerStyle={{ flex: 1, marginTop: 5, marginBottom: 15 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {
this.setState({
residenceFlag: item.value == 'PG' || item.value == "Corporate
Provided" ? false : true,
isSelected: false,
selectedResidentType: {
value: item.value || null,
label: item.label || null,
},
});
}}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<View style={separatorInputStyle} />
</View>
)}

{!flow && (
<>
<Text style={[kycDocLabel, { fontFamily: APP_FONTS.NunitoBold }]}>
{this.state.indSelfSoleFlag ?
ADDITIONAL_DETAILS_CONST.BUSINESS_ADDRESS :
ADDITIONAL_DETAILS_CONST.RESIDING_ADDRESS}
</Text>

<View style={{ flexDirection: 'row', justifyContent: 'space-

between' }}>
<View style={{ width: '45%', marginTop: 15 }}>
<FloatingLabelInput
label={ADDITIONAL_DETAILS_CONST.YEAR}
editable={!this.state.kycFreeze}
containerStyles={inputStyle}
maxLength={2}

value={this?.state?.year == '' ? this?.state?.year :

this?.state?.year?.toString()}
keyboardType='number-pad'
onChangeText={(value) => {
 // this?.state?.year.length < 2 ?
this.setState({ year: value, })
// :null
}}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
</View>
<View style={{ width: '45%', marginTop: 15 }}>
<DropDownPicker
disabled={this.state.kycFreeze}
controller={(instance) => (this.controllerKYC = instance)}
items={this.state.dropDownMonth}
containerStyle={{ marginTop: 15, marginBottom: 10 }}
style={{ backgroundColor: '#ffffff', borderWidth: 0 }}
itemStyle={{
justifyContent: 'flex-start',
marginLeft: 4,
}}
defaultValue={this.state.selectedMonth.value}
placeholder={''}
dropDownStyle={{ backgroundColor: '#ffffff' }}
onChangeItem={(item) => {
this.setState({
selectedMonth: {
value: item.value,
label: item.label || null,
}
});
}}
customArrowUp={() => <Image source={UP_ARROW} />}
customArrowDown={() => <Image source={DOWN_ARROW} />}
labelStyle={textStyle}
selectedLabelStyle={[textStyle, { color: colors.COLOR_BLACK }]}
/>
<Text style={[textStyle, { position: 'absolute', top: 0,
marginLeft: 5, color: colors.COLOR_LIGHT_NAVY_BLUE, }]}>
{ADDITIONAL_DETAILS_CONST.MONTH}
</Text>
<View style={separatorInputStyle} />
</View>
</View>
</>
)} */}

{/* kyc save */}

{!flow && (
<Button
isDisabled={this.getSaveDisable() || this.state.kycFreeze}
title={ADDITIONAL_DETAILS_CONST.BUTTON_TITLE_SAVE}
onPress={() => {
const dataToAPI = {
leadCode: this.state.leadCode,
 aadharAuthentication: this.state.aadharAuthentication,
aadharAuthenticationType: this.state.aadharAuthenticationType,
dateOfBirth: this.state.aadharDateOfBirthText,
aadharDateOfBirthText: this.state.aadharDateOfBirth,
docType: this?.state?.selectedDocType === 'driving license' ?
'drivingLicense' : this?.state?.selectedDocType === 'adhar' ? 'aadhar' :
this?.state?.selectedDocType,
applicantUniqueId: this.state.isguarantor ||
this.state.iscoapplicant ? this.state.coapplicantUniqueId :
this.state.applicantUniqueId,
docId: this.getSelectedDocID(),
address1: this.state.addressLine1.value,
address2: this.state.addressLine2.value,
landmark1: this.state.landmark1.value,
landmark2: this.state.landmark2.value,
residenceType: this.state.selectedResidentType.value,
pinCode: this.state.pincode.value,
city: this.state.city,
state: this.state.state.value,
kycYear: this?.state?.year,
kycMonth: Number(this.state.selectedMonth.value),
individual: true,
ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
isguarantor: this.state.isguarantor,
id: this.state.idToEditKYCData,

};
const dataToAPI1 = {
"applicantUniqueId": this.state.isguarantor ||
this.state.iscoapplicant ? this.state.coapplicantUniqueId :
this.state.applicantUniqueId,

};

if (this?.state?.selectedDocType === 'adhar') {

dataToAPI['aadharId'] = this?.state?.adharID?.toString()?.replace(/
/g, ""),
dataToAPI['addharName'] = this.state.addharName
// dataToAPI1['id_number'] = `$
{this?.state?.adharID?.toString().substring(10, 14)}|${this.state.addharName}|$
{this.state.adharDOB}|${this.state.gender}`

}
if (this.state.indSelfSoleFlag === true) {
dataToAPI['kycDesignation'] = this.state.selectedSourceType
if (this.state.selectedSourceType == 'Other') {
dataToAPI['otherDesignation'] = this.state.radioOther
}
}
if (this?.state?.selectedDocType === 'passport') {
dataToAPI['fileNumber'] = this.state.fileNumber,
// dataToAPI1['id_number'] = this.state.fileNumber,
dataToAPI['dateOfBirth'] = this.state.dateOfBirthText
}
if (this?.state?.selectedDocType === 'driving license') {
dataToAPI['dlno'] = this.state.dlNo,
// dataToAPI1['id_number'] = this.state.dlNo,
dataToAPI['dateOfBirth'] = this.state.dateOfBirthDLText
 }
if (this?.state?.selectedDocType === 'voter') {
dataToAPI['epicNumber'] = this.state.epicNo
// dataToAPI1['id_number'] = this.state.epicNo

}
if (this?.state?.selectedDocType === 'other') {
dataToAPI['otherName'] = this.state.selectedOtherDoc.value
}

if (this.state.selectedSourceValue !== 'Yes' &&

this.state.imageData.front.uri == '') {
handleError('Please upload document')
}
else {
this.props.saveKYCDetail({
dataToAPI,
callback: (response) => {
if (response && !response.error) {
this.setState({
kycDocDetailSaved: true,
kycData: true,
additionalDetailOptions: {
employementDetailsCollapsed: true,
officeAddressCollapsed: true,
registeredCollapsed: false,
permanentAddressCollapsed: true,
additionalContactCollapsed: true,
},
additionalOptions: [
{
registeredAddress: [
{ residentialAddressCollapsed: true },
{ addUtilityBillsCollapsed: false },
],
},
],
}, () => {

this.props.cKycDetails({
dataToAPI1,
callback: (response) => {
// console.log("cKycDetails", response);
}
}),
!(this.state.iscoapplicant || this.state.isguarantor) ?
this.props.createUpdateCUSTOMER({
data: {
applicant_uniqueid: this.state.isguarantor ||
this.state.iscoapplicant ? this.state.coapplicantUniqueId :
this.state.applicantUniqueId,
isguarantor: this.state.isguarantor,
ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
type: "bureau"
},
callback: (response) => {
// this.apiCall()
this.props.createUpdateCUSTOMER({
 data: {
applicantUniqueId: this.state.isguarantor ||
this.state.iscoapplicant ? this.state.coapplicantUniqueId :
this.state.applicantUniqueId,
ismainapplicant: this.state.ismainapplicant,
isguarantor: this.state.isguarantor,
type: "bureauCalling"
},
callback: (response) => {

// this.componentDidMount()
this.apiCall()
}
})
}
})
: null

})

}
},
});
}
}}
customContainerStyle={
this.getSaveDisable() || this.state.isViewOnly ? disableStyle :
saveButtonStyle
}
cutomTitleStyle={
this.getSaveDisable() || this.state.isViewOnly ? disableTextStyle :
saveButtonTitleStyle
}
/>
)}

</View>
);
}

selectRadioButton(value, index) {
this.setState({ selectedSourceType: value.title });
}

selectRadioButtons(value, index) {
this.setState({
selectedSourceValue: value.title,
aadharAuthenticationType: value.title == 'OTP' ? 'AadharOtp' : value.title ==
'OCR' ? 'AadharOcr' : value.title == 'Face' ? 'AadharFace' : value.title ==
'Fingerprint' ? 'AadharFingerprint' : 'AadharOtp',
aadharAuthentication: value.title == 'OCR' ? false : true,
otpVisibile: value.title == 'OTP' ? false : false,
}, () => {
const data ={
applicantUniqueid:this.state.applicantUniqueId,
aadharAuthenticationType:value.title == 'OTP' ? 'AadharOtp' : value.title
== 'OCR' ? 'AadharOcr' : value.title == 'Face' ? 'AadharFace' : value.title ==
'Fingerprint' ? 'AadharFingerprint' : 'AadharOtp',
aadharNumber:this?.state?.adharID?.toString()?.replace(/ /g, ""),
 section:"initialCurrentAddress",
serverLocation: this.state.firstProteanServerData?.serverLocation
}

{
value.title != "OCR" ?
this.fetchDataWithTimeout(data)
// this.props.getProtenExmlRequest({
// data,
// callback: (response) => {
// try{
// if(response?.data?.encodedSignxml){
// console.log("starting intent");
// MyIntentModule.launchIntent("1.0", response?.data?.encodedSignxml,
"14.111.11.200");
// // this.launchIntent(response?.data?.encodedSignxml)
// }
// } catch (error){
// console.log(error,"error in catch loop 2");
// }
// },
// })
: null
}
});
}

renderRadioDetails(value, index){
return <View key={index} style={{marginVertical:5}}>
<RadioButton
title={value.title}
isSelected={
this.state.selectedSourceValue.toLowerCase() ===
value.title.toLowerCase()
? true
: false
}
onPress={() => {

if (!this.state.isViewOnly && !
this.state.currentAddressRadioButtonFreeze) {
return this.selectRadioButtons(value, index);
}
}}
/>
</View>
}
renderRadio() {
return this.state.aatharAuthenticationTypeList.map((value, index) => (
(value.title == "OTP" && this.state.isOtpRadioButtonVisible) ?
this.renderRadioDetails(value,index) : (value.title == "OCR" &&
this.state.isOcrRadioButtonVisible) ? this.renderRadioDetails(value,index) :
(value.title == "Face" && this.state.isFaceRadioButtonVisible) ?
this.renderRadioDetails(value,index) : (value.title == "Fingerprint" &&
this.state.isFingerRadioButtinVisible) ? this.renderRadioDetails(value,index) :
null
));
}
 renderKYCDocument() {
const {
kycDocLabel,
kycDocContainer,
plusImageStyle,
seperatorStyle,
collapsedContainer,
collapsedViewStyle,
registeredAddressLabel,
inputStyle,
textStyle,
marginTop20Style,
inputTextStyle,
separatorInputStyle,
input,
textStyleOTP,
loanTextMain,
radioContainer2
} = AdditionalDetailsStyles;
return (
<View style={kycDocContainer}>

{this.state.indSelfSoleFlag &&
<View style={{ marginTop: 10, }}>
<Text style={{ fontFamily: APP_FONTS.NunitoBold, fontSize: FONT_SIZE.l,
marginBottom: 5 }}>
{"Designation"}
</Text>
{this.state.sourceType.map((value, index) => (
<View key={index} style={{ marginBottom: 5 }}>
<RadioButton
title={value.title}

isSelected={
this?.state.selectedSourceType?.toLowerCase() ===
value?.title?.toLowerCase()
? true
: false
}
onPress={() => {
// if (!this.state.isViewOnly) {
// return this.selectRadioButton(value, index);
// }
}}
/>
</View>
))}

</View>}

<View style={marginTop20Style}>
<FloatingLabelInput
label={ADDITIONAL_DETAILS_CONST.ADHAR_ID}
containerStyles={inputStyle}
value={this.state.adharID}
mask="9999 9999 9999"
editable={!(this.state.kycFiledsEditableFreeze ||
this.state.kycFreeze)}
onChangeText={(value) => {
this.setState({
adharID: value,
adharIdValid: AADHAR_REGEX.test(value),
selectedSourceValue: '',

});
}}
keyboardType={'number-pad'}
maxLength={12}
customLabelStyles={{
colorFocused: colors.COLOR_LIGHT_NAVY_BLUE,
colorBlurred: colors.COLOR_LIGHT_GREY,
fontSizeFocused: 15,
fontSizeBlurred: 15,
}}
inputStyles={inputTextStyle}
/>
<View style={separatorInputStyle} />
{!this.state.adharIdValid && (
<Text style={{ color: 'red', marginTop: 3, }}>{this.state.adharID == ''
? ADDITIONAL_DETAILS_CONST.REQUIRED_AADHAR_NUMBER :
ADDITIONAL_DETAILS_CONST.INVALID_AADHAR_NUMBER}</Text>)}
</View>

{/* <View style={{ marginVertical: 10, }}>

<Text style={[loanTextMain]}>Do you want to procees with aadhaar
authentication?*</Text>
<Text style={[loanTextMain, { marginVertical: 15 }]}>{'Yes - Aadhaar
OTP \nNo - Aadhaar OCR'}</Text>
<View style={radioContainer2}>{this.renderRadio()}</View>
</View> */}
{
this.state.otpVisibile ?
<>
<Text style={textStyleOTP}>{'Enter OTP'}</Text>
<View style={{ flex: 1, width: '100%', justifyContent: 'center',
alignItems: 'center', }}>
<TextInput
style={input}
onChangeText={(code) => {
this.setState({
otp: code
})
}}
secureTextEntry
autoFocus
allowFontScaling
// underlineColorAndroid={"#334e9e"}
value={this.state.otp}
keyboardType="numeric"
/>

<Button
title={'Submit'}
customContainerStyle={{ width: '80%', marginTop: 20 }}
cutomTitleStyle={{ fontSize: 18 }}
isDisabled={this.state.otp == ''}
 onPress={() => {
const dataToAPI = {
aadharNumber: this?.state?.adharID?.replace(/ /g, ""),
requestId: this.state.requestId,
otp: this.state.otp,
applicantUniqueId: this.state.isguarantor ||
this.state.iscoapplicant ? this.state.coapplicantUniqueId :
this.state.applicantUniqueId,
section:"kyc"
}
this.props.verifyAadharOtp({
dataToAPI,
callback: (response) => {
this.setState({
otpVisibile: false
}, () => { this.getQdeData() })

}
})

}} />
</View>
</>
: null
}
{this.state.selectedSourceValue == 'No' && this.renderPlusIconWithDoc()}
{
this.state.selectedSourceValue == 'No' && this?.state?.selectedDocType !
== '' &&
this.renderUploadPlaceholder()}
{this.renderDynamicInputPerDocType()}
{this.renderResidentialAddress()}

<View style={seperatorStyle} />

</View>
);

renderRegisteredAddress() {
const {
collapsedViewStyle,
collapsedContainer,
plusImageStyle,
registeredAddressLabel,
expandedContainer,
seperatorStyle,
expandedViewStyle,
} = AdditionalDetailsStyles;

if (this.state.additionalDetailOptions.registeredCollapsed) {
return (
<View style={collapsedContainer}>
<TouchableOpacity
style={collapsedViewStyle}
onPress={() => {
this.handleCollapseExpand('registeredCollapsed', false);
}}>
<Text style={registeredAddressLabel}>
 {
// this.state.iscoapplicant || this.state.isguarantor ?
ADDITIONAL_DETAILS_CONST.REGISTERED_ADDRESS2 :
`${this.state.indSelfSoleFlag ?
ADDITIONAL_DETAILS_CONST.REGISTERED_ADDRESSIND :
ADDITIONAL_DETAILS_CONST.REGISTERED_ADDRESS}`}
</Text>
<Image source={BLUE_PLUS_ICON} style={plusImageStyle} />
</TouchableOpacity>
</View>
);
} else {
return (
<View style={[expandedContainer, { marginLeft: 20, marginRight: 20 }]}>
<View style={seperatorStyle} />
<View style={expandedViewStyle}>
<TouchableOpacity
style={{ flexDirection: 'row', width: '100%', justifyContent: 'space-
between' }}
onPress={() => {
this.handleCollapseExpand('registeredCollapsed', true);
}}>
<Text style={registeredAddressLabel}>
{
// this.state.iscoapplicant || this.state.isguarantor ?
ADDITIONAL_DETAILS_CONST.REGISTERED_ADDRESS2 :
`${this.state.indSelfSoleFlag ?
ADDITIONAL_DETAILS_CONST.REGISTERED_ADDRESSIND :
ADDITIONAL_DETAILS_CONST.REGISTERED_ADDRESS}`}
</Text>

<Image
source={MINUS_ICON}
style={plusImageStyle}
resizeMode="contain"
/>
</TouchableOpacity>
</View>
{this.renderKYCDocument()}
</View>
);
}
}

getQdeData = () => {

const dataToAPIS = {
applicantUniqueId: this.state.applicantUniqueId,
}

this.props.getAadharAuthenticationTypeList({
dataToAPIS,
callback: (response) => {
console.log(response?.data?.list,"getAadharAuthenticationTypeList
response");
if(response?.data?.list[0]?.externalServer == true){
this.setState({
isOtpRadioButtonVisible:response?.data?.otp,
isOcrRadioButtonVisible:response?.data?.ocr,
 isFaceRadioButtonVisible:response?.data?.face,
isFingerRadioButtinVisible:response?.data?.fingerprint,
firstProteanServerData:response?.data?.list[0],
secondProteanServerData:response?.data?.list[1],
requestApiCheckOutTime:response?.data?.list[0]?.requestApiCheckOutTime
})
} else{
this.setState({
isOtpRadioButtonVisible:response?.data?.otp,
isOcrRadioButtonVisible:response?.data?.ocr,
isFaceRadioButtonVisible:response?.data?.face,
isFingerRadioButtinVisible:response?.data?.fingerprint,
firstProteanServerData:response?.data?.list[1],
secondProteanServerData:response?.data?.list[0],
requestApiCheckOutTime:response?.data?.list[1]?.requestApiCheckOutTime
})
}
// console.log(response,"getAadharAuthenticationTypeList response");
},
});

this.props.getAllResidentType({
callback: (response) => {
this.setState({ dropdownKyc: response.data.data || [],
dropDownResidentType1: response.data.data || [] });
},
});

this.props.getCityList({
callback: (response) => {
const cityDropdown = response.data.map((value) => ({
value: value.id,
label: value.cityname,
}));
this.setState({ cityList: cityDropdown || [] });
},
});

this.props.getKYCDoc({
callback: (response) => {
const kycDoc = response.data.map((value) => ({
value: value.kycdoclist,
label: value.kycdoclist,
}));
this.setState({ kycDocList: kycDoc || [] });
},
});

this.props.getServiceProvider({
dataToAPIS,
callback: (response) => {

const serviceProvider = response?.data == '' ? [] :

response?.data?.map((value) => ({
value: value.electricProvider,
label: value.electricProvider,
code: value.code,
id: value.id
}));
 this.setState({ serviceProviderList: serviceProvider || [] });
},
});

setTimeout(() => {
const dataToAPI = {
applicant_uniqueid: this.state.applicantUniqueId,
lead_code: this.state.leadCode,
roleId: this.props.userDataSelector.userData.data.roleId
};
const dataForgetQDE = {
applicant_uniqueid:
this.props.navigation.state.params.iscoapplicant ||
this.props.navigation.state.params.isguarantor
? this.props.navigation.state.params.coapplicantUniqueId
: this.props.navigation.state.params.applicantUniqueId,
ismainapplicant: this.props.navigation.state.params.ismainapplicant,
isguarantor: this.props.navigation.state.params.isguarantor,
};
this.props.getQDEData({
dataForgetQDE,
callback: (response) => {

console.log(response?.panDocType,"getQDEData response");
this.setState({
pangstDocType:
this?.props?.userQDEDataSelector?.pangstdetails?.documentType,
selectedSourceType: response?.pangstdetails?.entity == "Sole
Proprietory Firm" ? "Proprietor" : "Partner",
dealerName: response?.dealerName || '',
panDocType:response?.panDocType || ''
})
this.setState({
indSelfSoleFlag: response?.indSelfSoleFlag || false,
permanentVisible: response?.actualPermanentAddDetailsFlag || false,
})
// if (response?.indSelfSoleFlag && response?.pangstdetails?.gst) {
// this.props.gstADDRAPI({
// dataToAPI: {
// gst: response?.pangstdetails?.gst
// },
// callback: (response) => {
// this.setState({
// gstAddress: response?.data,

// })
// if (!this.state.gstAddressFlag) {
// this.getDataFromPincode(response?.data?.pincode,
'fromOfficeAddress')
// handleSuccess('GST Address fetched sucessfully')
// this.setState({
// officeAddress1: {
// value: response?.data?.addressLine1,
// },
// officeAddress2: {
// value: response?.data?.addressLine2,
// },
// officePincode: {
// value: response?.data?.pincode,
 // isValid: true,
// },
// })
// }
// }
// })
// }
if (
this.props.userQDEDataSelector &&
this.props.userQDEDataSelector.additionalDetails &&
this.props.userQDEDataSelector.additionalDetails.kycaddresDetails
) {
const additionalDetailsData =
this.props.userQDEDataSelector.additionalDetails;
const pangstdetails = this.props.userQDEDataSelector.pangstdetails;
const actualPermanentAddDetails =
this.props.userQDEDataSelector.actualPermanentAddDetails || ''

this.setState({
cancelButtonTitle: additionalDetailsData.kycaddresDetails.address1 !
== undefined ? 'Loan Summary' : 'Cancel',
leadCode: this.props.userQDEDataSelector.leadCode ||
this.state.leadCode,
panDOB: pangstdetails?.dateOfBirth || ''
//applicantUniqueId:
this.props.userQDEDataSelector.applicantUniqueId,
});
this.props.getLoanSummary({
dataToAPI,
callback: (response) => {
// console.log("TTTTTTTTTTT", JSON.stringify(response, null, 4));
// console.log("hhjjjjjjhhhhhh",
response?.coapplicant[this.props.navigation.state.params.index]?.kycDocumentMandato
ry, JSON.stringify(response, null, 4));
this.setState({
isViewOnly:
response?.mainapplicant?.loanSchemeFreeze ? true :
response?.mainapplicant?.dedupeStatus ? true :
response?.mainapplicant?.bureauStatus ? true :
// response?.mainapplicant?.loanAgreementFlag ? true :
response?.modelAccess[0]?.read ? true :
false,
kycFreeze:
response?.mainapplicant?.kycFreeze ? true :
response?.mainapplicant?.dedupeStatus ? true :
response?.mainapplicant?.bureauStatus ? true :
// response?.mainapplicant?.loanAgreementFlag ? true :
response?.modelAccess[0]?.read ? true :
false,

currentAddressRadioButtonFreeze:this.state.iscoapplicant ?
response?.coapplicant[this.props.navigation.state.params.index]?.currentAddressRadi
oButtonFreeze ? true : false :
this.state.isguarantor ?
response?.gurantor[this.props.navigation.state.params.index]?.currentAddressRadioBu
ttonFreeze ? true : false :

response?.mainapplicant?.currentAddressRadioButtonFreeze ? true : false,

 currentAddressFreeze:
this.state.iscoapplicant ?
response?.coapplicant[this.props.navigation.state.params.index]?.currentAddressFree
ze ? true : false :
this.state.isguarantor ?
response?.gurantor[this.props.navigation.state.params.index]?.currentAddressFreeze
? true : false :
response?.mainapplicant?.currentAddressFreeze ? true :
false,

currentAddressFiledsEditableFreeze:
this.state.iscoapplicant ?
response?.coapplicant[this.props.navigation.state.params.index]?.currentAddressFile
dsEditableFreeze ? true : false :
this.state.isguarantor ?
response?.gurantor[this.props.navigation.state.params.index]?.currentAddressFiledsE
ditableFreeze ? true : false :

response?.mainapplicant?.currentAddressFiledsEditableFreeze ? true : false,

kycFiledsEditableFreeze:
this.state.iscoapplicant ?
response?.coapplicant[this.props.navigation.state.params.index]?.kycFiledsEditableF
reeze ? true : false :
this.state.isguarantor ?
response?.gurantor[this.props.navigation.state.params.index]?.kycFiledsEditableFree
ze ? true : false :
response?.mainapplicant?.kycFiledsEditableFreeze ? true :
false,

kycDocumentMandatory:
this.state.iscoapplicant ?
response?.coapplicant[this.props.navigation.state.params.index]?.kycDocumentMandato
ry ? false : true :
this.state.isguarantor ?
response?.gurantor[this.props.navigation.state.params.index]?.kycDocumentMandatory
? false : true :
response?.mainapplicant?.kycDocumentMandatory ? false :
true

}, () => {
if (additionalDetailsData.kycaddresDetails) {

console.log(additionalDetailsData.kycaddresDetails,"additionalDetailsData.kycaddres
Details");
const { imageData } = this.state;
if (additionalDetailsData?.kycaddresDetails?.filePath) {
(additionalDetailsData?.kycaddresDetails?.filePath ||
[]).forEach(
(item) => {
const { filePath, docType } = item;
if (docType.toLowerCase().includes('front') ||
docType.toLowerCase().includes('other')) {
imageData.front.uri = this.state.kycFreeze ?
filePath.startsWith('/var/www/html/') ? filePath.replace('/var/www/html',
uatURL.URL) : filePath
:
pangstdetails?.documentType == 'form60' &&
additionalDetailsData.kycaddresDetails.identityProofType === 'aadhar' ?
filePath.startsWith('/var/www/html/') ? filePath.replace('/var/www/html',
uatURL.URL) : filePath :
pangstdetails?.documentType == 'pan' ?
filePath.startsWith('/var/www/html/') ? filePath.replace('/var/www/html',
uatURL.URL) : filePath : ''
} else if (docType.toLowerCase().includes('back')) {
imageData.back.uri = this.state.kycFreeze ?
filePath.startsWith('/var/www/html/') ? filePath.replace('/var/www/html',
uatURL.URL) : filePath :
pangstdetails?.documentType == 'form60' &&
additionalDetailsData.kycaddresDetails.identityProofType === 'aadhar' ?
filePath.startsWith('/var/www/html/') ? filePath.replace('/var/www/html',
uatURL.URL) : filePath :
pangstdetails?.documentType == 'pan' ?
filePath.startsWith('/var/www/html/') ? filePath.replace('/var/www/html',
uatURL.URL) : filePath : ''
}
},
);
}
this.setState({
imageData,
// selectedOtherDoc:
additionalDetailsData.kycaddresDetails.otherName || '',
selectedSourceValue:
additionalDetailsData.kycaddresDetails.aadharAuthenticationType == 'AadharOcr' ?
"OCR" : additionalDetailsData.kycaddresDetails.aadharAuthenticationType ==
'AadharOtp' ? 'OTP' :
additionalDetailsData.kycaddresDetails.aadharAuthenticationType == 'AadharFace' ?
'Face' : additionalDetailsData.kycaddresDetails.aadharAuthenticationType ==
'AadharFingerprint' ? 'Fingerprint' : '',
aadharAuthenticationType:
additionalDetailsData.kycaddresDetails.aadharAuthenticationType,
aadharAuthentication:
additionalDetailsData.kycaddresDetails.aadharAuthentication,
aadharDateOfBirth:
additionalDetailsData.kycaddresDetails.dateOfBirth,
aadharDateOfBirthText:
additionalDetailsData.kycaddresDetails.dateOfBirth,

addressLine1: {
value: this.state.kycFreeze ?
additionalDetailsData.kycaddresDetails.address1 :
pangstdetails?.documentType == 'form60' &&
additionalDetailsData.kycaddresDetails.identityProofType === 'aadhar' ?
additionalDetailsData.kycaddresDetails.address1 :
pangstdetails?.documentType == 'pan' ?
additionalDetailsData.kycaddresDetails.address1 : '',
},
addressLine2: {
value: this.state.kycFreeze ?
additionalDetailsData.kycaddresDetails.address2 :
pangstdetails?.documentType == 'form60' &&
additionalDetailsData.kycaddresDetails.identityProofType === 'aadhar' ?
additionalDetailsData.kycaddresDetails.address2 :
pangstdetails?.documentType == 'pan' ?
additionalDetailsData.kycaddresDetails.address2 : '',
},
landmark1: {
 value: this.state.kycFreeze ?
additionalDetailsData.kycaddresDetails.landmark1 :
pangstdetails?.documentType == 'form60' &&
additionalDetailsData.kycaddresDetails.identityProofType === 'aadhar' ?
additionalDetailsData.kycaddresDetails.landmark1 :
pangstdetails?.documentType == 'pan' ?
additionalDetailsData.kycaddresDetails.landmark1 : '',
},
landmark2: {
value: this.state.kycFreeze ?
additionalDetailsData.kycaddresDetails.landmark2 :
pangstdetails?.documentType == 'form60' &&
additionalDetailsData.kycaddresDetails.identityProofType === 'aadhar' ?
additionalDetailsData.kycaddresDetails.landmark2 :
pangstdetails?.documentType == 'pan' ?
additionalDetailsData.kycaddresDetails.landmark2 : '',
},
pincode: {
value: this.state.kycFreeze ?
additionalDetailsData.kycaddresDetails.pinCode :
pangstdetails?.documentType == 'form60' &&
additionalDetailsData.kycaddresDetails.identityProofType === 'aadhar' ?
additionalDetailsData.kycaddresDetails.pinCode :
pangstdetails?.documentType == 'pan' ?
additionalDetailsData.kycaddresDetails.pinCode : '',
isValid: true,
},
selectedSourceType: pangstdetails?.entity == "Sole
Proprietory Firm" ? "Proprietor" : "Partner",
// additionalDetailsData?.kycaddresDetails?.kycDesignation ||
'',
radioOther:
additionalDetailsData?.kycaddresDetails?.otherDesignation || '',
kycData: additionalDetailsData.kycaddresDetails.city !==
undefined ? true : false,
fileNumber:
additionalDetailsData.kycaddresDetails.fileNumber,
dateOfBirthText:
additionalDetailsData.kycaddresDetails.dateOfBirth,
dlNo: additionalDetailsData.kycaddresDetails.identityProofNo,
dlVerified:
additionalDetailsData.kycaddresDetails.identityProofType != "voter" &&
additionalDetailsData.kycaddresDetails.identityProofNo &&
additionalDetailsData.kycaddresDetails.identityProofNo.length > 1 ? true : false,
voterVerified:
additionalDetailsData.kycaddresDetails.identityProofType === "voter" &&
additionalDetailsData.kycaddresDetails.epicNumber &&
additionalDetailsData.kycaddresDetails.epicNumber.length > 1 ? true : false,
dateOfBirthDLText:
additionalDetailsData.kycaddresDetails.dateOfBirth,
epicNo: additionalDetailsData.kycaddresDetails.epicNumber,
selectedOtherDoc: {
value:
additionalDetailsData?.kycaddresDetails?.identityProofNo || null,
label:
additionalDetailsData?.kycaddresDetails?.identityProofNo || null
},
// registeredCollapsed:
additionalDetailsData.kycaddresDetails.city !== undefined ? false :true?
 city: this?.state?.kycFreeze ?
additionalDetailsData.kycaddresDetails.city :
pangstdetails?.documentType == 'form60' &&
additionalDetailsData.kycaddresDetails.identityProofType === 'aadhar' ?
additionalDetailsData?.kycaddresDetails?.city :
pangstdetails?.documentType == 'pan' ?
additionalDetailsData.kycaddresDetails.city : '',

year: this?.state?.kycFreeze ?
additionalDetailsData?.kycaddresDetails?.kycYear :
pangstdetails?.documentType == 'form60' &&
additionalDetailsData?.kycaddresDetails?.identityProofType === 'aadhar' ?
additionalDetailsData?.kycaddresDetails?.kycYear :
pangstdetails?.documentType == 'pan' ?
additionalDetailsData?.kycaddresDetails?.kycYear : '',

// state: this?.state?.kycFreeze ?
additionalDetailsData?.kycaddresDetails?.state :
// pangstdetails?.documentType == 'form60' &&
additionalDetailsData?.kycaddresDetails?.identityProofType === 'aadhar' ?
additionalDetailsData?.kycaddresDetails?.state :
// pangstdetails?.documentType == 'pan' ?
additionalDetailsData?.kycaddresDetails?.state : '',

state: {
value: additionalDetailsData?.kycaddresDetails?.state ==
undefined ? null :
this.state.kycFreeze ?
additionalDetailsData?.kycaddresDetails?.state :
pangstdetails?.documentType == 'form60' &&
additionalDetailsData?.kycaddresDetails?.identityProofType === 'aadhar' ?
additionalDetailsData?.kycaddresDetails?.state :
pangstdetails?.documentType == 'pan' ?
additionalDetailsData?.kycaddresDetails?.state : null,

label: this.state.kycFreeze ?
additionalDetailsData?.kycaddresDetails?.state?.toString() :
pangstdetails?.documentType == 'form60' &&
additionalDetailsData?.kycaddresDetails?.identityProofType === 'aadhar' ?
additionalDetailsData?.kycaddresDetails?.state?.toString() :
pangstdetails?.documentType == 'pan' ?
additionalDetailsData?.kycaddresDetails?.state?.toString() : null,
},
// selectedMonth: {
// value: additionalDetailsData.kycaddresDetails.kycMonth,
// // label:
additionalDetailsData.kycaddresDetails.kycMonth !== undefined ?
additionalDetailsData.kycaddresDetails.kycMonth.toString() : null,
// },
selectedMonth: {
value: additionalDetailsData?.kycaddresDetails?.kycMonth ==
undefined ? null :
this.state.kycFreeze ?
additionalDetailsData?.kycaddresDetails?.kycMonth :
pangstdetails?.documentType == 'form60' &&
additionalDetailsData?.kycaddresDetails?.identityProofType === 'aadhar' ?
additionalDetailsData?.kycaddresDetails?.kycMonth :
pangstdetails?.documentType == 'pan' ?
additionalDetailsData?.kycaddresDetails?.kycMonth : null,
 label: this.state.kycFreeze ?
additionalDetailsData?.kycaddresDetails?.kycMonth?.toString() :
pangstdetails?.documentType == 'form60' &&
additionalDetailsData?.kycaddresDetails?.identityProofType === 'aadhar' ?
additionalDetailsData?.kycaddresDetails?.kycMonth?.toString() :
pangstdetails?.documentType == 'pan' ?
additionalDetailsData?.kycaddresDetails?.kycMonth?.toString() : null,
},

idToEditKYCData: additionalDetailsData.kycaddresDetails.id ||
null,
selectedResidentType: {
value: this.state.kycFreeze ?
additionalDetailsData?.kycaddresDetails?.residenceType?.toString() :
pangstdetails?.documentType == 'form60' &&
additionalDetailsData?.kycaddresDetails?.identityProofType === 'aadhar' ?
additionalDetailsData?.kycaddresDetails?.residenceType?.toString() :
pangstdetails?.documentType == 'pan' ?
additionalDetailsData?.kycaddresDetails?.residenceType?.toString() : null,

label: this.state.kycFreeze ?
additionalDetailsData?.kycaddresDetails?.residenceType?.toString() :
pangstdetails?.documentType == 'form60' &&
additionalDetailsData?.kycaddresDetails?.identityProofType === 'aadhar' ?
additionalDetailsData?.kycaddresDetails?.residenceType?.toString() :
pangstdetails?.documentType == 'pan' ?
additionalDetailsData?.kycaddresDetails?.residenceType?.toString() : null,

},
residenceFlag:
additionalDetailsData.kycaddresDetails.residenceType === 'PG' ||
additionalDetailsData.kycaddresDetails.residenceType ===
'Corporate Provided' ? false : true,

// selectedDocType:
// (
//
additionalDetailsData.kycaddresDetails.identityProofType === 'aadhar' ? 'adhar'
// :
additionalDetailsData.kycaddresDetails.identityProofType === 'drivingLicense' ?
'driving license'
// :
additionalDetailsData.kycaddresDetails.identityProofType) || '',
selectedDocType: this.state.kycFreeze ?
(additionalDetailsData?.kycaddresDetails?.identityProofType
=== 'aadhar' ? 'adhar' :

additionalDetailsData?.kycaddresDetails?.identityProofType === 'drivingLicense' ?

'driving license' :

additionalDetailsData?.kycaddresDetails?.identityProofType) :
pangstdetails?.documentType == 'form60' ? 'adhar' :
pangstdetails?.documentType == 'pan' ?

(additionalDetailsData?.kycaddresDetails?.identityProofType === 'aadhar' ?

'adhar' :

additionalDetailsData?.kycaddresDetails?.identityProofType === 'drivingLicense' ?

'driving license' :

additionalDetailsData?.kycaddresDetails?.identityProofType || '') :

additionalDetailsData?.kycaddresDetails?.identityProofType || '',

addharName: additionalDetailsData.kycaddresDetails.addharName
|| '',
adharID:
(

additionalDetailsData?.kycaddresDetails?.identityProofType === 'aadhar') ||

additionalDetailsData?.kycaddresDetails?.identityProofType === 'adhar'

?
additionalDetailsData?.kycaddresDetails?.identityProofNo?.replace(/\d{4}(?=.)/g,
'$& ')
: '',

});
}

})
}
})

if (additionalDetailsData?.currentOfficeAddresDetails &&
pangstdetails?.occupationType != "salaried") {
//
this.handleDocType(additionalDetailsData.currentOfficeAddresDetails.officeType)

console.log(additionalDetailsData?.currentOfficeAddresDetails,"additionalDetailsDat
a?.currentOfficeAddresDetails");
this.setState({
idToEditOfficeAddress:
additionalDetailsData.currentOfficeAddresDetails.id || null,
imageDataCurrent: {
front: {
uri:
additionalDetailsData?.currentOfficeAddresDetails?.currentAddressFilePath ?
additionalDetailsData?.currentOfficeAddresDetails?.currentAddressFilePath.startsWit
h('/var/www/html/') ?
additionalDetailsData?.currentOfficeAddresDetails?.currentAddressFilePath?.replace(
'/var/www/html', uatURL.URL) :
additionalDetailsData?.currentOfficeAddresDetails?.currentAddressFilePath : '',
data: '',
},
back: {
uri:
additionalDetailsData?.currentOfficeAddresDetails?.currentAddressFilePathBack ?
additionalDetailsData?.currentOfficeAddresDetails?.currentAddressFilePathBack.start
sWith('/var/www/html/') ?
additionalDetailsData?.currentOfficeAddresDetails?.currentAddressFilePathBack?.repl
ace('/var/www/html', uatURL.URL) :
additionalDetailsData?.currentOfficeAddresDetails?.currentAddressFilePathBack : '',
data: '',
}
 },
selectedCurrentAddressRadio:
additionalDetailsData.currentOfficeAddresDetails?.aadharAuthenticationType ==
'AadharOcr' ? "OCR" :
additionalDetailsData.currentOfficeAddresDetails?.aadharAuthenticationType ==
'AadharOtp' ? 'OTP' :
additionalDetailsData.currentOfficeAddresDetails?.aadharAuthenticationType ==
'AadharFace' ? 'Face' :
additionalDetailsData.currentOfficeAddresDetails?.aadharAuthenticationType ==
'AadharFingerprint' ? 'Fingerprint' : '',
currentAddressaadharAuthenticationType:
additionalDetailsData?.currentOfficeAddresDetails?.aadharAuthenticationType,
currentAddressaadharAuthentication:
additionalDetailsData?.currentOfficeAddresDetails?.aadharAuthentication,
officeAddress1: {
value:
additionalDetailsData.currentOfficeAddresDetails.sameRegisteredAddressFlag ?
additionalDetailsData.kycaddresDetails.address1 :
additionalDetailsData.currentOfficeAddresDetails.address1 || '',
},
officeAddress2: {
value:
additionalDetailsData.currentOfficeAddresDetails.sameRegisteredAddressFlag ?
additionalDetailsData.kycaddresDetails.address2 :
additionalDetailsData.currentOfficeAddresDetails.address2 || '',

},
officeLandmark1: {
value: additionalDetailsData.currentOfficeAddresDetails.landmark1
|| '',
},
officeLandmark2: {
value: additionalDetailsData.currentOfficeAddresDetails.landmark2
|| '',

},
officePincode: {
value:
additionalDetailsData.currentOfficeAddresDetails.sameRegisteredAddressFlag ?
additionalDetailsData.kycaddresDetails.pinCode :
additionalDetailsData.currentOfficeAddresDetails.pinCode || '',
isValid: true,
},
officeData: additionalDetailsData.currentOfficeAddresDetails.city !
== undefined ? true : false,
officeCity:
additionalDetailsData.currentOfficeAddresDetails.sameRegisteredAddressFlag ?
additionalDetailsData.kycaddresDetails.city || '' :
additionalDetailsData.currentOfficeAddresDetails.city || '',
officeState: {
value: additionalDetailsData.currentOfficeAddresDetails.state ||
null,
label: additionalDetailsData.currentOfficeAddresDetails.state ||
null,
},

//
additionalDetailsData.currentOfficeAddresDetails.sameRegisteredAddressFlag ?
// additionalDetailsData.kycaddresDetails.state || '' :
additionalDetailsData.currentOfficeAddresDetails.state || '',
selectedOfficeType: {
value:
additionalDetailsData.currentOfficeAddresDetails.officeType || null,
label:
additionalDetailsData.currentOfficeAddresDetails.officeType || null,
},
// officeMonth:
additionalDetailsData.currentOfficeAddresDetails.sameRegisteredAddressFlag ?
additionalDetailsData.kycaddresDetails.state || '' :
additionalDetailsData.currentOfficeAddresDetails.state || '',
officeYear:
additionalDetailsData.currentOfficeAddresDetails.officeYear,
officeMonth: {
value:
additionalDetailsData?.currentOfficeAddresDetails?.officeMonth,
label:
additionalDetailsData?.currentOfficeAddresDetails?.officeMonth?.toString() || null,
},
isSelected1:
additionalDetailsData.currentOfficeAddresDetails.sameRegisteredAddressFlag ||
false,
gstAddressFlag:
additionalDetailsData.currentOfficeAddresDetails.gstAddressFlag,
selectedRelation: {
value:
additionalDetailsData.currentOfficeAddresDetails.electricityBillOnName,
label:
additionalDetailsData.currentOfficeAddresDetails.electricityBillOnName,
},
serviceProvider: {
value:
additionalDetailsData.currentOfficeAddresDetails.serviceProvider,
label:
additionalDetailsData.currentOfficeAddresDetails.serviceProvider,
},
consumerName:
additionalDetailsData.currentOfficeAddresDetails.electricityPersonName || '',
consumerNumber:
additionalDetailsData.currentOfficeAddresDetails.identityProofNo || '',
karzaDataFlag: null,
}, () => {

this.state.selectedOfficeType.value != null ?

this.props.getDocType({
dataToAPI: {
residentType:
additionalDetailsData.currentOfficeAddresDetails.officeType || ''
},
callback: (response) => {
const dataForDropdown = response?.data?.data?.map((value) =>
({
value: value?.poaType,
label: value?.poaType,
docType: value?.poaType,
id: value?.id,
}));
// doc == 'permanentResidence' ?
 // this.setState({ dropdownPerDocType: dataForDropdown ||
[] })
// :
this.setState({ dropdownOfficeDocType: dataForDropdown ||
[] }, () => {
this.setState({
selectedOfficeDocType: {
value:
additionalDetailsData.currentOfficeAddresDetails.docType || null,
label:
additionalDetailsData.currentOfficeAddresDetails.docType || null,
},
})
});

},
})
: null

});
}
if (additionalDetailsData.officeAddresDetails &&
pangstdetails?.occupationType == "salaried"
) {

console.log(additionalDetailsData.officeAddresDetails,"additionalDetailsData.office
AddresDetails");
this.setState({
selectedCurrentAddressRadio:
additionalDetailsData.officeAddresDetails?.aadharAuthenticationType ==
'AadharOcr' ? "OCR" :
additionalDetailsData.officeAddresDetails?.aadharAuthenticationType ==
'AadharOtp' ? 'OTP' :
additionalDetailsData.officeAddresDetails?.aadharAuthenticationType == 'AadharFace'
? 'Face' : additionalDetailsData.officeAddresDetails?.aadharAuthenticationType ==
'AadharFingerprint' ? 'Fingerprint' : '',
currentAddressaadharAuthenticationType:
additionalDetailsData?.officeAddresDetails?.aadharAuthenticationType,
currentAddressaadharAuthentication:
additionalDetailsData?.officeAddresDetails?.aadharAuthentication,
idToEditOfficeAddress:
additionalDetailsData.officeAddresDetails.id || null,
officeAddress1: {
value: additionalDetailsData.officeAddresDetails.address1 || '',
},
officeAddress2: {
value: additionalDetailsData.officeAddresDetails.address2 || '',

},
officeLandmark1: {
value: additionalDetailsData.officeAddresDetails.landmark1 || '',
},
officeLandmark2: {
value: additionalDetailsData.officeAddresDetails.landmark2 || '',

},
officePincode: {
value: additionalDetailsData.officeAddresDetails.pinCode || '',
isValid: true,
 },
officeData: additionalDetailsData.officeAddresDetails.city !==
undefined ? true : false,
officeCity: additionalDetailsData.officeAddresDetails.city || '',
officeState: additionalDetailsData.officeAddresDetails.state || '',
});
}
if (actualPermanentAddDetails != '' && actualPermanentAddDetails !=
null) {
//
this.handleDocType(actualPermanentAddDetails.permanentResidenceType,
'permanentResidence')

this.setState({
idToEditPermResAddress: actualPermanentAddDetails.id || null,
imageDataPermanent: {
front: {
uri: actualPermanentAddDetails?.filePath ?
actualPermanentAddDetails?.filePath.startsWith('/var/www/html/') ?
actualPermanentAddDetails?.filePath?.replace('/var/www/html', uatURL.URL):
actualPermanentAddDetails?.filePath : '',
},
back: {
uri: actualPermanentAddDetails?.filePathBack ?
actualPermanentAddDetails?.filePathBack.startsWith('/var/www/html/') ?
actualPermanentAddDetails?.filePathBack?.replace('/var/www/html', uatURL.URL) :
actualPermanentAddDetails?.filePathBack : '',
}
},
permanantResiAddressData: actualPermanentAddDetails.permanentCity !
== undefined ? true : false,
permanentResAddr1: {
value: actualPermanentAddDetails.permanentAddress1 || '',
},
permanentResAddr2: {
value: actualPermanentAddDetails.permanentAddress2 || '',
},
permanentResLandmark1: {
value: actualPermanentAddDetails.permanentAddressLandmark1 || '',
},
permanentResLandmark2: {
value: actualPermanentAddDetails.permanentAddressLandmark2 || '',
},
permanentResPincode: {
value: actualPermanentAddDetails.permanentPinCode || '',
isValid: true,
},

permanentResCity: actualPermanentAddDetails.permanentCity || '',

// permanentResState: actualPermanentAddDetails.permanentState ||
'',
permanentResState: {
value: actualPermanentAddDetails.permanentState == undefined ?
null :
actualPermanentAddDetails.permanentState,

label: actualPermanentAddDetails.permanentState?.toString()
},
sameAsKycAddress: actualPermanentAddDetails.sameAsKycAddress,
 permanentResYear: actualPermanentAddDetails.permanentYear,
permanentResMonth: {
value: Number(actualPermanentAddDetails?.permanentMonth),
label: actualPermanentAddDetails?.permanentMonth?.toString() ||
null,
},
permanentResidenceType: {
value: actualPermanentAddDetails.permanentResidenceType,
label: actualPermanentAddDetails.permanentResidenceType,
},

permanentSelectedRelation: {
value: actualPermanentAddDetails.electricityBillOnName,
label: actualPermanentAddDetails.electricityBillOnName,
},
permanentConsumerName:
actualPermanentAddDetails.electricityPersonName,
permanentServiceProvider: {
value: actualPermanentAddDetails.serviceProvider,
label: actualPermanentAddDetails.serviceProvider,
},
permanentConsumerNumber: actualPermanentAddDetails.identityProofNo,
}, () => {
this.state.permanentResidenceType.value != null ?
this.props.getDocType({
dataToAPI: {
residentType:
actualPermanentAddDetails.permanentResidenceType
},
callback: (response) => {
const dataForDropdown = response.data.data.map((value) =>
({
value: value.poaType,
label: value.poaType,
docType: value.poaType,
id: value.id,
}));
// console.log("mjjjgjjjj", dataForDropdown);
this.setState({ dropdownPerDocType: dataForDropdown || [] },
() => {
this.setState({
permanentResidenceDocType: {
value: actualPermanentAddDetails.docType,
label: actualPermanentAddDetails.docType,
},
})
})

},
})
: null
});
}
if (additionalDetailsData.permanentaddresDetails && !
this.state.indSelfSoleFlag) {
//
this.handleDocType(additionalDetailsData.permanentaddresDetails.residenceType)
 this.setState({
idToEditPermanentAddress:
additionalDetailsData.permanentaddresDetails.id || null,
imageDataCurrent: {
front: {
uri:
additionalDetailsData?.permanentaddresDetails?.currentAddressFilePath ?
additionalDetailsData?.permanentaddresDetails?.currentAddressFilePath.startsWith('/
var/www/html/') ?
additionalDetailsData?.permanentaddresDetails?.currentAddressFilePath?.replace('/
var/www/html', uatURL.URL) :
additionalDetailsData?.permanentaddresDetails?.currentAddressFilePath : '',
data: '',
},
back: {
uri:
additionalDetailsData?.permanentaddresDetails?.currentAddressFilePathBack ?
additionalDetailsData?.permanentaddresDetails?.currentAddressFilePathBack.startsWit
h('/var/www/html/') ?
additionalDetailsData?.permanentaddresDetails?.currentAddressFilePathBack?.replace(
'/var/www/html', uatURL.URL) :
additionalDetailsData?.permanentaddresDetails?.currentAddressFilePathBack : '',
data: '',
}
},
selectedSourceValue:
additionalDetailsData.permanentaddresDetails.aadharAuthenticationType ==
'AadharOcr' ? "No" :
additionalDetailsData.permanentaddresDetails.aadharAuthenticationType ==
'AadharOtp' ? 'Yes' : '',
aadharAuthenticationType:
additionalDetailsData.permanentaddresDetails.aadharAuthenticationType,
aadharAuthentication:
additionalDetailsData.permanentaddresDetails.aadharAuthentication,
permanentAddress1: {
value: additionalDetailsData.permanentaddresDetails.sameKycFlag ?
additionalDetailsData.kycaddresDetails.address1 :
additionalDetailsData.permanentaddresDetails.address1 || '',
},
permanentAddress2: {
value: additionalDetailsData.permanentaddresDetails.sameKycFlag ?
additionalDetailsData.kycaddresDetails.address2 :
additionalDetailsData.permanentaddresDetails.address2 || '',
},
permanentLandmark1: {
value: additionalDetailsData.permanentaddresDetails.landmark1 ||
'',
},
permanentLandmark2: {
value: additionalDetailsData.permanentaddresDetails.landmark2 ||
'',
},
permanentPincode: {
value: additionalDetailsData.permanentaddresDetails.sameKycFlag ?
additionalDetailsData.kycaddresDetails.pinCode :
additionalDetailsData.permanentaddresDetails.pinCode || '',
isValid: true,
},
permanantAddressData:
additionalDetailsData?.permanentaddresDetails?.address1 ? true : false,
permanentCity:
additionalDetailsData.permanentaddresDetails.sameKycFlag ?
additionalDetailsData.kycaddresDetails.city || '' :
additionalDetailsData.permanentaddresDetails.city || '',
// permanentState:
additionalDetailsData.permanentaddresDetails.sameKycFlag ?
additionalDetailsData.kycaddresDetails.state || '' :
additionalDetailsData.permanentaddresDetails.state || '',
permanentState: {
value: additionalDetailsData?.permanentaddresDetails?.state ==
undefined ? null :
additionalDetailsData?.permanentaddresDetails?.state,
label:
additionalDetailsData?.permanentaddresDetails?.state?.toString()
},
isSelected:
additionalDetailsData.permanentaddresDetails.sameKycFlag,
permanentYear:
additionalDetailsData.permanentaddresDetails.permaYear,
permanentMonth: {
value: additionalDetailsData.permanentaddresDetails.permaMonth,
label: additionalDetailsData.permanentaddresDetails.permaMonth,

},
residenceType: {
value:
additionalDetailsData.permanentaddresDetails.residenceType,
label:
additionalDetailsData.permanentaddresDetails.residenceType,
},
selectedRelation: {
value:
additionalDetailsData.permanentaddresDetails.electricityBillOnName,
label:
additionalDetailsData.permanentaddresDetails.electricityBillOnName,
},
serviceProvider: {
value:
additionalDetailsData.permanentaddresDetails.serviceProvider,
label:
additionalDetailsData.permanentaddresDetails.serviceProvider,
},
consumerName:
additionalDetailsData.permanentaddresDetails.electricityPersonName || '',
consumerNumber:
additionalDetailsData.permanentaddresDetails.identityProofNo || '',
karzaDataFlag: null
// additionalDetailsData.permanentaddresDetails.karzaDataFlag,
}, () => {
// console.log("kkjhhhh",
additionalDetailsData.permanentaddresDetails.docType || null,);
this.state.residenceType.value != null ?
this.props.getDocType({
dataToAPI: {
residentType:
additionalDetailsData.permanentaddresDetails.residenceType
},
callback: (response) => {
 const dataForDropdown = response.data.data.map((value) =>
({
value: value.poaType,
label: value.poaType,
docType: value.poaType,
id: value.id,
}));

this.setState({ dropdownDocType: dataForDropdown || [] }, ()

=> {
this.setState({
residenceDocType: {
value:
additionalDetailsData.permanentaddresDetails.docType || null,
label:
additionalDetailsData.permanentaddresDetails.docType || null,
},
})
});

},
})
: null
});
}

}
}
})
}, 1000);
}

apiCall = () => {
this.focusListener = this.props.navigation.addListener('didFocus', () => {
this.getQdeData();
})
}

handleActivityResult = (result) => {

// Handle the result here

const token = this.props?.userData?.token;

const dispatch=this.props?.dispatch;

if(result?.error){
if(result?.error == "Please install Protean apk."){
Alert.alert('ActivityResult:', result?.error)
} else {
const data ={
response:result.error,
serverLocation:this.state?.serverLocation
}
// this.props.getResponseXml({
// data,
// callback: (response) => {
// // console.log(response,"getResponseXml response");
// this.getQdeData();
// }
// })
externalServerGetResponseXmlApi(token,dispatch,this.state?.serverUrl,this.state?.se
rverUserName,this.state?.serverPassword,data).then(response => {
// Handle the response from the second API
console.log('Response from externalServerGetResponseXmlApi API:',
response?.length);
if(response){
this.getQdeData();
}
})
.catch(error => {
// Handle error from the second API
console.error('Error fetching data from externalServerGetResponseXmlApi
API:', error);
});
}

} else {
// console.log(typeof result?.result,"typeof result");
// console.log("genericFetch", JSON.stringify(result?.result, null, 4));
const data ={
response:result.result,
serverLocation:this.state?.serverLocation
}

externalServerGetResponseXmlApi(token,dispatch,this.state?.serverUrl,this.state?.se
rverUserName,this.state?.serverPassword,data).then(response => {
// Handle the response from the second API
console.log('Response from externalServerGetResponseXmlApi API:',
response?.length);
if(response){
this.getQdeData();
}
})
.catch(error => {
// Handle error from the second API
console.error('Error fetching data from externalServerGetResponseXmlApi
API:', error);
});
// this.props.getResponseXml({
// data,
// callback: (response) => {
// // console.log(response,"getResponseXml response");
// this.getQdeData();
// }
// })
}

// Update component state with result data

// this.setState({ resultData: result });
}

componentDidMount() {
this.getQdeData()

this.activityResultSubscription = this.eventEmitter.addListener(
'ActivityResult',
this.handleActivityResult
 );
this.activityResultSubscription = this.eventEmitter.addListener(
'IntentError',
this.handleActivityResult
);
// // BackHandler.addEventListener("hardwareBackPress", this.backAction);
// this.focusListener = this.props.navigation.addListener('didFocus', () => {
// this.getQdeData();
// })
}

render() {
const {
mainContainer,
additionalDetailsLabel,
scrollViewStyle,
progressBarContainer,
headerTextContrainer,
} = AdditionalDetailsStyles;
return (

<WaveBackground>
<StatusBar
backgroundColor={colors.COLOR_WHITE}
barStyle={'dark-content'}
translucent={false}
hidden={false}
/>
<Header
label={ADDITIONAL_DETAILS_CONST.HEADER}
showLeftIcon={false}
onPress={() => {
}}
/>

<View style={progressBarContainer}>
<View style={{ alignContent: 'center' }}>
<View style={{ zIndex: 1 }}>
{this.state.currentAddressVisible == false && <DottedProgressBar
totalSteps={this.state.iscoapplicant || this.state.isguarantor ?
[1, 2, 3] : this.state.indSelfSoleFlag ? [1, 2, 3, 4, 5] : [1, 2, 3, 4, 5, 6]}
currentIndex={2}
/>}
</View>
{this.state.currentAddressVisible == false && <View
style={headerTextContrainer}>
<Text style={additionalDetailsLabel}>
{"Demographics Details"}
</Text>
</View>}
</View>
<ScrollView style={scrollViewStyle}>
<View style={mainContainer}>

{this.state.currentAddressVisible == false &&

this.renderRegisteredAddress()}

{
(this.state.currentAddressVisible == true ||
this.state.currentAddressVisible == false) && this.state.indSelfSoleFlag == false
&&
this.permanentAddress()}
{
(this.state.currentAddressVisible == true ||
this.state.currentAddressVisible == false) && this.state.indSelfSoleFlag == true &&
this.officeAddress()
}

{
this.state.currentAddressVisible == false &&
this.state.permanentVisible == true &&
this.permanentResidenceAddr()}

{this.state.currentAddressVisible == false && <View

style={{ alignSelf: 'center', width: '45%', marginVertical: 10 }}>
<Button
title={'Loan Summary'}
//isDisabled={!this.state.mainApplicantSummary === true}
onPress={() => {
this.props.navigation.navigate('LoanSummary', {
leadName: this.state.leadName,
"applicantUniqueId": this.state.iscoapplicant ||
this.state.isguarantor ? this.state.coapplicantUniqueId :
this.state.applicantUniqueId,
leadCode: this.state.leadCode,
mobileNumber: this.state.mobileNumberFromProps,
coapplicantUniqueId: this.state.coapplicantUniqueId,
ismainapplicant: !(this.state.iscoapplicant ||
this.state.isguarantor),
iscoapplicant: this.state.iscoapplicant,
isguarantor: this.state.isguarantor,
isViewOnly: this.state.isViewOnly || false,
});
}}
/>
</View>}
{this.state.currentAddressVisible == false && <View
style={{ flexDirection: 'row' }}>
<View style={{ flex: 1, marginRight: 10 }}>
<Button
title={"Cancel"}
onPress={() => {
this.props.navigation.navigate('LeadList');
}}
/>
</View>

<View style={{ flex: 1, marginRight: 10 }}>

<Button
title={ADDITIONAL_DETAILS_CONST.BUTTON_NEXT}
isDisabled={
// !(this.state.iscoapplicant || this.state.isguarantor) ?
this.getNextDisable()
// : nul

}
 onPress={() => {
this.props.navigation.navigate('AdditionalDetails', {
leadName: this.state.leadName,
applicantUniqueId: this.state.applicantUniqueId,
leadCode: this.state.leadCode,
mobileNumber: this.state.mobileNumberFromProps,
coapplicantUniqueId: this.state.coapplicantUniqueId,
ismainapplicant: this.state.ismainapplicant,
iscoapplicant: this.state.iscoapplicant,
isguarantor: this.state.isguarantor,
index: this.props.navigation.state.params.index
});
}}
/>
</View>
</View>}

</View>
</ScrollView>
</View>
</WaveBackground>
);
}
}

AdditionalDetails.propTypes = {

uploadDocAdditionalDetails: PropTypes.func,
getCityState: PropTypes.func,
getResidenceType: PropTypes.func,
saveEmploymentDetails: PropTypes.func,
saveAdditionalContact: PropTypes.func,
saveOfficeAddress: PropTypes.func,
getCityList: PropTypes.func,
saveKYCDetail: PropTypes.func,
getKYCDoc: PropTypes.func,
getUtilityDoc: PropTypes.func,
getServiceProvider: PropTypes.func,
saveUtilityDetails: PropTypes.func,
getDetailsElectricity: PropTypes.func,
getDetailsGas: PropTypes.func,
getDetailsLandline: PropTypes.func,
uploadUtilityDoc: PropTypes.func,
deleteUploadedUtilityDoc: PropTypes.func,
verifyDrivingLicense: PropTypes.func,
verifyVoterID: PropTypes.func,
getDesignation: PropTypes.func,
getCompanyType: PropTypes.func,
getIndustry: PropTypes.func,

};

export default compose(

container,
withProps(() => { }),
)(AdditionalDetails);

const styles = StyleSheet.create({

autocompleteContainer: {
 flex: 1,
left: 0,
position: 'absolute',
right: 0,
top: 0,
zIndex: 1
}
});