109 lines
3.5 KiB
Plaintext
109 lines
3.5 KiB
Plaintext
<div class="row">
|
|
<div class="col-lg-11 col-md-11 col-sm-11">
|
|
<ul class="nav nav-tabs" role="tablist">
|
|
<li class="nav-item">
|
|
<a class="nav-link active" data-toggle="tab" href="#table" role="tab">Tables</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" data-toggle="tab" href="#room" role="tab">Rooms</a>
|
|
</li>
|
|
</ul>
|
|
<div class="tab-content" style="max-height:650px; overflow:auto">
|
|
|
|
<div class="tab-pane active" id="table" role="tabpanel" style="max-height:; overflow:auto">
|
|
<% @tables.each do |zone| %>
|
|
<h3>Zone : <%=zone.zone.name%></h3>
|
|
<div class="card-columns" style="padding-top:10px; column-gap: 2.2rem;">
|
|
|
|
<% @all_table.each do |table| %>
|
|
<% if zone.zone_id == table.zone_id %>
|
|
<div class="card click_table <%= table.status=="available" ? "available" : "occupied"%>" data-id = "<%= table.id %>">
|
|
<div class="card-block">
|
|
<p class="hidden table-status"><%= table.status %></p>
|
|
<p style="text-align: center"><%= table.name %></p>
|
|
<p style="text-align: center">Seat : <%= table.seater %></p>
|
|
</div>
|
|
</div>
|
|
<% end %> <% end %>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
|
|
<div class="tab-pane" id="room" role="tabpanel" style="max-height:; overflow:auto">
|
|
<% @rooms.each do |zone| %>
|
|
<h3>Zone : <%=zone.zone.name%></h3>
|
|
<div class="card-columns" style="padding-top:10px; column-gap: 2.2rem;">
|
|
|
|
<% @all_room.each do |room| %>
|
|
<% if zone.zone_id == room.zone_id %>
|
|
<div class="card click_table <%= room.status=="available" ? "available" : "occupied"%>" data-id = "<%= room.id %>">
|
|
<div class="card-block">
|
|
<p class="hidden table-status"><%= room.status %></p>
|
|
<p style="text-align: center"><%= room.name %></p>
|
|
<p style="text-align: center">Seat : <%= room.seater %></p>
|
|
</div>
|
|
</div>
|
|
<% end %> <% end %>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-lg-1 col-md-1 col-sm-1">
|
|
<button type="button" class="btn btn-primary btn-block" id='back' >Back</button>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
$(document).on('click',".click_table",function(){
|
|
|
|
var dining_id = $(this).attr('data-id');
|
|
var status = $(this).find(".table-status").text();
|
|
|
|
if (status == "available") {
|
|
$.confirm({
|
|
title: 'Confirmation !',
|
|
content: 'Are you sure to assign this table',
|
|
buttons: {
|
|
confirm: {
|
|
text: 'Ok',
|
|
btnClass: 'btn-green',
|
|
action: function(){
|
|
window.location.href = '/origami/addorders/'+dining_id;
|
|
}
|
|
}
|
|
}
|
|
});
|
|
} else {
|
|
$.confirm({
|
|
title: 'Alert!',
|
|
content: 'You cannot assign this table',
|
|
buttons: {
|
|
confirm: {
|
|
text: 'Ok',
|
|
btnClass: 'btn-red',
|
|
}
|
|
}
|
|
});
|
|
}
|
|
})
|
|
</script>
|
|
<style type="text/css">
|
|
.card-columns {
|
|
-webkit-column-count:5;
|
|
-moz-column-count:5;
|
|
column-count:5;
|
|
}
|
|
|
|
.occupied{
|
|
color: #fff !important;
|
|
background-color: red;
|
|
}
|
|
.available{
|
|
color: #fff !important;
|
|
background-color: #009900;
|
|
}
|
|
|
|
</style>
|