Group demand OK

redux/actions/NanoCreditAction.js

@@ -1,4 +1,4 @@
-import { CREATE_GROUP_PENDING, CREATE_GROUP_SUCCESS, CREATE_GROUP_ERROR, CREATE_GROUP_RESET } from "../types/NanoCreditType";
+import { CREATE_GROUP_PENDING, CREATE_GROUP_SUCCESS, CREATE_GROUP_ERROR, CREATE_GROUP_RESET, GET_DEMAND_GROUP_PENDING, GET_DEMAND_GROUP_SUCCESS, GET_DEMAND_GROUP_ERROR, GET_DEMAND_GROUP_RESET } from "../types/NanoCreditType";
 
 export const fetchCreateGroupPending = () => ({
      type: CREATE_GROUP_PENDING
@@ -17,3 +17,21 @@ export const fetchCreateGroupError = (error) => ({
 export const fetchCreateGroupReset = () => ({
      type: CREATE_GROUP_RESET
 });
+
+export const fetchGetDemandsGroupPending = () => ({
+     type: GET_DEMAND_GROUP_PENDING
+});
+
+export const fetchGetDemandsGroupSuccess = (res) => ({
+     type: GET_DEMAND_GROUP_SUCCESS,
+     result: res,
+});
+
+export const fetchGetDemandsGroupError = (error) => ({
+     type: GET_DEMAND_GROUP_ERROR,
+     result: error
+});
+
+export const fetchGetDemandsGroupReset = () => ({
+     type: GET_DEMAND_GROUP_RESET
+});

redux/reducers/GetDemandsGroupReducer.js

@@ -0,0 +1,33 @@
+import { GET_DEMAND_GROUP_PENDING, GET_DEMAND_GROUP_SUCCESS, GET_DEMAND_GROUP_ERROR, GET_DEMAND_GROUP_RESET } from "../types/NanoCreditType";
+
+const initialState = {
+     loading: false,
+     result: null,
+     error: null
+};
+
+export default (state = initialState, action) => {
+     switch (action.type) {
+          case GET_DEMAND_GROUP_PENDING: return {
+               ...state,
+               loading: true
+          }
+          case GET_DEMAND_GROUP_SUCCESS: return {
+               ...state,
+               loading: false,
+               result: action.result.data,
+               error: null
+          }
+          case GET_DEMAND_GROUP_ERROR: return {
+               ...state,
+               loading: false,
+               result: null,
+               error: action.result
+          }
+          case GET_DEMAND_GROUP_RESET: return initialState;
+
+          default: {
+               return state;
+          }
+     }
+};

redux/reducers/index.js

@@ -26,6 +26,7 @@ import LinkCardReducer from "./LinkCardReducer";
 import RetraitCashAgentIdVerificationReducer from "./RetraitCashAgentIdVerificationReducer";
 import CreateGroupReducer from "./CreateGroupReducer";
 import SaveOnesignalReducer from "./SaveOnesignalReducer";
+import GetDemandsGroupReducer from "./GetDemandsGroupReducer";
 
 const persistConfig = {
      key: 'root',
@@ -61,7 +62,8 @@ const rootReducer = persistCombineReducers(persistConfig, {
      linkCardReduder: LinkCardReducer,
      retraitCashAgentIdVerificationReducer: RetraitCashAgentIdVerificationReducer,
      createGroupReducer: CreateGroupReducer,
-     saveOnesignalReducer: SaveOnesignalReducer
+     saveOnesignalReducer: SaveOnesignalReducer,
+     getDemandsGroupReducer: GetDemandsGroupReducer
 });
 
 export default rootReducer;

redux/types/NanoCreditType.js

@@ -2,3 +2,8 @@ export const CREATE_GROUP_PENDING = 'CREATE_GROUP_PENDING';
 export const CREATE_GROUP_SUCCESS = 'CREATE_GROUP_SUCCESS';
 export const CREATE_GROUP_ERROR = 'CREATE_GROUP_ERROR';
 export const CREATE_GROUP_RESET = 'CREATE_GROUP_RESET';
+
+export const GET_DEMAND_GROUP_PENDING = 'GET_DEMAND_GROUP_PENDING';
+export const GET_DEMAND_GROUP_SUCCESS = 'GET_DEMAND_GROUP_SUCCESS';
+export const GET_DEMAND_GROUP_ERROR = 'GET_DEMAND_GROUP_ERROR';
+export const GET_DEMAND_GROUP_RESET = 'GET_DEMAND_GROUP_RESET';

screens/history-request/HistoryItem.js

@@ -102,7 +102,7 @@ export class HistoryItem extends React.Component {
                                    marginBottom: 10,
                                    color: this.state.colorstate,
 
-                              }}>{this.state.status}</Text>
+                              }}>{item.nombre_validation}</Text>
                               <Text style={style.time}>{this.state.time}</Text>
                          </View>
                          <View style={style.bottomSeparator} />

screens/home/Home.js

@@ -1424,7 +1424,7 @@ class Home extends BaseScreen {
                          translucent={true}
                     />
                     {/* Start here to comment */}
-
+{/*                     
                     {
                          (this.state.loadingDialog || this.props.loading) ?
                               <View
@@ -1461,7 +1461,7 @@ class Home extends BaseScreen {
                               this.setState({ showProgress: false })
                               Alert.alert(I18n.t("PROBLEM_OCCUR"), I18n.t("PROBLEM_OCCUR_DIRECTION"), [{ text: "Ok", onPress: () => { } }])
                          }}
-                    />
+                    /> */}
                     {this.makeCardSearch()}
                     {this.makeSlidingUp()}
                     {this.makeDialogLoader()}

screens/nano-credit/DemandGroupNanoCredit.js

@@ -1,6 +1,7 @@
 
 import React, { Component } from 'react';
 import {
+     Alert,
      Platform,
      StyleSheet,
      AppState,
@@ -13,7 +14,7 @@ import {
      StatusBar
 } from 'react-native';
 import ActionButton from 'react-native-action-button';
-import Icon from 'react-native-vector-icons/MaterialIcons';
+import Icon from 'react-native-vector-icons/MaterialCommunityIcons';
 import { responsiveFontSize, responsiveHeight, responsiveWidth } from 'react-native-responsive-dimensions';
 import { HistoryListItem, HistoryItemSectionned } from '../history-request/HistoryItem';
 import { credrequester } from './../../route.json';
@@ -47,6 +48,13 @@ import { withNavigationFocus } from "react-navigation";
 import IconWithBadge from "../IconWithBadge";
 import { Appbar, Paragraph, Menu, Divider, Provider } from 'react-native-paper';
 import DeviceInfo from 'react-native-device-info'
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+import {getNanoCreditDemandsAction, getNanoCreditDemandsReset} from '../../webservice/user/NanoCreditApi';
+import { IlinkEmitter } from '../../utils/events';
+import { Typography } from '../../config/typography';
+import { ScrollView } from 'react-native-gesture-handler';
+import { Color } from '../../config/Color';
 
 
 class DemandValidationGroup extends React.Component {
@@ -87,180 +95,8 @@ class DemandValidationGroup extends React.Component {
 
      constructor(props) {
           super(props, true);
-          this.state = this.initState();
+          this.state = {
-          readUser().then((user) => { this.setState({ user: user }) })
-          this._populateIcons().then(() => {
-          });
-
-          this.navigation = this.props.navigation
-          this.currentLocale = DeviceInfo.getDeviceLocale().includes("fr") ? "fr" : "en-gb";
-          //moment.locale(this.currentLocale);
-
-     };
-
-     navigationButtonPressed({ buttonId }) {
-          if (buttonId === 'id') {
-               this.showFilter();
-          } else if (buttonId === 'sectionned') {
-               this.setState({ isSectionned: !this.state.isSectionned })
-          }
-     }
-
-
-     showFilter() {
-
-          /*if (this.state.filter) {
-              Navigation.mergeOptions(route.stackRoot,
-                  {
-                  topBar: {
-                      rightButtons: [
-                          {
-                              title: 'Non Traité',
-                          },
-                          {
-                              title: 'Traité',
-                          },
-                          {
-                              title: 'Période',
-                          },
-                          {
-                              title: 'Tout',
-                          },
-                          {
-                              title: 'Trier par',
-                          },
-                          {
-                              title: '',
-                          },
-                      ],
-                      onButtonPressed: (index) => {
-                          let data = this.state.conserve
-                          console.log(index)
-                          console.log(data);
-  
-                          if (data !== null) {
-                              let filtre = "";
-                              if (index < 2) {
-                                  switch (index) {
-                                      case 0:
-                                          filtre = I18n.t('NO_TREAT')
-                                          break;
-                                      case 1:
-                                          filtre = I18n.t('TREAT');
-                                          break;
-  
-                                  }
-                                  let fi = data.filter(item => item.statut === filtre)
-                                  this.setState({listdata: fi, filter: true})
-                              } else if (index === 2) {
-                                  this.setState({panelVisible: true})
-                              } else {
-                                  this.setState({listdata: data, filter: false})
-                              }
-                          }
-                      }
-                  }}
-              );
-  
-          } else {
-              Navigation.mergeOptions(route.stackRoot,
-                  {
-                      topBar: {
-                          rightButtons: [
-                              {
-                                  title: I18n.t('NO_TREAT'),
-                              },
-                              {
-                                  title: I18n.t('TREAT'),
-                              }
-                              , {
-                                  title: I18n.t('PERIOD'),
-                              },
-                              {
-                                  title: '',
-                              },
-                              {
-                                  title: 'Trier par',
-                              }, {
-                                  title: '',
-                              },
-                          ],
-                          onButtonPressed: (index) => {
-                              let data = this.state.conserve
-                              if (data != null && data.length > 0) {
-                                  var filtre = "";
-                                  if (index < 2) {
-                                      switch (index) {
-                                          case 0:
-                                              filtre = I18n.t('NO_TREATED');
-                                              break;
-                                          case 1:
-                                              filtre = I18n.t('TREATED');
-                                              break;
-  
-                                      }
-                                      let fi = data.filter(item => item.statut === filtre)
-                                      this.setState({listdata: fi, filter: true})
-                                  } else if (index === 2) {
-                                      this.setState({panelVisible: true})
-                                      this.props.navigator.showContextualMenu(
-                                          {
-                                              rightButtons: [
-                                                  {
-                                                      title: I18n.t('CANCEL'),
-                                                  },
-                                                  {
-                                                      title: I18n.t('FILTER'),
-                                                  },
-  
-                                              ],
-                                              onButtonPressed: (index) => {
-                                                  console.log(index)
-  
-                                                  switch (index) {
-                                                      case 1:
-                                                          let {dateend, datestart} = this.state;
-                                                          this.onfilterPress();
-                                                  }
-                                                  this.setState({panelVisible: false});
-                                              }
-                                          }
-                                      );
-                                  } else {
-                                      this.setState({listdata: data, filter: false})
-                                  }
-                              }
-                          }
-                      }
-                  }
-              );
-  
-          }*/
-     }
-
-     _populateIcons = function () {
-          return new Promise(function (resolve, reject) {
-               Promise.all(
-                    [
-                         Icon.getImageSource('sort', 30),
-                         Icon.getImageSource('layer-group', 30),
-                    ]
-               ).then((values) => {
-                    sortIcons = values[0];
-                    sectionIcons = values[1];
-                    resolve(true);
-               }).catch((error) => {
-                    console.log(error);
-                    reject(error);
-               }).done();
-          });
-     };
-
-     initState() {
-          return {
                user: {},
-               listdata: [],
-               listdataSend: [],
                conserve: [],
                count: 0,
                translateAnim: new Animated.Value(0),
@@ -277,31 +113,25 @@ class DemandValidationGroup extends React.Component {
                isLoaded: false,
                isSectionned: false,
                isDateTimePickerVisible: false,
-               isDateEndTimePickerVisible: false
+               isDateEndTimePickerVisible: false,
-          }
+               isDataSubmit: false
-     }
+          };
+          readUser().then((user) => { 
+               this.setState({ user: user });
+               this.props.getNanoCreditDemandsAction(user.id); 
+          });
 
-     updateList(data) {
+          this.props.getNanoCreditDemandsReset();
-          if (!this.state.filter) {
+          this.navigation = this.props.navigation
-               let rev = data.reverse()
+          this.currentLocale = DeviceInfo.getDeviceLocale().includes("fr") ? "fr" : "en-gb";
-               this.setState({ listdata: rev, conserve: rev, isLoaded: true });
+          //moment.locale(this.currentLocale);
-          }
-     }
-     updateMyList(data) {
-          if (!this.state.filter) {
-               let rev = data.reverse()
-               this.setState({ listdataSend: rev, conserve: rev, isLoaded: true });
-          }
 
-     }
+     };
 
      componentDidMount() {
           const { routeName } = this.navigation.state
-          this.setState({ position: routeName === "demandeValidationGroupe" ? 0 : 1 })
+          this.setState({ position: routeName === "demandeValidationGroupe" ? 0 : 1,      isDataSubmit: true });
-          this.refreshData()
+          this.refreshData();
-          /*           this.intervaller = setInterval(() => {
-                         this.refreshData(false)
-                    }, 2000) */
           this.animateSlidingUp(false)
           this.props.navigation.addListener("didFocus", () => {
                this.refreshData(false)
@@ -315,40 +145,6 @@ class DemandValidationGroup extends React.Component {
           clearInterval(this.intervaller)
      }
 
-     renderOptionsMenu() {
-          return (
-               <View
-                    style={{
-                         position: "absolute",
-                         zIndex: 100,
-                         paddingTop: 50,
-                         right: 10,
-                         flexDirection: 'row',
-                         visible: this.state.visibleMenu,
-                         justifyContent: 'center'
-                    }}>
-                    <Menu
-                         visible={this.state.visibleMenu}
-                         onDismiss={this._closeMenu}
-                         anchor={
-                              <Button onPress={this._openMenu}>Show menu</Button>
-                         }
-                    >
-                         <Menu.Item onPress={() => {
-                              this.setState({ isSectionned: !this.state.isSectionned })
-                              this._closeMenu()
-                         }}
-                              title="Section" />
-                         <Divider />
-                         <Menu.Item onPress={() => {
-
-                              this.animateSlidingUp(!this.state.isSliding)
-                              this._closeMenu()
-                         }} title={I18n.t("FILTER_DATE")} />
-                    </Menu>
-               </View>
-          )
-     }
      animateSlidingUp(state = false) {
           const height = responsiveHeight(100)
           let initialValue = !state ? 0 : height,
@@ -356,7 +152,6 @@ class DemandValidationGroup extends React.Component {
 
           this.setState({ isSliding: state })
 
-
           this.state.translateAnim.setValue(initialValue);  //Step 3
           Animated.timing(     //Step 4
                this.state.translateAnim,
@@ -367,10 +162,146 @@ class DemandValidationGroup extends React.Component {
                }
           ).start()
      }
+
      _openMenu = () => this.setState({ visibleMenu: true });
 
      _closeMenu = () => this.setState({ visibleMenu: false });
 
+     renderDemandItem = (item) => {
+          let dateFormat = moment.tz(item.date_creation, 'Etc/GMT+0').format();
+          dateFormat = moment(dateFormat).fromNow();
+
+          return (
+               <TouchableOpacity onPress={() =>
+                    this.props.navigator.navigate(route.historyItemDetails)}>
+                    <View style={styles.content}>
+
+                         <Text style={styles.title}>{item.nom}</Text>
+
+                         <Text style={styles.description}>{`${I18n.t('CREATOR')}: ${item.createur}`}</Text>
+
+                         {/* <Text style={styles.description}>{`Sponsor 1: ${item.sponsor1}`}</Text>
+
+                         <Text style={styles.description}>{`Sponsor 2:  ${item.sponsor2}`}</Text>
+
+                         <Text style={styles.description}>{`Sponsor 3:  ${item.sponsor3}`}</Text> */}
+
+                         <View style={styles.timeContent}>
+                              <View style={{alignContent: 'flex-start', flex: 1,           flexDirection: 'row'}}>
+                                   <Text style={{
+                                        fontWeight: 'bold',
+                                        marginLeft: 20,
+                                        marginBottom: 10,
+                                        color: item.nombre_validation === 3 ? 'green' : 'red',
+                                   }}>
+                                        {item.nombre_validation === 3 ? I18n.t('VALIDATE') : I18n.t('NO_VALIDATE')} 
+                                        {` (${item.nombre_validation} ${item.nombre_validation > 1 ? I18n.t('VALIDATIONS') : I18n.t('VALIDATION')})`}
+                                   </Text>
+                              </View>
+
+                              <View style={{alignContent: 'flex-end', flex: 1, flexDirection: 'row'}}>
+                                   <Icon name="map-marker" style={[styles.descriptionIcon], {color: Color.accentColor, marginTop: 5}} />
+                                   <Text style={styles.time}>{ item.country}</Text>
+
+                                   <Icon name="clock" style={[styles.descriptionIcon], {color: Color.accentColor, marginTop: 5}} />
+                                   <Text style={styles.time}> {dateFormat}</Text>
+                              </View>
+
+                         </View>
+
+                         <View style={styles.bottomSeparator} />
+                    </View>
+               </TouchableOpacity>
+          )
+     }
+
+     rendeGetDemandsGroupResponse = () => {
+
+          const { resultGetDemandsGroup, errorGetDemandsGroup } = this.props;
+
+          if (errorGetDemandsGroup !== null) {
+               if (typeof errorGetDemandsGroup.data !== 'undefined') {
+                    return (
+                         <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
+                              <Text style={Typography.body1}>{errorGetDemandsGroup.data.error}</Text>
+                         </View>
+                    )
+               }
+               else {
+                    return (
+                         <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
+                              <Text style={Typography.body1}>{errorGetDemandsGroup}</Text>
+                         </View>
+                    )
+               }
+          }
+
+          if (resultGetDemandsGroup !== null) {
+               if (resultGetDemandsGroup.response !== null) {
+                    return (
+                         Array.isArray(resultGetDemandsGroup.response) && (resultGetDemandsGroup.response.length) > 0 ?
+                              (<ScrollView style={{ flex: 1}}>
+                                   {
+                                        resultGetDemandsGroup.response.map((item) => (
+                                              this.renderDemandItem(item)
+                                         ))
+                                   }
+                              </ScrollView>) :
+                              (
+                                   <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
+                                        <Text style={Typography.body1}>{I18n.t('NO_DEMAND_CREATION_GROUP')}</Text>
+                                   </View>
+                              )
+                    )
+
+               }
+          }
+     }
+
+     renderLoader = () => {
+          return (
+               <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
+                    {Platform.OS === 'android'
+                         ?
+                         (
+                              <>
+                                   <ProgressBarAndroid />
+                                   <Text>{I18n.t('LOADING_DOTS')}</Text>
+
+                              </>
+                         ) :
+                         <>
+                              <ActivityIndicator size="large" color={'#ccc'} />
+                              <Text>{I18n.t('LOADING_DOTS')}</Text>
+                         </>
+                    }
+               </View>
+          )
+     }
+
+     printOptions() {
+          return (<ActionButton buttonColor={accent}>
+               <ActionButton.Item buttonColor={primary} title={I18n.t('CREATE_GROUP')}
+                    onPress={() => {
+                         this.props.navigation.push(route.createGroupNanoCredit);
+                    }}
+               >
+                    <Icon name="account-multiple-plus" style={styles.actionButtonIcon} />
+               </ActionButton.Item>
+               <ActionButton.Item buttonColor={purpleLight} title={I18n.t('JOIN_GROUP')} 
+                    onPress={() => {
+
+                    }}
+               >
+                    <Icon name="account-multiple" style={styles.actionButtonIcon} />
+               </ActionButton.Item>
+          </ActionButton>)
+     }
+
+     refreshData(autoref = true) {
+
+     }
+
      render() {
           return (
                <Provider>
@@ -382,8 +313,6 @@ class DemandValidationGroup extends React.Component {
                               translucent={false}
                          />
 
-                         {this.renderSliding()}
-
                          <Appbar.Header dark={true} style={{ backgroundColor: theme.primary }}>
                               <Appbar.BackAction
                                    onPress={() => { this.props.navigation.pop() }}
@@ -393,442 +322,33 @@ class DemandValidationGroup extends React.Component {
                                    subtitle={this.state.position === 0 ? I18n.t('VALIDATION_DEMAND') : I18n.t('DELETE_DEMAND')}
                               />
                               <Appbar.Action icon="refresh" onPress={() => { this.refreshData() }} />
-                              <Appbar.Action icon="more-vert" onPress={() => { this._openMenu(); this.renderSliding(); }} />
+                              {/* <Appbar.Action icon="more-vert" onPress={() => { this._openMenu(); this.renderSliding(); }} /> */}
                          </Appbar.Header>
-                         {this.renderOptionsMenu()}
+                         {this.state.position === 0 ? 
-
+                              this.props.loadingGetDemandsGroup ? 
-                         {this.state.position === 0 ? this._renderListDemandsSend() : this._renderListDemandReceive()}
+                                   this.renderLoader() :
+                                   this.rendeGetDemandsGroupResponse()
+                         : null}
                     </View>
                </Provider>
           );
 
      }
-     renderSliding() {
-          return (
-               <Animated.View style={[styles.slidingup, { translateY: this.state.translateAnim }]}>
-                    <Calendar
-                         onChange={(range) => console.log(range)}
-                         minDate="2018-04-20"
-                         startDate="2018-04-30"
-                         endDate="2018-05-05"
-                         theme={{
-                              activeDayColor: {},
-                              monthTitleTextStyle: {
-                                   color: '#6d95da',
-                                   fontWeight: '300',
-                                   fontSize: 16,
-                              },
-                              emptyMonthContainerStyle: {},
-                              emptyMonthTextStyle: {
-                                   fontWeight: '200',
-                              },
-                              weekColumnsContainerStyle: {},
-                              weekColumnStyle: {
-                                   paddingVertical: 10,
-                              },
-                              weekColumnTextStyle: {
-                                   color: '#b6c1cd',
-                                   fontSize: 13,
-                              },
-                              nonTouchableDayContainerStyle: {},
-                              nonTouchableDayTextStyle: {},
-                              startDateContainerStyle: {},
-                              endDateContainerStyle: {},
-                              dayContainerStyle: {},
-                              dayTextStyle: {
-                                   color: '#2d4150',
-                                   fontWeight: '200',
-                                   fontSize: 15,
-                              },
-                              dayOutOfRangeContainerStyle: {},
-                              dayOutOfRangeTextStyle: {},
-                              todayContainerStyle: {},
-                              todayTextStyle: {
-                                   color: '#6d95da',
-                              },
-                              activeDayContainerStyle: {
-                                   backgroundColor: '#6d95da',
-                              },
-                              activeDayTextStyle: {
-                                   color: 'white',
-                              },
-                              nonTouchableLastMonthDayTextStyle: {}
-                         }}
-                         style={{ height: responsiveHeight(60) }}
-                    />
-                    <View style={{ flexDirection: 'row' }}>
-                         <Button>{I18n.t('QUIT')}</Button>
-                         <Button>{I18n.t('FILTER')}</Button>
-                    </View>
-               </Animated.View>)
-     }
-     renderSectionnedList(list) {
-
-          if (this.state.isLoaded) {
-               let data = list;
-               if (data !== null) {
-                    if (data.length > 0) {
-                         return (<HistoryItemSectionned
-                              user={this.state.user}
-                              list={list}
-                              refresh={() => this.refreshData()}
-                              style={styles.listbackground} />)
-                    } else if (this.state.filter) {
-
-                         return (
-                              <View style={styles.emptyListe}>
-                                   <Text>{I18n.t('NO_ITEMS_REQUEST')}</Text>
-                              </View>
-                         )
-                    } else {
-                         return (
-                              <View style={styles.emptyListe}>
-                                   <ProgressBarAndroid />
-                                   <Text>{I18n.t('LOADING_DOTS')}</Text>
-                              </View>
-                         )
-                    }
-               } else {
-                    return (
-                         <View style={styles.emptyListe}>
-                              <Text>{I18n.t('EMPTY_LIST_REQUEST')}</Text>
-                         </View>
-                    )
-
-               }
-          }
 }
 
-     renderList(list) {
+const mapStateToProps = state => ({
-          if (this.state.isLoaded && list instanceof Array) {
+     loadingGetDemandsGroup: state.getDemandsGroupReducer.loading,
-               let data = list;
+     resultGetDemandsGroup: state.getDemandsGroupReducer.result,
-               if (data !== null) {
+     errorGetDemandsGroup: state.getDemandsGroupReducer.error,
-                    if (data.length > 0) {
-                         return (<HistoryListItem
-                              user={this.state.user}
-                              list={list}
-                              refreshing={() => { this.refreshData() }}
-                              refresh={() => this.refreshData()}
-                              isRefreshing={this.state.isRefreshing}
-                              navigator={this.props.navigation}
-                              style={styles.listbackground}
-                              isDemandSend={this.state.position === 0} />)
-                    } else if (this.state.filter) {
-
-                         return (
-                              <View style={styles.emptyListe}>
-                                   <Text>{I18n.t('NO_ITEM_REQUEST')}</Text>
-                              </View>
-                         )
-                    } else if (data.length === 0) {
-                         return (
-                              <View style={styles.emptyListe}>
-                                   <Text>{I18n.t('NO_ITEM_REQUEST')}</Text>
-                              </View>
-                         )
-                    } else {
-                         return (
-                              <View style={styles.emptyListe}>
-                                   <ProgressBarAndroid />
-                                   <Text>{I18n.t('LOADING_DOTS')}</Text>
-
-                              </View>
-                         )
-                    }
-               } else {
-                    return (
-                         <View style={styles.emptyListe}>
-                              <Text>{I18n.t('EMPTY_LIST_REQUEST')} </Text>
-                         </View>
-                    )
-
-               }
-
-          } else if (list.length === 0) {
-               return (
-                    <View style={styles.emptyListe}>
-                         <Text>{I18n.t('NO_ITEM_REQUEST')}</Text>
-
-                    </View>
-               )
-
-          }
-
-     }
-
-     renderLoading() {
-          return (<View><ProgressBarAndroid /><Text>{I18n.t('LOADING_DOTS')}</Text></View>)
-     }
-     showSlidingUpPanel() {
-          /*  return (<SlidingUpPanel
-                style={styles.slidingup}
-                height={responsiveHeight(100)}
-                visible={this.state.panelVisible}
-                ref={(c) => this.panel = c}
-                draggableRange={{top: responsiveHeight(100), bottom: 0}}
-                onRequestClose={() => this.setState({panelVisible: false})}>
-                <View style={styles.container}>
-                    {this.showSlidingUpView()}
-                </View>
-            </SlidingUpPanel>)
-        }
-  
-        showSlidingUpView() {
-          /*  return (
-                <View style={datefilter.container}>
-                    <View stlye={datefilter.content}>
-                     <DatepickerRange
-                            styles={{
-                                borderColor: 'transparent',
-                                borderRadius: 0,
-                                margin: 10,
-                                height:responsiveWidth(50)
-                            }}
-                            initialMonth='201801'
-                            onSelect={(fromdate,untildate)=>this._handleDatePicked(fromdate,untildate)}
-                            dayHeadings={['D', 'L', 'M', 'M', 'J', 'V', 'S']}
-                            maxMonth={12}
-                            startdate={moment('20180101').format('YYYYMMDD')}
-                            untilDate='20181231'
-                            minDate='20180101'
-                            maxDate='20181231'
-                            buttonColor='green'
-                            showReset={false}
-                    showClose={false}
-                    placeHolderStart= 'Date de debut'
-                    placeHolderUntil= 'Date fin'
-                    selectedBackgroundColor= 'green'
-                    selectedTextColor='white'
-                        />
-                </View>
-                </View>
-  
-                    )*/
-     }
-
-     /*
-     onfilterPress() {
-          let { datestart, dateend } = this.state;
-          let data = this.state.conserve;
-
-          if (data !== null) {
-               data = data.filter(item => {
-                    let mda = moment(item.dateAjout)
-                    return moment(item.dateAjout).isAfter(moment(datestart).toDate()) && (mda.isBefore(moment(dateend).toDate()))
-               })
-
-               this.setState({ listdata: data, panelVisible: false, filter: true })
-          }
-
-     }
-     */
-
-     _showDateTimePicker = (type) => {
-          if (type === 1)
-               this.setState({
-                    isDateTimePickerVisible: true
-               });
-          else this.setState({
-               isDateEndTimePickerVisible: true
-          });
-     }
-     _showDateEndPicker = () => this.setState({ isDateEndTimePickerVisible: true });
-
-     _hideDateTimePicker = () => this.setState({ isDateTimePickerVisible: false, isDateEndTimePickerVisible: false });
-     /*
-     _handleDatePicked = (fromdate, enddate) => {
-          console.log([fromdate, enddate]);
-
-          this.setState({
-               datestart: fromdate,
-               datestartformated: moment(fromdate).format('dddd Do ,MMMM YYYY'),
-               dateend: enddate,
-               dateendformated: moment(enddate).format('dddd Do ,MMMM YYYY')
-          });
-          let startdate = this.state.datestart;
-          let enddatemo = moment(enddate);
-          let dif = moment(enddatemo).diff(startdate);
-          if (dif < 0) {
-               this.setState({ filder_disable: true });
-               this.props.navigator.showSnackbar({
-                    text: I18n.t('DATE_WRONG'),
-                    duration: 'long',
-                    backgroundColor: 'red',
-                    textColor: 'white'
-               })
-          } else {
-               this.setState({ filder_disable: false });
-          }
-
-          this._hideDateTimePicker();
-     };
-     */
-
-     printOptions() {
-          if (this.state.user.category === "hyper") {
-               return (<ActionButton buttonColor={accent}>
-                    <ActionButton.Item buttonColor={purpleLight} title={I18n.t('SAVE_HISTORY')} onPress={() => {
-
-                    }}>
-                         <Icon name="save" style={styles.actionButtonIcon} />
-                    </ActionButton.Item>
-               </ActionButton>);
-          } else {
-               return (<ActionButton buttonColor={accent}>
-                    <ActionButton.Item buttonColor={primary} title={I18n.t('MAKE_REQUEST')}
-                         onPress={() => {
-                              this.props.navigation.push(route.credrequester, {
-                                   onGoBack: () => this.refreshData()
-                              })
-                         }}
-                    >
-                         <Icon name="edit" style={styles.actionButtonIcon} />
-                    </ActionButton.Item>
-                    <ActionButton.Item buttonColor={purpleLight} title={I18n.t('SAVE_HISTORY')} onPress={() => {
-
-                    }}>
-                         <Icon name="save" style={styles.actionButtonIcon} />
-                    </ActionButton.Item>
-               </ActionButton>)
-          }
-     }
-
-     _renderListDemandsSend() {
-          console.log('this.state', this.state);
-          return (<View style={styles.container}>
-               {
-                    this.state.isLoaded ?
-                         this.state.isSectionned ?
-                              this.renderSectionnedList(this.state.listdataSend) :
-                              this.renderList(this.state.listdataSend) : this.renderLoading()
-               }
-               {this.printOptions()}
-               {this.showSlidingUpPanel()}
-          </View>
-          )
-     }
-
-     _renderListDemandReceive() {
-
-          return (<View style={styles.container}>
-               {
-                    this.state.isLoaded ?
-                         this.state.isSectionned ?
-                              this.renderSectionnedList(this.state.listdata) :
-                              this.renderList(this.state.listdata) : this.renderLoading()
-               }
-               {this.printOptions()}
-               {this.showSlidingUpPanel()}
-          </View>
-          )
-     }
-
-     _renderTabGeolocated() {
-          let tabs = [{
-               text: I18n.t('DEMAND_SEND'),
-          }]
-          return <PagerTabIndicator
-               style={{
-                    height: responsiveHeight(8)
-               }}
-               tabs={tabs} />;
-     }
-
-     _renderTabHyper() {
-          let tabs = [{
-               text: I18n.t('DEMAND_RECEIVE'),
-          }]
-          return <PagerTabIndicator
-               style={{
-                    height: responsiveHeight(8)
-               }}
-               tabs={tabs} />;
-     }
-
-     _renderTabs() {
-          let tabs = [{
-               text: I18n.t('VALIDATION_DEMAND'),
-               iconSource: this.state.usersicon
-          }, {
-               text: I18n.t('DELETE_DEMAND'),
-               iconSource: this.state.charticon
-          }]
-          return <PagerTabIndicator
-               style={{
-                    height: responsiveHeight(8)
-               }}
-               tabs={tabs} />;
-     }
-
-     refreshData(autoref = true) {
-          if (autoref)
-               this.setState({ isRefreshing: true })
-          loadDemandeCredit().then((data) => {
-
-               if (data.success !== undefined) {
-                    this.setState({ listdata: [] })
-                    this.updateList(data.demands);
-                    if (this.state.position !== 0) this.props.navigation.setParams({ count: data.demands.length })
-                    this.setState({ isRefreshing: false })
-               }
-          }).catch((e) => {
-               console.warn(e)
 });
 
-          loadMyDemandeCredit().then((data) => {
+const mapDispatchToProps = dispatch => bindActionCreators({
-               if (data.success !== undefined) {
+     getNanoCreditDemandsAction: getNanoCreditDemandsAction,
-                    this.setState({ listdataSend: [] })
+     getNanoCreditDemandsReset: getNanoCreditDemandsReset
-                    this.setState({ isRefreshing: false })
+}, dispatch);
-                    if (this.state.position === 0) this.props.navigation.setParams({ count: data.demands.length })
 
-                    this.updateMyList(data.demands)
+export default connect(mapStateToProps, mapDispatchToProps)(DemandValidationGroup);
-               }
-          }).catch((e) => {
-               console.warn(e)
-          });
-     }
-}
-export default DemandValidationGroup;
-const datefilter = StyleSheet.create({
-     titleHeader: {
-          fontSize: 20,
-          fontWeight: 'bold',
-          color: 'black',
-          flex: 1,
-     },
-     datetitle: {
-          fontSize: 17,
-          color: 'black',
-          marginLeft: responsiveWidth(2),
-     },
-     datetext: {
-          fontSize: 16,
-          marginLeft: responsiveWidth(5)
-     },
-     content: {
-          flex: 2,
 
-     },
-     btnContainer: {
-          flexDirection: 'row',
-          width: responsiveWidth(100),
-          alignSelf: 'flex-end',
-          flex: 2,
-     },
-     btn: {
-          flex: 1,
-          borderColor: 'transparent',
-          borderRadius: 0,
-     },
-     btntext: {
-          fontWeight: 'bold',
-          color: accent
-     },
-     container: {
-          flex: 1,
-          justifyContent: 'space-evenly'
-     }
-})
 const styles = StyleSheet.create({
      slidingup: {
           position: "absolute",
@@ -862,6 +382,11 @@ const styles = StyleSheet.create({
           height: 22,
           color: 'white',
      },
+     descriptionIcon: {
+          fontSize: 10,
+          height: 12,
+          top: 10
+     },
      welcome: {
           fontSize: 20,
           textAlign: 'center',
@@ -884,10 +409,6 @@ const styles = StyleSheet.create({
 
           color: 'black'
      },
-     content: {
-          flex: 8
-     },
-
      title: {
           fontSize: 20,
           marginLeft: 20,
@@ -895,4 +416,46 @@ const styles = StyleSheet.create({
           color: 'black',
           fontWeight: 'bold'
      },
+     content: {
+          width: responsiveWidth(100),
+          borderBottomColor: '#FFFFFF',
+          flex: 1,
+          flexDirection: 'column',
+          paddingTop: 10,
+
+     },
+     listStyle: {
+          backgroundColor: 'white'
+     },
+     bottomSeparator: {
+          width: responsiveWidth(100),
+          height: 5,
+          justifyContent: 'center',
+          alignSelf: 'center',
+          backgroundColor: '#EEE',
+     },
+     title: {
+          color: '#000',
+          paddingLeft: 10,
+          fontSize: responsiveFontSize(2.2)
+     },
+     description: {
+          fontSize: responsiveFontSize(1.8),
+          color: '#4f5b62',
+          paddingLeft: 10,
+
+     },
+     timeContent: {
+          justifyContent: 'space-between',
+          flex: 1,
+          marginTop: 10,
+          marginBottom: 5,
+          flexDirection: 'row',
+     },
+     time: {
+          fontWeight: 'bold',
+          marginRight: 20,
+          marginBottom: 10,
+          color: theme.accent,
+     },
 });

screens/nano-credit/DemandGroupNanoCreditDetail.js

@@ -0,0 +1,577 @@
+import React, { Component } from 'react'
+import { StyleSheet, View, Text, Alert, Platform } 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 { treatCreditDemand, creditDemandResetReducer } from '../../webservice/CreditTreatDemandApi';
+import { treatCancelDemand, creditCancelResetReducer } from '../../webservice/CreditCancelDemandeApi';
+import { getAgentNetworksList } from "../../webservice/NetworkApi";
+import Icon from "./History";
+import { Header } from "react-native-elements";
+let theme = require('./../../utils/theme.json');
+import { connect } from 'react-redux';
+import { bindActionCreators } from 'redux';
+import Toast from 'react-native-root-toast';
+import { Color } from '../../config/Color'
+const route = require("./../../route.json");
+import Dialog from "react-native-dialog";
+import { FontWeight } from '../../config/typography'
+import DeviceInfo from 'react-native-device-info'
+
+class DemandGroupNanoCreditDetail 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 if (this.item.status === '0') {
+               colorback = 'green'
+               typesta = 2
+               sta = I18n.t('ACCEPTER_DEMANDE')
+          }
+          else {
+               colorback = '#AEAEAE'
+               typesta = 2
+               sta = I18n.t('REFUSED')
+          }
+
+          this.state = {
+               displayAmountModifyDialog: false,
+               statut: sta,
+               user: null,
+               networks: [],
+               loadingTreat: false,
+               loadingCancel: false,
+               triggerTreatmentClick: false,
+               triggerCancelClick: false,
+               color: colorback,
+               montant: null,
+               isBtnModifyAmountEnabled: false
+          }
+          readUser().then(async (user) => {
+               let networks = []
+               networks = await getAgentNetworksList(user.agentId);
+               this.setState({ user: user, networks: networks.networks })
+
+          });
+
+          this.currentLocale = DeviceInfo.getDeviceLocale().includes("fr") ? "fr" : "en-gb";
+          moment.locale(this.currentLocale);
+
+     }
+
+     isNormalInteger = (str) => {
+          return (/[ `!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?~]/.test(str)) ? false : true;
+
+     }
+
+     isMontantValid = () => {
+          const { montant } = this.state;
+          if ((parseInt(montant) == 0 || montant < 0))
+               return false;
+
+          else if (!this.isNormalInteger(montant))
+               return false;
+
+          else if (parseInt(montant) > parseInt(this.item.montant))
+               return false;
+
+          else
+               return true;
+     }
+
+     displayToast = (message) => {
+          Toast.show(message, {
+               duration: Toast.durations.SHORT,
+               position: Toast.positions.BOTTOM,
+               backgroundColor: Color.primaryColor,
+               shadow: true,
+               animation: true,
+               hideOnPress: true,
+               delay: 0,
+               onShow: () => {
+                    // calls on toast\`s appear animation start
+               },
+               onShown: () => {
+                    // calls on toast\`s appear animation end.
+               },
+               onHide: () => {
+                    // calls on toast\`s hide animation start.
+               },
+               onHidden: () => {
+                    // calls on toast\`s hide animation end.
+               }
+          });
+     }
+
+     onTreatDemand() {
+          if (this.item !== "1") {
+               this.props.creditDemandResetReducer();
+               this.props.treatCreditDemand(this.item.id);
+               /* 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);
+                    }
+               }) */
+          }
+     }
+
+     onCancelDemand = () => {
+          if (this.item !== "1") {
+               this.props.treatCancelDemand(this.item.id);
+          }
+     }
+
+     renderPromptModifyAmountToSend = () => {
+          return (
+               <Dialog.Container useNativeDriver={true} visible={this.state.displayAmountModifyDialog}>
+
+                    <Dialog.Title>{I18n.t('MODIFY_AMOUNT')}</Dialog.Title>
+
+                    <Dialog.Description style={[FontWeight.bold]}>
+                         {I18n.t('ENTER_NEW_AMOUNT_TO_SEND')}
+                    </Dialog.Description>
+
+                    <Dialog.Input style={styles.inputAmountText}
+                         value={this.state.montant}
+                         keyboardType="numeric"
+                         onChangeText={(montant) => {
+
+                              this.setState({ montant }, () => {
+                                   if (this.isMontantValid(montant)) {
+                                        this.setState({
+                                             isBtnModifyAmountEnabled: true
+                                        })
+                                   }
+                                   else
+                                        this.setState({
+                                             isBtnModifyAmountEnabled: false
+                                        });
+
+                                   console.log("this.isMontantValid().isValid", this.isMontantValid());
+                                   console.log("isBtnModifyAmountEnabled", this.state.isBtnModifyAmountEnabled);
+                              });
+
+                         }} />
+
+                    <Dialog.Button bold={true} label={I18n.t('CANCEL_LABEL')} onPress={() => this.setState({ displayAmountModifyDialog: false })} />
+                    <Dialog.Button bold={true} label={I18n.t('SEND')} disable={this.state.isBtnModifyAmountEnabled} onPress={() => {
+                         this.props.creditDemandResetReducer();
+                         this.props.treatCreditDemand(this.item.id, this.state.montant);
+                    }} />
+               </Dialog.Container>
+          )
+     }
+
+     renderAlertErrorTreatOrCancelDemand = () => {
+          const { errorTreatDemand, resultTreatDemand, resultCancelDemand, errorCancelDemand } = this.props;
+
+          if (errorTreatDemand !== null) {
+               if (typeof errorTreatDemand.data !== 'undefined') {
+                    if (errorTreatDemand.status === 426) {
+                         Alert.alert(
+                              I18n.t("ERROR_TREATMENT_DEMAND"),
+                              errorTreatDemand.data.error,
+                              [{
+                                   text: I18n.t('CANCEL_LABEL'),
+                                   onPress: () => { },
+                                   style: 'cancel'
+                              },
+                              {
+                                   text: I18n.t("OK"), onPress: () => {
+                                        setTimeout(() => {
+                                             this.setState({
+                                                  displayAmountModifyDialog: true
+                                             });
+                                        }, 10);
+                                        this.props.creditDemandResetReducer();
+                                        this.props.creditCancelResetReducer();
+                                   }
+                              }],
+                              { cancelable: false }
+                         );
+                    }
+                    else {
+                         Alert.alert(
+                              I18n.t("ERROR_TREATMENT_DEMAND"),
+                              errorTreatDemand.data.error,
+                              [
+                                   {
+                                        text: I18n.t("OK"), onPress: () => {
+                                             this.props.creditDemandResetReducer();
+                                             this.props.creditCancelResetReducer();
+                                        }
+                                   }
+                              ],
+                              { cancelable: false }
+                         );
+                    }
+               }
+          }
+
+          if (errorCancelDemand !== null) {
+               if (typeof errorCancelDemand.data !== 'undefined') {
+                    Alert.alert(
+                         I18n.t("ERROR_TREATMENT_DEMAND"),
+                         errorCancelDemand.data.error,
+                         [
+                              {
+                                   text: I18n.t("OK"), onPress: () => {
+                                        this.props.creditCancelResetReducer();
+                                        this.props.creditDemandResetReducer();
+                                   }
+                              }
+                         ],
+                         { cancelable: false }
+                    )
+               }
+          }
+
+          if (resultTreatDemand !== null) {
+               console.log("resultTreatDemand", resultTreatDemand);
+               if (resultTreatDemand.status === 200) {
+                    this.displayToast(resultTreatDemand.response);
+                    this.props.navigation.goBack();
+                    this.props.navigation.state.params.onGoBack();
+                    this.props.creditCancelResetReducer();
+                    this.props.creditDemandResetReducer();
+               }
+          }
+
+          if (resultCancelDemand !== null) {
+               console.log("resultCancelDemand", resultCancelDemand);
+               if (resultCancelDemand.status === 200) {
+
+                    this.displayToast(resultCancelDemand.response);
+                    this.props.navigation.goBack();
+                    this.props.navigation.state.params.onGoBack();
+                    this.props.creditCancelResetReducer();
+                    this.props.creditDemandResetReducer();
+
+               }
+          }
+
+     }
+
+     renderBtn() {
+          const { user } = this.state
+          console.warn("ITEM ITEM", this.item);
+          if (user) {
+               if (this.item.code_parrain === user.code_membre) {
+                    if (this.item.status === '1') {
+                         return (<Button
+                              style={{
+                                   borderColor: 'transparent',
+                                   borderRadius: 6,
+                                   marginLeft: 5,
+                                   marginRight: 5,
+                                   backgroundColor: this.state.color
+                              }}
+                              isLoading={this.props.loadingTreatDemand}
+                              onPress={() => {
+                              }}
+                              disabled={true}
+                              textStyle={styles.textbtnstyle}
+                         >
+                              {this.state.statut}
+                         </Button>
+                         )
+                    }
+                    else if (this.item.status === '2') {
+                         return (<Button
+                              style={{
+                                   borderColor: 'transparent',
+                                   borderRadius: 6,
+                                   marginLeft: 5,
+                                   marginRight: 5,
+                                   backgroundColor: this.state.color
+                              }}
+                              onPress={() => {
+                              }}
+                              disabled={true}
+                              textStyle={styles.textbtnstyle}
+                         >
+                              {this.state.statut}
+                         </Button>
+                         )
+                    }
+
+                    else {
+                         return (<View style={{
+                              flexDirection: 'row',
+                              paddingTop: 10
+                         }}>
+
+                              <View style={{
+                                   flex: 1,
+                                   alignItems: 'center'
+                              }}>
+                                   <Button
+                                        style={{
+                                             borderColor: 'transparent',
+                                             borderRadius: 6,
+                                             marginLeft: 5,
+                                             marginRight: 5,
+                                             backgroundColor: this.state.color
+                                        }}
+                                        isLoading={this.props.loadingTreatDemand}
+                                        onPress={() => {
+                                             this.setState({
+                                                  triggerTreatmentClick: true
+                                             });
+                                             this.onTreatDemand()
+                                        }}
+                                        textStyle={styles.textbtnstyle}
+                                   >
+                                        {this.state.statut}
+                                   </Button>
+                              </View>
+
+                              <View style={{
+                                   flex: 1,
+                                   alignItems: 'center'
+                              }}>
+                                   <Button
+                                        style={{
+                                             borderColor: 'transparent',
+                                             borderRadius: 6,
+                                             marginLeft: 5,
+                                             marginRight: 5,
+                                             backgroundColor: Color.redColor
+                                        }}
+                                        isLoading={this.props.loadingCancelDemand}
+                                        onPress={() => {
+                                             this.setState({
+                                                  triggerCancelClick: true
+                                             });
+                                             this.onCancelDemand();
+                                        }}
+                                        textStyle={styles.textbtnstyle}
+                                   >
+                                        {I18n.t('REFUSER_DEMANDE')}
+                                   </Button>
+                              </View>
+                         </View>)
+                    }
+               }
+          }
+     }
+
+     render() {
+          console.log("CREDIT MANAGE PROPS", this.props);
+          let ago = moment.tz(this.item.date_creation, 'Etc/GMT+0').format();
+          ago = moment(ago)
+          return (
+               <View style={styles.container}>
+                    {this.renderPromptModifyAmountToSend()}
+                    {(this.state.triggerTreatmentClick || this.state.triggerCancelClick) && this.renderAlertErrorTreatOrCancelDemand()}
+                    <CardView
+                         style={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={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={styles.simpleuser}>{this.item.code_membre}</Text>
+                         </View>
+                    </CardView>
+                    <CardView
+                         style={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={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={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={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={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>)
+     }
+
+
+}
+
+const mapStateToProps = state => ({
+     loadingTreatDemand: state.creditTreatDemandReducer.loadingTreatDemand,
+     resultTreatDemand: state.creditTreatDemandReducer.resultTreatDemand,
+     errorTreatDemand: state.creditTreatDemandReducer.errorTreatDemand,
+
+     loadingCancelDemand: state.creditCancelDemandReducer.loadingCancelDemand,
+     resultCancelDemand: state.creditCancelDemandReducer.resultCancelDemand,
+     errorCancelDemand: state.creditCancelDemandReducer.errorCancelDemand
+});
+
+const mapDispatchToProps = dispatch => bindActionCreators({
+     treatCreditDemand: treatCreditDemand,
+     creditDemandResetReducer: creditDemandResetReducer,
+
+     treatCancelDemand: treatCancelDemand,
+     creditCancelResetReducer: creditCancelResetReducer
+}, dispatch);
+
+export default connect(mapStateToProps, mapDispatchToProps)(DemandGroupNanoCreditDetail);
+
+const styles = StyleSheet.create({
+     container: {
+          flex: 1,
+     },
+     btnstyle: {
+
+     },
+
+     inputAmountText: {
+          ...Platform.select({
+               android: {
+                    borderBottomColor: Color.borderColor,
+                    borderBottomWidth: 0.5,
+               }
+          })
+     },
+     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,
+     }
+})

screens/optionMenu/OptionsMenu.js

@@ -258,7 +258,7 @@ export default class OptionsMenu extends Component {
                || item === 'envoieWalletToCashUser' || item === 'linkCard' || item === 'envoieWalletToCardUser' || item === 'envoieWalletToBankUser' || item === 'retraitWalletVersCashUser'
                || item === 'retraitCarteVersWalletUser' || item === 'retraitEnCashAgent' || item === 'retraitCarteVersCashAgent' || item === 'envoieCashVersWalletAgent'
                || item === 'envoieCashVersAutreWalletAgent' || item === 'retraitCarteVersCashUser' || item === 'envoiCashVersCashAgent' || item === 'envoieCashVersCashAgent'
-               || item === 'envoieCashVersCarteAgent' || item === 'modifyIdentificationUser' || item === 'createGroupNanoCredit' || item === 'groupNanoCredit') {
+               || item === 'envoieCashVersCarteAgent' || item === 'modifyIdentificationUser' || item === 'createGroupNanoCredit' || item === 'groupNanoCredit' || item === 'demandGroupNanoCreditDetail') {
                return null
           } else {
                const color = this.state.currentId === item.id ? theme.accent : "grey"

screens/wallet/WalletSelect.js

@@ -37,7 +37,6 @@ class WalletSelect extends Component {
           activeColor: '#f0edf6',
           inactiveColor: '#3e2465',
           barStyle: { backgroundColor: '#694fad' },
-
           drawerLabel: I18n.t('CREDIT_MANAGE'),
           drawerIcon: ({ tintColor }) => (
                <Icon

utils/UtilsFunction.js

@@ -404,7 +404,8 @@ export const optionNanoCreditScreen = {
                screen: route.createGroupNanoCredit,
                icon: 'account-multiple',
                title: I18n.t('MANAGE_GROUP'),
-               hasSubMenu: true,
+               screen: route.groupNanoCredit
+/*                hasSubMenu: true,
                subMenuOption: [
                     {
                          title: I18n.t('DELETE'),
@@ -422,7 +423,7 @@ export const optionNanoCreditScreen = {
                          title: I18n.t('VALIDATE'),
                          screen: route.groupNanoCredit
                     },
-               ],
+               ], */
           },
           /*           {
                          screen: "",

utils/i18n/en.json

@@ -138,6 +138,7 @@
   "NUMERO_ABONNE": "Subscriber number",
   "IDENTIFIANT_ETUDIANT": "Student ID",
   "DEMAND_SEND": "Demand send",
+  "NO_DEMAND_CREATION_GROUP": "No group creation request",
   "WITHDRAWAL_DESCRIPTION": "Make a withdrawal",
   "COMMISSION_ACCOUNT_TITLE": "Commission account",
   "COMMISSION_TRANSFER_SUCCESS": "Commissions have been transferred to the main account",
@@ -167,6 +168,7 @@
   "ACTIVATED": "has been activated",
   "CREDIT_MANAGE": "Credit Management",
   "GROUP_MANAGE": "Group Management",
+  "CREATOR": "Creator",
   "NOTIFICATIONS": "Notification",
   "NO_NOTIFICATION": "You haven't any notification",
   "CONFIGURATIONS": "Configuration",

utils/i18n/fr.json

@@ -160,6 +160,7 @@
   "DEPOSIT_TRANSACTION_HISTORY_DESCRIPTION": "Dépôt de",
   "NO_WALLET_HISTORY": "Aucune transaction à ce jour",
   "DEMAND_SEND": "Demande envoyé",
+  "NO_DEMAND_CREATION_GROUP": "Aucune demande de création de groupe",
   "NO_WALLET_ACTIVED": "Aucun wallet n'est activé pour votre compte",
   "TRANSFER_TO_PRINCIPAL_ACCOUNT": "Transférer commissions",
   "PRINCIPAL": "Principal",
@@ -171,6 +172,7 @@
   "ACTIVATED": "a été activé",
   "CREDIT_MANAGE": "Gestion de credit",
   "GROUP_MANAGE": "Gestion du groupe",
+  "CREATOR": "Créateur",
   "NOTIFICATIONS": "Notification",
   "NO_NOTIFICATION": "Vous n'avez aucune Fnotification",
   "CONFIGURATIONS": "Configuration",
@@ -331,6 +333,9 @@
   "SEND": "Envoyer !",
   "CHANGE_INFORMATION": "Modifier mes informations",
   "VALIDATE": "Valider",
+  "NO_VALIDATE": "Non validé",
+  "VALIDATION": "validation",
+  "VALIDATIONS": "validations",
   "SELECT_YOUR_WALLET": "Selectionner un wallet",
   "CONNECT": "Connexion",
   "TEXT_BIG_CREATE_1": "Inscrivez vous en tant qu'Utilisateur",

webservice/IlinkConstants.js

@@ -49,6 +49,7 @@ export const otherPayCountryNetworkUrl = testBaseUrl + '/walletService/other_pay
 export const envoieUserWalletToWallet = testBaseUrl + '/walletService/transactions/ilink';
 export const envoieCommissionUrl = testBaseUrl + '/walletService/transactions/ilink/commission';
 export const idVerificationUrl = testBaseUrl + '/walletService/transactions/ilink/check_retraits';
+export const getCreditDemand = testBaseUrl + '/walletService/groups/demands';
 
 export const linkCardUrl = testBaseUrl + '/walletService/identifications/rattach_card';
 export const groupUrl = testBaseUrl + '/walletService/groups';

webservice/user/NanoCreditApi.js

@@ -0,0 +1,44 @@
+
+import axios from "axios";
+import I18n from 'react-native-i18n';
+import { store } from "../../redux/store";
+import { idVerificationUrl, getCreditDemand } from "../IlinkConstants";
+import { fetchRetraitCashAgentIdVerificationPending, fetchRetraitCashAgentIdVerificationSuccess, fetchRetraitCashAgentIdVerificationError, fetchRetraitCashAgentIdVerificationReset } from "../../redux/actions/EnvoieAgentAction";
+import { fetchGetDemandsGroupSuccess, fetchGetDemandsGroupPending, fetchGetDemandsGroupError, fetchGetDemandsGroupReset } from "../../redux/actions/NanoCreditAction";
+
+export const getNanoCreditDemandsAction = (id) => {
+
+     const auth = store.getState().authKeyReducer;
+     const authKey = auth !== null ? `${auth.authKey.token_type} ${auth.authKey.access_token}` : '';
+
+     return dispatch => {
+          dispatch(fetchGetDemandsGroupPending());
+
+          axios({
+               url: `${getCreditDemand}/all/${id}`,
+               method: 'GET',
+               headers: {
+                    'Authorization': authKey,
+                    'X-Localization': I18n.currentLocale()
+               }
+          })
+               .then(response => {
+                    console.log(response);
+                    dispatch(fetchGetDemandsGroupSuccess(response));
+               })
+               .catch(error => {
+                    if (error.response)
+                         dispatch(fetchGetDemandsGroupError(error.response));
+                    else if (error.request)
+                         dispatch(fetchGetDemandsGroupError(error.request))
+                    else
+                         dispatch(fetchGetDemandsGroupError(error.message))
+               });
+     }
+}
+
+export const getNanoCreditDemandsReset = () => {
+     return dispatch => {
+          dispatch(fetchGetDemandsGroupReset());
+     }
+}