property_hire/app/views/admin/property_hires/show.html.erb

<%= csrf_meta_tag %>
<div class="pull-right">
  <a href="?type=" class="btn <%= 'active' if params[:type] != 'Calendar' %>">Table</a>
  <a href="?type=Calendar" class="btn <%= 'active' if params[:type] == 'Calendar' %>">Calendar</a>
</div>
<hr>
<% if params[:type] == "Calendar" %>
  <style type="text/css">
    .row{
      margin-left: 0;
    }
    .modal-content {
      position: relative;
      background-color: #fff;
      -webkit-background-clip: padding-box;
      background-clip: padding-box;
      border: 1px solid #999;
      border: 1px solid rgba(0,0,0,0.2);
      border-radius: 6px;
      outline: 0;
      -webkit-box-shadow: 0 3px 9px rgb(0 0 0 / 50%);
      box-shadow: 0 3px 9px rgb(0 0 0 / 50%);
    }
    @media (min-width:768px){
      .modal-content {
        -webkit-box-shadow: 0 5px 15px rgb(0 0 0 / 50%);
        box-shadow: 0 5px 15px rgb(0 0 0 / 50%);
      }
      .col-md-4 > * {
        padding: 0 0.5em;
      }
      .col-md-8 > * {
        padding: 0 1em;
      }
      .col-md-4{
        float: left;
        width: 33.3%;
      }
      .col-md-8{
        float: left;
        width: 66.6%;
      }
    }
  </style>
  <%= content_for :page_specific_css do %>
    <% ["basic/bootstrap-datetimepicker.css","property_hire_fullcalendar.css","property_hire_calendar"].each do |css| %>
      <%= stylesheet_link_tag css %>
    <% end %>
  <% end %>
  <script src="https://polyfill.io/v3/polyfill.min.js?features=Intl.DateTimeFormat,Intl.DateTimeFormat.~locale.en,Intl.NumberFormat.~locale.en"></script>
  <script type="text/javascript" src="/assets/property_hire_fullcalendar.min.js"></script>
  <script type="text/javascript" src="/assets/property_hire_calendar_frontend.js"></script>
  <div id="orbit_calendar">
    <div id="sec1">
      <div class="btn-toolbar" id="navigation">
        <div id="calendar-nav">
          <div class="btn-group">
            <button class="btn btn-default btn-sm" id="prev_month_btn">
              <i class="icon-chevron-left"></i>
            </button>
            <button class="btn btn-default btn-sm" id="next_month_btn">
              <i class="icon-chevron-right"></i>
            </button>
            <button class="btn btn-default btn-sm" id="today_btn">Today</button>
          </div>
        </div>
      </div>
      <div class="form-inline" id="range_selection"></div>
    </div>
    <div id='sec3' class="btn-toolbar">
      <div class="btn-group calendar_mode">
        <button class="btn btn-default mode_switch btn-sm" data-mode="timeGridDay" >day</button>
        <button class="btn btn-default mode_switch btn-sm" data-mode="timeGridWeek" >week</button>
        <button class="btn btn-default mode_switch btn-sm" data-mode="dayGridMonth" >month</button>
        <button class="btn btn-default active mode_switch btn-sm" data-mode="agenda" >agenda</button>
      </div>
      <button id="refresh_btn" class="btn btn-default btn-sm">
        <i class="icons-cycle"></i>
      </button>
    </div>
    <div id="view_holder">
      <h3 id="current_title" class="current_day_title"></h3>
      <div id="calendar"></div>
      <div id="calendar_agenda"></div>
    </div>
  </div>
  <div id="event_quick_view" class="modal" style="width: 300px; display:none; margin:0 0 0 0;"></div>
  <div id="calendar-loading"></div>
  <script type="text/javascript">
    var property_id = "<%= @property.id.to_s %>";
    var calendar = new Calendar("#calendar",property_id,"agenda",false);
  </script>
<% else %>
<table class="table main-list">
  <thead>
    <tr class="sort-header">
    <% @table_fields.each do |f| %>
      <%= thead(f) %>
    <% end %>
    </tr>
  </thead>
  <tbody>
  <% @bookings.each do |p_hire| %>
    <tr>
      <td>
      	<%= p_hire.hirer_name %>
      </td>
      <td>
        <%= p_hire.reason_for_hire.to_s + p_hire.tmp_reason_for_hire %>
      </td>
      <td>
        <%= p_hire.hiring_person_number %>
      </td>
      <td>
        <%= p_hire.period %>
      </td>
      <td>
      	<% if p_hire.passed %>
      		<span class="badge badge-success">Yes</span>
      	<% else %>
      		<span class="badge badge-important">No</span>
      	<% end %>
      </td>
      <td>
        <% if can_edit_or_delete?(p_hire.property) %>
          <a href="<%= edit_hire_admin_property_hire_path(p_hire) %>" class="btn btn-info">Edit</a>
          <a href="<%= show_booking_details_admin_property_hire_path(p_hire, :page => params[:page]) %>" class="btn btn-info">View</a>
          <% if p_hire.passed %>
            <a href="<%= pass_booking_admin_property_hire_path(p_hire, :page => params[:page], :status => "reject", :ref => "index") %>" class="btn btn-warning">Reject</a>
          <% else %>
            <a href="<%= pass_booking_admin_property_hire_path(p_hire, :page => params[:page], :status => "accept", :ref => "index") %>" class="btn btn-success">Accept</a>
          <% end %>
          <a href="<%= delete_booking_details_admin_property_hire_path(p_hire, :page => params[:page]) %>" class="btn btn-danger" data-method="delete" data-confirm="Are you sure?">Delete</a>
        <% end %>
      </td>
    </tr>
  <% end %>
  </tbody>
</table>
<div class="bottomnav clearfix">
  <a href="<%= admin_property_hires_path %>" class="btn btn-warning">Back</a>
  <%= content_tag(:div, paginate(@bookings), class: "pagination pagination-centered") %>
</div>
<% end %>