diff --git a/components/labor-allocations-table/labor-allocations-table.component.jsx b/components/labor-allocations-table/labor-allocations-table.component.jsx index d26c06f..e9ab057 100644 --- a/components/labor-allocations-table/labor-allocations-table.component.jsx +++ b/components/labor-allocations-table/labor-allocations-table.component.jsx @@ -2,7 +2,7 @@ import React, { useEffect, useMemo, useState } from "react"; import { useTranslation } from "react-i18next"; import { FlatList, RefreshControl, StyleSheet, Text, View } from "react-native"; import _ from "lodash"; -import { Card, DataTable, Divider } from "react-native-paper"; +import { ActivityIndicator, Card, DataTable, Divider } from "react-native-paper"; import { GET_LINE_TICKET_BY_PK } from "../../graphql/jobs.queries"; import ErrorDisplay from "../error-display/error-display.component"; import { useQuery } from "@apollo/client"; @@ -17,13 +17,13 @@ const mapStateToProps = createStructuredSelector({ technician: selectCurrentEmployee, }); -export function LaborAllocationsTable({ jobId, bodyshop, technician,costCenterDiff,selectedCostCenter}) { +export function LaborAllocationsTable({ jobId, bodyshop, technician,costCenterDiff,selectedCostCenter, style, shouldRefresh}) { // console.log("LaborAllocationsTable, costCenterDiff", costCenterDiff); // console.log("LaborAllocationsTable, selectedCostCenter", selectedCostCenter); const { t } = useTranslation(); const onRefresh = async () => { - // console.log("LaborAllocationsTable refetch"); + // console.log("LaborAllocationsTable refetch"); return refetch(); }; @@ -33,14 +33,16 @@ export function LaborAllocationsTable({ jobId, bodyshop, technician,costCenterDi fetchPolicy: "network-only", nextFetchPolicy: "network-only", }); + // console.log("LaborAllocationsTable, data", data); if (error) return ; + // if (loading) return ; const [totals, setTotals] = useState([]); - useEffect(() => { - // console.log("LaborAllocationsTable useEffect on data change"); - }, [data]); + // useEffect(() => { + // // console.log("LaborAllocationsTable useEffect on data change"); + // }, [data]); useEffect(() => { // console.log("LaborAllocationsTable useEffect on [all inputs] change",data?.joblines,data?.adjustments); @@ -65,7 +67,12 @@ export function LaborAllocationsTable({ jobId, bodyshop, technician,costCenterDi ); } if (!jobId) setTotals([]); - }, [data?.joblines, data?.timetickets, bodyshop, data?.adjustments, jobId,selectedCostCenter]); + }, [data?.joblines, data?.timetickets, bodyshop, data?.adjustments, jobId, selectedCostCenter]); + + useEffect(() => { + // console.log("made it here, shouldRefresh is :", shouldRefresh ); + !!shouldRefresh && shouldRefresh ? onRefresh() : null + },[shouldRefresh]); const summary = totals && @@ -80,9 +87,10 @@ export function LaborAllocationsTable({ jobId, bodyshop, technician,costCenterDi { hrs_total: 0, hrs_claimed: 0, adjustments: 0, difference: 0 } ); // console.log("labor summary is:", summary); - + + if (loading) return ; return ( - + {typeof data !== "undefined" ? ( diff --git a/components/time-ticket/screen-time-ticket-clockoff.component.jsx b/components/time-ticket/screen-time-ticket-clockoff.component.jsx index 46ab509..1d52b62 100644 --- a/components/time-ticket/screen-time-ticket-clockoff.component.jsx +++ b/components/time-ticket/screen-time-ticket-clockoff.component.jsx @@ -1,6 +1,6 @@ import { Formik } from "formik"; -import React, { useEffect, useState, useRef } from "react"; -import { StyleSheet, Text, View, ScrollView } from "react-native"; +import React, { useEffect, useState, useRef, useCallback } from "react"; +import { StyleSheet, Text, View, ScrollView, FlatList } from "react-native"; import { useTranslation } from "react-i18next"; import { connect } from "react-redux"; import { createStructuredSelector } from "reselect"; @@ -34,6 +34,9 @@ import StyleRepeater from "../style-repeater/style-repeater"; // import { selectCurrentTimeTicketJobId } from "../../redux/timetickets/timetickets.selectors"; import { QUERY_ACTIVE_TIME_TICKETS } from "../../graphql/timetickets.queries"; + +import { RefreshControl } from "react-native"; + const mapStateToProps = createStructuredSelector({ currentEmployee: selectCurrentEmployee, currentRatesNCostCenters: selectRates, @@ -54,7 +57,6 @@ export function TimeTicketClockOff({ route, }) { const costCenterDiff = useRef(0); - // console.log("TimeTicketClockOff, costCenterDiff :", costCenterDiff); const setCostCenterDiff = (value) => { countRef.current = val; @@ -67,6 +69,7 @@ export function TimeTicketClockOff({ // console.log( "TimeTicketClockOff, handleOnDone :", handleOnDone ); const { t } = useTranslation(); + const [loadingClockOut, setLoadingClockOut] = useState(false); const [loading, setLoading] = useState(false); const [error, setError] = useState(null); const [currentSCC, setCurrentSCC] = useState(null); @@ -85,7 +88,7 @@ export function TimeTicketClockOff({ ) { if (isNaN(values.actualhours) | isNaN(values.productivehours)) { // console.log("actual hours is NAN!"); - setLoading(false); + setLoadingClockOut(false); setError({ message: t("timeticketclockoff.errors.nan") }); return; } @@ -93,6 +96,7 @@ export function TimeTicketClockOff({ // console.log("all have values:"); } else { // console.log("missing values!"); + setLoadingClockOut(false); setError({ message: t("timeticketclockoff.errors.missingvalues") }); return; } @@ -100,6 +104,7 @@ export function TimeTicketClockOff({ if (!!currentRestrictClaimableHoursFlag) { // console.log("TimeTicketClockOff, currentRestrictClaimableHoursFlag I am here:", currentRestrictClaimableHoursFlag); if (values.productivehours > costCenterDiff.current) { + setLoadingClockOut(false); setError({ message: t("timeticketclockoff.errors.hoursenteredmorethanavailable"), }); @@ -143,12 +148,12 @@ export function TimeTicketClockOff({ // console.log("TimeTicketClockOff, tempcallobj :", tempcallobj); //after obj is good add below to make call - setLoading(true); + setLoadingClockOut(true); const result = await updateTimeticket(tempcallobj); //after call results are retuning add handling below for cases // console.log("updateTimeticket, result :", result); - setLoading(false); + setLoadingClockOut(false); if (!!result.errors) { // console.log("updateTimeticket, result.error :", result.errors); setError(JSON.stringify(result.errors)); @@ -158,73 +163,93 @@ export function TimeTicketClockOff({ } //if (completedCallback) completedCallback(); }; + + const onRefresh = useCallback(() => { + setLoading(true); + // refetch(); + setTimeout(() => { + setLoading(false); + }, 1000); + }, []); + return ( - {/* style={localStyles.content}> */} - - - - - {({ handleChange, handleBlur, handleSubmit, values }) => ( - - - - - {error ? : null} - - - )} - - - - - - - + + + + {({ handleChange, handleBlur, handleSubmit, values }) => ( + + + + + {error ? ( + + ) : null} + + + )} + + + + } + data={null} + renderItem={null} + ListFooterComponent={ + + } + refreshControl={ + + } + /> ); } @@ -260,4 +285,7 @@ const localStyles = StyleSheet.create({ height: 48, fontSize: 16, }, + localCardStyle: { + margin: 4, + }, }); diff --git a/components/time-ticket/screen-time-ticket-create.component.jsx b/components/time-ticket/screen-time-ticket-create.component.jsx index d2da332..6ba5462 100644 --- a/components/time-ticket/screen-time-ticket-create.component.jsx +++ b/components/time-ticket/screen-time-ticket-create.component.jsx @@ -1,6 +1,6 @@ import { Formik } from "formik"; -import React, { useState } from "react"; -import { StyleSheet, Text, View, ScrollView } from "react-native"; +import React, { useRef, useState } from "react"; +import { StyleSheet, Text, View, ScrollView, RefreshControl } from "react-native"; import { useTranslation } from "react-i18next"; import { connect } from "react-redux"; import { createStructuredSelector } from "reselect"; @@ -13,7 +13,10 @@ import { selectRates, selectEmployeeFullName, } from "../../redux/employee/employee.selectors"; -import { selectBodyshop } from "../../redux/user/user.selectors"; +import { + selectBodyshop, + selectRestrictClaimableHoursFlag, +} from "../../redux/user/user.selectors"; import { useCallback } from "react"; // import LaborAllocationsTable from "../labor-allocations-table/labor-allocations-table.component"; import LaborAllocationsTable from "../labor-allocations-table/labor-allocations-table.component"; @@ -28,12 +31,14 @@ import { useNavigation } from "@react-navigation/native"; import styles from "../styles"; import StyleRepeater from "../style-repeater/style-repeater"; +import { FlatList } from "react-native"; const mapStateToProps = createStructuredSelector({ currentEmployee: selectCurrentEmployee, currentRatesNCostCenters: selectRates, currentBodyshop: selectBodyshop, currentEmployeeFullName: selectEmployeeFullName, + currentRestrictClaimableHoursFlag: selectRestrictClaimableHoursFlag, }); // const mapDispatchToProps = (dispatch) => ({}); @@ -42,10 +47,13 @@ export function TimeTicketCreate({ currentRatesNCostCenters, currentBodyshop, currentEmployeeFullName, + currentRestrictClaimableHoursFlag, }) { + const costCenterDiff = useRef(0); const navigation = useNavigation(); const { t } = useTranslation(); const [loading, setLoading] = useState(false); + const [loadingCreate, setLoadingCreate] = useState(false); const [error, setError] = useState(null); const [isDatePickerVisible, setDatePickerVisibility] = useState(false); @@ -72,7 +80,7 @@ export function TimeTicketCreate({ logImEXEvent("handleFinish_called_in_TimeTicketCreate"); // console.log("handleFinish called in TimeTicketCreate"); setError(null); - setLoading(true); + setLoadingCreate(true); // console.log("insertTicket, currentSCC :", currentSCC); // console.log("insertTicket, currentSCC :", currentSJobId); @@ -89,7 +97,7 @@ export function TimeTicketCreate({ ) { if (isNaN(values.actualhours) | isNaN(values.productivehours)) { // console.log("actual hours is NAN!"); - setLoading(false); + setLoadingCreate(false); setError({ message: t("createtimeticket.errors.nan") }); return; } @@ -97,11 +105,22 @@ export function TimeTicketCreate({ // console.log("have all values"); } else { // console.log("missing values!"); - setLoading(false); + setLoadingCreate(false); setError({ message: t("createtimeticket.errors.missingvalues") }); return; } + if (!!currentRestrictClaimableHoursFlag) { + // console.log("TimeTicketClockOff, currentRestrictClaimableHoursFlag I am here:", currentRestrictClaimableHoursFlag); + if (values.productivehours > costCenterDiff.current) { + setLoadingCreate(false); + setError({ + message: t("timeticketclockoff.errors.hoursenteredmorethanavailable"), + }); + return; + } + } + // if (date2) console.log("rate :", currentRatesNCostCenters && currentSCC?.value ? currentRatesNCostCenters.filter((r) => r.cost_center === currentSCC?.value)[0].rate : null);//2023-05-16T16:45:27.154Z // if (date2) console.log("bodyshopid : ", currentBodyshop.id); // if (date2) console.log("moment(date2).format(YYYY-MM-DD)", moment(date2).format("YYYY-MM-DD")); @@ -155,7 +174,7 @@ export function TimeTicketCreate({ // console.log(" result : ", result); // //after call results are retuning add handling below for cases // console.log("insertTicket, result :", result?.data?.insert_timetickets?.returning[0]); - setLoading(false); + setLoadingCreate(false); if (!!result.errors) { // console.log("insertTicket, result.error :", result.errors); setError(JSON.stringify(result.errors)); @@ -166,119 +185,140 @@ export function TimeTicketCreate({ // if (completedCallback) completedCallback(); }; - const handleMutationError = (error) => { - // setEnterAgain(false); - console.log("insertTicket, result.error :", error); - setError( - error?.message ? JSON.stringify(error?.message) : JSON.stringify(error) - ); - setLoading(false); - }; + // const handleMutationError = (error) => { + // // setEnterAgain(false); + // console.log("insertTicket, result.error :", error); + // setError( + // error?.message ? JSON.stringify(error?.message) : JSON.stringify(error) + // ); + // setLoading(false); + // }; + + const onRefresh = useCallback(() => { + setLoading(true); + // refetch(); + setTimeout(() => { + setLoading(false); + }, 1000); + }, []); + return ( - - {/* */} - - - - {({ handleChange, handleBlur, handleSubmit, values }) => ( - - - {/* Below will be replaced with a Date Picker*/} - {/* */} - - - - - - - {error ? : null} - - - )} - - - - {/* Below is for list of jobs/tickets */} - {/* */} - - - - + + + + {({ handleChange, handleBlur, handleSubmit, values }) => ( + + + + + + + + + {error ? ( + + ) : null} + + + )} + + + + } + data={null} + renderItem={null} + ListFooterComponent={ + + } + refreshControl={ + + } + /> ); } @@ -320,4 +360,7 @@ const localStyles = StyleSheet.create({ height: 48, fontSize: 16, }, + localCardStyle: { + margin: 4, + }, });