import * as React from 'react'; import { useState } from 'react'; import { connect } from "react-redux"; import { TouchableOpacity, View, Text, Alert } from 'react-native'; import { openModal } from '../../redux/actions/AlertActions.js'; import { dateFormaterForAndroid } from '../../utils/date.js'; import EP from '../../components/api/endpoints.js'; import CustomHeader from '../../components/header.js'; import Theme from '../../components/theme.style.js'; import Elements from '../../components/elements.js'; import CustomIcon from '../../components/icons.js'; import DB from '../../components/storage'; import CustomForm from './customform'; import moment from 'moment'; import CustomSafeArea from '../../components/safeArea.component.js'; import axios from 'axios'; import REQUEST from '../../components/api'; const Tracker = (navigation) => { console.log(navigation.navigation.goBack) const params = navigation.route ? navigation.route.params : null const [datepicker, setdatepicker] = useState(false); const [date, setdate] = useState(); const [fueltypeName, setfueltypeName] = useState(); const [fueltypeUUID, setfueltypeUUID] = useState(); const [fueltpyeID, setfueltypeID] = useState(); const [fueltypePrice, setfueltypePrice] = useState(); const [distance, setdistance] = useState(); const [liters, setliters] = useState(); const [loading, setLoading] = useState(false); const [update, setupdate] = useState(false); if(params.edit && !update){ setdate(moment(params.edit.date).format("MMMM DD, YYYY")) setfueltypeName(params.edit.fueltype_name); setfueltypeUUID(params.edit.fueltracker_uuid); setfueltypeID(params.edit.fueltype_id); setfueltypePrice(params.edit.price); setdistance(params.edit.km); setliters(params.edit.liters); setupdate(true); } const DeleteTracker = async () => { console.log(fueltypeUUID) setLoading(true); const SESSION = await DB.session(); REQUEST( 'tracker', 'delete', { Authorization: SESSION.token }, { noID: true, value: fueltypeUUID }, {}, (_) => { const taskToShow = `\nTracker has been successfully deleted!`; // init(); Alert.alert("Information", taskToShow, [{text: "OK", onPress: navigation.navigation.navigate('Tracker')}]); }, (error) => { console.log(error) setLoading(false); Alert.alert("Information", `\n${error.message}`) }, "Tracker", "Delete" ) } const Update = async () => { setLoading(true); const SESSION = await DB.session(); REQUEST( 'tracker', 'patch', { Authorization: SESSION.token }, { noID: true, value: fueltypeUUID }, { date: Theme.formatter.DT4API(date), fueltype_id: fueltpyeID, km: distance, liters: liters, price: fueltypePrice, kml: distance / liters, total: liters * fueltypePrice }, (_) => { setLoading(false); onDone("updated") }, (error) => { setLoading(false); Alert.alert("Information", `\n${error.message}`) }, "Tracker", "Delete" ) } const onDone = (task) => { const taskToShow = `\nTracker has been successfully ${task}!`; navigation.route.params?.reload(); Alert.alert("Information", taskToShow, [{text: "OK", onPress: () => navigation.navigation.goBack()}]); } const setSelected = (fuel) => { setfueltypeName(fuel.name); setfueltypeID(fuel.id); setfueltypePrice(fuel.price); } return ( { setdate(selectedDate ? moment(selectedDate).format("MMMM DD, YYYY") : date != null ? date : null) setdatepicker(false) }} onCancel={() => setdatepicker(false)}/> Alert.alert("Information", "\nDo you want to delete this fuel tracker?", [{text: "CANCEL"}, {text: "OK", onPress: DeleteTracker}]) } style={{alignSelf: 'flex-end', right: 10}}> }/> setdatepicker(true), onChangeText: (val) => setdate(val) }, { name: "Fuel Type", type: "button", value: fueltypeName, disabled: true, onClick: () => navigation.navigation.navigate("AddFuelType", {fueltypeUUID: fueltypeUUID, get: (val) => setSelected(val), reload: () => navigation.route.params.reload()}) }, { kb: "numeric", name: "Distance Travelled", icon: 'info', value: Theme.formatter.CRNCYNOFIXED(distance), category: "KM", onChangeText: (val) => { if(val && val.includes(".") && val.split(".")[1].length > 2) return; if(val && (val.indexOf(".") !== val.lastIndexOf("."))) return; if(val && !/^[\d,.]+$/.test(val)) return; setdistance(val.replace(/,/g, "")); }, onIconClick: () => Alert.alert("Information", '\n' + "To measure distance travelled, make sure to reset your trip meter every time you gas full tank.") }, { kb: "numeric", name: "Liters Fueled up", value: Theme.formatter.CRNCYNOFIXED(liters), category: "L", onChangeText: (val) => { if(val && val.includes(".") && val.split(".")[1].length > 2) return; if(val && val.includes(".") && (val.indexOf(".") !== val.lastIndexOf("."))) return; if(val && !/^[\d,.]+$/.test(val)) return; setliters(val.replace(/,/g, "")); } } ]}/> Save Tracker ); } const mapStateToProps = (state) => { return { app_theme: state.appThemeReducer.theme } } const mapDispatchToProps = { openModal } export default connect(mapStateToProps, mapDispatchToProps)(Tracker)