update order

App/Containers/CartScreen.js

@@ -28,7 +28,9 @@ class CartScreen extends Component {
       listCart: [],
       arrayDelete: [],
       currency: '',
-      loading: false
+      loading: false,
+      dataCheckout: [],
+      arrayCheck: []
     }
   }
 
@@ -200,6 +202,50 @@ class CartScreen extends Component {
     }
   }
 
+  handleDataCheckout(item) {
+    let dataCheckout = this.state.dataCheckout
+    let arrayCheck = this.state.arrayCheck
+    let indexId = this.state.arrayCheck.findIndex((val) => val == item.cart_id)
+    if (indexId == -1) {
+      dataCheckout.push(item)
+      arrayCheck.push(item.cart_id)
+    } else {
+      dataCheckout.splice(indexId,1)
+      arrayCheck.splice(indexId,1)
+    }
+    this.setState({dataCheckout, arrayCheck})
+  }
+
+  handleCheckAll() {
+    let dataCheckout = this.state.dataCheckout
+    let arrayCheck = this.state.arrayCheck
+    this.state.listCart.map((item, index) => {
+      dataCheckout.push(item)
+      arrayCheck.push(item.cart_id)
+    })
+    setTimeout(() => {
+      this.setState({dataCheckout, arrayCheck})
+    }, 1000);
+  }
+
+  handleNavigateCheckout() {
+    if (this.state.dataCheckout.length > 0) {
+      this.props.navigation.navigate('CheckOutScreen', {dataCheckout: this.state.dataCheckout})
+    } else {
+      Toast.show({
+        type: 'failed',
+        position: 'bottom',
+        text1: 'Failed',
+        text2: 'Minimal 1 Item Harus Dipilih',
+        visibilityTime: 2500,
+        autoHide: true,
+        // topOffset: 100,
+        // bottomOffset: 40,
+      })
+    }
+    
+  }
+
   render () {
     return (
       <View style={{flex: 1, backgroundColor: '#4cc9f0'}}>
@@ -212,9 +258,12 @@ class CartScreen extends Component {
             return (
               <View key={index}>
                 <View style={{flexDirection: 'row', justifyContent: 'space-between', paddingVertical: 20, paddingHorizontal: 20}}>
-                  <View style={{flexDirection: 'row' , alignItems:'center'}}>
-                    <TouchableOpacity onPress={() => alert('asdsa')}>
-                      <Image source={Images.radioOff} style={{width: 15, height: 15, tintColor: 'gray'}}/>
+                  <View style={{flexDirection: 'row', alignItems: 'center',}}>
+                    <TouchableOpacity onPress={() => this.handleDataCheckout(item)}>
+                      { this.state.arrayCheck.includes(item.cart_id) ?
+                        <Image source={Images.radioOn} style={{width: 20, height: 20}}/> :
+                        <Image source={Images.radioOff} style={{width: 20, height: 20, tintColor: 'gray'}}/>
+                      }
                     </TouchableOpacity>
                     <Image source={Images.icon_pesanansaya_gray} style={{width: 25, height: 30, resizeMode:'stretch', marginLeft: 10}}/>
                   </View>
@@ -290,19 +339,31 @@ class CartScreen extends Component {
                   </View>}
                 </View>
                 <View style={{width: '100%', height: 10, backgroundColor: '#ececec'}}/>
-                {index == this.state.listCart.length -1 && <View style={{height: 200, backgroundColor:'transparent', width: '100%'}}/>}
+                {index == this.state.listCart.length -1 && item.default_size.length > 0 && <View style={{height: 200, backgroundColor:'transparent', width: '100%'}}/>}
               </View>
             )
           })}
         </ScrollView>}
         <View style={{padding: 20, alignSelf:'flex-end', justifyContent: 'flex-end', backgroundColor: 'white', elevation: 5, width: '100%', borderTopWidth: 1, borderTopColor: '#d8d8d8'}}>
+          <View style={{flexDirection:'row'}}>
+            <TouchableOpacity onPress={() => {
+                this.state.arrayCheck.length > 0 && this.state.arrayCheck.length == this.state.listCart.length?
+                this.setState({arrayCheck: [], dataCheckout: []}) : this.handleCheckAll() 
+              }}>
+              {this.state.arrayCheck.length > 0 && this.state.arrayCheck.length == this.state.listCart.length?
+                <Image source={Images.radioOn} style={{width: 20, height: 20}}/>: 
+                <Image source={Images.radioOff} style={{width: 20, height: 20, tintColor: 'gray'}}/>
+              }
+            </TouchableOpacity>
+            <BaseText text={"Pilih Semua"} type={"bold"} style={{opacity: .5, fontSize: 12, marginLeft: 5, alignSelf: 'flex-end',}}/>
+          </View>
           <View style={{flexDirection:'row', justifyContent: 'space-between', alignItems:'center'}}>
             <View style={{width: '60%'}}>
-              <BaseText text={"Subtotal"} type={"bold"} style={{opacity: .5, fontSize: 12}}/>
+              <BaseText text={"Subtotal"} type={"bold"} style={{opacity: .5, fontSize: 12, marginTop: 5}}/>
               <BaseText text={this.getTotalCart()} type={"bold"} style={{opacity: .8, color: '#4cc9f0'}}/>
             </View>
             <View style={{width: '40%'}}>
-              <BaseButton text={'Checkout'} onPress={() => this.props.navigation.navigate('CheckOutScreen')} fontSizeText={14}/>
+              <BaseButton text={'Checkout'} onPress={() => this.handleNavigateCheckout()} fontSizeText={14}/>
             </View>
           </View>
         </View>