Skip to content

Commit

Permalink
payment screen
Browse files Browse the repository at this point in the history
  • Loading branch information
iamNamNP committed Jul 13, 2022
1 parent e3f88da commit 5ff1715
Show file tree
Hide file tree
Showing 13 changed files with 6,692 additions and 6,879 deletions.
3 changes: 2 additions & 1 deletion android/app/build.gradle
Original file line number Diff line number Diff line change
Expand Up @@ -247,7 +247,7 @@ android {
applicationVariants.all { variant ->
variant.outputs.each { output ->
// For each separate APK per architecture, set a unique version code as described here:
// https://developer.android.com/studio/build/configure-apk-splits.html
// https://developer.android.com/studio/build/configure-apk-splits.htmlcd
// Example: versionCode 1 will generate 1001 for armeabi-v7a, 1002 for x86, etc.
def versionCodes = ["armeabi-v7a": 1, "x86": 2, "arm64-v8a": 3, "x86_64": 4]
def abi = output.getFilter(OutputFile.ABI)
Expand All @@ -264,6 +264,7 @@ dependencies {
implementation fileTree(dir: "libs", include: ["*.jar"])
implementation project(':react-native-vector-icons')
implementation project(':react-native-background-timer')
implementation 'com.google.android.material:material:<version>'

//noinspection GradleDynamicVersion
implementation "com.facebook.react:react-native:+" // From node_modules
Expand Down
35 changes: 35 additions & 0 deletions ios/Podfile.lock
Original file line number Diff line number Diff line change
Expand Up @@ -365,6 +365,27 @@ PODS:
- RNVectorIcons (9.2.0):
- React-Core
- SocketRocket (0.6.0)
- Stripe (22.5.1):
- Stripe/Stripe3DS2 (= 22.5.1)
- StripeApplePay (= 22.5.1)
- StripeCore (= 22.5.1)
- StripeUICore (= 22.5.1)
- stripe-react-native (0.14.0):
- React-Core
- Stripe (~> 22.5.1)
- StripeFinancialConnections (~> 22.5.1)
- Stripe/Stripe3DS2 (22.5.1):
- StripeApplePay (= 22.5.1)
- StripeCore (= 22.5.1)
- StripeUICore (= 22.5.1)
- StripeApplePay (22.5.1):
- StripeCore (= 22.5.1)
- StripeCore (22.5.1)
- StripeFinancialConnections (22.5.1):
- StripeCore (= 22.5.1)
- StripeUICore (= 22.5.1)
- StripeUICore (22.5.1):
- StripeCore (= 22.5.1)
- Yoga (1.14.0)
- YogaKit (1.18.1):
- Yoga (~> 1.14)
Expand Down Expand Up @@ -429,6 +450,7 @@ DEPENDENCIES:
- ReactCommon/turbomodule/core (from `../node_modules/react-native/ReactCommon`)
- RNScreens (from `../node_modules/react-native-screens`)
- RNVectorIcons (from `../node_modules/react-native-vector-icons`)
- "stripe-react-native (from `../node_modules/@stripe/stripe-react-native`)"
- Yoga (from `../node_modules/react-native/ReactCommon/yoga`)

SPEC REPOS:
Expand All @@ -447,6 +469,11 @@ SPEC REPOS:
- libevent
- OpenSSL-Universal
- SocketRocket
- Stripe
- StripeApplePay
- StripeCore
- StripeFinancialConnections
- StripeUICore
- YogaKit

EXTERNAL SOURCES:
Expand Down Expand Up @@ -520,6 +547,8 @@ EXTERNAL SOURCES:
:path: "../node_modules/react-native-screens"
RNVectorIcons:
:path: "../node_modules/react-native-vector-icons"
stripe-react-native:
:path: "../node_modules/@stripe/stripe-react-native"
Yoga:
:path: "../node_modules/react-native/ReactCommon/yoga"

Expand Down Expand Up @@ -573,6 +602,12 @@ SPEC CHECKSUMS:
RNScreens: aa9a97835afbbdc18a4757870b2b59b7d9fae16a
RNVectorIcons: fcc2f6cb32f5735b586e66d14103a74ce6ad61f8
SocketRocket: fccef3f9c5cedea1353a9ef6ada904fde10d6608
Stripe: 2b2decd03146e08a350960966d41f3028c2eac29
stripe-react-native: c90947c1f02761d11622dcb3cd3bd8683916b36b
StripeApplePay: b14f06ac6fc24b56704c1e598149ed0cc45e166f
StripeCore: 4833738f2ca4336712f279f3c2867a0a7eb67c93
StripeFinancialConnections: 982115b82af429968d8aa78d329a42ed7ba3feab
StripeUICore: 08c1efbd7e3c54ee7fa74334a37a1d4c08ba944d
Yoga: 99652481fcd320aefa4a7ef90095b95acd181952
YogaKit: f782866e155069a2cca2517aafea43200b01fd5a

Expand Down
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@
"@react-navigation/native": "^6.0.10",
"@react-navigation/native-stack": "^6.6.2",
"@reduxjs/toolkit": "^1.8.3",
"@stripe/stripe-react-native": "^0.14.0",
"apisauce": "^2.1.5",
"axios": "^0.27.2",
"react": "17.0.2",
Expand Down
16 changes: 9 additions & 7 deletions src/components/orderSuccess/index.tsx
Original file line number Diff line number Diff line change
@@ -1,16 +1,18 @@
import React, {useState} from 'react';
import {StyleSheet, Text, TouchableOpacity, View} from 'react-native';
import {
SafeAreaView,
StyleSheet,
Text,
TouchableOpacity,
View,
} from 'react-native';
import {Modal} from 'react-native-paper';
import {useAppSelector, useAppDispatch} from '../../app/store';
import {setOpenModal} from '../../features/scheduleOverview/scheduleOverviewSlice';
import AppAntDesign from '../../components/icon/AppAntDesign';
import {useNavigation} from '@react-navigation/core';

interface TypeOrderSucees {
title: string;
}

const OrderSuccess: React.FC<TypeOrderSucees> = ({title}) => {
const OrderSuccess = () => {
const openModal = useAppSelector(
state => state.scheduleOverviewSlice.openModal,
);
Expand All @@ -34,7 +36,7 @@ const OrderSuccess: React.FC<TypeOrderSucees> = ({title}) => {
color: '#FF5F24',
fontSize: 14,
}}>
Chúc mừng bạn đã đặt {title} thành công
Chúc mừng bạn đã thanh toán thành công
</Text>

<TouchableOpacity
Expand Down
4 changes: 2 additions & 2 deletions src/features/detail-ver2/popular-place-detail/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -87,11 +87,11 @@ const PopularPlaceDetailV2 = ({route}) => {
<View style={styles.clickFee}>
<TouchableOpacity
style={styles.blockFee}
onPress={() => dispatch(setOpenModal(true))}>
onPress={() => navigation.navigate('Payment' as never)}>
<Text style={styles.colorFee}>Đặt vé</Text>
</TouchableOpacity>
</View>
{openModal && <OrderSuccess title={'vé'} />}
{openModal && <OrderSuccess />}
</View>
);
};
Expand Down
2 changes: 1 addition & 1 deletion src/features/detail-ver2/recent-schedule-detail/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -116,7 +116,7 @@ const RecentScheduleDetailV2 = ({route}) => {
</TouchableOpacity>
</View>
</View>
{openModal && <OrderSuccess title="khách sạn" />}
{openModal && <OrderSuccess />}
</>
);
};
Expand Down
2 changes: 1 addition & 1 deletion src/features/homepage/header/ListMenuIcon.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ const ListMenuIcon = () => {
navigation.navigate('ComboIcon' as never);
}
if (item.id === String(1)) {
navigation.navigate('Profile' as never);
navigation.navigate('Payment' as never);
}
if (item.id === String(3)) {
navigation.navigate('Notification' as never);
Expand Down
6 changes: 5 additions & 1 deletion src/features/login/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,11 @@ const Login = () => {
<Text style={styles.colorSubmit}>Đăng nhập</Text>
</TouchableOpacity>

<TouchableOpacity style={[styles.submit, styles.positionForget]}>
<TouchableOpacity
style={[styles.submit, styles.positionForget]}
onPress={() =>
navigation.navigate('BottomTabNavigation' as never)
}>
<Text style={styles.colorSubmit}>Quên mật khẩu</Text>
</TouchableOpacity>
<TouchableOpacity
Expand Down
16 changes: 16 additions & 0 deletions src/features/payments/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import React from 'react';
import {View} from 'react-native';
import {StripeProvider} from '@stripe/stripe-react-native';
import PaymentDetail from './payment-detail';

const Payment = () => {
return (
<StripeProvider
publishableKey={''}
merchantIdentifier="merchant.identifier">
<PaymentDetail />
</StripeProvider>
);
};

export default Payment;
63 changes: 63 additions & 0 deletions src/features/payments/payment-detail/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
import React from 'react';
import {CardField, useStripe} from '@stripe/stripe-react-native';
import {SafeAreaView, Text, TouchableOpacity, View} from 'react-native';
import {setOpenModal} from '../../scheduleOverview/scheduleOverviewSlice';
import {useAppDispatch, useAppSelector} from '../../../app/store';
import OrderSuccess from '../../../components/orderSuccess';

const PaymentDetail = () => {
const {confirmPayment} = useStripe();
const dispatch = useAppDispatch();
const openModal = useAppSelector(
state => state.scheduleOverviewSlice.openModal,
);

return (
<View
style={{
flex: 1,
justifyContent: 'flex-start',
alignItems: 'center',
paddingHorizontal: 16,
marginTop: 70,
}}>
<Text style={{color: '#FF5F24', fontSize: 19}}>MOBILE BANKING</Text>
<CardField
postalCodeEnabled={true}
placeholders={{
number: '4242 4242 4242 4242',
}}
cardStyle={{
backgroundColor: '#FFFFFF',
textColor: '#000000',
}}
style={{
width: '100%',
height: 50,
marginVertical: 30,
}}
onCardChange={cardDetails => {
console.log('cardDetails', cardDetails);
}}
onFocus={focusedField => {
console.log('focusField', focusedField);
}}
/>
<TouchableOpacity
onPress={() => dispatch(setOpenModal(true))}
style={{
width: '100%',
height: 30,
backgroundColor: '#FF5F24',
justifyContent: 'center',
alignItems: 'center',
borderRadius: 6,
}}>
<Text style={{color: 'white'}}>Thanh Toán </Text>
</TouchableOpacity>
{openModal && <OrderSuccess />}
</View>
);
};

export default PaymentDetail;
4 changes: 1 addition & 3 deletions src/features/scheduleOverview/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,6 @@ import {useNavigation} from '@react-navigation/core';
import AppMaterIcon from '../../components/icon/AppMaterialIcons';
import OrderSuccess from '../../components/orderSuccess';
import {useAppSelector, useAppDispatch} from '../../app/store';
import {setOpenModal} from './scheduleOverviewSlice';

const ScheduleOverview = ({route}) => {
const {item} = route.params;
Expand Down Expand Up @@ -177,12 +176,11 @@ const ScheduleOverview = ({route}) => {
<View style={styles.rightSubmit}>
<TouchableOpacity
style={styles.rightClick}
onPress={() => dispatch(setOpenModal(true))}>
onPress={() => navigation.navigate('Payment' as never)}>
<Text style={styles.colorWhite}>Đặt ngay</Text>
</TouchableOpacity>
</View>
</View>
{openModal && <OrderSuccess title={'Tour'} />}
</View>
);
};
Expand Down
Loading

0 comments on commit 5ff1715

Please sign in to comment.