82 lines
2.2 KiB
JavaScript
82 lines
2.2 KiB
JavaScript
import { Card, CardItem, Container, Content, Text } from "native-base";
|
|
import React from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import { FlatList, RefreshControl, StyleSheet } from "react-native";
|
|
import Dinero from "dinero.js";
|
|
|
|
export default function JobLines({ job, loading, refetch }) {
|
|
const { t } = useTranslation();
|
|
if (!!!job) {
|
|
<Card>
|
|
<Text>Job is not defined.</Text>
|
|
</Card>;
|
|
}
|
|
const onRefresh = async () => {
|
|
return refetch();
|
|
};
|
|
|
|
return (
|
|
<Container>
|
|
<Content
|
|
padder
|
|
refreshControl={
|
|
<RefreshControl refreshing={loading} onRefresh={onRefresh} />
|
|
}
|
|
>
|
|
<FlatList
|
|
data={job.joblines}
|
|
style={{ flex: 1 }}
|
|
contentContainerStyle={localStyles.listContentContainer}
|
|
keyExtractor={(item) => item.id}
|
|
renderItem={(object) => (
|
|
<Card>
|
|
<CardItem style={localStyles.flexRow}>
|
|
<Text style={localStyles.growWithEllipsis}>{`${
|
|
object.item.line_desc
|
|
}${
|
|
object.item.part_qty > 1 ? ` x ${object.item.part_qty}` : ""
|
|
}`}</Text>
|
|
{object.item.part_type && (
|
|
<Text style={localStyles.sideMargins}>
|
|
{t(`jobdetail.part_types.${object.item.part_type}`)}
|
|
</Text>
|
|
)}
|
|
<Text style={localStyles.sideMargins}>
|
|
{Dinero({
|
|
amount: Math.round((object.item.act_price || 0) * 100),
|
|
}).toFormat()}
|
|
</Text>
|
|
</CardItem>
|
|
<CardItem style={localStyles.flexRow}>
|
|
{object.item.mod_lbr_ty && (
|
|
<Text>
|
|
{t(`jobdetail.lbr_types.${object.item.mod_lbr_ty}`)}
|
|
</Text>
|
|
)}
|
|
</CardItem>
|
|
</Card>
|
|
)}
|
|
/>
|
|
</Content>
|
|
</Container>
|
|
);
|
|
}
|
|
|
|
const localStyles = StyleSheet.create({
|
|
listContentContainer: {
|
|
flex: 1,
|
|
},
|
|
flexRow: {
|
|
display: "flex",
|
|
flexDirection: "row",
|
|
justifyContent: "space-between",
|
|
},
|
|
sideMargins: {
|
|
marginLeft: 5,
|
|
marginRight: 5,
|
|
},
|
|
growWithEllipsis: {
|
|
flex: 1,
|
|
},
|
|
});
|