Skip to content

I
InvestCustomer
Commit e19d8011 by Giang Tran
Options

update code

parent f2ad7a77
Showing with 485 additions and 53 deletions
src/Screens/Menu/MyGroup/DetailPartner.js
import React, {Component} from 'react';
import {View, Text, Image, StyleSheet} from 'react-native';
import HeaderBack from '../../../components/Header/HeaderBack';
import R from '../../../assets/R';
import AppText from '../../../components/AppText';
import {getFontXD} from '../../../Config/Functions';
const DetailPartner = (props) => {
const {
fullname,
picture_url,
cqg_status_name,
status_name,
created,
email,
} = props.route.params.data;
return (
<View style={{flex: 1}}>
<HeaderBack title={'Detail'} />
<View style={{flex: 1}}>
<View style={styles.containerTop}>
<Image style={styles.img} source={{uri: picture_url}} />
</View>
<View style={styles.row}>
<View style={styles.wrapLeft}>
<AppText style={styles.txtTitle} i18nKey={'Fullname'} />
</View>
<View style={styles.wrapRight}>
<Text style={{fontSize: getFontXD(42)}}>{fullname}</Text>
</View>
</View>
<View style={styles.row}>
<View style={styles.wrapLeft}>
<AppText style={styles.txtTitle} i18nKey={'level'} />
</View>
<View style={styles.wrapRight}>
<Text style={{fontSize: getFontXD(42)}}>{fullname}</Text>
</View>
</View>
<View style={styles.row}>
<View style={styles.wrapLeft}>
<AppText style={styles.txtTitle} i18nKey={'Sponsor'} />
</View>
<View style={styles.wrapRight}>
<Text style={{fontSize: getFontXD(42)}}>{fullname}</Text>
</View>
</View>
<View style={styles.row}>
<View style={styles.wrapLeft}>
<AppText style={styles.txtTitle} i18nKey={'Email'} />
</View>
<View style={styles.wrapRight}>
<Text style={{fontSize: getFontXD(42)}}>{email}</Text>
</View>
</View>
<View style={styles.row}>
<View style={styles.wrapLeft}>
<AppText style={styles.txtTitle} i18nKey={'Status'} />
</View>
<View style={styles.wrapRight}>
<Text style={{fontSize: getFontXD(42)}}>{status_name}</Text>
</View>
</View>
<View style={styles.row}>
<View style={styles.wrapLeft}>
<AppText style={styles.txtTitle} i18nKey={'DateJoin'} />
</View>
<View style={styles.wrapRight}>
<Text style={{fontSize: getFontXD(42)}}>{created}</Text>
</View>
</View>
<View style={styles.row}>
<View style={styles.wrapLeft}>
<AppText style={styles.txtTitle} i18nKey={'OpenAccountExchange'} />
</View>
<View style={styles.wrapRight}>
<Text style={{fontSize: getFontXD(42)}}>{cqg_status_name}</Text>
</View>
</View>
<View style={styles.row}>
<View style={styles.wrapLeft}>
<AppText style={styles.txtTitle} i18nKey={'CountSponsors'} />
</View>
<View style={styles.wrapRight}>
<Text style={{fontSize: getFontXD(42)}}>{fullname}</Text>
</View>
</View>
<View style={styles.row}>
<View style={styles.wrapLeft}>
<AppText style={styles.txtTitle} i18nKey={'TotalCommission'} />
</View>
<View style={styles.wrapRight}>
<Text style={{fontSize: getFontXD(42)}}>{fullname}</Text>
</View>
</View>
</View>
</View>
);
};
const styles = StyleSheet.create({
container: {
backgroundColor: R.colors.white,
padding: 10,
marginTop: 10,
marginHorizontal: 10,
borderRadius: 5,
shadowColor: '#000',
shadowOffset: {
width: 0,
height: 1,
},
shadowOpacity: 0.15,
shadowRadius: 1.84,
elevation: 2,
flexDirection: 'row',
alignItems: 'center',
},
img: {
width: 80,
height: 80,
borderRadius: 45,
borderWidth: 0.4,
borderColor: R.colors.main,
},
wrapLeft: {
flex: 1,
justifyContent: 'center',
marginRight: 5,
},
wrapRight: {
flex: 1,
justifyContent: 'center',
marginLeft: 5,
},
txtTitle: {
fontSize: getFontXD(42),
color: R.colors.color777,
marginRight: 5,
},
txtName: {
fontSize: getFontXD(46),
color: R.colors.black,
},
containerTop: {
alignItems: 'center',
marginVertical: 10,
},
row: {
flexDirection: 'row',
marginHorizontal: 10,
marginTop: 5,
},
});
export default DetailPartner;
src/Screens/Menu/MyGroup/Item.js 0 → 100644
import React, {Component} from 'react';
import {View, Text, StyleSheet, Image, TouchableOpacity} from 'react-native';
import R from '../../../assets/R';
import AppText from '../../../components/AppText';
import {getFontXD} from '../../../Config/Functions';
import {useNavigation} from '@react-navigation/native';
import {DETAILPARTNER} from '../../../routers/ScreenNames';
const Item = (props) => {
const {
fullname,
picture_url,
cqg_status_name,
status_name,
created,
} = props.item;
const navigation = useNavigation();
return (
<TouchableOpacity
onPress={() => navigation.navigate(DETAILPARTNER, {data: props.item})}
style={[styles.container, props.isEnd ? {marginBottom: 10} : {}]}>
<Image source={{uri: picture_url}} style={styles.img} />
<View style={styles.wrapRight}>
<Text style={styles.txtName}>{fullname}</Text>
<View style={{flexDirection: 'row', alignItems: 'center'}}>
<AppText style={styles.txtTitle} i18nKey={'Status'} />
<Text style={{fontSize: getFontXD(42)}}>{status_name}</Text>
</View>
<View style={{flexDirection: 'row', alignItems: 'center'}}>
<AppText style={styles.txtTitle} i18nKey={'DateJoin'} />
<Text style={{fontSize: getFontXD(42)}}>{created}</Text>
</View>
<View style={{flexDirection: 'row', alignItems: 'center'}}>
<AppText style={styles.txtTitle} i18nKey={'OpenAccountExchange'} />
<Text style={{fontSize: getFontXD(42)}}>{cqg_status_name}</Text>
</View>
</View>
</TouchableOpacity>
);
};
export default Item;
const styles = StyleSheet.create({
container: {
backgroundColor: R.colors.white,
padding: 10,
marginTop: 10,
marginHorizontal: 10,
borderRadius: 5,
shadowColor: '#000',
shadowOffset: {
width: 0,
height: 1,
},
shadowOpacity: 0.15,
shadowRadius: 1.84,
elevation: 2,
flexDirection: 'row',
alignItems: 'center',
},
img: {
width: 80,
height: 80,
borderRadius: 45,
borderWidth: 0.4,
borderColor: R.colors.main,
},
wrapRight: {
marginLeft: 5,
flex: 1,
height: 80,
justifyContent: 'space-between',
},
txtTitle: {
fontSize: getFontXD(42),
color: R.colors.color777,
marginRight: 5,
},
txtName: {
fontSize: getFontXD(46),
color: R.colors.black,
},
});
src/Screens/Menu/MyGroup/MyGroup.js
......@@ -12,17 +12,20 @@ import SearchModal from './SearchModal';
const ListTabs = [
{
type: 'level1',
value: 1,
},
{
type: 'level2',
value: 2,
},
{
type: 'level3',
value: 3,
},
];
const MyGroup = (props) => {
const [isModalVisible, setModalVisible] = useState(true);
const [isModalVisible, setModalVisible] = useState(false);
const toggleModal = () => {
setModalVisible(!isModalVisible);
};
......@@ -47,7 +50,7 @@ const MyGroup = (props) => {
{ListTabs.map((e) => (
<Tab.Screen
name={e.type}
children={() => <Level1 type={e.type} />}
children={() => <Level1 type={e.value} />}
options={{tabBarLabel: I18n.t(e.type)}}
/>
))}
......
src/Screens/Menu/MyGroup/SearchModal.js
......@@ -26,50 +26,49 @@ import {SEARCHPARTNER} from '../../../routers/ScreenNames';
import {showAlert, TYPE} from '../../../components/DropdownAlert';
import {useNavigation} from '@react-navigation/native';
import TextField from '../../../components/Input/TextField';
import {connect} from 'react-redux';
import IconClose from 'react-native-vector-icons/AntDesign';
const {width} = Dimensions.get('window');
const ListLevels = [
{
value: 'all',
name: I18n.t('All'),
},
{
value: 'level1',
name: I18n.t('level1'),
},
{
value: 'level2',
name: I18n.t('level2'),
},
{
value: 'level3',
name: I18n.t('level3'),
},
];
const ListStatus = [
{
value: 'all',
name: I18n.t('All'),
},
{
value: 'Open',
name: I18n.t('Opened'),
},
{
value: 'Unopen',
name: I18n.t('Unopen'),
},
];
const SearchProductCodeModal = (props) => {
const ListLevels = [
{
value: '-1',
name: I18n.t('All'),
},
{
value: '1',
name: I18n.t('level1'),
},
{
value: '2',
name: I18n.t('level2'),
},
{
value: '3',
name: I18n.t('level3'),
},
];
const ListStatus = [
{
value: '-1',
name: I18n.t('All'),
},
{
value: '1',
name: I18n.t('Opened'),
},
{
value: '0',
name: I18n.t('Unopen'),
},
];
const navigate = useNavigation();
const [textSearch, setTextSearch] = useState('');
const [level, setLevel] = useState(null);
const [open, setOpen] = useState(new Date());
const [level, setLevel] = useState(ListLevels[0]);
const [open, setOpen] = useState(ListStatus[0]);
return (
<Modal
......@@ -119,6 +118,7 @@ const SearchProductCodeModal = (props) => {
i18nKey={'level'}
/>
<PickerItem
defaultValue={level.name}
width={width - 40}
data={ListLevels}
onValueChange={(value, items) => {
......@@ -131,6 +131,7 @@ const SearchProductCodeModal = (props) => {
i18nKey={'OpenAccountCQG'}
/>
<PickerItem
defaultValue={open.name}
width={width - 40}
data={ListStatus}
onValueChange={(value, items) => {
......@@ -146,9 +147,13 @@ const SearchProductCodeModal = (props) => {
}}>
<TouchableOpacity
onPress={() => {
console.log(level, open, textSearch);
props.toggleModal();
navigate.navigate(SEARCHPARTNER);
console.log(open);
navigate.navigate(SEARCHPARTNER, {
keyword: textSearch,
level: level.value,
trader_account_status: open.value,
});
}}
style={styles.btnSend}>
<Text style={styles.txtSend}>{I18n.t('Search')}</Text>
......@@ -235,4 +240,10 @@ const styles = StyleSheet.create({
},
});
export default SearchProductCodeModal;
const mapStateToProps = (state) => {
return {
language: state.languageReducer,
};
};
export default connect(mapStateToProps, {})(SearchProductCodeModal);
src/Screens/Menu/MyGroup/SearchPartner.js
import React, {Component} from 'react';
import {View, Text} from 'react-native';
import React, {Component, useState, useEffect} from 'react';
import {View, Text, FlatList} from 'react-native';
import Item from './Item';
import {getListPartner} from '../../../apis/Functions/users';
import HeaderBack from '../../../components/Header/HeaderBack';
import {showAlert, TYPE} from '../../../components/DropdownAlert';
import I18n from '../../../helper/i18/i18n';
const Level1 = (props) => {
const [page, setPage] = useState(1);
const [data, setData] = useState([]);
const [tottalPage, setTotalPage] = useState(1);
const [isRefresh, setisRefresh] = useState(false);
console.log(props.route.params);
const {trader_account_status, level, keyword} = props.route.params;
useEffect(() => {
getData();
}, []);
const getData = async () => {
setisRefresh(true);
setPage(1);
const res = await getListPartner({
keyword,
level,
trader_account_status,
platform: Platform.OS,
page_size: 10,
page_index: 1,
});
if ((res.data.code = 200 && res.data.data)) {
setData(res.data.data);
setTotalPage(res.data.meta.pages);
} else {
showAlert(TYPE.ERROR, I18n.t('Notification'), res.data.message);
}
setisRefresh(false);
};
const onRefresh = () => {
getData();
};
const onLoadMore = () => {
if (page < tottalPage) getDataLoadMore();
};
const getDataLoadMore = async () => {
setisRefresh(true);
const res = await getListPartner({
keyword: '',
level: 1,
platform: Platform.OS,
page_size: 10,
page_index: page + 1,
});
setPage(page + 1);
if (res.data.code == 200) {
setData(data.concat(res.data.data));
}
setisRefresh(false);
};
const SearchPartner = (props) => {
return (
<View style={{flex: 1}}>
<HeaderBack title="SearchPartner" />
<Text>List partner</Text>
<FlatList
data={data}
showsVerticalScrollIndicator={false}
keyExtractor={(item) => item.id}
refreshing={isRefresh}
onRefresh={() => onRefresh()}
onEndReachedThreshold={0.01}
onEndReached={(info) => {
onLoadMore();
}}
renderItem={({item, index}) => (
<Item isEnd={data.length - 1 == index ? true : false} item={item} />
)}
/>
</View>
);
};
export default SearchPartner;
export default Level1;
src/Screens/Menu/MyGroup/Tabs/Level1.js
import React, {Component} from 'react';
import {View, Text} from 'react-native';
import React, {Component, useState, useEffect} from 'react';
import {View, Text, FlatList} from 'react-native';
import Item from '../Item';
import {getListPartner} from '../../../../apis/Functions/users';
import {showAlert, TYPE} from '../../../../components/DropdownAlert';
const Level1 = (props) => {
const [page, setPage] = useState(1);
const [data, setData] = useState([]);
const [tottalPage, setTotalPage] = useState(1);
const [isRefresh, setisRefresh] = useState(false);
useEffect(() => {
getData();
}, []);
const getData = async () => {
setisRefresh(true);
setPage(1);
const res = await getListPartner({
keyword: '',
level: props.type,
platform: Platform.OS,
page_size: 10,
page_index: 1,
});
if ((res.data.code = 200 && res.data.data)) {
setData(res.data.data);
setTotalPage(res.data.meta.pages);
} else {
showAlert(TYPE.ERROR, I18n.t('Notification'), res.data.message);
}
setisRefresh(false);
};
const onRefresh = () => {
getData();
};
const onLoadMore = () => {
if (page < tottalPage) getDataLoadMore();
};
const getDataLoadMore = async () => {
setisRefresh(true);
const res = await getListPartner({
keyword: '',
level: props.type,
platform: Platform.OS,
page_size: 10,
page_index: page + 1,
});
setPage(page + 1);
if (res.data.code == 200) {
setData(data.concat(res.data.data));
}
setisRefresh(false);
};
return (
<View>
<Text>{props.type}</Text>
<View style={{flex: 1}}>
<FlatList
data={data}
showsVerticalScrollIndicator={false}
keyExtractor={(item) => item.id}
refreshing={isRefresh}
onRefresh={() => onRefresh()}
onEndReachedThreshold={0.01}
onEndReached={(info) => {
onLoadMore();
}}
renderItem={({item, index}) => (
<Item isEnd={data.length - 1 == index ? true : false} item={item} />
)}
/>
</View>
);
};
......
src/apis/Functions/users.js
......@@ -96,3 +96,8 @@ export const verifyPassword = async (body) =>
PostData(url.urlVerifyPassword, body)
.then((res) => res)
.catch((err) => err);
export const getListPartner = async (body) =>
GetData(url.urlGetListPartner, body)
.then((res) => res)
.catch((err) => err);
src/apis/url.js
......@@ -70,4 +70,5 @@ export default {
urlStoreOTPSmart: root + 'api/v1/customers/store-otp-password',
urlVerufySmartOTP: root + 'api/v1/customers/verify-otp-password',
urlVerifyPassword: `${root}api/auth/customer-verify-password`,
urlGetListPartner: root + 'api/v1/customers/my-partner',
};
src/helper/i18/locales/en.js
......@@ -58,7 +58,7 @@ export default {
Fullname: 'Full name',
Birth: 'Birth',
Male: 'Male',
Status: 'Status',
Status: 'Status:',
Phone: 'Phone',
Enter_Phone: 'Enter phone',
Address: 'Address:',
......@@ -347,4 +347,9 @@ export default {
NamePartner: 'Name partner',
Opened: 'Opened',
Unopen: 'Unopene',
OpenAccountExchange: 'Open account exchange:',
DateJoin: 'Date join:',
Sponsor: 'Sponsor',
CountSponsors: 'Count sponsors',
TotalCommission: 'Total commission',
};
src/helper/i18/locales/vn.js
......@@ -62,7 +62,7 @@ export default {
Fullname: 'Họ và tên',
Birth: 'Ngày sinh',
Male: 'Giới tính',
Status: 'Trạng thái',
Status: 'Trạng thái:',
Phone: 'Điện thoại',
Address: 'Địa chỉ:',
Update: 'Cập nhật',
......@@ -345,4 +345,9 @@ export default {
NamePartner: 'Tên đối tác',
Opened: 'Đã mở',
Unopen: 'Chưa mở',
OpenAccountExchange: 'Mở tài khoản giao dịch:',
DateJoin: 'Ngày tham gia:',
Sponsor: 'Người giới thiệu',
CountSponsors: 'Số người giới thiệu',
TotalCommission: 'Tổng tiền hoa hồng',
};
src/routers/ScreenNames.js
......@@ -96,3 +96,4 @@ export const FAQSSMARTOTP = 'FAQSSMARTOTP';
export const CONFIRMCREATEOTP = 'CONFIRMCREATEOTP';
export const SEARCHPARTNER = 'SEARCHPARTNER';
export const DETAILPARTNER = 'DETAILPARTNER';
src/routers/StackNavigation.js
......@@ -70,6 +70,8 @@ import RulesSmartOTP from '../Screens/SmartOTP/WebView/RulesSmartOTP';
import ConfirmCreate from '../Screens/SmartOTP/ConfirmCreate/ConfirmCreate';
import SearchPartner from '../Screens/Menu/MyGroup/SearchPartner';
import DetailPartner from '../Screens/Menu/MyGroup/DetailPartner';
import * as ScreenName from './ScreenNames';
const Stack = createStackNavigator();
......@@ -211,6 +213,7 @@ function MyStack(props) {
/>
<Stack.Screen name={ScreenName.SEARCHPARTNER} component={SearchPartner} />
<Stack.Screen name={ScreenName.DETAILPARTNER} component={DetailPartner} />
</Stack.Navigator>
);
}
......
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