diff --git a/app/views/inventory/inventory_definitions/_form.html.erb b/app/views/inventory/inventory_definitions/_form.html.erb
index 7e686d42..245aeb18 100644
--- a/app/views/inventory/inventory_definitions/_form.html.erb
+++ b/app/views/inventory/inventory_definitions/_form.html.erb
@@ -1,181 +1,123 @@
 <%= stylesheet_link_tag    'addorder', media: 'all', 'data-turbolinks-track': 'reload' %>
 
-<div class="container-fluid " style="padding:0px 3px 0px 3px;">
-  <div id="oqs_loading_wrapper" style="display:none;">
-    <div id="oqs_loading"></div>
-  </div>
-
-  <div class="row m-t--20">
-    <div class="col-lg-2 col-md-2 col-sm-2 hidden" id="menu_data"> 
-      <li class="list-menu">
-        <a href="javascript:void(0);" class="menu-toggle dropdown-toggle toggled my-toggle " style="">
-
-          <span class="main_menu" id="main_menu menu_name" >
-            <%if @menu.present? %>
-            <%=@menus[0].name%>
-            <% end%>
-          </span>
-        </a>
-        <ul class="ml-menu menu_list aria-hidden " style="border-top: 1px solid #fff">
-          <% @menus.each do |menu| %>
-          <li class="nav-item menu_click" data-name="<%=menu.name%>" data-id="<%=menu.id%>" style="">
-           <a class="nav-link" data-toggle="tab" href="" role="tab" style="text-transform: lowercase;"><%=menu.name%></a>
-         </li>
-         <%end%>
-       </ul>
-     </li> 
-     <div id="menu1-slimscroll" data-height="0">
-      <ul class="nav nav-tabs flex-column category_list" role="tablist" id="ul-navbar">
-        <li class="nav-item product" data-ref="<%= origami_get_all_product_path %>">
-          <a class="nav-link" data-toggle="tab" href="" role="tab">Products</a>
-        </li>
-        <% @menu.each do |menu| %>
-        <% if !menu.valid_time.nil? %>
-        <% if menu.menu_category_id.nil? %>
-        <!--if type quick_service or cashier for table -->
-    
-   
-          <% if !menu.code.include? "SPL" %>
-            <li class="nav-item ">
-              <p class="hidden menu-id"><%= menu.id  %></p> 
-              <a class="nav-link menu_category sub_click first_<%=menu.id%>" data-toggle="tab" href="" role="tab" data-id="<%=menu.id%>" data-sub-id="<%=menu.get_sub_category%>"> <%= menu.name%>
-              </a>
-              <ul class=" sub_category_list hidden fadeInTop animated" id="sub_category_list">
-              </ul>
-            </li>
-          <% end%>
-       
-        
-        <% end%>
-        <% end %>
-        <%end %>
-      </ul>
+  <div class="container-fluid " style="padding:0px 3px 0px 3px;">
+    <div id="oqs_loading_wrapper" style="display:none;">
+      <div id="oqs_loading"></div>
     </div>
-  </div>
+    <div class="row m-t--20">
+      <div class="col-lg-2 col-md-2 col-sm-2 hidden" id="menu_data"> 
+        <li class="list-menu">
+          <a href="javascript:void(0);" class="menu-toggle dropdown-toggle toggled my-toggle " style="">
 
-
-  <div class="col-lg-2 col-md-2 col-sm-2 hidden" id="menu_cache">
-    <li class="list-menu">
-      <a href="javascript:void(0);" class="menu-toggle dropdown-toggle toggled my-toggle " style="">
-        <span class="main_menu menu_cache_name" id="main_menu menu_cache_name"></span>
-      </a>
-      <ul class="ml-menu menu_list aria-hidden menu_cache_list" style="border-top: 1px solid #fff">
-      </ul>
-    </li> 
-    <div id="menu-slimscroll" data-height="0">
-      <ul class="nav nav-tabs flex-column category_list category_cache_list" role="tablist" id="ul-navbar">
-        <li class="nav-item product" data-ref="<%= origami_get_all_product_path %>">
-         <a class="nav-link" data-toggle="tab" href="" role="tab">Products</a>
-       </li>
-     </ul>
-   </div>
- </div>
-
-
- <div class="col-md-7 col-lg-7 col-sm-7 m-t-10" >
-  <div class="card">
-    <div class="card-block" style="">
-      <div class="card-text" id="custom-slimscroll">
-        <div class="row menu_items_list" style="margin:0px 1px 0px 1px ;">
-         <!-- append data -->
-       
-                  </div>
-                </div>
+            <span class="main_menu" id="main_menu menu_name" >
+              <%if @menu.present? %>
+              <%=@menus[0].name%>
+              <% end%>
+            </span>
+          </a>
+          <ul class="ml-menu menu_list aria-hidden " style="border-top: 1px solid #fff">
+            <% @menus.each do |menu| %>
+            <li class="nav-item menu_click" data-name="<%=menu.name%>" data-id="<%=menu.id%>" style="">
+             <a class="nav-link" data-toggle="tab" href="" role="tab" style="text-transform: lowercase;"><%=menu.name%></a>
+           </li>
+           <%end%>
+         </ul>
+        </li> 
+        <div id="menu1-slimscroll" data-height="0">
+          <ul class="nav nav-tabs flex-column category_list" role="tablist" id="ul-navbar">
+            <li class="nav-item product" data-ref="<%= origami_get_all_product_path %>">
+              <a class="nav-link" data-toggle="tab" href="" role="tab">Products</a>
+            </li>
+            <% @menu.each do |menu| %>
+              <% if !menu.valid_time.nil? %>
+                <% if menu.menu_category_id.nil? %>
+                  <!--if type quick_service or cashier for table -->
+                  <% if !menu.code.include? "SPL" %>
+                    <li class="nav-item ">
+                      <p class="hidden menu-id"><%= menu.id  %></p> 
+                      <a class="nav-link menu_category sub_click first_<%=menu.id%>" data-toggle="tab" href="" role="tab" data-id="<%=menu.id%>" data-sub-id="<%=menu.get_sub_category%>"> <%= menu.name%>
+                      </a>
+                      <ul class=" sub_category_list hidden fadeInTop animated" id="sub_category_list"></ul>
+                    </li>
+                  <% end%>
+                <% end%>
+              <% end %>
+            <%end %>
+          </ul>
+        </div>
+      </div>
+      <div class="col-lg-2 col-md-2 col-sm-2 hidden" id="menu_cache">
+        <li class="list-menu">
+          <a href="javascript:void(0);" class="menu-toggle dropdown-toggle toggled my-toggle " style="">
+            <span class="main_menu menu_cache_name" id="main_menu menu_cache_name"></span>
+          </a>
+          <ul class="ml-menu menu_list aria-hidden menu_cache_list" style="border-top: 1px solid #fff">
+          </ul>
+        </li> 
+        <div id="menu-slimscroll" data-height="0">
+          <ul class="nav nav-tabs flex-column category_list category_cache_list" role="tablist" id="ul-navbar">
+            <li class="nav-item product" data-ref="<%= origami_get_all_product_path %>">
+             <a class="nav-link" data-toggle="tab" href="" role="tab">Products</a>
+            </li>
+          </ul>
+        </div>
+      </div>
+      <div class="col-md-9 col-lg-9 col-sm-9 m-t-10" >
+        <div class="card">
+          <div class="card-block" style="">
+            <div class="card-text" id="custom-slimscroll">
+              <div class="row menu_items_list" style="margin:0px 1px 0px 1px ;">
+             <!-- append data -->
               </div>
             </div>
           </div>
-
-          <div class="col-md-3 col-lg-3 col-sm-3 m-t-10">
-
-          <div class="card-header" style="padding: 0.12rem 0.25rem">
-            </div>
-         <div class="card-block">
-          <div class="card-text" id="order-detail-slimscroll" data-height="140">
-           <table class="table table-striped summary-items" id="order-items-table" >
-             <thead>
-               <tr>
-                 <th>#</th>
-                 <th class="item-name">Items</th>
-                 <th class="item-qty">QTY</th>
-                 <th class="item-attr">Price</th>
-               </tr>
-             </thead>
-             <tbody class="font-13" >
-
-             </tbody>
-           </table>
-         </div>
-         <div class="card-footer custom-card-footer" style="padding: 0.35rem 0.15rem !important;">
-
-           <table class="table" id="order-charges-table" border="0">
-             <tr>
-               <td colspan="2" style="padding:2px; text-align:" class="charges-name" width="25%"><strong>Total:</strong></td>
-               <td style="padding:2px;" width="15%"><strong id="total_qty">0</strong></td>
-               
-               <td style="padding:2px; text-align:" width="25%" class="item-attr"><strong id="sub_total">0.00</strong></td>
-             </tr>
-           </table>
-           
-           <button type="button" class="btn btn-primary action-btn create col-md-11" id="create_order" disabled="disabled" style="padding-top:15px !important;padding-bottom:15px !important;">Add Order</button>
-   
-
-
-         </div>
-       </div>
-     </div>
-  <input type="hidden" name="server_mode" value="<%=ENV["SERVER_MODE"]%>" id="server_mode">
-</div>
-
-<div class="item-modal modal sx_item_detailModal" id="sx_item_detailModal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
-  <div class="modal-dialog custom-modal-dialog modal-lg">
-    <div class="modal-content">
-      <div class="modal-header" style="background-color: #54A5AF;padding-top:10px !important;">
-        <h4 class="modal-title" style="color:#fff;" id="title_name"></h4>
-        <button type="button" class="close" id="close" data-dismiss="modal" aria-hidden="true" style="font-size: 20px;color:#fff;">&times;</button>
-
+        </div>
       </div>
-      <div class="modal-body">
-        <div class="row no-set-item">
-          <div class="col-md-12">
-            <p style="text-align: center;" id="modal_box_img"></p>
-            <div class="row">
-              <div class="input-group">
-              <input type="text" value="" id="item_name" class="item_name form-control  ">
-            </div>
-            <div class="input-group">
-              <input type="text" value="1" id="max_qty" class="max_qty form-control ">
-            </div>
-            <div class="input-group">
-              <input type="text" value="1" id="min_qty" class="min_qty form-control">
-            </div>
-            </div>
-           <p class="hidden" id="unit_price"></p>
-           <p class="hidden" id="instance_code"></p>
-           <p class="hidden" id="instance_name"></p>
-           <p class="hidden" id="promotion_price"></p>
-           <p class="hidden" id="item_instances"></p>
-           <p class="hidden" id="item_code"></p>
+      <input type="hidden" name="server_mode" value="<%=ENV["SERVER_MODE"]%>" id="server_mode">
+    </div>
+
+    <div class="item-modal modal sx_item_detailModal" id="sx_item_detailModal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
+      <div class="modal-dialog custom-modal-dialog modal-lg">
+        <div class="modal-content">
+          <div class="modal-header" style="background-color: #54A5AF;padding-top:10px !important;">
+            <h4 class="modal-title" style="color:#fff;" id="title_name"></h4>
+            <button type="button" class="close" id="close" data-dismiss="modal" aria-hidden="true" style="font-size: 20px;color:#fff;">&times;</button>
           </div>
-          <div class="col-md-7 item-detail">      
-          <h5>Attributes</h5>           
-          <div class="attributes-list">
+          <div class="modal-body">
+            <div class="form-inputs">
+              <div class="form-group">
+                <label class="control-label" for="attribute">Menu Item</label>
+                <input class="form-control col-md-6" type="text" value="" id="item_name" readonly="true">
+                <input type="hidden" value="" id="item_code">
+                <input type="hidden" value="" id="instance_code">
+              </div>
+              <div class="form-group">
+                <label class="control-label" for="attribute">Instances</label>
+                <div class="attributes-list col-md-6"></div>
+              </div>
+              <div class="form-group">
+                <label class="control-label" for="min_qty">Min Qty</label>
+                <input class="form-control col-md-6" type="number" value="1" id="min_qty">
+              </div>
+              <div class="form-group">
+              <label class="control-label" for="max_qty">Max Qty</label>
+              <input class="form-control col-md-6" type="number" value="1" id="max_qty">
+              </div>
+            </div>
+          </div>
+          <div class="modal-footer">
+            <div class="row">
+              <div class="col-md-4">
+                <button type="button" class="btn btn-default " data-dismiss="modal" id="close">Close</button>
+              </div>
+              <div class="col-md-6">
+                <button type="button" class="btn btn-primary submit " data-dismiss="modal" id="submit">Submit</button>
+              </div>
+            </div>
           </div>
         </div>
-    </div>
-  </div>
-  <div class="modal-footer">
-    <div class="row">
-      <div class="col-md-4">
-        <button type="button" class="btn btn-default " data-dismiss="modal" id="close">Close</button>
-      </div>
-      <div class="col-md-6">
-        <button type="button" class="btn btn-primary add_to_order " data-dismiss="modal" id="add_to_order">Add to Order</button>
       </div>
     </div>
-  </div>
-</div>
-</div>
-</div>
 <style type="text/css">
   .fadeInRight{
   -webkit-animation-duration: 350ms !important;
@@ -198,10 +140,8 @@
   $(document).ready(function () {
     var menus = JSON.parse(localStorage.getItem("menus"));;
     if (menus != null) {
-      console.log("hi")
       menu_cache_append(menus);
     }else{
-      console.log("sssssss")
       $("#menu_data").removeClass("hidden");
     }      
 
@@ -415,28 +355,6 @@
                   options = [];
                   price = 0;
 
-                  if (JSON.stringify(menu_items[field].item_sets)!='[]') {
-                    fa_plus = '';
-                    add = '';
-                    menu_item_box = 'set_add_icon';
-                    data_target = 'sx_item_set_detailModal';
-                    data_modal = 'modal'
-                    add_icon = "set_item_box"
-                       code            =  menu_items[field].code;
-                       name            =  menu_items[field].name;
-                       instances       =  menu_items[field].instances;
-                        $(instances).each(function(i){
-                          if (instances[i].is_default == true) {
-                            price           = parseFloat(instances[i].price).toFixed(2);
-                          }else{
-                            price = 0;
-                          }
-                        });
-                       is_available    = menu_items[field].is_available ;
-                       is_on_promotion = 0;
-                       item_attributes = menu_items[field].attributes;
-                       promotion_price =  menu_items[field].promotion_price;
-                  }else{
                     fa_plus = 'material-icons';
                     add = 'view_list'
                     menu_item_box = 'menu_item_box';
@@ -456,7 +374,6 @@
                        code            = instances[i].code;
                      }
                     });
-                  }
 
                   if (menu_items[field].image) {                   
                       image_path = menu_items[field].image;                    
@@ -466,19 +383,19 @@
                   }
 
                   row = '<div class="col-md-3">'
-                  +'<div class="card custom-card testimonial-card fadeInRight"' 
+                  +'<div class="card custom-card testimonial-card fadeInRight card-box"' 
                      +'data-toggle="modal" data-target=".'+data_target+'" '
                      +'style="height:100%;background-image:url(../../'+image_path+');background-repeat: no-repeat;">'
                            +'<div class="custom-card-head card-head row" style="line-height:14px;margin:0px;" style="">'
                             +'<div class="col-md-10 " style="padding:0px !important;">'+ menu_items[field].name +'</div>'
                             +"<div class='col-md-2 "+menu_item_box+" ' data-item-code='"
-                          + menu_items[field].code +"' data-instance = '"
-                          +JSON.stringify(menu_items[field].instances)+"' data-id = '"
-                          +JSON.stringify(menu_items[field].attributes)+"' data-item = '"
-                          +JSON.stringify(item_attributes)+"' data-option = '"
-                          +JSON.stringify(menu_items[field].options)+"'data-opt = '"
-                          +JSON.stringify(menu_items[field].options)+"' data-item-sets = '"
-                          +JSON.stringify(menu_items[field].item_sets)+"' data-toggle='modal' data-target='."+data_target+"' style='padding:0px 5px 0px 5px'>"
+                              + menu_items[field].code +"' data-instance = '"
+                              +JSON.stringify(menu_items[field].instances)+"' data-id = '"
+                              +JSON.stringify(menu_items[field].attributes)+"' data-item = '"
+                              +JSON.stringify(item_attributes)+"' data-option = '"
+                              +JSON.stringify(menu_items[field].options)+"'data-opt = '"
+                              +JSON.stringify(menu_items[field].options)+"' data-item-sets = '"
+                              +JSON.stringify(menu_items[field].item_sets)+"' data-toggle='modal' data-target='."+data_target+"' style='padding:0px 5px 0px 5px'>"
                             +"<i class='m-l--5 fa "+fa_plus+" '>"
                             +add+ '</i>'
                             +'</div>'
@@ -509,6 +426,96 @@
           }
        }
 
+       //click item row for add order
+      $(document).on('click', '.card-box', function(event){ 
+
+        item_data =  $(this).children().siblings('.add_icon');
+
+        $('#item_code').val(item_data.attr('data-item-code'));
+        $('#item_name').val(item_data.attr('data-name'));
+        $('#instance_code').val(item_data.attr('data-instance-code'));
+
+        $('.attributes-list').empty();
+
+        data =  $(this).children().children('.menu_item_box');
+        // data =  $(this).parent().siblings('.add_icon');
+
+        attributes         = $(data).data('id');
+        selected_item      = $(data).data('item');
+        instances          = $(data).data('instance');
+
+        instance_attributes = []
+        for(var field in instances) { 
+          value = instances[field].values;
+          $(value).each(function(i){
+             options = value[i];
+             instance_attributes.push(options);
+          });
+        }
+
+        for(var field in attributes) { 
+          value = attributes[field]["values"];
+          type  = attributes[field]["type"]
+          row = "";
+
+          $(value).each(function(i){
+            disabled = ""
+            status ="";
+            if(parseInt(jQuery.inArray(value[i], selected_item)) !== -1){
+              status = "selected-attribute";
+            }
+            if(parseInt(jQuery.inArray(value[i], instance_attributes)) == -1){
+              disabled = "disabled";
+            }
+            row +="<button id='selected-attribute' data-instances='"+JSON.stringify(instances)+"' data-type='"
+            +type+"' data-value='"+value[i]+"' class='btn btn- waves-effect attribute_btn "
+            + status +" "+ type +" '"+ disabled +" >"
+            +value[i]
+            +"</button>";   
+          });
+          $(".attributes-list").append(row); 
+        }
+      });
+
+      // click select option icon for add 
+      $(document).on('click', '.attribute_btn', function(event){ 
+
+        // $('.change_qty').val(1);
+        value      = $(this).data('value');
+        type       = $(this).data('type');
+        instances  = $(this).data('instances');
+        
+        attributes = $(".attribute_btn");
+        $(attributes).each(function(i){
+          if ($(attributes[i]).attr('data-type')==type){
+            $('.'+type).removeClass("selected-attribute");
+          }
+        });
+        $(this).addClass('selected-attribute');
+        
+        var selected_attr = get_selected_attributes('selected-attribute');
+
+        for(var field in instances) { 
+          item_attr = instances[field].values;
+          
+          if(JSON.stringify(item_attr) == JSON.stringify(selected_attr)){
+            $('#instance_code').val(instances[field].code);
+          }     
+        }
+        
+      }); //End selecct attribute buttom
+
+       // Get Selected Class
+      function get_selected_attributes(selected_class) {
+        var item_row      = $('.'+selected_class);
+        var attribute_arr = [];
+        $(item_row).each(function(i){
+          value = $(item_row[i]).attr('data-value');
+          str = value;
+          attribute_arr.push(str);
+        });
+        return attribute_arr;
+      }
 
       $(document).on('click', '.cashier_number', function(event){
         if(event.handled !== true) {
@@ -546,6 +553,14 @@
             return false;
           }
         });
+         
+      // click select option icon for add 
+      $(document).on('click', '.submit', function(event){ 
+        var params = {'order_source': type, 'order_type': "dine_in",
+                  'customer_id': customer_id, 'guest_info': "",'booking_id':booking_id,
+                  'table_id': table_id, 
+                  'order_items': order_items,'create_type' : "create_only" };
+      });
 
     });
   </script>
\ No newline at end of file
diff --git a/app/views/inventory/inventory_definitions/as_form.html.erb b/app/views/inventory/inventory_definitions/aa_form.html.erb
similarity index 100%
rename from app/views/inventory/inventory_definitions/as_form.html.erb
rename to app/views/inventory/inventory_definitions/aa_form.html.erb