didam

app/container/history/history.js

@@ -7,6 +7,9 @@ import Svg, { Circle, Rect } from 'react-native-svg'
 import Colors from '../../library/colors';
 import MaterialIcons from 'react-native-vector-icons/MaterialIcons'
 import fonts from '../../library/fonts';
+import api from '../../service/api';
+import reactotron from 'reactotron-react-native';
+import moment from 'moment';
 
 const dateNow = M().format('DD-MM-YYYY')
 
@@ -68,6 +71,7 @@ class History extends Component {
       OrientationStatus : '',
       Height_Layout : '',
       Width_Layout : '',
+      dataHistory: []
     }
   }
 
@@ -78,6 +82,17 @@ class History extends Component {
     setTimeout(() => {
       this.setState({ dataLoad: true, loading: false })
     }, 2000);
+    this.getHistory()
+  }
+
+
+  getHistory() {
+    api.create().getHistory().then((response) => {
+      reactotron.log(response)
+      if (response.data.status == 'success') {
+        this.setState({dataHistory: response.data.data})
+      }
+    })
   }
 
   DetectOrientation() { 
@@ -94,6 +109,12 @@ class History extends Component {
 
   }
 
+  handleType(item) {
+    var name = String(item).includes('accept')? 'Penerimaan' :
+      String(item).includes('appraisal') ? 'Appraisal' : 'Penerimaan' 
+    return name
+  }
+
   render() {
     return (
       <Container
@@ -110,24 +131,25 @@ class History extends Component {
           </View>
         </View>
         <View style={{ backgroundColor: '#f5f5f5', zIndex: 3, height: '90%' }}>
-
-
+          {this.state.dataHistory.length == 0? 
+            <View style={{flex: 1, alignItems: 'center', justifyContent: 'center'}}>
+              <Text style={{fontStyle: 'italic'}}>No data found ...</Text>
+            </View>
+            :
             <ScrollView style={this.state.OrientationStatus == 'Landscape'? { flex: 1, marginBottom: 40 } : {flex: 1}} showsVerticalScrollIndicator={false}>
-            {this.state.dataDummyHistory.map((item, index) => {
+              {this.state.dataHistory.map((item, index) => {
                 return (
-                <View style={{width: '100%'}}>
+                  <View style={{width: '100%'}} key={index}>
                     <View style={{backgroundColor: '#e8e8e8', width: '100%', padding: 3, paddingLeft: 15}}>
-                    <Text style={{color: '#3b3b3b', fontSize: 12, fontFamily: fonts.type.fontBasic}}>{item.tanggal}</Text>
+                      <Text style={{color: '#3b3b3b', fontSize: 12, fontFamily: fonts.type.fontBasic}}>{String(moment(item.date).format('DD MMM YYYY')).toUpperCase()}</Text>
                     </View>
                     {item.data.map((items, indexs) => {
                       return (
-                      <View style={{width: '100%', padding: 10, marginLeft: 5, borderBottomWidth: indexs == item.data.length -1? 0 : 1 , borderBottomColor: '#dbdbdb' }}>
-                        <Text style={{fontSize: 14, fontWeight: '700', fontFamily: fonts.type.fontBasic}}>{items.type}</Text>
+                        items.type != 'login' && <View key={indexs} style={{width: '100%', padding: 10, marginLeft: 5, borderBottomWidth: indexs == item.data.length -1? 0 : 1 , borderBottomColor: '#dbdbdb' }}>
+                          <Text style={{fontSize: 14, fontWeight: '700', fontFamily: fonts.type.fontBasic}}>{this.handleType(items.type)}</Text>
                           <View style={{flexDirection: 'row', width: '100%', marginTop: 5}}>
                             <Text style={{fontSize: 12, width: '75%', color: '#3b3b3b', fontFamily: fonts.type.fontBasic}} ellipsizeMode={'tail'} numberOfLines={1}>{items.message}</Text>
-                          <Text style={{fontSize: 12, width: '25%', color: '#e4b300', fontFamily: fonts.type.fontBasic}} ellipsizeMode={'tail'} numberOfLines={1}>{items.unitName}</Text>
-                          {/* <Text style={{fontStyle: 12, width: '70%'}}>{items.unitName}</Text>
-                          <Text style={{fontStyle: 12, width: '30%', marginLeft: 10}}>{items.message}</Text> */}
+                            <Text style={{fontSize: 12, width: '25%', color: '#e4b300', fontFamily: fonts.type.fontBasic, textAlign:'right', paddingRight: 10}} ellipsizeMode={'tail'} numberOfLines={1}>{items.unit + ' - ' + items.police_number}</Text>
                           </View> 
                         </View>
                       )
@@ -161,8 +183,8 @@ class History extends Component {
                   </View>
                 )
               })}
-
             </ScrollView>
+          }
         </View>
       </Container >
     );

app/container/home/homepageScreen.js

@@ -180,7 +180,7 @@ class HomePageScreen extends Component {
                   {this.state.arrayWarehouse.map((item, index) => {
                     // var indexId = this.state.arrayWarehouse.findIndex((val) => val.label == item.label)
                     return (
-                      this.state.warhouseName != item.label && <MenuOption style={{marginTop: index == 0? 0 : 5, borderBottomColor: '#dbdbdb', borderBottomWidth: .5}} onSelect={() => {this.setState({ selectedWarehouse: item, warhouseName: item.label })}}>
+                      this.state.warhouseName != item.label && <MenuOption key={index} style={{marginTop: index == 0? 0 : 5, borderBottomColor: '#dbdbdb', borderBottomWidth: .5}} onSelect={() => {this.setState({ selectedWarehouse: item, warhouseName: item.label })}}>
                         <Text style={{textAlign:'center'}}>{item.label}</Text>
                       </MenuOption>
                     )
@@ -200,7 +200,7 @@ class HomePageScreen extends Component {
             {this.state.data.map((item,index) => {
               var itemVis = item == 'Penerimaan'? this.state.visAccepted : item == 'Appraisal'? this.state.visAppraisal : this.state.visApproved
               return (
-                itemVis && <TouchableOpacity onPress={() => this.handleNav(item)} activeOpacity={.5}>
+                itemVis && <TouchableOpacity onPress={() => this.handleNav(item)} key={index} activeOpacity={.5}>
                   <Image source={item == 'Penerimaan'? Images.IconPenerimaan : item == 'Appraisal'? Images.IconAppraisal : Images.IconApproval} style={{width: 125, height: 125, marginLeft: 0}}/>
                 </TouchableOpacity>
               )
@@ -234,7 +234,7 @@ class HomePageScreen extends Component {
                       }}>
                       {this.state.dataNews.map((item, index) => {
                           return (
-                              <View style={styles.view2, {padding: 10, backgroundColor:'transparent', elevation: 5, marginLeft: index == 0? 15 : 0, marginRight: index == this.state.dataNews.length - 1? 15 : 0}}>
+                              <View key={index} style={styles.view2, {padding: 10, backgroundColor:'transparent', elevation: 5, marginLeft: index == 0? 15 : 0, marginRight: index == this.state.dataNews.length - 1? 15 : 0}}>
                                 <View style={{width:'100%', backgroundColor:'rgba(228, 179, 0, .8)', borderTopLeftRadius: 10, borderTopRightRadius: 10}}>
                                   <Text style={{marginVertical: 5, marginLeft: 20, fontWeight: 'bold'}}> {item.name} </Text>
                                 </View>

app/container/profile/profile.js

@@ -65,8 +65,8 @@ class Profile extends Component {
         /> */}
         <LinearGradient style={{ height: '25%', width: '110%', borderBottomLeftRadius: 300, borderBottomRightRadius: 300, alignItems: 'center' }} colors={['#e4b300', '#e4b300']} angle={155} useAngle>
           <Text style={{ marginTop: 50, fontSize: 20, fontWeight: 'bold' }}>{this.state.username}</Text>
-          <View style={{ width: 130, height: 130, borderRadius: 400, backgroundColor: '#fff', marginTop: 35 }} >
-            <Image source={Images.UserIcons} style={{ width: '100%', height: '100%'}} />
+          <View style={{ marginTop: 35 }}>
+            <Image source={Images.copper} style={{ width: 120, height: 120, borderRadius: 120}}/>
           </View>
         </LinearGradient>
         <View style={{ marginTop: 100 }}>

app/loginNew.js

@@ -22,11 +22,13 @@ class LoginScreen extends Component {
             username: '',
             password: '',
             token: '',
+            errorMsg: '',
             visiblePw: false
         }
     }
 
     handleLogin(next) {
+        Keyboard.dismiss()
         api.create().login({
           username: this.state.username,
           password: this.state.password
@@ -48,6 +50,7 @@ class LoginScreen extends Component {
             this.navigateToLogin()
           } else {
             next();
+            this.setState({errorMsg: Response.data.message})
             // alert(Response.data.message)
           }
         })
@@ -71,9 +74,9 @@ class LoginScreen extends Component {
             AsyncStorage.setItem(Constant.TOKEN_EXPR, token_expr)
             AsyncStorage.setItem(Constant.USERNAME, username)
             AsyncStorage.setItem(Constant.USER_ID, String(id))
-            AsyncStorage.setItem(Constant.ROLE, role[0])
+            AsyncStorage.setItem(Constant.ROLE, String(role[0]))
             AsyncStorage.setItem(Constant.EMAIL, email)
-            AsyncStorage.setItem(Constant.FULLNAME, fullname)
+            AsyncStorage.setItem(Constant.FULLNAME, fullname == null? '' : fullname)
             AsyncStorage.setItem(Constant.COMPANY, String(company))
             AsyncStorage.setItem(Constant.LASTACTION, lastAction)
         } catch {
@@ -102,13 +105,13 @@ class LoginScreen extends Component {
                         placeholder={'Username'}
                         placeholderTextColor={'#fff'}
                         value={this.state.username} 
-                        onChangeText={(username) => this.setState({username})}
+                        onChangeText={(username) => this.setState({username, errorMsg: ''})}
                         blurOnSubmit
                         onSubmitEditing={() => this.password.focus()}
                         style={{marginLeft: 10, width: '80%', color: '#fff'}}
                     />
                 </View>
-                <View style={{marginTop: 20, marginBottom: 50, borderRadius: 25, paddingHorizontal: 20, alignItems:'center', flexDirection:'row', width: '100%', backgroundColor:'rgba(237, 237, 237, .5)', }}>
+                <View style={{marginTop: 20, borderRadius: 25, paddingHorizontal: 20, alignItems:'center', flexDirection:'row', width: '100%', backgroundColor:'rgba(237, 237, 237, .5)', }}>
                     <Fontisto name={'locked'} color={'white'} size={18} />
                     <TextInput
                         ref={(ref) => { this.password = ref; }}
@@ -116,14 +119,17 @@ class LoginScreen extends Component {
                         placeholderTextColor={'#fff'}
                         secureTextEntry={!this.state.visiblePw}
                         value={this.state.password}
-                        onChangeText={(password) => this.setState({password})} 
+                        onChangeText={(password) => this.setState({password, errorMsg: ''})} 
                         style={{marginLeft: 10, width: '80%', color: 'white'}}
                     />
                     <FontAwesome5Icon name={this.state.visiblePw? 'eye' : 'eye-slash' } onPress={() => this.setState({visiblePw: !this.state.visiblePw})} color={'white'} size={20} style={{marginLeft: 5}}/>
                     {/* < */}
                 </View>
 
-                <View style={{width: '100%', borderRadius: 100, alignSelf:'center'}}>
+                {this.state.errorMsg != '' && <Text style={{alignSelf: 'center', color: 'red', marginTop: 5}}>
+                    {this.state.errorMsg}
+                </Text>}
+                <View style={{width: '100%', borderRadius: 100, alignSelf:'center', marginTop: 50, }}>
                     <AwesomeButton
                     width={'100%'} raiseLevel={3} springRelease={true} type="primary"
                     progress
@@ -138,7 +144,6 @@ class LoginScreen extends Component {
                     style={{alignSelf:'center'}}
                     onPress={next => {
                         /** Do Something **/
-                        Keyboard.dismiss
                         this.handleLogin(next)
                     }}
                     >

app/navigation/appNavigation.js

@@ -2,7 +2,7 @@ import React from 'react'
 
 //Library
 import { createAppContainer } from 'react-navigation';
-import { createStackNavigator } from 'react-navigation-stack';
+import { createStackNavigator, TransitionPresets } from 'react-navigation-stack';
 import { fromLeft, fromTop, flipY, fadeOut, fromRight, fromBottom } from 'react-navigation-transitions';
 import { headerStyle, headerTitleStyle, headerBgStyle, headerRightStyle } from './navStyle'
 
@@ -34,11 +34,11 @@ import HomeTabNavigation from './homeTabNavigation';
 import Images from '../library/images';
 
 const MainNavigator = createStackNavigator({
-  Login: { screen: Login, navigationOptions: { header: null } },
-  LoginNew: { screen: LoginNew, navigationOptions: { header: null } },
-  Splash: { screen: SplashScreen, navigationOptions: { header: null } },
-  HomeNavigation: { screen: HomeTabNavigation, navigationOptions: { header: null } },
-  HomepageScreen: { screen: HomepageScreen, navigationOptions: { header: null } },
+  Login: { screen: Login, navigationOptions: { headerShown: false } },
+  LoginNew: { screen: LoginNew, navigationOptions: { headerShown: false } },
+  Splash: { screen: SplashScreen, navigationOptions: { headerShown: false } },
+  HomeNavigation: { screen: HomeTabNavigation, navigationOptions: { headerShown: false } },
+  HomepageScreen: { screen: HomepageScreen, navigationOptions: { headerShown: false } },
   Appraisal: { screen: Appraisal, navigationOptions: { title: 'Appraisal' } },
   MenuAppraisal: { screen: MenuAppraisal, navigationOptions: { title: 'Menu Appraisal' } },
   MenuAppraisal2: { screen: MenuAppraisal2, navigationOptions: { title: 'Menu Appraisal' } },
@@ -52,15 +52,20 @@ const MainNavigator = createStackNavigator({
 }, {
   headerMode: 'screen',
   initialRouteName: 'Splash',
-  transitionConfig: () => fromLeft(500),
+  // defaultNavigationOptions: {
+  //     
+  //   },
+  // transitionConfig: () => fromLeft(500),
   defaultNavigationOptions: {
     headerStyle,
+    // transitionSpec: () => fromLeft(500),
+    ...TransitionPresets.ModalTransition,
     headerTitleStyle,
-    headerBackground: (<Image source={Images.background3} style={headerBgStyle}/>),
+    headerBackground: () => (<Image source={Images.background3} style={headerBgStyle}/>),
     // <LinearGradient colors={[Colors.yellowStatusBar, Colors.yellowBasic]} start={{ x: 0, y: .3 }} end={{ x: 0, y: .9 }} style={headerBgStyle} />
     
     headerTintColor: 'white',
-    headerBackImage: (
+    headerBackImage: () => (
       // <Image source={Images.buttonBack} style={{width: 30, height: 20}}/>
       <TouchableOpacity style={{ paddingLeft: 10 }} activeOpacity={.9}>
         <Ionicons name='ios-arrow-back' size={30} color={'#fff'} />

app/service/api.js

@@ -49,6 +49,7 @@ const create = () => {
     const getUserWarehouse = () => GET('demo/get_user_warehouse') 
     const getListAppraisal = (value) => POST('demo/get_list_appraisal', value)
     const getListApproval = (value) => POST('demo/get_list_approval', value)
+    const getHistory = () => GET('demo/get_history')
 
     
     return {
@@ -58,7 +59,8 @@ const create = () => {
         getPermission,
         getUserWarehouse,
         getListAppraisal,
-        getListApproval
+        getListApproval,
+        getHistory
     }
 }