@jescon-technologies/react-native-ui-kit 0.0.6 → 0.0.8

package/src/Screens/Dashboard.js

@@ -1,778 +0,0 @@
-import React, { useState, useEffect, useRef, useLayoutEffect, useContext } from 'react';
-import {
-  StyleSheet,
-  Text,
-  View,
-  Dimensions,
-  FlatList,
-  BackHandler,
-  Image,
-  Platform
-} from 'react-native';
-import moment from 'moment';
-import ComponentStyles, { normalize, width } from '../CommonStyle/componentStyle';
-import NetworkServiceCall from '../Common/NetworkServiceCall';
-import { APIURL, BASE_URL } from '../../../../../src/Common/apiConstants';
-import Loader from '../Custom/Loader';
-import { Global } from '../../../../../src/Common/Global';
-import HeaderBlock from './HeaderBlock';
-import CContainerView from '../CustomComponents/CContainerView';
-import CDetailView from '../CustomComponents/CDetailView';
-import CFooterView from '../CustomComponents/CFooterView';
-import {
-  CButtonShadow,
-  CShadowDynamic,
-  getLoading,
-  isBNUL,
-  isNU,
-  notifyMessage,
-} from '../CommonStyle/ComponentFunctions';
-import CCard from '../Custom/CCard';
-import SSearch from '../StaticComponents/SSearch';
-import CBackHandler from '../CustomComponents/CBackHandler';
-import HShadowButton from '../HOC/HShadowButton';
-import CProgressCircle from '../CustomComponents/CProgressCircle';
-import SDatePickerLabel from '../StaticComponents/SDatePickerLabel';
-import { useDataContext } from '../Handlers/ContextBio';
-import { useNavigation } from '../Navigation/useNavigation';
-import { useIsFocused } from '../Navigation/useIsFocused';
-
-export default function Dashboard({ route }) {
-  // State declarations
-  const routeData = route?.params;
-  const [searchWord, setSearchWord] = useState('');
-  const [isLoading, setIsLoading] = useState(false);
-  const { dashData, setDashData } = useDataContext();
-  const [patientdata, setPatientData] = useState();
-  const [index, setIndex] = useState(0);
-  const [refresh, setRefresh] = useState(0);
-  const [SearchRefresh, setSearchRefresh] = useState(0);
-  const isFocused = useIsFocused();
-  const [backHandlerLogOut, setBackHandlerLogOut] = useState(false);
-  const [totalObj, setTotalObj] = useState();
-  const [filter, setFilter] = useState('Patient ID');
-
-  const today = moment().format('YYYY-MM-DD');
-  const [dateData, setDateData] = useState({
-    fromdate: today,
-    todate: today,
-    dateview: false,
-  });
-
-  const navigation = useNavigation();
-  const scrollRef = useRef();
-
-  // Footer menu configuration
-  const FooterArr = [
-    {
-      keyid: 2,
-      icongroup: 5,
-      displaytext: "SEARCH",
-      size: 10,
-      iconname: 'cogs', // perfect for "more"
-      iconcolor: "#F16767",
-      fontcolor: "#F16767",
-      shadowcolor: "#fce0e0",
-      selected: false,
-      visibility: true,
-      iconsize: 20,
-      functionid: "D02",
-      componenttype: "screen",
-      component: "MoreOptionsScreen",
-      procedurename: "rnjrintrpurequestdynamicdetailreport",
-      argumentname: "13",
-      optiondetailhelpurl: "hisfiles/help/video/loginhelp.mp4",
-    },
-    {
-      keyid: 1,
-      icongroup: 3,
-      displaytext: "MENU",
-      size: 10,
-      iconname: "dots-horizontal-circle", // perfect for "more"
-      iconcolor: "#F16767",
-      fontcolor: "#F16767",
-      shadowcolor: "#fce0e0",
-      selected: false,
-      visibility: true,
-      iconsize: 20,
-      functionid: "D01",
-      componenttype: "screen",
-      component: "MoreOptionsScreen",
-      procedurename: "rnjrintrpurequestdynamicdetailreport",
-      argumentname: "13",
-      optiondetailhelpurl: "hisfiles/help/video/loginhelp.mp4",
-      more: true,
-    },
-  ];
-
-  // Effects
-  useEffect(() => {
-    if (routeData?.patientData?.id) {
-      setSearchWord(routeData.patientData.id);
-    }
-  }, [routeData]);
-
-  useEffect(() => {
-    getAllMedicines();
-  }, []);
-
-  useLayoutEffect(() => {
-    FirstGetData();
-  }, []);
-
-  useEffect(() => {
-    if (isFocused) {
-      Global.PatientDetails = null;
-      Global.ChartDataLeft = null;
-      Global.ChartDataAll = null;
-    }
-  }, [isFocused]);
-
-  useEffect(() => {
-    const backAction = () => {
-      if (!navigation.isFocused()) {
-        return false;
-      }
-      else { setBackHandlerLogOut(true) }
-      return true;
-    };
-    const backHandler = BackHandler.addEventListener(
-      'hardwareBackPress', backAction);
-    return () => backHandler.remove();
-  }, [navigation]);
-
-
-  // Functions
-  function FirstGetData() {
-    setIsLoading(true);
-    setIndex(0);
-    setPatientData(null);
-    setDashData();
-    Global.PatientDetails = null;
-    const buttonapi = APIURL + Global.userData.insurancedetailapi
-    console.log('insurancedeetailapi', JSON.stringify(buttonapi))
-    NetworkServiceCall(
-      'get',
-      buttonapi,
-      '',
-    ).then(function (response) {
-      if (response.httpstatus === 200) {
-        let objForProgress = response.data.dashboard.find(
-          val => val.dbname === 'TOTAL',
-        );
-        if (objForProgress !== undefined) {
-          setTotalObj(objForProgress.dbvalue);
-        }
-        setDashData(response.data.dashboard);
-        setPatientData(response.data.datalist);
-        setIsLoading(false);
-      } else {
-        setIsLoading(false);
-        notifyMessage('No Dashboard icons', 4);
-      }
-    });
-
-    getLoading(v => setIsLoading(false));
-  }
-
-  function getAllMedicines() {
-    const buttonapi =
-      "insuranceadvanceget/emrcommonget/exec rndddaconsultationaddparameter 20,''";
-
-    NetworkServiceCall('get', APIURL + buttonapi, '').then(function (response) {
-      if (
-        response.httpstatus === 200 &&
-        isNU(response.data) &&
-        isNU(response.data.data)
-      ) {
-        Global.AllMedicinesArr = response.data.data;
-      }
-    });
-  }
-
-  function getTotalPatientList(data, index, fromdate, todate) {
-    setIndex(index);
-    setIsLoading(true);
-    setPatientData(null);
-
-    const buttonapi = `${APIURL}${data?.dbdetailapi},'${fromdate}','${todate}',${Global?.userData?.suuser}`;
-    console.log('GETTOTALPATIENTLISTAPI', JSON.stringify(buttonapi))
-    NetworkServiceCall('get', buttonapi, '').then(function (response) {
-      if (response.httpstatus === 200) {
-        if (
-          response.data.datalist !== undefined &&
-          response.data.datalist.length > 0
-        ) {
-          setPatientData(response.data.datalist);
-          setDashData(response.data.dashboard);
-          setRefresh(refresh + 1);
-          setIsLoading(false);
-        } else {
-          setIsLoading(false);
-          notifyMessage('No Patients', 3);
-        }
-      } else {
-        setIsLoading(false);
-        notifyMessage('Network Error', 4);
-      }
-    });
-
-    getLoading(v => setIsLoading(false));
-  }
-
-  function getNewUser() {
-    setSearchWord('');
-    setIsLoading(true);
-
-    let buttonapi =
-      filter !== 'Patient ID'
-        ? `${APIURL}insuranceadvanceget/emrcommonget/rnlainsure  ${searchWord},0,${Global.userData.suuser}`
-        : `${APIURL}insuranceadvanceget/emrcommonget/rnlainsure 0,${searchWord},${Global.userData.suuser}`;
-
-    console.log('buttonapi------------', buttonapi)
-    NetworkServiceCall('get', buttonapi, '').then(function (response) {
-      if (response.httpstatus === 200) {
-        if (
-          response.data &&
-          response.data !== null &&
-          response.data.datalist !== undefined &&
-          response.data.datalist.length > 0
-        ) {
-          setIsLoading(false);
-          setPatientData(null);
-          setTimeout(() => {
-            setPatientData(response.data.datalist);
-          });
-        } else {
-          setIsLoading(false);
-          notifyMessage('Please enter valid patient id or mobile number', 3);
-        }
-      } else {
-        setIsLoading(false);
-        notifyMessage('Please enter valid patient id or mobile number', 3);
-      }
-    });
-
-    getLoading(v => setIsLoading(false));
-  }
-
-  function onDetectVisionCameraBarcode(params) {
-    setSearchWord(params.data);
-  }
-
-  function FnNavigate() {
-    if (Platform.OS === "web") return;
-    navigation.navigate('CCaptureImageWithoutEdit', {
-      cameramoduletype: 2,
-      hidebuttons: true,
-      cameratype: 'back',
-      onSelect: s => (s && isNU(s) ? onDetectVisionCameraBarcode(s) : null),
-    });
-  }
-
-  function getFunctions(params) {
-    console.log('getfunctiondashboard---', JSON.stringify(params))
-    if (!params.visibility) {
-      notifyMessage('Incorporate Soon', 5);
-      return;
-    }
-    switch (params.functionid) {
-      case 'D01':
-        navigation.navigate('MoreOptionsScreen')
-        break;
-      case 'D02':
-        navigation.navigate('SearchScreen', { searchKey: 1 });
-        break;
-      default:
-        notifyMessage('Incorporate Soon', 5);
-        break;
-    }
-  }
-
-  function renderItemNew(data) {
-    return (
-      <View style={styles.progressCircleContainer}>
-        <CProgressCircle
-          borderWidth={2}
-          radius={normalize(24)}
-          bgColor={
-            index === data.index ? getColorCodeDashboard(data.item) : null
-          }
-          percent={(data.item.dbvalue / totalObj) * 100}
-          iconname={data.item.iconname ? data.item.iconname : 'file-alt'}
-          iconcolor={
-            index === data.index ? null : getColorCodeDashboard(data.item)
-          }
-          iconsize={normalize(15)}
-          displaytext={isNU(data.item.dbvalue) ? data.item.dbvalue : ''}
-          textFontSize={normalize(15)}
-          textColor={
-            index === data.index ? null : getColorCodeDashboard(data.item)
-          }
-          onCallback={s => {
-            getTotalPatientList(
-              data.item,
-              data.index,
-              dateData.fromdate,
-              dateData.todate,
-            );
-          }}
-        />
-        <Text style={[styles.progressCircleText, { color: index === data.index ? getColorCodeDashboard(data.item) : Global.AppTheme.primary_color }]}>{data.item.dbname}</Text>
-      </View>
-    );
-  }
-
-  function getColorCodeDashboard(params) {
-    switch (params.dbname) {
-      case 'ALLOCATED':
-        return '#28a745';
-      case 'DEALLOCATED':
-        return '#dc3545';
-      case 'CANCELED':
-        return '#fd7e14';
-      case 'TOTAL':
-        return Global.AppTheme.secondary_color;
-      default:
-        return Global.AppTheme.primary_color;
-    }
-  }
-
-  function getFilter(params) {
-    let dayBefore = null;
-
-    const updateDateData = (from, to, dateview = false) => {
-      setDateData(prevState => ({
-        ...prevState,
-        fromdate: from,
-        todate: to,
-        dateview,
-      }));
-    };
-
-    const fetchPatients = (from, to) => {
-      getTotalPatientList(dashData[index], index, from, to);
-    };
-
-    switch (params.datavalue) {
-      case 2: // Today
-        updateDateData(today, today, false);
-        fetchPatients(today, today);
-        break;
-
-      case 3: // Yesterday
-        dayBefore = moment().subtract(1, 'days').format('YYYY-MM-DD');
-        updateDateData(dayBefore, today, false);
-        fetchPatients(dayBefore, today);
-        break;
-
-      case 4: // One week before
-        dayBefore = moment().subtract(7, 'days').format('YYYY-MM-DD');
-        updateDateData(dayBefore, today, false);
-        fetchPatients(dayBefore, today);
-        break;
-
-      case 5: // One month before
-        dayBefore = moment().subtract(1, 'month').format('YYYY-MM-DD');
-        updateDateData(dayBefore, today, false);
-        fetchPatients(dayBefore, today);
-        break;
-
-      case 6: // Six months before
-        dayBefore = moment().subtract(6, 'months').format('YYYY-MM-DD');
-        updateDateData(dayBefore, today, false);
-        fetchPatients(dayBefore, today);
-        break;
-
-      case 7: // One year before
-        dayBefore = moment().subtract(1, 'year').format('YYYY-MM-DD');
-        updateDateData(dayBefore, today, false);
-        fetchPatients(dayBefore, today);
-        break;
-
-      case 8: // Five years before
-        dayBefore = moment().subtract(5, 'years').format('YYYY-MM-DD');
-        updateDateData(dayBefore, today, false);
-        fetchPatients(dayBefore, today);
-        break;
-
-      case 9: // Custom date view
-        if (dateData?.dateview) {
-          fetchPatients(dateData.fromdate, dateData.todate);
-        } else {
-          updateDateData(today, today, true);
-        }
-        break;
-      default:
-        console.error('Unknown datavalue:', params.datavalue);
-        break;
-    }
-  }
-
-  // Render
-  return (
-    <CContainerView>
-      {<HeaderBlock
-        navigation={navigation.navigate}
-        callback={() => {
-          setBackHandlerLogOut(true);
-        }}
-      />}
-
-      <CDetailView hideCard={true} >
-        <View style={styles.detailContainer}>
-          {isBNUL(dashData) && (
-            <FlatList
-              data={dashData}
-              renderItem={renderItemNew}
-              numColumns={4}
-              keyExtractor={(item, index) => 'key' + index}
-              columnWrapperStyle={styles.dashboardColumnWrapper}
-            // refreshControl={
-            //   <RefreshControl
-            //     refreshing={refreshing}
-            //     onRefresh={onRefresh}
-            //     colors={[Global.AppTheme.primary_color]}
-            //     tintColor={Global.AppTheme.primary_color}
-            //   />
-            // }
-            />
-          )}
-
-          {/* Date Search Section */}
-          {isBNUL(dashData) && (
-            <View style={styles.dateSearchContainer}>
-              <SSearch
-                disabled={false}
-                editable={true}
-                dropdownapi={`insurance/emrcommonget/rnddhosudatefilter`}
-                disablesearchcomponent={true}
-                onChangeData={val => val && getFilter(val)}
-              />
-            </View>
-          )}
-
-          {dateData?.dateview && (
-            <View style={styles.datePickerRow}>
-              <View style={styles.datePickerContainer}>
-                <SDatePickerLabel
-                  labeltext={'From Date'}
-                  icon={{
-                    icongroup: 5,
-                    name: 'calendar-alt',
-                    color: Global.AppTheme.primary_color,
-                    size: normalize(15),
-                    style: styles.datePickerIcon,
-                  }}
-                  positionviewstyle={styles.datePickerLabel}
-                  positiontextstyle={styles.datePickerLabelText}
-                  pickerstyle={styles.datePicker}
-                  textstyle={styles.datePickerText}
-                  maximumdate={today}
-                  passingDate={moment(dateData?.fromdate).format('YYYY-MM-DD')}
-                  onChangeData={val =>
-                    val &&
-                    (setDateData(prevState => ({
-                      ...prevState,
-                      fromdate: moment(val).format('YYYY-MM-DD'),
-                    })),
-                      fetchPatients(
-                        moment(val).format('YYYY-MM-DD'),
-                        dateData.todate,
-                      ))
-                  }
-                />
-              </View>
-
-              <View style={styles.datePickerContainer}>
-                <SDatePickerLabel
-                  labeltext={'To Date'}
-                  icon={{
-                    icongroup: 5,
-                    name: 'calendar-alt',
-                    color: Global.AppTheme.primary_color,
-                    size: normalize(15),
-                    style: styles.datePickerIcon,
-                  }}
-                  positionviewstyle={styles.datePickerLabel}
-                  positiontextstyle={styles.datePickerLabelText}
-                  pickerstyle={styles.datePicker}
-                  textstyle={styles.datePickerText}
-                  maximumdate={today}
-                  passingDate={moment(dateData?.todate).format('YYYY-MM-DD')}
-                  onChangeData={val =>
-                    val &&
-                    (setDateData(prevState => ({
-                      ...prevState,
-                      todate: moment(val).format('YYYY-MM-DD'),
-                    })),
-                      fetchPatients(
-                        dateData.fromdate,
-                        moment(val).format('YYYY-MM-DD'),
-                      ))
-                  }
-                />
-              </View>
-            </View>
-          )}
-
-
-          <SSearch
-            editable={true}
-            navigation={navigation.navigate}
-            value={searchWord}
-            visibility={val => val && {}}
-            onChangeText={text => setSearchWord(text)}
-            onChangeData={val => val && setFilter(val.searchparam)}
-            onBarCodeScan={val => val && FnNavigate()}
-            onSearch={val => val && getNewUser()}
-            onRefresh={val => val && setSearchRefresh(SearchRefresh + 1)}
-          />
-
-          {!(isBNUL(dashData) || isLoading) && (
-            <View style={styles.refreshContainer}>
-              <HShadowButton
-                useicon={true}
-                usetext={true}
-                buttonstyle={styles.refreshButton}
-                icongroup={4}
-                iconcolor={Global.AppTheme.primary_color}
-                iconname={'refresh'}
-                iconsize={normalize(22)}
-                iconstyle={styles.refreshIcon}
-                displaytext={'Refresh'}
-                buttonCallback={FirstGetData}
-                textstyle={styles.refreshText}
-              />
-            </View>
-          )}
-        </View>
-
-        {patientdata && patientdata !== undefined && (
-          <View ref={scrollRef} style={styles.patientListContainer}>
-            <CCard
-              filter={filter}
-              search={searchWord}
-              navigation={navigation.navigate}
-              data={patientdata}
-              onRefresh={SearchRefresh}
-              disabled={index === 3}
-            />
-          </View>
-        )}
-      </CDetailView>
-
-      <CFooterView style={styles.footerContainer}>
-        {FooterArr &&
-          FooterArr.map((item, i) => {
-            return item.visibility && (
-              <HShadowButton
-                key={item.keyid || i}
-                useicon={true}
-                usetext={true}
-                disabled={false}
-                buttonstyle={[styles.footerButton, CShadowDynamic(-3, 3, 5, 0, Global.AppTheme.primary_color)]}
-                iconcolor={Global.AppTheme.primary_color}
-                icongroup={item.icongroup || 5}
-                iconname={item.iconname}
-                iconsize={normalize(24)}
-                displaytext={item.displaytext}
-                buttonCallback={() => getFunctions(item)}
-                textstyle={styles.optionText}
-              />
-            )
-          })}
-      </CFooterView>
-
-      {backHandlerLogOut ?
-        <CBackHandler
-          type={6} // 2 for exit/logout
-          callBack={val =>
-            val == undefined
-              ? null
-              : (setBackHandlerLogOut(val), navigation.goBack())
-          }
-          close={val => (val == undefined ? null : setBackHandlerLogOut(val))}
-        /> : null}
-      {isLoading && <Loader displaytext={true} />}
-    </CContainerView>
-  );
-}
-
-const styles = StyleSheet.create({
-  detailContainer: {
-    borderWidth: 0,
-  },
-  progressCircleContainer: {
-    alignItems: 'center',
-    justifyContent: 'center',
-  },
-  progressCircleText: {
-    fontSize: normalize(10),
-    fontWeight: 'bold',
-    paddingVertical: normalize(4),
-  },
-  dashboardColumnWrapper: {
-    justifyContent: 'space-evenly',
-  },
-  dateSearchContainer: {
-    marginTop: normalize(7),
-  },
-  datePickerRow: {
-    flexDirection: 'row',
-    width: '100%',
-    justifyContent: 'space-evenly',
-    marginTop: normalize(7),
-  },
-  datePickerContainer: {
-    borderWidth: 0,
-    width: '47%',
-  },
-  datePickerIcon: {
-    marginHorizontal: normalize(5),
-  },
-  datePickerLabel: {
-    position: 'absolute',
-    top: normalize(-5),
-    left: normalize(7),
-    backgroundColor: 'white',
-    flexDirection: 'row',
-    alignItems: 'center',
-  },
-  datePickerLabelText: {
-    color: Global.AppTheme.primary_color,
-    fontSize: normalize(10),
-    textAlign: 'left',
-    fontWeight: 'normal',
-  },
-  datePicker: {
-    flexDirection: 'row',
-    backgroundColor: '#fff',
-    width: '100%',
-    borderColor: 'grey',
-    borderWidth: 0.5,
-    borderRadius: 5,
-    alignItems: 'center',
-    height: normalize(30),
-    elevation: 2,
-    justifyContent: 'center',
-    marginVertical: normalize(3),
-  },
-  datePickerText: {
-    fontSize: normalize(12),
-    color: 'black',
-    fontWeight: 'bold',
-  },
-  refreshContainer: {
-    borderWidth: 0,
-    width: '100%',
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
-  refreshButton: {
-    margin: normalize(5),
-    borderLeftWidth: 0,
-    borderBottomWidth: 0,
-    borderRadius: 5,
-    borderWidth: 0,
-    borderColor: Global.AppTheme.primary_color,
-    justifyContent: 'center',
-    alignItems: 'center',
-    backgroundColor: 'white',
-    height: normalize(30),
-    width: normalize(60),
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 2,
-    },
-    shadowOpacity: 0.25,
-    shadowRadius: 3.84,
-    elevation: 5,
-  },
-  refreshIcon: {
-    textAlign: 'center',
-    borderWidth: 0,
-  },
-  refreshText: {
-    color: '#B8621B',
-    fontSize: normalize(6),
-    textAlign: 'center',
-    fontWeight: 'normal',
-    lineHeight: normalize(6),
-  },
-  patientListContainer: {
-    flex: 1,
-  },
-  footerContainer: {
-    flexDirection: 'row',
-    alignItems: 'center',
-    justifyContent: 'space-between',
-    paddingHorizontal: 2,
-  },
-  footerButton: {
-    borderRadius: 10,
-    borderWidth: 0.5,
-    height: Dimensions.get('screen').height * 0.054,
-    width: Dimensions.get('screen').height * 0.07,
-    backgroundColor: '#fff',
-    paddingHorizontal: 0,
-    paddingBottom: 0,
-    paddingTop: 0,
-    borderColor: Global.AppTheme.primary_color,
-    justifyContent: 'center',
-    alignItems: 'center',
-    marginHorizontal: normalize(3),
-    elevation: 4, // raiseLevel equivalent for Android
-    shadowColor: '#ffe5e5', // optional for iOS shadow
-    shadowOffset: { width: 0, height: 2 },
-    shadowOpacity: 0.2,
-    shadowRadius: 2,
-  },
-  footerButtonText: {
-    fontSize: normalize(9),
-    textAlign: 'center',
-    alignSelf: 'center',
-  },
-  moreButtonContainer: {
-    borderWidth: 0,
-  },
-  menuOptions: {
-    marginTop: normalize(-52),
-  },
-  moreOptionsContainer: {
-    flexDirection: 'row',
-    flexWrap: 'wrap-reverse',
-    justifyContent: 'flex-end',
-    borderWidth: 0,
-  },
-  menuOption: {
-    marginHorizontal: normalize(3),
-  },
-  subFooterButton: {
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 2,
-    },
-    shadowOpacity: 0.25,
-    shadowRadius: 3.84,
-    elevation: 5,
-    alignItems: 'center',
-    justifyContent: 'center',
-    borderWidth: 1,
-    borderColor: 'lightblue',
-    borderRadius: 10,
-    height: normalize(40),
-    width: normalize(50),
-    marginVertical: normalize(7),
-    backgroundColor: 'white',
-  },
-  optionText: {
-    fontSize: normalize(8),
-    color: Global.AppTheme.primary_color,
-    fontWeight: 'bold',
-    textAlign: 'center',
-    maxWidth: normalize(60),
-  }
-});