Skip to content

I
InvestCustomer
Commit 10e869c7 by Giang Tran
Options

update code

parent 2b831bd1
Showing with 1126 additions and 25 deletions
src/Screens/Transaction/DueDate/DueDate.js
import React, {Component} from 'react'; import React, {useState, useEffect} from 'react';
import {View, Text} from 'react-native'; import {getListNotification} from '../../../apis/Functions/users';
import DueDateView from './DueDateView';
import I18n from '../../../helper/i18/i18n';
const DueDate = (props) => {
const [selected, setSelected] = useState('');
const [page, setPage] = useState(1);
const [data, setData] = useState([]);
const [tottalPage, setTotalPage] = useState(1);
const [isRefresh, setisRefresh] = useState(false);
const [fillter, setFillters] = useState('ALL');
useEffect(() => {
getData();
}, [fillter]);
const getData = async () => {
setisRefresh(true);
setPage(1);
const res = await getListNotification({
keyword: '',
platform: Platform.OS,
page_size: 10,
page_index: 1,
type: fillter,
});
setisRefresh(false);
if ((res.data.code = 200 && res.data.data)) {
setData(res.data.data);
setTotalPage(res.data.meta.pages);
} else {
Alert.alert(I18n.t('Notification'), res.data.message);
}
};
const onRefresh = () => {
getData();
};
const onLoadMore = () => {
console.log(tottalPage);
if (page < tottalPage) getDataLoadMore();
};
const getDataLoadMore = async () => {
setisRefresh(true);
const res = await getListNotification({
keyword: '',
platform: Platform.OS,
page_size: 10,
page_index: 1,
type: fillter,
});
setPage(page + 1);
if (res.data.code == 200) {
setData(data.concat(res.data.data));
}
setisRefresh(false);
};
const DueDate = () => {
return ( return (
<View> <DueDateView
<Text>DueDate view</Text> onRefresh={onRefresh}
</View> isRefresh={isRefresh}
onLoadMore={onLoadMore}
setFillters={setFillters}
fillter={fillter}
data={data}
/>
); );
}; };
......
src/Screens/Transaction/DueDate/DueDateView.js 0 → 100644
import React, {useState} from 'react';
import {
View,
Text,
FlatList,
StyleSheet,
TouchableOpacity,
ScrollView,
} from 'react-native';
import HeaderDrawer from '../../../components/Header/HeaderDrawer';
import Item from './Item';
import {getFontXD} from '../../../Config/Functions';
import AppText from '../../../components/AppText';
const Fillters = [
{
id: '1',
name: 'All',
value: 'ALL',
},
{
id: '2',
name: 'Deposit',
value: 'DEPOSIT',
},
{
id: '3',
name: 'Withdraw',
value: 'WITHDRAW',
},
{
id: '4',
name: 'Transfer',
value: 'TRANSFER',
},
];
const EscrowView = (props) => {
const {onRefresh, isRefresh, onLoadMore, setFillters, fillter, data} = props;
return (
<View style={{flex: 1}}>
<View style={styles.headerContainer}>
<ScrollView horizontal showsHorizontalScrollIndicator={false}>
{Fillters.map((e) => (
<TouchableOpacity
key={e.value}
onPress={() => setFillters(e.value)}
style={[
styles.itemFillter,
fillter == e.value ? {borderColor: '#1473E6'} : null,
]}>
<AppText
i18nKey={e.name}
style={[
styles.txtFillter,
fillter == e.value ? {color: '#1473E6'} : {},
]}></AppText>
</TouchableOpacity>
))}
</ScrollView>
</View>
{data.length == 0 ? (
<View style={{justifyContent: 'center', alignItems: 'center', flex: 1}}>
<AppText
i18nKey={'NoData'}
style={{
fontSize: 18,
fontWeight: 'bold',
}}></AppText>
</View>
) : (
<FlatList
keyExtractor={(item) => item.id}
data={data}
refreshing={isRefresh}
onRefresh={onRefresh}
onEndReachedThreshold={0.01}
onEndReached={(info) => {
onLoadMore();
}}
renderItem={({item}) => <Item item={item} />}
/>
)}
</View>
);
};
const styles = StyleSheet.create({
headerContainer: {
paddingVertical: 10,
backgroundColor: 'white',
flexDirection: 'row',
alignItems: 'center',
paddingHorizontal: 10,
},
itemFillter: {
borderRadius: 10,
paddingVertical: 5,
paddingHorizontal: 10,
borderWidth: 1,
borderColor: '#929292',
justifyContent: 'center',
alignItems: 'center',
marginRight: 10,
},
txtFillter: {
fontSize: getFontXD(36),
color: '#929292',
fontWeight: 'bold',
},
txtTitle: {
fontSize: getFontXD(46),
fontWeight: 'bold',
},
});
export default EscrowView;
src/Screens/Transaction/DueDate/Item.js 0 → 100644
import React from 'react';
import {
View,
Text,
StyleSheet,
TouchableOpacity,
Image,
Alert,
} from 'react-native';
import {
getFontXD,
HEIGHTXD,
WIDTHXD,
toPriceVnd,
} from '../../../Config/Functions';
import R from '../../../assets/R';
import Block from '../../../components/Block';
const Item = (props) => {
const {item} = props;
return (
<View style={styles.container}>
<Block flex={1} row>
<View style={styles.wrapLeft} />
<View style={styles.wrapDate}>
<Image source={R.images.iconRecharge} style={styles.imgIcon} />
</View>
<Block padding={[5, 10]} space={'between'} flex={1}>
<View style={{justifyContent: 'center', flex: 1}}>
<Text numberOfLines={2} style={styles.txtBlack}>
{item.body}
</Text>
</View>
<Text style={styles.txt}>{item.pushed_at}</Text>
</Block>
</Block>
</View>
);
};
export default Item;
const styles = StyleSheet.create({
container: {
marginTop: 10,
paddingVertical: 10,
shadowColor: '#000',
shadowOffset: {
width: 0,
height: 2,
},
shadowOpacity: 0.25,
shadowRadius: 3.84,
elevation: 5,
marginHorizontal: 10,
backgroundColor: R.colors.white,
marginBottom: 10,
borderRadius: HEIGHTXD(30),
},
wrapLeft: {
width: WIDTHXD(16),
borderTopLeftRadius: HEIGHTXD(30),
borderBottomStartRadius: HEIGHTXD(30),
},
wrapDate: {
justifyContent: 'center',
paddingHorizontal: 10,
},
txtTitle: {
fontSize: getFontXD(42),
color: R.colors.black,
fontWeight: 'bold',
},
txt: {
fontSize: getFontXD(39),
color: '#929292',
fontStyle: 'italic',
},
rowBet: {
flexDirection: 'row',
justifyContent: 'space-between',
alignItems: 'center',
},
txtBlack: {
fontSize: getFontXD(42),
color: 'black',
},
imgIcon: {
width: WIDTHXD(178),
height: HEIGHTXD(178),
resizeMode: 'contain',
},
});
src/Screens/Transaction/Escrow/Escrow.js
import React, {Component} from 'react'; import React, {useState, useEffect} from 'react';
import {View, Text} from 'react-native'; import {getListNotification} from '../../../apis/Functions/users';
import EscrowView from './EscrowView';
import I18n from '../../../helper/i18/i18n';
const Escrow = (props) => {
const [selected, setSelected] = useState('');
const [page, setPage] = useState(1);
const [data, setData] = useState([]);
const [tottalPage, setTotalPage] = useState(1);
const [isRefresh, setisRefresh] = useState(false);
const [fillter, setFillters] = useState('ALL');
useEffect(() => {
getData();
}, [fillter]);
const getData = async () => {
setisRefresh(true);
setPage(1);
const res = await getListNotification({
keyword: '',
platform: Platform.OS,
page_size: 10,
page_index: 1,
type: fillter,
});
setisRefresh(false);
if ((res.data.code = 200 && res.data.data)) {
setData(res.data.data);
setTotalPage(res.data.meta.pages);
} else {
Alert.alert(I18n.t('Notification'), res.data.message);
}
};
const onRefresh = () => {
getData();
};
const onLoadMore = () => {
console.log(tottalPage);
if (page < tottalPage) getDataLoadMore();
};
const getDataLoadMore = async () => {
setisRefresh(true);
const res = await getListNotification({
keyword: '',
platform: Platform.OS,
page_size: 10,
page_index: 1,
type: fillter,
});
setPage(page + 1);
if (res.data.code == 200) {
setData(data.concat(res.data.data));
}
setisRefresh(false);
};
const Escrow = () => {
return ( return (
<View> <EscrowView
<Text>Ecrow view</Text> onRefresh={onRefresh}
</View> isRefresh={isRefresh}
onLoadMore={onLoadMore}
setFillters={setFillters}
fillter={fillter}
data={data}
/>
); );
}; };
......
src/Screens/Transaction/Escrow/EscrowView.js 0 → 100644
import React, {useState} from 'react';
import {
View,
Text,
FlatList,
StyleSheet,
TouchableOpacity,
ScrollView,
} from 'react-native';
import HeaderDrawer from '../../../components/Header/HeaderDrawer';
import Item from './Item';
import {getFontXD} from '../../../Config/Functions';
import AppText from '../../../components/AppText';
const Fillters = [
{
id: '1',
name: 'All',
value: 'ALL',
},
{
id: '2',
name: 'Deposit',
value: 'DEPOSIT',
},
{
id: '3',
name: 'Withdraw',
value: 'WITHDRAW',
},
{
id: '4',
name: 'Transfer',
value: 'TRANSFER',
},
];
const EscrowView = (props) => {
const {onRefresh, isRefresh, onLoadMore, setFillters, fillter, data} = props;
return (
<View style={{flex: 1}}>
<View style={styles.headerContainer}>
<ScrollView horizontal showsHorizontalScrollIndicator={false}>
{Fillters.map((e) => (
<TouchableOpacity
key={e.value}
onPress={() => setFillters(e.value)}
style={[
styles.itemFillter,
fillter == e.value ? {borderColor: '#1473E6'} : null,
]}>
<AppText
i18nKey={e.name}
style={[
styles.txtFillter,
fillter == e.value ? {color: '#1473E6'} : {},
]}></AppText>
</TouchableOpacity>
))}
</ScrollView>
</View>
{data.length == 0 ? (
<View style={{justifyContent: 'center', alignItems: 'center', flex: 1}}>
<AppText
i18nKey={'NoData'}
style={{
fontSize: 18,
fontWeight: 'bold',
}}></AppText>
</View>
) : (
<FlatList
keyExtractor={(item) => item.id}
data={data}
refreshing={isRefresh}
onRefresh={onRefresh}
onEndReachedThreshold={0.01}
onEndReached={(info) => {
onLoadMore();
}}
renderItem={({item}) => <Item item={item} />}
/>
)}
</View>
);
};
const styles = StyleSheet.create({
headerContainer: {
paddingVertical: 10,
backgroundColor: 'white',
flexDirection: 'row',
alignItems: 'center',
paddingHorizontal: 10,
},
itemFillter: {
borderRadius: 10,
paddingVertical: 5,
paddingHorizontal: 10,
borderWidth: 1,
borderColor: '#929292',
justifyContent: 'center',
alignItems: 'center',
marginRight: 10,
},
txtFillter: {
fontSize: getFontXD(36),
color: '#929292',
fontWeight: 'bold',
},
txtTitle: {
fontSize: getFontXD(46),
fontWeight: 'bold',
},
});
export default EscrowView;
src/Screens/Transaction/Escrow/Item.js 0 → 100644
import React from 'react';
import {
View,
Text,
StyleSheet,
TouchableOpacity,
Image,
Alert,
} from 'react-native';
import {
getFontXD,
HEIGHTXD,
WIDTHXD,
toPriceVnd,
} from '../../../Config/Functions';
import R from '../../../assets/R';
import Block from '../../../components/Block';
const Item = (props) => {
const {item} = props;
return (
<View style={styles.container}>
<Block flex={1} row>
<View style={styles.wrapLeft} />
<View style={styles.wrapDate}>
<Image source={R.images.iconRecharge} style={styles.imgIcon} />
</View>
<Block padding={[5, 10]} space={'between'} flex={1}>
<View style={{justifyContent: 'center', flex: 1}}>
<Text numberOfLines={2} style={styles.txtBlack}>
{item.body}
</Text>
</View>
<Text style={styles.txt}>{item.pushed_at}</Text>
</Block>
</Block>
</View>
);
};
export default Item;
const styles = StyleSheet.create({
container: {
marginTop: 10,
paddingVertical: 10,
shadowColor: '#000',
shadowOffset: {
width: 0,
height: 2,
},
shadowOpacity: 0.25,
shadowRadius: 3.84,
elevation: 5,
marginHorizontal: 10,
backgroundColor: R.colors.white,
marginBottom: 10,
borderRadius: HEIGHTXD(30),
},
wrapLeft: {
width: WIDTHXD(16),
borderTopLeftRadius: HEIGHTXD(30),
borderBottomStartRadius: HEIGHTXD(30),
},
wrapDate: {
justifyContent: 'center',
paddingHorizontal: 10,
},
txtTitle: {
fontSize: getFontXD(42),
color: R.colors.black,
fontWeight: 'bold',
},
txt: {
fontSize: getFontXD(39),
color: '#929292',
fontStyle: 'italic',
},
rowBet: {
flexDirection: 'row',
justifyContent: 'space-between',
alignItems: 'center',
},
txtBlack: {
fontSize: getFontXD(42),
color: 'black',
},
imgIcon: {
width: WIDTHXD(178),
height: HEIGHTXD(178),
resizeMode: 'contain',
},
});
src/Screens/Transaction/PriceList/Item.js 0 → 100644
import React from 'react';
import {
View,
Text,
StyleSheet,
TouchableOpacity,
Image,
Alert,
} from 'react-native';
import {
getFontXD,
HEIGHTXD,
WIDTHXD,
toPriceVnd,
} from '../../../Config/Functions';
import R from '../../../assets/R';
import Block from '../../../components/Block';
const Item = (props) => {
const {item} = props;
return (
<View style={styles.container}>
<Block flex={1} row>
<View style={styles.wrapLeft} />
<View style={styles.wrapDate}>
<Image source={R.images.iconRecharge} style={styles.imgIcon} />
</View>
<Block padding={[5, 10]} space={'between'} flex={1}>
<View style={{justifyContent: 'center', flex: 1}}>
<Text numberOfLines={2} style={styles.txtBlack}>
{item.body}
</Text>
</View>
<Text style={styles.txt}>{item.pushed_at}</Text>
</Block>
</Block>
</View>
);
};
export default Item;
const styles = StyleSheet.create({
container: {
marginTop: 10,
paddingVertical: 10,
shadowColor: '#000',
shadowOffset: {
width: 0,
height: 2,
},
shadowOpacity: 0.25,
shadowRadius: 3.84,
elevation: 5,
marginHorizontal: 10,
backgroundColor: R.colors.white,
marginBottom: 10,
borderRadius: HEIGHTXD(30),
},
wrapLeft: {
width: WIDTHXD(16),
borderTopLeftRadius: HEIGHTXD(30),
borderBottomStartRadius: HEIGHTXD(30),
},
wrapDate: {
justifyContent: 'center',
paddingHorizontal: 10,
},
txtTitle: {
fontSize: getFontXD(42),
color: R.colors.black,
fontWeight: 'bold',
},
txt: {
fontSize: getFontXD(39),
color: '#929292',
fontStyle: 'italic',
},
rowBet: {
flexDirection: 'row',
justifyContent: 'space-between',
alignItems: 'center',
},
txtBlack: {
fontSize: getFontXD(42),
color: 'black',
},
imgIcon: {
width: WIDTHXD(178),
height: HEIGHTXD(178),
resizeMode: 'contain',
},
});
src/Screens/Transaction/PriceList/PriceList.js
import React, {Component} from 'react'; import React, {useState, useEffect} from 'react';
import {View, Text} from 'react-native'; import {getListNotification} from '../../../apis/Functions/users';
import PriceListView from './PriceListView';
import I18n from '../../../helper/i18/i18n';
const PriceList = (props) => {
const [selected, setSelected] = useState('');
const [page, setPage] = useState(1);
const [data, setData] = useState([]);
const [tottalPage, setTotalPage] = useState(1);
const [isRefresh, setisRefresh] = useState(false);
const [fillter, setFillters] = useState('ALL');
useEffect(() => {
getData();
}, [fillter]);
const getData = async () => {
setisRefresh(true);
setPage(1);
const res = await getListNotification({
keyword: '',
platform: Platform.OS,
page_size: 10,
page_index: 1,
type: fillter,
});
setisRefresh(false);
if ((res.data.code = 200 && res.data.data)) {
setData(res.data.data);
setTotalPage(res.data.meta.pages);
} else {
Alert.alert(I18n.t('Notification'), res.data.message);
}
};
const onRefresh = () => {
getData();
};
const onLoadMore = () => {
console.log(tottalPage);
if (page < tottalPage) getDataLoadMore();
};
const getDataLoadMore = async () => {
setisRefresh(true);
const res = await getListNotification({
keyword: '',
platform: Platform.OS,
page_size: 10,
page_index: 1,
type: fillter,
});
setPage(page + 1);
if (res.data.code == 200) {
setData(data.concat(res.data.data));
}
setisRefresh(false);
};
const PriceList = () => {
return ( return (
<View> <PriceListView
<Text>PriceList view</Text> onRefresh={onRefresh}
</View> isRefresh={isRefresh}
onLoadMore={onLoadMore}
setFillters={setFillters}
fillter={fillter}
data={data}
/>
); );
}; };
......
src/Screens/Transaction/PriceList/PriceListView.js 0 → 100644
import React, {useState} from 'react';
import {
View,
Text,
FlatList,
StyleSheet,
TouchableOpacity,
ScrollView,
} from 'react-native';
import HeaderDrawer from '../../../components/Header/HeaderDrawer';
import Item from './Item';
import {getFontXD} from '../../../Config/Functions';
import AppText from '../../../components/AppText';
const Fillters = [
{
id: '1',
name: 'All',
value: 'ALL',
},
{
id: '2',
name: 'Deposit',
value: 'DEPOSIT',
},
{
id: '3',
name: 'Withdraw',
value: 'WITHDRAW',
},
{
id: '4',
name: 'Transfer',
value: 'TRANSFER',
},
];
const NotificaitonView = (props) => {
const {onRefresh, isRefresh, onLoadMore, setFillters, fillter, data} = props;
return (
<View style={{flex: 1}}>
<View style={styles.headerContainer}>
<ScrollView horizontal showsHorizontalScrollIndicator={false}>
{Fillters.map((e) => (
<TouchableOpacity
key={e.value}
onPress={() => setFillters(e.value)}
style={[
styles.itemFillter,
fillter == e.value ? {borderColor: '#1473E6'} : null,
]}>
<AppText
i18nKey={e.name}
style={[
styles.txtFillter,
fillter == e.value ? {color: '#1473E6'} : {},
]}></AppText>
</TouchableOpacity>
))}
</ScrollView>
</View>
{data.length == 0 ? (
<View style={{justifyContent: 'center', alignItems: 'center', flex: 1}}>
<AppText
i18nKey={'NoData'}
style={{
fontSize: 18,
fontWeight: 'bold',
}}></AppText>
</View>
) : (
<FlatList
keyExtractor={(item) => item.id}
data={data}
refreshing={isRefresh}
onRefresh={onRefresh}
onEndReachedThreshold={0.01}
onEndReached={(info) => {
onLoadMore();
}}
renderItem={({item}) => <Item item={item} />}
/>
)}
</View>
);
};
const styles = StyleSheet.create({
headerContainer: {
paddingVertical: 10,
backgroundColor: 'white',
flexDirection: 'row',
alignItems: 'center',
paddingHorizontal: 10,
},
itemFillter: {
borderRadius: 10,
paddingVertical: 5,
paddingHorizontal: 10,
borderWidth: 1,
borderColor: '#929292',
justifyContent: 'center',
alignItems: 'center',
marginRight: 10,
},
txtFillter: {
fontSize: getFontXD(36),
color: '#929292',
fontWeight: 'bold',
},
txtTitle: {
fontSize: getFontXD(46),
fontWeight: 'bold',
},
});
export default NotificaitonView;
src/Screens/Transaction/TimeTransaction/Item.js 0 → 100644
import React from 'react';
import {
View,
Text,
StyleSheet,
TouchableOpacity,
Image,
Alert,
} from 'react-native';
import {
getFontXD,
HEIGHTXD,
WIDTHXD,
toPriceVnd,
} from '../../../Config/Functions';
import R from '../../../assets/R';
import Block from '../../../components/Block';
const Item = (props) => {
const {item} = props;
return (
<View style={styles.container}>
<Block flex={1} row>
<View style={styles.wrapLeft} />
<View style={styles.wrapDate}>
<Image source={R.images.iconRecharge} style={styles.imgIcon} />
</View>
<Block padding={[5, 10]} space={'between'} flex={1}>
<View style={{justifyContent: 'center', flex: 1}}>
<Text numberOfLines={2} style={styles.txtBlack}>
{item.body}
</Text>
</View>
<Text style={styles.txt}>{item.pushed_at}</Text>
</Block>
</Block>
</View>
);
};
export default Item;
const styles = StyleSheet.create({
container: {
marginTop: 10,
paddingVertical: 10,
shadowColor: '#000',
shadowOffset: {
width: 0,
height: 2,
},
shadowOpacity: 0.25,
shadowRadius: 3.84,
elevation: 5,
marginHorizontal: 10,
backgroundColor: R.colors.white,
marginBottom: 10,
borderRadius: HEIGHTXD(30),
},
wrapLeft: {
width: WIDTHXD(16),
borderTopLeftRadius: HEIGHTXD(30),
borderBottomStartRadius: HEIGHTXD(30),
},
wrapDate: {
justifyContent: 'center',
paddingHorizontal: 10,
},
txtTitle: {
fontSize: getFontXD(42),
color: R.colors.black,
fontWeight: 'bold',
},
txt: {
fontSize: getFontXD(39),
color: '#929292',
fontStyle: 'italic',
},
rowBet: {
flexDirection: 'row',
justifyContent: 'space-between',
alignItems: 'center',
},
txtBlack: {
fontSize: getFontXD(42),
color: 'black',
},
imgIcon: {
width: WIDTHXD(178),
height: HEIGHTXD(178),
resizeMode: 'contain',
},
});
src/Screens/Transaction/TimeTransaction/TimeTransaction.js
import React, {Component} from 'react'; import React, {useState, useEffect} from 'react';
import {View, Text} from 'react-native'; import {getListNotification} from '../../../apis/Functions/users';
import TimeTransactionView from './TimeTransactionView';
import I18n from '../../../helper/i18/i18n';
const PriceList = (props) => {
const [selected, setSelected] = useState('');
const [page, setPage] = useState(1);
const [data, setData] = useState([]);
const [tottalPage, setTotalPage] = useState(1);
const [isRefresh, setisRefresh] = useState(false);
const [fillter, setFillters] = useState('ALL');
useEffect(() => {
getData();
}, [fillter]);
const getData = async () => {
setisRefresh(true);
setPage(1);
const res = await getListNotification({
keyword: '',
platform: Platform.OS,
page_size: 10,
page_index: 1,
type: fillter,
});
setisRefresh(false);
if ((res.data.code = 200 && res.data.data)) {
setData(res.data.data);
setTotalPage(res.data.meta.pages);
} else {
Alert.alert(I18n.t('Notification'), res.data.message);
}
};
const onRefresh = () => {
getData();
};
const onLoadMore = () => {
console.log(tottalPage);
if (page < tottalPage) getDataLoadMore();
};
const getDataLoadMore = async () => {
setisRefresh(true);
const res = await getListNotification({
keyword: '',
platform: Platform.OS,
page_size: 10,
page_index: 1,
type: fillter,
});
setPage(page + 1);
if (res.data.code == 200) {
setData(data.concat(res.data.data));
}
setisRefresh(false);
};
const TimeTransaction = () => {
return ( return (
<View> <TimeTransactionView
<Text>TimeTransaction view</Text> onRefresh={onRefresh}
</View> isRefresh={isRefresh}
onLoadMore={onLoadMore}
setFillters={setFillters}
fillter={fillter}
data={data}
/>
); );
}; };
export default TimeTransaction; export default PriceList;
src/Screens/Transaction/TimeTransaction/TimeTransactionView.js 0 → 100644
import React, {useState} from 'react';
import {
View,
Text,
FlatList,
StyleSheet,
TouchableOpacity,
ScrollView,
} from 'react-native';
import HeaderDrawer from '../../../components/Header/HeaderDrawer';
import Item from './Item';
import {getFontXD} from '../../../Config/Functions';
import AppText from '../../../components/AppText';
const Fillters = [
{
id: '1',
name: 'All',
value: 'ALL',
},
{
id: '2',
name: 'Deposit',
value: 'DEPOSIT',
},
{
id: '3',
name: 'Withdraw',
value: 'WITHDRAW',
},
{
id: '4',
name: 'Transfer',
value: 'TRANSFER',
},
];
const NotificaitonView = (props) => {
const {onRefresh, isRefresh, onLoadMore, setFillters, fillter, data} = props;
return (
<View style={{flex: 1}}>
<View style={styles.headerContainer}>
<ScrollView horizontal showsHorizontalScrollIndicator={false}>
{Fillters.map((e) => (
<TouchableOpacity
key={e.value}
onPress={() => setFillters(e.value)}
style={[
styles.itemFillter,
fillter == e.value ? {borderColor: '#1473E6'} : null,
]}>
<AppText
i18nKey={e.name}
style={[
styles.txtFillter,
fillter == e.value ? {color: '#1473E6'} : {},
]}></AppText>
</TouchableOpacity>
))}
</ScrollView>
</View>
{data.length == 0 ? (
<View style={{justifyContent: 'center', alignItems: 'center', flex: 1}}>
<AppText
i18nKey={'NoData'}
style={{
fontSize: 18,
fontWeight: 'bold',
}}></AppText>
</View>
) : (
<FlatList
keyExtractor={(item) => item.id}
data={data}
refreshing={isRefresh}
onRefresh={onRefresh}
onEndReachedThreshold={0.01}
onEndReached={(info) => {
onLoadMore();
}}
renderItem={({item}) => <Item item={item} />}
/>
)}
</View>
);
};
const styles = StyleSheet.create({
headerContainer: {
paddingVertical: 10,
backgroundColor: 'white',
flexDirection: 'row',
alignItems: 'center',
paddingHorizontal: 10,
},
itemFillter: {
borderRadius: 10,
paddingVertical: 5,
paddingHorizontal: 10,
borderWidth: 1,
borderColor: '#929292',
justifyContent: 'center',
alignItems: 'center',
marginRight: 10,
},
txtFillter: {
fontSize: getFontXD(36),
color: '#929292',
fontWeight: 'bold',
},
txtTitle: {
fontSize: getFontXD(46),
fontWeight: 'bold',
},
});
export default NotificaitonView;
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment