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

package/src/CustomComponents/COverlay.js

@@ -0,0 +1,81 @@
+import React, { useState } from 'react';
+import {
+  View,
+  Dimensions,
+  TouchableOpacity,
+  Modal,
+  Pressable,
+  StyleSheet,
+} from 'react-native';
+
+import { normalize } from '../CommonStyle/componentStyle';
+import { Global } from '../../../../../src/Common/Global';
+import { Icons } from '@jescon-technologies/react-native-ui-kit';;
+
+const COverlay = (WrapComponent) => {
+  return function (props) {
+    const [overlay, setOverlay] = useState(true);
+
+    const closeOverlay = () => {
+      setOverlay(false);
+      props?.visibility?.(false);
+    };
+
+    const getPopupContainerStyle = () => ({
+      position: 'absolute',
+      bottom: 0,
+      top: Dimensions.get('screen').height * 0.1,
+      width: Dimensions.get('screen').width,
+      backgroundColor: '#fff',
+      borderTopLeftRadius: 20,
+      borderTopRightRadius: 20,
+      borderWidth: 2,
+      borderColor: '#e0e0e0',
+      paddingHorizontal: normalize(5),
+    });
+
+    return (
+      <Modal
+        visible={overlay}
+        transparent
+        animationType="slide"
+        onRequestClose={closeOverlay}
+      >
+        {/* Background overlay (tap outside to close) */}
+        <Pressable style={styles.backdrop} onPress={closeOverlay} />
+
+        {/* Modal Content */}
+        <View style={getPopupContainerStyle()}>
+          {/* Close Button */}
+          <View style={styles.closeButton}>
+            <TouchableOpacity onPress={closeOverlay}>
+              <Icons.FontAwesome5
+                name="angle-double-down"
+                size={normalize(20)}
+                color={Global.AppTheme.primary_color}
+              />
+            </TouchableOpacity>
+          </View>
+
+          {/* Wrapped Component */}
+          <WrapComponent {...props} />
+        </View>
+      </Modal>
+    );
+  };
+};
+
+export default COverlay;
+
+const styles = StyleSheet.create({
+  backdrop: {
+    flex: 1,
+    backgroundColor: 'rgba(0, 0, 0, 0.20)',
+  },
+  closeButton: {
+    position: 'absolute',
+    right: 10,
+    top: 10,
+    zIndex: 10,
+  },
+});

package/src/CustomComponents/CRemarks.js

@@ -0,0 +1,176 @@
+import React, { useState, useEffect, memo, useContext } from 'react';
+import { Text, View, Image, TouchableOpacity, TextInput, Dimensions } from 'react-native';
+// import {
+//   useDimensions,
+// } from '@react-native-community/hooks';
+import { colors } from '../CommonStyle/commonStyle';
+import ComponentStyles, { normalize } from '../CommonStyle/componentStyle';
+import popupStyles, {
+  getPopupContainerStyle,
+  getPopupTextAreaContainer,
+  getPopupTextAreaChildContainer,
+  getPopupTextAreaStyle,
+} from '../CommonStyle/PopupStyle';
+import Entypo from 'react-native-vector-icons/Entypo';
+import SCheckbox from '../StaticComponents/SCheckBox';
+import CAwesomeButton from './CAwesomeButton';
+import { Global } from '../../../../../src/Common/Global';
+import EmrResponseComponentContext from '../Handlers/emrResponseComponentContext';
+import { ValueCheck } from '../CommonStyle/ComponentFunctions';
+
+function CRemarks(props) {
+  const { width, height } = Dimensions.get('window');
+  const [data, setData] = useState(props.data);
+  const [isShow, setIsShow] = useState(false);
+  const [comment, setComment] = useState('');
+  const [infectioncontrol, setInfectioncontrol] = useState('');
+  const { responseJSON, setResponseJSON } = useContext(EmrResponseComponentContext);
+  var test = [];
+  useEffect(() => {
+    setData(props.data);
+    data.functionname == 'comments' ?
+      (data.comments != null && data.comments != undefined ?
+        setComment(data.comments)
+        : null)
+      :
+      null;
+  }, []);
+
+  console.log('PROPSSSSSSS CREMARKSSSSSSSSSSSSS', JSON.stringify(data));
+
+  const FooterArray = [
+    {
+      key: 1,
+      display: 'Patient',
+      checked: false,
+    },
+    {
+      key: 2,
+      display: 'Doctor',
+      checked: false,
+    },
+    {
+      key: 3,
+      display: 'Nurse',
+      checked: false,
+    },
+    {
+      key: 4,
+      display: 'Staff',
+      checked: false,
+    },
+  ];
+
+
+  function saveRemarks() {
+    if (data.functionname == 'comments') {
+
+
+      setData({ ...data, ['comments']: comment });
+      props.visibility(false);
+      responseJSON.consultationEdit.CommentsString = comment;
+      Global.EditStatus = 1;
+      responseJSON.consultationEdit.editStatus = true;
+
+
+
+    }
+    else {
+      let dataset = {
+
+      };
+      NetworkServiceCall('post', buttonapi, output)
+        .then(function (response) {
+          if (response.httpstatus == 200) {
+          }
+          else {
+            alert('Comment Not Saved');
+          }
+        });
+    }
+  }
+  function ChangeValue(changevalue) {
+    if (data.functionname == 'comments') {
+      setComment(changevalue);
+      data.comments = changevalue;
+    } else {
+      setInfectioncontrol(changevalue);
+    }
+  }
+
+  function getAllTabFunctions(key) {
+    switch (key) {
+      case 'CNI01': saveRemarks();
+        break;
+      case 'CNI02': data.comments && data.comments != null && data.comments.length > 0 || infectioncontrol != null && infectioncontrol != undefined && infectioncontrol.length > 0 ? ChangeValue('') : null;
+        break;
+    }
+  }
+  return (
+    <View style={{ flex: 1, width: '100%' }}>
+      <Text style={[ComponentStyles.popup_heading, { alignSelf: 'center' }]}>{ValueCheck(responseJSON) && ValueCheck(responseJSON.consultationEdit) && ValueCheck(responseJSON.consultationEdit.heading) ? responseJSON.consultationEdit.heading : ''} {'COMMENTS'} </Text>
+      <View
+        style={{
+          flex: 1,
+          alignItems: 'center',
+          marginTop: height * 0.01,
+        }}
+      >
+        <View style={getPopupTextAreaChildContainer(width, height, data.hasOwnProperty('itemedited') && data.itemedited ? colors.color_editedindication_Border : colors.color_componentBordercolor)}>
+          <TextInput
+            editable={true} // To scroll data , Editable is checked in onChangeText props
+            keyboardType={data.hasOwnProperty('keyboardtype') ? data.keyboardtype : 'default'}
+            placeholder={data.hasOwnProperty('iseditable') && data.iseditable ?
+              data.hasOwnProperty('placeholder') && data.placeholder != null && data.placeholder.length > 2 ? data.placeholder : 'Type Here'
+              : ''
+            }
+            placeholderTextColor={'lightgray'}
+            // onChangeText={changevalue => data.hasOwnProperty('iseditable') && data.iseditable ? ChangeValue(changevalue) : null}
+            onChangeText={changevalue => ChangeValue(changevalue)}
+            // value={data.value}
+            value={data.functionname == 'comments' ? comment : infectioncontrol}
+            numberOfLines={5}
+            multiline={true}
+            scrollEnabled
+            style={getPopupTextAreaStyle(width, height)}
+
+          />
+        </View>
+
+        {data.functionname == 'infectioncontrol' ?
+          <View style={{ flexDirection: 'row', justifyContent: 'space-around', width: '100%' }}>
+            {FooterArray.map((data, i) => {
+              return (
+                <View>
+                  <Text>{data.display}</Text>
+                  <SCheckbox
+                    onChangeData={val =>
+                      val == undefined
+                        ? null
+                        : data.checked = val
+                    }
+                    value={data.checked}
+                  />
+                </View>
+              );
+            })}
+          </View> : null}
+      </View>
+
+      <View style={{ flexDirection: 'row' }}>
+        {[{ 'displaytext': 'Insert', 'fontcolor': Global.AppTheme.primary_color, 'shadowcolor': '#eaf2ff', 'size': 10, 'iconname': 'save', 'iconcolor': Global.AppTheme.primary_color, 'selected': false, 'visibility': true, 'iconsize': 20, 'functionid': 'CNI01' },
+        { 'displaytext': 'Clear', 'fontcolor': '#fc6c6c', 'shadowcolor': '#eaf2ff', 'size': 10, 'iconname': 'eraser', 'iconcolor': '#fc6c6c', 'selected': false, 'visibility': true, 'iconsize': 20, 'functionid': 'CNI02' }]
+          .map((item, i) => {
+            return (
+              <View key={i} style={{ borderRadius: normalize(10), paddingLeft: normalize(10) }}>
+                <CAwesomeButton
+                  data={item}
+                  callBack={val => val == undefined ? null : getAllTabFunctions(item.functionid)}
+                />
+              </View>);
+          })}
+      </View>
+    </View>
+  );
+}
+export default memo(CRemarks);

package/src/CustomComponents/CRowAdd.js

@@ -0,0 +1,143 @@
+import React, { useState, useEffect, useContext } from 'react';
+import {
+    Text,
+    TextInput,
+    StyleSheet,
+    View,
+    Image,
+    TouchableOpacity,
+    ScrollView,
+    Dimensions,
+    FlatList,
+    TouchableWithoutFeedback,
+    Switch,
+} from 'react-native';
+import { colors } from '../CommonStyle/commonStyle';
+import ComponentStyles, { normalize } from '../CommonStyle/componentStyle';
+import { Icons } from '@jescon-technologies/react-native-ui-kit';;
+import STimingSwitch from '../StaticComponents/STimingSwitch';
+import { notifyMessage, ValueCheck } from '../CommonStyle/ComponentFunctions';
+import EmrResponseComponentContext from '../Handlers/emrResponseComponentContext';
+
+function CRowAdd(props) {
+    const { responseJSON, setResponseJSON } = useContext(EmrResponseComponentContext);
+    const [componentAccess, setComponentAccess] = useState(0);
+    const [parameterName, setParameterName] = useState('');
+    const [description, setDescription] = useState('');
+    return (
+        <View style={{ flex: 1, width: '97%' }}>
+            <Text style={{ alignSelf: 'center', fontSize: normalize(12), fontWeight: 'bold', marginBottom: normalize(5), marginTop: normalize(-5),color:'darkblue' }}>{ValueCheck(responseJSON) && ValueCheck(responseJSON.consultationEdit) && ValueCheck(responseJSON.consultationEdit.heading) ? responseJSON.consultationEdit.heading + ' PARAMETER' : 'PARAMETER'}</Text>
+
+            <View style={{ flex: 1, marginVertical: 0 }}>
+                <Text style={{ fontSize: normalize(11), paddingHorizontal: normalize(10) }}>Parameter name :</Text>
+
+                <View style={{ borderWidth: 1, height: normalize(35), borderRadius: 7, borderColor: 'lightgrey', backgroundColor: '#fff', elevation: 3 }}>
+                    <TextInput
+                        numberOfLines={1}
+                        keyboardType={'default'}
+                        onChangeText={changevalue => setParameterName(changevalue)}
+                        value={parameterName} />
+                </View>
+
+                <View>
+                    <Text style={{ fontSize: normalize(11), paddingHorizontal: normalize(10) }}>Description:</Text>
+                    <View style={{ borderWidth: 1, height: normalize(35), borderRadius: 7, borderColor: 'lightgrey', backgroundColor: '#fff', elevation: 3 }}
+                    >
+                        <TextInput
+                            numberOfLines={4}
+                            keyboardType={'default'}
+                            placeholder="optional"
+                            onChangeText={changevalue => setDescription(changevalue)}
+                            value={description} />
+                    </View>
+                </View>
+
+                <View style={{ borderWidth: 1, borderRadius: 7, borderColor: 'lightgrey', backgroundColor: '#fff', elevation: 3, paddingVertical: normalize(5), marginTop: normalize(5) }}>
+                    <Text style={{ fontSize: normalize(11), paddingHorizontal: normalize(10) }}>Type of data:</Text>
+                    <STimingSwitch
+                        data={[{
+                            'timingslot': 1,
+                            'slotname': 'Date',
+                            'selected': false,
+                        },
+                        {
+                            'timingslot': 2,
+                            'slotname': 'Value',
+                            'selected': false,
+                        },
+                        {
+                            'timingslot': 3,
+                            'slotname': 'Question',
+                            'selected': false,
+                        },
+                        {
+                            'timingslot': 4,
+                            'slotname': 'Remarks',
+                            'selected': false,
+                        },
+                        {
+                            'timingslot': 5,
+                            'slotname': 'Image',
+                            'selected': false,
+                        },
+                        {
+                            'timingslot': 6,
+                            'slotname': 'Duration',
+                            'selected': false,
+                        },
+                        ]}
+                        callBack={val =>
+                            val == undefined ? null :
+                                setComponentAccess(val)} />
+                </View>
+
+                <View
+                    style={{
+                        position: 'absolute',
+                        bottom: normalize(0),
+                        width: '100%',
+                    }}>
+                    <TouchableOpacity
+                        onPress={() => getAddColumn()}
+                        style={{
+                            borderRadius: 10,
+                            borderWidth: 1,
+                            height: normalize(40),
+                            width: normalize(55),
+                            backgroundColor: '#eaf2ff',
+                            borderColor: 'white',
+                            alignItems: 'center',
+                            justifyContent: 'center',
+                            elevation: 5,
+                            shadowColor: '#000',
+                            shadowOffset: { width: 0, height: 3 },
+                            shadowOpacity: 0.3,
+                            shadowRadius: 5,
+                        }}>
+                        <View style={{ alignItems: 'center', width: normalize(50) }} >
+                            <Icons.FontAwesome5 name="save" color={'#094485'} size={normalize(20)} />
+                            <Text numberOfLines={1} style={{ color: '#094485', fontSize: normalize(10) }}>Select</Text>
+                        </View>
+                    </TouchableOpacity>
+                </View>
+            </View>
+
+        </View>
+    );
+
+    function getAddColumn(params) {
+        if (parameterName != '' && parameterName != undefined && componentAccess != 0) {
+            var call = {
+                'parametername': (parameterName).toUpperCase(),
+                'parameterdescription': description,
+                'columntype': componentAccess.timingslot,
+            };
+            props.callBack(call);
+            props.visibility(false);
+        } else {
+            notifyMessage('Please fill required coulmns',3);
+        }
+    }
+}
+
+export default CRowAdd;