Files
imexmobile/components/job-lines/job-lines.jsx
2025-10-15 15:46:28 -07:00

77 lines
2.3 KiB
JavaScript

import { GET_JOB_BY_PK } from "@/graphql/jobs.queries";
import { useQuery } from "@apollo/client";
import { useGlobalSearchParams } from "expo-router";
import React from "react";
import { useTranslation } from "react-i18next";
import { ScrollView } from "react-native";
import { ActivityIndicator, DataTable } from "react-native-paper";
import ErrorDisplay from "../error/error-display";
export default function JobLines() {
const { jobId } = useGlobalSearchParams();
const { loading, error, data, refetch } = useQuery(GET_JOB_BY_PK, {
variables: {
id: jobId,
},
skip: !jobId,
});
console.log("*** ~ JobLines ~ error:", error);
const { t } = useTranslation();
const onRefresh = async () => {
return refetch();
};
if (loading) {
return <ActivityIndicator />;
}
if (error) {
return <ErrorDisplay message={JSON.stringify(error)} />;
}
if (!data?.jobs_by_pk) {
return <ErrorDisplay message={"Job is not defined."} />;
}
const job = data.jobs_by_pk;
return (
<ScrollView>
<DataTable>
<DataTable.Header>
<DataTable.Title> {t("jobdetail.labels.lines_desc")}</DataTable.Title>
<DataTable.Title>
{t("jobdetail.labels.lines_lbr_ty")}
</DataTable.Title>
<DataTable.Title numeric>
{t("jobdetail.labels.lines_lb_hrs")}
</DataTable.Title>
<DataTable.Title>
{t("jobdetail.labels.lines_part_type")}
</DataTable.Title>
<DataTable.Title numeric>
{t("jobdetail.labels.lines_qty")}
</DataTable.Title>
</DataTable.Header>
{job.joblines.map((item) => (
<DataTable.Row key={item.id}>
<DataTable.Cell style={{ flex: 4 }}>
{item.line_desc}
</DataTable.Cell>
<DataTable.Cell>
{item.mod_lbr_ty && t(`jobdetail.lbr_types.${item.mod_lbr_ty}`)}
</DataTable.Cell>
<DataTable.Cell numeric>{item.mod_lb_hrs}</DataTable.Cell>
<DataTable.Cell>
{item.part_type && t(`jobdetail.part_types.${item.part_type}`)}
</DataTable.Cell>
<DataTable.Cell numeric>{item.part_qty}</DataTable.Cell>
</DataTable.Row>
))}
</DataTable>
</ScrollView>
);
}