react-native-timacare 3.1.66 → 3.1.67

package/src/components/ItemTimaOneV3.tsx

@@ -0,0 +1,558 @@
+//@ts-nocheck
+import React from 'react';
+import { TouchableOpacity, View, ViewStyle } from 'react-native';
+import LinearGradient from 'react-native-linear-gradient';
+import { IconMoney2, IconTick } from '../assets/svgs';
+import { formatMoney } from '../utils';
+import { MText } from './MText';
+import {
+  IconStep1,
+  IconStep1Success,
+  IconStep2,
+  IconStep2Disable,
+  IconStep2Success,
+  IconStep3,
+  IconStep3Disable,
+  IconStep3Success,
+  IconStep4,
+  IconStep4Disable,
+  IconStep4Success,
+  IconStep5,
+  IconStep5Disable,
+  IconStep5Success,
+} from '../assets/v3';
+import { Info } from '../assets/icons';
+import { ScreenNames } from '../navigation';
+
+interface IProps {
+  item: any;
+  navigation: any;
+}
+
+const $action: ViewStyle = {
+  flexDirection: 'column',
+  alignItems: 'center',
+  gap: 5,
+};
+
+export default function ItemTimaOneV3({ item, navigation }: IProps) {
+  return (
+    <View
+      style={{
+        backgroundColor: '#FFFFFF',
+        paddingHorizontal: 16,
+        marginBottom: 16,
+        borderRadius: 8,
+        borderWidth: 0.5,
+        borderColor: '#E0E0E0',
+      }}
+    >
+      <LinearGradient
+        colors={
+          item?.listLoanAllAutoDE && item?.listLoanAllAutoDE.length > 0
+            ? ['#4CBA3D', '#98D788']
+            : ['#FF8E4F', '#EF592E']
+        }
+        style={{
+          borderTopLeftRadius: 8,
+          borderTopRightRadius: 8,
+          marginHorizontal: -16,
+        }}
+      >
+        <View
+          style={{
+            flexDirection: 'row',
+            justifyContent: 'space-between',
+            alignItems: 'center',
+            paddingHorizontal: 16,
+            paddingVertical: 8,
+          }}
+        >
+          <View
+            style={{
+              flexDirection: 'row',
+              alignItems: 'center',
+              gap: 8,
+            }}
+          >
+            <IconMoney2 />
+            <MText
+              style={{
+                fontSize: 12,
+                color: 'white',
+              }}
+            >
+              HD-{item?.id}
+            </MText>
+          </View>
+          <MText
+            style={{
+              fontSize: 12,
+              color: 'white',
+              fontWeight: 'bold',
+            }}
+          >
+            {item?.listLoanAllAutoDE && item?.listLoanAllAutoDE.length > 0
+              ? formatMoney(
+                  item?.listLoanAllAutoDE.reduce(
+                    (sum, item) => sum + item.totalMoney,
+                    0
+                  )
+                )
+              : formatMoney(item?.loanAmount)}
+            đ
+          </MText>
+        </View>
+      </LinearGradient>
+
+      {item?.listLoanAllAutoDE && item?.listLoanAllAutoDE.length > 0 && (
+        <View
+          style={{
+            marginHorizontal: -16,
+            backgroundColor: '#ECFFE8',
+            paddingHorizontal: 16,
+            paddingVertical: 8,
+          }}
+        >
+          <View
+            style={{
+              flexDirection: 'row',
+              justifyContent: 'space-between',
+            }}
+          >
+            <MText
+              style={{
+                fontSize: 10,
+                color: '#878787',
+                marginLeft: 24,
+              }}
+            >
+              Số tiền giải ngân
+            </MText>
+            <MText
+              style={{
+                fontSize: 10,
+                color: '#333333',
+              }}
+            >
+              {formatMoney(
+                item?.listLoanAllAutoDE.reduce(
+                  (sum, item) => sum + item.loanAmount,
+                  0
+                )
+              )}{' '}
+              đ
+            </MText>
+          </View>
+          <View
+            style={{
+              flexDirection: 'row',
+              justifyContent: 'space-between',
+              marginTop: 6,
+            }}
+          >
+            <MText
+              style={{
+                fontSize: 10,
+                color: '#878787',
+                marginLeft: 24,
+              }}
+            >
+              Số tiền bảo hiểm
+            </MText>
+            <MText
+              style={{
+                fontSize: 10,
+                color: '#333333',
+              }}
+            >
+              {formatMoney(
+                item?.listLoanAllAutoDE.reduce(
+                  (sum, item) => sum + item.insurenceMoney,
+                  0
+                )
+              )}{' '}
+              đ
+            </MText>
+          </View>
+        </View>
+      )}
+
+      <View
+        style={{
+          flexDirection: 'row',
+          justifyContent: 'space-between',
+          marginTop:
+            item?.listLoanAllAutoDE && item?.listLoanAllAutoDE.length > 0
+              ? 16
+              : 32,
+          paddingHorizontal: 24,
+        }}
+      >
+        {/* Đơn topup = 6 sẽ không có phần thông tin tài sản */}
+        {item?.typeLoan === 5 && (
+          <TouchableOpacity
+            disabled={item?.step > 1}
+            style={$action}
+            onPress={() => {
+              if (item?.step === 0) {
+                navigation.push(ScreenNames.VehicleCamera, {
+                  loan: item,
+                  front: true,
+                });
+              } else {
+                navigation.push(ScreenNames.AssetInformation, {
+                  loan: item,
+                });
+              }
+            }}
+          >
+            {item?.step <= 1 ? <IconStep1 /> : <IconStep1Success />}
+            <MText
+              style={{
+                textAlign: 'center',
+                fontSize: 10,
+                marginTop: 5,
+                color: '#333333',
+              }}
+            >
+              Thông tin{'\n'}tài sản
+            </MText>
+          </TouchableOpacity>
+        )}
+        <TouchableOpacity
+          disabled={item?.step > 3}
+          style={$action}
+          onPress={() => {
+            navigation.push(ScreenNames.ReviewLoan, {
+              loan: item,
+            });
+          }}
+        >
+          {item?.step < 3 ? (
+            <IconStep2Disable />
+          ) : item?.step === 3 ? (
+            <IconStep2 />
+          ) : (
+            <IconStep2Success />
+          )}
+          <MText
+            style={{
+              textAlign: 'center',
+              fontSize: 10,
+              marginTop: 5,
+              color: '#333333',
+            }}
+          >
+            Thông tin{'\n'}khoản vay
+          </MText>
+        </TouchableOpacity>
+        <TouchableOpacity
+          style={$action}
+          onPress={() => {
+            if (item?.step === 4) {
+              navigation.push(ScreenNames.OCR, {
+                loan: item,
+                front: true,
+              });
+            } else if (item?.step === 5) {
+              navigation.push(ScreenNames.ReviewInformation, {
+                loan: item,
+              });
+            } else if (item?.step === 6) {
+              navigation.push(ScreenNames.ReviewInformationOther, {
+                loan: item,
+              });
+            }
+          }}
+        >
+          {item?.step < 4 ? (
+            <IconStep3Disable />
+          ) : item?.step === 4 || item?.step === 5 || item?.step === 6 ? (
+            <IconStep3 />
+          ) : (
+            <IconStep3Success />
+          )}
+          <MText
+            style={{
+              textAlign: 'center',
+              fontSize: 10,
+              marginTop: 5,
+              color: '#333333',
+            }}
+          >
+            Thông tin{'\n'}cá nhân
+          </MText>
+        </TouchableOpacity>
+        <TouchableOpacity
+          disabled={item?.step < 9}
+          style={$action}
+          onPress={() => {
+            navigation.push(ScreenNames.LivenessV2, {
+              loan: item,
+            });
+          }}
+        >
+          {item?.step < 9 ? (
+            <IconStep4Disable />
+          ) : item?.step === 9 ? (
+            <IconStep4 />
+          ) : (
+            <IconStep4Success />
+          )}
+          <MText
+            style={{
+              textAlign: 'center',
+              fontSize: 10,
+              marginTop: 5,
+              color: '#333333',
+            }}
+          >
+            EKYC
+          </MText>
+        </TouchableOpacity>
+        <TouchableOpacity
+          disabled={item?.step < 10}
+          style={$action}
+          onPress={() => {
+            navigation.push(ScreenNames.TTSSignLoan, {
+              loan: item,
+            });
+          }}
+        >
+          {item?.step < 10 ? (
+            <IconStep5Disable />
+          ) : item?.step === 10 ? (
+            <IconStep5 />
+          ) : (
+            <IconStep5Success />
+          )}
+          <MText
+            style={{
+              textAlign: 'center',
+              fontSize: 10,
+              marginTop: 5,
+              color: '#333333',
+            }}
+          >
+            Ký hợp{'\n'}đồng
+          </MText>
+        </TouchableOpacity>
+      </View>
+
+      <View
+        style={{
+          flexDirection: 'row',
+          alignItems: 'center',
+          gap: 8,
+          marginTop: 16,
+          backgroundColor: item?.step === 11 ? '#E8FFE9' : '#FFF2F2',
+          paddingHorizontal: 10,
+          paddingVertical: 10,
+          borderRadius: 4,
+          justifyContent: 'space-between',
+          marginBottom: 16,
+        }}
+      >
+        <View
+          style={{
+            flexDirection: 'row',
+            alignItems: 'center',
+            gap: 8,
+            flex: 1,
+            paddingRight: 24,
+          }}
+        >
+          {item?.step === 8 ? <IconTick /> : <Info />}
+          <MText
+            style={{
+              color: item?.step === 11 ? '#28A745' : '#E40010',
+              fontSize: 10,
+            }}
+          >
+            {item?.step <= 1
+              ? 'Cập nhật thông tin tài sản'
+              : item?.step === 3
+              ? `Cập nhật thông tin khoản vay`
+              : item?.step === 4 || item?.step === 5 || item?.step === 6
+              ? `Cập nhật thông tin cá nhân`
+              : item?.step === 9
+              ? `Tiếp tục eKYC và Ký hợp đồng để${'\n'}giải ngân nhanh nhất`
+              : item?.step === 11
+              ? `Hợp đồng đã ký thành công. Vui lòng chờ chuyên viên tư vấn liên hệ`
+              : 'Đơn vay đang trong quá trình xử lý'}
+          </MText>
+        </View>
+        {item?.step <= 1 ? (
+          <TouchableOpacity
+            onPress={() => {
+              if (item?.step === 0) {
+                navigation.push(ScreenNames.VehicleCamera, {
+                  loan: item,
+                  front: true,
+                });
+              } else {
+                navigation.push(ScreenNames.AssetInformation, {
+                  loan: item,
+                });
+              }
+            }}
+          >
+            <LinearGradient
+              colors={['#FF8E4F', '#EF592E']}
+              style={{
+                height: 24,
+                alignItems: 'center',
+                justifyContent: 'center',
+                borderRadius: 24,
+                paddingHorizontal: 10,
+              }}
+            >
+              <MText
+                style={{
+                  color: 'white',
+                  fontSize: 10,
+                }}
+              >
+                Cập nhật
+              </MText>
+            </LinearGradient>
+          </TouchableOpacity>
+        ) : item?.step === 3 ? (
+          <TouchableOpacity
+            onPress={() => {
+              if (item?.step === 3) {
+                if (item?.typeLoan === 5) {
+                  navigation.push(ScreenNames.ReviewLoan, {
+                    loan: item,
+                  });
+                } else if (item?.typeLoan === 6) {
+                  navigation.push(ScreenNames.TopupLoanInfo, {
+                    loan: item,
+                  });
+                }
+              }
+            }}
+          >
+            <LinearGradient
+              colors={['#FF8E4F', '#EF592E']}
+              style={{
+                height: 24,
+                alignItems: 'center',
+                justifyContent: 'center',
+                borderRadius: 24,
+                paddingHorizontal: 10,
+              }}
+            >
+              <MText
+                style={{
+                  color: 'white',
+                  fontSize: 10,
+                }}
+              >
+                Cập nhật thông tin
+              </MText>
+            </LinearGradient>
+          </TouchableOpacity>
+        ) : item?.step === 4 || item?.step === 5 || item?.step === 6 ? (
+          <TouchableOpacity
+            onPress={() => {
+              if (item?.step === 4) {
+                navigation.push(ScreenNames.OCR, {
+                  loan: item,
+                  front: true,
+                });
+              } else if (item?.step === 5) {
+                navigation.push(ScreenNames.ReviewInformation, {
+                  loan: item,
+                });
+              } else if (item?.step === 6) {
+                navigation.push(ScreenNames.ReviewInformationOther, {
+                  loan: item,
+                });
+              }
+            }}
+          >
+            <LinearGradient
+              colors={['#FF8E4F', '#EF592E']}
+              style={{
+                height: 24,
+                alignItems: 'center',
+                justifyContent: 'center',
+                borderRadius: 24,
+                paddingHorizontal: 10,
+              }}
+            >
+              <MText
+                style={{
+                  color: 'white',
+                  fontSize: 10,
+                }}
+              >
+                Cập nhật thông tin
+              </MText>
+            </LinearGradient>
+          </TouchableOpacity>
+        ) : item?.step === 9 ? (
+          <TouchableOpacity
+            onPress={() => {
+              navigation.push(ScreenNames.LivenessV2, {
+                loan: item,
+              });
+            }}
+          >
+            <LinearGradient
+              colors={['#FF8E4F', '#EF592E']}
+              style={{
+                height: 24,
+                alignItems: 'center',
+                justifyContent: 'center',
+                borderRadius: 24,
+                paddingHorizontal: 10,
+              }}
+            >
+              <MText
+                style={{
+                  color: 'white',
+                  fontSize: 10,
+                }}
+              >
+                Đi tới EKYC
+              </MText>
+            </LinearGradient>
+          </TouchableOpacity>
+        ) : item?.step === 10 ? (
+          <TouchableOpacity
+            onPress={() => {
+              navigation.push(ScreenNames.TTSSignLoan, {
+                loan: item,
+              });
+            }}
+          >
+            <LinearGradient
+              colors={['#FF8E4F', '#EF592E']}
+              style={{
+                height: 24,
+                alignItems: 'center',
+                justifyContent: 'center',
+                borderRadius: 24,
+                paddingHorizontal: 10,
+              }}
+            >
+              <MText
+                style={{
+                  color: 'white',
+                  fontSize: 10,
+                }}
+              >
+                Ký hợp đồng
+              </MText>
+            </LinearGradient>
+          </TouchableOpacity>
+        ) : (
+          <></>
+        )}
+      </View>
+    </View>
+  );
+}

package/src/components/MText.tsx

@@ -10,7 +10,7 @@ export const MText = (props) => {
       style={[
         {
           fontFamily: 'BeVietnamPro-Regular',
-          color: '#211F1F',
+          color: '#333333',
           fontSize: 14,
         },
         props.style,