card order ready

2025-07-09 11:46:20 +05:00
parent 6044d5ae78
commit 4dce2a6d63
12 changed files with 538 additions and 16 deletions
--- a/src/screens/Card/CardOrdersScreen.js
+++ b/src/screens/Card/CardOrdersScreen.js
@@ -0,0 +1,84 @@
+import React, { useCallback, useState } from 'react';
+import { View, Text, StyleSheet, FlatList, TouchableOpacity, ActivityIndicator, RefreshControl, SafeAreaView } from 'react-native';
+import { Ionicons } from '@expo/vector-icons';
+import { useNavigation, useFocusEffect } from '@react-navigation/native';
+import { StatusBar } from 'expo-status-bar';
+import apiService from '../../services/apiService';
+import { COLORS } from '../../constants/colors';
+import { useBaseEnums } from '../../contexts/BaseEnumsContext';
+
+const CARD_BG = '#EFF6FF';
+const CIRCLE_BG = '#7FB3FF';
+
+const CardOrdersScreen = () => {
+  const navigation = useNavigation();
+  const [orders,setOrders] = useState([]);
+  const [loading,setLoading]=useState(true);
+  const [refreshing,setRefreshing]=useState(false);
+  const { getLabel } = useBaseEnums();
+
+  const fetchData = async()=>{
+    try{
+      const res = await apiService.getCardOrders();
+      if(res.success) setOrders(Array.isArray(res.data)?res.data:[]);
+      else console.warn(res.error);
+    }catch(e){ console.warn(e.message);} finally {setLoading(false); setRefreshing(false);} };
+
+  useFocusEffect(useCallback(()=>{ fetchData(); },[]));
+
+  const onRefresh = ()=>{ setRefreshing(true); fetchData(); };
+
+  const handlePress = (item)=>{ navigation.navigate('CardOrderDetails',{orderId:item.id}); };
+
+  const renderItem=({item})=>{
+    const created = item.created_at? new Date(item.created_at).toLocaleDateString():'';
+    return (
+      <TouchableOpacity style={styles.card} onPress={()=>handlePress(item)}>
+        <View style={styles.circle}><Text style={styles.circleText}>{item.id}</Text></View>
+        <View style={styles.content}>
+          <Text style={styles.titleText}>{item.unique_id}</Text>
+          <Text style={styles.line}>Kart görnüşi: {getLabel('card_types',item.card_type_id)}</Text>
+          <Text style={styles.line}>Tölenildi: {item.paid? 'Hawa':'Ýok'}</Text>
+          <Text style={styles.status}>{item.status}</Text>
+          <Text style={styles.date}>{created}</Text>
+        </View>
+      </TouchableOpacity>
+    ); };
+
+  if(loading) return <View style={styles.center}><ActivityIndicator size="large" color={COLORS.primary}/></View>;
+
+  return (
+    <SafeAreaView style={styles.container}>
+      <StatusBar style="dark" />
+      <View style={styles.header}>
+        <TouchableOpacity onPress={()=>navigation.goBack()} style={{paddingRight:12}}>
+          <Ionicons name="arrow-back" size={24} color={COLORS.textPrimary}/>
+        </TouchableOpacity>
+        <Text style={styles.headerTitle}>Täze kart sargytlary</Text>
+      </View>
+      <FlatList data={orders} keyExtractor={i=>i.id.toString()} renderItem={renderItem} refreshControl={<RefreshControl refreshing={refreshing} onRefresh={onRefresh}/>} contentContainerStyle={orders.length===0 && styles.empty} ListEmptyComponent={<Text style={styles.emptyText}>Sargyt ýok</Text>} />
+      <TouchableOpacity style={styles.fab} onPress={()=>navigation.navigate('CreateCardOrder')}>
+        <Ionicons name="add" size={28} color={COLORS.white}/>
+      </TouchableOpacity>
+    </SafeAreaView>
+  ); };
+
+const styles = StyleSheet.create({
+  container:{flex:1,backgroundColor:COLORS.backgroundSecondary},
+  header:{flexDirection:'row',alignItems:'center',paddingHorizontal:24,paddingVertical:16},
+  headerTitle:{fontSize:20,fontWeight:'bold',color:COLORS.textPrimary},
+  center:{flex:1,justifyContent:'center',alignItems:'center'},
+  card:{flexDirection:'row',backgroundColor:CARD_BG,marginHorizontal:24,marginTop:16,borderRadius:12,padding:16},
+  circle:{width:40,height:40,borderRadius:20,backgroundColor:CIRCLE_BG,alignItems:'center',justifyContent:'center',marginRight:16},
+  circleText:{color:COLORS.white,fontWeight:'600'},
+  content:{flex:1},
+  titleText:{fontWeight:'700',color:COLORS.textPrimary},
+  line:{fontSize:12,color:COLORS.textSecondary},
+  status:{fontSize:13,fontWeight:'600',marginTop:2},
+  date:{fontSize:11,color:COLORS.textSecondary},
+  fab:{position:'absolute',bottom:32,right:32,width:56,height:56,borderRadius:28,backgroundColor:COLORS.primary,alignItems:'center',justifyContent:'center',elevation:4},
+  empty:{flex:1,justifyContent:'center',alignItems:'center'},
+  emptyText:{color:COLORS.textSecondary,fontSize:16},
+});
+
+export default CardOrdersScreen;