Files
imexmobile/components/time-ticket-items/clockedin-list-item.component.jsx
2023-06-09 10:12:45 -04:00

66 lines
2.3 KiB
JavaScript

import { useNavigation } from "@react-navigation/native";
import React from "react";
import { useTranslation } from "react-i18next";
import { Button, Card, Text } from "react-native-paper";
import { connect } from "react-redux";
import { OwnerNameDisplayFunction } from "../owner-name-display/owner-name-display.component";
import { DateTimeFormatter } from "../../util/DateFormater";
import { setTmTicketJobId } from "../../redux/app/app.actions";
import styles from "../styles";
const mapDispatchToProps = (dispatch) => ({
setTmTicketJobIdRedux: (jobId) => dispatch(setTmTicketJobId(jobId)),
});
export function ClockedinListItem({ setTmTicketJobIdRedux, ticket }) {
// console.log("ClockedinListItem, ticket:",ticket);
const { t } = useTranslation();
const navigation = useNavigation();
const makeNavToTimeTicketClockOff = () => (
// console.log("makeNavToTimeTicketClockOff, checkHasDispatchCall:",setTmTicketJobIdRedux),
setTmTicketJobIdRedux(ticket.job.id),
navigation.navigate("TimeTicketClockOff", {
// jobId: ticket.jobid, //item.id,
timeTicketId:ticket.id,
// handleOnDone:handleRefresh,
//completedCallback: refetch,
})
);
return (
<Card style={{ margin: 8 }}>
<Card.Title
title={`${
ticket.job.ro_number || t("general.labels.na")
} ${OwnerNameDisplayFunction(ticket.job)}`}
/>
<Card.Content>
<Text>
{t("clockedinlistitem.labels.vehicle")}
{`${ticket.job.v_model_yr || ""} ${ticket.job.v_make_desc || ""} ${
ticket.job.v_model_desc || ""
}`}
</Text>
<Text>
{t("clockedinlistitem.labels.clockedin")}<DateTimeFormatter>{ticket.clockon}</DateTimeFormatter>
</Text>
<Text>
{t("clockedinlistitem.labels.costcenter")}
{ticket.cost_center === "timetickets.labels.shift"
? t(ticket.cost_center)
: ticket.cost_center}
</Text>
</Card.Content>
<Card.Actions style={{
justifyContent: 'center'}}>
<Button mode="outlined" style={styles.buttonBasicOutlined} onPress={makeNavToTimeTicketClockOff} >
{t("clockedinlistitem.actions.clockout")}
</Button>
</Card.Actions>
</Card>
);
}
export default connect(null, mapDispatchToProps)(ClockedinListItem);