@tima2025/react-native-timalender 1.0.0

package/src/screens/Confirm/index.tsx

@@ -0,0 +1,1146 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+//@ts-nocheck
+/* eslint-disable react-native/no-inline-styles */
+import React, { useEffect, useState } from 'react';
+import {
+  Alert,
+  Image,
+  Linking,
+  ScrollView,
+  TouchableOpacity,
+  View,
+} from 'react-native';
+import { showMessage } from 'react-native-flash-message';
+import Modal from 'react-native-modal';
+import Icon from 'react-native-vector-icons/Ionicons';
+import { useDispatch, useSelector } from 'react-redux';
+import imageBanks from '../../assets/images/Banks';
+import HomeImages from '../../assets/images/HomePage';
+import AppHeader from '../../common/AppHeader';
+import Colors from '../../common/Colors';
+import constant from '../../common/constants/index';
+import Container from '../../common/Container';
+import FlexRow from '../../common/FlexRow';
+import Loading from '../../common/Loading';
+import { numberWithCommas, Shadow } from '../../common/Metrics';
+import RText from '../../common/RText';
+import {
+  beginTransactionNamA,
+  beginTransactionNCBLimited,
+  getBankLinked,
+  getTransactionNCB,
+  transactionGPAY,
+  transactionVIB,
+  transferFee,
+} from '../../components/Features/bank/bankSlice';
+import { feeInSurance } from '../../components/Features/Loans/loanSlice';
+import { logOut } from '../../components/Features/user/userSlice';
+import Screens from '../../components/Navigation/Screens';
+import { selectLoading, userInfor } from '../../components/Redux/selector';
+import { AppDispatch } from '../../components/Redux/store';
+import ModalChooseBank from './Components/ModalChooseBank';
+
+export const Confirm = ({ route, navigation }: any) => {
+  const data = route?.params?.data || '';
+  const isLoading = useSelector(selectLoading);
+  const userInfo = useSelector(userInfor);
+  const dispatch = useDispatch<AppDispatch>();
+  const [dataListBank, setDataListBank] = useState<any>([]);
+  // const [transactions, setTransactions] = useState([]);
+  const [fee, setFee] = useState(0);
+  const [bank, setBank] = useState<any>(null);
+  const [type, _setType] = useState('');
+  const [showAlert, setShowAlert] = useState(false);
+  const [openChooseBank, setOpenChooseBank] = useState(false);
+  const [indexTransaction, setIndexTransaction] = useState(0);
+  // const [feeInsuranceLender, setFeeInsuranceLender] = useState(0);
+  const [feeInsuranceCustomer, setFeeInsuranceCustomer] = useState(0);
+  const [feeInsuranceMaterialCovered, setFeeInsuranceMaterialCovered] =
+    useState(0);
+  let moneyLimited = 80000000;
+  let moneyLimitedSplit = 100000000;
+
+  useEffect(() => {
+    // setOpenChooseBank(true);
+    getData();
+  }, []);
+
+  const getData = () => {
+    getFeeInsurance();
+    getBankLink();
+  };
+
+  const getBankLink = async () => {
+    const resp: any = await dispatch(getBankLinked('1'));
+    if (resp.payload.meta.errCode === 200) {
+      if (__DEV__) {
+        console.log('resp list bank---', resp?.payload?.data);
+      }
+      const data = resp?.payload?.data || [];
+      setDataListBank(data);
+    } else {
+      // WToastShowError(resp?.payload?.meta?.errMessage);
+      showMessage({
+        message: 'Thông báo',
+        description: resp?.payload?.meta?.errMessage,
+        type: 'danger',
+        icon: 'warning',
+        backgroundColor: Colors.DANGER,
+      });
+    }
+  };
+
+  // const getDataListBank = async () => {
+  //   const resp: any = await dispatch(getListBank());
+  //   if (resp.payload.meta.errCode === 200) {
+  //     if (__DEV__) {
+  //       console.log('resp list bank---', resp?.payload?.data);
+  //     }
+  //     const data = resp?.payload?.data || [];
+  //     setDataListBank(data);
+  //   } else {
+  //     // WToastShowError(resp?.payload?.meta?.errMessage);
+  //     showMessage({
+  //       message: 'Thông báo',
+  //       description: resp?.payload?.meta?.errMessage,
+  //       type: 'danger',
+  //       icon: 'warning',
+  //       backgroundColor: Colors.DANGER,
+  //     });
+  //   }
+  // };
+
+  const getFeeInsurance = async () => {
+    const resp: any = await dispatch(feeInSurance(data?.id));
+    if (__DEV__) {
+      console.log('resp phi bh----', resp);
+    }
+    if (resp?.payload?.status === 1) {
+      setFeeInsuranceLender(resp?.payload?.data?.feeInsuranceOfLender);
+      setFeeInsuranceCustomer(resp?.payload?.data?.feeInsuranceOfCustomer);
+      setFeeInsuranceMaterialCovered(
+        resp?.payload?.data?.feeInsuranceMaterialCovered
+      );
+    } else {
+      // WToastShowError('Không thể lấy phí bảo hiểm');
+      showMessage({
+        message: 'Thông báo',
+        description: 'Không thể lấy phí bảo hiểm',
+        type: 'danger',
+        icon: 'warning',
+        backgroundColor: Colors.DANGER,
+      });
+      setOpenChooseBank(false);
+      navigation.goBack();
+    }
+  };
+
+  // function listTransaction() {
+  //   if (bank?.bankAlias === 'NCB') {
+  //     let listTransaction = [];
+  //     const count =
+  //       Math.floor(data?.totalMoney / moneyLimited) +
+  //       (data?.totalMoney % moneyLimited > 0 ? 1 : 0);
+  //     if (count < 2 || data?.totalMoney < moneyLimitedSplit) {
+  //       return;
+  //     }
+  //     for (let i = 0; i < count; i++) {
+  //       listTransaction.push(
+  //         <View>
+  //           <FlexRow
+  //             style={{
+  //               alignItems: 'center',
+  //               paddingVertical: 12,
+  //               paddingHorizontal: 12,
+  //             }}
+  //           >
+  //             <RText
+  //               style={{
+  //                 fontSize: 14,
+  //                 color: '#747474',
+  //               }}
+  //             >{`                                Lần ${i + 1}:`}</RText>
+  //             <RText
+  //               style={{
+  //                 flex: 1,
+  //                 fontSize: 14,
+  //                 color: '#1D1B1B',
+  //                 fontWeight: 'bold',
+  //                 textAlign: 'right',
+  //                 textDecorationLine:
+  //                   transactions.length >= i + 1 ? 'line-through' : 'none',
+  //                 fontStyle: transactions.length >= i + 1 ? 'italic' : 'normal',
+  //               }}
+  //             >
+  //               {numberWithCommas(
+  //                 data?.totalMoney - moneyLimited * i > moneyLimited
+  //                   ? moneyLimited
+  //                   : data?.totalMoney - moneyLimited * i
+  //               )}{' '}
+  //               VNĐ
+  //             </RText>
+  //           </FlexRow>
+  //         </View>
+  //       );
+  //     }
+  //     return <View>{listTransaction}</View>;
+  //   }
+  // }
+
+  // function bankPicked() {
+  //   switch (bank?.bankAlias) {
+  //     case 'NamA':
+  //       return (
+  //         <View style={{ paddingHorizontal: 24 }}>
+  //           <View
+  //             style={{
+  //               backgroundColor: 'white',
+  //               justifyContent: 'center',
+  //               alignItems: 'center',
+  //               padding: 16,
+  //               borderColor: '#979797',
+  //               height: (constant.widthDevice - 32) * 0.47,
+  //               marginVertical: 24,
+  //               shadowColor: '#00000040',
+  //               shadowOffset: {
+  //                 width: 2,
+  //                 height: 2,
+  //               },
+  //               shadowRadius: 10,
+  //               shadowOpacity: 1,
+  //               borderRadius: 12,
+  //               elevation: 3,
+  //               margin: 3,
+  //             }}
+  //           >
+  //             <Image
+  //               source={imageBanks.namA}
+  //               style={{
+  //                 height: 80,
+  //                 marginVertical: 16,
+  //                 resizeMode: 'contain',
+  //               }}
+  //             />
+  //           </View>
+  //           <TouchableOpacity
+  //             style={{
+  //               backgroundColor: '#F05123',
+  //               marginBottom: 16,
+  //               height: 48,
+  //               flexDirection: 'row',
+  //               borderColor: constant.primaryColor,
+  //               borderRadius: 24,
+  //               paddingHorizontal: 24,
+  //               borderWidth: 0.5,
+  //               justifyContent: 'center',
+  //               alignItems: 'center',
+  //             }}
+  //             onPress={() => {
+  //               beginTransaction();
+  //             }}
+  //           >
+  //             <RText style={{ fontSize: 16, color: 'white', paddingLeft: 12 }}>
+  //               Hoàn tất
+  //             </RText>
+  //           </TouchableOpacity>
+  //         </View>
+  //       );
+  //     case 'VIB':
+  //       return (
+  //         <View style={{ paddingHorizontal: 24 }}>
+  //           <View
+  //             style={{
+  //               backgroundColor: 'white',
+  //               justifyContent: 'center',
+  //               alignItems: 'center',
+  //               padding: 16,
+  //               borderColor: '#979797',
+  //               height: (constant.widthDevice - 32) * 0.47,
+  //               marginVertical: 24,
+  //               shadowColor: '#00000040',
+  //               shadowOffset: {
+  //                 width: 2,
+  //                 height: 2,
+  //               },
+  //               shadowRadius: 10,
+  //               shadowOpacity: 1,
+  //               borderRadius: 12,
+  //               elevation: 3,
+  //               margin: 3,
+  //             }}
+  //           >
+  //             <Image
+  //               source={imageBanks.vib}
+  //               style={{
+  //                 height: 80,
+  //                 marginVertical: 16,
+  //                 resizeMode: 'contain',
+  //               }}
+  //             />
+  //           </View>
+  //           <TouchableOpacity
+  //             style={{
+  //               backgroundColor: '#F05123',
+  //               marginBottom: 16,
+  //               height: 48,
+  //               flexDirection: 'row',
+  //               borderColor: constant.primaryColor,
+  //               borderRadius: 24,
+  //               paddingHorizontal: 24,
+  //               borderWidth: 0.5,
+  //               justifyContent: 'center',
+  //               alignItems: 'center',
+  //             }}
+  //             onPress={() => {
+  //               beginTransaction();
+  //             }}
+  //           >
+  //             <RText style={{ fontSize: 16, color: 'white', paddingLeft: 12 }}>
+  //               Hoàn tất
+  //             </RText>
+  //           </TouchableOpacity>
+  //         </View>
+  //       );
+  //     case 'NCB':
+  //       return (
+  //         <View style={{ paddingHorizontal: 24 }}>
+  //           <View
+  //             style={{
+  //               backgroundColor: getBackground(bank),
+  //               justifyContent: 'center',
+  //               alignItems: 'center',
+  //               padding: 16,
+  //               borderColor: '#979797',
+  //               height: (constant.widthDevice - 32) * 0.47,
+  //               marginVertical: 24,
+  //               shadowColor: '#00000040',
+  //               shadowOffset: {
+  //                 width: 2,
+  //                 height: 2,
+  //               },
+  //               shadowRadius: 10,
+  //               shadowOpacity: 1,
+  //               borderRadius: 12,
+  //               elevation: 3,
+  //               margin: 3,
+  //             }}
+  //           >
+  //             <Image
+  //               source={imageBanks.ncb}
+  //               style={{
+  //                 height: 80,
+  //                 marginVertical: 16,
+  //                 resizeMode: 'contain',
+  //               }}
+  //             />
+  //           </View>
+  //           <TouchableOpacity
+  //             style={{
+  //               backgroundColor: '#F05123',
+  //               marginBottom: 16,
+  //               height: 48,
+  //               flexDirection: 'row',
+  //               borderColor: constant.primaryColor,
+  //               borderRadius: 24,
+  //               paddingHorizontal: 24,
+  //               borderWidth: 0.5,
+  //               justifyContent: 'center',
+  //               alignItems: 'center',
+  //             }}
+  //             onPress={() => {
+  //               beginTransaction();
+  //             }}
+  //           >
+  //             {/*<Image source={require('../../assets/ic_tick_confirm.png')} style={{width: 18, height: 18, resizeMode: 'contain'}}/>*/}
+  //             <RText style={{ fontSize: 16, color: 'white', paddingLeft: 12 }}>
+  //               Hoàn tất
+  //             </RText>
+  //           </TouchableOpacity>
+  //         </View>
+  //       );
+  //     case 'GPAY':
+  //       return (
+  //         <View style={{ paddingHorizontal: 24 }}>
+  //           <View
+  //             style={{
+  //               backgroundColor: getBackground(bank),
+  //               justifyContent: 'center',
+  //               alignItems: 'center',
+  //               padding: 16,
+  //               borderColor: '#979797',
+  //               height: (constant.widthDevice - 32) * 0.47,
+  //               marginVertical: 24,
+  //               shadowColor: '#00000040',
+  //               shadowOffset: {
+  //                 width: 2,
+  //                 height: 2,
+  //               },
+  //               shadowRadius: 10,
+  //               shadowOpacity: 1,
+  //               borderRadius: 12,
+  //               elevation: 3,
+  //               margin: 3,
+  //             }}
+  //           >
+  //             <Image
+  //               source={imageBanks.gpay}
+  //               style={{
+  //                 height: 80,
+  //                 marginVertical: 16,
+  //                 resizeMode: 'contain',
+  //               }}
+  //             />
+  //           </View>
+  //           <TouchableOpacity
+  //             style={{
+  //               backgroundColor: '#F05123',
+  //               marginBottom: 16,
+  //               height: 48,
+  //               flexDirection: 'row',
+  //               borderColor: constant.primaryColor,
+  //               borderRadius: 24,
+  //               paddingHorizontal: 24,
+  //               borderWidth: 0.5,
+  //               justifyContent: 'center',
+  //               alignItems: 'center',
+  //             }}
+  //             onPress={() => {
+  //               beginTransaction();
+  //             }}
+  //           >
+  //             <RText style={{ fontSize: 16, color: 'white', paddingLeft: 12 }}>
+  //               Hoàn tất
+  //             </RText>
+  //           </TouchableOpacity>
+  //         </View>
+  //       );
+  //     default:
+  //       break;
+  //   }
+  // }
+
+  // function getBackground(bank: { bankAlias: any }) {
+  //   switch (bank.bankAlias) {
+  //     case 'VIB':
+  //     // case 'NamA':
+  //     //   return 'white';
+  //     case 'NCB':
+  //       return '#004e96';
+  //     case 'GPAY':
+  //       return 'white';
+  //     case 'GPAY':
+  //       return 'white';
+  //   }
+  // }
+
+  const beginTransaction = async (bank: any) => {
+    if (data?.id === undefined) {
+    } else {
+      try {
+        getBankTransaction(bank, (response: any) => {
+          if (__DEV__) {
+            console.log('response giai ngan bank---', response);
+          }
+          switch (response?.payload?.meta.errCode) {
+            case 200:
+              if (bank?.bankCode === 'NCB') {
+                const money =
+                  data?.totalMoney - moneyLimited * (indexTransaction - 1) >
+                  moneyLimited
+                    ? moneyLimited
+                    : data?.totalMoney - moneyLimited * (indexTransaction - 1);
+                const count =
+                  Math.floor(data?.totalMoney / moneyLimited) +
+                  (data?.totalMoney % moneyLimited > 0 ? 1 : 0);
+                navigation.navigate(Screens.otp, {
+                  bank: bank,
+                  bank_ref: response?.payload?.data,
+                  type: 'investment',
+                  order: data,
+                  money: money,
+                  fee: fee,
+                  index: indexTransaction,
+                  count: count,
+                  nextTransaction: () => {
+                    setIndexTransaction(indexTransaction + 1);
+                    getTransactions();
+                    beginTransaction(bank);
+                  },
+                });
+              } else {
+                navigation.navigate(Screens.otp, {
+                  bank: bank,
+                  bank_ref: response?.payload?.data,
+                  type: 'investment',
+                  money:
+                    data?.totalMoney -
+                    feeInsuranceCustomer -
+                    feeInsuranceMaterialCovered,
+                });
+              }
+              break;
+            case 401:
+              Alert.alert(
+                'Thông báo',
+                'Bạn không có quyền truy cập. Vui lòng đăng nhập lại!',
+                [
+                  {
+                    text: 'OK',
+                    onPress: () => {
+                      dispatch(logOut());
+                    },
+                    style: 'cancel',
+                  },
+                ]
+              );
+              break;
+            case 241:
+              // WToastShowError(response.payload.meta.errMessage);
+              showMessage({
+                message: 'Thông báo',
+                description: response.payload.meta.errMessage,
+                type: 'danger',
+                icon: 'warning',
+                backgroundColor: Colors.DANGER,
+              });
+              break;
+            default:
+              // WToastShowError('Có lỗi xảy ra. Vui lòng thử lại');
+              showMessage({
+                message: 'Thông báo',
+                description: 'Có lỗi xảy ra. Vui lòng thử lại',
+                type: 'danger',
+                icon: 'warning',
+                backgroundColor: Colors.DANGER,
+              });
+          }
+        });
+      } catch (err) {
+        console.log('err', err);
+      }
+    }
+  };
+
+  const getTransactions = async () => {
+    const params = { loanCreditId: data?.id };
+    const resp: any = await dispatch(getTransactionNCB(params));
+    setTransactions(resp?.payload?.data);
+    setIndexTransaction(resp?.payload?.data?.length + 1);
+  };
+
+  const getBankTransaction = async (bank: any, callback: any) => {
+    const params = { loanCreditId: data?.id };
+    switch (bank?.bankCode) {
+      case 'NamA':
+        const resp1: any = await dispatch(beginTransactionNamA(params));
+        callback(resp1);
+        break;
+      case 'NCB':
+        if (data?.totalMoney > moneyLimitedSplit && indexTransaction === 0) {
+          setShowAlert(true);
+        } else {
+          const resp2: any = await dispatch(beginTransactionNCBLimited(params));
+          callback(resp2);
+        }
+        break;
+      case 'VIB':
+        const resp3: any = await dispatch(transactionVIB(params));
+        callback(resp3);
+        break;
+      case 'GPAY':
+        const resp4: any = await dispatch(transactionGPAY(params));
+        callback(resp4);
+        break;
+      case 'Gpay':
+        const resp5: any = await dispatch(transactionGPAY(params));
+        callback(resp5);
+        break;
+    }
+  };
+
+  const getFeeTransfer = async (item: any) => {
+    const params = {
+      fromBank: item?.bankCode,
+      toBank: data?.bankName,
+      amount: data?.totalMoney,
+    };
+    const resp: any = await dispatch(transferFee(params));
+    console.log('resp lay phi---', resp);
+    switch (resp?.payload?.meta?.errCode) {
+      case 200:
+        setFee(resp?.payload?.data);
+        break;
+      case 401:
+        Alert.alert(
+          'Thông báo',
+          'Bạn không có quyền truy cập. Vui lòng đăng nhập lại!',
+          [
+            {
+              text: 'OK',
+              onPress: () => {
+                dispatch(logOut());
+              },
+              style: 'cancel',
+            },
+          ]
+        );
+        break;
+      default:
+        // WToastShowError('Có lỗi xảy ra. Vui lòng thử lại');
+        showMessage({
+          message: 'Thông báo',
+          description: 'Có lỗi xảy ra. Vui lòng thử lại',
+          type: 'danger',
+          icon: 'warning',
+          backgroundColor: Colors.DANGER,
+        });
+    }
+  };
+
+  // function _renderItem(item: any) {
+  //   if (!item?.bankId) {
+  //     return <View style={{ flex: 1 }} />;
+  //   }
+  //   return (
+  //     <View style={{ backgroundColor: 'transparent' }}>
+  //       <View
+  //         style={{
+  //           borderRadius: 12,
+  //           shadowColor: item?.status === 1 ? '#FFDACFff' : '#0000001a',
+  //           shadowOffset: {
+  //             width: 2,
+  //             height: 2,
+  //           },
+  //           shadowRadius: 10,
+  //           shadowOpacity: 1,
+  //         }}
+  //       >
+  //         <TouchableOpacity
+  //           onPress={() => {
+  //             if (item?.status === 1) {
+  //               setBank(item);
+  //               getFeeTransfer(item);
+  //             } else {
+  //               try {
+  //                 if (userInfo?.status === 1) {
+  //                   if (item.status !== 1 && item.bankAlias !== 'GPAY') {
+  //                     Alert.alert(
+  //                       'Thông báo',
+  //                       'Ngân hàng chưa được liên kết,bạn có muốn liên kết ngay không?',
+  //                       [
+  //                         {
+  //                           text: 'Hủy',
+  //                           onPress: () => console.log('Cancel Pressed'),
+  //                           style: 'cancel',
+  //                         },
+  //                         {
+  //                           text: 'Đồng ý',
+  //                           onPress: () =>
+  //                             navigation.navigate(Screens.InputBank, {
+  //                               bank: item,
+  //                               data: item,
+  //                             }),
+  //                         },
+  //                       ]
+  //                     );
+  //                   }
+  //                 } else if (userInfo?.status === 10) {
+  //                   Alert.alert(
+  //                     'Thông báo',
+  //                     'Tài khoản của bạn đang trong trạng thái chờ xác nhận. Vui lòng chờ chúng tôi xác nhận thông tin tài khoản của bạn. Để được hỗ trợ liên hệ với chúng tôi qua hotline 1900.633.688.',
+  //                     [
+  //                       {
+  //                         text: 'Gọi',
+  //                         style: 'cancel',
+  //                         onPress: () => Linking.openURL('tel:1900633688'),
+  //                       },
+  //                       { text: 'Đồng ý' },
+  //                     ]
+  //                   );
+  //                 }
+  //               } catch (e) {
+  //                 console.log('e------', e);
+  //               }
+  //             }
+  //           }}
+  //           style={{
+  //             backgroundColor: getBackground(item),
+  //             justifyContent: 'center',
+  //             alignItems: 'center',
+  //             borderRadius: 12,
+  //             margin: 2,
+  //             marginRight: 8,
+  //             padding: 4,
+  //             shadowColor: item?.status === 1 ? '#FFDACF' : '#0000001a',
+  //             shadowOffset: {
+  //               width: 2,
+  //               height: 2,
+  //             },
+  //             shadowRadius: 10,
+  //             shadowOpacity: 1,
+  //           }}
+  //         >
+  //           <Image
+  //             source={getLogo(item)}
+  //             style={{
+  //               width: (Dimensions.get('window').width - 120) / 4,
+  //               height: (Dimensions.get('window').width - 120) / 4,
+  //               resizeMode: 'contain',
+  //             }}
+  //           />
+  //           {!item.isLinkable ? (
+  //             <TouchableOpacity
+  //               style={{
+  //                 backgroundColor: '#ffffffaf',
+  //                 width: '100%',
+  //                 height: '100%',
+  //                 position: 'absolute',
+  //               }}
+  //             />
+  //           ) : null}
+  //         </TouchableOpacity>
+  //       </View>
+  //     </View>
+  //   );
+  // }
+
+  // function getLogo(bank: { bankAlias: string }) {
+  //   switch (bank.bankAlias) {
+  //     // case 'NamA':
+  //     //   return imageBanks.namA;
+  //     case 'NCB':
+  //       return imageBanks.ncb;
+  //     case 'VIB':
+  //       return imageBanks.vib;
+  //     case 'GPAY':
+  //       return imageBanks.gpay;
+  //     case 'Gpay':
+  //       return imageBanks.gpay;
+  //   }
+  // }
+
+  const getIconBank = () => {
+    switch (bank?.bankCode) {
+      case 'GPAY':
+        return imageBanks.icon_gpay;
+      case 'Gpay':
+        return imageBanks.icon_gpay;
+      // case 'NamA':
+      //   return imageBanks.icon_nama;
+      case 'NCB':
+        return imageBanks.icon_ncb;
+      case 'VIB':
+        return imageBanks.icon_vib;
+      default:
+        break;
+    }
+  };
+
+  return (
+    <Container isStatusBar>
+      <AppHeader title={'Xác nhận giải ngân'.toUpperCase()} />
+      <ScrollView>
+        <View style={{ paddingHorizontal: 16 }}>
+          <RText
+            style={{
+              fontSize: 16,
+              color: '#1D1B1B',
+              paddingTop: 16,
+              fontWeight: '600',
+            }}
+          >
+            PHƯƠNG THỨC GIẢI NGÂN
+          </RText>
+          {bank ? (
+            <View
+              style={{
+                borderWidth: 1,
+                borderColor: type === 'nama' ? Colors.ORANGE : '#BDBDBD',
+                borderRadius: 4,
+                width: '50%',
+                height: 48,
+                justifyContent: 'center',
+                flexDirection: 'row',
+                alignItems: 'center',
+                // alignSelf: 'center',
+                marginLeft: 16,
+                marginVertical: 8,
+              }}
+            >
+              <Image
+                source={getIconBank()}
+                style={{ width: 28, height: 28, marginRight: 8 }}
+              />
+              <RText textStyle={{ fontWeight: '600' }}>
+                {' '}
+                {bank?.bankCode}{' '}
+              </RText>
+            </View>
+          ) : (
+            <RText textStyle={{ marginVertical: 8 }}>
+              Vui lòng chọn phương thức giải ngân
+            </RText>
+          )}
+          {/* <FlexRow style={{marginVertical: 8}}>
+            <TouchableOpacity
+              onPress={() => setType('gpay')}
+              style={{
+                borderWidth: 1,
+                borderColor: type === 'gpay' ? Colors.ORANGE : '#BDBDBD',
+                borderRadius: 4,
+                width: '47%',
+                height: 48,
+                justifyContent: 'center',
+                flexDirection: 'row',
+                alignItems: 'center',
+              }}>
+              <Image
+                source={imageBanks.icon_gpay}
+                style={{width: 28, height: 28, marginRight: 8}}
+              />
+              <RText textStyle={{fontWeight: '600'}}>Gpay</RText>
+            </TouchableOpacity>
+            <TouchableOpacity
+              onPress={() => setType('nama')}
+              style={{
+                borderWidth: 1,
+                borderColor: type === 'nama' ? Colors.ORANGE : '#BDBDBD',
+                borderRadius: 4,
+                width: '47%',
+                height: 48,
+                justifyContent: 'center',
+                flexDirection: 'row',
+                alignItems: 'center',
+                marginLeft: 16,
+              }}>
+              <Image
+                source={imageBanks.icon_nama}
+                style={{width: 28, height: 28, marginRight: 8}}
+              />
+              <RText textStyle={{fontWeight: '600'}}>Nam Á</RText>
+            </TouchableOpacity>
+          </FlexRow> */}
+
+          {/* mở modal chọn phương thức ngân hàng giải ngân */}
+          <TouchableOpacity
+            onPress={() => setOpenChooseBank(true)}
+            style={{
+              flexDirection: 'row',
+              alignItems: 'center',
+              justifyContent: 'space-between',
+            }}
+          >
+            <RText
+              textStyle={{
+                color: Colors.ORANGE,
+                fontWeight: '600',
+                fontSize: 16,
+              }}
+            >
+              Chọn phương thức khác
+            </RText>
+            <Icon name="chevron-forward" size={24} />
+          </TouchableOpacity>
+          <RText
+            style={{
+              fontSize: 16,
+              color: '#1D1B1B',
+              paddingBottom: 8,
+              paddingTop: 24,
+              fontWeight: '600',
+            }}
+          >
+            THÔNG TIN KHOẢN ĐẦU TƯ
+          </RText>
+          <View
+            style={{
+              backgroundColor: 'white',
+              padding: 8,
+              ...Shadow,
+            }}
+          >
+            <FlexRow style={{ alignItems: 'center', paddingVertical: 12 }}>
+              <RText style={{ fontSize: 16, color: '#1D1B1B' }}>
+                Tên người vay:
+              </RText>
+              <RText
+                style={{
+                  flex: 1,
+                  fontSize: 16,
+                  color: '#1D1B1B',
+                  fontWeight: 'bold',
+                  textAlign: 'right',
+                }}
+              >
+                {data?.cardHolderName}
+              </RText>
+            </FlexRow>
+            <FlexRow style={{ alignItems: 'center', paddingVertical: 12 }}>
+              <RText style={{ fontSize: 16, color: '#1D1B1B' }}>
+                Phí bảo hiểm người vay:
+              </RText>
+              <RText
+                style={{
+                  flex: 1,
+                  fontSize: 16,
+                  color: '#1D1B1B',
+                  fontWeight: 'bold',
+                  textAlign: 'right',
+                }}
+              >
+                {numberWithCommas(
+                  feeInsuranceCustomer + feeInsuranceMaterialCovered
+                )}
+              </RText>
+            </FlexRow>
+            <FlexRow
+              style={{
+                alignItems: 'center',
+                paddingTop: 12,
+              }}
+            >
+              <RText style={{ fontSize: 16, color: '#1D1B1B' }}>
+                Số tiền chuyển khoản:
+              </RText>
+              <RText
+                style={{
+                  flex: 1,
+                  fontSize: 16,
+                  color: '#1D1B1B',
+                  fontWeight: 'bold',
+                  textAlign: 'right',
+                }}
+              >
+                {numberWithCommas(
+                  data?.totalMoney -
+                    feeInsuranceCustomer -
+                    feeInsuranceMaterialCovered
+                )}{' '}
+                VNĐ
+              </RText>
+            </FlexRow>
+            <RText
+              style={{
+                fontSize: 12,
+                paddingHorizontal: 12,
+                paddingBottom: 12,
+                color: '#1D1B1B',
+                fontStyle: 'italic',
+              }}
+            >
+              (Phí chuyển tiền:{' '}
+              {numberWithCommas(
+                fee *
+                  (Math.floor(data?.totalMoney / moneyLimited) +
+                    (data?.totalMoney / moneyLimited > 0 ? 1 : 0))
+              )}{' '}
+              VNĐ)
+            </RText>
+          </View>
+        </View>
+        {/* {listTransaction()}
+        {bankPicked()} */}
+
+        <View style={{ padding: 16 }}>
+          <RText
+            style={{
+              fontSize: 16,
+              color: '#1D1B1B',
+              fontWeight: 'bold',
+              paddingTop: 24,
+            }}
+          >
+            {'BẢO MẬT TUYỆT ĐỐI'}
+          </RText>
+          <FlexRow style={{ alignItems: 'center', paddingTop: 16 }}>
+            <Image
+              source={HomeImages.ic_checked}
+              style={{ width: 18, height: 18, resizeMode: 'contain' }}
+            />
+            <RText
+              style={{
+                flex: 1,
+                fontSize: 16,
+                color: '#1D1B1B',
+                paddingLeft: 8,
+              }}
+            >
+              {'Cơ chế bảo mật nhiều tầng'}
+            </RText>
+          </FlexRow>
+          <FlexRow style={{ alignItems: 'center', paddingTop: 16 }}>
+            <Image
+              source={HomeImages.ic_checked}
+              style={{ width: 18, height: 18, resizeMode: 'contain' }}
+            />
+            <RText
+              style={{
+                flex: 1,
+                fontSize: 16,
+                color: '#1D1B1B',
+                paddingLeft: 8,
+              }}
+            >
+              {
+                'Mọi phát sinh trong giao dịch với TIMA phải được Quý khách thực hiện và xác nhận'
+              }
+            </RText>
+          </FlexRow>
+        </View>
+      </ScrollView>
+      {bank ? (
+        <TouchableOpacity
+          onPress={() => beginTransaction(bank)}
+          style={{
+            width: '90%',
+            height: 42,
+            alignSelf: 'center',
+            borderRadius: 4,
+            backgroundColor: Colors.ORANGE,
+            marginBottom: 30,
+            alignItems: 'center',
+            justifyContent: 'center',
+          }}
+        >
+          <RText
+            textStyle={{ fontSize: 16, color: Colors.WHITE, fontWeight: '600' }}
+          >
+            Xác nhận giải ngân
+          </RText>
+        </TouchableOpacity>
+      ) : (
+        <View />
+      )}
+      <Modal
+        isVisible={showAlert}
+        backdropOpacity={0.3}
+        useNativeDriver={true}
+        animationOutTiming={500}
+        useNativeDriverForBackdrop={true}
+        hideModalContentWhileAnimating={true}
+      >
+        <View style={{ flex: 1, justifyContent: 'center' }}>
+          <View
+            style={{
+              backgroundColor: 'white',
+              paddingTop: 16,
+              paddingBottom: 30,
+              borderRadius: 4,
+              overflow: 'hidden',
+              paddingHorizontal: 30,
+            }}
+          >
+            <RText textStyle={{ fontSize: 16, textAlign: 'center' }}>
+              Do Hạn mức giao dịch qua Internet Banking/Mobile Banking của ngân
+              hàng tối đa là: 100,000,000 VNĐ/ giao dịch. Nên khoản vay này sẽ
+              được chia ra thành nhiều giao dịch để giải ngân.
+            </RText>
+            <FlexRow style={{ justifyContent: 'center', marginTop: 16 }}>
+              <TouchableOpacity
+                onPress={() => {
+                  setShowAlert(false);
+                }}
+                style={{
+                  marginRight: 4,
+                  paddingHorizontal: 24,
+                  paddingVertical: 12,
+                  justifyContent: 'center',
+                  alignItems: 'center',
+                  borderColor: '#EBEBEB',
+                  borderWidth: 1,
+                  borderRadius: 4,
+                }}
+              >
+                <RText
+                  style={{ fontSize: 14, color: '#BCBCBC', fontWeight: 'bold' }}
+                >
+                  {'Huỷ bỏ'.toUpperCase()}
+                </RText>
+              </TouchableOpacity>
+              <TouchableOpacity
+                onPress={() => {
+                  setShowAlert(false);
+                  setIndexTransaction(
+                    indexTransaction === 0
+                      ? indexTransaction + 1
+                      : indexTransaction
+                  );
+                  beginTransaction(bank);
+                }}
+                style={{
+                  marginLeft: 4,
+                  paddingHorizontal: 24,
+                  paddingVertical: 12,
+                  justifyContent: 'center',
+                  alignItems: 'center',
+                  backgroundColor: constant.primaryColor,
+                  borderRadius: 4,
+                }}
+              >
+                <RText
+                  style={{ fontSize: 14, color: 'white', fontWeight: 'bold' }}
+                >
+                  {'Đồng ý'.toUpperCase()}
+                </RText>
+              </TouchableOpacity>
+            </FlexRow>
+          </View>
+        </View>
+      </Modal>
+      <ModalChooseBank
+        isVisible={openChooseBank}
+        listBank={dataListBank}
+        onClose={() => setOpenChooseBank(false)}
+        onPress={(item: any) => {
+          if (item?.status === 1) {
+            setBank(item);
+            getFeeTransfer(item);
+            setOpenChooseBank(false);
+          } else {
+            try {
+              if (userInfo?.status === 1) {
+                if (item.status !== 1) {
+                  Alert.alert(
+                    'Thông báo',
+                    'Ngân hàng chưa được liên kết,bạn có muốn liên kết ngay không?',
+                    [
+                      {
+                        text: 'Hủy',
+                        onPress: () => console.log('Cancel Pressed'),
+                        style: 'cancel',
+                      },
+                      {
+                        text: 'Đồng ý',
+                        onPress: () =>
+                          navigation.navigate(Screens.InputBank, {
+                            bank: item,
+                            data: item,
+                          }),
+                      },
+                    ]
+                  );
+                }
+              } else if (userInfo?.status === 10) {
+                Alert.alert(
+                  'Thông báo',
+                  'Tài khoản của bạn đang trong trạng thái chờ xác nhận. Vui lòng chờ chúng tôi xác nhận thông tin tài khoản của bạn. Để được hỗ trợ liên hệ với chúng tôi qua hotline 1900.633.688.',
+                  [
+                    {
+                      text: 'Gọi',
+                      style: 'cancel',
+                      onPress: () => Linking.openURL('tel:1900633688'),
+                    },
+                    { text: 'Đồng ý' },
+                  ]
+                );
+              }
+            } catch (e) {
+              console.log('e------', e);
+            }
+          }
+        }}
+      />
+      {isLoading && <Loading />}
+    </Container>
+  );
+};