Skip to content

I
InvestCustomer
Commit 85ec6e8d by Giang Tran
Options

Merge branch 'thuynt_change_bank_view' into '08_April' 

fix bug bank dialog

See merge request !3
parents 7e120a1c 966d0e67
Showing with 141 additions and 142 deletions
android/app/BUCK
...@@ -35,12 +35,12 @@ android_library( ...@@ -35,12 +35,12 @@ android_library(
android_build_config( android_build_config(
name = "build_config", name = "build_config",
package = "com.invest", package = "com.dcv.invest",
) )
android_resource( android_resource(
name = "res", name = "res",
package = "com.invest", package = "com.dcv.invest",
res = "src/main/res", res = "src/main/res",
) )
......
android/app/src/main/AndroidManifest.xml
<manifest xmlns:android="http://schemas.android.com/apk/res/android" <manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.invest"> package="com.dcv.invest">
<uses-permission android:name="android.permission.INTERNET" /> <uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.CAMERA"/> <uses-permission android:name="android.permission.CAMERA"/>
......
android/app/src/main/java/com/invest/MainActivity.java → android/app/src/main/java/com/dcv/invest/MainActivity.java
package com.invest; package com.dcv.invest;
import android.os.Bundle; import android.os.Bundle;
import com.facebook.react.ReactActivity; import com.facebook.react.ReactActivity;
import com.zoontek.rnbootsplash.RNBootSplash; import com.zoontek.rnbootsplash.RNBootSplash;
......
android/app/src/main/java/com/invest/MainApplication.java → android/app/src/main/java/com/dcv/invest/MainApplication.java
package com.invest; package com.dcv.invest;
import android.app.Application; import android.app.Application;
import android.content.Context; import android.content.Context;
import com.facebook.react.PackageList; import com.facebook.react.PackageList;
import com.facebook.react.ReactApplication; import com.facebook.react.ReactApplication;
import com.reactnativecommunity.netinfo.NetInfoPackage; import com.reactnativecommunity.netinfo.NetInfoPackage;
import com.zoontek.rnbootsplash.RNBootSplashPackage;
import com.zoontek.rnbootsplash.RNBootSplashPackage;
import com.BV.LinearGradient.LinearGradientPackage;
import com.oblador.vectoricons.VectorIconsPackage;
import com.oblador.vectoricons.VectorIconsPackage;
import com.facebook.react.ReactInstanceManager; import com.facebook.react.ReactInstanceManager;
import com.facebook.react.ReactNativeHost; import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage; import com.facebook.react.ReactPackage;
import com.facebook.soloader.SoLoader; import com.facebook.soloader.SoLoader;
import java.lang.reflect.InvocationTargetException; import java.lang.reflect.InvocationTargetException;
import java.util.List; import java.util.List;
import com.facebook.react.ReactApplication; //<- Dòng này
import com.zoontek.rnbootsplash.RNBootSplashPackage;
public class MainApplication extends Application implements ReactApplication { public class MainApplication extends Application implements ReactApplication {
...@@ -72,7 +66,7 @@ public class MainApplication extends Application implements ReactApplication { ...@@ -72,7 +66,7 @@ public class MainApplication extends Application implements ReactApplication {
We use reflection here to pick up the class that initializes Flipper, We use reflection here to pick up the class that initializes Flipper,
since Flipper library is not available in release mode since Flipper library is not available in release mode
*/ */
Class<?> aClass = Class.forName("com.invest.ReactNativeFlipper"); Class<?> aClass = Class.forName("com.dcv.invest.ReactNativeFlipper");
aClass aClass
.getMethod("initializeFlipper", Context.class, ReactInstanceManager.class) .getMethod("initializeFlipper", Context.class, ReactInstanceManager.class)
.invoke(null, context, reactInstanceManager); .invoke(null, context, reactInstanceManager);
......
ios/Invest/Info.plist
...@@ -44,7 +44,7 @@ ...@@ -44,7 +44,7 @@
<key>NSCameraUsageDescription</key> <key>NSCameraUsageDescription</key>
<string>Accect connect camera</string> <string>Accect connect camera</string>
<key>NSLocationWhenInUseUsageDescription</key> <key>NSLocationWhenInUseUsageDescription</key>
<string></string> <string/>
<key>NSPhotoLibraryUsageDescription</key> <key>NSPhotoLibraryUsageDescription</key>
<string>To upload images</string> <string>To upload images</string>
<key>UIAppFonts</key> <key>UIAppFonts</key>
......
src/Screens/MethodPay/SelectBankModal.js
import React, {useState, useEffect} from 'react'; import React, {useState,useEffect} from 'react';
import { import {
Text, Text,
View, View,
...@@ -8,8 +8,6 @@ import { ...@@ -8,8 +8,6 @@ import {
StyleSheet, StyleSheet,
TextInput, TextInput,
ActivityIndicator, ActivityIndicator,
SafeAreaView,
StatusBar,
} from 'react-native'; } from 'react-native';
import _ from 'lodash'; import _ from 'lodash';
import AntDesign from 'react-native-vector-icons/AntDesign'; import AntDesign from 'react-native-vector-icons/AntDesign';
...@@ -23,16 +21,17 @@ import { ...@@ -23,16 +21,17 @@ import {
} from '../../Config/Functions'; } from '../../Config/Functions';
import I18n from '../../helper/i18/i18n'; import I18n from '../../helper/i18/i18n';
import ItemBank from './ItemBank'; import ItemBank from './ItemBank';
import {SafeAreaView} from 'react-native-safe-area-context';
const SelectBankModal = (props) => { const SelectBankModal = (props) => {
console.log(props); console.log(props)
const [modalVisible, setModalVisible] = useState(false); const [modalVisible, setModalVisible] = useState(false);
const [valueSearch, setValueSearch] = useState(''); const [valueSearch, setValueSearch] = useState('');
const [result, setResult] = useState(props.data); const [result, setResult] = useState(props.data);
const [keySearch, setKeySearch] = useState(''); const [keySearch, setKeySearch] = useState('');
useEffect(() => { useEffect(()=>{
setResult(props.data); setResult(props.data)
}, [props.data]); },[props.data])
const localFilter = (data, allowFields = [], search_text) => { const localFilter = (data, allowFields = [], search_text) => {
if (!data) return []; if (!data) return [];
if (!search_text || search_text === '') return data; if (!search_text || search_text === '') return data;
...@@ -45,10 +44,10 @@ const SelectBankModal = (props) => { ...@@ -45,10 +44,10 @@ const SelectBankModal = (props) => {
let added = false; let added = false;
allowFields.map((param) => { allowFields.map((param) => {
if ( if (
!added && !added &&
(item[param + ''] + '') (item[param + ''] + '')
.toLowerCase() .toLowerCase()
.includes(search_text.toLowerCase()) .includes(search_text.toLowerCase())
) { ) {
result.push(item); result.push(item);
added = true; added = true;
...@@ -60,13 +59,16 @@ const SelectBankModal = (props) => { ...@@ -60,13 +59,16 @@ const SelectBankModal = (props) => {
}; };
const _onSearch = async (keySearch) => { const _onSearch = async (keySearch) => {
const data = props.data const data = props.data
? localFilter(props.data, ['code', 'name'], keySearch).map((x) => ({ ? localFilter(props.data, ['code', 'name'], keySearch)
id: x.id, .map(
code: x.code, (x) => ({
name: x.name, id: x.id,
logo: x.logo, code: x.code,
})) name: x.name,
: []; logo: x.logo,
})
)
: [];
// remove duplicate // remove duplicate
let result = []; let result = [];
...@@ -77,119 +79,124 @@ const SelectBankModal = (props) => { ...@@ -77,119 +79,124 @@ const SelectBankModal = (props) => {
setResult(result); setResult(result);
}; };
const _onPressItem = (item) => { const _onPressItem = (item) => {
console.log('_onPressItem', item); console.log('_onPressItem', item)
props.onPressItem(item); props.onPressItem(item)
setValueSearch(item ? item.name : ''); setValueSearch(item ? item.name : '');
setModalVisible(false); setModalVisible(false);
}; };
return ( return (
<View> <View>
<TouchableOpacity <TouchableOpacity
style={[styles.buttonShowModal]} style={[styles.buttonShowModal]}
onPress={() => { onPress={() => {
setModalVisible(true); setModalVisible(true);
setKeySearch(''); setKeySearch('');
_onSearch(keySearch); _onSearch(keySearch);
}}> }}>
<View style={styles.flexRowJustifyBetween}> <View style={styles.flexRowJustifyBetween}>
<Text <Text
style={[styles.txtTitle, {flex: 1, flexWrap: 'wrap'}]} style={[styles.txtTitle, {flex: 1, flexWrap: 'wrap'}]}
numberOfLines={1} numberOfLines={1}
ellipsizeMode="tail"> ellipsizeMode="tail">
{valueSearch.trim()} {valueSearch.trim()}
</Text> </Text>
<View> <View>
{valueSearch === '' ? ( {valueSearch === '' ? (
<TouchableOpacity <TouchableOpacity
onPress={() => { onPress={() => {
setModalVisible(true); setModalVisible(true);
_onSearch(keySearch); _onSearch(keySearch);
}} }}
hitSlop={{left: WIDTHXD(50), right: WIDTHXD(50)}}> hitSlop={{left: WIDTHXD(50), right: WIDTHXD(50)}}>
<AntDesign <AntDesign
name="search1" name="search1"
size={WIDTHXD(43)} size={WIDTHXD(43)}
color={R.colors.iconGray} color={R.colors.iconGray}
/> />
</TouchableOpacity> </TouchableOpacity>
) : (
<TouchableOpacity
onPress={() => {
_onPressItem(null);
}}
hitSlop={{left: WIDTHXD(50), right: WIDTHXD(50)}}>
<AntDesign
name="close"
size={WIDTHXD(43)}
color={R.colors.iconGray}
/>
</TouchableOpacity>
)}
</View>
</View>
</TouchableOpacity>
<Modal
animated={true}
animationType="fade"
visible={modalVisible}
presentationStyle="pageSheet">
<View style={styles.overViewModal}>
<View style={[styles.container]}>
<View style={styles.viewTitle}>
<Text style={[styles.title]}>{props.title}</Text>
<TouchableOpacity
style={styles.btClose}
onPress={() => setModalVisible(false)}>
<AntDesign
name="close"
size={WIDTHXD(48)}
color={R.colors.black}
/>
</TouchableOpacity>
</View>
<View style={styles.viewContent}>
<View style={styles.inputSearch}>
<TextInput
style={styles.input}
value={keySearch}
placeholder={I18n.t('Search')}
placeholderTextColor={R.colors.color777}
onChangeText={(keySearch) => {
setKeySearch(keySearch);
_onSearch(keySearch);
}}
/>
<AntDesign
name="search1"
size={WIDTHXD(40)}
color={R.colors.gray}
style={{position: 'absolute', left: WIDTHXD(28)}}
/>
</View>
{!_.isEmpty(result) ? (
<View style={styles.viewResult}>
<FlatList
data={result}
extraData={result}
style={styles.flatlist}
renderItem={({item, index}) => (
<ItemBank
item={item}
isEndItem={index == result.length - 1}
onPress={(item) => _onPressItem(item)}
/>
)}
/>
</View>
) : ( ) : (
<Text style={styles.txtEmpty}>{I18n.t('NullDataSearch')}</Text> <TouchableOpacity
onPress={() => {
_onPressItem(null);
}}
hitSlop={{left: WIDTHXD(50), right: WIDTHXD(50)}}>
<AntDesign
name="close"
size={WIDTHXD(43)}
color={R.colors.iconGray}
/>
</TouchableOpacity>
)} )}
</View> </View>
</View> </View>
</View> </TouchableOpacity>
</Modal>
</View> <Modal
animated={true}
animationType="fade"
visible={modalVisible}
>
<SafeAreaView>
<View style={styles.overViewModal}>
<View style={[styles.container]}>
<View style={styles.viewTitle}>
<Text style={[styles.title]}>{props.title}</Text>
<TouchableOpacity
style={styles.btClose}
onPress={() => setModalVisible(false)}>
<AntDesign
name="close"
size={WIDTHXD(48)}
color={R.colors.black}
/>
</TouchableOpacity>
</View>
<View style={styles.viewContent}>
<View style={styles.inputSearch}>
<TextInput
style={styles.input}
value={keySearch}
placeholder={I18n.t('Search')}
placeholderTextColor={R.colors.color777}
onChangeText={(keySearch) => {
setKeySearch(keySearch);
_onSearch(keySearch);
}}
/>
<AntDesign
name="search1"
size={WIDTHXD(40)}
color={R.colors.gray}
style={{position: 'absolute', left: WIDTHXD(28)}}
/>
</View>
{!_.isEmpty(result) ? (
<View style={styles.viewResult}>
<FlatList
data={result}
extraData={result}
style={styles.flatlist}
renderItem={({item, index}) => (
<ItemBank
item={item}
isEndItem = {index == result.length - 1}
onPress={(item) => _onPressItem(item)}
/>
)}
/>
</View>
) : (
<Text style={styles.txtEmpty}>
{I18n.t('NullDataSearch')}
</Text>
)}
</View>
</View>
</View>
</SafeAreaView>
</Modal>
</View>
); );
}; };
...@@ -209,14 +216,14 @@ const styles = StyleSheet.create({ ...@@ -209,14 +216,14 @@ const styles = StyleSheet.create({
viewTitle: { viewTitle: {
width: getWidth(), width: getWidth(),
height: HEIGHTXD(85), height: HEIGHTXD(85),
marginTop: WIDTHXD(90), marginTop: WIDTHXD(30),
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'center', justifyContent: 'center',
position: 'relative', position: 'relative',
}, },
txtTitle: { txtTitle: {
marginRight: WIDTHXD(24), marginRight: WIDTHXD(24),
color: R.colors.black0, color: R.colors.black,
fontSize: getFontXD(42), fontSize: getFontXD(42),
}, },
viewContent: { viewContent: {
...@@ -235,7 +242,7 @@ const styles = StyleSheet.create({ ...@@ -235,7 +242,7 @@ const styles = StyleSheet.create({
}, },
flatlist: { flatlist: {
width: getWidth(), width: getWidth(),
marginBottom: HEIGHTXD(250), marginBottom: HEIGHTXD(300)
}, },
input: { input: {
height: WIDTHXD(99), height: WIDTHXD(99),
...@@ -281,14 +288,12 @@ const styles = StyleSheet.create({ ...@@ -281,14 +288,12 @@ const styles = StyleSheet.create({
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'space-between', justifyContent: 'space-between',
alignItems: 'center', alignItems: 'center',
paddingHorizontal: WIDTHXD(24), paddingHorizontal: WIDTHXD(5),
}, },
overViewModal: { overViewModal: {
height: '100%',
justifyContent: 'center', justifyContent: 'center',
alignItems: 'center', alignItems: 'center',
backgroundColor: '#rgba(0,0,0,0.7)', backgroundColor: '#rgba(0,0,0,0.7)',
margin: 0,
}, },
btClose: { btClose: {
alignSelf: 'center', alignSelf: 'center',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment