443 lines
22 KiB
Plaintext
Executable File
443 lines
22 KiB
Plaintext
Executable File
<%= stylesheet_link_tag 'addorder', media: 'all', 'data-turbolinks-track': 'reload' %>
|
|
<%= javascript_include_tag 'addorder', 'data-turbolinks-track': 'reload' %>
|
|
<div id="oqs_loading_wrapper" style="display:none;">
|
|
<div id="oqs_loading"></div>
|
|
</div>
|
|
|
|
<% type = request.path_info.include?('quick_service')%>
|
|
<input type="hidden" name="type" id="type" value="<%=type%>">
|
|
<div class="row m-t--20">
|
|
<div class="col-lg-2 col-md-2 col-sm-2">
|
|
<ul class="nav nav-tabs flex-column" role="tablist" id="ul-navbar">
|
|
<% @menu.each do |menu| %>
|
|
<% if !menu.valid_time.nil? %>
|
|
<% if menu.menu_category_id.nil? %>
|
|
<!--if type quick_service or cashier for table -->
|
|
<% if type %>
|
|
<% if !menu.code.include? "SPL" %>
|
|
<li class="nav-item menu_category sub_click" data-id="<%=menu.id%>">
|
|
<p class="hidden menu-id"><%= menu.id %></p>
|
|
<a class="nav-link" data-toggle="tab" href="" role="tab"> <%= menu.name%>
|
|
<ul class=" sub_category_list hidden fadeInTop animated" id="sub_category_list">
|
|
</ul>
|
|
</a>
|
|
</li>
|
|
<% end%>
|
|
<!-- else quick_service or cashier for table -->
|
|
<% else %>
|
|
<% if @table.get_current_checkout_booking.nil? %>
|
|
<% if !menu.code.include? "SPL" %>
|
|
<li class="nav-item menu_category sub_click" data-id="<%=menu.id%>">
|
|
<p class="hidden menu-id"><%= menu.id %></p>
|
|
<a class="nav-link" data-toggle="tab" href="" role="tab"> <%= menu.name%>
|
|
<ul class=" sub_category_list hidden fadeInTop animated" id="sub_category_list">
|
|
</ul>
|
|
</a>
|
|
</li>
|
|
<% end%>
|
|
<% else %>
|
|
<li class="nav-item menu_category sub_click" data-id="<%=menu.id%>">
|
|
<p class="hidden menu-id"><%= menu.id %></p>
|
|
<a class="nav-link" data-toggle="tab" href="" role="tab"> <%= menu.name%>
|
|
<ul class=" sub_category_list hidden fadeInTop animated" id="sub_category_list">
|
|
</ul>
|
|
</a>
|
|
</li>
|
|
<% end%>
|
|
<!-- end quick_service or cashier for table -->
|
|
<% end %>
|
|
<% end%>
|
|
<% end %>
|
|
<%end %>
|
|
|
|
<li class="nav-item product" data-ref="<%= origami_get_all_product_path %>">
|
|
<a class="nav-link" data-toggle="tab" href="" role="tab">Products</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-md-7 col-lg-7 col-sm-7 m-t-10">
|
|
<div class="card-columns custom-card-columns menu_items_list" style="column-gap: 10px;">
|
|
<!-- append data -->
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-3 col-lg-3 col-sm-3 m-t-10">
|
|
<button type="button" class="btn btn-block btn-default waves-effect" id='back'>
|
|
<i class="material-icons">reply</i>
|
|
Back
|
|
</button>
|
|
<br>
|
|
<div class="card-header" style="padding: 0.5rem 0.25rem">
|
|
<% if type %>
|
|
<div class="row clearfix">
|
|
<div class="col-md-6 ">
|
|
<strong id="order-title" class="font-14">ORDER DETAILS </strong>
|
|
</div>
|
|
<div class="col-md-3">Select</div>
|
|
<div class="col-md-3 m-t--5">
|
|
<a class="btn btn-block bg-blue waves-effect select_table" data-toggle="modal" data-target="#TableModal"> Select </a>
|
|
<input type="hidden" name="table_id" value="" id="table_id">
|
|
</div>
|
|
</div>
|
|
<% else %>
|
|
<div>
|
|
<strong id="order-title" class="font-14">ORDER DETAILS </strong>| <span class="font-14">Table-<%=@table.name%></span>
|
|
<p class="hidden" id="table_id"><%=@table_id%></p>
|
|
<p class="hidden" id="table_type"><%=@table.type%></p>
|
|
<p class="hidden" id="booking_id"><%=@booking_id%></p>
|
|
<p class="hidden" id="customer_id"><%=@customer ? @customer.customer_id : ''%></p>
|
|
</div>
|
|
<% end%>
|
|
|
|
</div>
|
|
<div class="card-block">
|
|
<div class="card-text" id="order-detail-slimscroll" data-height="180">
|
|
<table class="table table-striped summary-items" id="order-items-table" >
|
|
<thead>
|
|
<tr>
|
|
<th>#</th>
|
|
<th class="item-name">Items</th>
|
|
<th class="item-qty">QTY</th>
|
|
<th class="item-attr">Price</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="font-13" >
|
|
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="card-footer custom-card-footer">
|
|
|
|
<table class="table" id="order-charges-table" border="0">
|
|
<tr>
|
|
<td class="charges-name"><strong>Sub Total:</strong></td>
|
|
<td class="item-attr"><strong id="sub_total">0.00</strong></td>
|
|
</tr>
|
|
</table>
|
|
|
|
<% if type %>
|
|
<div class="row clearfix hidden">
|
|
<div class="col-md-4 ">
|
|
<strong id="order-title" class="font-14">Customer</strong>
|
|
</div>
|
|
<!-- <div class="col-md-3">Table -</div> -->
|
|
<div class="col-md-8">
|
|
<select class="form-control m-t--5" id="customer_id" name="customer_id" >
|
|
<option value="">Select Customer</option>
|
|
<% @customer.each do |cus| %>
|
|
<option <%=(cus.customer_id == 'CUS-000000000001')? 'selected':''%> value="<%= cus.customer_id %>"><%= cus.name %></option>
|
|
<%end %>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<button type="button" class="btn btn-primary btn-block create" id="create_pay_order" disabled="disabled">Create Order & Pay</button>
|
|
<% end %>
|
|
<button type="button" class="btn btn-primary btn-block create m-t-5" id="create_order" disabled="disabled">Create Order</button>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Modal -->
|
|
<div class=" modal" id="sx_itemModal" tabindex="-1" role="dialog" aria-labelledby="sx_itemModalLabel" aria-hidden="true" style="">
|
|
<div class="modal-dialog custom-modal-dialog" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<button type="button" class="close" id="close" data-dismiss="modal" aria-hidden="true">×</button>
|
|
<h4 class="modal-title"></h4>
|
|
</div>
|
|
<div class="modal-body">
|
|
<table width="100%" class="table table-striped">
|
|
<thead>
|
|
<tr>
|
|
<th style="">Item Name</th>
|
|
<th style="">Quantity</th>
|
|
<th></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td class="item_name" id="modal-item-name"></td>
|
|
<td>
|
|
<input type="number" name="qty" class="form-control col-md-12 input-number" id="modal-qty" value="" min="1" max="100">
|
|
</td>
|
|
<td>
|
|
<button type="button" id="remove" class="btn btn-danger" data-dismiss="modal">Remove</button>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<div class="row">
|
|
<div class="col-md-5">
|
|
<button type="button" class="btn btn-default" data-dismiss="modal" id="close">Close</button>
|
|
</div>
|
|
<div class="col-md-5">
|
|
<button type="button" class="btn btn-primary " data-dismiss="modal" id="save">Update</button>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Menu Item modal -->
|
|
|
|
<div class="item-modal modal sx_item_detailModal" id="sx_item_detailModal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog custom-modal-dialog modal-lg">
|
|
<div class="modal-content">
|
|
<div class="modal-header" style="background-color: #54A5AF;padding-top:10px !important;">
|
|
<h4 class="modal-title" style="color:#fff;" id="title_name"></h4>
|
|
<button type="button" class="close" id="close" data-dismiss="modal" aria-hidden="true" style="font-size: 20px;color:#fff;">×</button>
|
|
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="row no-set-item">
|
|
<div class="col-md-5">
|
|
<p style="text-align: center;" id="modal_box_img"></p>
|
|
|
|
|
|
<!-- <label class="col-md-6" style="margin-top:5px">Quantity</label>
|
|
<input type="number" name="qty" class="form-control col-md-5 input-number change_qty" id="change_qty" value="" min="1" max="100"> -->
|
|
|
|
<div class="input-group">
|
|
<span class="input-group-btn">
|
|
<button type="button" class="btn btn-danger btn-number" value="-" id="minus">
|
|
<i class="material-icons">remove</i>
|
|
|
|
</button>
|
|
</span>
|
|
<input type="text" value="1" id="count" class="change_qty keypress_qty form-control col-md-12 ">
|
|
<span class="input-group-btn">
|
|
<button type="button" class="btn btn-success btn-number" value="+" id="plus">
|
|
<i class="material-icons">add</i>
|
|
</button>
|
|
</span>
|
|
</div>
|
|
|
|
<p class="hidden" id="unit_price"></p>
|
|
<p class="hidden" id="instance_code"></p>
|
|
<p class="hidden" id="instance_name"></p>
|
|
<p class="hidden" id="promotion_price"></p>
|
|
<p class="hidden" id="item_instances"></p>
|
|
<p class="hidden" id="item_code"></p>
|
|
</div>
|
|
<div class="col-md-7 item-detail">
|
|
<h5>Attributes</h5>
|
|
<div class="attributes-list">
|
|
</div>
|
|
<hr>
|
|
<h5>Options</h5>
|
|
<div class="options-list">
|
|
</div>
|
|
<hr>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<div class="mr-auto">
|
|
<h4 class=" pull-left">Total : <span id="total_price"></span></h4>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-4">
|
|
<button type="button" class="btn btn-default " data-dismiss="modal" id="close">Close</button>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<button type="button" class="btn btn-primary add_to_order " data-dismiss="modal" id="add_to_order">Add to Order</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!-- Large modal -->
|
|
<div class=" modal sx_item_set_detailModal" id="sx_item_set_detailModal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" >
|
|
<div class="modal-dialog custom-modal-dialog modal-lg">
|
|
<div class="modal-content">
|
|
<div class="modal-header" style="background-color: #54A5AF;padding-top:10px !important;">
|
|
<h4 class="modal-title" style="color:#fff;" id="set_name"></h4>
|
|
<button type="button" class="close" id="close" data-dismiss="modal" aria-hidden="true" style="font-size: 20px;color:#fff;">×</button>
|
|
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="row set-item">
|
|
<div class="col-md-4">
|
|
<p style="text-align: center;"> <%= image_tag "logo.png" ,width: '', height: '', :id => 'logo' %></p>
|
|
<!-- <div class="form-group">
|
|
<label class="col-md-6" style="margin-top:5px">Quantity</label>
|
|
<input type="number" name="qty" class="form-control col-md-5 input-number change_qty" id="set_change_qty" value="" min="1" max="100">
|
|
</div> -->
|
|
|
|
<div class="input-group">
|
|
<span class="input-group-btn">
|
|
<button type="button" class="btn btn-danger btn-number" value="-" id="set_minus">
|
|
<i class="material-icons">remove</i>
|
|
</button>
|
|
</span>
|
|
<input type="text" value="1" id="set_count" class="set_change_qty keypress_qty form-control col-md-12 ">
|
|
<span class="input-group-btn">
|
|
<button type="button" class="btn btn-success btn-number" value="+" id="set_plus">
|
|
<i class="material-icons">add</i>
|
|
</button>
|
|
</span>
|
|
</div>
|
|
|
|
<p class="hidden" id="set_unit_price"></p>
|
|
<p class="hidden" id="set_instance_code"></p>
|
|
<p class="hidden" id="set_instance_name"></p>
|
|
<p class="hidden" id="set_promotion_price"></p>
|
|
<p class="hidden" id="set_item_instances"></p>
|
|
<p class="hidden" id="set_item_code"></p>
|
|
<p></p>
|
|
|
|
<div class="options-list">
|
|
</div>
|
|
|
|
</div>
|
|
<div class="col-md-8">
|
|
<div class="instance-list row"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<div class="mr-auto">
|
|
<h4 class=" pull-left">Total : <span id="set_total_price"></span></h4>
|
|
</div>
|
|
|
|
<div class="row">
|
|
|
|
<div class="col-md-4">
|
|
<button type="button" class="btn btn-default" data-dismiss="modal" id="close">Close</button>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<button type="button" class="btn btn-primary set_order" data-dismiss="modal" id="set_order">Add to Order</button>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal fade" id="TableModal" tabindex="-1" role="dialog">
|
|
<div class="modal-dialog" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header" style="margin-top: -1rem;">
|
|
<!-- <h4 class="modal-title" id="TableModalLabel">Select Table</h4> -->
|
|
<button type="button" class="close" id="close" data-dismiss="modal" aria-hidden="true" style="font-size: 20px;">×</button>
|
|
</div>
|
|
<div class="modal-body" style="margin-top: -0.5rem;">
|
|
<h5>Table</h5>
|
|
<div class="card-columns" style="column-count: 7;">
|
|
<% @tables.each do |table| %>
|
|
<% if table.status == 'occupied' %>
|
|
<% if table.get_booking.nil? %>
|
|
<% if table.get_checkout_booking.nil? %>
|
|
<div class="card tables red text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
|
|
<% else %>
|
|
<div class="card tables orange text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
|
|
<% end %>
|
|
<div class="card-block">
|
|
<%= table.name %>
|
|
<!-- <span class="float-right font-12 new_text_<%= table.id %>"> billed</span>
|
|
<div style="font-size:12px;"></div> -->
|
|
</div>
|
|
</div>
|
|
<% else %>
|
|
<% if table.get_checkout_booking.nil? %>
|
|
<div class="card tables blue text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
|
|
<% else %>
|
|
<div class="card tables orange text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
|
|
<% end %>
|
|
<div class="card-block">
|
|
<%= table.name %>
|
|
<span class="float-right font-12 new_text_<%= table.id %>"> new</span>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
<% else %>
|
|
<div class="card tables green text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
|
|
<div class="card-block">
|
|
<%= table.name %>
|
|
<span class="float-right font-12 new_text_<%= table.id %> hide"> new</span>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
<% end %>
|
|
</div>
|
|
<hr>
|
|
<h5>Room</h5>
|
|
<div class="card-columns" style="column-count: 7;">
|
|
<% @rooms.each do |table| %>
|
|
<% if table.status == 'occupied' %>
|
|
<% if table.get_booking.nil? %>
|
|
<% if table.get_checkout_booking.nil? %>
|
|
<div class="card tables red text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
|
|
<% else %>
|
|
<div class="card tables orange text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
|
|
<% end %>
|
|
<div class="card-block">
|
|
<%= table.name %>
|
|
<!-- <span class="float-right font-12 new_text_<%= table.id %>"> billed</span>
|
|
<div style="font-size:12px;"></div> -->
|
|
</div>
|
|
</div>
|
|
<% else %>
|
|
<% if table.get_checkout_booking.nil? %>
|
|
<div class="card tables blue text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
|
|
<% else %>
|
|
<div class="card tables orange text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
|
|
<% end %>
|
|
<div class="card-block">
|
|
<%= table.name %>
|
|
<span class="float-right font-12 new_text_<%= table.id %>"> new</span>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
<% else %>
|
|
<div class="card tables green text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
|
|
<div class="card-block">
|
|
<%= table.name %>
|
|
<span class="float-right font-12 new_text_<%= table.id %> hide"> new</span>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer p-r-30">
|
|
<button type="button" class="btn btn-link btn-danger waves-effect" data-dismiss="modal">CLOSE</button>
|
|
|
|
<button type="button" class="btn btn-link bg-blue waves-effect confirm_table" data-dismiss="modal">Confirm</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
cashier_type = "cashier"
|
|
$(document).ready(function () {
|
|
$(".tables").on('click', function () {
|
|
$('.tables').css('background-color','');
|
|
$('.tables').removeClass('purple')
|
|
var dining_id = $(this).attr("data-id");
|
|
var name = $(this).attr("data-name");
|
|
$(this).css('background-color','purple');
|
|
$(this).addClass('purple')
|
|
$('.confirm_table').attr("data-id",dining_id)
|
|
$('.confirm_table').attr("data-name",name)
|
|
|
|
});
|
|
$(".confirm_table").on('click', function () {
|
|
var dining_id = $(this).attr("data-id");
|
|
var name = $(this).attr("data-name");
|
|
$('#table_id').val(dining_id)
|
|
$('.select_table').text(name)
|
|
|
|
});
|
|
});
|
|
</script> |