varnitgoyal95/address-verification-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

new design for av case detail (#135)

Browse Source
This commit is contained in:
Aman Sethi
2023-03-14 13:22:11 +05:30
committed by GitHub Enterprise
parent 518c0ff22e
commit e085c6235a
3 changed files with 89 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
src/screens/caseDetails/AvCaseData.tsx
View File

@@ -3,27 +3,52 @@ import React from 'react';
import { LoanDetails, LoanTypeUIMapping } from './interface';
import { GenericStyles } from '../../../RN-UI-LIB/src/styles';
import Text from '../../../RN-UI-LIB/src/components/Text';
import LANChip from './LANChip';
import { COLORS } from '../../../RN-UI-LIB/src/styles/colors';
import { formatAmount } from '../../../RN-UI-LIB/src/utlis/amount';
interface IAvCaseData {
loanDetails: LoanDetails;
}
const AvCaseData: React.FC<IAvCaseData> = ({ loanDetails }) => {
return (
<View style={[GenericStyles.row, GenericStyles.mb8, GenericStyles.mt4]}>
<Text style={[GenericStyles.chip, GenericStyles.whiteBackground]}>
{LoanTypeUIMapping[loanDetails?.loanType]}
</Text>
{loanDetails?.tenureMonths ? <Text
style={[
GenericStyles.chip,
GenericStyles.whiteBackground,
GenericStyles.ml8,
]}>
{loanDetails.tenureMonths}{' '}
{loanDetails.tenureMonths > 1 ? 'Months' : 'Month'}
</Text>: null}
<View style={[GenericStyles.mt10]}>
<View style={[GenericStyles.row, GenericStyles.mb12]}>
<Text
style={[GenericStyles.chip, GenericStyles.whiteBackground]}>
{LoanTypeUIMapping[loanDetails?.loanType]}
</Text>
{loanDetails?.loanAccountNumber ? (
<LANChip
loanAccountNumber={loanDetails.loanAccountNumber}
/>
) : null}
</View>
<View style={[GenericStyles.row, GenericStyles.alignCenter]}>
<Text style={[GenericStyles.whiteText]}>
{loanDetails.tenureMonths}{' '}
{loanDetails.tenureMonths > 1 ? 'months ' : 'month '}
tenure
</Text>
<View style={styles.lineStyle} />
{loanDetails?.disbursementAmount ? (
<Text style={[GenericStyles.whiteText]}>
Amount{' '}
{formatAmount(Number(loanDetails.disbursementAmount))}
</Text>
) : null}
</View>
</View>
);
};
const styles = StyleSheet.create({
lineStyle: {
height: 12,
width: 1,
backgroundColor: COLORS.BORDER.PRIMARY,
marginHorizontal: 8.5,
},
});
export default AvCaseData;

41
src/screens/caseDetails/CollectionCaseData.tsx
View File

@@ -1,14 +1,11 @@
import { View, TouchableHighlight, StyleSheet } from 'react-native';
import { View , StyleSheet } from 'react-native';
import React from 'react';
import { copyToClipboard } from '../../components/utlis/commonFunctions';
import { toast } from '../../../RN-UI-LIB/src/components/toast';
import { CaseDetail, CustomerInfo } from './interface';
import { GenericStyles } from '../../../RN-UI-LIB/src/styles';
import CopyIcon from '../../../RN-UI-LIB/src/Icons/CopyIcon';
import { COLORS } from '../../../RN-UI-LIB/src/styles/colors';
import Text from '../../../RN-UI-LIB/src/components/Text';
import { formatAmount } from '../../../RN-UI-LIB/src/utlis/amount';
import { ToastMessages } from '../allCases/contants';
import LANChip from './LANChip';
interface ICollectionCaseData {
caseData: CaseDetail;
@@ -17,20 +14,6 @@ interface ICollectionCaseData {
const CollectionCaseData: React.FC<ICollectionCaseData> = ({ caseData }) => {
const { fatherName, currentDpd, loanAccountNumber, dpdBucket, pos } =
caseData;
const copyLAN = () => {
if( loanAccountNumber) {
copyToClipboard(loanAccountNumber);
toast({
text1: ToastMessages.SUCCESS_COPYING_LAN,
type: 'info',
});
} else {
toast({
text1: ToastMessages.ERROR_COPYING_LAN,
type: 'error'
})
}
};
return (
<View>
@@ -49,23 +32,7 @@ const CollectionCaseData: React.FC<ICollectionCaseData> = ({ caseData }) => {
small>
Current DPD {currentDpd}
</Text>
<TouchableHighlight
style={[GenericStyles.ml8]}
onPress={copyLAN}>
<View
style={[
GenericStyles.chip,
GenericStyles.whiteBackground,
GenericStyles.row,
GenericStyles.alignCenter,
GenericStyles.centerAligned,
]}>
<Text small>LAN {loanAccountNumber}</Text>
<View style={[GenericStyles.ml4]}>
<CopyIcon />
</View>
</View>
</TouchableHighlight>
{loanAccountNumber && <LANChip loanAccountNumber={loanAccountNumber} />}
</View>
<View
style={[
@@ -95,7 +62,7 @@ const styles = StyleSheet.create({
lineStyle: {
width: 1,
height: 12,
backgroundColor: COLORS.BACKGROUND.GREY_LIGHT,
backgroundColor: COLORS.BORDER.PRIMARY,
marginHorizontal: 12.5,
},
});

47
src/screens/caseDetails/LANChip.tsx Normal file
View File

@@ -0,0 +1,47 @@
import { TouchableHighlight, View } from 'react-native';
import React from 'react';
import { GenericStyles } from '../../../RN-UI-LIB/src/styles';
import { ToastMessages } from '../allCases/contants';
import { toast } from '../../../RN-UI-LIB/src/components/toast';
import { copyToClipboard } from '../../components/utlis/commonFunctions';
import Text from '../../../RN-UI-LIB/src/components/Text';
import CopyIcon from '../../../RN-UI-LIB/src/Icons/CopyIcon';
interface ILANChip {
loanAccountNumber: string;
}
const LANChip: React.FC<ILANChip> = ({ loanAccountNumber }) => {
const copyLAN = () => {
if (loanAccountNumber) {
copyToClipboard(loanAccountNumber);
toast({
text1: ToastMessages.SUCCESS_COPYING_LAN,
type: 'info',
});
} else {
toast({
text1: ToastMessages.ERROR_COPYING_LAN,
type: 'error',
});
}
};
return (
<TouchableHighlight style={[GenericStyles.ml8]} onPress={copyLAN}>
<View
style={[
GenericStyles.chip,
GenericStyles.whiteBackground,
GenericStyles.row,
GenericStyles.alignCenter,
GenericStyles.centerAligned,
]}>
<Text small>LAN {loanAccountNumber}</Text>
<View style={[GenericStyles.ml4]}>
<CopyIcon />
</View>
</View>
</TouchableHighlight>
);
};
export default LANChip;