【民泊5.1】【MacOSX】ホームページ

ホームページを更新します。


app\controllers\pages_controller.rb

class PagesController < ApplicationController
  def home
      @rooms = Room.where(active: true).limit(3)
  end
  
  def search

  end  

end

app\views\pages\home.html.erb

<br/>
<br/>
<%= form_for root_path, method: :get do %>
  <div class="row">
    <div class="col-md-6">
      <%= text_field_tag :search, params[:search], placeholder: "どちらのお部屋をおさがしですか？", class: "form-control" %>
    </div>
    <div class="col-md-3">
      <%= text_field_tag :start_date, params[:start_date], placeholder: "チェックイン", readonly: true, class: "form-control datepicker" %>
    </div>
    <div class="col-md-3">
      <%= text_field_tag :end_date, params[:end_date], placeholder: "チェックアウト", readonly: true, class: "form-control datepicker" %>
    </div>
  </div>
  <br/><br/>

  <div class="row">
    <div class="col-md-offset-4 col-md-4">
      <%= submit_tag "検索", class: "btn btn-normal btn-block" %>
    </div>
  </div>
<% end %>

<br/><hr/><br/>

<!-- ホーム -->
<div><h3>お部屋</h3></div>
<br/>

<div class="row">
  <% @rooms.each do |room| %>
      <div class="col-md-4">
        <div class="panel panel-default">
          <div class="panel-heading preview">
            <%= image_tag room.cover_photo(:medium) %>
          </div>
          <div class="panel-body">
            <%= link_to room.listing_name, room %>
          </div>
        </div>
      </div>
  <% end %>
</div>

<script>
  $('#start_date').datepicker({
    dateFormat: 'dd-mm-yy',
    minDate: 0,
    maxDate: '3m',
    onSelect: function(selected) {
      $('#end_date').datepicker("option", "minDate", selected);
      $('#end_date').attr("disabled", false);
    }
  });

  $('#end_date').datepicker({
    dateFormat: 'dd-mm-yy',
    minDate: 0,
    maxDate: '3m',
    onSelect: function(selected) {
      $('#start_date').datepicker("option", "maxDate", selected);
    }
  });

</script>

ブラウザ確認
http://localhost:3000/

ホームページ