fixbugwithselectordropdownaddedclockedinlist

components/time-ticket-items/clockedin-list-item.component.jsx

@@ -0,0 +1,94 @@
+import { Ionicons } from "@expo/vector-icons";
+import { useNavigation } from "@react-navigation/native";
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { Button, List, Title, Card, Text } from "react-native-paper";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { OwnerNameDisplayFunction } from "../owner-name-display/owner-name-display.component";
+import { DateTimeFormatter } from "../../util/DateFormater";
+
+// const mapStateToProps = createStructuredSelector({});
+// const mapDispatchToProps = (dispatch) => ({
+//   setCameraJobId: (id) => dispatch(setCameraJobId(id)),
+//   setCameraJob: (job) => dispatch(setCameraJob(job)),
+// });
+
+export function ClockedinListItem({ ticket }) {
+  const { t } = useTranslation();
+  const navigation = useNavigation();
+
+  const onPress = () => {
+    // logImEXEvent("imexmobile_view_job_detail");
+    // navigation.push("JobDetail", {
+    //   jobId: item.id,
+    //   title: item.ro_number || t("general.labels.na"),
+    //   job: item,
+    // });
+    console.log("ClockedinListItem, onPress called");
+  };
+
+  return (
+    <Card style={{ margin: 8 }}>
+      <Card.Title
+        title={`${
+          ticket.job.ro_number || t("general.labels.na")
+        } ${OwnerNameDisplayFunction(ticket.job)}`}
+      />
+      <Card.Content>
+        <Text>Vehicle :
+          {`${ticket.job.v_model_yr || ""} ${
+            ticket.job.v_make_desc || ""
+          } ${ticket.job.v_model_desc || ""}`}
+        </Text>
+        <Text>
+          Clocked In : <DateTimeFormatter>{ticket.clockon}</DateTimeFormatter>
+        </Text>
+        <Text>
+          Cost Center : {ticket.cost_center === "timetickets.labels.shift"
+                      ? t(ticket.cost_center)
+                      : ticket.cost_center}
+        </Text>
+      </Card.Content>
+      <Card.Actions>
+        {/* <TechClockOffButton
+                      jobId={ticket.jobid}
+                      timeTicketId={ticket.id}
+                      completedCallback={refetch}
+                    /> */}
+        <Button 
+                mode="outlined" onPress={() => onPress}>Clock Out</Button>
+      </Card.Actions>
+    </Card>
+    // <List.Item
+    //   onPress={onPress}
+    //   title={<Title>{item.ro_number || t("general.labels.na")}</Title>}
+    //   descriptionNumberOfLines={2}
+    //   description={`${item.ownr_fn || ""} ${item.ownr_ln || ""} ${
+    //     item.ownr_co_nm || ""
+    //   } - ${item.v_model_yr || ""} ${item.v_make_desc || ""} ${
+    //     item.v_model_desc || ""
+    //   }`}
+    //   right={({ style }) => (
+    //     <Button
+    //       style={[style, { alignSelf: "center" }]}
+    //       onPress={() => {
+    //         logImEXEvent("imexmobile_setcamerajobid_row");
+    //         setCameraJobId(item.id);
+    //         setCameraJob(item);
+    //         navigation.navigate("MediaBrowserTab");
+    //       }}
+    //     >
+    //       <Ionicons
+    //         style={[style, { alignSelf: "center" }]}
+    //         name="ios-add"
+    //         size={32}
+    //         color="dodgerblue"
+    //       />
+    //     </Button>
+    //   )}
+    // />
+  );
+}
+
+export default connect(null, null)(ClockedinListItem);