Refactor job list
This commit is contained in:
@@ -1,10 +1,9 @@
|
||||
import { Ionicons } from "@expo/vector-icons";
|
||||
import { useNavigation } from "@react-navigation/native";
|
||||
import Dinero from "dinero.js";
|
||||
import { Card, CardItem, H3 } from "native-base";
|
||||
import { Body, H3, Icon, ListItem, Right } from "native-base";
|
||||
import React from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { StyleSheet, Text, View } from "react-native";
|
||||
import { Text } from "react-native";
|
||||
import { TouchableOpacity } from "react-native-gesture-handler";
|
||||
import Swipeable from "react-native-gesture-handler/Swipeable";
|
||||
import { connect } from "react-redux";
|
||||
@@ -23,7 +22,8 @@ const mapDispatchToProps = (dispatch) => ({
|
||||
export function JobListItem({ setCameraJob, setCameraJobId, item }) {
|
||||
const { t } = useTranslation();
|
||||
const navigation = useNavigation();
|
||||
const RenderRightAction = (props) => {
|
||||
|
||||
const RenderRightAction = () => {
|
||||
const navigation = useNavigation();
|
||||
const { t } = useTranslation();
|
||||
return (
|
||||
@@ -36,12 +36,13 @@ export function JobListItem({ setCameraJob, setCameraJobId, item }) {
|
||||
}}
|
||||
>
|
||||
<Ionicons name="ios-camera" size={24} color="white" />
|
||||
<Text style={styles.swipe_text}>
|
||||
{/* <Text style={styles.swipe_text}>
|
||||
{t("joblist.actions.swipecamera")}
|
||||
</Text>
|
||||
</Text> */}
|
||||
</TouchableOpacity>
|
||||
);
|
||||
};
|
||||
|
||||
const onPress = () => {
|
||||
navigation.push("JobDetail", {
|
||||
jobId: item.id,
|
||||
@@ -52,48 +53,23 @@ export function JobListItem({ setCameraJob, setCameraJobId, item }) {
|
||||
return (
|
||||
<Swipeable renderRightActions={() => <RenderRightAction />}>
|
||||
<TouchableOpacity onPress={onPress}>
|
||||
<Card>
|
||||
<CardItem header bordered first button>
|
||||
<View style={localStyles.item_header}>
|
||||
<H3 style={localStyles.item_header_content}>
|
||||
{item.ro_number || t("general.labels.na")}
|
||||
</H3>
|
||||
<Text style={localStyles.item_header_margin}>
|
||||
{item.clm_no || ""}
|
||||
</Text>
|
||||
</View>
|
||||
</CardItem>
|
||||
<CardItem bordered last button>
|
||||
<View>
|
||||
<Text>{`${item.ownr_fn || ""} ${item.ownr_ln || ""} ${
|
||||
item.ownr_co_nm || ""
|
||||
}`}</Text>
|
||||
<Text>{`${item.v_model_yr || ""} ${item.v_make_desc || ""} ${
|
||||
item.v_model_desc || ""
|
||||
}`}</Text>
|
||||
</View>
|
||||
<View style={[{ width: 150 }, localStyles.card_content_margin]}>
|
||||
<Text numberOfLines={1}>{item.ins_co_nm || ""}</Text>
|
||||
<Text>
|
||||
{Dinero({
|
||||
amount: Math.round(item.clm_total * 100),
|
||||
}).toFormat() || ""}
|
||||
</Text>
|
||||
</View>
|
||||
</CardItem>
|
||||
</Card>
|
||||
<ListItem>
|
||||
<H3>{item.ro_number || t("general.labels.na")}</H3>
|
||||
|
||||
<Body style={{ marginLeft: 10 }}>
|
||||
<Text>{`${item.ownr_fn || ""} ${item.ownr_ln || ""} ${
|
||||
item.ownr_co_nm || ""
|
||||
} - ${item.v_model_yr || ""} ${item.v_make_desc || ""} ${
|
||||
item.v_model_desc || ""
|
||||
}`}</Text>
|
||||
</Body>
|
||||
<Right>
|
||||
<Icon active name="arrow-forward" />
|
||||
</Right>
|
||||
</ListItem>
|
||||
</TouchableOpacity>
|
||||
</Swipeable>
|
||||
);
|
||||
}
|
||||
const localStyles = StyleSheet.create({
|
||||
item_header: {
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
},
|
||||
item_header_margin: { marginLeft: 10 },
|
||||
card_content_margin: {
|
||||
marginLeft: 15,
|
||||
},
|
||||
});
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(JobListItem);
|
||||
|
||||
Reference in New Issue
Block a user