350 lines
11 KiB
JavaScript
350 lines
11 KiB
JavaScript
import * as React from 'react';
|
|
import { useState, useEffect, useCallback, useContext } from 'react';
|
|
import { connect } from "react-redux";
|
|
import { SafeAreaView, ScrollView, Linking, Button, View, Text, TouchableOpacity, RefreshControl, Platform } from 'react-native';
|
|
import {useNetInfo} from "@react-native-community/netinfo";
|
|
// import NetInfo from "@react-native-community/netinfo";
|
|
import NetInfo from "../../../components/netstatus";
|
|
import CustomHeader from '../../../components/header.js';
|
|
import Assets from '../../../components/assets.manager.js';
|
|
import Theme from '../../../components/theme.style.js';
|
|
import Icon from '../../../components/icons.js';
|
|
import Elements from '../../../components/elements.js';
|
|
import REQUEST from '../../../components/api/';
|
|
import DB from '../../../components/storage/';
|
|
import CustomSafeArea from '../../../components/safeArea.component';
|
|
|
|
class MyTransactions extends React.Component {
|
|
|
|
constructor(props) {
|
|
super(props)
|
|
this.navigate = props.navigation.navigation.navigate
|
|
}
|
|
|
|
state = {
|
|
connected: false,
|
|
loading: false,
|
|
transactions: []
|
|
}
|
|
|
|
componentDidMount() {
|
|
this.initTransactions()
|
|
console.log("WOOOOOOOW", this.props)
|
|
}
|
|
|
|
componentWillUnmount() {
|
|
|
|
}
|
|
|
|
initTransactions = async () => {
|
|
NetInfo.netstatus(isConnected => {
|
|
if(isConnected){
|
|
this.init()
|
|
} else {
|
|
Elements.nointernet2()
|
|
}
|
|
})
|
|
}
|
|
|
|
init = async () => {
|
|
const SESSION = await DB.session()
|
|
this.setState({ connected: true, loading: true })
|
|
await REQUEST("transactions", "get", {
|
|
Authorization: SESSION.token,
|
|
card_number: SESSION.user.card_number
|
|
}, {}, {}, (data) => {
|
|
this.setState({ transactions: data.data, loading: false })
|
|
}, (error) => {
|
|
this.setState({ loading: false })
|
|
}
|
|
)
|
|
}
|
|
|
|
renderTransactions = () => {
|
|
return this.state.transactions.map((data, index) => {
|
|
return (<Elements.transaction
|
|
data={data}
|
|
textColor={this.props.app_theme?.theme.colors.text}
|
|
isDarkMode={this.props.app_theme?.theme.dark}
|
|
cardBackgroundColor={this.props.app_theme?.theme.colors.border}
|
|
onPress={() => this.navigate("TransactionDetails", {data: data, onBackPress: () => this.init()})}
|
|
key={index} />)
|
|
});
|
|
}
|
|
|
|
render() {
|
|
if(!this.state.connected){
|
|
return (
|
|
<View style={{flex: 1}}>
|
|
<Elements.nointernet
|
|
message="No internet found. Please check your internet connection."
|
|
buttonText="Try Again"
|
|
onPress={() => this.init()}
|
|
/>
|
|
</View>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<CustomSafeArea>
|
|
<ScrollView
|
|
style={{ backgroundColor: this.props.app_theme?.theme.colors.background }}
|
|
showsHorizontalScrollIndicator={false}
|
|
contentContainerStyle={{ flexGrow: 1 }}
|
|
refreshControl={
|
|
<RefreshControl refreshing={this.state.loading} onRefresh={() => this.init()} />
|
|
}>
|
|
{this.state.transactions.length == 0 ?
|
|
<View style={{flex: 10, justifyContent: 'center', alignItems: 'center'}}>
|
|
<Text style={{width: '70%', textAlign: 'center', color: this.props.app_theme?.theme.colors.text}}>There's nothing here.</Text>
|
|
<Text style={{width: '70%', textAlign: 'center', color: this.props.app_theme?.theme.colors.text}}>You have made no transactions yet.</Text>
|
|
</View>
|
|
:
|
|
<View>
|
|
<View style={{paddingVertical: 15, alignItems: 'center'}}>
|
|
<Text style={{padding: 15, width: '100%', textAlign: 'center', color: this.props.app_theme?.theme.colors.text}}>
|
|
Only your last 5 transactions can be viewed. For your complete transaction history please go to
|
|
<Text style={{color: Theme.colors.primary, textDecorationLine: 'underline'}} onPress={() => {
|
|
let url = 'https://unioil.com/loyalty'
|
|
Linking.canOpenURL(url).then(supported => {
|
|
if (!supported) {
|
|
console.log('Cant handle url')
|
|
alert("URL Not Supported")
|
|
} else {
|
|
return Linking.openURL(url)
|
|
}
|
|
}).catch(err => {
|
|
console.error('An error occurred', err)
|
|
})
|
|
}}>
|
|
unioil.com/loyalty
|
|
</Text>
|
|
</Text>
|
|
</View>
|
|
<View>{this.renderTransactions()}</View>
|
|
</View>
|
|
}
|
|
<View style={{flex: 1, height: 30}}></View>
|
|
</ScrollView>
|
|
</CustomSafeArea>
|
|
);
|
|
}
|
|
}
|
|
|
|
const mapStateToProps = (state) => {
|
|
return {
|
|
app_theme: state.appThemeReducer.theme
|
|
}
|
|
}
|
|
|
|
export default connect(mapStateToProps, null)(MyTransactions)
|
|
|
|
// export default function MyTransactions({navigation}) {
|
|
|
|
// const [connected, setconnected] = useState(false)
|
|
// const navigate = navigation.navigation.navigate;
|
|
// const [loading, setloading] = useState(false);
|
|
// const [transactions, settransactions] = useState([]);
|
|
|
|
// const init = async () => {
|
|
|
|
// const SESSION = await DB.session()
|
|
// const USERPROFILE = await DB.profile()
|
|
// setconnected(true)
|
|
// setloading(true)
|
|
// await REQUEST("transactions", "get", {
|
|
// Authorization: SESSION.token,
|
|
// card_number: SESSION.user.card_number
|
|
// }, {}, {}, function(data){
|
|
// settransactions(data.data)
|
|
// setloading(false)
|
|
// }, function(error){
|
|
// console.log(error)
|
|
// })
|
|
// console.log("transactions", transactions)
|
|
// }
|
|
|
|
// useEffect(() => {
|
|
// NetInfo.fetch().then(state => {
|
|
// console.log("Connection type", state.type);
|
|
// console.log("Is connected?", state.isConnected);
|
|
// if(state.isConnected){
|
|
// init()
|
|
// }else{
|
|
// Elements.nointernet2()
|
|
// }
|
|
// })
|
|
// }, [])
|
|
|
|
// const renderTransactions = () => {
|
|
// return transactions.map((data, index) => {
|
|
// console.log(data)
|
|
// return <Elements.transaction data={data} onPress={() => navigate("TransactionDetails", {data: data, onBackPress: () => init()})} key={index} />
|
|
// });
|
|
// }
|
|
|
|
// if(!connected){
|
|
// return (
|
|
// <View style={{flex: 1}}>
|
|
// <Elements.nointernet
|
|
// message="No internet found. Please check your internet connection."
|
|
// buttonText="Try Again"
|
|
// onPress={() => {
|
|
// NetInfo.fetch().then(state => {
|
|
// console.log("Connection type", state.type);
|
|
// console.log("Is connected?", state.isConnected);
|
|
// if(state.isConnected){
|
|
// init()
|
|
// }else{
|
|
// Elements.nointernet2()
|
|
// }
|
|
// })
|
|
// }}
|
|
// />
|
|
// </View>
|
|
// )
|
|
// }
|
|
|
|
// return (
|
|
// <SafeAreaView style={{flex: 1}}>
|
|
// <ScrollView
|
|
// showsHorizontalScrollIndicator={false}
|
|
// // showsVerticalScrollIndicator={false}
|
|
// contentContainerStyle={{
|
|
// flexGrow: 1,
|
|
// }}
|
|
// refreshControl={
|
|
// <RefreshControl refreshing={loading} onRefresh={init} />
|
|
// }
|
|
// >
|
|
// {/* <View style={{flex: 1, height: '5%'}}></View> */}
|
|
// {transactions.length == 0 ?
|
|
// <View style={{flex: 10, justifyContent: 'center', alignItems: 'center'}}>
|
|
// <Text style={{width: '70%', textAlign: 'center'}}>There's nothing here.</Text>
|
|
// <Text style={{width: '70%', textAlign: 'center'}}>You have made no transactions yet.</Text>
|
|
// </View>
|
|
// :
|
|
// <View>
|
|
// <View style={{paddingVertical: 15, alignItems: 'center'}}>
|
|
// <Text style={{padding: 15, width: '100%', textAlign: 'center'}}>
|
|
// Only your last 5 transactions can be viewed. For your complete transaction history please go to
|
|
|
|
// <Text style={{color: Theme.colors.primary, textDecorationLine: 'underline'}} onPress={() => {
|
|
// let url = 'https://unioil.com/loyalty'
|
|
// Linking.canOpenURL(url).then(supported => {
|
|
// if (!supported) {
|
|
// console.log('Cant handle url')
|
|
// alert("URL Not Supported")
|
|
// } else {
|
|
// return Linking.openURL(url)
|
|
// }
|
|
// }).catch(err => {
|
|
// console.error('An error occurred', err)
|
|
// })
|
|
// }}>
|
|
// unioil.com/loyalty
|
|
// </Text>
|
|
// </Text>
|
|
|
|
// </View>
|
|
// <View>{renderTransactions()}</View>
|
|
// </View>
|
|
// }
|
|
// <View style={{flex: 1, height: 30}}></View>
|
|
// </ScrollView>
|
|
// </SafeAreaView>
|
|
// );
|
|
// }
|
|
|
|
/*
|
|
|
|
|
|
// const transactions = [
|
|
// {
|
|
// transactionID: "12345",
|
|
// date: "13 Feb 2020, 04:27 PM",
|
|
// station: "APP",
|
|
// total: "5,000.00",
|
|
// earned: "5,000.00",
|
|
// redeemed: "0.00",
|
|
// rate: 1,
|
|
// items: [{
|
|
// item: 'PREPAID POINTS',
|
|
// quantity: 1,
|
|
// price: '5,000.00'
|
|
// }]
|
|
// },
|
|
// {
|
|
// transactionID: "1367",
|
|
// date: "13 Feb 2020, 01:57 PM",
|
|
// station: "UNIOIL-TESTER",
|
|
// total: "2,388.01",
|
|
// earned: "1.78",
|
|
// redeemed: "2,000.00",
|
|
// rate: 5,
|
|
// items: [{
|
|
// item: "EUROS MOGAS91",
|
|
// quantity: 6.65,
|
|
// price: "45.10"
|
|
// },{
|
|
// item: "UN MOTORSPORT 4T SJ 20W-50 (12X800)",
|
|
// quantity: 1,
|
|
// price: "134.00"
|
|
// },{
|
|
// item: "UN Gmax SG/CD 20W-50 (6x4)",
|
|
// quantity: 1,
|
|
// price: "588.00"
|
|
// },{
|
|
// item: "UN DELUX CH-4/CF/CF-2/SJ 15W-40 (6x4)",
|
|
// quantity: 1,
|
|
// price: "646.00"
|
|
// },{
|
|
// item: "UN Gmax SG/CD 20W-50 ()",
|
|
// quantity: 6.65,
|
|
// price: "45.10"
|
|
// }]
|
|
// },
|
|
// {
|
|
// transactionID: "23435",
|
|
// date: "13 Feb 2020, 04:27 PM",
|
|
// station: "APP",
|
|
// total: "5,000.00",
|
|
// earned: "5,000.00",
|
|
// redeemed: "0.00",
|
|
// rate: 2,
|
|
// items: []
|
|
// },
|
|
// {
|
|
// transactionID: "46457",
|
|
// date: "13 Feb 2020, 04:27 PM",
|
|
// station: "APP",
|
|
// total: "5,000.00",
|
|
// earned: "5,000.00",
|
|
// redeemed: "0.00",
|
|
// rate: 0,
|
|
// items: []
|
|
// },
|
|
// {
|
|
// transactionID: "78978",
|
|
// date: "13 Feb 2020, 04:27 PM",
|
|
// station: "APP",
|
|
// total: "5,000.00",
|
|
// earned: "5,000.00",
|
|
// redeemed: "0.00",
|
|
// rate: 0,
|
|
// items: []
|
|
// },
|
|
// {
|
|
// transactionID: "24234",
|
|
// date: "13 Feb 2020, 04:27 PM",
|
|
// station: "APP",
|
|
// total: "5,000.00",
|
|
// earned: "5,000.00",
|
|
// redeemed: "0.00",
|
|
// rate: 0,
|
|
// items: []
|
|
// }
|
|
// ]
|
|
|
|
|
|
*/ |