digikhata-mashreq-sdk 1.0.0 → 1.1.0

package/src/app/screens/ItemEntryDetails.js

@@ -0,0 +1,582 @@
+import {
+    View,
+    Text,
+    StyleSheet,
+    TouchableOpacity,
+    FlatList,
+    Image,
+    SafeAreaView,
+    Dimensions,
+    PermissionsAndroid,
+    Platform,
+    TextInput,
+    Keyboard,
+    Alert
+} from 'react-native';
+import React, {
+    useState,
+    useEffect,
+    useRef,
+    useCallback,
+    useMemo,
+} from 'react';
+import LinearGradient from 'react-native-linear-gradient';
+import Ionicons from 'react-native-vector-icons/Ionicons';
+import { addCommas, COLORS, FONT_BOLD, FONT_MEDIUM, FONT_NORMAL, formatDateTime, isPdfFile, TEXT_SIZES, WP } from '../themes/config';
+import { viewDocument } from '@react-native-documents/viewer'
+import Sound, {
+    AudioEncoderAndroidType,
+    AudioSourceAndroidType,
+    AVEncoderAudioQualityIOSType,
+    AVEncodingOption,
+    RecordBackType,
+    PlayBackType,
+    createSound,
+} from 'react-native-nitro-sound';
+import { useSelector, useDispatch } from "react-redux"
+import LottieView from 'lottie-react-native';
+import { BottomView } from '../components';
+import { getItemDetailsByItemId, getItemsByBusiness, softDeleteItemDetail, updateItemQty } from '../database/stock';
+import { getAllClients, getClientDetails } from '../database/clients';
+import { getClientSummary } from '../database/cash';
+import { CLIENT_DETAILS } from '../redux/reducers/client/client_types';
+
+export default function ItemEntryDetails({ navigation, route }) {
+
+    const selectBusiness = useSelector((state) => state.client.selected_business);
+
+    const animationRef = useRef(null);
+    let itemDetailId = route?.params?.itemDetailId
+    let itemId = route?.params?.itemId
+
+    const dispatch = useDispatch()
+
+
+    const [IsPlaying, setIsPlaying] = useState(false);
+    const [PlayLoading, setPlayLoading] = useState(false);
+    const [Entry, setEntry] = useState(null)
+    const [ItemDetails, setItemDetails] = useState(null)
+    const [BillNo, setBillNo] = useState("");
+    const [CustomerName, setCustomerName] = useState('')
+
+    const clientName = async (id) => {
+        let details = await getClientDetails(id);
+        return details?.type == 2 ? details?.phone : details?.name
+    };
+
+    const onStartPlay = async (fileUrl) => {
+        setPlayLoading(true)
+        // Set up playback progress listener
+        Sound.addPlayBackListener((e) => {
+            console.log('Playback progress:', e.currentPosition, e.duration);
+            setIsPlaying(true)
+            animationRef.current?.play();
+            // setCurrentPosition(e.currentPosition);
+            // setTotalDuration(e.duration);
+            // setPlayTime(Sound.mmssss(Math.floor(e.currentPosition)));
+            // setDuration(Sound.mmssss(Math.floor(e.duration)));
+        });
+
+        // Set up playback end listener
+        Sound.addPlaybackEndListener((e) => {
+            console.log('Playback completed:', e);
+            // Handle playback completion
+            setIsPlaying(false);
+            animationRef.current?.pause();
+            // setCurrentPosition(0);
+        });
+
+        const result = await Sound.startPlayer(fileUrl);
+        setPlayLoading(false)
+        console.log('Playback started:', result);
+    };
+
+    const onStopPlay = async () => {
+        Sound.stopPlayer();
+        Sound.removePlayBackListener();
+        Sound.removePlaybackEndListener();
+
+        animationRef.current?.pause();
+        setIsPlaying(false)
+        setPlayLoading(false)
+    };
+
+    useEffect(() => {
+        const unsubscribe = navigation.addListener('focus', async () => {
+            try {
+                await getItemDetails()
+                getItemDetailsByItemId(itemId)
+                    .then(async (res) => {
+                        let filtered = res?.find((i) => i?.id == itemDetailId);
+                        let billNo = filtered?.details?.split("_")[2]
+                        setBillNo(billNo)
+                        setEntry(filtered)
+                        let customerName = await clientName(filtered?.customerId)
+                        setCustomerName(customerName)
+                    })
+                    .catch((error) => {
+                        console.log('Error fetching item details:', error);
+                    });
+            } catch (error) {
+                console.log('❌ Error fetching item details:', error);
+            }
+        });
+
+        return unsubscribe;
+    }, [navigation]);
+
+    const getItemDetails = async () => {
+        let all = await getItemsByBusiness(selectBusiness?.id);
+        let filtered = all.find((item) => item?.id == itemId);
+        setItemDetails(filtered);
+    };
+
+    const onDeletePress = () => {
+        Alert.alert(
+            'Delete entry?',
+            'Do you want to delete this entry?',
+            [
+                {
+                    text: 'Cancel',
+                    onPress: () => console.log('Cancel'),
+                    style: 'cancel',
+                },
+                {
+                    text: 'Delete',
+                    style: 'destructive', // optional: shows in red on iOS
+                    onPress: async () => {
+                        try {
+
+                            let quantity = Number(Entry?.stockIN) > 0 ? (Number(ItemDetails?.qty) - Number(Entry?.stockIN)) : (Number(ItemDetails?.qty) + Number(Entry?.stockOUT))
+
+                            await softDeleteItemDetail(Entry?.id);
+                            await updateItemQty(ItemDetails?.id, quantity)
+                            navigation.goBack()
+
+                        } catch (err) {
+                            console.log('Error soft deleting transaction:', err);
+                        }
+                    },
+                },
+            ],
+            { cancelable: true }
+        );
+    };
+
+    const onLedgerPress = async () => {
+        let customers = await getAllClients("most_recent", selectBusiness?.id)
+        let CustomerDetails = customers.find((i) => i?.id == Entry?.customerId)
+
+        const summary = await getClientSummary(CustomerDetails);
+
+
+        getClientDetails(CustomerDetails?.id).then((res) => {
+            dispatch({
+                type: CLIENT_DETAILS,
+                payload: res,
+            });
+            // console.log(item,"item")
+            navigation.navigate('CustomerEntries', { homeDetails: summary });
+        });
+    };
+
+    return (
+        <SafeAreaView style={Styles._mainContainer}>
+            <LinearGradient
+                style={Styles._headerMain}
+                start={{ x: 0, y: 0 }}
+                end={{ x: 1, y: 0 }}
+                colors={[COLORS.secondaryColor, COLORS.primaryColor]}
+            >
+                <TouchableOpacity
+                    activeOpacity={0.8}
+                    onPress={() => navigation?.goBack()}
+                >
+                    <Ionicons
+                        name={'chevron-back'}
+                        color={COLORS.whiteColor}
+                        size={25}
+                    />
+                </TouchableOpacity>
+
+                <Text style={Styles._headerTitle}>Entry Detail</Text>
+            </LinearGradient>
+
+            <LinearGradient
+                style={[Styles._headerMain, { height: 30 }]}
+                start={{ x: 0, y: 0 }}
+                end={{ x: 1, y: 0 }}
+                colors={[COLORS.primaryColor, COLORS.secondaryColor]}
+            />
+            <View style={Styles._searchMain}>
+                <View style={Styles._rowMain}>
+                    <View style={{ height: "100%", justifyContent: "center", paddingRight: 10 }}>
+                        <View style={{ width: 50, height: 50, justifyContent: "center", alignItems: "center", backgroundColor: COLORS.lightGrey, borderRadius: 100 }}>
+                            <Ionicons
+                                color={Number(Entry?.stockIN) > 0 ? COLORS.greenColor : COLORS.redColor}
+                                name={Number(Entry?.stockIN) > 0 ? "add-circle-sharp" : "remove-circle-sharp"}
+                                size={35}
+                            />
+                        </View>
+                    </View>
+
+                    <View style={{ width: "60%", height: "100%", justifyContent: "center" }}>
+                        <Text style={Styles._heading}>{ItemDetails?.name}</Text>
+                        <Text style={Styles._date}>{formatDateTime(Entry?.entryDate)}</Text>
+                    </View>
+
+                    <View style={{ width: "25%", height: "100%", justifyContent: "center", alignItems: "flex-end" }}>
+                        <Text style={[Styles._heading, { fontFamily: FONT_BOLD, color: Number(Entry?.stockIN) > 0 ? COLORS.greenColor : COLORS.redColor }]}>{Number(Entry?.stockIN) > 0 ? "+" : "-"} {Number(Entry?.stockIN) > 0 ? String(Entry?.stockIN) : String(Entry?.stockOUT)}</Text>
+                        <Text style={Styles._date}>{ItemDetails?.unit}</Text>
+                    </View>
+                </View>
+
+                <View style={[Styles._rowMain, { flexDirection: "column", justifyContent: "space-around" }]}>
+                    <View style={{ width: "100%", justifyContent: "space-between", flexDirection: "row" }}>
+                        <Text style={Styles._heading2}>{Number(Entry?.stockIN) > 0 ? "Purchase Price" : "Sale Price"}</Text>
+                        <Text style={[Styles._heading, { fontFamily: FONT_BOLD, color: Number(Entry?.stockIN) > 0 ? COLORS.greenColor : COLORS.redColor }]}>Rs {addCommas(Number(Entry?.subamount))}</Text>
+                    </View>
+
+                    <View style={{ width: "100%", justifyContent: "space-between", flexDirection: "row" }}>
+                        <Text style={Styles._heading2}>Amount</Text>
+                        <Text style={[Styles._heading, { fontFamily: FONT_BOLD, color: Number(Entry?.stockIN) > 0 ? COLORS.greenColor : COLORS.redColor }]}>Rs {addCommas(Number(Entry?.amount))}</Text>
+                    </View>
+                </View>
+
+                {
+                    CustomerName &&
+                    <View style={{ width: "100%", justifyContent: "space-between", flexDirection: "row", borderBottomColor: COLORS.lightGray, borderBottomWidth: 1 }}>
+                        <View
+                            style={[
+                                Styles._categoryChip,
+                                {
+                                    backgroundColor: COLORS.whiteColor,
+                                    borderColor: COLORS.primaryColor,
+                                    flexDirection: 'row',
+                                    gap: 5,
+                                    paddingHorizontal: 5,
+                                    marginTop: 15,
+                                    marginBottom: 15,
+                                },
+                            ]}
+                        >
+                            <Ionicons
+                                name={'person-circle-outline'}
+                                color={COLORS.primaryColor}
+                                size={16}
+                            />
+                            <Text style={[Styles._chipText, { color: COLORS.primaryColor }]}>
+                                {CustomerName}
+                            </Text>
+                        </View>
+
+                        <TouchableOpacity
+                            activeOpacity={0.8}
+                            onPress={onLedgerPress}
+                            style={[
+                                Styles._categoryChip,
+                                {
+                                    backgroundColor: COLORS.whiteColor,
+                                    borderColor: COLORS.whiteColor,
+                                    flexDirection: 'row',
+                                    gap: 5,
+                                    paddingHorizontal: 5,
+                                    marginTop: 15,
+                                    marginBottom: 15,
+                                },
+                            ]}
+                        >
+                            <Text style={[Styles._chipText, { color: COLORS.primaryColor }]}>
+                                Ledger
+                            </Text>
+
+                            <Ionicons
+                                name={'chevron-forward'}
+                                color={COLORS.primaryColor}
+                                size={16}
+                            />
+                        </TouchableOpacity>
+                    </View>
+                }
+
+                {
+                    Entry?.details && Entry?.details !== "_bill_" &&
+                    <View style={[Styles._rowMain, { flexDirection: "column", justifyContent: "space-around" }]}>
+                        <View style={{ width: "100%", justifyContent: "space-between", flexDirection: "row" }}>
+                            <Text style={Styles._heading2}>Details</Text>
+                            <Text></Text>
+                        </View>
+
+                        <View style={{ width: "100%", justifyContent: "space-between", flexDirection: "row" }}>
+                            <Text style={Styles._heading}>{Entry?.details?.split("_")[0]}</Text>
+                            <Text></Text>
+                        </View>
+                    </View>
+                }
+                {
+                    BillNo &&
+                    <View style={[Styles._rowMain, { flexDirection: "column", justifyContent: "space-around" }]}>
+                        <View style={{ width: "100%", justifyContent: "space-between", flexDirection: "row" }}>
+                            <Text style={Styles._heading2}>Bill No</Text>
+                            <Text></Text>
+                        </View>
+
+                        <View style={{ width: "100%", justifyContent: "space-between", flexDirection: "row" }}>
+                            <Text style={Styles._heading}>{BillNo}</Text>
+                            <Text></Text>
+                        </View>
+                    </View>
+                }
+
+                {
+                    Entry?.bill &&
+                    <View style={[Styles._rowMain, { flexDirection: "column", justifyContent: "space-around" }]}>
+                        <View style={{ backgroundColor: COLORS.lightGrey, alignSelf: "flex-start", paddingHorizontal: 10, paddingVertical: 4, borderRadius: TEXT_SIZES.BORDER_RADIUS }}>
+                            <Text style={[Styles._date, { color: COLORS.blackColor }]}>Invoice</Text>
+                        </View>
+                    </View>
+                }
+
+                {
+                    Entry?.attachments && Entry?.attachments?.length != 0 &&
+                    <View style={[Styles._rowMain, { flexDirection: "column", justifyContent: "space-around", height: 130 }]}>
+                        <View style={{ width: "100%", justifyContent: "space-between", flexDirection: "row" }}>
+                            <Text style={Styles._heading2}>Attachments</Text>
+                            <Text></Text>
+                        </View>
+                        <View style={{ flexDirection: "row", gap: 10 }}>
+                            {Entry?.attachments?.map((i, index) => (
+                                <TouchableOpacity
+                                    key={index}
+                                    activeOpacity={0.8}
+                                    style={{ width: 80, height: 80, justifyContent: "center", alignItems: "center" }}
+                                    onPress={() => {
+                                        viewDocument({ uri: i?.local_path })
+                                    }}
+                                >
+                                    {isPdfFile(i?.local_path) ? (
+                                        <Ionicons
+                                            name="document-text-outline"
+                                            size={70}
+                                            color={COLORS.primaryColor}
+                                            style={{ margin: 0 }}
+                                        />
+                                    ) : (
+                                        <Image
+                                            source={{ uri: i?.local_path }}
+                                            style={{ width: 70, height: 70, margin: 0, borderRadius: TEXT_SIZES.BORDER_RADIUS }}
+                                            resizeMode="cover"
+                                        />
+                                    )}
+                                </TouchableOpacity>
+                            ))}
+                        </View>
+                    </View>
+                }
+
+                {
+                    Entry?.local_path &&
+                    <View style={[Styles._rowMain, { justifyContent: "center", gap: 20, alignItems: "center", height: 60 }]}>
+                        {
+                            IsPlaying ?
+                                <TouchableOpacity
+                                    activeOpacity={0.8}
+                                    onPress={() => {
+                                        onStopPlay()
+                                    }}
+                                >
+                                    <Ionicons
+                                        name={"pause"}
+                                        color={COLORS.primaryColor}
+                                        size={30}
+                                    />
+                                </TouchableOpacity>
+                                :
+                                <TouchableOpacity
+                                    activeOpacity={0.8}
+                                    onPress={() => {
+                                        onStartPlay(Entry?.local_path)
+                                    }}
+                                >
+                                    <Ionicons
+                                        name={"play"}
+                                        color={COLORS.primaryColor}
+                                        size={30}
+                                    />
+                                </TouchableOpacity>
+                        }
+
+                        <LottieView
+                            source={require('../assets/animations/voice_visualization.json')}
+                            autoPlay={false}
+                            loop
+                            style={{ width: "75%", height: 55, }}
+                            ref={animationRef}
+                        />
+                    </View>
+                }
+
+                <TouchableOpacity
+                    style={[Styles._rowMain, { borderBottomWidth: 0, justifyContent: "center", gap: 5, alignItems: "center", height: 60 }]}
+                    activeOpacity={0.8}
+                    onPress={() => {
+                        if (!Entry?.bill) {
+                            navigation.navigate('OutSell', { type: 'IN', itemId, itemDetailId });
+                        }
+                        else {
+                            Alert.alert(
+                                'Edit from Bill Book Only!',
+                                'You can edit this entry from bill book only',
+                            )
+                        }
+                    }}
+                >
+                    <Ionicons
+                        name={"pencil-outline"}
+                        color={COLORS.primaryColor}
+                        size={25}
+                    />
+                    <Text style={{ color: COLORS.primaryColor, fontFamily: FONT_MEDIUM, fontSize: 16 }}>Edit Entry</Text>
+                </TouchableOpacity>
+            </View>
+
+            <BottomView style={Styles._btnsMain}>
+                <TouchableOpacity
+                    activeOpacity={0.8}
+                    style={Styles._bottomBtn}
+                    onPress={() => {
+                        if (!Entry?.bill) {
+                            onDeletePress()
+                        }
+                        else {
+                            Alert.alert(
+                                'Delete from Bill Book Only!',
+                                'You can delete this entry from bill book only',
+                            )
+                        }
+                    }}
+                >
+                    <Ionicons
+                        name={"trash-outline"}
+                        color={COLORS.redColor}
+                        size={20}
+                    />
+
+                    <Text style={{ color: COLORS.redColor, fontFamily: FONT_MEDIUM, fontSize: TEXT_SIZES.BUTTON_TEXT }}>Delete Entry</Text>
+                </TouchableOpacity>
+            </BottomView>
+        </SafeAreaView>
+    )
+}
+
+const Styles = StyleSheet.create({
+    _mainContainer: {
+        flex: 1,
+        backgroundColor: COLORS.backgroundColor,
+    },
+    _headerMain: {
+        width: WP(100),
+        height: 60,
+        flexDirection: 'row',
+        alignItems: 'center',
+        // justifyContent: "space-between",
+        paddingHorizontal: Platform.OS == 'android' && 10,
+        gap: 15,
+    },
+    _headerTitle: {
+        color: COLORS.whiteColor,
+        fontFamily: FONT_NORMAL,
+        fontSize: 15,
+    },
+    _searchMain: {
+        width: '95%',
+        // height: 500,
+        backgroundColor: COLORS.whiteColor,
+        alignSelf: 'center',
+        position: 'absolute',
+        top: 60,
+        borderRadius: TEXT_SIZES.BORDER_RADIUS,
+        shadowColor: '#000',
+        shadowOffset: {
+            width: 0,
+            height: 2,
+        },
+        shadowOpacity: 0.2,
+        shadowRadius: 3.84,
+        elevation: 5,
+        // alignItems: 'center',
+        overflow: 'hidden',
+        paddingHorizontal: 15,
+        justifyContent: "space-between"
+    },
+    _rowMain: {
+        width: "100%",
+        height: 80,
+        // backgroundColor:"red",
+        flexDirection: "row",
+        paddingVertical: 10,
+        borderBottomColor: COLORS.lightGray,
+        borderBottomWidth: 1
+    },
+    _heading: {
+        fontFamily: FONT_MEDIUM,
+        fontSize: 13,
+        color: COLORS.blackColor
+    },
+    _date: {
+        fontFamily: FONT_NORMAL,
+        fontSize: 13,
+        color: COLORS.gray
+    },
+    _heading2: {
+        fontFamily: FONT_MEDIUM,
+        fontSize: 13,
+        color: COLORS.gray
+    },
+    _btnsMain: {
+        width: WP(100),
+        // height: 70,
+        backgroundColor: COLORS.whiteColor,
+        position: "absolute",
+        // bottom: bottomNavBarH,
+        bottom: 0,
+        flexDirection: "row",
+        justifyContent: "center",
+        alignItems: "center",
+        paddingHorizontal: 10,
+        paddingTop: 8
+    },
+    _bottomBtn: {
+        width: "95%",
+        height: 50,
+        backgroundColor: COLORS.whiteColor,
+        justifyContent: "center",
+        alignItems: "center",
+        flexDirection: "row",
+        borderRadius: TEXT_SIZES.BORDER_RADIUS,
+        borderColor: COLORS.redColor,
+        borderWidth: 1,
+        paddingHorizontal: 20,
+        gap: 10
+    },
+    _categoryChip: {
+        backgroundColor: COLORS.lightGrey,
+        paddingHorizontal: 12,
+        // height: 20,
+        // flexDirection: "row",
+        justifyContent: 'center',
+        alignItems: 'center',
+        borderRadius: 100,
+        borderColor: COLORS.lightGrey,
+        borderWidth: 1,
+        alignSelf: 'flex-start',
+        marginTop: 5,
+        // width:"20%"
+        // gap: 5,
+    },
+    _chipText: {
+        color: COLORS.blackColor,
+        fontFamily: FONT_NORMAL,
+        fontSize: 11,
+    },
+})