add cards to loan order

src/screens/Loan/CreateLoanOrderScreen.js

@@ -54,6 +54,35 @@ const CreateLoanOrderScreen = () => {
   const [workStartedAt, setWorkStartedAt] = useState('');
   const [branchesByRegion, setBranchesByRegion] = useState({});
 
+  // Card info
+  const [cardNumber, setCardNumber] = useState('');
+  const [cardName, setCardName] = useState('');
+  const [cardMonth, setCardMonth] = useState('');
+  const [cardYear, setCardYear] = useState('');
+
+  const monthOptions = Array.from({ length: 12 }, (_, i) => {
+    const val = (i + 1).toString().padStart(2, '0');
+    return { value: val, label: val };
+  });
+
+  const yearOptions = Array.from({ length: 57 }, (_, i) => {
+    const year = 2024 + i;
+    return { value: year.toString(), label: year.toString() };
+  });
+
+  const formatCardNumber = (text) => {
+    const digits = text.replace(/[^0-9]/g, '').slice(0, 16);
+    const parts = [];
+    for (let i = 0; i < digits.length; i += 4) {
+      parts.push(digits.substr(i, 4));
+    }
+    return parts.join('-');
+  };
+
+  const handleCardNumberChange = (text) => {
+    setCardNumber(formatCardNumber(text));
+  };
+
   useEffect(() => {
     if (user) {
       if (user.passport_serie) setPassportSerie(user.passport_serie);
@@ -93,11 +122,17 @@ const CreateLoanOrderScreen = () => {
   const branchOptions = region && branchesByRegion[region] ? branchesByRegion[region].map((b) => ({ label: b.name, value: b.id })) : [];
 
   const handleSubmit = async () => {
-    if (!loanType || !loanAmount || !region || !branchId || !customerName || !customerSurname || !passportSerie || !passportId || !bornAt || !phone || !education || !marriageStatus || !passportAddress || !realAddress) {
+    if (!loanType || !loanAmount || !region || !branchId || !customerName || !customerSurname || !passportSerie || !passportId || !bornAt || !phone || !education || !marriageStatus || !passportAddress || !realAddress || !cardNumber || !cardName || !cardMonth || !cardYear) {
       Alert.alert('Error', 'Fill all required fields');
       return;
     }
 
+    const rawCardNumber = cardNumber.replace(/[^0-9]/g, '');
+    if (rawCardNumber.length !== 16) {
+      Alert.alert('Error', 'Kart belgisi dogry dolduryň (16 sany rakam)');
+      return;
+    }
+
     const payload = {
       loan_type: parseInt(loanType),
       loan_amount: parseInt(loanAmount),
@@ -127,6 +162,10 @@ const CreateLoanOrderScreen = () => {
       work_position: workPosition || null,
       work_salary: workSalary ? parseInt(workSalary) : null,
       work_started_at: workStartedAt || null,
+      card_number: rawCardNumber,
+      card_name: cardName,
+      card_month: cardMonth,
+      card_year: cardYear,
     };
 
     setLoading(true);
@@ -185,6 +224,12 @@ const CreateLoanOrderScreen = () => {
         <Input label="Zähmet haky" value={workSalary} onChangeText={setWorkSalary} keyboardType="numeric" />
         <DateInput label="Işe başlan wagtyňyz" value={workStartedAt} onChange={setWorkStartedAt} />
 
+        {/* Card info */}
+        <Input label="Kart belgisi" placeholder="xxxx-xxxx-xxxx-xxxx" value={cardNumber} onChangeText={handleCardNumberChange} keyboardType="numeric" />
+        <Input label="Kartdaky ady" value={cardName} onChangeText={setCardName} />
+        <SelectInput label="Kart Möhleti (aý)" value={cardMonth} options={monthOptions} onValueChange={setCardMonth} placeholder="Saýla" />
+        <SelectInput label="Kart Möhleti (ýyl)" value={cardYear} options={yearOptions} onValueChange={setCardYear} placeholder="Saýla" />
+
         <TouchableOpacity style={styles.submitBtn} onPress={handleSubmit} disabled={loading}>
           {loading ? <ActivityIndicator color={COLORS.white} /> : <Text style={styles.submitText}>Ýatda sakla</Text>}
         </TouchableOpacity>