100 lines
3.3 KiB
JavaScript
100 lines
3.3 KiB
JavaScript
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 React from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import { StyleSheet, Text, View } from "react-native";
|
|
import { TouchableOpacity } from "react-native-gesture-handler";
|
|
import Swipeable from "react-native-gesture-handler/Swipeable";
|
|
import { connect } from "react-redux";
|
|
import { createStructuredSelector } from "reselect";
|
|
import { setCameraJob, setCameraJobId } from "../../redux/app/app.actions";
|
|
import styles from "../styles";
|
|
|
|
const mapStateToProps = createStructuredSelector({
|
|
//currentUser: selectCurrentUser
|
|
});
|
|
const mapDispatchToProps = (dispatch) => ({
|
|
setCameraJobId: (id) => dispatch(setCameraJobId(id)),
|
|
setCameraJob: (job) => dispatch(setCameraJob(job)),
|
|
});
|
|
|
|
export function JobListItem({ setCameraJob, setCameraJobId, item }) {
|
|
const { t } = useTranslation();
|
|
const navigation = useNavigation();
|
|
const RenderRightAction = (props) => {
|
|
const navigation = useNavigation();
|
|
const { t } = useTranslation();
|
|
return (
|
|
<TouchableOpacity
|
|
style={[styles.swipe_view, styles.swipe_view_blue]}
|
|
onPress={() => {
|
|
setCameraJobId(item.id);
|
|
setCameraJob(item);
|
|
navigation.navigate("CameraTab");
|
|
}}
|
|
>
|
|
<Ionicons name="ios-camera" size={24} color="white" />
|
|
<Text style={styles.swipe_text}>
|
|
{t("joblist.actions.swipecamera")}
|
|
</Text>
|
|
</TouchableOpacity>
|
|
);
|
|
};
|
|
const onPress = () => {
|
|
navigation.push("JobDetail", {
|
|
jobId: item.id,
|
|
title: item.ro_number || t("general.labels.na"),
|
|
});
|
|
};
|
|
|
|
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>
|
|
</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);
|