ilink-world/screens/history-request/HistoryItemDetails.js

256 lines
8.9 KiB
JavaScript

import React,{ Component} from 'react'
import {StyleSheet,View,Text} from 'react-native'
import CardView from 'react-native-cardview'
import Button from 'apsl-react-native-button'
import {responsiveHeight,responsiveWidth} from 'react-native-responsive-dimensions'
import Icons from 'react-native-vector-icons/Ionicons'
import {updateCreditDemand} from "../../webservice/HistoryRequestApi";
import {readUser} from "../../webservice/AuthApi";
let typesta=0
let moment=require('moment-timezone')
var colorback='white'
import I18n from "react-native-i18n"
import {getAgentNetworksList} from "../../webservice/NetworkApi";
import Icon from "./History";
import {Header} from "react-native-elements";
let theme=require('./../../utils/theme.json')
const route=require("./../../route.json")
export default class HistoryItemDetails extends Component{
static navigatorStyle = {
navBarBackgroundColor:theme.accentLight,
statusBarColor:theme.accent,
navBarTextColor: '#FFFFFF',
navBarButtonColor: '#FFFFFF',
};
static navigationOptions = ({navigation})=>{
return{ drawerLabel: () => null,
title:"Transaction N°"+navigation.getParam("item",{id:"-"}).id
}};
constructor(props) {
super(props);
this.item=this.props.navigation.getParam("item",null);
let sta=''
if(this.item.status==='1'){
typesta=1
colorback='#AEAEAE'
sta=I18n.t('TREAT_DEMAND')
}else {
colorback='green'
typesta=2
sta=I18n.t('ACTION_TREAT_DEMAND')}
this.state={
statut:sta,
user:null,
networks:[],
loadingTreat:false,
color:colorback,
}
readUser().then(async (user)=>{
let networks=[]
networks = await getAgentNetworksList(user.agentId);
this.setState({user: user, networks: networks.networks})
})
}
render() {
let ago=moment.tz(this.item.date_creation,'Etc/GMT+0').format();
ago=moment(ago)
return (
<View style={this.styles.container}>
<CardView
style={this.styles.cardcontainer1}
><Text style={{
fontSize:17,
fontWeight:'bold',
color:'black',
marginLeft:responsiveWidth(5)
}}>{I18n.t('MEMBER_INFO')}</Text>
<View style={{
flexDirection:'row',
justifyContent:'flex-start'
}}>
<Icons name='md-call'
size={28}
color={theme.accent}
style={{
marginLeft:20
}}
/>
<Text style={this.styles.simpleuser}>{this.item.phone}</Text>
</View>
<View style={{
flexDirection:'row',
justifyContent:'flex-start'
}}>
<Icons name='md-person'
size={28}
color={theme.accent}
style={{
marginLeft:20
}}
/>
<Text style={this.styles.simpleuser}>{this.item.code_membre}</Text>
</View>
</CardView>
<CardView
style={this.styles.cardcontainer}
>
<Text style={{
fontSize:17,
fontWeight:'bold',
color:'black',
marginLeft:responsiveWidth(5)
}}>{I18n.t('DEMAND_INFO')}</Text>
<View style={{
flexDirection:'row',
justifyContent:'flex-start'
}}>
<Icons name='md-git-branch'
size={28}
color={theme.accent}
style={{
marginLeft:20
}}
/>
<Text style={this.styles.simpleuser}>{this.item.code_parrain}</Text>
</View>
<View style={{
flexDirection:'row',
justifyContent:'flex-start'
}}>
<Icons name='md-code-working'
size={28}
color={theme.accent}
style={{
marginLeft:20
}}
/>
<Text style={this.styles.simpleuser}>{this.item.reseau}</Text>
</View>
<View style={{
flexDirection:'row',
justifyContent:'flex-start'
}}>
<Icons name='md-wallet'
size={28}
color={theme.accent}
style={{
marginLeft:20
}}
/>
<Text style={this.styles.simpleuser}>{this.item.montant}</Text>
</View>
<View style={{
flexDirection:'row',
justifyContent:'flex-start'
}}>
<Icons name='md-calendar'
size={28}
color={theme.accent}
style={{
marginLeft:20
}}
/>
<Text style={this.styles.simpleuser}>{ago.format(" Do MMMM YYYY à HH:mm")}</Text>
</View>
<View style={{
flexDirection:'row',
alignSelf:'flex-end',
marginRight:20,
justifyContent:'flex-start'
}}>
<Icons name='md-time'
size={28}
color={theme.accent}
/>
<Text style={{
marginLeft:responsiveWidth(2),
fontSize:16,
color:theme.accent
}}>{ago.fromNow()}</Text>
</View>
</CardView>
{this.state.user?this.renderBtn():null}
</View>)
}
styles=StyleSheet.create({
container:{
flex:1,
},
btnstyle:{
},
simpleuser: {
marginLeft:responsiveWidth(2),
fontSize:16,
color:'#3E3E3E'
},
textbtnstyle:{
color:"white",
fontWeight:"bold",
fontSize:18
},
cardcontainer1:{
justifyContent:'space-evenly',
flex:2,
marginRight:3,
marginLeft:3,
},
cardcontainer:{
justifyContent:'space-evenly',
flex:3,
margin:3,
}
})
onTreatDemand() {
if(this.item!=="1"){
this.setState({loadingTreat:true})
console.warn(this.item);
updateCreditDemand(this.item.phone,this.item.id).then((data)=>{
this.setState({loadingTreat:false})
console.log(data);
if(data.success===1){
this.setState({statut:I18n.t('TREAT_DEMAND'),color:"#AEAEAE"})
}else{
console.log(data);
}
})
}
}
renderBtn() {
const {user}=this.state
console.warn(this.item)
if(user) {
if (this.item.code_parrain===user.code_membre) {
return (<Button
style={{
borderColor: 'transparent',
borderRadius: 6,
marginLeft: 5,
marginRight: 5,
backgroundColor: this.state.color
}}
isLoading={this.state.loadingTreat}
onPress={() => {
this.onTreatDemand()
}}
textStyle={this.styles.textbtnstyle}
>
{this.state.statut}
</Button>
)
}
}
}
}