import React, { useEffect, useRef, useState, useCallback } 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';
import debounce from 'lodash.debounce';
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) =>
{
DB(`
SELECT
s.name
, s.product_uom_qty as qty
, s.price_unit
, s.price_tax
, s.price_total
, s.price_subtotal
, s.product_uom
, u.name->>'en_US' satuan
FROM sale_order_line s
LEFT JOIN uom_uom u ON s.product_uom = u.id
WHERE s.order_id = ${data?.id}
`).then(function (list) {
setDataOrder(data);
setDataOrderList(list);
setShowDetail(true)
})
}}>
{formatDate(data?.date_order).bulan}
{formatDate(data?.date_order).tanggal}
{formatDate(data?.date_order).tahun}
Order : {data?.name}
{data?.cus.toUpperCase()}
Rp {formatNumber(Number(data?.amount_total))}
Created Date
{formatDate(data?.write_date).date}
{`Not Paid Yet`}
)}
)
}
const HistorySreen = () => {
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 [showDetail, setShowDetail]=useState(false);
const [dataOrder, setDataOrder] = useState({})
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 [pagin, setPagin] = useState(0);
const [search, setSearch] = useState('');
const callData = async (pagin=0) => {
let sales: any = await DB(`
SELECT
sa.write_date,
sa.date_order,
sa.name,
sa.access_token as token,
sa.partner_id,
rp.name as cus,
sa.id,
rp.email,
rp.street,
sa.amount_total,
sa.amount_tax,
sa.amount_untaxed,
sa.amount_to_invoice
FROM sale_order sa
LEFT JOIN res_partner rp ON sa.partner_id = rp.id
WHERE lower(rp.name) LIKE '%${search}%'
ORDER BY sa.name DESC LIMIT 10 OFFSET ${pagin}
`);
let salesTotalNumber: any = await DB(`
SELECT
count(*) as total
FROM sale_order sa
`);
setSalesTotal(salesTotalNumber.length > 0 ? Number(salesTotalNumber[0].total):0)
console.log(pagin)
if(pagin == 0){
setContact(sales);
}else{
setContact(contact.concat(sales) );
}
};
cfg.action['history'] = () => {
setPagin(0);
setSearch('')
callData(pagin)
}
useEffect(() => {
(async function () {
callData()
let data: any = await AsyncStorage.getItem('login');
data = JSON.parse(data);
data = data.length > 0 ? data[0] : {};
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;
}
})();
}, [])
const customerBack = function () {
navigation.navigate('home')
}
const onScroll = (event: any) => {
const yOffset = event.nativeEvent.contentOffset.y;
if (yOffset > 190) {
setBgHead(config.color.primary)
} else {
setBgHead(null)
}
};
const debouncedFetchData = useCallback(debounce((query) => {
callData();
}, 300), [callData]);
const handleInputChange = (text:string) => {
setSearch(text);
setPagin(0)
debouncedFetchData(text); // Mengambil data setelah 500ms tidak mengetik
};
return (
<>
{
showDetail === true?
:<>
{nama.toLocaleUpperCase()}
{email}
{`Total\nAll Orders`.toUpperCase()}
{salesTotal}
{`Total\nCash Order`.toUpperCase()}
0
{`Total\nCredit Order`.toUpperCase()}
1
st
Order List
{
let p = pagin+10;
setPagin( p )
callData(p)
}}>
Show More
}
);
};
export default HistorySreen;