import React, { useEffect, useRef, useState } from 'react'; import { ScrollView, View, Text, Image, TouchableOpacity, BackHandler, Dimensions, ImageBackground } from 'react-native'; import { Ionicons } from '@expo/vector-icons'; import config from '../../components/data/config.json' import { styles } from '@/components/style/style'; import { useNavigation, NavigationProp, useFocusEffect } from '@react-navigation/native'; import { GestureHandlerRootView, TextInput } from 'react-native-gesture-handler'; import AsyncStorage from '@react-native-async-storage/async-storage'; import { cfg, getStorage } from '@/components/lib/cfg'; import { DB } from '@/components/lib/db'; import DetailOrder from '@/components/pageComponent/detailOrder'; const formatNumber = function (number: any) { return number.toLocaleString('id-ID', { minimumFractionDigits: 0, maximumFractionDigits: 0 }); } function formatDate(dateString: any) { const months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]; // Parse the date string const date = new Date(dateString); // Extract year, month, and date const year = date.getFullYear(); const month = months[date.getMonth()]; const day = String(date.getDate()).padStart(2, '0'); // Format the date string const formattedDate = `${day} ${month} ${year}`; // Return the object with the desired structure return { bulan: month, tanggal: day, tahun: year, date: formattedDate }; } const Contact = ({ data: mapOfData, setDataOrder, setDataOrderList, setShowDetail }: any) => { return ( <> {(Array.isArray(mapOfData) ? mapOfData : []).map((data: any, key: number) => {formatDate(data?.payment_date).bulan} {formatDate(data?.payment_date).tanggal} {formatDate(data?.payment_date).tahun} Invoice : {data?.payment_reference} {data?.nama_user} Rp {formatNumber(Number(data?.total_pembayaran))} Tanggal Dibuat {formatDate(data?.payment_date).date} {data?.lunas ? 'Lunas' :`Parsial`} )} ) } const OrderLunasSreen = () => { const [bgHead, setBgHead] = useState(null) const [nama, setNama] = useState('John Doe'); const [Id, setId] = useState('John Doe'); const [formTitle, setFormTitle] = useState('Perusahaan'); const [formArea, setFormArea] = useState('none'); const [email, setEmail] = useState('example@mail.com'); const [inputVal, setInputVal] = useState(''); const [formName, setFormName] = useState(''); const [datatext, setDataText] = useState('example@mail.com'); const inputRef = useRef(null); // Create a ref for the TextInput let heightWIndow = Dimensions.get('window').height + 80; const [contact, setContact] = useState([]); const [salesTotal, setSalesTotal] = useState(0); const [salesTotal2, setSalesTotal2] = useState(0); const [showDetail, setShowDetail] = useState(false); const [dataOrder, setDataOrder] = useState({}); const [dataForm, setDataForm] = useState(false); const [dataOrderList, setDataOrderList] = useState([]) const [produk, setProduk] = useState<{ name: string , value: string }[]>([]); const navigation = useNavigation>(); useFocusEffect( React.useCallback(() => { const onBackPress = () => { if (showDetail === true) { setShowDetail(false) } else { navigation.navigate("home"); } return true; // Prevent default behavior (exit app) }; BackHandler.addEventListener('hardwareBackPress', onBackPress); navigation.setOptions({ headerLeft: () => null }); // Remove back button return () => { BackHandler.removeEventListener('hardwareBackPress', onBackPress); }; }, [navigation, showDetail, setShowDetail]) ); const callData = async () => { let data : any = await AsyncStorage.getItem('login'); data = JSON.parse(data); data = data.length > 0 ? data[0] : {}; let sales: any = await DB(` SELECT * FROM view_sales_payment_status `); let [salesLunas]: any = await DB(` SELECT count(*) total FROM view_sales_payment_status_lunas `); let [salesPasial]: any = await DB(` SELECT count(*) total FROM view_sales_payment_status_parsial `); setSalesTotal(Number(salesLunas?.total)) setSalesTotal2(Number(salesPasial?.total)) setId(data?.id) setNama(data?.name) setEmail("Salesman") let country = 'Indonesia'; if (data?.country_id) { const negara: any = await getStorage('negara') const [{ name }] = negara.filter((s: any) => s?.id == data?.country_id); country = name; } setContact(sales); }; cfg.action['history'] = () => { callData() } useEffect(() => { (function () { callData() })(); }, []) const customerBack = function () { navigation.navigate('home') } const fabAction = function () { // console.log("action") } const onScroll = (event: any) => { const yOffset = event.nativeEvent.contentOffset.y; if (yOffset > 190) { setBgHead(config.color.primary) } else { setBgHead(null) } }; return ( <> { showDetail === true ? : <> {dataForm? <> :<> {nama.toLocaleUpperCase()} {email} {(`total\nPelunasan Lunas`).toUpperCase()} {salesTotal} {(`total\nPelunasan Parsial`).toUpperCase()} {salesTotal2} List Order Lunas } } ); }; export default OrderLunasSreen;