fixbugwithselectordropdownaddedclockedinlist

2023-05-13 13:56:44 -04:00
parent 2d17623bdf
commit 66fa8196af
10 changed files with 505 additions and 106 deletions
--- a/components/time-ticket-lists/employee-clockedin-list.component.jsx
+++ b/components/time-ticket-lists/employee-clockedin-list.component.jsx
@@ -0,0 +1,111 @@
+import { connect } from "react-redux";
+import { selectCurrentEmployee, selectTechnician } from "../../redux/employee/employee.selectors";
+import { QUERY_ACTIVE_TIME_TICKETS } from "../../graphql/timetickets.queries";
+import { ActivityIndicator,Button, List, Modal, Portal, Searchbar } from "react-native-paper";
+import ErrorDisplay from "../error-display/error-display.component";
+import { View,Text,FlatList, RefreshControl, } from "react-native";
+import { useQuery } from "@apollo/client";
+import { createStructuredSelector } from "reselect";
+import { useTranslation } from "react-i18next";
+import { ClockedinListItem } from "../time-ticket-items/clockedin-list-item.component";
+
+const mapStateToProps = createStructuredSelector({
+  technician: selectTechnician,
+  //currentEmployee: selectCurrentEmployee,
+});
+const mapDispatchToProps = (dispatch) => ({});
+
+export function EmployeeClockedInList({ technician }) {
+    const { t } = useTranslation();
+
+  const { loading, error, data, refetch } = useQuery(QUERY_ACTIVE_TIME_TICKETS, {
+      variables: {
+        employeeId: technician?.id,
+      },
+      skip: !technician,
+      fetchPolicy: "network-only",
+      nextFetchPolicy: "network-only",
+    }
+  );
+  if (loading) return <ActivityIndicator color="dodgerblue" size="large" />;
+  if (error) return <ErrorDisplay errorMessage={error.message} />;
+  //if (error) return <AlertComponent message={error.message} type="error" />;
+console.log("QUERY_ACTIVE_TIME_TICKETS data",data)
+
+const onRefresh = async () => {
+    return refetch();
+  };
+  return (
+    <View>
+      {data.timetickets.length > 0 ? (
+        <View>
+          <Text>You are already clocked in to the following job(s):</Text>
+          <FlatList data={data.timetickets} 
+          refreshControl={<RefreshControl refreshing={loading} onRefresh={onRefresh} />}
+          renderItem={(object) => <ClockedinListItem ticket={object.item} />} />
+        </View>
+      ) : null}
+    </View>
+    //   <div>
+    //     {data.timetickets.length > 0 ? (
+    //       <div>
+    //         <Typography.Title level={2}>
+    //           {t("timetickets.labels.alreadyclockedon")}
+    //         </Typography.Title>
+    //         <List
+    //           grid={{
+    //             gutter: 32,
+    //             xs: 1,
+    //             sm: 2,
+    //             md: 3,
+    //             lg: 4,
+    //             xl: 5,
+    //             xxl: 6,
+    //           }}
+    //           dataSource={data.timetickets || []}
+    //           renderItem={(ticket) => (
+    //             <List.Item>
+    //               <Card
+    //                 title={
+    //                   <Link to={`/tech/joblookup?selected=${ticket.job.id}`}>
+    //                     {`${
+    //                       ticket.job.ro_number || t("general.labels.na")
+    //                     } ${OwnerNameDisplayFunction(ticket.job)}`}
+    //                   </Link>
+    //                 }
+    //                 actions={[
+    //                   <TechClockOffButton
+    //                     jobId={ticket.jobid}
+    //                     timeTicketId={ticket.id}
+    //                     completedCallback={refetch}
+    //                   />,
+    //                 ]}
+    //               >
+    //                 <div>
+    //                   {`
+    //                 ${ticket.job.v_model_yr || ""} ${
+    //                     ticket.job.v_make_desc || ""
+    //                   } ${ticket.job.v_model_desc || ""}`}
+    //                 </div>
+    //                 <DataLabel label={t("timetickets.fields.clockon")}>
+    //                   <DateTimeFormatter>{ticket.clockon}</DateTimeFormatter>
+    //                 </DataLabel>
+    //                 <DataLabel label={t("timetickets.fields.cost_center")}>
+    //                   {ticket.cost_center === "timetickets.labels.shift"
+    //                     ? t(ticket.cost_center)
+    //                     : ticket.cost_center}
+    //                 </DataLabel>
+    //               </Card>
+    //             </List.Item>
+    //           )}
+    //         ></List>
+    //       </div>
+    // ) : null}
+    //   </div>
+  );
+}
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(EmployeeClockedInList);