Merge branch 'deni(lptp)' into 'master'

Deni(lptp)

See merge request !34

App/Containers/DealsOfTheDayScreen.js

@@ -11,6 +11,7 @@ import CountDown from 'react-native-countdown-component';
 import BaseHeader from '../Components/BaseHeader'
 import { Images } from '../Themes'
 import BaseText from '../Components/BaseText';
+import Api from '../Services/Api';
 
 class DealsOfTheDayScreen extends Component {
   constructor(props) {
@@ -25,6 +26,9 @@ class DealsOfTheDayScreen extends Component {
         { nama: 'Compass x Pot Meets Pop', harga: 'Rp. 3.700.000', color: 'rgba(158, 212, 185, 0.44)', diskon: 'Rp. 2.000.000', jual: 28 },
       ],
       progressStatus: 20,
+      data: [],
+      count: 500,
+      countdown: false
     }
     this.anim = new Animated.Value(0);
   }
@@ -37,6 +41,7 @@ class DealsOfTheDayScreen extends Component {
   componentDidMount() {
     this.onAnimate();
     BackHandler.addEventListener("hardwareBackPress", this.backAction);
+    this.getDOTD()
   }
 
   componentWillUnmount() {
@@ -51,42 +56,66 @@ class DealsOfTheDayScreen extends Component {
       duration: 30000,
     }).start();
   }
+
+  getDOTD() {
+    Api.create().getDealOfTheDay().then(response => {
+      if (response.data.status == "success") {
+        this.setState({ data: response.data.data, count: response.data.data[0].remaining, countdown: true })
+      } else {
+        this.setState({ data: [], count: 0 })
+      }
+      console.log(JSON.stringify(response.data))
+    })
+  }
+
+  number(num) {
+    var rupiah = '';
+    var angkarev = num.toString().split('').reverse().join('');
+    for (var i = 0; i < angkarev.length; i++) if (i % 3 == 0) rupiah += angkarev.substr(i, 3) + '.';
+    return 'Rp. ' + rupiah.split('', rupiah.length - 1).reverse().join('');
+  }
+
   render() {
     return (
       <View style={{ flex: 1, backgroundColor: '#4cc9f0' }}>
         <BaseHeader leftText={'Deals Of The Day'} onBackPress={() => this.props.navigation.goBack()} />
         <View style={{ flex: 1, backgroundColor: '#fff', borderTopLeftRadius: 30, borderTopRightRadius: 30, width: '100%', paddingTop: 20 }}>
           <ScrollView>
-            <View style={{ width: '90%', elevation: 5, alignSelf: 'center', backgroundColor: 'white', flexDirection: 'row', justifyContent: 'space-between', paddingLeft: 20, borderRadius: 10 }}>
-              <Image source={Images.flash} style={{ width: 58, height: 30, marginVertical: 5 }} />
-              <View style={{ width: 130, backgroundColor: '#4cc9f0', borderRadius: 10, justifyContent: 'center' }}>
-                <CountDown
-                  size={13}
-                  until={1000}
-                  onFinish={() => alert('Finished')}
-                  digitStyle={{ backgroundColor: '#FFF', borderWidth: 2, borderColor: '#4cc9f0' }}
-                  digitTxtStyle={{ color: 'black' }}
-                  timeLabelStyle={{ color: 'red', fontWeight: 'bold' }}
-                  separatorStyle={{ color: '#fff' }}
-                  timeToShow={['H', 'M', 'S']}
-                  timeLabels={{ m: null, s: null }}
-                  showSeparator
-                />
+            {this.state.countdown && (
+              <View style={{ width: '90%', elevation: 5, alignSelf: 'center', backgroundColor: 'white', flexDirection: 'row', justifyContent: 'space-between', paddingLeft: 20, borderRadius: 10 }}>
+                <Image source={Images.flash} style={{ width: 58, height: 30, marginVertical: 5 }} />
+                <View style={{ width: 130, backgroundColor: '#4cc9f0', borderRadius: 10, justifyContent: 'center' }}>
+
+                  <CountDown
+                    size={13}
+                    until={this.state.count}
+                    onFinish={() => alert('Flash Sale Telah Berakhir')}
+                    digitStyle={{ backgroundColor: '#FFF', borderWidth: 2, borderColor: '#4cc9f0' }}
+                    digitTxtStyle={{ color: 'black' }}
+                    timeLabelStyle={{ color: 'red', fontWeight: 'bold' }}
+                    separatorStyle={{ color: '#fff' }}
+                    timeToShow={['H', 'M', 'S']}
+                    timeLabels={{ m: null, s: null }}
+                    showSeparator
+                  />
+                </View>
               </View>
-            </View>
+            )}
             <View style={{ marginTop: 30, paddingHorizontal: 20 }}>
               <FlatList
                 scrollEnabled={false}
                 showsVerticalScrollIndicator={false}
-                data={this.state.dummyList}
+                data={this.state.data}
                 renderItem={({ item, index }) => (
-                  <View style={{ flex: 1, flexDirection: 'row', marginTop: index == 0 ? 0 : 10, borderRadius: 15, elevation: 5, backgroundColor: 'white', marginHorizontal: 10, marginBottom: index == this.state.dummyList.length - 1 ? 15 : 0 }}>
-                    <View style={{ width: '36%', backgroundColor: item.color, borderTopLeftRadius: 15, borderBottomLeftRadius: 15 }} />
+                  <View style={{ flex: 1, flexDirection: 'row', marginTop: index == 0 ? 0 : 0, borderRadius: 15, elevation: 5, backgroundColor: 'white', marginHorizontal: 10, marginBottom: 15 }}>
+                    <View style={{ width: '36%', backgroundColor: item.color, borderTopLeftRadius: 15, borderBottomLeftRadius: 15 }}>
+                      <Image source={{ uri: item.product_image }} style={{ width: 110, height: 110, borderTopLeftRadius: 15, borderBottomLeftRadius: 15 }} />
+                    </View>
                     <View style={{ width: '45%', justifyContent: 'flex-start', paddingHorizontal: 10, backgroundColor: 'white', borderTopRightRadius: 15, borderBottomRightRadius: 15, paddingVertical: 5 }}>
-                      <BaseText type={"regular"} text={item.nama} style={{ fontSize: 10, color: 'black', textAlign: 'left', }} ellipsizeMode={"tail"} numberOfLines={1} />
-                      <BaseText type={"regular"} text={item.harga} style={{ fontSize: 10, color: '#d8d8d8', textAlign: 'left', textDecorationLine: 'line-through', marginTop: 10 }} />
-                      <BaseText type={"bold"} text={item.diskon} style={{ fontSize: 12, color: '#4cc9f0', textAlign: 'left', marginTop: 5 }} />
-                      <BaseText type={"bold"} text={`${item.jual} TERJUAL`} style={{ fontSize: 10, color: 'black', textAlign: 'left', marginTop: 5 }} />
+                      <BaseText type={"regular"} text={item.product_name} style={{ fontSize: 10, color: 'black', textAlign: 'left', }} ellipsizeMode={"tail"} numberOfLines={2} />
+                      <BaseText type={"regular"} text={this.number(item.price)} style={{ fontSize: 10, color: '#d8d8d8', textAlign: 'left', textDecorationLine: 'line-through', marginTop: 10 }} />
+                      <BaseText type={"bold"} text={this.number(item.deal_price)} style={{ fontSize: 12, color: '#4cc9f0', textAlign: 'left', marginTop: 5 }} />
+                      <BaseText type={"bold"} text={`20 TERJUAL`} style={{ fontSize: 10, color: 'black', textAlign: 'left', marginTop: 5 }} />
                       <Progress.Bar progress={this.state.progressStatus / 100} color={'#ffe500'} width={120} height={12} style={{ justifyContent: 'center', marginTop: 5, borderColor: '#fff', backgroundColor: '#eaeaea', borderRadius: 10 }}>
                         <Animated.Text style={{
                           fontSize: 10,

App/Containers/ProfileScreen.js

@@ -47,7 +47,8 @@ class ProfileScreen extends Component {
       this.setState({ auth: prevState.auth })
       let auth = this.state.auth
       if (auth !== null && !auth.fetching) {
-        console.log('tag', auth)
+        console.log('tag', auth.user.data)
+        this.setState({ data: auth.user.data})
       }
     }
   }

App/Containers/RincianProfilScreen.js

@@ -10,8 +10,8 @@ import { View } from 'react-native-animatable'
 import BaseHeader from '../Components/BaseHeader'
 import BaseText from '../Components/BaseText'
 import BaseInput from '../Components/BaseInput'
-import Api from '../Services/Api'
 import { handlePhone } from '../Lib/Utils'
+import R from 'ramda'
 
 class RincianProfilScreen extends Component {
   constructor(props) {
@@ -24,6 +24,9 @@ class RincianProfilScreen extends Component {
       email: "",
       phone: "",
       auth: this.props.auth,
+      errorName: "",
+      errorPhone: false,
+      textErrorPhone: ""
     }
   }
 
@@ -49,19 +52,26 @@ class RincianProfilScreen extends Component {
 
   validate(type) {
     if (type == 'name') {
-      if (this.props.auth != null) {
-        let data = this.props.auth.user.data
-        let name = this.state.lastName == "" ? this.state.firstName : this.state.firstName + ' ' + this.state.lastName
-        let body = {
-          "user_name": name,
-          "user_email": "",
-          "user_phone": "",
-          "user_image": ""
+      if (R.isEmpty(this.state.firstName)) {
+        this.setState({ errorName: 'Nama tidak boleh kosong' })
+      }
+      else if (this.state.firstName.length < 3) {
+        this.setState({ errorName: 'Nama Tidak Boleh Kurang Dari 3 Karakter' })
+      } else {
+        if (this.props.auth != null) {
+          let data = this.props.auth.user.data
+          let name = this.state.lastName == "" ? this.state.firstName : this.state.firstName + ' ' + this.state.lastName
+          let body = {
+            "user_name": name,
+            "user_email": "",
+            "user_phone": "",
+            "user_image": ""
+          }
+          this.props.authEditRequest(body)
+          // Api.create().editProfile(body).then((response) => {
+          //   console.log(response)
+          // })
         }
-        this.props.authEditRequest(body)
-        // Api.create().editProfile(body).then((response) => {
-        //   console.log(response)
-        // })
       }
     } else if (type == 'email') {
       if (this.props.auth != null) {
@@ -78,18 +88,21 @@ class RincianProfilScreen extends Component {
         // })
       }
     } else if (type == 'hp') {
-      if (this.props.auth != null) {
-        let data = this.props.auth.user.data
-        let body = {
-          "user_name": "",
-          "user_email": "",
-          "user_phone": "0" + this.state.phone,
-          "user_image": ""
+      if (R.isEmpty(this.state.phone)) {
+        this.setState({ textErrorPhone: 'Nomor Handphone Tidak Boleh Kosong', errorPhone: true })
+      } else if (this.state.phone.length < 9) {
+        this.setState({ textErrorPhone: 'Nomor Handphone Kurang Dari 10 Digit', errorPhone: true })
+      } else {
+        if (this.props.auth != null) {
+          let data = this.props.auth.user.data
+          let body = {
+            "user_name": "",
+            "user_email": "",
+            "user_phone": "0" + this.state.phone,
+            "user_image": ""
+          }
+          this.props.authEditRequest(body)
         }
-        this.props.authEditRequest(body)
-        // Api.create().editProfile(body).then((response) => {
-        //   console.log(response)
-        // })
       }
     }
   }
@@ -156,7 +169,7 @@ class RincianProfilScreen extends Component {
                 <BaseText type={"bold"} text={'Harap diisi sesuai dengan nomor handphone Anda yang aktif untuk mempermudah proses verifikasi'} style={{ fontSize: 12, color: '#4b4b4b', alignSelf: 'center', textAlign: 'center' }} />
                 <View style={{ marginTop: 30 }}>
                   <BaseText text={"No. Handphone"} type={"bold"} style={{ fontSize: 12, color: '#4b4b4b', opacity: .6 }} />
-                  <View style={{ flexDirection: 'row', flexGrow: 1, borderBottomColor: '#d8d8d8', borderBottomWidth: 1, alignItems: 'center', }}>
+                  <View style={{ flexDirection: 'row', flexGrow: 1, borderBottomColor: this.state.errorPhone ? 'red' : '#d8d8d8', borderBottomWidth: 1, alignItems: 'center', }}>
                     <View style={{ width: '15%', flexDirection: 'row' }}>
                       <BaseText text={"+62"} type={"bold"} style={{ fontSize: 14, color: '#4b4b4b', opacity: .8 }} />
                       <BaseText text={"|"} type={"light"} style={{ fontSize: 18, color: '#4b4b4b', opacity: .5, marginHorizontal: 10, marginTop: -3 }} />
@@ -170,7 +183,7 @@ class RincianProfilScreen extends Component {
                         // ref={(ref) => { this.phone = ref; }}
                         maxLength={13}
                         onChangeText={(phone) => {
-                          this.setState({ phone: handlePhone(phone) })
+                          this.setState({ phone: handlePhone(phone), errorPhone: false })
                         }}
                         // onSubmitEditing={() => {
                         //   this.focusNextField('password');
@@ -179,6 +192,11 @@ class RincianProfilScreen extends Component {
                       />
                     </View>
                   </View>
+                  {this.state.errorPhone && (
+                    <View>
+                      <BaseText type={"bold"} text={this.state.textErrorPhone} style={{ fontSize: 12, marginTop: 10, color: 'red', opacity: .5 }} />
+                    </View>
+                  )}
                   <View style={{ flexDirection: 'row', justifyContent: 'space-around', marginTop: 30, width: '100%' }}>
                     <TouchableOpacity style={{ backgroundColor: '#fff', height: 45, borderRadius: 30, width: '45%', borderColor: '#4cc9f0', borderWidth: 1 }}>
                       <BaseText type={"regular"} text={'Tidak'} style={{ fontSize: 16, textAlign: 'center', marginTop: 10, color: '#4cc9f0' }} />
@@ -197,11 +215,11 @@ class RincianProfilScreen extends Component {
                     title={"Nama Depan"}
                     placeholder={"Nama Depan"}
                     value={this.state.firstName}
-                    onChangeText={(firstName) => this.setState({ firstName: firstName.replace(/[^a-zA-Z.', ]/g, "") })}
+                    onChangeText={(firstName) => this.setState({ firstName: firstName.replace(/[^a-zA-Z.', ]/g, ""), errorName: "" })}
                     blurOnSubmit={false}
-                  // lineColor={this.state.errorName ? 'red' : '#d8d8d8'}
-                  // notes={this.state.errorName ? 'Nama Tidak Boleh Kosong' : ''}
-                  // notesColor={this.state.errorName ? 'red' : '#4b4b4b'}
+                    lineColor={this.state.errorName ? 'red' : '#d8d8d8'}
+                    notes={this.state.errorName ? this.state.errorName : ''}
+                    notesColor={this.state.errorName ? 'red' : '#4b4b4b'}
                   />
                 </View>
                 <View style={{ marginTop: 20 }}>

App/Services/Api.js

@@ -70,7 +70,7 @@ const create = (baseURL = 'https://apiecart.eksad.com/mobile/') => {
   const verifikasiOtpEmail = (otp) => api.post('verify_otp_signup_email', otp)
   const editProfile = (body) => api.post('edit_profile', body)
   const editPhotoProfile = (body) => api.post('edit_photo', body)
-  const getAddress = () => api.get('get_address')
+  const getDealOfTheDay = () => api.get('get_deal_of_the_day')
 
   // Wishlist
   const getWhislist = (body) => api.post('get_wishlist', body)
@@ -79,6 +79,7 @@ const create = (baseURL = 'https://apiecart.eksad.com/mobile/') => {
   const deleteWishlist = (wishlistId) => api.post(`delete_wishlist/${wishlistId}`)
 
   // Address
+  const getAddress = () => api.get('get_address')
   const getProvinsi = () => api.get('get_province')
   const getKota = (body) => api.get('get_kab_kot/' + body)
   const getKecamatan = (body) => api.get('get_kecamatan/' + body)
@@ -158,7 +159,8 @@ const create = (baseURL = 'https://apiecart.eksad.com/mobile/') => {
     getProductDetail,
     getPriceRange,
     addWishlist,
-    deleteWishlist
+    deleteWishlist,
+    getDealOfTheDay
   }
 }