108 lines
2.3 KiB
JavaScript
108 lines
2.3 KiB
JavaScript
import React, { useState } from "react";
|
|
import {
|
|
View,
|
|
Text,
|
|
TextInput,
|
|
TouchableOpacity,
|
|
StyleSheet,
|
|
} from "react-native";
|
|
import { Ionicons } from "@expo/vector-icons";
|
|
import { useNavigation } from "@react-navigation/native";
|
|
|
|
const DonasiVerifikasi = () => {
|
|
const navigation = useNavigation();
|
|
const [pin, setPin] = useState("");
|
|
|
|
const handlePinSubmit = () => {
|
|
if (pin.length === 6) {
|
|
alert("Pembayaran Tervalidasi");
|
|
} else {
|
|
alert("PIN harus 6 digit");
|
|
}
|
|
};
|
|
|
|
return (
|
|
<View style={styles.container}>
|
|
<View style={styles.header}>
|
|
<TouchableOpacity
|
|
style={styles.backButton}
|
|
onPress={() => navigation.goBack()}
|
|
>
|
|
<Ionicons name="arrow-back" size={24} color="#333" />
|
|
</TouchableOpacity>
|
|
<Text style={styles.title}>VERIFIKASI PIN</Text>
|
|
</View>
|
|
|
|
<Text style={styles.instructionText}>
|
|
Masukkan PIN Anda untuk melanjutkan pembayaran
|
|
</Text>
|
|
|
|
<TextInput
|
|
style={styles.pinInput}
|
|
secureTextEntry
|
|
keyboardType="numeric"
|
|
maxLength={6}
|
|
placeholder="Masukkan PIN"
|
|
value={pin}
|
|
onChangeText={setPin}
|
|
/>
|
|
|
|
<TouchableOpacity
|
|
style={styles.submitButton}
|
|
// onPress={handlePinSubmit}
|
|
onPress={() => navigation.navigate("Donasiberhasil")}
|
|
>
|
|
<Text style={styles.submitButtonText}>Konfirmasi PIN</Text>
|
|
</TouchableOpacity>
|
|
</View>
|
|
);
|
|
};
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
padding: 20,
|
|
backgroundColor: "#f9f9f9",
|
|
},
|
|
header: {
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
marginBottom: 30,
|
|
marginTop: 30,
|
|
},
|
|
backButton: {
|
|
marginRight: 10,
|
|
},
|
|
title: {
|
|
fontSize: 22,
|
|
fontWeight: "bold",
|
|
color: "#333",
|
|
},
|
|
instructionText: {
|
|
fontSize: 16,
|
|
color: "#666",
|
|
marginVertical: 15,
|
|
},
|
|
pinInput: {
|
|
borderBottomWidth: 2,
|
|
borderColor: "#333",
|
|
fontSize: 20,
|
|
paddingVertical: 10,
|
|
textAlign: "center",
|
|
marginVertical: 20,
|
|
},
|
|
submitButton: {
|
|
backgroundColor: "#2D572C",
|
|
paddingVertical: 15,
|
|
borderRadius: 8,
|
|
alignItems: "center",
|
|
},
|
|
submitButtonText: {
|
|
color: "#fff",
|
|
fontSize: 16,
|
|
fontWeight: "bold",
|
|
},
|
|
});
|
|
|
|
export default DonasiVerifikasi;
|