change

redux/globalReducer.js

@@ -276,6 +276,7 @@ const rootReducer = (state = globalState, action) => {
                         if (update.quantity == NaN){
                             update.quantity = 1
                         }
+                        
                         update.quantity -= 1
                         console.log('Update : ' + JSON.stringify(update))
                         data = {...old_data, ...update}

view/Item.js

@@ -4,39 +4,42 @@ import { connect } from 'react-redux';
 class Item extends React.Component {
     render() {
         const { item } = this.props
-        // console.log('ini props nya item : ' + JSON.stringify(item))
-        const { description, name, image, price, qty, } = item
+        console.log("ini id itemnya "+item.id)
         return (
-            
-            <View style={{ flex: 1, margin: 10 }}>
+
+            <View style={{ flex: 1, margin: 10 }} key={item.id} ref={this.props._scrollView}>
                 <ScrollView ref={view => this._scrollView = view}>
-                
-                <Text style={{ fontSize: 20, color: '#c9af6d' }}>{item.category.name}</Text>
-                <View style={{ flexDirection: 'row' }}>
-                    <View >
-                        <Image source={{ uri: item.image }} style={{ height: 100, width: 100, borderRadius: 5, top: 5 }}></Image>
-                    </View>
-                    <View >
-                        <Text style={{ fontSize: 20, margin: 5, marginRight: 10, fontWeight: 'bold' }}>{item.name}</Text>
-                        <Text style={{ fontSize: 15, margin: 5, marginRight: 10 }}>Rp. {item.price}</Text>
-                        <View style={{ flexDirection: 'row', flex: 1 }}>
-                            <View style={styles.shadowEdit}></View>
-                            <View style={styles.shadowAdd}>
-                                <TouchableOpacity onPress={() => this.props.handleMin()}>
-                                    <Text style={{ fontSize: 20, margin: 2 }}> - </Text>
-                                </TouchableOpacity>
+                    {item.code == 'CATEGORY' ? (
+                         <Text style={{ fontSize: 20, color: '#c9af6d' }}>{item.name}</Text>
+                    ): (
+
+                        <View style={{ flexDirection: 'row' }}>
+                        <View >
+                            <Image source={{ uri: item.image }} style={{ height: 100, width: 100, borderRadius: 5, top: 5 }}></Image>
+                        </View>
+                        <View >
+                            <Text style={{ fontSize: 20, margin: 5, marginRight: 10, fontWeight: 'bold' }}>{item.name}</Text>
+                            <Text style={{ fontSize: 15, margin: 5, marginRight: 10 }}>Rp. {item.price}</Text>
+                            <View style={{ flexDirection: 'row', flex: 1 }}>
+                                <View style={styles.shadowEdit}></View>
+                                <View style={styles.shadowAdd}>
+                                    <TouchableOpacity onPress={() => this.props.handleMin()}>
+                                        <Text style={{ fontSize: 20, margin: 2 }}> - </Text>
+                                    </TouchableOpacity>
                                     <TextInput
-                                        style={{ height: 25, padding: 2,textAlign:'center',margin:2 }}
+                                        style={{ height: 25, padding: 2, textAlign: 'center', margin: 2 }}
                                         autoCapitalize="none">
-                                            {item.qty}
-                                        </TextInput>
-                                <TouchableOpacity onPress={() => this.props.handleAdd()}>
-                                    <Text style={{ fontSize: 20, margin: 2 }}> + </Text>
-                                </TouchableOpacity>
+                                        {item.qty}
+                                    </TextInput>
+                                    <TouchableOpacity onPress={() => this.props.handleAdd()}>
+                                        <Text style={{ fontSize: 20, margin: 2 }}> + </Text>
+                                    </TouchableOpacity>
+                                </View>
                             </View>
                         </View>
                     </View>
-                </View>
+                    )}
+                   
                 </ScrollView>
             </View>
         )
@@ -98,12 +101,12 @@ const styles = StyleSheet.create({
 const mapStateToProps = (state) => {
     console.log(state)
     return {
-      session_id: state.session_id,
-      outlet_id: state.outlet_id,
-      order_quantity : state.order_quantity,
-      order_total : state.order_total,
-      quantity: state.quantity,
+        session_id: state.session_id,
+        outlet_id: state.outlet_id,
+        order_quantity: state.order_quantity,
+        order_total: state.order_total,
+        quantity: state.quantity,
     }
-  }
+}
 
 export default connect(mapStateToProps)(Item)

view/MenuSelection.js

@@ -44,27 +44,39 @@ class MenuSelection extends React.Component {
         listMenu: data.menu
       })
 
+     
       let last_category = ''
       let list_menu = []
 
-      console.log("INI DATANYA "+JSON.stringify(data.menu))
-      for (let row in data.menu) {
+
+      for (let i = 0; i < data.menu.length; i++) {
+        
+        const row = data.menu[i];
+        
         if (last_category != row.category.name) {
-          category = {
-            "id": 'CATEGORY',
-            "name": row.category.name
+          let category = {
+            "id":row.category.id,
+            "name": row.category.name,
+            "code" : "CATEGORY"
           }
-          list_menu.append(category)
-          list_menu.append(row)
+          list_menu.push(category)
+          list_menu.push(row)
           last_category = row.category.name
-
         } else {
-          // tampilin item
-          list_menu.append(row)
+          list_menu.push(row)
         }
       }
-
+     
+      this.state.listMenu.map((i => {
+        i.qty=0
+      }))
+      console.log('After :  ' + JSON.stringify(list_menu))
+      this.setState({
+        listMenu:list_menu
+      })
+      
     })
+
   }
   renderTabBar = ({ item }) => {
     return (
@@ -144,29 +156,31 @@ class MenuSelection extends React.Component {
     this.props.reduceQuantityItem(order_item)
     const list_order_item = this.props.order_item;
     let quantity = 0
-    if (quantity != 0) {
-      quantity = quantity - 1
+    if (item.qty == 0) {
+        item.qty = 0
+    }else{
       for (let i = 0; i < list_order_item.length; i++) {
         const row = list_order_item[i];
         if (row.id == item.id) {
           quantity = row.quantity
         }
-      }
       const listMenu = [...this.state.listMenu]
       listMenu[index].qty = quantity
       this.setState({
         listMenu
       })
     }
+    }
+      
   }
 
   render() {
-
     return (
       <View style={styles.container}>
         <StatusBar hidden={true} />
         <View style={{ flex: 0.7, height: 90, flexDirection: 'row', borderWidth: 1, }}>
           <FlatList horizontal={true} style={{ flexDirection: 'row' }}
+            showsHorizontalScrollIndicator={false}
             data={this.state.listCategory}
             renderItem={this.renderTabBar}
             keyExtractor={(item) => item.id}