update code

App.js

@@ -19,66 +19,20 @@ let store = createStore(rootReducer, applyMiddleware(sagaMiddleware));
 sagaMiddleware.run(rootSaga);
 
 let App = () => {
-  let [bootSplashIsVisible, setBootSplashIsVisible] = useState(true);
-  let [bootSplashLogoIsLoaded, setBootSplashLogoIsLoaded] = useState(false);
-  let opacity = useRef(new Animated.Value(1));
-  let translateY = useRef(new Animated.Value(0));
-
   let init = async () => {
-    // You can uncomment this line to add a delay on app startup
     await fakeApiCallWithoutBadNetwork(1000);
     await BootSplash.hide();
-
-    Animated.stagger(250, [
-      Animated.spring(translateY.current, {
-        useNativeDriver: true,
-        toValue: -50,
-      }),
-      Animated.spring(translateY.current, {
-        useNativeDriver: true,
-        toValue: Dimensions.get('window').height,
-      }),
-    ]).start();
-
-    Animated.timing(opacity.current, {
-      useNativeDriver: true,
-      toValue: 0,
-      duration: 150,
-      delay: 350,
-    }).start(() => {
-      setBootSplashIsVisible(false);
-    });
   };
 
   useEffect(() => {
-    bootSplashLogoIsLoaded && init();
-  }, [bootSplashLogoIsLoaded]);
+    init();
+  }, []);
 
   return (
     <View style={styles.container}>
       <Provider store={store}>
         <RootView />
       </Provider>
-
-      {bootSplashIsVisible && (
-        <Animated.View
-          style={[
-            StyleSheet.absoluteFill,
-            styles.bootsplash,
-            {opacity: opacity.current},
-          ]}>
-          <Animated.Image
-            resizeMode={'contain'}
-            source={bootSplashLogo}
-            fadeDuration={0}
-            onLoadEnd={() => setBootSplashLogoIsLoaded(true)}
-            style={[
-              styles.logo,
-              {transform: [{translateY: translateY.current}]},
-            ]}
-          />
-        </Animated.View>
-      )}
     </View>
   );
 };

android/app/src/main/java/com/invest/MainApplication.java

 package com.invest;
-import android.os.Bundle;
+
 import android.app.Application;
 import android.content.Context;
 import com.facebook.react.PackageList;
 import com.facebook.react.ReactApplication;
-import com.zoontek.rnbootsplash.RNBootSplashPackage;
 import com.BV.LinearGradient.LinearGradientPackage;
 import com.oblador.vectoricons.VectorIconsPackage;
 import io.invertase.firebase.RNFirebasePackage;
@@ -19,7 +18,7 @@ import com.facebook.react.ReactApplication; //<- Dòng này
 import io.invertase.firebase.messaging.RNFirebaseMessagingPackage;//<- Dòng này
 import io.invertase.firebase.notifications.RNFirebaseNotificationsPackage;//<- Dòng này
 import com.zoontek.rnbootsplash.RNBootSplashPackage; 
-import com.zoontek.rnbootsplash.RNBootSplash; 
+
 
 public class MainApplication extends Application implements ReactApplication {
 

src/Screens/Action/History/History.js

@@ -27,6 +27,7 @@ const History = (props) => {
       type: 'ALL',
       platform: Platform.OS,
       page_size: 10,
+      status: -1,
       page_index: 1,
       start_date: '',
       end_date: '',
@@ -52,12 +53,15 @@ const History = (props) => {
 
   const getDataLoadMore = async () => {
     setisRefresh(true);
-    const res = await getListNew({
+    const res = await getListTransaction({
       keyword: '',
-      category_id: selected,
+      type: 'ALL',
       platform: Platform.OS,
       page_size: 10,
+      status: -1,
       page_index: page + 1,
+      start_date: '',
+      end_date: '',
     });
     setPage(page + 1);
 

src/Screens/Action/Wallet/Tab/Item.js

@@ -11,6 +11,11 @@ import Block from '../../../../components/Block';
 import {useNavigation} from '@react-navigation/native';
 import {DETAIL_REQUIRE_MONEY} from '../../../../routers/ScreenNames';
 
+const converType = (type) => {
+  if ((type = 'DEPOSIT')) return 'Nạp tiền';
+  return 'Rút tiền';
+};
+
 const Item = (props) => {
   const {item} = props;
   const navigate = useNavigation();
@@ -18,31 +23,35 @@ const Item = (props) => {
     <TouchableOpacity onPress={() => console.log('hello')}>
       <View style={styles.container}>
         <Block flex={1} row>
-          <View style={[styles.wrapLeft, {backgroundColor: item.color}]} />
+          {/* <View style={[styles.wrapLeft, {backgroundColor: item.color}]} />
           <View style={styles.wrapDate}>
             <Text style={styles.txt}>T{item.month}</Text>
             <Text style={styles.txtTitle}>{item.day}</Text>
-          </View>
+          </View> */}
           <Block
             style={styles.wrapRight}
-            padding={[5, 10]}
+            padding={[10, 10]}
             space={'between'}
             flex={1}>
             <View style={styles.rowBet}>
-              <Text style={styles.txtTitle}>{item.name}</Text>
+              <Text style={styles.txtTitle}>
+                {converType(item.transection_category)}
+              </Text>
               <Text
                 style={{
                   fontSize: getFontXD(42),
                   fontWeight: 'bold',
                   color: '#FFB721',
                 }}>
-                {toPriceVnd(item.money)}
+                {toPriceVnd(item.amount)}
               </Text>
             </View>
             <Text numberOfLines={2} style={styles.txt}>
-              {item.note}
+              {item.comments}
+            </Text>
+            <Text style={styles.txtDate}>
+              {item.transection_date_timestamp}
             </Text>
-            <Text style={styles.txtDate}>Ngày {item.date}</Text>
           </Block>
         </Block>
       </View>

src/Screens/Action/Wallet/Tab/Success.js

-import React from 'react';
+import React, {useState, useEffect} from 'react';
 import {View, Text, FlatList} from 'react-native';
 import HeaderBack from '../../../../components/Header/HeaderBack';
 import Item from './Item';
-const data = [
-  {
-    id: '1',
-    month: 2,
-    day: '20',
-    name: 'Nạp tiền',
-    money: 10000000,
-    note: 'Ghi chú nap tiền để đầu tư',
-    status: 1,
-    date: '20/02/2021',
-  },
-  {
-    id: '2',
-    month: 2,
-    day: '20',
-    name: 'Nạp tiền',
-    money: 2000000,
-    note: 'Ghi chú nap tiền để đầu tư',
-    status: 1,
-    date: '20/02/2021',
-  },
-  {
-    id: '3',
-    month: 2,
-    day: '20',
-    name: 'Nạp tiền',
-    money: 3000000,
-    note: 'Ghi chú nap tiền để đầu tư',
-    status: 1,
-    date: '20/02/2021',
-  },
-  {
-    id: '4',
-    month: 2,
-    day: '20',
-    name: 'Nạp tiền',
-    money: 4000000,
-    note: 'Ghi chú nap tiền để đầu tư',
-    status: 1,
-    date: '20/02/2021',
-  },
-  {
-    id: '5',
-    month: 2,
-    day: '20',
-    name: 'Nạp tiền',
-    money: 9000000,
-    note: 'Ghi chú nap tiền để đầu tư',
-    status: 1,
-    date: '20/02/2021',
-  },
-];
+import {getListTransaction} from '../../../../apis/Functions/Widthdraw';
+
 const Success = (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 getListTransaction({
+      keyword: '',
+      type: 'ALL',
+      platform: Platform.OS,
+      page_size: 10,
+      status: -1,
+      page_index: 1,
+      start_date: '',
+      end_date: '',
+    });
+    console.log(res.data);
+    setisRefresh(false);
+    if ((res.data.code = 200 && res.data.data)) {
+      setData(res.data.data);
+      setTotalPage(res.data.meta.pages);
+    } else {
+      Alert.alert('Thông báo!', res.data.message);
+    }
+  };
+
+  const onRefresh = () => {
+    getData();
+  };
+
+  const onLoadMore = () => {
+    console.log(tottalPage);
+    if (page < tottalPage) getDataLoadMore();
+  };
+
+  const getDataLoadMore = async () => {
+    setisRefresh(true);
+    const res = await getListTransaction({
+      keyword: '',
+      type: 'ALL',
+      platform: Platform.OS,
+      page_size: 10,
+      status: 1,
+      page_index: page + 1,
+      start_date: '',
+      end_date: '',
+    });
+    setPage(page + 1);
+    if (res.data.code == 200) {
+      setData(data.concat(res.data.data));
+    }
+    setisRefresh(false);
+  };
+
   return (
     <View style={{flex: 1}}>
       <FlatList
-        keyExtractor={(item) => item.id}
+        keyExtractor={(item) => item.transection_id}
+        refreshing={isRefresh}
+        onRefresh={onRefresh}
+        onEndReachedThreshold={0.01}
+        onEndReached={(info) => {
+          onLoadMore();
+        }}
         data={data}
         renderItem={({item}) => <Item item={item} />}
       />

src/Screens/Action/Wallet/Tab/Watting.js

-import React from 'react';
+import React, {useState, useEffect} from 'react';
 import {View, Text, FlatList} from 'react-native';
 import HeaderBack from '../../../../components/Header/HeaderBack';
 import Item from './Item';
-const data = [
-  {
-    id: '1',
-    month: 2,
-    day: '20',
-    name: 'Nạp tiền',
-    money: 10000000,
-    note: 'Ghi chú nap tiền để đầu tư',
-    status: 1,
-    date: '20/02/2021',
-  },
-  {
-    id: '2',
-    month: 2,
-    day: '20',
-    name: 'Nạp tiền',
-    money: 2000000,
-    note: 'Ghi chú nap tiền để đầu tư',
-    status: 1,
-    date: '20/02/2021',
-  },
-  {
-    id: '3',
-    month: 2,
-    day: '20',
-    name: 'Nạp tiền',
-    money: 3000000,
-    note: 'Ghi chú nap tiền để đầu tư',
-    status: 1,
-    date: '20/02/2021',
-  },
-  {
-    id: '4',
-    month: 2,
-    day: '20',
-    name: 'Nạp tiền',
-    money: 4000000,
-    note: 'Ghi chú nap tiền để đầu tư',
-    status: 1,
-    date: '20/02/2021',
-  },
-  {
-    id: '5',
-    month: 2,
-    day: '20',
-    name: 'Nạp tiền',
-    money: 9000000,
-    note: 'Ghi chú nap tiền để đầu tư',
-    status: 1,
-    date: '20/02/2021',
-  },
-];
+import {getListTransaction} from '../../../../apis/Functions/Widthdraw';
+
 const Watting = (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 getListTransaction({
+      keyword: '',
+      type: 'ALL',
+      platform: Platform.OS,
+      page_size: 10,
+      status: 0,
+      page_index: 1,
+      start_date: '',
+      end_date: '',
+    });
+    console.log(res.data);
+    setisRefresh(false);
+    if ((res.data.code = 200 && res.data.data)) {
+      setData(res.data.data);
+      setTotalPage(res.data.meta.pages);
+    } else {
+      Alert.alert('Thông báo!', res.data.message);
+    }
+  };
+
+  const onRefresh = () => {
+    getData();
+  };
+
+  const onLoadMore = () => {
+    console.log(tottalPage);
+    if (page < tottalPage) getDataLoadMore();
+  };
+
+  const getDataLoadMore = async () => {
+    setisRefresh(true);
+    const res = await getListTransaction({
+      keyword: '',
+      type: 'ALL',
+      platform: Platform.OS,
+      page_size: 10,
+      status: -1,
+      page_index: page + 1,
+      start_date: '',
+      end_date: '',
+    });
+    setPage(page + 1);
+    if (res.data.code == 200) {
+      setData(data.concat(res.data.data));
+    }
+    setisRefresh(false);
+  };
+
   return (
     <View style={{flex: 1}}>
       <FlatList
-        keyExtractor={(item) => item.id}
+        keyExtractor={(item) => item.transection_id}
+        refreshing={isRefresh}
+        onRefresh={onRefresh}
+        onEndReachedThreshold={0.01}
+        onEndReached={(info) => {
+          onLoadMore();
+        }}
         data={data}
         renderItem={({item}) => <Item item={item} />}
       />

src/Screens/Action/Wallet/WalletDeposit.js

@@ -6,6 +6,7 @@ import TextField from '../../../components/Input/TextField';
 import TextMulti from '../../../components/Input/TextMulti';
 import TextDisable from '../../../components/Input/TextDisable';
 import {getFontXD, toPriceVnd} from '../../../Config/Functions';
+import {connect} from 'react-redux';
 const {width} = Dimensions.get('window');
 
 const WalletDeposit = (props) => {
@@ -16,13 +17,23 @@ const WalletDeposit = (props) => {
         <View style={styles.wrapTop}>
           <View style={styles.itemTop}>
             <Text style={styles.txtTitle}>Ví</Text>
-            <Text style={styles.txtMoney}>{toPriceVnd(1000000)}</Text>
+            <Text style={styles.txtMoney}>
+              {' '}
+              {props.user.current_money != 0
+                ? toPriceVnd(props.user.current_money)
+                : 0}{' '}
+            </Text>
           </View>
           <View style={{width: 1, backgroundColor: '#DBDBDB'}} />
-
           <View style={styles.itemTop}>
             <Text style={styles.txtTitle}>CQG</Text>
-            <Text style={styles.txtMoney}>{toPriceVnd(1000000)}</Text>
+            <Text style={styles.txtMoney}>
+              {' '}
+              {props.user.current_cqg_money != 0
+                ? toPriceVnd(props.user.current_cqg_money)
+                : 0}{' '}
+              đ
+            </Text>
           </View>
         </View>
         <View style={styles.wrapBody}>
@@ -95,4 +106,9 @@ const styles = StyleSheet.create({
   },
 });
 
-export default WalletDeposit;
+const mapStateToProps = (state) => {
+  return {
+    user: state.userReducer,
+  };
+};
+export default connect(mapStateToProps, {})(WalletDeposit);

src/Screens/Action/Wallet/WalletWithdraw.js

@@ -117,18 +117,28 @@ const WalletWithdraw = (props) => {
         <View style={{flex: 1}}>
           <HeaderBack title={'Rút tiền'} />
           <View style={styles.container}>
-            {/* <View style={styles.wrapTop}>
+            <View style={styles.wrapTop}>
               <View style={styles.itemTop}>
                 <Text style={styles.txtTitle}>Ví</Text>
-            <Text style={styles.txtMoney}>{toPriceVnd(1000000)}</Text>
+                <Text style={styles.txtMoney}>
+                  {' '}
+                  {props.user.current_money != 0
+                    ? toPriceVnd(props.user.current_money)
+                    : 0}{' '}
+                </Text>
               </View>
               <View style={{width: 1, backgroundColor: '#DBDBDB'}} />
 
               <View style={styles.itemTop}>
                 <Text style={styles.txtTitle}>CQG</Text>
-            <Text style={styles.txtMoney}>{toPriceVnd(1000000)}</Text>
+                <Text style={styles.txtMoney}>
+                  {props.user.current_cqg_money != 0
+                    ? toPriceVnd(props.user.current_cqg_money)
+                    : 0}{' '}
+                  đ
+                </Text>
+              </View>
             </View>
-        </View> */}
             <View style={styles.wrapBody}>
               <Text
                 style={{

src/Screens/NewFeed/Calendar/Calendar.js

@@ -58,7 +58,7 @@ const NewFeed = (props) => {
 
   const getItemLayout = (data, index) => ({
     length: 100,
-    offset: 80 * index,
+    offset: 60 * index,
     index,
   });
 

src/Screens/Notification/Item.js

@@ -24,10 +24,11 @@ const Item = (props) => {
           </View>
           <Block padding={[5, 10]} space={'between'} flex={1}>
             <View style={{justifyContent: 'center', flex: 1}}>
-              <Text style={styles.txtBlack}>{item.content}</Text>
+              <Text numberOfLines={2} style={styles.txtBlack}>
+                Nạp tiền thành công với số lượng: 750.000
+              </Text>
             </View>
-
-            <Text style={styles.txt}>Ngày {item.time}</Text>
+            <Text style={styles.txt}>10:52 09/04/2021</Text>
           </Block>
         </Block>
       </View>

src/Screens/Notification/NotificaitonView.js

@@ -9,91 +9,54 @@ const Fillters = [
   {
     id: '1',
     name: 'Tất cả',
-    value: 'all',
+    value: 'ALL',
   },
   {
     id: '2',
-    name: 'Chưa đọc',
-    value: 'disable',
-  },
-  {
-    id: '3',
-    name: 'Đã đọc',
-    value: 'enable',
-  },
-  {
-    id: '4',
-    name: 'Rút tiền',
-    value: 'withdraw',
-  },
-  {
-    id: '5',
     name: 'Nạp tiền',
-    value: 'deposit',
-  },
-  {
-    id: '6',
-    name: 'Chuyển khoản',
-    value: 'exchange',
-  },
-];
-
-const data = [
-  {
-    id: '1',
-    time: '20/02/2021',
-    content: 'Yêu cầu nạp tiền của bạn đã đươc xác nhận',
-  },
-  {
-    id: '2',
-    time: '20/02/2021',
-    content: 'Yêu cầu nạp tiền của bạn đã đươc xác nhận',
+    value: 'DEPOSIT',
   },
   {
     id: '3',
-    time: '20/02/2021',
-    content: 'Yêu cầu nạp tiền của bạn đã đươc xác nhận',
-  },
-  {
-    id: '4',
-    time: '20/02/2021',
-    content: 'Yêu cầu nạp tiền của bạn đã đươc xác nhận',
+    name: 'Rút tiền',
+    value: 'WITHDRAW',
   },
 ];
 
 const NotificaitonView = (props) => {
-  const [selected, setSelected] = useState('1');
+  const {onRefresh, isRefresh, onLoadMore, setFillters, fillter, data} = props;
 
   return (
     <View style={{flex: 1}}>
       <HeaderDrawer isWhite={true} title={'Thông báo'} />
       <View style={styles.headerContainer}>
-        <FlatList
-          showsHorizontalScrollIndicator={false}
-          horizontal
-          data={Fillters}
-          keyExtractor={(item) => item.id}
-          renderItem={({item}) => (
+        {Fillters.map((e) => (
           <TouchableOpacity
-              onPress={() => setSelected(item.id)}
+            key={e.value}
+            onPress={() => setFillters(e.value)}
             style={[
               styles.itemFillter,
-                selected == item.id ? {borderColor: '#1473E6'} : null,
+              fillter == e.value ? {borderColor: '#1473E6'} : null,
             ]}>
             <Text
               style={[
                 styles.txtFillter,
-                  selected == item.id ? {color: '#1473E6'} : {},
+                fillter == e.value ? {color: '#1473E6'} : {},
               ]}>
-                {item.name}
+              {e.name}
             </Text>
           </TouchableOpacity>
-          )}
-        />
+        ))}
       </View>
       <FlatList
         keyExtractor={(item) => item.id}
         data={data}
+        refreshing={isRefresh}
+        onRefresh={onRefresh}
+        onEndReachedThreshold={0.01}
+        onEndReached={(info) => {
+          onLoadMore();
+        }}
         renderItem={({item}) => <Item item={item} />}
       />
     </View>
@@ -104,6 +67,9 @@ const styles = StyleSheet.create({
   headerContainer: {
     paddingVertical: 10,
     backgroundColor: 'white',
+    flexDirection: 'row',
+    justifyContent: 'space-around',
+    alignItems: 'center',
   },
   itemFillter: {
     borderRadius: 10,
@@ -112,11 +78,14 @@ const styles = StyleSheet.create({
     borderWidth: 1,
     borderColor: '#929292',
     marginLeft: 15,
-    minWidth: 70,
+    minWidth: 80,
+    justifyContent: 'center',
+    alignItems: 'center',
   },
   txtFillter: {
     fontSize: getFontXD(36),
     color: '#929292',
+    fontWeight: 'bold',
   },
 });
 

src/Screens/Notification/Notification.js

-import React from 'react';
-
+import React, {useState, useEffect} from 'react';
+import {getListNotification} from '../../apis/Functions/users';
 import NotificationView from './NotificaitonView';
 
 const Notifcation = (props) => {
-  return <NotificationView />;
+  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,
+    });
+    console.log(res.data);
+    setisRefresh(false);
+    if ((res.data.code = 200 && res.data.data)) {
+      setData(res.data.data);
+      setTotalPage(res.data.meta.pages);
+    } else {
+      Alert.alert('Thông báo!', 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);
+  };
+
+  return (
+    <NotificationView
+      onRefresh={onRefresh}
+      isRefresh={isRefresh}
+      onLoadMore={onLoadMore}
+      setFillters={setFillters}
+      fillter={fillter}
+      data={data}
+    />
+  );
 };
 
 export default Notifcation;

src/apis/Functions/users.js

@@ -41,3 +41,8 @@ export const getTransaction = async (body) =>
   GetData(url.urlGetTransaction, body)
     .then((res) => res)
     .catch((err) => err);
+
+export const getListNotification = async (body) =>
+  GetData(url.urlGetListNotification, body)
+    .then((res) => res)
+    .catch((err) => err);

src/apis/url.js

@@ -27,4 +27,6 @@ export default {
 
   //History
   urlGetListHistory: root + 'api/v1/customers/get-list-transaction-history',
+
+  urlGetListNotification: root + 'api/v1/customers/get-list-notification',
 };

src/assets/images.js

@@ -30,8 +30,8 @@ const images = {
   iconMethodPay: require('./images/iconMethodPay1.png'),
 
   iconDepositNoti: require('./images/iconDeposit.png'),
-  iconRecharge: require('./images/iconRecharge.png'),
-  iconWithdrawal: require('./images/iconWithdrawal.png'),
+  iconRecharge: require('./images/iconRecharge1.png'),
+  iconWithdrawal: require('./images/iconWithdrawal2.png'),
   iconClose: require('./images/CloseIcon.png'),
   iconBack: require('./images/iconBack.png'),
   bgBtn: require('./images/bgBtn.png'),