130 lines
3.9 KiB
JavaScript
130 lines
3.9 KiB
JavaScript
import React, { useState, useEffect } from 'react';
|
|
import { View, Text, StyleSheet, TouchableOpacity, ActivityIndicator, Alert } from 'react-native';
|
|
import { SafeAreaView } from 'react-native-safe-area-context';
|
|
import { Ionicons } from '@expo/vector-icons';
|
|
import { useNavigation } from '@react-navigation/native';
|
|
import apiService from '../../services/apiService';
|
|
import { COLORS } from '../../constants/colors';
|
|
import Input from '../../components/Input';
|
|
import { StatusBar } from 'expo-status-bar';
|
|
import SelectInput from '../../components/SelectInput';
|
|
import { useAuth } from '../../contexts/AuthContext';
|
|
|
|
const CreateLoanRemainingOrderScreen = () => {
|
|
const navigation = useNavigation();
|
|
const [accountNumber, setAccountNumber] = useState('');
|
|
const [passportSerie, setPassportSerie] = useState('');
|
|
const [passportId, setPassportId] = useState('');
|
|
const [loading, setLoading] = useState(false);
|
|
const { user } = useAuth();
|
|
|
|
useEffect(() => {
|
|
if (user) {
|
|
if (user.passport_serie) setPassportSerie(user.passport_serie);
|
|
if (user.passport_id) setPassportId(String(user.passport_id));
|
|
}
|
|
}, [user]);
|
|
|
|
const PASSPORT_SERIES = ['I-AS','I-MR','II-MR','I-AH','II-AH','I-LB','II-LB','I-BN','II-BN','I-DZ','II-DZ'];
|
|
|
|
const handleSubmit = async () => {
|
|
if (accountNumber.trim().length === 0 || !passportSerie || passportId.trim().length === 0) {
|
|
Alert.alert('Error', 'All fields are required');
|
|
return;
|
|
}
|
|
setLoading(true);
|
|
const res = await apiService.createLoanRemainingOrder(accountNumber.trim(), passportSerie, passportId.trim());
|
|
setLoading(false);
|
|
if (res.success) {
|
|
Alert.alert('Success', res.message || 'Order created successfully', [
|
|
{ text: 'OK', onPress: () => navigation.goBack() },
|
|
]);
|
|
} else {
|
|
Alert.alert('Error', res.error || 'Could not create order');
|
|
}
|
|
};
|
|
|
|
return (
|
|
<SafeAreaView style={styles.container}>
|
|
<StatusBar style="dark" />
|
|
|
|
<View style={styles.inner}>
|
|
<TouchableOpacity style={styles.backBtn} onPress={() => navigation.goBack()}>
|
|
<Ionicons name="arrow-back" size={24} color={COLORS.textPrimary} />
|
|
</TouchableOpacity>
|
|
|
|
<Text style={styles.title}>Täze sargyt</Text>
|
|
|
|
<SelectInput
|
|
label="*Passport seriýasy"
|
|
value={passportSerie}
|
|
onValueChange={setPassportSerie}
|
|
options={PASSPORT_SERIES.map((v) => ({ label: v, value: v }))}
|
|
placeholder="Saýla"
|
|
/>
|
|
|
|
<Input
|
|
label="*Passport belgisi"
|
|
placeholder="123456"
|
|
value={passportId}
|
|
onChangeText={setPassportId}
|
|
keyboardType="numeric"
|
|
/>
|
|
|
|
<Input
|
|
label="Karz hasaby"
|
|
placeholder="1420..."
|
|
value={accountNumber}
|
|
onChangeText={setAccountNumber}
|
|
keyboardType="numeric"
|
|
autoCapitalize="none"
|
|
autoCorrect={false}
|
|
returnKeyType="done"
|
|
/>
|
|
|
|
<TouchableOpacity style={styles.submitBtn} onPress={handleSubmit} disabled={loading}>
|
|
{loading ? (
|
|
<ActivityIndicator color={COLORS.white} />
|
|
) : (
|
|
<Text style={styles.submitText}>Ýatda sakla</Text>
|
|
)}
|
|
</TouchableOpacity>
|
|
</View>
|
|
</SafeAreaView>
|
|
);
|
|
};
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
backgroundColor: COLORS.backgroundSecondary,
|
|
paddingTop: 40,
|
|
},
|
|
inner: {
|
|
flex: 1,
|
|
paddingHorizontal: 24,
|
|
},
|
|
backBtn: {
|
|
marginBottom: 24,
|
|
},
|
|
title: {
|
|
fontSize: 24,
|
|
fontWeight: 'bold',
|
|
color: COLORS.textPrimary,
|
|
marginBottom: 24,
|
|
},
|
|
submitBtn: {
|
|
marginTop: 32,
|
|
backgroundColor: COLORS.primary,
|
|
paddingVertical: 16,
|
|
borderRadius: 8,
|
|
alignItems: 'center',
|
|
},
|
|
submitText: {
|
|
color: COLORS.white,
|
|
fontSize: 16,
|
|
fontWeight: '600',
|
|
},
|
|
});
|
|
|
|
export default CreateLoanRemainingOrderScreen;
|