@jescon-technologies/react-native-ui-kit 0.0.3 → 0.0.5

package/src/Custom/CDetailCard.js

@@ -0,0 +1,205 @@
+import React, { useEffect, useState, useRef, memo, useCallback, useMemo } from 'react';
+import { Text, View, Image, TouchableHighlight, TouchableOpacity, TouchableWithoutFeedback, StyleSheet, ImageBackground, FlatList, ActivityIndicator, Platform, TextInput, Alert, ScrollView } from 'react-native';
+import { SwipeListView, SwipeRow } from 'react-native-swipe-list-view';
+import ComponentStyles, { normalize } from '../CommonStyle/componentStyle';
+import  { CButtonShadow , ArrayCheck, getLoading, getProfilecardOnlineStatusBadgeContainer, isBNU, isBNUL, isNU, isNUQ, isNUQZ, notifyMessage, ValueCheck } from '../CommonStyle/ComponentFunctions';
+import { APIURL, EMRAPI } from '../../../../../src/Common/apiConstants';
+import { Global } from '../../../../../src/Common/Global';
+import CVectorIcon from '../CustomComponents/CVectorIcon';
+import { Icons } from '@jescon-technologies/react-native-ui-kit';;
+import HOverlay from '../HOC/HOverlay';
+import Loader from './Loader';
+import { Loader as LoaderLocal } from '../CommonStyle/ComponentFunctions';
+import { NetworkServiceCall } from '@jescon-technologies/react-native-ui-kit';
+import moment from 'moment';
+import ABlink from '../Alerts/ABlink';
+import HOCIcons from '../HOC/HOCIcons';
+import FastImage from 'react-native-fast-image';
+import { Menu, MenuOptions, MenuTrigger } from 'react-native-popup-menu';
+import { useNavigation } from '../Navigation/useNavigation';
+
+
+
+
+export default function CDetailCard(props) {
+
+    const val = props.val;
+    const blockData = props.blockData;
+    const admissiontype = props.admissiontype;
+    const [iconsArr, setIconsArr] = useState([
+        { 'iconname': 'pills', 'stage': 1, 'color': '#F5EEE6', 'selected': false, 'displaytext': 'Prescription' },
+        { 'iconname': 'heartbeat', 'stage': 5, 'color': '#FFF8E3', 'selected': false, 'displaytext': 'Vitals' },
+        { 'iconname': 'user-injured', 'stage': 4, 'color': '#F3D7CA', 'selected': false, 'displaytext': 'Services' },
+        { 'iconname': 'file-medical', 'stage': 0, 'color': '#E6A4B4', 'selected': false, 'displaytext': 'Chart' }]
+    );
+
+    function BackGroundView() {
+
+        return (
+            <View style={{
+                borderRadius: 10,
+                backgroundColor: 'white',
+                height: normalize(35),
+                flexDirection: 'row',
+                borderWidth: 1,
+                borderColor: 'lightgrey',
+                elevation: 5,
+            }}>
+                {isNU(val.item.consultationdate) ?
+                    <>
+                        <View style={{ borderWidth: 0, borderRadius: 10, width: '50%' }}>
+                            <View>
+                                {ValueCheck(blockData.item.leftcontent) ?
+                                    <View style={{ flexDirection: 'row', alignItems: 'center', justifyContent: 'flex-start' }}>
+                                        {isBNUL(iconsArr) ? iconsArr.map((iconsFoot, i) => {
+
+                                            // console.log('iconsArr', val.item.consultationdate)
+                                            return (
+                                                <TouchableOpacity key={i}
+                                                    onPress={() =>
+                                                        props.NavigateToPatientChart(blockData, iconsFoot.stage, true, moment(val.item.consultationdate).format('YYYY-MM-DD'), moment(val.item.consultationdate).format('YYYY-MM-DD'))
+                                                        // moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD')
+                                                    }
+                                                    style={{ backgroundColor: iconsFoot.color, alignItems: 'center', justifyContent: 'center', width: normalize(40), height: normalize(35), borderTopLeftRadius: (i == 0) ? 10 : 0, borderBottomLeftRadius: (i == 0) ? 10 : 0 }} >
+                                                    <View style={{ alignItems: 'center', justifyContent: 'center' }}>
+                                                        <Icons.FontAwesome5 name={iconsFoot.iconname} size={normalize(15)} color={Global.AppTheme.primary_color} style={{}} />
+                                                        <Text style={{ fontSize: normalize(7), fontWeight: 'bold' }}>{iconsFoot.displaytext}</Text>
+                                                    </View>
+                                                </TouchableOpacity>
+                                            );
+                                        }) : null}
+                                    </View>
+                                    : null}
+                            </View>
+                        </View>
+                        <View style={{ borderWidth: 0, width: '50%', alignItems: 'center', justifyContent: 'flex-end', flexDirection: 'row' }}>
+                            <TouchableOpacity
+                                disabled={false}
+                                onPress={() => { props.getXRay(blockData); }}
+                                style={{ height: normalize(35), width: normalize(45), backgroundColor: '#FFC374', alignItems: 'center', justifyContent: 'center', padding: normalize(7), borderWidth: 0 }}
+                            >
+                                <View style={{ alignItems: 'center', justifyContent: 'center' }}>
+                                    <Icons.FontAwesome5 name={'x-ray'} size={normalize(15)} color={Global.AppTheme.primary_color} style={{}} />
+                                    <Text style={{ fontSize: normalize(7), fontWeight: 'bold' }}>{'X-Ray'}</Text>
+                                </View>
+                            </TouchableOpacity>
+
+                            <TouchableOpacity
+                                disabled={blockData.item.hopapatient > 0 ? false : true}
+                                onPress={() => props.getLabResults(blockData, false)}
+                                style={{ height: normalize(45), width: normalize(40), backgroundColor: '#E1F0DA', alignItems: 'center', justifyContent: 'center', borderTopRightRadius: 10, borderBottomRightRadius: 10 }}
+                            >
+                                <View style={{ alignItems: 'center', justifyContent: 'center' }}>
+                                    <Icons.MaterialCommunityIcons name={'test-tube'} size={normalize(20)} color={Global.AppTheme.primary_color} style={{}} />
+                                    <Text adjustsFontSizeToFit style={{ fontSize: normalize(8), fontWeight: 'bold' }}>{'Lab Results'}</Text>
+                                </View>
+                            </TouchableOpacity>
+
+                        </View>
+                    </>
+                    : null}
+            </View>
+        );
+
+    }
+
+    function ForeGroundView() {
+
+        return (
+            <TouchableWithoutFeedback>
+                <View style={{
+                    ...CButtonShadow(),
+                    borderRadius: 10,
+                    backgroundColor: admissiontype == 'IP' ? '#fff6f6' : '#f0f8ff',
+                    height: normalize(35),
+                    flexDirection: 'row',
+                }}>
+                    <View style={{
+                        borderTopLeftRadius: 10,
+                        borderBottomLeftRadius: 10,
+                        width: '5%',
+                        backgroundColor: admissiontype == 'IP' ? 'darkred' : Global.AppTheme.primary_color,
+                        justifyContent: 'space-evenly',
+                        alignItems: 'center',
+                    }}>
+                        <View style={{ flexDirection: 'row', justifyContent: 'center', alignItems: 'center', width: '100%' }}>
+                            {isNU(val.item.consultationdate) ?
+                                <HOCIcons.FontAwesome5
+                                    name={'calendar-alt'}
+                                    size={normalize(10)}
+                                    color={'white'}
+                                />
+                                : null}
+                        </View>
+                        <View style={{ flexDirection: 'row', justifyContent: 'center', alignItems: 'center', width: '100%' }}>
+                            {isNU(val.item.consultantdoctor) ?
+                                <HOCIcons.FontAwesome5
+                                    name={'user-md'}
+                                    size={normalize(10)}
+                                    color={'white'}
+                                />
+                                : null}
+                        </View>
+                    </View>
+                    <View style={{
+                        width: '95%',
+                        justifyContent: 'space-evenly',
+                    }}>
+                        <View style={{ flexDirection: 'row', width: '100%' }}>
+                            <View style={{ flexDirection: 'row', alignItems: 'center', width: '50%' }}>
+                                {/* {isNU(val.item.consultationdate) ?
+                                <HOCIcons.FontAwesome5
+                                    name={'calendar-alt'}
+                                    size={normalize(10)}
+                                    color={'black'}
+                                    style={{ marginHorizontal: normalize(7) }}
+                                />
+                                : null} */}
+                                <Text style={{ color: 'black', fontWeight: 'bold', fontSize: normalize(12) }}>{' '}{isNU(val.item.consultationdate) ? moment(val.item.consultationdate).format('DD-MM-YYYY') : null}</Text>
+                            </View>
+                            <View style={{ flexDirection: 'row', alignItems: 'center', width: '50%', borderWidth: 0 }}>
+                                {isNU(val.item.department) ?
+                                    <HOCIcons.FontAwesome5
+                                        name={'hospital'}
+                                        size={normalize(10)}
+                                        color={'darkblue'}
+                                        style={{ marginHorizontal: normalize(7) }}
+                                    />
+                                    : null}
+                                <Text adjustsFontSizeToFit style={{ color: '#494949', fontWeight: 'bold', fontSize: normalize(10) }}>{isNU(val.item.department) ? val.item.department : null}</Text>
+                            </View>
+                        </View>
+                        <View style={{ flexDirection: 'row', width: '100%', marginTop: normalize(2) }}>
+                            <View style={{ flexDirection: 'row', alignItems: 'center', width: '50%', borderWidth: 0 }}>
+                                {/* {isNU(val.item.consultantdoctor) ?
+                                <HOCIcons.FontAwesome5
+                                    name={'user-md'}
+                                    size={normalize(10)}
+                                    color={'darkblue'}
+                                    style={{ marginHorizontal: normalize(7) }}
+                                />
+                                : null} */}
+                                <Text style={{ color: 'darkblue', fontWeight: 'bold', fontSize: normalize(10) }}>{' '}{isNU(val.item.consultantdoctor) ? val.item.consultantdoctor : null}</Text>
+                            </View>
+
+                        </View>
+                    </View>
+                </View>
+            </TouchableWithoutFeedback>
+        );
+
+    }
+
+    return (
+        <SwipeRow
+            swipeToOpenPercent={1}
+            swipeToClosePercent={1}
+            leftOpenValue={normalize(190)}
+            rightOpenValue={normalize(-190)}
+            style={{ borderRadius: 10, margin: normalize(5) }}
+        >
+            {BackGroundView()}
+            {ForeGroundView()}
+        </SwipeRow>
+    );
+}

package/src/Custom/CHelpImage.js

@@ -0,0 +1,52 @@
+import React, { useState } from 'react';
+import { FlatList, Image, StyleSheet, View } from 'react-native';
+
+export default function CHelpImage() {
+    const [viewHeight, setHeight] = useState(null);
+    return (
+        <View
+            style={styles.container}
+            onLayout={(e) => setHeight(e.nativeEvent.layout.height)}
+        >
+            {viewHeight && (
+                <FlatList
+                    data={data}
+                    pagingEnabled
+                    keyExtractor={(item) => item}
+                    decelerationRate="fast"
+                    renderItem={({ item }) => (
+                        <View style={[styles.item, { height: viewHeight }]}>
+                            <Image style={styles.img} source={{ uri: item }} />
+                        </View>
+                    )}
+                />
+            )}
+        </View>
+    );
+}
+
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+    },
+    item: {
+        backgroundColor: 'transparent',
+        justifyContent: 'center',
+        alignItems:'center',
+    },
+    img: {
+        height: '100%',
+        width: '80%',
+        // resizeMode:''
+    },
+});
+
+const data = [
+    'https://i.ibb.co/7VCPP9D/Screenshot-20210926-161457.jpg',
+    'https://i.ibb.co/hFCBX19/Screenshot-20210926-224423.jpg',
+    'https://i.ibb.co/0njktBc/Screenshot-20210926-224719.jpg',
+    'https://i.ibb.co/ZYqDVjt/Screenshot-20210926-224651.jpg',
+    'https://i.ibb.co/smF0n6c/Screenshot-20210926-225608.jpg',
+    'https://i.ibb.co/sw6FMLR/Screenshot-20210926-224702.jpg',
+    'https://i.ibb.co/g4sQrM6/Screenshot-20210926-224748.jpg',
+];