98 lines
3.6 KiB
TypeScript
98 lines
3.6 KiB
TypeScript
|
import React, { useEffect, useState } from 'react';
|
||
|
|
import { ScrollView, View, Text, Image, TouchableOpacity, BackHandler } from 'react-native';
|
||
|
|
import { FontAwesome, Ionicons } from '@expo/vector-icons';
|
||
|
|
import config from '../../components/data/config.json'
|
||
|
|
import { styles } from '@/components/style/style';
|
||
|
|
import { FAB } from 'react-native-elements';
|
||
|
|
import { useNavigation, NavigationProp, useFocusEffect } from '@react-navigation/native';
|
||
|
|
import { GestureHandlerRootView, TextInput } from 'react-native-gesture-handler';
|
||
|
|
|
||
|
|
const InputData = (props:any) => {
|
||
|
|
|
||
|
|
const TextType = function(){
|
||
|
|
return (<>
|
||
|
|
<TextInput keyboardType="default" style={{
|
||
|
|
height: 40
|
||
|
|
, paddingHorizontal: 15
|
||
|
|
, borderBottomColor: "#fff"
|
||
|
|
, borderBottomWidth: 1
|
||
|
|
, backgroundColor:'#eee'
|
||
|
|
, borderRadius:10
|
||
|
|
}} placeholder={"..."} />
|
||
|
|
</>)
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
return (<>
|
||
|
|
{props && props.type && props.type == 'text'?
|
||
|
|
<TextType/>
|
||
|
|
:
|
||
|
|
<></>
|
||
|
|
}
|
||
|
|
</>)
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
const HorizontalScrollView = () => {
|
||
|
|
const [typeInput, setTypeInput] = useState('text')
|
||
|
|
const navigation = useNavigation<NavigationProp<RootStackParamList>>();
|
||
|
|
|
||
|
|
useFocusEffect(
|
||
|
|
React.useCallback(() => {
|
||
|
|
|
||
|
|
const onBackPress = () => {
|
||
|
|
navigation.navigate("detailcontact");
|
||
|
|
return true; // Prevent default behavior (exit app)
|
||
|
|
};
|
||
|
|
|
||
|
|
BackHandler.addEventListener('hardwareBackPress', onBackPress);
|
||
|
|
navigation.setOptions({ headerLeft: () => null }); // Remove back button
|
||
|
|
|
||
|
|
return () => {
|
||
|
|
BackHandler.removeEventListener('hardwareBackPress', onBackPress);
|
||
|
|
};
|
||
|
|
}, [navigation])
|
||
|
|
);
|
||
|
|
|
||
|
|
const backtoCustomerDetail = function(){
|
||
|
|
navigation.navigate('detailcontact');
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
return (
|
||
|
|
<GestureHandlerRootView>
|
||
|
|
<View style={{height: '100%',backgroundColor:'#ddd',flexDirection:"column"}}>
|
||
|
|
<View style={{flex:1, flexDirection:'column'}}>
|
||
|
|
<View style={{}}>
|
||
|
|
<View style={{flexDirection:'row', alignItems:'flex-end', height:70,backgroundColor:'white'}}>
|
||
|
|
<Text style={{padding:10,paddingHorizontal:16,fontWeight:400,fontSize: 18}}>Nama Perusahaan</Text>
|
||
|
|
</View>
|
||
|
|
</View>
|
||
|
|
<View style={{flex:1, padding:10}}>
|
||
|
|
<InputData type={typeInput} />
|
||
|
|
</View>
|
||
|
|
</View>
|
||
|
|
<View style={{flexDirection:'row', height: 70, padding:5, backgroundColor:'white'}}>
|
||
|
|
<View style={{flex:1}}>
|
||
|
|
<TouchableOpacity>
|
||
|
|
<View style={{padding:10, margin:4, borderRadius:10, backgroundColor: config.color.primary}}>
|
||
|
|
<Text style={{textAlign:"center", fontSize:16, margin:0,color:'white'}}>Simpan</Text>
|
||
|
|
</View>
|
||
|
|
</TouchableOpacity>
|
||
|
|
</View>
|
||
|
|
<View style={{flex:1}}>
|
||
|
|
<TouchableOpacity onPress={backtoCustomerDetail}>
|
||
|
|
<View style={{ padding: 10, margin: 4, borderRadius: 10, backgroundColor: '#ddd' }}>
|
||
|
|
<Text style={{ textAlign: "center", fontSize: 16, margin: 0 }}>Kembali</Text>
|
||
|
|
</View>
|
||
|
|
</TouchableOpacity>
|
||
|
|
</View>
|
||
|
|
</View>
|
||
|
|
</View>
|
||
|
|
</GestureHandlerRootView>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
|
||
|
|
export default HorizontalScrollView;
|