update search partner

src/Screens/Menu/MyGroup/Item.js

@@ -27,22 +27,22 @@ const Item = (props) => {
         <Text style={styles.txtName}>{fullname}</Text>
         <View style={styles.row}>
           <AppText style={styles.txtTitle} i18nKey={'Status'} />
-          <Text style={{fontSize: getFontXD(42)}}>{status_name}</Text>
+          <Text style={{fontSize: getFontXD(36)}}>{status_name}</Text>
         </View>
 
         <View style={styles.row}>
           <AppText style={styles.txtTitle} i18nKey={'DateJoin'} />
-          <Text style={{fontSize: getFontXD(42)}}>{created}</Text>
+          <Text style={{fontSize: getFontXD(36)}}>{created}</Text>
         </View>
 
         <View style={styles.row}>
           <AppText style={styles.txtTitle} i18nKey={'OpenAccountExchange'} />
-          <Text style={{fontSize: getFontXD(42)}}>{cqg_status_name}</Text>
+          <Text style={{fontSize: getFontXD(36)}}>{cqg_status_name}</Text>
         </View>
         {props.level == 1 ? null : (
           <View style={styles.row}>
             <AppText style={styles.txtTitle} i18nKey={'Sponsor'} />
-            <Text style={{fontSize: getFontXD(42)}}>{sponsor_name}</Text>
+            <Text style={{fontSize: getFontXD(36)}}>{sponsor_name}</Text>
           </View>
         )}
       </View>
@@ -82,12 +82,12 @@ const styles = StyleSheet.create({
     flex: 1,
   },
   txtTitle: {
-    fontSize: getFontXD(42),
+    fontSize: getFontXD(36),
     color: R.colors.color777,
     marginRight: 5,
   },
   txtName: {
-    fontSize: getFontXD(46),
+    fontSize: getFontXD(42),
     color: R.colors.black,
     textTransform: 'uppercase',
   },

src/Screens/Menu/MyGroup/SearchModal2.js

+import React, {useEffect, useState} from 'react';
+import {
+  View,
+  Text,
+  Image,
+  StyleSheet,
+  TouchableOpacity,
+  TouchableWithoutFeedback,
+  Platform,
+  DeviceEventEmitter,
+  Dimensions,
+} from 'react-native';
+import R from '../../../assets/R';
+
+import {
+  HEIGHTXD,
+  WIDTHXD,
+  getFontXD,
+  getWidth,
+} from '../../../Config/Functions';
+import Modal from 'react-native-modal';
+import I18n from '../.././../helper/i18/i18n';
+import AppText from '../../../components/AppText';
+import PickerItem from '../../../components/Picker/PickerItem';
+import PickerMonth from '../../../components/Picker/PickerMonth';
+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 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(props.keyword);
+  const [level, setLevel] = useState(ListLevels[0]);
+  const [open, setOpen] = useState(ListStatus[0]);
+
+  return (
+    <Modal
+      isVisible={props.isModalVisible}
+      style={{margin: 0, justifyContent: 'flex-end'}}>
+      <View style={{flex: 1, justifyContent: 'flex-end'}}>
+        <TouchableOpacity
+          style={styles.opacity}
+          activeOpacity={1}
+          onPressOut={() => {
+            props.toggleModal();
+          }}>
+          <TouchableWithoutFeedback>
+            <View style={styles.container}>
+              <View style={styles.viewTitle}>
+                <Text
+                  style={[
+                    styles.txt,
+                    {
+                      color: R.colors.black,
+                      textAlign: 'center',
+                      flex: 10,
+                    },
+                  ]}>
+                  {I18n.t('SearchProductCode')}
+                </Text>
+                <TouchableOpacity
+                  onPress={() => {
+                    props.toggleModal();
+                  }}
+                  style={styles.btClose}>
+                  <IconClose
+                    name="close"
+                    size={WIDTHXD(48)}
+                    color={R.colors.black}
+                  />
+                </TouchableOpacity>
+              </View>
+
+              <TextField
+                onChangeText={(val) => setTextSearch(val)}
+                title={I18n.t('NamePartner')}
+                value={textSearch}
+              />
+
+              <AppText
+                style={[styles.txtTitle, {marginTop: HEIGHTXD(40)}]}
+                i18nKey={'level'}
+              />
+              <PickerItem
+                defaultValue={level.name}
+                width={width - 40}
+                data={ListLevels}
+                onValueChange={(value, items) => {
+                  setLevel(items);
+                }}
+              />
+
+              <AppText
+                style={[styles.txtTitle, {marginTop: HEIGHTXD(40)}]}
+                i18nKey={'OpenAccountCQG'}
+              />
+              <PickerItem
+                defaultValue={open.name}
+                width={width - 40}
+                data={ListStatus}
+                onValueChange={(value, items) => {
+                  setOpen(items);
+                }}
+              />
+
+              <View
+                style={{
+                  marginTop: HEIGHTXD(80),
+                  justifyContent: 'center',
+                  alignItems: 'center',
+                }}>
+                <TouchableOpacity
+                  onPress={() => {
+                    props.toggleModal();
+                    props.setKeyword(textSearch);
+                    props.setLevel(level.value);
+                    props.setTrader_account_status(open.value);
+                  }}
+                  style={styles.btnSend}>
+                  <Text style={styles.txtSend}>{I18n.t('Search')}</Text>
+                </TouchableOpacity>
+              </View>
+            </View>
+          </TouchableWithoutFeedback>
+        </TouchableOpacity>
+      </View>
+    </Modal>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    backgroundColor: R.colors.white,
+    borderRadius: 10,
+    borderWidth: 2,
+    borderColor: '#DBDBDB',
+    paddingTop: HEIGHTXD(50),
+    paddingBottom: HEIGHTXD(300),
+    paddingHorizontal: WIDTHXD(40),
+  },
+  viewTitle: {
+    flexDirection: 'row',
+    width: getWidth() - WIDTHXD(40),
+    marginLeft: WIDTHXD(40),
+  },
+  btClose: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'flex-start',
+    marginRight: WIDTHXD(40),
+  },
+  txt: {
+    fontSize: getFontXD(42),
+    color: R.colors.color777,
+    marginBottom: 5,
+    paddingLeft: 10,
+  },
+  txtTitle: {
+    fontSize: getFontXD(42),
+    color: R.colors.color777,
+  },
+  selectionImg: {
+    padding: 10,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  containerSelect: {
+    height: HEIGHTXD(520),
+    backgroundColor: 'white',
+    paddingTop: 10,
+    borderTopLeftRadius: 20,
+    borderTopRightRadius: 20,
+  },
+  line: {
+    height: 1,
+    backgroundColor: '#929292',
+    width: '100%',
+    marginTop: 5,
+  },
+  imgIcon: {
+    width: 40,
+    height: 40,
+  },
+  txtTitleBtn: {
+    fontSize: getFontXD(42),
+    color: '#1473E6',
+  },
+  btnSend: {
+    width: WIDTHXD(500),
+    height: HEIGHTXD(120),
+    backgroundColor: R.colors.main,
+    borderRadius: 8,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  txtSend: {
+    fontSize: getFontXD(42),
+    color: R.colors.white,
+    paddingHorizontal: WIDTHXD(60),
+    fontWeight: 'bold',
+  },
+});
+
+const mapStateToProps = (state) => {
+  return {
+    language: state.languageReducer,
+  };
+};
+
+export default connect(mapStateToProps, {})(SearchProductCodeModal);

src/Screens/Menu/MyGroup/SearchPartner.js

@@ -2,21 +2,32 @@ 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 HeaderPartner from '../../../components/Header/HeaderPartner';
 import {showAlert, TYPE} from '../../../components/DropdownAlert';
 import AppText from '../../../components/AppText';
 import I18n from '../../../helper/i18/i18n';
+import SearchModal from './SearchModal2';
+
 const Level1 = (props) => {
   const [page, setPage] = useState(1);
   const [data, setData] = useState([]);
   const [tottalPage, setTotalPage] = useState(1);
   const [isRefresh, setisRefresh] = useState(false);
+  const [isModalVisible, setModalVisible] = useState(false);
 
-  const {trader_account_status, level, keyword} = props.route.params;
+  const [trader_account_status, setTrader_account_status] = useState(
+    props.route.params.trader_account_status,
+  );
+  const [level, setLevel] = useState(props.route.params.level);
+  const [keyword, setKeyword] = useState(props.route.params.keyword);
+
+  const toggleModal = () => {
+    setModalVisible(!isModalVisible);
+  };
 
   useEffect(() => {
     getData();
-  }, []);
+  }, [level, trader_account_status, keyword]);
 
   const getData = async () => {
     setisRefresh(true);
@@ -34,7 +45,7 @@ const Level1 = (props) => {
       setData(res.data.data);
       setTotalPage(res.data.meta.pages);
     } else {
-      showAlert(TYPE.ERROR, I18n.t('Notification'), res.data.message);
+      setData([]);
     }
     setisRefresh(false);
   };
@@ -66,7 +77,11 @@ const Level1 = (props) => {
 
   return (
     <View style={{flex: 1}}>
-      <HeaderBack title="SearchPartner" />
+      <HeaderPartner
+        onOpenSearch={toggleModal}
+        title={'MyPartner'}
+        isWhite={true}
+      />
 
       {data.length > 0 ? (
         <FlatList
@@ -93,6 +108,15 @@ const Level1 = (props) => {
             }}></AppText>
         </View>
       )}
+
+      <SearchModal
+        setKeyword={setKeyword}
+        keyword={keyword}
+        setLevel={setLevel}
+        setTrader_account_status={setTrader_account_status}
+        toggleModal={toggleModal}
+        isModalVisible={isModalVisible}
+      />
     </View>
   );
 };

src/Screens/Menu/MyGroup/Tabs/Level1.js

@@ -3,6 +3,8 @@ import {View, Text, FlatList} from 'react-native';
 import Item from '../Item';
 import {getListPartner} from '../../../../apis/Functions/users';
 import {showAlert, TYPE} from '../../../../components/DropdownAlert';
+import AppText from '../../../../components/AppText';
+import I18n from '../../../../helper/i18/i18n';
 
 const Level1 = (props) => {
   const [page, setPage] = useState(1);
@@ -26,11 +28,11 @@ const Level1 = (props) => {
       trader_account_status: -1,
     });
 
-    if ((res.data.code = 200 && res.data.data)) {
+    if ((res.data.code = 200 && res.data.data && res.data.data.length > 0)) {
       setData(res.data.data);
       setTotalPage(res.data.meta.pages);
     } else {
-      showAlert(TYPE.ERROR, I18n.t('Notification'), res.data.message);
+      setData([]);
     }
     setisRefresh(false);
   };
@@ -45,7 +47,7 @@ const Level1 = (props) => {
 
   const getDataLoadMore = async () => {
     setisRefresh(true);
-    console.log('Chay vao day');
+
     const res = await getListPartner({
       keyword: '',
       level: props.type,
@@ -57,7 +59,7 @@ const Level1 = (props) => {
     setPage(page + 1);
 
     console.log('rress', res);
-    if (res.data.code == 200) {
+    if (res.data.code == 200 && res.data.data && res.data.data.length > 0) {
       setData(data.concat(res.data.data));
     }
     setisRefresh(false);

src/helper/i18/locales/vn.js

@@ -64,7 +64,7 @@ export default {
   Male: 'Giới tính',
   Status: 'Trạng thái:',
   Phone: 'Điện thoại',
-  Address: 'Địa chỉ:',
+  Address: 'Địa chỉ',
   Update: 'Cập nhật',
   ContactCode: 'Mã hợp đồng',
   TraddingAccountName: 'Tên tài khoản giao dịch',