From 5b374dc48fb2addc0762644ea694316404cdbd65 Mon Sep 17 00:00:00 2001
From: aungthetkhaing <aung.tk@code2lab.com>
Date: Tue, 3 Jun 2025 14:00:18 +0630
Subject: [PATCH] fix modal

---
 app/assets/javascripts/addorder.js            | 3127 ++++++++++-------
 app/views/foodcourt/addorders/detail.html.erb |   50 +-
 app/views/layouts/_read_modal.html.erb        |  192 +-
 3 files changed, 1904 insertions(+), 1465 deletions(-)

diff --git a/app/assets/javascripts/addorder.js b/app/assets/javascripts/addorder.js
index 14966e76..272a0bda 100755
--- a/app/assets/javascripts/addorder.js
+++ b/app/assets/javascripts/addorder.js
@@ -1,202 +1,265 @@
 //middle edit
-$(function() {
-  var role = $('#role').val();
+$(function () {
+  var role = $("#role").val();
   var second_display_lookup = $("#display_type").val();
-  type = window.location.href.indexOf("quick_service") || window.location.href.indexOf("food_court");
+  type =
+    window.location.href.indexOf("quick_service") ||
+    window.location.href.indexOf("food_court");
   modify_order = window.location.href.indexOf("modify_order");
 
   //click menu sidebar menu category
-  $(".product").on("click", function(){
-    var url = $(this).attr('data-ref');
+  $(".product").on("click", function () {
+    var url = $(this).attr("data-ref");
     show_product_list(url);
   });
   //show menu item list when click menu category
-  function show_product_list(url_item){
-
-    var menu_list = $('.menu_items_list');
+  function show_product_list(url_item) {
+    var menu_list = $(".menu_items_list");
     menu_list.empty();
 
-        if (type != -1 && modify_order != -1) {
-          url_item = '../../../../../'+url_item;
-        }
-        if(modify_order == -1 && type != -1){
-          url_item = '../../../../'+url_item;
-        }
-        if (type ==-1 && modify_order == -1){
-          url_item = url_item
-        }
+    if (type != -1 && modify_order != -1) {
+      url_item = "../../../../../" + url_item;
+    }
+    if (modify_order == -1 && type != -1) {
+      url_item = "../../../../" + url_item;
+    }
+    if (type == -1 && modify_order == -1) {
+      url_item = url_item;
+    }
     //Start Ajax
     $.ajax({
       type: "GET",
       url: url_item,
       data: {},
       dataType: "json",
-      success: function(data) {
-
-        var menu_items_list = $('.menu_items_list');
+      success: function (data) {
+        var menu_items_list = $(".menu_items_list");
         menu_items_list.empty();
         product = data;
 
-        for(var field in product) {
+        for (var field in product) {
           if (product[field].unit_price > 0) {
-            qty             = 1;
-            options         = [];
+            qty = 1;
+            options = [];
             item_attributes = [];
 
             if (product[field].image_path.url) {
               if (type != -1 && modify_order != -1) {
-                image_path = '../../'+product[field].image_path.url;
+                image_path = "../../" + product[field].image_path.url;
               }
-              if(modify_order == -1 && type != -1){
-               image_path = '../../../../'+product[field].image_path.url;
+              if (modify_order == -1 && type != -1) {
+                image_path = "../../../../" + product[field].image_path.url;
               }
-              if (type ==-1 && modify_order == -1){
+              if (type == -1 && modify_order == -1) {
                 image_path = product[field].image_path.url;
               }
 
-
-            row = '<div class="col-md-6 col-sm-6 col-lg-3 mt-3">'
-                  +'<div class="card custom-card testimonial-card fadeInRight" 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">'+ product[field].name +'</div>'
-
-                     +'</div>'
-
-                  +"<div class='add_icon product_item p-t-65 p-b-65'  data-item-code='"
-                        + product[field].item_code +"' data-name='"
-                        + product[field].name +"' data-qty = '"+ qty +"' data-price = '"
-                        + product[field].unit_price +"' data-instance-code = '"+ product[field].item_code +"' data-instances = '"
-                        + product[field].name +"' data-promotion-price = '"+ 1 +"' data-attributes = '"
-                        + JSON.stringify(item_attributes) +"' data-options = '"
-                          + JSON.stringify(options) +"' data-id = '"+ JSON.stringify(item_attributes) +"' data-opt = '"
-                          + JSON.stringify(options) +"' data-image='"+image_path+"' data-toggle='modal' data-target='.sx_item_detailModal'>"
-                  +'</div>'
-                    +'<div class="card-footer custom-card-footer custom-flex-footer">'
-                      +'<span style="font-weight:900;flex-grow:1;">'+ product[field].unit_price +'</span>'
-                      +"<div class='offset-4 col-2 menu_item_box' data-item-code='"
-                          + product[field].item_code +"' data-instance = '"
-                          +JSON.stringify(item_attributes)+"' data-id = '"
-                          +JSON.stringify(item_attributes)+"' data-item = '"
-                          +JSON.stringify(item_attributes)+"' data-option = '"
-                          +JSON.stringify(options)+"'data-opt = '"
-                          +JSON.stringify(options)+"' data-item-sets = '"
-                          +JSON.stringify(item_attributes)+"' data-image='"+image_path+"' data-toggle='modal' data-target='.sx_item_detailModal'>"
-                            +"<i class='fa fa-bars material-icons m-l--10'>"
-                            +'view_list</i>'
-                      +'</div>'
-                    +'</div>'
-
-                  +'</div>';
-                }
-                else
-                {
-                  row = '<div class="col-md-6 col-sm-6 col-lg-3 mt-1">'
-                  +'<div class="card custom-card testimonial-card fadeInRight" style="height:100%;">'
-                   +'<div class="custom-card-head custom-card-no-img-head card-head row" style="margin:0px;display:flex;!important">'
-                      +"<div class='col-12 add_icon product_item p-t-65 p-b-65'  data-item-code='"
-                        + product[field].item_code +"' data-name='"
-                        + product[field].name +"' data-qty = '"+ qty +"' data-price = '"
-                        + product[field].unit_price +"' data-instance-code = '"+ product[field].item_code +"' data-instance = '"
-                        + product[field].name +"' data-promotion-price = '"+ 1 +"' data-attributes = '"
-                        + JSON.stringify(item_attributes) +"' data-id = '"+ JSON.stringify(item_attributes) +"' data-options = '"
-                          + JSON.stringify(options) +"' data-opt = '"
-                          + JSON.stringify(options) +"' data-image='' data-toggle='modal' data-target='.sx_item_detailModal'>"
-                    +'<div class="product_box">'+ product[field].name +'</div>'
-                    +'</div>'
-
-
-                     +'</div>'
-
-                  +"<div class='add_icon' product_item data-item-code='"
-                        + product[field].item_code +"' data-name='"
-                        + product[field].name +"' data-qty = '"+ qty +"' data-price = '"
-                        + product[field].unit_price +"' data-instance-code = '"+ product[field].item_code +"' data-instance = '"
-                        + product[field].name +"' data-promotion-price = '"+ 1 +"' data-attributes = '"
-                        + JSON.stringify(item_attributes) +"' data-options = '"
-                          + JSON.stringify(options) +"' data-opt = '"
-                          + JSON.stringify(options) +"' data-image=''>"
-
-                  +'</div>'
-
-                    +'<div class="card-footer custom-card-no-img-footer custom-flex-footer">'
-                      +'<span style="font-weight:900;flex-grow:1;">'+ product[field].unit_price +'</span>'
-                      +"<div class='offset-4 col-2 menu_item_box menu_item_no_img_box' data-item-code='"
-                          + product[field].item_code +"' data-instance = '"
-                          +JSON.stringify(item_attributes)+"' data-id = '"
-                          +JSON.stringify(item_attributes)+"' data-item = '"
-                          +JSON.stringify(item_attributes)+"' data-option = '"
-                          +JSON.stringify(options)+"'data-opt = '"
-                          +JSON.stringify(options)+"' data-item-sets = '"
-                          +JSON.stringify(item_attributes)+"' data-image='' data-toggle='modal' data-target='.sx_item_detailModal'>"
-                            +"<i class='fa fa-bars material-icons m-l--10'>"
-                            +'view_list</i>'
-                      +'</div>'
-                    +'</div>'
-
-                  +'</div>';
-                }
-            $('.menu_items_list').append(row);
+              row =
+                '<div class="col-md-6 col-sm-6 col-lg-3 mt-3">' +
+                '<div class="card custom-card testimonial-card fadeInRight" 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">' +
+                product[field].name +
+                "</div>" +
+                "</div>" +
+                "<div class='add_icon product_item p-t-65 p-b-65'  data-item-code='" +
+                product[field].item_code +
+                "' data-name='" +
+                product[field].name +
+                "' data-qty = '" +
+                qty +
+                "' data-price = '" +
+                product[field].unit_price +
+                "' data-instance-code = '" +
+                product[field].item_code +
+                "' data-instances = '" +
+                product[field].name +
+                "' data-promotion-price = '" +
+                1 +
+                "' data-attributes = '" +
+                JSON.stringify(item_attributes) +
+                "' data-options = '" +
+                JSON.stringify(options) +
+                "' data-id = '" +
+                JSON.stringify(item_attributes) +
+                "' data-opt = '" +
+                JSON.stringify(options) +
+                "' data-image='" +
+                image_path +
+                "' data-toggle='modal' data-target='.sx_item_detailModal'>" +
+                "</div>" +
+                '<div class="card-footer custom-card-footer custom-flex-footer">' +
+                '<span style="font-weight:900;flex-grow:1;">' +
+                product[field].unit_price +
+                "</span>" +
+                "<div class='offset-4 col-2 menu_item_box' data-item-code='" +
+                product[field].item_code +
+                "' data-instance = '" +
+                JSON.stringify(item_attributes) +
+                "' data-id = '" +
+                JSON.stringify(item_attributes) +
+                "' data-item = '" +
+                JSON.stringify(item_attributes) +
+                "' data-option = '" +
+                JSON.stringify(options) +
+                "'data-opt = '" +
+                JSON.stringify(options) +
+                "' data-item-sets = '" +
+                JSON.stringify(item_attributes) +
+                "' data-image='" +
+                image_path +
+                "' data-toggle='modal' data-target='.sx_item_detailModal'>" +
+                "<i class='fa fa-bars material-icons m-l--10'>" +
+                "view_list</i>" +
+                "</div>" +
+                "</div>" +
+                "</div>";
+            } else {
+              row =
+                '<div class="col-md-6 col-sm-6 col-lg-3 mt-1">' +
+                '<div class="card custom-card testimonial-card fadeInRight" style="height:100%;">' +
+                '<div class="custom-card-head custom-card-no-img-head card-head row" style="margin:0px;display:flex;!important">' +
+                "<div class='col-12 add_icon product_item p-t-65 p-b-65'  data-item-code='" +
+                product[field].item_code +
+                "' data-name='" +
+                product[field].name +
+                "' data-qty = '" +
+                qty +
+                "' data-price = '" +
+                product[field].unit_price +
+                "' data-instance-code = '" +
+                product[field].item_code +
+                "' data-instance = '" +
+                product[field].name +
+                "' data-promotion-price = '" +
+                1 +
+                "' data-attributes = '" +
+                JSON.stringify(item_attributes) +
+                "' data-id = '" +
+                JSON.stringify(item_attributes) +
+                "' data-options = '" +
+                JSON.stringify(options) +
+                "' data-opt = '" +
+                JSON.stringify(options) +
+                "' data-image='' data-toggle='modal' data-target='.sx_item_detailModal'>" +
+                '<div class="product_box">' +
+                product[field].name +
+                "</div>" +
+                "</div>" +
+                "</div>" +
+                "<div class='add_icon' product_item data-item-code='" +
+                product[field].item_code +
+                "' data-name='" +
+                product[field].name +
+                "' data-qty = '" +
+                qty +
+                "' data-price = '" +
+                product[field].unit_price +
+                "' data-instance-code = '" +
+                product[field].item_code +
+                "' data-instance = '" +
+                product[field].name +
+                "' data-promotion-price = '" +
+                1 +
+                "' data-attributes = '" +
+                JSON.stringify(item_attributes) +
+                "' data-options = '" +
+                JSON.stringify(options) +
+                "' data-opt = '" +
+                JSON.stringify(options) +
+                "' data-image=''>" +
+                "</div>" +
+                '<div class="card-footer custom-card-no-img-footer custom-flex-footer">' +
+                '<span style="font-weight:900;flex-grow:1;">' +
+                product[field].unit_price +
+                "</span>" +
+                "<div class='offset-4 col-2 menu_item_box menu_item_no_img_box' data-item-code='" +
+                product[field].item_code +
+                "' data-instance = '" +
+                JSON.stringify(item_attributes) +
+                "' data-id = '" +
+                JSON.stringify(item_attributes) +
+                "' data-item = '" +
+                JSON.stringify(item_attributes) +
+                "' data-option = '" +
+                JSON.stringify(options) +
+                "'data-opt = '" +
+                JSON.stringify(options) +
+                "' data-item-sets = '" +
+                JSON.stringify(item_attributes) +
+                "' data-image='' data-toggle='modal' data-target='.sx_item_detailModal'>" +
+                "<i class='fa fa-bars material-icons m-l--10'>" +
+                "view_list</i>" +
+                "</div>" +
+                "</div>" +
+                "</div>";
+            }
+            $(".menu_items_list").append(row);
           }
         }
-      }
+      },
     });
     //end Ajax
   }
   //end show list function
   //click menu sidebar menu category
-  $(document).on('click', '.menu_category', function(e){
+  $(document).on("click", ".menu_category", function (e) {
     e.preventDefault();
-    $('.sub_category_list').addClass("hidden");
+    $(".sub_category_list").addClass("hidden");
     var menu_id = $(this).attr("data-id");
-    var url     = "get_menu_category/"+menu_id;
-    show_menu_item_list(url,menu_id);
-    var sub_id  = $(this).attr("data-sub-id");
+    var url = "get_menu_category/" + menu_id;
+    show_menu_item_list(url, menu_id);
+    var sub_id = $(this).attr("data-sub-id");
     if (sub_id == "true") {
-      var sub_url = "get_menu_sub_category/"+menu_id;
-      sub_category = $(this).siblings('.sub_category_list');
-      show_sub_category_list(sub_url,sub_category,menu_id);
+      var sub_url = "get_menu_sub_category/" + menu_id;
+      sub_category = $(this).siblings(".sub_category_list");
+      show_sub_category_list(sub_url, sub_category, menu_id);
     }
   });
   //End menu category Click
 
   //click menu sidebar menu category
-  $(document).on('click', '.menu_sub_category', function(event){
-  //   event.preventDefault();
-  // $(".menu_sub_category").on("click", function(){
-    $('.sub_category_list').addClass("hidden");
+  $(document).on("click", ".menu_sub_category", function (event) {
+    //   event.preventDefault();
+    // $(".menu_sub_category").on("click", function(){
+    $(".sub_category_list").addClass("hidden");
     var menu_id = $(this).attr("data-id");
-    var url     = "get_menu_category/"+menu_id;
-    show_menu_item_list(url,menu_id);
+    var url = "get_menu_category/" + menu_id;
+    show_menu_item_list(url, menu_id);
   });
   //End menu category Click
 
   //show menu item list when click menu category
-  function show_menu_item_list(url_item,menu_id){
-    var menu_list = $('.menu_items_list');
+  function show_menu_item_list(url_item, menu_id) {
+    var menu_list = $(".menu_items_list");
     menu_list.empty();
 
     menus = JSON.parse(localStorage.getItem("menus"));
     if (menus != null) {
-      for(var i in menus) {
+      for (var i in menus) {
         var categories = menus[i]["categories"];
-        for(var ii in categories) {
+        for (var ii in categories) {
           if (categories[ii]["id"] == menu_id) {
             var menu_items = categories[ii]["items"];
             show_menu_list(menu_items);
           }
         }
       }
-    }else{
-
-      type = window.location.href.indexOf("quick_service") || window.location.href.indexOf("food_court");
+    } else {
+      type =
+        window.location.href.indexOf("quick_service") ||
+        window.location.href.indexOf("food_court");
       modify_order = window.location.href.indexOf("modify_order");
 
       if (type != -1 && modify_order != -1) {
-        url_item = '../../../addorders/'+url_item;
-      }if(modify_order == -1 && type != -1){
-        url_item = 'addorders/'+url_item;
+        url_item = "../../../addorders/" + url_item;
       }
-      if (type ==-1 && modify_order == -1){
+      if (modify_order == -1 && type != -1) {
+        url_item = "addorders/" + url_item;
+      }
+      if (type == -1 && modify_order == -1) {
         url_item = url_item;
       }
 
@@ -206,960 +269,1168 @@ $(function() {
         url: url_item,
         data: {},
         dataType: "json",
-        success: function(data) {
-          var menu_items_list = $('.menu_items_list');
+        success: function (data) {
+          var menu_items_list = $(".menu_items_list");
           menu_items_list.empty();
           menu_items = data.menu_items;
           show_menu_list(menu_items);
-        }
+        },
       });
       //end Ajax
     }
   }
   //end show list function
   //click item row for item set
-  $(document).on('click', '.set_item_box', function(event){
+  $(document).on("click", ".set_item_box", function (event) {
     $(".instance-list").empty();
     $(".options-list").empty();
     $(".selected-set-list").empty();
-    $('.set_change_qty').val(1);
-    change_qty_plus_minus("set_count","set_plus","set_minus");
-    data =  $(this).parent().children().children('.add_icon');
+    $(".set_change_qty").val(1);
+    change_qty_plus_minus("set_count", "set_plus", "set_minus");
+    data = $(this).parent().children().children(".add_icon");
     // data =  $(this).parent().siblings('.add_icon');
     //instances          = $(this).data('instance');
-    item_sets          = $(this).data('item-sets');
-    instances          = $(this).data('instances');
-    item_options       = $(this).data('options');
+    item_sets = $(this).data("item-sets");
+    instances = $(this).data("instances");
+    item_options = $(this).data("options");
 
-
-    for(var field in item_sets) {
-
-      $('.set_order').attr('data-min-qty',item_sets[field]["min_selectable_qty"]);
+    for (var field in item_sets) {
+      $(".set_order").attr(
+        "data-min-qty",
+        item_sets[field]["min_selectable_qty"],
+      );
 
       value = item_sets[field]["instances"];
-      $(value).each(function(i){
+      $(value).each(function (i) {
         menus = JSON.parse(localStorage.getItem("menus"));
         if (menus != null) {
-          for(var j in menus) {
+          for (var j in menus) {
             var categories = menus[j]["categories"];
-            for(var ii in categories) {
+            for (var ii in categories) {
               var items = categories[ii]["items"];
-              for(var iii in items) {
+              for (var iii in items) {
                 var result = items[iii]["instances"];
-                for(var v in result) {
-                 if (value[i]["id"] == result[v]["id"]) {
-                  if (result[v].out_of_stock) {
-                    price_tag = '<span class="text-danger">out of stock</span>'
-                    pointer_event = 'none'
-                    opacity = '0.5'
-                  }
-                  else {
-                   price_tag = '<span>'+result[v]["price"]+'</span>'
-                   pointer_event = 'auto'
-                    opacity = ''
-                  }
+                for (var v in result) {
+                  if (value[i]["id"] == result[v]["id"]) {
+                    if (result[v].out_of_stock) {
+                      price_tag =
+                        '<span class="text-danger">out of stock</span>';
+                      pointer_event = "none";
+                      opacity = "0.5";
+                    } else {
+                      price_tag = "<span>" + result[v]["price"] + "</span>";
+                      pointer_event = "auto";
+                      opacity = "";
+                    }
 
-                   row = '<div class="col-md-4 " style="pointer-events: '+pointer_event+'; opacity: '+opacity+'">'
-                          +"<div class='card custom-card instance_box' data-name='"+result[v]["name"]
-                              +"' data-code='"+result[v]["code"]
-                              +"' data-price='"+result[v]["price"]
-                              +"' data-option='"+JSON.stringify(items[iii]["options"])
-                              +"' data-min-qty='"+item_sets[field]["min_selectable_qty"]
-                              +"' data-max-qty='"+item_sets[field]["max_selectable_qty"]
-                              +"' data-parent-code='"+instances[0]['code']
-                              +"' data-parent-id='"+instances[0]['id']
-                              +"' data-sub-item='true"
-                              +"'>"
-                            +'<div class="custom-card-head card-head" style="line-height:14px;">'
-                               +'<span class="">'+result[v]["name"]+'</span>'
-                            +'</div>'
-                            +'<div class="card-block custom-card-block">'
-                              +'<img id="" src="/image/logo.png" height="40px">'
-                              +' <small style="float:" id="instance_option"></small>'
-                            +'</div>'
-                            +'<div class="card-footer custom-card-footer">'
-                               +price_tag
-                               // +' <small style="float:right" id="instance_option"></small>'
-                            +'</div>'
-                          +'</div>'
-                        +' </div>'
+                    row =
+                      '<div class="col-md-4 " style="pointer-events: ' +
+                      pointer_event +
+                      "; opacity: " +
+                      opacity +
+                      '">' +
+                      "<div class='card custom-card instance_box' data-name='" +
+                      result[v]["name"] +
+                      "' data-code='" +
+                      result[v]["code"] +
+                      "' data-price='" +
+                      result[v]["price"] +
+                      "' data-option='" +
+                      JSON.stringify(items[iii]["options"]) +
+                      "' data-min-qty='" +
+                      item_sets[field]["min_selectable_qty"] +
+                      "' data-max-qty='" +
+                      item_sets[field]["max_selectable_qty"] +
+                      "' data-parent-code='" +
+                      instances[0]["code"] +
+                      "' data-parent-id='" +
+                      instances[0]["id"] +
+                      "' data-sub-item='true" +
+                      "'>" +
+                      '<div class="custom-card-head card-head" style="line-height:14px;">' +
+                      '<span class="">' +
+                      result[v]["name"] +
+                      "</span>" +
+                      "</div>" +
+                      '<div class="card-block custom-card-block">' +
+                      '<img id="" src="/image/logo.png" height="40px">' +
+                      ' <small style="float:" id="instance_option"></small>' +
+                      "</div>" +
+                      '<div class="card-footer custom-card-footer">' +
+                      price_tag +
+                      // +' <small style="float:right" id="instance_option"></small>'
+                      "</div>" +
+                      "</div>" +
+                      " </div>";
                     $(".instance-list").append(row);
-                 }
+                  }
                 }
               }
             }
           }
-        }else{
-          type = window.location.href.indexOf("quick_service") || window.location.href.indexOf("food_court");
-         modify_order = window.location.href.indexOf("modify_order");
+        } else {
+          type =
+            window.location.href.indexOf("quick_service") ||
+            window.location.href.indexOf("food_court");
+          modify_order = window.location.href.indexOf("modify_order");
           if (type != -1 && modify_order != -1) {
-            url = '../../../addorders/get_item_instance/'+value[i]["id"];
+            url = "../../../addorders/get_item_instance/" + value[i]["id"];
           }
-          if(modify_order == -1 && type != -1){
-            url = 'addorders/get_item_instance/'+value[i]["id"] ;
+          if (modify_order == -1 && type != -1) {
+            url = "addorders/get_item_instance/" + value[i]["id"];
           }
-          if (type ==-1 && modify_order == -1){
-            url   = '../addorders/get_item_instance/'+value[i]["id"];
+          if (type == -1 && modify_order == -1) {
+            url = "../addorders/get_item_instance/" + value[i]["id"];
           }
           $.ajax({
             type: "GET",
-              url: url,
-              // data: {id:value[i]},
-              success:function(result){
+            url: url,
+            // data: {id:value[i]},
+            success: function (result) {
+              row =
+                '<div class="col-md-4 " >' +
+                "<div class='card custom-card instance_box' data-name='" +
+                result["name"] +
+                "' data-code='" +
+                result["code"] +
+                "' data-price='" +
+                result["price"] +
+                "' data-option='" +
+                JSON.stringify(result["options"]) +
+                "' data-min-qty='" +
+                item_sets[field]["min_selectable_qty"] +
+                "' data-max-qty='" +
+                item_sets[field]["max_selectable_qty"] +
+                "' data-parent-code='" +
+                instances[0]["code"] +
+                "' data-parent-id='" +
+                instances[0]["id"] +
+                "' data-sub-item='true" +
+                "'>" +
+                '<div class="custom-card-head card-head" style="line-height:14px;">' +
+                '<span class="">' +
+                result["name"] +
+                "</span>" +
+                "</div>" +
+                '<div class="card-block custom-card-block">' +
+                '<img id="" src="/image/logo.png" height="40px">' +
+                ' <small style="float:" id="instance_option"></small>' +
+                "</div>" +
+                '<div class="card-footer custom-card-footer">' +
+                " <span>" +
+                result["price"] +
+                "</span>" +
+                // +' <small style="float:right" id="instance_option"></small>'
+                "</div>" +
+                "</div>" +
+                " </div>";
 
-                  row = '<div class="col-md-4 " >'
-                          +"<div class='card custom-card instance_box' data-name='"+result["name"]
-                              +"' data-code='"+result["code"]
-                              +"' data-price='"+result["price"]
-                              +"' data-option='"+JSON.stringify(result["options"])
-                              +"' data-min-qty='"+item_sets[field]["min_selectable_qty"]
-                              +"' data-max-qty='"+item_sets[field]["max_selectable_qty"]
-                              +"' data-parent-code='"+instances[0]['code']
-                              +"' data-parent-id='"+instances[0]['id']
-                              +"' data-sub-item='true"
-                              +"'>"
-                            +'<div class="custom-card-head card-head" style="line-height:14px;">'
-                               +'<span class="">'+result["name"]+'</span>'
-                            +'</div>'
-                            +'<div class="card-block custom-card-block">'
-                              +'<img id="" src="/image/logo.png" height="40px">'
-                              +' <small style="float:" id="instance_option"></small>'
-                            +'</div>'
-                            +'<div class="card-footer custom-card-footer">'
-                               +' <span>'+result["price"]+'</span>'
-                               // +' <small style="float:right" id="instance_option"></small>'
-                            +'</div>'
-                          +'</div>'
-                        +' </div>'
-
-                $(".instance-list").append(row);
-              }
+              $(".instance-list").append(row);
+            },
           });
         }
       });
     }
-    for(var j in item_options) {
+    for (var j in item_options) {
       value = item_options[j]["values"];
-      type  = item_options[j]["type"];
-      row = "<h4>"+type+"</h4>"
-      $(value).each(function(i){
-        row +="<button class='btn btn- waves-effect check_option_btn "+ type +"' data-type='"
-        +type+"' data-value='"+value[i]+"' data-group='set_menu_default'>"+value[i]+"</button>";
+      type = item_options[j]["type"];
+      row = "<h4>" + type + "</h4>";
+      $(value).each(function (i) {
+        row +=
+          "<button class='btn btn- waves-effect check_option_btn " +
+          type +
+          "' data-type='" +
+          type +
+          "' data-value='" +
+          value[i] +
+          "' data-group='set_menu_default'>" +
+          value[i] +
+          "</button>";
       });
       $(".options-list").append(row);
     }
-     $('.set-item').attr('data-code',instances[0]['code']);
-     $('.set-item').attr('data-name',instances[0]['name']);
-     $('.set-item').attr('data-price',instances[0]['price']);
-     $('.set-item').attr('data-options','');
-     $('.set-item').attr('data-parent',true);
+    $(".set-item").attr("data-code", instances[0]["code"]);
+    $(".set-item").attr("data-name", instances[0]["name"]);
+    $(".set-item").attr("data-price", instances[0]["price"]);
+    $(".set-item").attr("data-options", "");
+    $(".set-item").attr("data-parent", true);
 
-    $('#set_change_qty').val(1);
-    $('#set_item_instances').text(instances);
-    $('#set_name').text($(this).attr('data-name'));
-    $('#set_item_code').text($(this).attr('data-item-code'));
-     $('#set_total_price').text($(this).attr('data-price'));
+    $("#set_change_qty").val(1);
+    $("#set_item_instances").text(instances);
+    $("#set_name").text($(this).attr("data-name"));
+    $("#set_item_code").text($(this).attr("data-item-code"));
+    $("#set_total_price").text($(this).attr("data-price"));
     // $('#set_total_price').text(0);
-    $('#set_unit_price').text($(this).attr('data-price'));
+    $("#set_unit_price").text($(this).attr("data-price"));
     // $('#set_unit_price').text(0);
   });
   // click instance for add item set
-  $(document).on('click', '.instance_box', function(event){
+  $(document).on("click", ".instance_box", function (event) {
+    $(".options-list").empty();
 
-      $(".options-list").empty();
+    rowCount = $(".selected-instance");
+    setCount = $(".selected-set");
+    item_options = $(this).data("option");
 
-      rowCount     = $('.selected-instance');
-      setCount     = $('.selected-set');
-      item_options = $(this).data('option');
+    min_qty = $(this).data("min-qty");
+    max_qty = $(this).data("max-qty");
 
-      min_qty      = $(this).data('min-qty');
-      max_qty      = $(this).data('max-qty');
+    code = $(this).data("code");
 
-      code = $(this).data('code');
-
-      if (rowCount.length+1 <= max_qty) {
-        for(var field in item_options) {
-            value = item_options[field]["values"];
-            type  = item_options[field]["type"];
-            row = "<p style='font-size:16px;margin-bottom:3px'>"+type+"</p>"
-            $(value).each(function(i){
-              row +="<button class='btn btn-default btn-sm check_option_btn "+ type +"' data-type='"
-              +type+"' data-value='"+value[i]+"' data-code='"+code+"' data-group='set_menu'>"
-              +value[i]+"</button>";
-            });
-            $(".options-list").append(row);
-        }
+    if (rowCount.length + 1 <= max_qty) {
+      for (var field in item_options) {
+        value = item_options[field]["values"];
+        type = item_options[field]["type"];
+        row = "<p style='font-size:16px;margin-bottom:3px'>" + type + "</p>";
+        $(value).each(function (i) {
+          row +=
+            "<button class='btn btn-default btn-sm check_option_btn " +
+            type +
+            "' data-type='" +
+            type +
+            "' data-value='" +
+            value[i] +
+            "' data-code='" +
+            code +
+            "' data-group='set_menu'>" +
+            value[i] +
+            "</button>";
+        });
+        $(".options-list").append(row);
       }
-        // if($(this).hasClass('selected-instance') == true){
-        //   sub_total       = $('#set_total_price').text();
-        //   name            = $(this).data('name');
-        //   price           = $(this).data('price');
-        //   // qty             = $('#set_change_qty').val();
-        //   qty             = document.getElementById("set_count").value;
-        //   total           = qty*price;
-        //   var total_price = +sub_total - +total;
-        //   $(this).removeClass('selected-instance');
-        //   $(".options-list").empty();
-        //   $(this).removeAttr('data-options');
-        //   $('#instance_option').text('')
-        // }else {
-          if (setCount.length+1 <= max_qty) {
-            sub_total       = $('#set_total_price').text();
-            name            = $(this).data('name');
-            price           = $(this).data('price');
-            options         = $(this).attr('data-options','[]');
-            // qty             = $('#set_change_qty').val();
-            qty             = document.getElementById("set_count").value;
-            total           = qty*price;
-            var total_price = +sub_total + +total;
-            $(this).addClass('selected-instance');
-
-            set = "<div class='selected-set card custom-card' style='margin-bottom:10px !important'"
-                            +"' data-name='"+$(this).data('name')
-                            +"' data-code='"+code
-                            +"' data-price='"+$(this).data('price')
-                            +"' data-option='[]"
-                            +"' data-options='"+JSON.stringify($(this).data('options'))
-                            +"' data-min-qty='"+$(this).data('min-qty')
-                            +"' data-max-qty='"+$(this).data('max-qty')
-                            +"' data-parent-code='"+$(this).data('parent-code')
-                            +"' data-parent-id='"+$(this).data('parent-id')
-                            +"' data-sub-item='true"
-                            +"'>"
-
-                          +'<div class="card-block" style="background-color:#54A5AF;">'
-                          +' <button type="button" class="close" id="remove_set" style="font-size: 20px;">&times;</button>'
-                             +'<span style="color:#fff">'+$(this).data('name')+'</span>'
-                          +'</div>'
-                          +'<div class="card-block custom-card-block">'
-
-                            +' <small style="float:" id="instance_option"></small>'
-                          +'</div>'
-                          // +'<div class="card-footer custom-card-footer">'
-                          //    +' <span>'+$(this).data('price')+'</span>'
-                          //    // +' <small style="float:right" id="instance_option"></small>'
-                          // +'</div>'
-                        +'</div>'
-              $(".selected-set-list").append(set);
-          }else{
-             swal("Alert !", 'Maximum Select is  ' + max_qty + "  items", "warning");
-          }
-        // }
-        $('#set_unit_price').text(price);
-        $('#set_total_price').text(total_price);
+    }
+    // if($(this).hasClass('selected-instance') == true){
+    //   sub_total       = $('#set_total_price').text();
+    //   name            = $(this).data('name');
+    //   price           = $(this).data('price');
+    //   // qty             = $('#set_change_qty').val();
+    //   qty             = document.getElementById("set_count").value;
+    //   total           = qty*price;
+    //   var total_price = +sub_total - +total;
+    //   $(this).removeClass('selected-instance');
+    //   $(".options-list").empty();
+    //   $(this).removeAttr('data-options');
+    //   $('#instance_option').text('')
+    // }else {
+    if (setCount.length + 1 <= max_qty) {
+      sub_total = $("#set_total_price").text();
+      name = $(this).data("name");
+      price = $(this).data("price");
+      options = $(this).attr("data-options", "[]");
+      // qty             = $('#set_change_qty').val();
+      qty = document.getElementById("set_count").value;
+      total = qty * price;
+      var total_price = +sub_total + +total;
+      $(this).addClass("selected-instance");
 
+      set =
+        "<div class='selected-set card custom-card' style='margin-bottom:10px !important'" +
+        "' data-name='" +
+        $(this).data("name") +
+        "' data-code='" +
+        code +
+        "' data-price='" +
+        $(this).data("price") +
+        "' data-option='[]" +
+        "' data-options='" +
+        JSON.stringify($(this).data("options")) +
+        "' data-min-qty='" +
+        $(this).data("min-qty") +
+        "' data-max-qty='" +
+        $(this).data("max-qty") +
+        "' data-parent-code='" +
+        $(this).data("parent-code") +
+        "' data-parent-id='" +
+        $(this).data("parent-id") +
+        "' data-sub-item='true" +
+        "'>" +
+        '<div class="card-block" style="background-color:#54A5AF;">' +
+        ' <button type="button" class="close" id="remove_set" style="font-size: 20px;">&times;</button>' +
+        '<span style="color:#fff">' +
+        $(this).data("name") +
+        "</span>" +
+        "</div>" +
+        '<div class="card-block custom-card-block">' +
+        ' <small style="float:" id="instance_option"></small>' +
+        "</div>" +
+        // +'<div class="card-footer custom-card-footer">'
+        //    +' <span>'+$(this).data('price')+'</span>'
+        //    // +' <small style="float:right" id="instance_option"></small>'
+        // +'</div>'
+        "</div>";
+      $(".selected-set-list").append(set);
+    } else {
+      swal("Alert !", "Maximum Select is  " + max_qty + "  items", "warning");
+    }
+    // }
+    $("#set_unit_price").text(price);
+    $("#set_total_price").text(total_price);
   }); //End selecct attribute buttom
 
   // click add order
-  $(document).on('click', '#remove_set', function(event){
-    code = $(this).parent().parent('.selected-set').attr('data-code');
-     instance    = $(".selected-instance");
-       $(instance).each(function(i){
-         if ($(instance[i]).attr('data-code')==code){
-           $(instance[i]).removeClass("selected-instance")
-        }
-       });
-       $(this).parent().parent('.selected-set').remove();
+  $(document).on("click", "#remove_set", function (event) {
+    code = $(this).parent().parent(".selected-set").attr("data-code");
+    instance = $(".selected-instance");
+    $(instance).each(function (i) {
+      if ($(instance[i]).attr("data-code") == code) {
+        $(instance[i]).removeClass("selected-instance");
+      }
+    });
+    $(this).parent().parent(".selected-set").remove();
   });
 
   // click add order
-  $(document).on('click', '.set_order', function(event){
-    total_price   = $('#set_total_price').text();
-    qty           = parseInt($('#set_count').val());
-    item_code     = $('#set_item_code').text();
-    item_name     = $('#set_name').text();
-    min_qty       = $(this).data('min-qty');
+  $(document).on("click", ".set_order", function (event) {
+    total_price = $("#set_total_price").text();
+    qty = parseInt($("#set_count").val());
+    item_code = $("#set_item_code").text();
+    item_name = $("#set_name").text();
+    min_qty = $(this).data("min-qty");
 
-    default_instance = $('.set-item');
+    default_instance = $(".set-item");
 
-    var items  = $('.selected-set');
+    var items = $(".selected-set");
     if (items.length >= min_qty) {
-     if ($('#server_mode').val() != "cloud" && second_display_lookup == 2) {
-      item = get_set_item(items);
-      customer_display_view(item,"set_add");
-     }
-      var option = []
-      attribute_arr = []
+      if ($("#server_mode").val() != "cloud" && second_display_lookup == 2) {
+        item = get_set_item(items);
+        customer_display_view(item, "set_add");
+      }
+      var option = [];
+      attribute_arr = [];
 
-      var rowCount = $('.summary-items tbody tr').length+1;
-        code          = $('.set-item').attr('data-code');
-        name          = $('.set-item').attr('data-name');
-        price         = $('.set-item').attr('data-price');
-        option_name   = ($('.set-item').attr('data-options') === 'undefined') ? ' ' :$('.set-item').attr('data-options');
-        option        = ($('.set-item').attr('data-options') === '') ? '[]' :$('.set-item').attr('data-options');
-        parent        = $('.set-item').attr('data-parent');
-        total         = qty * price ;
-        row ="<tr class='item_box' data-price ='"
-              +price+ "' data-toggle='modal' data-target='#sx_itemModal' data-instance ='"
-              +name+ "' data-code='"+item_code+"' data-instance-code='"
-              +code+"' data-attributes='"
-              +attribute_arr+"' data-options ='"
-              +option+"' data-row ='"+rowCount+ "' data-parent ='"+parent+ "'>"
-          +'<td class="item-cell-no">'+rowCount+'</td>'
-          +'<td class="item-cell-name" id="item_name" >' + item_name+ ' ' + name +' ' + option_name +'</td>'
-          +'<td class="item-cell-qty" id="item_qty">' + qty + '</td>'
-          +'<td class="item-cell-price" id="item_price">'
-          + parseFloat(total).toFixed(2)
-          +'</td>'
-          +'</tr>';
-          $(".summary-items tbody").append(row);
-      var rowCount = $('.summary-items tbody tr').length+1;
-      var set_option = []
-      $(items).each(function(i){
-        code              = $(items[i]).attr('data-code');
-        name              = $(items[i]).attr('data-name');
-        price             = $(items[i]).attr('data-price');
-        set_option_name   = ($(items[i]).attr('data-options') === 'undefined') ? '' :$(items[i]).attr('data-options');
-        set_option        = ($(items[i]).attr('data-options') === 'undefined') ? '[]' :$(items[i]).attr('data-options');
-        sub_item          = $(items[i]).attr('data-sub-item');
-        total             = qty * price ;
+      var rowCount = $(".summary-items tbody tr").length + 1;
+      code = $(".set-item").attr("data-code");
+      name = $(".set-item").attr("data-name");
+      price = $(".set-item").attr("data-price");
+      option_name =
+        $(".set-item").attr("data-options") === "undefined"
+          ? " "
+          : $(".set-item").attr("data-options");
+      option =
+        $(".set-item").attr("data-options") === ""
+          ? "[]"
+          : $(".set-item").attr("data-options");
+      parent = $(".set-item").attr("data-parent");
+      total = qty * price;
+      row =
+        "<tr class='item_box' data-price ='" +
+        price +
+        "' data-toggle='modal' data-target='#sx_itemModal' data-instance ='" +
+        name +
+        "' data-code='" +
+        item_code +
+        "' data-instance-code='" +
+        code +
+        "' data-attributes='" +
+        attribute_arr +
+        "' data-options ='" +
+        option +
+        "' data-row ='" +
+        rowCount +
+        "' data-parent ='" +
+        parent +
+        "'>" +
+        '<td class="item-cell-no">' +
+        rowCount +
+        "</td>" +
+        '<td class="item-cell-name" id="item_name" >' +
+        item_name +
+        " " +
+        name +
+        " " +
+        option_name +
+        "</td>" +
+        '<td class="item-cell-qty" id="item_qty">' +
+        qty +
+        "</td>" +
+        '<td class="item-cell-price" id="item_price">' +
+        parseFloat(total).toFixed(2) +
+        "</td>" +
+        "</tr>";
+      $(".summary-items tbody").append(row);
+      var rowCount = $(".summary-items tbody tr").length + 1;
+      var set_option = [];
+      $(items).each(function (i) {
+        code = $(items[i]).attr("data-code");
+        name = $(items[i]).attr("data-name");
+        price = $(items[i]).attr("data-price");
+        set_option_name =
+          $(items[i]).attr("data-options") === "undefined"
+            ? ""
+            : $(items[i]).attr("data-options");
+        set_option =
+          $(items[i]).attr("data-options") === "undefined"
+            ? "[]"
+            : $(items[i]).attr("data-options");
+        sub_item = $(items[i]).attr("data-sub-item");
+        total = qty * price;
 
-        row ="<tr class='item_box' data-price ='"
-              +price+ "' data-toggle='modal' data-target='#sx_itemModal' data-instance ='"
-              +name+ "' data-code='"+item_code+"' data-instance-code='"
-              +code+"' data-attributes='"
-              +attribute_arr+"' data-options ='"
-              +set_option+"' data-row ='"+rowCount+ "' data-sub-item ='"+sub_item+ "'>"
-          +'<td class="item-cell-no">'+rowCount+'</td>'
-          +'<td class="item-cell-name" id="item_name" >' + item_name+ ' ' + name +' ' + set_option_name +'</td>'
-          +'<td class="item-cell-qty" id="item_qty">' + qty + '</td>'
-          +'<td class="item-cell-price" id="item_price">'
-          + parseFloat(total).toFixed(2)
-          +'</td>'
-          +'</tr>';
-          $(".summary-items tbody").append(row);
+        row =
+          "<tr class='item_box' data-price ='" +
+          price +
+          "' data-toggle='modal' data-target='#sx_itemModal' data-instance ='" +
+          name +
+          "' data-code='" +
+          item_code +
+          "' data-instance-code='" +
+          code +
+          "' data-attributes='" +
+          attribute_arr +
+          "' data-options ='" +
+          set_option +
+          "' data-row ='" +
+          rowCount +
+          "' data-sub-item ='" +
+          sub_item +
+          "'>" +
+          '<td class="item-cell-no">' +
+          rowCount +
+          "</td>" +
+          '<td class="item-cell-name" id="item_name" >' +
+          item_name +
+          " " +
+          name +
+          " " +
+          set_option_name +
+          "</td>" +
+          '<td class="item-cell-qty" id="item_qty">' +
+          qty +
+          "</td>" +
+          '<td class="item-cell-price" id="item_price">' +
+          parseFloat(total).toFixed(2) +
+          "</td>" +
+          "</tr>";
+        $(".summary-items tbody").append(row);
         rowCount = rowCount + 1;
       });
 
       calculate_sub_total();
-      $(".sx_item_set_detailModal").css({ 'display': "none" });
-    }else{
-      $(".sx_item_set_detailModal").css({ 'display': "block" });
-      swal("Alert !", 'Please Select Minimum ' + min_qty + " items", "warning");
-     //  $.alert({
-     //     title: 'Alert!',
-     //     content: 'Please Select Minimum ' + min_qty + " items",
-     //     type: 'red',
-     //     typeAnimated: true,
-     //     btnClass: 'btn-danger',
-     // });
+      $(".sx_item_set_detailModal").css({ display: "none" });
+    } else {
+      $(".sx_item_set_detailModal").css({ display: "block" });
+      swal("Alert !", "Please Select Minimum " + min_qty + " items", "warning");
+      //  $.alert({
+      //     title: 'Alert!',
+      //     content: 'Please Select Minimum ' + min_qty + " items",
+      //     type: 'red',
+      //     typeAnimated: true,
+      //     btnClass: 'btn-danger',
+      // });
     }
-
   }); //End add order  Click
 
   //click item row for add order
-  $(document).on('click', '.menu_item_box', function(event){
-    attributes         = $(this).data('id');
-    selected_item      = $(this).data('item');
-    instances          = $(this).data('instance');
-    item_options       = $(this).data('option');
-    data =  $(this).parent().siblings('.add_icon');
-
-    show_attribute_selection_modal(attributes, selected_item, instances, item_options, data)
+  $(document).on("click", ".menu_item_box", function (event) {
+    attributes = $(this).data("id");
+    selected_item = $(this).data("item");
+    instances = $(this).data("instance");
+    item_options = $(this).data("option");
+    data = $(this).parent().siblings(".add_icon");
 
+    show_attribute_selection_modal(
+      attributes,
+      selected_item,
+      instances,
+      item_options,
+      data,
+    );
   });
 
   // click plus icon for add
-  $(document).on('click', '.add_icon', function(event){
-
-    if (window.location.pathname.includes('out_of_stock') == false) {
-
-      if($(this).hasClass('product_item')) {
-        $('.sx_item_detailModal').modal('hide');
+  $(document).on("click", ".add_icon", function (event) {
+    if (window.location.pathname.includes("out_of_stock") == false) {
+      if ($(this).hasClass("product_item")) {
+        $(".sx_item_detailModal").modal("hide");
 
         var item_data = $(this);
-        code = $(this).data('instance-code');
+        code = $(this).data("instance-code");
 
-        if ($('#server_mode').val() != "cloud" && second_display_lookup == 2) {
-          item = get_item(item_data,"add_icon");
-          customer_display_view(item,"add");
+        if ($("#server_mode").val() != "cloud" && second_display_lookup == 2) {
+          item = get_item(item_data, "add_icon");
+          customer_display_view(item, "add");
         }
-        show_item_detail(item_data,"add_icon");
+        show_item_detail(item_data, "add_icon");
         calculate_sub_total();
-        autoScrollToItem(code)
+        autoScrollToItem(code);
 
-        return
+        return;
       }
 
-      if ($(this).data('instances').length == 1) {
+      if ($(this).data("instances").length == 1) {
+        $(".sx_item_detailModal").modal("hide");
 
-        $('.sx_item_detailModal').modal('hide');
-
-        if ($(this).data('instances')[0].out_of_stock == false ) {
+        if ($(this).data("instances")[0].out_of_stock == false) {
           var item_data = $(this);
-          code = $(this).data('instance-code');
+          code = $(this).data("instance-code");
 
-          if ($('#server_mode').val() != "cloud" && second_display_lookup == 2) {
-            item = get_item(item_data,"add_icon");
-            customer_display_view(item,"add");
+          if (
+            $("#server_mode").val() != "cloud" &&
+            second_display_lookup == 2
+          ) {
+            item = get_item(item_data, "add_icon");
+            customer_display_view(item, "add");
           }
-          show_item_detail(item_data,"add_icon");
+          show_item_detail(item_data, "add_icon");
           calculate_sub_total();
-          autoScrollToItem(code)
-
+          autoScrollToItem(code);
         }
-        return
-
+        return;
       } else {
-        count = 0
-        for (var i in $(this).data('instances')) {
-          if(!$(this).data('instances')[i].out_of_stock) {
+        count = 0;
+        for (var i in $(this).data("instances")) {
+          if (!$(this).data("instances")[i].out_of_stock) {
             count += 1;
           }
         }
 
         if (count === 1) {
-          $('.sx_item_detailModal').modal('hide');
+          $(".sx_item_detailModal").modal("hide");
 
           var item_data = $(this);
-          code = $(this).data('instance-code');
+          code = $(this).data("instance-code");
 
-          if ($('#server_mode').val() != "cloud" && second_display_lookup == 2) {
-            item = get_item(item_data,"add_icon");
-            customer_display_view(item,"add");
+          if (
+            $("#server_mode").val() != "cloud" &&
+            second_display_lookup == 2
+          ) {
+            item = get_item(item_data, "add_icon");
+            customer_display_view(item, "add");
           }
-          show_item_detail(item_data,"add_icon");
+          show_item_detail(item_data, "add_icon");
           calculate_sub_total();
-          autoScrollToItem(code)
-          return
+          autoScrollToItem(code);
+          return;
         }
 
-        attributes         = $(this).data('id');
-        selected_item      = $(this).data('attributes');
-        instances          = $(this).data('instances');
-        item_options       = $(this).data('options');
-        data               = $(this)
+        attributes = $(this).data("id");
+        selected_item = $(this).data("attributes");
+        instances = $(this).data("instances");
+        item_options = $(this).data("options");
+        data = $(this);
 
-        show_attribute_selection_modal(attributes, selected_item, instances, item_options, data)
+        show_attribute_selection_modal(
+          attributes,
+          selected_item,
+          instances,
+          item_options,
+          data,
+        );
       }
     }
   }); //End Add Icon Click
 
-  function show_attribute_selection_modal(attributes, selected_item, instances, item_options, data) {
-    $('.attributes-list').empty();
-    $('.options-list').empty();
-    $('#modal_box_img').empty();
-    $('.attr-alert').addClass('hide');
-    $('.add_to_order').removeAttr('data-instance-code');
-    $('.add_to_order').removeAttr('data-instance');
-    $('.add_to_order').removeAttr('data-price');
-    $('.add_to_order').removeAttr('data-promotion-price');
-    $('.add_to_order').removeAttr('data-item-code');
-    $('.add_to_order').removeAttr('data-qty');
-    $('.add_to_order').removeAttr('data-name');
-    $('.add_to_order').removeAttr('data-attributes');
-    $('.add_to_order').removeAttr('data-options');
-    $('.add_to_order').removeAttr('disabled');
-    $('#minus').removeAttr('disabled');
-    $('#plus').removeAttr('disabled');
-    $('#count').removeAttr('readonly');
-    $('#wanring_text').text('');
-    $('#total_price').text(0.0);
+  function show_attribute_selection_modal(
+    attributes,
+    selected_item,
+    instances,
+    item_options,
+    data,
+  ) {
+    $(".attributes-list").empty();
+    $(".options-list").empty();
+    $("#modal_box_img").empty();
+    $(".attr-alert").addClass("hide");
+    $(".add_to_order").removeAttr("data-instance-code");
+    $(".add_to_order").removeAttr("data-instance");
+    $(".add_to_order").removeAttr("data-price");
+    $(".add_to_order").removeAttr("data-promotion-price");
+    $(".add_to_order").removeAttr("data-item-code");
+    $(".add_to_order").removeAttr("data-qty");
+    $(".add_to_order").removeAttr("data-name");
+    $(".add_to_order").removeAttr("data-attributes");
+    $(".add_to_order").removeAttr("data-options");
+    $(".add_to_order").removeAttr("disabled");
+    $("#minus").removeAttr("disabled");
+    $("#plus").removeAttr("disabled");
+    $("#count").removeAttr("readonly");
+    $("#wanring_text").text("");
+    $("#total_price").text(0.0);
 
-    $('#count').val(1);
-    change_qty_plus_minus("count","plus","minus");
+    $("#count").val(1);
+    change_qty_plus_minus("count", "plus", "minus");
 
-    if (data.attr('data-image')) {
+    if (data.attr("data-image")) {
       if (modify_order) {
-        image = "<img id='' width='200px' src='../../"+data.attr('data-image')+"'>";
-      }else{
-        image = "<img id='' width='200px' src='"+data.attr('data-image')+"'>";
+        image =
+          "<img id='' width='200px' src='../../" +
+          data.attr("data-image") +
+          "'>";
+      } else {
+        image =
+          "<img id='' width='200px' src='" + data.attr("data-image") + "'>";
       }
-
-    }else{
+    } else {
       if (modify_order) {
         image = "<img id='' width='200px' src='../../image/logo.png'>";
-      }else{
+      } else {
         image = "<img id='' width='200px' src='/image/logo.png'>";
       }
-
     }
 
-    $('#modal_box_img').append(image);
+    $("#modal_box_img").append(image);
 
-    instance_attributes = []
-    oos_values = ''
-    total_price = 0
+    instance_attributes = [];
+    oos_values = "";
+    total_price = 0;
 
-    for(var field in instances) {
+    for (var field in instances) {
       if (instances[field].out_of_stock) {
         oos_values = instances[field].values;
-        $('#add_to_order').attr('disabled', true);
-        $('#minus').attr('disabled', true);
-        $('#plus').attr('disabled', true);
-        $('#count').attr('readonly', true)
+        $("#add_to_order").attr("disabled", true);
+        $("#minus").attr("disabled", true);
+        $("#plus").attr("disabled", true);
+        $("#count").attr("readonly", true);
       } else {
-        $('.add_to_order').removeAttr('disabled');
-        $('#minus').removeAttr('disabled');
-        $('#plus').removeAttr('disabled');
-        $('#count').removeAttr('readonly');
+        $(".add_to_order").removeAttr("disabled");
+        $("#minus").removeAttr("disabled");
+        $("#plus").removeAttr("disabled");
+        $("#count").removeAttr("readonly");
       }
 
       value = instances[field].values;
-      $(value).each(function(i){
-         options = value[i];
-         instance_attributes.push(options);
+      $(value).each(function (i) {
+        options = value[i];
+        instance_attributes.push(options);
       });
     }
 
-    selected_item = selected_item.sort()
+    selected_item = selected_item.sort();
 
-    if(oos_values) {
-      oos_values = oos_values.sort()
+    if (oos_values) {
+      oos_values = oos_values.sort();
     }
 
-    if (attributes.length === 0) { // for product_box
-      total_price = data.attr('data-price');
+    if (attributes.length === 0) {
+      // for product_box
+      total_price = data.attr("data-price");
     }
 
-    for(var field in attributes) {
+    for (var field in attributes) {
       value = attributes[field]["values"];
-      type  = attributes[field]["type"];
-      row = "<h5>"+attributes[field]["type"]+"</h5>";
+      type = attributes[field]["type"];
+      row = "<h5>" + attributes[field]["type"] + "</h5>";
 
-      $(value).each(function(i){
+      $(value).each(function (i) {
         disabled = "false";
-        status ="";
+        status = "";
 
-        if(parseInt(jQuery.inArray(value[i], selected_item)) !== -1){
-          if(JSON.stringify(oos_values) != JSON.stringify(selected_item)) {
+        if (parseInt(jQuery.inArray(value[i], selected_item)) !== -1) {
+          if (JSON.stringify(oos_values) != JSON.stringify(selected_item)) {
             status = "selected-attribute";
-            total_price = data.attr('data-price')
+            total_price = data.attr("data-price");
           }
         }
 
-        if(parseInt(jQuery.inArray(value[i], instance_attributes)) == -1){
-         // disabled = "disabled";
+        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 +" '"
-        + "data-attributes = '"+ JSON.stringify(attributes) +"'"
-        + disabled +" >"
-        +value[i]
-        +"</button>";
+        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 +
+          " '" +
+          "data-attributes = '" +
+          JSON.stringify(attributes) +
+          "'" +
+          disabled +
+          " >" +
+          value[i] +
+          "</button>";
       });
 
       $(".attributes-list").append(row);
     }
 
-    for(var field in item_options) {
+    for (var field in item_options) {
       value = item_options[field]["values"];
-      type  = item_options[field]["type"];
-      row = "<h4>"+type+"</h4>"
-      $(value).each(function(i){
-        row +="<button class='btn btn- waves-effect check_option_btn "+ type +"' data-type='"
-        +type+"' data-value='"+value[i]+"' data-group='simple_menu'>"+value[i]+"</button>";
+      type = item_options[field]["type"];
+      row = "<h4>" + type + "</h4>";
+      $(value).each(function (i) {
+        row +=
+          "<button class='btn btn- waves-effect check_option_btn " +
+          type +
+          "' data-type='" +
+          type +
+          "' data-value='" +
+          value[i] +
+          "' data-group='simple_menu'>" +
+          value[i] +
+          "</button>";
       });
       $(".options-list").append(row);
     }
 
-   // $('#count').val(1);
-    $('#item_instances').text(instances);
-    $('#title_name').text(data.attr('data-name'));
-    $('#item_code').text(data.attr('data-item-code'));
-    $('#instance_name').text(data.attr('data-instance'));
-    $('#instance_code').text(data.attr('data-instance-code'));
-    $('#promotion_price').text(data.attr('data-promotion-price'));
-    $('#total_price').text(total_price);
-    $('#unit_price').text(data.attr('data-price'));
+    // $('#count').val(1);
+    $("#item_instances").text(instances);
+    $("#title_name").text(data.attr("data-name"));
+    $("#item_code").text(data.attr("data-item-code"));
+    $("#instance_name").text(data.attr("data-instance"));
+    $("#instance_code").text(data.attr("data-instance-code"));
+    $("#promotion_price").text(data.attr("data-promotion-price"));
+    $("#total_price").text(total_price);
+    $("#unit_price").text(data.attr("data-price"));
   }
 
   // click select option icon for add
-  $(document).on('click', '.attribute_btn', function(event){
-
-    $('.attributes-list button').removeClass('bg-gray box-shadow-none');
+  $(document).on("click", ".attribute_btn", function (event) {
+    $(".attributes-list button").removeClass("bg-gray box-shadow-none");
 
     // $('.change_qty').val(1);
-    value      = $(this).data('value');
-    type       = $(this).data('type');
-    instances  = $(this).data('instances');
-    item_attributes = $(this).data('attributes');
+    value = $(this).data("value");
+    type = $(this).data("type");
+    instances = $(this).data("instances");
+    item_attributes = $(this).data("attributes");
 
     attributes = $(".attribute_btn");
-    $(attributes).each(function(i){
-      if ($(attributes[i]).attr('data-type')==type){
-        $('.'+type).removeClass("selected-attribute");
+    $(attributes).each(function (i) {
+      if ($(attributes[i]).attr("data-type") == type) {
+        $("." + type).removeClass("selected-attribute");
       }
     });
-    $(this).addClass('selected-attribute');
+    $(this).addClass("selected-attribute");
 
-    var selected_attr = get_selected_attributes('selected-attribute');
+    var selected_attr = get_selected_attributes("selected-attribute");
 
-    qty = $('.change_qty').val();
+    qty = $(".change_qty").val();
 
-    if($('#total_price').text() > 0) {
-      $('#add_to_order').removeAttr('disabled')
-      $('#total_price').text(0.0)
+    if ($("#total_price").text() > 0) {
+      $("#add_to_order").removeAttr("disabled");
+      $("#total_price").text(0.0);
     }
 
     var equal = false;
-    for(var field in instances) {
+    for (var field in instances) {
       item_attr = instances[field].values;
-      item_attr = item_attr.sort()
-      selected_attr = selected_attr.sort()
-      if(JSON.stringify(item_attr) == JSON.stringify(selected_attr)){
+      item_attr = item_attr.sort();
+      selected_attr = selected_attr.sort();
+      if (JSON.stringify(item_attr) == JSON.stringify(selected_attr)) {
         if (instances[field].out_of_stock) {
           total_price = instances[field].price;
-          $('#total_price').text(total_price);
-          $('#wanring_text').text('')
-          $('#wanring_text').append('<strong>Out of stock</strong>')
-          $('#add_to_order').attr('disabled', true)
-          $('#minus').attr('disabled', true);
-          $('#plus').attr('disabled', true);
-          $('#count').attr('readonly', true)
-          return
+          $("#total_price").text(total_price);
+          $("#wanring_text").text("");
+          $("#wanring_text").append("<strong>Out of stock</strong>");
+          $("#add_to_order").attr("disabled", true);
+          $("#minus").attr("disabled", true);
+          $("#plus").attr("disabled", true);
+          $("#count").attr("readonly", true);
+          return;
         } else {
-          equal = true
-          unit_price = instances[field].price ;
-          total_price = qty * unit_price ;
-          $('#instance_name').text(instances[field].name);
-          $('#instance_code').text(instances[field].code);
-          $('#promotion_price').text(instances[field].promotion_price);
-          $('#total_price').text(total_price);
-          $('#unit_price').text(unit_price);
+          equal = true;
+          unit_price = instances[field].price;
+          total_price = qty * unit_price;
+          $("#instance_name").text(instances[field].name);
+          $("#instance_code").text(instances[field].code);
+          $("#promotion_price").text(instances[field].promotion_price);
+          $("#total_price").text(total_price);
+          $("#unit_price").text(unit_price);
         }
       }
     }
 
     if (equal) {
-      $('#wanring_text').text('');
-      $('#add_to_order').removeAttr('disabled');
-      $('#minus').removeAttr('disabled');
-      $('#plus').removeAttr('disabled');
-      $('#count').removeAttr('readonly')
+      $("#wanring_text").text("");
+      $("#add_to_order").removeAttr("disabled");
+      $("#minus").removeAttr("disabled");
+      $("#plus").removeAttr("disabled");
+      $("#count").removeAttr("readonly");
     } else {
-      $('#wanring_text').text('')
-      $('#wanring_text').append('<strong>Not available</strong>')
-      $('#add_to_order').attr('disabled', true)
-      $('#minus').attr('disabled', true);
-      $('#plus').attr('disabled', true);
-      $('#count').attr('readonly', true)
+      $("#wanring_text").text("");
+      $("#wanring_text").append("<strong>Not available</strong>");
+      $("#add_to_order").attr("disabled", true);
+      $("#minus").attr("disabled", true);
+      $("#plus").attr("disabled", true);
+      $("#count").attr("readonly", true);
     }
-
   }); //End selecct attribute buttom
 
   // click select option icon for add
-  $(document).on('click', '.option_btn', function(event){
-    active =$(this).hasClass('selected-option');
-    value      = $(this).data('value');
-    type       = $(this).data('type');
-    group      = $(this).data('group');
-    options    = $(".option_btn");
-    $(options).each(function(i){
-      if ($(options[i]).attr('data-type')==type){
-        $('.'+type).removeClass("selected-option");
+  $(document).on("click", ".option_btn", function (event) {
+    active = $(this).hasClass("selected-option");
+    value = $(this).data("value");
+    type = $(this).data("type");
+    group = $(this).data("group");
+    options = $(".option_btn");
+    $(options).each(function (i) {
+      if ($(options[i]).attr("data-type") == type) {
+        $("." + type).removeClass("selected-option");
       }
     });
     if (active) {
-      $(this).removeClass('selected-option');
-    }else{
-      $(this).addClass('selected-option');
+      $(this).removeClass("selected-option");
+    } else {
+      $(this).addClass("selected-option");
     }
 
-
-    if(group == "set_menu"){
-      option_arr    = get_selected_attributes('selected-option');
-          $(".selected-set:last").attr('data-options',JSON.stringify(option_arr));
-          $(".selected-set:last").children().children('#instance_option').text(option_arr);
+    if (group == "set_menu") {
+      option_arr = get_selected_attributes("selected-option");
+      $(".selected-set:last").attr("data-options", JSON.stringify(option_arr));
+      $(".selected-set:last")
+        .children()
+        .children("#instance_option")
+        .text(option_arr);
       // instance    = $(".selected-instance");
       // $(instance).each(function(i){
       //   if ($(instance[i]).attr('data-code')==code){
-          // option_arr    = get_selected_attributes('selected-option');
-          // $(instance[i]).attr('data-options',JSON.stringify(option_arr));
-          // $(instance[i]).children().children('#instance_option').text(option_arr);
+      // option_arr    = get_selected_attributes('selected-option');
+      // $(instance[i]).attr('data-options',JSON.stringify(option_arr));
+      // $(instance[i]).children().children('#instance_option').text(option_arr);
       //   }
       // });
     }
 
-    if(group == "set_menu_default"){
-          option_arr    = get_selected_attributes('selected-option');
-          $('.set-item').attr('data-options',JSON.stringify(option_arr));
-          $('.set_default_option').text(option_arr);
+    if (group == "set_menu_default") {
+      option_arr = get_selected_attributes("selected-option");
+      $(".set-item").attr("data-options", JSON.stringify(option_arr));
+      $(".set_default_option").text(option_arr);
     }
-
   }); //End selecct attribute buttom
-   // click select option icon for add
-  $(document).on('click', '.check_option_btn', function(event){
-    active =$(this).hasClass('selected-option');
-    value      = $(this).data('value');
-    type       = $(this).data('type');
-    group      = $(this).data('group');
+  // click select option icon for add
+  $(document).on("click", ".check_option_btn", function (event) {
+    active = $(this).hasClass("selected-option");
+    value = $(this).data("value");
+    type = $(this).data("type");
+    group = $(this).data("group");
     if (active) {
-      $(this).removeClass('selected-option');
-    }else{
-      $(this).addClass('selected-option');
+      $(this).removeClass("selected-option");
+    } else {
+      $(this).addClass("selected-option");
     }
-    if(group == "set_menu"){
-      option_arr    = get_selected_attributes('selected-option');
-          $(".selected-set:last").attr('data-options',JSON.stringify(option_arr));
-          $(".selected-set:last").children().children('#instance_option').text(option_arr);
+    if (group == "set_menu") {
+      option_arr = get_selected_attributes("selected-option");
+      $(".selected-set:last").attr("data-options", JSON.stringify(option_arr));
+      $(".selected-set:last")
+        .children()
+        .children("#instance_option")
+        .text(option_arr);
       // instance    = $(".selected-instance");
       // $(instance).each(function(i){
       //   if ($(instance[i]).attr('data-code')==code){
-          // option_arr    = get_selected_attributes('selected-option');
-          // $(instance[i]).attr('data-options',JSON.stringify(option_arr));
-          // $(instance[i]).children().children('#instance_option').text(option_arr);
+      // option_arr    = get_selected_attributes('selected-option');
+      // $(instance[i]).attr('data-options',JSON.stringify(option_arr));
+      // $(instance[i]).children().children('#instance_option').text(option_arr);
       //   }
       // });
     }
 
-    if(group == "set_menu_default"){
-          option_arr    = get_selected_attributes('selected-option');
-          $('.set-item').attr('data-options',JSON.stringify(option_arr));
-          $('.set_default_option').text(option_arr);
+    if (group == "set_menu_default") {
+      option_arr = get_selected_attributes("selected-option");
+      $(".set-item").attr("data-options", JSON.stringify(option_arr));
+      $(".set_default_option").text(option_arr);
     }
-
   }); //End selecct attribute buttom
   // click add order
-  $(document).on('click', '.add_to_order', function(event){
-    total_price   = $('#total_price').text();
-    qty           = parseInt($('#count').val());
+  $(document).on("click", ".add_to_order", function (event) {
+    total_price = $("#total_price").text();
+    qty = parseInt($("#count").val());
 
-    var item_row  = $('.selected-attribute');
+    var item_row = $(".selected-attribute");
 
-    attribute_arr = get_selected_attributes('selected-attribute');
-    option_arr    = get_selected_attributes('selected-option');
-    if (item_row.length>0) {
-      var instances = jQuery.parseJSON(item_row.attr('data-instances'));
-
-      for(var field in instances) {
+    attribute_arr = get_selected_attributes("selected-attribute");
+    option_arr = get_selected_attributes("selected-option");
+    if (item_row.length > 0) {
+      var instances = jQuery.parseJSON(item_row.attr("data-instances"));
 
+      for (var field in instances) {
         attrbu = JSON.stringify(attribute_arr);
         instan = JSON.stringify(instances[field].values);
         var newarr = new Set(instan);
 
         result = false;
-        for(var i in attrbu) {
-            if (newarr.has(attrbu[i])) {
-              result = true;
-              break;
-            }
-
+        for (var i in attrbu) {
+          if (newarr.has(attrbu[i])) {
+            result = true;
+            break;
+          }
         }
-        attribute_arr = attribute_arr.sort()
-        instance_arr = instances[field].values.sort()
+        attribute_arr = attribute_arr.sort();
+        instance_arr = instances[field].values.sort();
         if (JSON.stringify(attribute_arr) === JSON.stringify(instance_arr)) {
-          $('.add_to_order').attr('data-instance-code',instances[field].code);
-          $('.add_to_order').attr('data-instance',instances[field].name);
-          $('.add_to_order').attr('data-price',instances[field].price);
-          $('.add_to_order').attr('data-promotion-price',instances[field].promotion_price);
+          $(".add_to_order").attr("data-instance-code", instances[field].code);
+          $(".add_to_order").attr("data-instance", instances[field].name);
+          $(".add_to_order").attr("data-price", instances[field].price);
+          $(".add_to_order").attr(
+            "data-promotion-price",
+            instances[field].promotion_price,
+          );
         }
       }
-    }else{
-      $('.add_to_order').attr('data-instance-code',$('#instance_code').text());
-      $('.add_to_order').attr('data-instance',$('#instance_name').text());
-      $('.add_to_order').attr('data-price',$('#unit_price').text());
-      $('.add_to_order').attr('data-promotion-price',$('#promotion_price').text());
+    } else {
+      $(".add_to_order").attr("data-instance-code", $("#instance_code").text());
+      $(".add_to_order").attr("data-instance", $("#instance_name").text());
+      $(".add_to_order").attr("data-price", $("#unit_price").text());
+      $(".add_to_order").attr(
+        "data-promotion-price",
+        $("#promotion_price").text(),
+      );
     }
 
-    $('.add_to_order').attr('data-item-code',$('#item_code').text());
-    $('.add_to_order').attr('data-qty',qty);
-    $('.add_to_order').attr('data-name',$('#title_name').text());
-    $('.add_to_order').attr('data-attributes',JSON.stringify(attribute_arr));
-    $('.add_to_order').attr('data-options',JSON.stringify(option_arr));
-    $('.add_to_order').attr('data-opt',JSON.stringify(option_arr));
+    $(".add_to_order").attr("data-item-code", $("#item_code").text());
+    $(".add_to_order").attr("data-qty", qty);
+    $(".add_to_order").attr("data-name", $("#title_name").text());
+    $(".add_to_order").attr("data-attributes", JSON.stringify(attribute_arr));
+    $(".add_to_order").attr("data-options", JSON.stringify(option_arr));
+    $(".add_to_order").attr("data-opt", JSON.stringify(option_arr));
     var item_data = $(this);
-    if ($('#server_mode').val() != "cloud" && second_display_lookup == 2) {
-      item = get_item(item_data,"add_to_order");
-      customer_display_view(item,"add");
+    if ($("#server_mode").val() != "cloud" && second_display_lookup == 2) {
+      item = get_item(item_data, "add_to_order");
+      customer_display_view(item, "add");
     }
     console.log(item_data);
-    show_item_detail(item_data,"add_to_order");
+    show_item_detail(item_data, "add_to_order");
     calculate_sub_total();
-    code = $('#instance_code').text()
+    code = $("#instance_code").text();
     autoScrollToItem(code);
-
   }); //End add order  Click
 
   // scroll to element
   function autoScrollToItem(code) {
-    element = $('.summary-items').find(`[data-instance-code='${code}']`).last();
-    item_qty = element.find('#item_qty').text()
-    parent = element.parents('.card-text')
+    element = $(".summary-items").find(`[data-instance-code='${code}']`).last();
+    item_qty = element.find("#item_qty").text();
+    parent = element.parents(".card-text");
 
     if (item_qty == 1) {
       $(parent).animate({
-        scrollTop: $('.summary-items tbody tr:last').position().top - $('.summary-items tbody tr:first').position().top
-      })
+        scrollTop:
+          $(".summary-items tbody tr:last").position().top -
+          $(".summary-items tbody tr:first").position().top,
+      });
     }
 
-    $('.summary-items tbody tr').css({
-      'background-color': '',
-      'color': ''
-    })
+    $(".summary-items tbody tr").css({
+      "background-color": "",
+      color: "",
+    });
 
     element.css({
-      'background-color': '#2091F3',
-      'color': '#fff'
-    })
+      "background-color": "#2091F3",
+      color: "#fff",
+    });
 
     if (isNotInView(element, parent)) {
-      element.css({'background-color': '#2091F3'});
+      element.css({ "background-color": "#2091F3" });
       scrollToELement(element);
     }
   }
 
-  $(document.body).on('click', function() {
-    $('.summary-items tbody tr').css({
-      'background-color': '',
-      'color': ''
-    })
-  })
+  $(document.body).on("click", function () {
+    $(".summary-items tbody tr").css({
+      "background-color": "",
+      color: "",
+    });
+  });
 
-  function isNotInView(elem, parent){
+  function isNotInView(elem, parent) {
     //            for scroll up                               |                       for  scroll down
-    result = (($(elem).offset().top - 100) < $(elem).height() || $(parent).height() < (elem.position().top + elem.outerHeight(true)));
-    return result // reutn boolean
+    result =
+      $(elem).offset().top - 100 < $(elem).height() ||
+      $(parent).height() < elem.position().top + elem.outerHeight(true);
+    return result; // reutn boolean
   }
 
   function scrollToELement(elem) {
     elem[0].scrollIntoView();
   }
 
-  function show_item_detail(data,click_type){
-    testqty = parseInt($('.item_box').children('data_qty').text());
-    qty           = parseInt(data.attr('data-qty'));
-    append        = 0;
-    price         = data.attr('data-price');
+  function show_item_detail(data, click_type) {
+    testqty = parseInt($(".item_box").children("data_qty").text());
+    qty = parseInt(data.attr("data-qty"));
+    append = 0;
+    price = data.attr("data-price");
 
-    instance_name = data.attr('data-instance');
-    if (instance_name == "undefined"){
-      instance = '';
-    }else{
-      instance = "("+data.attr('data-instance')+")";
+    instance_name = data.attr("data-instance");
+    if (instance_name == "undefined") {
+      instance = "";
+    } else {
+      instance = "(" + data.attr("data-instance") + ")";
     }
-    d_option = data.attr('data-opt');
-    if (click_type != "add_icon"){
-      option_name = "-"+data.attr('data-options');
-      data_option =  data.attr('data-options')  ;
-    }else{
-      option_name = ' ';
-      data_option = '[]';
+    d_option = data.attr("data-opt");
+    if (click_type != "add_icon") {
+      option_name = "-" + data.attr("data-options");
+      data_option = data.attr("data-options");
+    } else {
+      option_name = " ";
+      data_option = "[]";
     }
-    var rowCount = $('.summary-items tbody tr').length+1;
-    var item_row = $('.summary-items tbody tr');
+    var rowCount = $(".summary-items tbody tr").length + 1;
+    var item_row = $(".summary-items tbody tr");
 
-    $(item_row).each(function(i){
-      item_code = $(item_row[i]).attr('data-code');
-      instance_code = $(item_row[i]).attr('data-instance-code');
-      r_option = $(item_row[i]).attr('data-opt');
+    $(item_row).each(function (i) {
+      item_code = $(item_row[i]).attr("data-code");
+      instance_code = $(item_row[i]).attr("data-instance-code");
+      r_option = $(item_row[i]).attr("data-opt");
 
-      if (item_code == data.attr('data-item-code') && instance_code == data.attr('data-instance-code')&&r_option == d_option) {
+      if (
+        item_code == data.attr("data-item-code") &&
+        instance_code == data.attr("data-instance-code") &&
+        r_option == d_option
+      ) {
         if (qty > 1) {
-          qty = parseInt($(item_row[i]).children('#item_qty').text()) + qty;
-        }else{
-          qty = parseInt($(item_row[i]).children('#item_qty').text()) + 1;
+          qty = parseInt($(item_row[i]).children("#item_qty").text()) + qty;
+        } else {
+          qty = parseInt($(item_row[i]).children("#item_qty").text()) + 1;
         }
 
-        $(item_row[i]).children('#item_qty').text(qty);
-        parseFloat($(item_row[i]).children('#item_price').text(parseFloat(price*qty).toFixed(2)));
-        append =1;
-      }else{
+        $(item_row[i]).children("#item_qty").text(qty);
+        parseFloat(
+          $(item_row[i])
+            .children("#item_price")
+            .text(parseFloat(price * qty).toFixed(2)),
+        );
+        append = 1;
+      } else {
         if (qty > 1) {
           qty = qty;
-        }else{
+        } else {
           qty = 1;
         }
       }
     });
-    if (append===0) {
-      row ="<tr class='item_box' data-price ='"
-          +price+ " 'data-toggle='modal' data-target='#sx_itemModal' data-instance ='"
-          +instance+ "' data-qty='"+qty +"' data-code='"+data.attr('data-item-code')+"' data-instance-code='"
-          +data.attr('data-instance-code')+"' data-attributes='"
-          +data.attr('data-attributes')+"' data-options ='"
-          +data_option+"' data-opt ='"
-          +data.attr('data-options')+"' data-row ='"+rowCount+ "'>"
-      +'<td class="item-cell-no">'+rowCount+'</td>'
-      +'<td class="item-cell-name" id="item_name" >' + data.attr('data-name')+ ' ' + instance +''+option_name+'</td>'
-      +'<td class="item-cell-qty" id="item_qty">' + qty + '</td>'
-      +'<td class="item-cell-price" id="item_price">'
-      + parseFloat(price * qty).toFixed(2)
-      +'</td>'
-      +'</tr>';
+    if (append === 0) {
+      row =
+        "<tr class='item_box' data-price ='" +
+        price +
+        " 'data-toggle='modal' data-target='#sx_itemModal' data-instance ='" +
+        instance +
+        "' data-qty='" +
+        qty +
+        "' data-code='" +
+        data.attr("data-item-code") +
+        "' data-instance-code='" +
+        data.attr("data-instance-code") +
+        "' data-attributes='" +
+        data.attr("data-attributes") +
+        "' data-options ='" +
+        data_option +
+        "' data-opt ='" +
+        data.attr("data-options") +
+        "' data-row ='" +
+        rowCount +
+        "'>" +
+        '<td class="item-cell-no">' +
+        rowCount +
+        "</td>" +
+        '<td class="item-cell-name" id="item_name" >' +
+        data.attr("data-name") +
+        " " +
+        instance +
+        "" +
+        option_name +
+        "</td>" +
+        '<td class="item-cell-qty" id="item_qty">' +
+        qty +
+        "</td>" +
+        '<td class="item-cell-price" id="item_price">' +
+        parseFloat(price * qty).toFixed(2) +
+        "</td>" +
+        "</tr>";
       $(".summary-items tbody").append(row);
     }
   }
 
   // Create Order
-  $("#create_order").on('click', function(e){
+  $("#create_order").on("click", function (e) {
     $(this).prop("disabled", true);
     $("#create_pay_order").prop("disabled", true);
     e.preventDefault();
-    name_list = ''
+    name_list = "";
     count = 0;
-    $('.summary-items').find(`tr[data-oos='true']`).each(function() {
-      count += 1;
-      name = $(this).data('name')
-      name += $(this).data('instance').replace(/['"]+/g, '')
-      if ((count + 1) == $('.summary-items').find(`tr[data-oos='true']`).length) {
-        name += ' and '
-      } else if(count != $('.summary-items').find(`tr[data-oos='true']`).length){
-        name += ', '
-      }
-      name_list += name
-    });
-    wanring_text = name_list + 'are out of stock.'
+    $(".summary-items")
+      .find(`tr[data-oos='true']`)
+      .each(function () {
+        count += 1;
+        name = $(this).data("name");
+        name += $(this).data("instance").replace(/['"]+/g, "");
+        if (
+          count + 1 ==
+          $(".summary-items").find(`tr[data-oos='true']`).length
+        ) {
+          name += " and ";
+        } else if (
+          count != $(".summary-items").find(`tr[data-oos='true']`).length
+        ) {
+          name += ", ";
+        }
+        name_list += name;
+      });
+    wanring_text = name_list + "are out of stock.";
     if (name_list) {
-
-      swal({
-        title: "Out Of Stock Warning!",
-        text: wanring_text,
-        type: "warning",
-        showCancelButton: true,
-        confirmButtonColor: "#DD6B55",
-        confirmButtonText: "Confrim",
-        closeOnConfirm: false
-        }, function (isConfirm) {
+      swal(
+        {
+          title: "Out Of Stock Warning!",
+          text: wanring_text,
+          type: "warning",
+          showCancelButton: true,
+          confirmButtonColor: "#DD6B55",
+          confirmButtonText: "Confrim",
+          closeOnConfirm: false,
+        },
+        function (isConfirm) {
           if (isConfirm) {
-            create_order($(this))
-          }else{
+            create_order($(this));
+          } else {
             $("#create_order").prop("disabled", false);
             $("#create_pay_order").prop("disabled", false);
           }
-      });
+        },
+      );
     } else {
-      create_order($(this))
+      create_order($(this));
     }
   });
 
   function create_order(data) {
     $("#oqs_loading_wrapper").show();
     var cashier_type = $("#link_type").val();
-    localStorage.setItem('cashier_type',cashier_type);
+    localStorage.setItem("cashier_type", cashier_type);
     quick_service = window.location.href.indexOf("quick_service");
-    localStorage.setItem('quick_service',quick_service);
+    localStorage.setItem("quick_service", quick_service);
     food_court = window.location.href.indexOf("food_court");
-    localStorage.setItem('food_court',food_court);
+    localStorage.setItem("food_court", food_court);
     if (quick_service != -1 || food_court != -1) {
       type = cashier_type;
-      var table_type  = $('#table_type').text();
-      var table_id    = $('#table_id').val();
-      var customer_id = $('#customer_id').val();
-      var booking_id  = $('#booking_id').text();
-      var ajax_url = 'addorders/create';
-    }else{
-      type = 'cashier';
-      var table_type  = $('#table_type').text();
-      var table_id    = $('#table_id').text();
-      var customer_id = $('#customer_id').text();
-      var booking_id  = $('#booking_id').text();
-      var ajax_url = '../addorders/create';
+      var table_type = $("#table_type").text();
+      var table_id = $("#table_id").val();
+      var customer_id = $("#customer_id").val();
+      var booking_id = $("#booking_id").text();
+      var ajax_url = "addorders/create";
+    } else {
+      type = "cashier";
+      var table_type = $("#table_type").text();
+      var table_id = $("#table_id").text();
+      var customer_id = $("#customer_id").text();
+      var booking_id = $("#booking_id").text();
+      var ajax_url = "../addorders/create";
     }
     var order_items = JSON.stringify(get_order_item_rows());
     if (booking_id.length > 0) {
-
-      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" };
-    }else{
-      var params = {'order_source': type, 'order_type': "dine_in",
-                  'customer_id': customer_id, 'guest_info': "",
-                  'table_id': table_id,
-                  'order_items': order_items,'create_type' : "create_only" };
+      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",
+      };
+    } else {
+      var params = {
+        order_source: type,
+        order_type: "dine_in",
+        customer_id: customer_id,
+        guest_info: "",
+        table_id: table_id,
+        order_items: order_items,
+        create_type: "create_only",
+      };
     }
 
     $.ajax({
@@ -1167,34 +1438,33 @@ $(function() {
       url: ajax_url,
       data: params,
       dataType: "json",
-      success: function(result){
+      success: function (result) {
         booking_id = result.booking_id;
         if (type == "quick_service") {
           window.location.href = "/origami/quick_service";
-        } else if (type=="food_court") {
-          window.location.href = "/foodcourt/app_orders?pending_id=" + booking_id;
+        } else if (type == "food_court") {
+          window.location.href =
+            "/foodcourt/app_orders?pending_id=" + booking_id;
         } else {
-          if(table_type == "Table"){
-              window.location.href = "/origami/table/" + table_id;
-          }
-          else {
-              window.location.href = "/origami/room/" + table_id;
+          if (table_type == "Table") {
+            window.location.href = "/origami/table/" + table_id;
+          } else {
+            window.location.href = "/origami/room/" + table_id;
           }
         }
-        if ($('#server_mode').val() != "cloud" && second_display_lookup == 2){
-          customer_display_view(null,"reload");
+        if ($("#server_mode").val() != "cloud" && second_display_lookup == 2) {
+          customer_display_view(null, "reload");
         }
       },
-      error: function(XMLHttpRequest, textStatus, errorThrown) {
+      error: function (XMLHttpRequest, textStatus, errorThrown) {
         $("#oqs_loading_wrapper").hide();
         $("#create_order").prop("disabled", false);
         $("#create_pay_order").prop("disabled", false);
         swal("Error", "Status: " + textStatus, "error");
-      }
+      },
     });
   }
 
-
   // Pay Discount for Payment
   // $("#create_pay_order").on('click', function(e){
 
@@ -1211,53 +1481,60 @@ $(function() {
   //   });
   // });
 
-  $("#read_modal").on('shown.bs.modal', function(e) {
+  $("#read_modal").on("shown.bs.modal", function (e) {
     // $(this).prop("disabled", true);
     // $("#create_pay_order").prop("disabled", true);
     // $("#create_order").prop("disabled", true);
-    $("#read_modal").attr('data-for', 'member');
+    $("#read_modal").attr("data-for", "member");
     // e.preventDefault();
     getCardNo();
 
     onScan.attachTo(document, {
-      onScan: function(sCode) {
-        setCardNo(sCode)
-      }
+      onScan: function (sCode) {
+        setCardNo(sCode);
+      },
     });
   });
-
-  $("#read_modal #close").on('click',function(){
-    if ($("#order-items-table tr").length > 1){
-      $("#create_pay_order").prop("disabled", false);
-      $("#create_order").prop("disabled", false);
-    }
-    $("#read_modal").modal('hide');
+  $("#read_modal").on("shown.bs.modal", function (e) {
+    $(".modal-backdrop").css("display", "none");
   });
 
-  $('#read_modal').on('hidden.bs.modal', function () {
+  $("#payment_modal").on("shown.bs.modal", function (e) {
+    $(".modal-backdrop").css("display", "none");
+  });
+
+  $("#read_modal #close").on("click", function () {
     if ($("#order-items-table tr").length > 1) {
       $("#create_pay_order").prop("disabled", false);
       $("#create_order").prop("disabled", false);
     }
-  })
+    $("#read_modal").modal("hide");
+  });
+
+  $("#read_modal").on("hidden.bs.modal", function () {
+    if ($("#order-items-table tr").length > 1) {
+      $("#create_pay_order").prop("disabled", false);
+      $("#create_order").prop("disabled", false);
+    }
+  });
 
   //click item row for update qty
-  $('.summary-items').on('click', '.item_box', function(){
-    $(this).attr('data-active',true);
-    name =  $(this).children('#item_name').text();
-    qty  =  $(this).children('#item_qty').text();
-    $('#modal-item-name').text(name);
-    $(this).addClass('set-bg-color')
+  $(".summary-items").on("click", ".item_box", function () {
+    $(this).attr("data-active", true);
+    name = $(this).children("#item_name").text();
+    qty = $(this).children("#item_qty").text();
+    $("#modal-item-name").text(name);
+    $(this).addClass("set-bg-color");
   });
 
   //click remove buttom in modal box
-  $('#sx_itemModal').on('click','#remove', function(){
-    $('.summary-items tr').filter(function(){
-      if ($(this).attr('data-active') == 'true'){
-        if ($('#server_mode').val() != "cloud" && second_display_lookup == 2) {
+  $("#sx_itemModal").on("click", "#remove", function () {
+    $(".summary-items tr").filter(function () {
+      if ($(this).attr("data-active") == "true") {
+        if ($("#server_mode").val() != "cloud" && second_display_lookup == 2) {
           var item_data = $(this);
-          item = get_item(item_data,"remove_icon");
-          customer_display_view(item,"remove");
+          item = get_item(item_data, "remove_icon");
+          customer_display_view(item, "remove");
         }
         $(this).remove();
       }
@@ -1266,93 +1543,96 @@ $(function() {
   });
 
   //click close
-  $('#sx_itemModal').on('click','#close', function(){
+  $("#sx_itemModal").on("click", "#close", function () {
     $(".item_box").removeAttr("data-active");
   });
 
-  $('#sx_item_set_detailModal').on('click','#close', function(){
-    $("#sx_item_set_detailModal").css({ 'display': "none" });
+  $("#sx_item_set_detailModal").on("click", "#close", function () {
+    $("#sx_item_set_detailModal").css({ display: "none" });
   });
 
-  $('#read_modal').on('click','#close', function(){
-    $("#read_modal").css({ 'display': "none" });
+  $("#read_modal").on("click", "#close", function () {
+    $("#read_modal").css({ display: "none" });
+    $("#payment_modal").css({ display: "none" });
+    $(".modal-backdrop.fade").css("display", "none");
   });
 
   //click save buttom after change qty
-  $(document).on('click','#save', function(){
-    if ($('#modal-qty').val()>0) {
+  $(document).on("click", "#save", function () {
+    if ($("#modal-qty").val() > 0) {
       summary_items_filter();
       calculate_sub_total();
-      $('.set-bg-color').css({
-        'background-color': '#2091F3',
-        'color': '#fff'
-      })
-      $('.summary-items tbody tr').removeClass('set-bg-color');
-    }else{
-      swal("Opps", "Please enter number for qty ","warning");
+      $(".set-bg-color").css({
+        "background-color": "#2091F3",
+        color: "#fff",
+      });
+      $(".summary-items tbody tr").removeClass("set-bg-color");
+    } else {
+      swal("Opps", "Please enter number for qty ", "warning");
     }
-
   });
 
   //calculate subtotal
-  function calculate_sub_total(){
-    var total_price    = 0;
-    var total_qty      = 0;
+  function calculate_sub_total() {
+    var total_price = 0;
+    var total_qty = 0;
     var taxable_amount = 0;
-    var exclusive_total =0;
-    var inclusive_total =0;
-    var inclusive_tax =$('#inclusive_tax').val();
-    var exclusive_tax =$('#exclusive_tax').val();
-    var item_row       = $('.summary-items tbody tr');
-    $(item_row).each(function(i){
-      var unit_price = parseFloat($(item_row[i]).attr('data-price'));
-      var qty        = parseFloat($(item_row[i]).children('#item_qty').text());
+    var exclusive_total = 0;
+    var inclusive_total = 0;
+    var inclusive_tax = $("#inclusive_tax").val();
+    var exclusive_tax = $("#exclusive_tax").val();
+    var item_row = $(".summary-items tbody tr");
+    $(item_row).each(function (i) {
+      var unit_price = parseFloat($(item_row[i]).attr("data-price"));
+      var qty = parseFloat($(item_row[i]).children("#item_qty").text());
       total_qty += qty;
-      total_price += qty*unit_price;
+      total_price += qty * unit_price;
     });
-    if (inclusive_tax >0){
+    if (inclusive_tax > 0) {
       inclusive_total = total_price / inclusive_tax;
       total_price = total_price;
     }
-    if (exclusive_tax >0){
+    if (exclusive_tax > 0) {
       exclusive_total = total_price * exclusive_tax;
       total_price = total_price + exclusive_total;
     }
-    var fixed_total_price    = parseFloat(total_price).toFixed(2);
+    var fixed_total_price = parseFloat(total_price).toFixed(2);
     var fixed_taxable_amount = parseFloat(taxable_amount).toFixed(2);
-    $('#total_tax').empty();
-    $('#total_tax').append(parseInt(exclusive_total) + parseInt(inclusive_total));
+    $("#total_tax").empty();
+    $("#total_tax").append(
+      parseInt(exclusive_total) + parseInt(inclusive_total),
+    );
 
-    $('#sub_total').empty();
-    $('#sub_total').append(fixed_total_price);
+    $("#sub_total").empty();
+    $("#sub_total").append(fixed_total_price);
 
-    $('#total_qty').empty();
-    $('#total_qty').append(total_qty);
+    $("#total_qty").empty();
+    $("#total_qty").append(total_qty);
 
     if (item_row.length > 0) {
-      $('.create').removeAttr("disabled", false);
-    }else{
-      $('.create').attr("disabled", true);
+      $(".create").removeAttr("disabled", false);
+    } else {
+      $(".create").attr("disabled", true);
     }
   }
 
-  function summary_items_filter(){
-    $('.summary-items tr').filter(function(){
-      if ($(this).attr('data-active') == 'true'){
-        qty   = $('#modal-qty').val();
-        $(this).attr('data-qty',qty);
-        price = parseFloat($(this).attr('data-price'));
-        total_price = parseFloat(price*qty).toFixed(2);
+  function summary_items_filter() {
+    $(".summary-items tr").filter(function () {
+      if ($(this).attr("data-active") == "true") {
+        qty = $("#modal-qty").val();
+        $(this).attr("data-qty", qty);
+        price = parseFloat($(this).attr("data-price"));
+        total_price = parseFloat(price * qty).toFixed(2);
 
-        $(this).find('#item_qty').text(qty);
-        $(this).find('.item-cell-price').text(total_price);
+        $(this).find("#item_qty").text(qty);
+        $(this).find(".item-cell-price").text(total_price);
 
-        $(this).removeAttr('data-active');
+        $(this).removeAttr("data-active");
 
-        if ($('#server_mode').val() != "cloud" && second_display_lookup == 2) {
+        if ($("#server_mode").val() != "cloud" && second_display_lookup == 2) {
           var item_data = $(this);
-          item = get_item(item_data,"update_icon");
-          customer_display_view(item,"update_qty");
+          item = get_item(item_data, "update_icon");
+          customer_display_view(item, "update_qty");
         }
       }
     });
@@ -1360,10 +1640,10 @@ $(function() {
 
   // Get Selected Class
   function get_selected_attributes(selected_class) {
-    var item_row      = $('.'+selected_class);
+    var item_row = $("." + selected_class);
     var attribute_arr = [];
-    $(item_row).each(function(i){
-      value = $(item_row[i]).attr('data-value');
+    $(item_row).each(function (i) {
+      value = $(item_row[i]).attr("data-value");
       str = value;
       attribute_arr.push(str);
     });
@@ -1371,166 +1651,176 @@ $(function() {
   }
 
   //click menu sidebar menu category
-  $("#back").on("click", function(){
-    var table_id   = $('#table_id').text();
-    var table_type = $('#table_type').text();
+  $("#back").on("click", function () {
+    var table_id = $("#table_id").text();
+    var table_type = $("#table_type").text();
     var cashier_type = $("#link_type").val();
-    type = window.location.href.includes("quick_service") || window.location.href.includes("food_court");
+    type =
+      window.location.href.includes("quick_service") ||
+      window.location.href.includes("food_court");
     if (type == true) {
-      var table_type = $('#table_id').find("option:selected").data('type');
-      var table_id    = $('#table_id').val();
-      if(window.location.href.includes("modify_order")){
+      var table_type = $("#table_id").find("option:selected").data("type");
+      var table_id = $("#table_id").val();
+      if (window.location.href.includes("modify_order")) {
         var link_url = window.location.href.split("/");
-        window.location.href = "/origami/"+cashier_type+"/pending_order/"+link_url[link_url.length - 1];
-      }else{
+        window.location.href =
+          "/origami/" +
+          cashier_type +
+          "/pending_order/" +
+          link_url[link_url.length - 1];
+      } else {
         window.location.href = "/origami/dashboard";
       }
-    }else if(window.location.href.incluses("out_of_stock")){
-      window.location.href = '/settings/out_of_stock';
-    }else{
-      var table_type = $('#table_type').text();
-      var table_id    = $('#table_id').text();
+    } else if (window.location.href.incluses("out_of_stock")) {
+      window.location.href = "/settings/out_of_stock";
+    } else {
+      var table_type = $("#table_type").text();
+      var table_id = $("#table_id").text();
 
-      if(table_type == "Table"){
+      if (table_type == "Table") {
         window.location.href = "/origami/table/" + table_id;
-      }else {
+      } else {
         window.location.href = "/origami/room/" + table_id;
       }
     }
   });
 
   // Get Selected Class
-  function change_qty_plus_minus(id,plus,minus) {
-    var count = parseInt($('#'+id).val());
+  function change_qty_plus_minus(id, plus, minus) {
+    var count = parseInt($("#" + id).val());
 
-    $('#'+plus).on("click", function(){
+    $("#" + plus).on("click", function () {
       count++;
-      $('#'+id).val(count);
+      $("#" + id).val(count);
 
       if (id == "count") {
         price = $("#unit_price").text();
-        $("#total_price").text(count*price);
-      }else{
-        var item_row      = $('.selected-instance');
-        price             = $("#set_unit_price").text();
-        set_total_price   = $("#set_total_price").text();
+        $("#total_price").text(count * price);
+      } else {
+        var item_row = $(".selected-instance");
+        price = $("#set_unit_price").text();
+        set_total_price = $("#set_total_price").text();
 
         if (item_row.length > 1) {
-          total = 0 ;
-          $(item_row).each(function(i){
-            total += count * $(item_row[i]).attr('data-price');
+          total = 0;
+          $(item_row).each(function (i) {
+            total += count * $(item_row[i]).attr("data-price");
             total_price = total;
           });
-        }else{
-          total_price     = count*price;
+        } else {
+          total_price = count * price;
         }
 
         $("#set_total_price").text(total_price);
       }
     });
 
-    $('#'+minus).on("click", function(){
-
+    $("#" + minus).on("click", function () {
       // var count   = parseInt($('#'+id).val());
       // var countEl = document.getElementById(id);
 
       if (count > 1) {
         count--;
-        $('#'+id).val(count);
+        $("#" + id).val(count);
 
-        if (id=="count") {
+        if (id == "count") {
           price = $("#unit_price").text();
-          $("#total_price").text(count*price);
-        }else{
-          var item_row      = $('.selected-instance');
-          price             = $("#set_unit_price").text();
-          set_total_price   = $("#set_total_price").text();
+          $("#total_price").text(count * price);
+        } else {
+          var item_row = $(".selected-instance");
+          price = $("#set_unit_price").text();
+          set_total_price = $("#set_total_price").text();
 
           if (item_row.length > 1) {
-            total = 0 ;
-            $(item_row).each(function(i){
-              total += count * $(item_row[i]).attr('data-price');
+            total = 0;
+            $(item_row).each(function (i) {
+              total += count * $(item_row[i]).attr("data-price");
               total_price = total;
             });
-          }else{
-            total_price     = count*price;
+          } else {
+            total_price = count * price;
           }
           $("#set_total_price").text(total_price);
         }
       }
-    })
+    });
   }
 
-  $(".keypress_qty").on('keyup change', function (){
-   // $('.keypress_qty').keyup(function(e){
-        id    = $(this).attr('id');
-        value = $(this).val();
+  $(".keypress_qty").on("keyup change", function () {
+    // $('.keypress_qty').keyup(function(e){
+    id = $(this).attr("id");
+    value = $(this).val();
 
-        if ($.isNumeric(value)) {
-          if (id=="count") {
-            $('#count').attr('value',value);
-            price = $("#unit_price").text();
-            $("#total_price").text(value*price);
-          }else{
-            var item_row      = $('.selected-instance');
-            price             = $("#set_unit_price").text();
-            set_total_price   = $("#set_total_price").text();
-            $(".set_change_qty").val(value);
-            if (item_row.length > 1) {
-              total = 0 ;
-              $(item_row).each(function(i){
-                total += value * $(item_row[i]).attr('data-price');
-                total_price = total;
-              });
-            }else{
-              total_price     = value*price;
-            }
-            $("#set_total_price").text(total_price);
-          }
-        }else{
-          $('#'+id).val(1);
-          swal("Opps","Please enter number for qty","warning");
+    if ($.isNumeric(value)) {
+      if (id == "count") {
+        $("#count").attr("value", value);
+        price = $("#unit_price").text();
+        $("#total_price").text(value * price);
+      } else {
+        var item_row = $(".selected-instance");
+        price = $("#set_unit_price").text();
+        set_total_price = $("#set_total_price").text();
+        $(".set_change_qty").val(value);
+        if (item_row.length > 1) {
+          total = 0;
+          $(item_row).each(function (i) {
+            total += value * $(item_row[i]).attr("data-price");
+            total_price = total;
+          });
+        } else {
+          total_price = value * price;
         }
-    });
+        $("#set_total_price").text(total_price);
+      }
+    } else {
+      $("#" + id).val(1);
+      swal("Opps", "Please enter number for qty", "warning");
+    }
+  });
 
-   //click menu sidebar menu category
+  //click menu sidebar menu category
 
-   $(document).on('click', '.sub_clickssss', function(event){
-     event.preventDefault();
+  $(document).on("click", ".sub_clickssss", function (event) {
+    event.preventDefault();
     var menu_id = $(this).attr("data-id");
-    var url = "get_menu_sub_category/"+menu_id;
-    sub_category = $(this).find('.sub_category_list');
-    show_sub_category_list(url,sub_category,menu_id);
+    var url = "get_menu_sub_category/" + menu_id;
+    sub_category = $(this).find(".sub_category_list");
+    show_sub_category_list(url, sub_category, menu_id);
   });
   //End menu category Click
 
   //show menu item list when click menu category
-  function show_sub_category_list(url,sub_category,menu_id){
-
-    var sub_category_list = $('.sub_category_list');
-     sub_category_list.empty();
+  function show_sub_category_list(url, sub_category, menu_id) {
+    var sub_category_list = $(".sub_category_list");
+    sub_category_list.empty();
 
     menus = JSON.parse(localStorage.getItem("menus"));
     if (menus != null) {
-      for(var j in menus) {
+      for (var j in menus) {
         var categories = menus[j]["categories"];
-        for(var ii in categories) {
+        for (var ii in categories) {
           if (menu_id == categories[ii]["parent_id"]) {
-            $(sub_category).removeClass('hidden');
-            row = '<li class="menu_sub_category fadeInTop" data-id="'+categories[ii].id+'">'
-              +'<a class="nav-link" data-toggle="tab" href="" role="tab">'+ categories[ii].name+'</a>'
-            +'</li>' ;
+            $(sub_category).removeClass("hidden");
+            row =
+              '<li class="menu_sub_category fadeInTop" data-id="' +
+              categories[ii].id +
+              '">' +
+              '<a class="nav-link" data-toggle="tab" href="" role="tab">' +
+              categories[ii].name +
+              "</a>" +
+              "</li>";
             $(sub_category).append(row);
           }
         }
       }
-    }else{
+    } else {
       if (type != -1 && modify_order != -1) {
-        var url = "../../../addorders/"+url;
-      }if(modify_order== -1 && type != -1){
-        var url = 'addorders/'+url;
+        var url = "../../../addorders/" + url;
       }
-      if (type ==-1 && modify_order == -1){
+      if (modify_order == -1 && type != -1) {
+        var url = "addorders/" + url;
+      }
+      if (type == -1 && modify_order == -1) {
         var url = url;
       }
       //Start Ajax
@@ -1539,103 +1829,104 @@ $(function() {
         url: url,
         data: {},
         dataType: "json",
-        success: function(data) {
-          var sub_category_list = $('.sub_category_list');
+        success: function (data) {
+          var sub_category_list = $(".sub_category_list");
           sub_category_list.empty();
           data = data.sub_category;
           if (data.length > 0) {
             // if ((sub_category.hasClass('hidden'))) {
-              $(sub_category).removeClass('hidden');
+            $(sub_category).removeClass("hidden");
             // }else{
-              // $(sub_category).addClass('hidden');
+            // $(sub_category).addClass('hidden');
             // }
-            for(var i in data) {
-
-                  row = '<li class="menu_sub_category fadeInTop" data-id="'+data[i].id+'">'
-                           +'<a class="nav-link" data-toggle="tab" href="" role="tab">'+ data[i].name+'</a>'
-                         +'</li>' ;
-                  $(sub_category).append(row);
+            for (var i in data) {
+              row =
+                '<li class="menu_sub_category fadeInTop" data-id="' +
+                data[i].id +
+                '">' +
+                '<a class="nav-link" data-toggle="tab" href="" role="tab">' +
+                data[i].name +
+                "</a>" +
+                "</li>";
+              $(sub_category).append(row);
               //end is_sub_item false
             }
           }
-        }
+        },
       });
       //end Ajax
     }
   }
 
   /* Get  Item rows */
-  function get_item(data,click_type){
-  var sale_items = [];
+  function get_item(data, click_type) {
+    var sale_items = [];
 
     var sale_item = {};
-    sale_item.qty = parseInt(data.attr('data-qty'));
-    sale_item.name =  data.attr('data-name');
-    sale_item.price = data.attr('data-price');
-    sale_item.item_code  = data.attr('data-item-code')
-    sale_item.instance_code  = data.attr('data-instance-code')
-    sale_item.attributes  = data.attr('data-attributes')
-    sale_item.options  = data.attr('data-options')
-    sale_item.opt  = data.attr('data-opt')
-    sale_item.click_type  = click_type
-    sale_item.instance  = data.attr('data-instance')
+    sale_item.qty = parseInt(data.attr("data-qty"));
+    sale_item.name = data.attr("data-name");
+    sale_item.price = data.attr("data-price");
+    sale_item.item_code = data.attr("data-item-code");
+    sale_item.instance_code = data.attr("data-instance-code");
+    sale_item.attributes = data.attr("data-attributes");
+    sale_item.options = data.attr("data-options");
+    sale_item.opt = data.attr("data-opt");
+    sale_item.click_type = click_type;
+    sale_item.instance = data.attr("data-instance");
     sale_items.push(sale_item);
-  return sale_items;
+    return sale_items;
+  }
 
- }
-
- /* Get  Item rows */
- function get_set_item(items){
-  var sale_items = [];
-     var item = {};
-        item.code          = $('.set-item').attr('data-code');
-        item.name          = $('.set-item').attr('data-name');
-        item.item_name     = $('#set_name').text();
-        item.qty           = parseInt($('#set_count').val());
-        item.item_code     = $('#set_item_code').text();
-        item.price         = $('.set-item').attr('data-price');
-        item.option        = $('.set-item').attr('data-options');
-        item.parent        = $('.set-item').attr('data-parent');
+  /* Get  Item rows */
+  function get_set_item(items) {
+    var sale_items = [];
+    var item = {};
+    item.code = $(".set-item").attr("data-code");
+    item.name = $(".set-item").attr("data-name");
+    item.item_name = $("#set_name").text();
+    item.qty = parseInt($("#set_count").val());
+    item.item_code = $("#set_item_code").text();
+    item.price = $(".set-item").attr("data-price");
+    item.option = $(".set-item").attr("data-options");
+    item.parent = $(".set-item").attr("data-parent");
 
     sale_items.push(item);
 
-    $(items).each(function(i){
+    $(items).each(function (i) {
       var sale_item = {};
-        sale_item.code          = $(items[i]).attr('data-code');
-        sale_item.name          = $(items[i]).attr('data-name');
-        sale_item.item_name     = $('#set_name').text();
-        sale_item.qty           = parseInt($('#set_count').val());
-        sale_item.item_code     = $('#set_item_code').text();
-        sale_item.price         = $(items[i]).attr('data-price');
-        sale_item.option        = $(items[i]).attr('data-options');
-        sale_item.sub_item      = $(items[i]).attr('data-sub-item');
-        sale_items.push(sale_item);
+      sale_item.code = $(items[i]).attr("data-code");
+      sale_item.name = $(items[i]).attr("data-name");
+      sale_item.item_name = $("#set_name").text();
+      sale_item.qty = parseInt($("#set_count").val());
+      sale_item.item_code = $("#set_item_code").text();
+      sale_item.price = $(items[i]).attr("data-price");
+      sale_item.option = $(items[i]).attr("data-options");
+      sale_item.sub_item = $(items[i]).attr("data-sub-item");
+      sale_items.push(sale_item);
     });
 
+    return sale_items;
+  }
 
-  return sale_items;
- }
-
- function customer_display_view(data,status) {
-  if (type != -1 && modify_order != -1) {
-    url = '../../../../origami/customer_view';
+  function customer_display_view(data, status) {
+    if (type != -1 && modify_order != -1) {
+      url = "../../../../origami/customer_view";
+    }
+    if (modify_order == -1 && type != -1) {
+      url = "../../origami/customer_view";
+    }
+    if (type == -1 && modify_order == -1) {
+      url = "../../origami/customer_view";
+    }
+    $.ajax({
+      type: "POST",
+      url: url,
+      data: { data: data, status: status, type: $("#link_type").val() },
+      dataType: "json",
+      success: function (result) {},
+    });
   }
-  if(modify_order == -1 && type != -1){
-    url = '../../origami/customer_view';
-  }
-  if (type ==-1 && modify_order == -1){
-    url = '../../origami/customer_view';
-  }
-   $.ajax({
-          type: "POST",
-          url: url,
-          data: {"data":data,"status":status,"type":$("#link_type").val()},
-          dataType: "json",
-           success:function(result){
-           }
-        });
- }
- /*  $("input").keypress(function(){
+  /*  $("input").keypress(function(){
     $("span").text(i += 1);
 });*/
   // $("#set_change_qty").change(function(){
@@ -1644,311 +1935,497 @@ $(function() {
   //   $("#set_total_price").text(qty*price);
   // });
 
- // $(".change_qty").change(function(){
+  // $(".change_qty").change(function(){
   //   qty = $(this).val();
   //   price = $("#unit_price").text();
   //   $("#total_price").text(qty*price);
   // });
   function truncateString(str, num) {
     if (str.length <= num) {
-      return str
+      return str;
     } else {
-      return str.slice(0, num) + '...'
+      return str.slice(0, num) + "...";
     }
   }
   function show_menu_list(menu_items) {
-    var menu_list = $('.menu_items_list');
+    var menu_list = $(".menu_items_list");
     menu_list.empty();
-    for(var field in menu_items) {
-            if (menu_items[field].is_sub_item == false) {
-              instances = menu_items[field].instances ;
+    for (var field in menu_items) {
+      if (menu_items[field].is_sub_item == false) {
+        instances = menu_items[field].instances;
 
-              if (!instances.length > 0) {
-                swal("Hello Please Check!","Does not have instance item in this menu items ("+ menu_items[field].name+")","warning");
-              }
-              if (instances.length > 0) {
-                qty = 1;
-                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].instances.forEach(ins => function (){
-                      if (ins.out_of_stock == false) {
-                        code =  ins.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);
-                          out_of_stock    = instances[i].out_of_stock;
-                        }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';
-                  data_target = 'sx_item_detailModal';
-                  data_modal  = ''
-                  add_icon = "add_icon"
-                  menu_instances = [];
-
-                  code = '';
-                  name = '';
-                  price = '';
-                  is_available = '';
-                  is_on_promotion = '';
-                  item_attributes = '';
-                  promotion_price = '';
-                  out_of_stock = '';
-                  menu_insta = '';
-
-                  $(instances).each(function(i){
-                    if (!instances[i].out_of_stock) { //instances[i].is_default === true &&
-                     code            = instances[i].code;
-                     name            = instances[i].name;
-                     price           = parseFloat(instances[i].price).toFixed(2);
-                     is_available    = instances[i].is_available ;
-                     is_on_promotion = instances[i].is_on_promotion;
-                     item_attributes = instances[i].values;
-                     promotion_price = instances[i].promotion_price;
-                     out_of_stock    = instances[i].out_of_stock;
-                     menu_insta      = [code,name,item_attributes];
-                     menu_instances.push(menu_insta);
-                    }
-                  });
-                }
-
-                pointer_event = 'auto'
-                opacity = ''
-                status = ''
-                count = 0;
-                $(instances).each(function(i) {
-                  if (instances[i].out_of_stock == true) {
-                    count += 1
-                    if (instances.length == count) { // all attributes out of stock
-                      pointer_event = 'none'
-                      status = 'out of stock'
-                      opacity = '0.5'
-                    }
-
-                  }
-                })
-
-                if (status) {
-                  price_tag = '<span class="text-danger price_tag" style="font-weight:900;flex-grow:1;">'+status+'</span>'
-                } else {
-                  price_tag ='<span class="price_tag" style="font-weight:900;flex-grow:1;">'+price+'</span>'
-                }
-
-                image_path = '';
-                image_exist = false;
-                if (menu_items[field].image) {
-                  if (modify_order) {
-                    image_path = "../../"+menu_items[field].image;
-                  }else{
-                    image_path = menu_items[field].image;
-                  }
-
-                  $.ajax({
-                    url: image_path,
-                    async: false,
-                    success: function(data) {
-                      image_exist = true;
-                    }
-                  });
-                }
-
-                if(image_exist == true) {
-                  oos_item = '<div class="card custom-card testimonial-card fadeInRight" id="'+ code +'" style="height: 100%; pointer-events: '+pointer_event+';">'
-                  name = menu_items[field].name
-                  short_name = truncateString(name, 30)
-                  row = '<div class="col-md-6 col-sm-6 col-lg-3 m-t-2">'
-                            + oos_item
-                            +'<div class="custom-card-head card-head row" style="margin:0px; height: 40px; font-size: 0.9em; opacity: '+opacity+'" >'
-                              +'<div class="col-md-10 " style="padding:0px !important;">'+ short_name +'</div>'
-
-                             +'</div>'
-                            +"<div  class='"+add_icon+"' "
-                                          +" data-item-code='"+ menu_items[field].code +"' "
-                                          +" data-name='"+ menu_items[field].name +"' "
-                                          +" data-menu-instances='" + JSON.stringify(menu_instances)+"' "
-                                          +" data-qty = '"+ qty +"' "
-                                          +" data-price = '" + price +"' "
-                                          +" data-instance-code = '"+ code +"' "
-                                          +" data-instance = '" + name +"' "
-                                          +" data-promotion-price = '"+ promotion_price +"' "
-                                          +" data-id= '" + JSON.stringify(menu_items[field].attributes) +"'"
-                                          +" data-attributes = '" + JSON.stringify(item_attributes) +"' "
-                                          +" data-options = '"+ JSON.stringify(menu_items[field].options) +"' "
-                                          +" data-opt = '" + JSON.stringify(menu_items[field].options) +"' "
-                                          +" data-image='"+image_path+"' "
-                                          +" data-toggle='modal' "
-                                          +" data-target='."+data_target+"' "
-                                          +" data-item-sets = '"+JSON.stringify(menu_items[field].item_sets)+"'"
-                                          +" data-instances = '"+JSON.stringify(menu_items[field].instances)+"'"
-                                          +" style='height: 80px;'>"
-                                + '<img src = "../../'+image_path+'" class="img-fluid" style="opacity: '+opacity+'; height: 100%; width: 100%;"/>'
-                              +'</div>'
-                              +'<div class="card-footer custom-card-footer custom-flex-footer" style="height: 40px;">'
-                                + price_tag
-                                + "<div class='offset-4 col-2 "+menu_item_box
-                                + "' data-item-code='" + menu_items[field].code
-                                + "' data-instance='" + JSON.stringify(menu_items[field].instances)
-                                + "' data-menu-instances='" + JSON.stringify(menu_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; opacity: "+opacity+"; pointer-events: "+pointer_event+";'>"
-                                    + "<i class='m-l--5 fa " + fa_plus + "'>"
-                                    + add
-                                    + "</i>"
-                                +'</div>'
-
-                            +'</div>'
-                        +'</div>'; ;
-                      }else{
-                        oos_item = '<div class="card custom-card testimonial-card fadeInRight" id="'+ code +'" style="height:100%; pointer-events: '+pointer_event+';">'
-
-                        name = menu_items[field].name
-                        short_name = truncateString(name, 50)
-                        row = '<div class="col-md-6 col-sm-6 col-lg-3 m-t-2">'
-                                + oos_item
-                                    +'<div class="custom-card-no-img-head card-head h-100 '+add_icon+' " id="oos'+ code +'" style="margin:0px;display:flex; opacity: '+opacity+';"'
-                                          +" data-item-code='"+ menu_items[field].code +"' "
-                                          +" data-menu-instances='" + JSON.stringify(menu_instances)+"' "
-                                          +" data-name='" + menu_items[field].name +"' "
-                                          +" data-qty = '"+ qty +"' "
-                                          +" data-price = '" + price +"' "
-                                          +" data-instance-code = '"+ code +"' "
-                                          +" data-instance = '" + name +"' "
-                                          +" data-promotion-price = '"+ promotion_price +"' "
-                                          +" data-attributes = '" + JSON.stringify(item_attributes) +"' "
-                                          + "data-id= '" + JSON.stringify(menu_items[field].attributes)+"'"
-                                          +" data-options = '"+ JSON.stringify(menu_items[field].options) +"' "
-                                          +" data-opt = '"+ JSON.stringify(menu_items[field].options) +"' "
-                                          +" data-image='' data-toggle='modal' "
-                                          +" data-target='."+data_target+"' "
-                                          +" data-item-sets = '"+JSON.stringify(menu_items[field].item_sets)+"'"
-                                          +" data-instances = '"+JSON.stringify(menu_items[field].instances)+"'>"
-
-                                          +'<div class="product_box" style="width:100%;"><span>'+ short_name +'<span></div>'
-                                    +'</div>'
-                                    +"<div  class='"+add_icon+"' "
-                                          +" data-item-code='"+ menu_items[field].code +"' "
-                                          +" data-menu-instances='" + JSON.stringify(menu_instances)+"' "
-                                          +" data-name='" + menu_items[field].name +"' "
-                                          +" data-qty = '"+ qty +"' "
-                                          +" data-price = '" + price +"' "
-                                          +" data-instance-code = '"+ code +"' "
-                                          +" data-instance = '" + name +"' "
-                                          +" data-promotion-price = '"+ promotion_price +"' "
-                                          +" data-attributes = '" + JSON.stringify(item_attributes) +"' "
-                                          +" data-options = '"+ JSON.stringify(menu_items[field].options) +"' "
-                                          +" data-opt = '"+ JSON.stringify(menu_items[field].options) +"' "
-                                          +" data-image='' data-toggle='"+data_modal+"' "
-                                          +" data-target='."+data_target+"' "
-                                          +" data-item-sets = '"+JSON.stringify(menu_items[field].item_sets)+"'"
-                                          +" data-instances = '"+JSON.stringify(menu_items[field].instances)+"'>"
-                                       +'</div>'
-                                        +'<div class="card-footer custom-card-no-img-footer custom-flex-footer" style="height: 50px;">'
-                                            + price_tag
-                                            +" <div class='offset-4 col-2 menu_item_no_img_box "+menu_item_box+" ' "
-                                              +" data-item-code='"+ menu_items[field].code +"' "
-                                              +" data-instance = '" +JSON.stringify(menu_items[field].instances)+"' "
-                                              +" data-menu-instances='" + JSON.stringify(menu_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; opacity: "+opacity+"; pointer-envents: "+pointer_event+";'>"
-                                                        +"<i class='m-l--5 fa "+fa_plus+"' >"
-                                                        +add+ '</i>'
-                                        +'</div>'
-                                        +'</div>'
-
-
-                                  +'</div>'
-                              +'</div>';
-
-                }
-
-            $('.menu_items_list').append(row);
-          }
-          //end instances in menu-items alest 1 instance
+        if (!instances.length > 0) {
+          swal(
+            "Hello Please Check!",
+            "Does not have instance item in this menu items (" +
+              menu_items[field].name +
+              ")",
+            "warning",
+          );
         }
-        //end is_sub_item false
+        if (instances.length > 0) {
+          qty = 1;
+          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].instances.forEach(
+              (ins) =>
+                function () {
+                  if (ins.out_of_stock == false) {
+                    code = ins.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);
+                out_of_stock = instances[i].out_of_stock;
+              } 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";
+            data_target = "sx_item_detailModal";
+            data_modal = "";
+            add_icon = "add_icon";
+            menu_instances = [];
+
+            code = "";
+            name = "";
+            price = "";
+            is_available = "";
+            is_on_promotion = "";
+            item_attributes = "";
+            promotion_price = "";
+            out_of_stock = "";
+            menu_insta = "";
+
+            $(instances).each(function (i) {
+              if (!instances[i].out_of_stock) {
+                //instances[i].is_default === true &&
+                code = instances[i].code;
+                name = instances[i].name;
+                price = parseFloat(instances[i].price).toFixed(2);
+                is_available = instances[i].is_available;
+                is_on_promotion = instances[i].is_on_promotion;
+                item_attributes = instances[i].values;
+                promotion_price = instances[i].promotion_price;
+                out_of_stock = instances[i].out_of_stock;
+                menu_insta = [code, name, item_attributes];
+                menu_instances.push(menu_insta);
+              }
+            });
+          }
+
+          pointer_event = "auto";
+          opacity = "";
+          status = "";
+          count = 0;
+          $(instances).each(function (i) {
+            if (instances[i].out_of_stock == true) {
+              count += 1;
+              if (instances.length == count) {
+                // all attributes out of stock
+                pointer_event = "none";
+                status = "out of stock";
+                opacity = "0.5";
+              }
+            }
+          });
+
+          if (status) {
+            price_tag =
+              '<span class="text-danger price_tag" style="font-weight:900;flex-grow:1;">' +
+              status +
+              "</span>";
+          } else {
+            price_tag =
+              '<span class="price_tag" style="font-weight:900;flex-grow:1;">' +
+              price +
+              "</span>";
+          }
+
+          image_path = "";
+          image_exist = false;
+          if (menu_items[field].image) {
+            if (modify_order) {
+              image_path = "../../" + menu_items[field].image;
+            } else {
+              image_path = menu_items[field].image;
+            }
+
+            $.ajax({
+              url: image_path,
+              async: false,
+              success: function (data) {
+                image_exist = true;
+              },
+            });
+          }
+
+          if (image_exist == true) {
+            oos_item =
+              '<div class="card custom-card testimonial-card fadeInRight" id="' +
+              code +
+              '" style="height: 100%; pointer-events: ' +
+              pointer_event +
+              ';">';
+            name = menu_items[field].name;
+            short_name = truncateString(name, 30);
+            row =
+              '<div class="col-md-6 col-sm-6 col-lg-3 m-t-2">' +
+              oos_item +
+              '<div class="custom-card-head card-head row" style="margin:0px; height: 40px; font-size: 0.9em; opacity: ' +
+              opacity +
+              '" >' +
+              '<div class="col-md-10 " style="padding:0px !important;">' +
+              short_name +
+              "</div>" +
+              "</div>" +
+              "<div  class='" +
+              add_icon +
+              "' " +
+              " data-item-code='" +
+              menu_items[field].code +
+              "' " +
+              " data-name='" +
+              menu_items[field].name +
+              "' " +
+              " data-menu-instances='" +
+              JSON.stringify(menu_instances) +
+              "' " +
+              " data-qty = '" +
+              qty +
+              "' " +
+              " data-price = '" +
+              price +
+              "' " +
+              " data-instance-code = '" +
+              code +
+              "' " +
+              " data-instance = '" +
+              name +
+              "' " +
+              " data-promotion-price = '" +
+              promotion_price +
+              "' " +
+              " data-id= '" +
+              JSON.stringify(menu_items[field].attributes) +
+              "'" +
+              " data-attributes = '" +
+              JSON.stringify(item_attributes) +
+              "' " +
+              " data-options = '" +
+              JSON.stringify(menu_items[field].options) +
+              "' " +
+              " data-opt = '" +
+              JSON.stringify(menu_items[field].options) +
+              "' " +
+              " data-image='" +
+              image_path +
+              "' " +
+              " data-toggle='modal' " +
+              " data-target='." +
+              data_target +
+              "' " +
+              " data-item-sets = '" +
+              JSON.stringify(menu_items[field].item_sets) +
+              "'" +
+              " data-instances = '" +
+              JSON.stringify(menu_items[field].instances) +
+              "'" +
+              " style='height: 80px;'>" +
+              '<img src = "../../' +
+              image_path +
+              '" class="img-fluid" style="opacity: ' +
+              opacity +
+              '; height: 100%; width: 100%;"/>' +
+              "</div>" +
+              '<div class="card-footer custom-card-footer custom-flex-footer" style="height: 40px;">' +
+              price_tag +
+              "<div class='offset-4 col-2 " +
+              menu_item_box +
+              "' data-item-code='" +
+              menu_items[field].code +
+              "' data-instance='" +
+              JSON.stringify(menu_items[field].instances) +
+              "' data-menu-instances='" +
+              JSON.stringify(menu_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; opacity: " +
+              opacity +
+              "; pointer-events: " +
+              pointer_event +
+              ";'>" +
+              "<i class='m-l--5 fa " +
+              fa_plus +
+              "'>" +
+              add +
+              "</i>" +
+              "</div>" +
+              "</div>" +
+              "</div>";
+          } else {
+            oos_item =
+              '<div class="card custom-card testimonial-card fadeInRight" id="' +
+              code +
+              '" style="height:100%; pointer-events: ' +
+              pointer_event +
+              ';">';
+
+            name = menu_items[field].name;
+            short_name = truncateString(name, 50);
+            row =
+              '<div class="col-md-6 col-sm-6 col-lg-3 m-t-2">' +
+              oos_item +
+              '<div class="custom-card-no-img-head card-head h-100 ' +
+              add_icon +
+              ' " id="oos' +
+              code +
+              '" style="margin:0px;display:flex; opacity: ' +
+              opacity +
+              ';"' +
+              " data-item-code='" +
+              menu_items[field].code +
+              "' " +
+              " data-menu-instances='" +
+              JSON.stringify(menu_instances) +
+              "' " +
+              " data-name='" +
+              menu_items[field].name +
+              "' " +
+              " data-qty = '" +
+              qty +
+              "' " +
+              " data-price = '" +
+              price +
+              "' " +
+              " data-instance-code = '" +
+              code +
+              "' " +
+              " data-instance = '" +
+              name +
+              "' " +
+              " data-promotion-price = '" +
+              promotion_price +
+              "' " +
+              " data-attributes = '" +
+              JSON.stringify(item_attributes) +
+              "' " +
+              "data-id= '" +
+              JSON.stringify(menu_items[field].attributes) +
+              "'" +
+              " data-options = '" +
+              JSON.stringify(menu_items[field].options) +
+              "' " +
+              " data-opt = '" +
+              JSON.stringify(menu_items[field].options) +
+              "' " +
+              " data-image='' data-toggle='modal' " +
+              " data-target='." +
+              data_target +
+              "' " +
+              " data-item-sets = '" +
+              JSON.stringify(menu_items[field].item_sets) +
+              "'" +
+              " data-instances = '" +
+              JSON.stringify(menu_items[field].instances) +
+              "'>" +
+              '<div class="product_box" style="width:100%;"><span>' +
+              short_name +
+              "<span></div>" +
+              "</div>" +
+              "<div  class='" +
+              add_icon +
+              "' " +
+              " data-item-code='" +
+              menu_items[field].code +
+              "' " +
+              " data-menu-instances='" +
+              JSON.stringify(menu_instances) +
+              "' " +
+              " data-name='" +
+              menu_items[field].name +
+              "' " +
+              " data-qty = '" +
+              qty +
+              "' " +
+              " data-price = '" +
+              price +
+              "' " +
+              " data-instance-code = '" +
+              code +
+              "' " +
+              " data-instance = '" +
+              name +
+              "' " +
+              " data-promotion-price = '" +
+              promotion_price +
+              "' " +
+              " data-attributes = '" +
+              JSON.stringify(item_attributes) +
+              "' " +
+              " data-options = '" +
+              JSON.stringify(menu_items[field].options) +
+              "' " +
+              " data-opt = '" +
+              JSON.stringify(menu_items[field].options) +
+              "' " +
+              " data-image='' data-toggle='" +
+              data_modal +
+              "' " +
+              " data-target='." +
+              data_target +
+              "' " +
+              " data-item-sets = '" +
+              JSON.stringify(menu_items[field].item_sets) +
+              "'" +
+              " data-instances = '" +
+              JSON.stringify(menu_items[field].instances) +
+              "'>" +
+              "</div>" +
+              '<div class="card-footer custom-card-no-img-footer custom-flex-footer" style="height: 50px;">' +
+              price_tag +
+              " <div class='offset-4 col-2 menu_item_no_img_box " +
+              menu_item_box +
+              " ' " +
+              " data-item-code='" +
+              menu_items[field].code +
+              "' " +
+              " data-instance = '" +
+              JSON.stringify(menu_items[field].instances) +
+              "' " +
+              " data-menu-instances='" +
+              JSON.stringify(menu_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; opacity: " +
+              opacity +
+              "; pointer-envents: " +
+              pointer_event +
+              ";'>" +
+              "<i class='m-l--5 fa " +
+              fa_plus +
+              "' >" +
+              add +
+              "</i>" +
+              "</div>" +
+              "</div>" +
+              "</div>" +
+              "</div>";
+          }
+
+          $(".menu_items_list").append(row);
+        }
+        //end instances in menu-items alest 1 instance
       }
+      //end is_sub_item false
+    }
   }
-  $("#add_to_existing_order").on('click', function(e){
-    $(this).attr('disabled', 'disabled');
+  $("#add_to_existing_order").on("click", function (e) {
+    $(this).attr("disabled", "disabled");
     e.preventDefault();
     type = $("#link_type").val();
     $("#oqs_loading_wrapper").show();
-    var ajax_url = 'addorders/add_to_existing_order';
-    var table_type = $('#table_type').text();
-    var table_id    = $('#table_id').text();
-    var customer_id = $('#customer_id').text();
-    var booking_id  = $('#booking_id').text();
-    var sale_id     = $('#sale_id').text();
+    var ajax_url = "addorders/add_to_existing_order";
+    var table_type = $("#table_type").text();
+    var table_id = $("#table_id").text();
+    var customer_id = $("#customer_id").text();
+    var booking_id = $("#booking_id").text();
+    var sale_id = $("#sale_id").text();
     var order_items = JSON.stringify(get_order_item_rows());
-      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,'sale_id': sale_id,'create_type': "create_pay"  };
+    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,
+      sale_id: sale_id,
+      create_type: "create_pay",
+    };
     $.ajax({
       type: "POST",
       url: ajax_url,
       data: params,
       dataType: "json",
-       success:function(result){
-          if (result.status) {
-            window.location.href = "/foodcourt/table/sale/" + sale_id + "/food_court/edit";
-          }
-       }
+      success: function (result) {
+        if (result.status) {
+          window.location.href =
+            "/foodcourt/table/sale/" + sale_id + "/food_court/edit";
+        }
+      },
     });
   });
 });
-  /* Get Item rows */
-function get_order_item_rows(){
+/* Get Item rows */
+function get_order_item_rows() {
   var order_items = [];
-  var item_row    = $('.summary-items tbody tr');
-  $(item_row).each(function(i){
+  var item_row = $(".summary-items tbody tr");
+  $(item_row).each(function (i) {
     var order_item = {};
 
-    order_item.order_item_id      = $(item_row[i]).attr('data-row');
-    order_item.item_instance_code = $(item_row[i]).attr('data-instance-code');
-    order_item.quantity           = $(item_row[i]).children('#item_qty').text();
-//parent id
-    if ($(item_row[i]).attr('data-parent')=="true") {
-      parent_id = $(item_row[i]).attr('data-row');
+    order_item.order_item_id = $(item_row[i]).attr("data-row");
+    order_item.item_instance_code = $(item_row[i]).attr("data-instance-code");
+    order_item.quantity = $(item_row[i]).children("#item_qty").text();
+    //parent id
+    if ($(item_row[i]).attr("data-parent") == "true") {
+      parent_id = $(item_row[i]).attr("data-row");
     }
-    if ($(item_row[i]).attr('data-sub-item')=="true") {
-      order_item.parent_order_item_id = parent_id
+    if ($(item_row[i]).attr("data-sub-item") == "true") {
+      order_item.parent_order_item_id = parent_id;
     }
-//end parent id
-    order_item.options            = $(item_row[i]).attr('data-options');
+    //end parent id
+    order_item.options = $(item_row[i]).attr("data-options");
     order_items.push(order_item);
   });
   return order_items;
diff --git a/app/views/foodcourt/addorders/detail.html.erb b/app/views/foodcourt/addorders/detail.html.erb
index f880ba4f..f7b24640 100644
--- a/app/views/foodcourt/addorders/detail.html.erb
+++ b/app/views/foodcourt/addorders/detail.html.erb
@@ -219,13 +219,12 @@
                         <button type="button" class="btn btn-primary action-btn create col-md-12 m-t-5" id="create_pay_order" disabled="disabled" data-toggle="modal" data-target="#read_modal" style=" height: 50px; width: 100%;">Update Order & Pay</button>
                     <% else %>
                         <% if @sale_id.nil?%>
-                            <button type="button" class="btn btn-primary action-btn create col-md-6 d-inline" id="create_pay_order" disabled="disabled" data-toggle="modal" data-target="#read_modal" style="padding-top:4px !important;padding-bottom:4px !important;"><i class="material-icons" style="font-size:34px;width:34px">attach_money</i></button>
+                            <button type="button" class="btn btn-primary action-btn create col-md-5 d-inline" id="create_pay_order" disabled="disabled" data-toggle="modal" data-target="#payment_modal" style="padding-top:4px !important;padding-bottom:4px !important;"><i class="material-icons" style="font-size:34px;width:34px">attach_money</i></button>
                         <% else %>
-                            <button type="button" class="btn btn-primary action-btn create col-md-6 d-inline" id="add_to_existing_order" disabled="disabled" style="padding-top:4px !important;padding-bottom:4px !important;"><i class="material-icons" style="font-size:34px;width:34px">attach_money</i></button>
+                            <button type="button" class="btn btn-primary action-btn create col-md-5 d-inline" id="add_to_existing_order" disabled="disabled" style="padding-top:4px !important;padding-bottom:4px !important;"><i class="material-icons" style="font-size:34px;width:34px">attach_money</i></button>
                         <% end %>
-                    <button type="button" class="btn btn-warning action-btn create col-md-6 d-inline" id="mmqr" disabled="disabled" style="padding-top:15px !important;padding-bottom:15px !important;">MMQR</button>
+                        <button type="button" class="btn btn-primary w-full action-btn create col-md-7 d-inline" id="create_order" disabled="disabled" style="padding-top:15px !important;padding-bottom:15px !important;">Add Order</button>
                 </div>
-                        <button type="button" class="btn btn-primary w-full action-btn create col-12 d-inline" id="create_order" disabled="disabled" style="padding-top:15px !important;padding-bottom:15px !important;">Add Order</button>
                   <% end %>
               </div>
             </div>
@@ -878,47 +877,4 @@ function create_order(data,paymentMethod = "") {
     },
   });
 }
-
-$('#mmqr').click(function() {
-  // alert("MMQR");
-    const paymentMethod = 'MMQR';
-    const $serverMode = $('#server_mode');
-    const $createOrderBtn = $('#create_order');
-    const $createPayOrderBtn = $('#create_pay_order');
-
-    const params = {
-        order_source: "food_court",
-        order_type: "dine_in",
-        customer_id: $("#customer_id").text(),
-        guest_info: "",
-        table_id: $("#table_id").text(),
-        order_items: JSON.stringify(get_order_item_rows()),
-        create_type: "create_pay",
-    };
-
-    $.ajax({
-        url: '/foodcourt/addorders/create',
-        method: 'POST',
-        contentType: 'application/json',
-        headers: {
-            'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
-        },
-        data: JSON.stringify(params),
-        success: function(result) {
-            const booking_id = result.booking_id;
-            window.location.href = `/foodcourt/${result.sale_id}/qrpay/init`;
-            if ($serverMode.val() !== "cloud" && $("#display_type").val() === "2") {
-                // customer_display_view(null, "reload");
-            }
-        },
-        error: function(xhr) {
-            $('#oqs_loading_wrapper').hide();
-            $createOrderBtn.prop('disabled', false);
-            $createPayOrderBtn.prop('disabled', false);
-
-            const errorMsg = xhr.status ? `Status: ${xhr.status} - ${xhr.statusText}` : "Network error";
-            // swal("Error", errorMsg, "error");
-        }
-    });
-})
 </script>
diff --git a/app/views/layouts/_read_modal.html.erb b/app/views/layouts/_read_modal.html.erb
index 8cdccd6e..07cc6733 100644
--- a/app/views/layouts/_read_modal.html.erb
+++ b/app/views/layouts/_read_modal.html.erb
@@ -1,20 +1,4 @@
-<<<<<<< Updated upstream
-<div class="modal fade" id="read_modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" >
-    <div class="modal-dialog read-dialog" role="document">
-        <div class="modal-content">
-            <div class="modal-header" style="background-color: #54A5AF;padding-top:10px !important;">
-                <h4 class="modal-title" id="defaultModalLabel" style="color:#fff;">Customer Detail</h4>
-            </div>
-            <div class="modal-body">
-                <p style="text-align: center; font-weight: bolder; color: black; font-size: larger">Please tap NFC Card or Scan Code</p>
-                <div style="text-align: center;">
-                    <img src="/image/nfc.png" style="height: 200px"><br>
-                </div>
-            </div>
-            <div class="modal-footer" style="justify-content: center;">
-                <button type="button" class="btn btn-danger" id="close" >Cancel</button>
-            </div>
-=======
+
 <style>
   /* Base Styling */
   .payment-modal {
@@ -23,11 +7,6 @@
     box-shadow: 0 10px 30px rgba(0,0,0,0.15);
   }
 
-  #read_modal{
-      pointer-events: auto;
-      zindex: 1000;
-  }
-
   .payment-header {
     background: #f8fbfc;
     padding: 1.5rem;
@@ -163,7 +142,27 @@
   }
 </style>
 
-<div class="modal fade payment-modal" id="read_modal" role="dialog">
+<div class="modal fade" id="read_modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" >
+    <div class="modal-dialog read-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header" style="background-color: #54A5AF;padding-top:10px !important;">
+                <h4 class="modal-title" id="defaultModalLabel" style="color:#fff;">Customer Detail</h4>
+            </div>
+            <div class="modal-body">
+                <p style="text-align: center; font-weight: bolder; color: black; font-size: larger">Please tap NFC Card or Scan Code</p>
+                <div style="text-align: center;">
+                    <img src="/image/barcode.png" style="height: 200px">
+                    <img src="/image/nfc.png" style="height: 200px"><br>
+                </div>
+            </div>
+            <div class="modal-footer" style="justify-content: center;">
+                <button type="button" class="btn btn-danger" id="close" >Cancel</button>
+            </div>
+        </div>
+    </div>
+</div>
+
+<div class="modal fade payment-modal" id="payment_modal" tabindex="-1" role="dialog">
   <div class="modal-dialog" role="document">
     <div class="modal-content">
         <div class="payment-header">
@@ -179,87 +178,94 @@
 
         <div class="text-center text-bold text-muted">
             (Or)
->>>>>>> Stashed changes
         </div>
+
+        <!-- Read NFC Card -->
+        <button type="button" id="read_nfc" data-toggle="modal" data-target="#read_modal">
+            <div class="payment-card disabled" id="read_nfc" style="grid-column: span 2;">
+              <div class="payment-icon text-center">
+                  <img src="/image/nfc.png" width="100" height="100" />
+              </div>
+              <div class="payment-label text-center">Tap your NFC-enabled card or device</div>
+            </div>
+        </button>
+
+      </div>
+
+      <div class="modal-footer">
+        <button type="button" class="btn-cancel" id="close">
+          Cancel
+        </button>
+      </div>
     </div>
+  </div>
 </div>
 
-<style>
-  #read_modal {
-  text-align: center;
-  padding: 0!important;
-}
+<script defer type="text/javascript">
+document.addEventListener('DOMContentLoaded', function () {
+    const paymentCards = document.querySelectorAll('.payment-card:not(.disabled)');
+    const cancelButton = document.querySelector('.btn-cancel');
 
-  #read_modal:before {
-    display: inline-block;
-    vertical-align: middle;
-    content: " ";
-    height: 100%;
-  }
+    $("#read_nfc").on('click', function() {
+      $('#payment_modal').css('display', 'none');
+      $('.modal-backdrop.fade').css('display', 'none');
+    });
 
-  .read-dialog {
-    display: inline-block;
-    text-align: left;
-    vertical-align: middle;
-  }
-</style>
 
-<script>
-  $('#mmqr').click(function() {
-    // alert("MMQR");
+    cancelButton.addEventListener('click', function () {
+        console.log("Action: Cancel payment.");
 
-            const paymentMethod = 'MMQR';
-            const $serverMode = $('#server_mode');
-            const $createOrderBtn = $('#create_order');
-            const $createPayOrderBtn = $('#create_pay_order');
+        paymentCards.forEach(c => c.classList.remove('active'));
 
-            const params = {
-                order_source: "food_court",
-                order_type: "dine_in",
-                customer_id: $("#customer_id").text(),
-                guest_info: "",
-                table_id: $("#table_id").text(),
-                order_items: JSON.stringify(get_order_item_rows()),
-                create_type: "create_pay",
-            };
+        styleProceedButton(false);
+    });
 
-            $.ajax({
-                url: '/foodcourt/addorders/create',
-                method: 'POST',
-                contentType: 'application/json',
-                headers: {
-                    'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
-                },
-                data: JSON.stringify(params),
-                success: function(result) {
-                    const booking_id = result.booking_id;
-                    window.location.href = `/foodcourt/${result.sale_id}/qrpay/init`;
-                    if ($serverMode.val() !== "cloud" && $("#display_type").val() === "2") {
-                        // customer_display_view(null, "reload");
-                    }
-                },
-                error: function(xhr) {
-                    $('#oqs_loading_wrapper').hide();
-                    $createOrderBtn.prop('disabled', false);
-                    $createPayOrderBtn.prop('disabled', false);
+    const disabledNfcCard = document.querySelector('.payment-card.disabled');
 
-                    const errorMsg = xhr.status ? `Status: ${xhr.status} - ${xhr.statusText}` : "Network error";
-                    swal("Error", errorMsg, "error");
+    document.querySelector('.payment-card#dynamic_qr').addEventListener('click', function() {
+      initDynamicQrPay();
+    });
+
+    function initDynamicQrPay() {
+        const paymentMethod = 'MMQR';
+        const $serverMode = $('#server_mode');
+        const $createOrderBtn = $('#create_order');
+        const $createPayOrderBtn = $('#create_pay_order');
+
+        const params = {
+            order_source: "food_court",
+            order_type: "dine_in",
+            customer_id: $("#customer_id").text(),
+            guest_info: "",
+            table_id: $("#table_id").text(),
+            order_items: JSON.stringify(get_order_item_rows()),
+            create_type: "create_pay",
+        };
+
+        $.ajax({
+            url: '/foodcourt/addorders/create',
+            method: 'POST',
+            contentType: 'application/json',
+            headers: {
+                'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
+            },
+            data: JSON.stringify(params),
+            success: function(result) {
+                const booking_id = result.booking_id;
+                window.location.href = `/foodcourt/${result.sale_id}/qrpay/init`;
+                if ($serverMode.val() !== "cloud" && $("#display_type").val() === "2") {
+                    // customer_display_view(null, "reload");
                 }
-            });
-  })
+            },
+            error: function(xhr) {
+                $('#oqs_loading_wrapper').hide();
+                $createOrderBtn.prop('disabled', false);
+                $createPayOrderBtn.prop('disabled', false);
 
-  // function get_order_item_rows(){
-  //   var order_items = [];
-  //   var item_row    = $('.summary-items tbody tr');
-  //   $(item_row).each(function(i){
-  //     var order_item = {};
-
-  //     // order_item.item_name    = $(item_row[i]).attr('data-item-name');
-  //     order_item.item_instance_code = $(item_row[i]).attr('data-instance-code');
-
-  //     order_items.push(order_item);
-  //   });
-  //   return order_items;
-  // }
+                const errorMsg = xhr.status ? `Status: ${xhr.status} - ${xhr.statusText}` : "Network error";
+                swal("Error", errorMsg, "error");
+            }
+        });
+    }
+  });
 </script>